/* Minification failed. Returning unminified contents.
(1069,20): run-time error CSS1039: Token not allowed after unary operator: '-color-background-tertiary'
(6633,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '&'
 */
/*
 * @version 16.4.5
 * @repo http://stash.paylocity.com/projects/CIT/repos/tangelo/browse?at=refs%2Fheads%2Fmaster
 * @contact ui/ux team at Paylocity via citrusfeedback@paylocity.com or through slack
 */
/* BEGIN Light */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-Light.eot');
  src: url('fonts/OpenSans/OpenSans-Light.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-Light.woff') format('woff'), url('fonts/OpenSans/OpenSans-Light.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-Light.svg#OpenSansLight') format('svg');
  font-weight: 300;
  font-style: normal;
}
/* END Light */
/* BEGIN Light Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-LightItalic.eot');
  src: url('fonts/OpenSans/OpenSans-LightItalic.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-LightItalic.woff') format('woff'), url('fonts/OpenSans/OpenSans-LightItalic.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-LightItalic.svg#OpenSansLightItalic') format('svg');
  font-weight: 300;
  font-style: italic;
}
/* END Light Italic */
/* BEGIN Regular */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-Regular.eot');
  src: url('fonts/OpenSans/OpenSans-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-Regular.woff') format('woff'), url('fonts/OpenSans/OpenSans-Regular.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-Regular.svg#OpenSansRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* END Regular */
/* BEGIN Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-Italic.eot');
  src: url('fonts/OpenSans/OpenSans-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-Italic.woff') format('woff'), url('fonts/OpenSans/OpenSans-Italic.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-Italic.svg#OpenSansItalic') format('svg');
  font-weight: normal;
  font-style: italic;
}
/* END Italic */
/* BEGIN Semibold */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-Semibold.eot');
  src: url('fonts/OpenSans/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-Semibold.woff') format('woff'), url('fonts/OpenSans/OpenSans-Semibold.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-Semibold.svg#OpenSansSemibold') format('svg');
  font-weight: 600;
  font-style: normal;
}
/* END Semibold */
/* BEGIN Semibold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-SemiboldItalic.eot');
  src: url('fonts/OpenSans/OpenSans-SemiboldItalic.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-SemiboldItalic.woff') format('woff'), url('fonts/OpenSans/OpenSans-SemiboldItalic.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-SemiboldItalic.svg#OpenSansSemiboldItalic') format('svg');
  font-weight: 600;
  font-style: italic;
}
/* END Semibold Italic */
/* BEGIN Bold */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-Bold.eot');
  src: url('fonts/OpenSans/OpenSans-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-Bold.woff') format('woff'), url('fonts/OpenSans/OpenSans-Bold.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-Bold.svg#OpenSansBold') format('svg');
  font-weight: bold;
  font-style: normal;
}
/* END Bold */
/* BEGIN Bold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url('fonts/OpenSans/OpenSans-BoldItalic.eot');
  src: url('fonts/OpenSans/OpenSans-BoldItalic.eot?#iefix') format('embedded-opentype'), url('fonts/OpenSans/OpenSans-BoldItalic.woff') format('woff'), url('fonts/OpenSans/OpenSans-BoldItalic.ttf') format('truetype'), url('fonts/OpenSans/OpenSans-BoldItalic.svg#OpenSansBoldItalic') format('svg');
  font-weight: bold;
  font-style: italic;
}
/* END Bold Italic */
@font-face {
  font-family: 'PaylocityIcons';
  src: url('fonts/PaylocityIcons/PaylocityIcons.eot');
  src: url('fonts/PaylocityIcons/PaylocityIcons.eot?#iefix') format('embedded-opentype'), url('fonts/PaylocityIcons/PaylocityIcons.svg#PaylocityIcons') format('svg'), url('fonts/PaylocityIcons/PaylocityIcons.woff') format('woff'), url('fonts/PaylocityIcons/PaylocityIcons.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'PaylocityIcons';
  src: url('fonts/PaylocityIcons/PaylocityIcons-Bold.eot');
  src: url('fonts/PaylocityIcons/PaylocityIcons-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/PaylocityIcons/PaylocityIcons-Bold.svg#PaylocityIcons-Bold') format('svg'), url('fonts/PaylocityIcons/PaylocityIcons-Bold.woff') format('woff'), url('fonts/PaylocityIcons/PaylocityIcons-Bold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'PaylocityIcons-Bold';
  src: url('fonts/PaylocityIcons/PaylocityIcons-Bold.eot');
  src: url('fonts/PaylocityIcons/PaylocityIcons-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/PaylocityIcons/PaylocityIcons-Bold.svg#PaylocityIcons-Bold') format('svg'), url('fonts/PaylocityIcons/PaylocityIcons-Bold.woff') format('woff'), url('fonts/PaylocityIcons/PaylocityIcons-Bold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}
[class^="icon-"],
[class*=" icon-"] {
  font-family: 'PaylocityIcons';
  speak: none;
  font-style: normal;
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
[class^="icon-"].size-xlarge,
[class*=" icon-"].size-xlarge {
  font-size: 44px;
  font-size: 3.143rem;
}
[class^="icon-"].size-large,
[class*=" icon-"].size-large {
  font-size: 28px;
  font-size: 2rem;
}
[class^="icon-"].size-medium,
[class*=" icon-"].size-medium {
  font-size: 20px;
  font-size: 1.429rem;
}
[class^="icon-"].size-small,
[class*=" icon-"].size-small {
  font-size: 16px;
  font-size: 1.143rem;
}
[class^="icon-"].size-xsmall,
[class*=" icon-"].size-xsmall {
  font-size: 12px;
  font-size: 0.857rem;
}
.icon-font {
  font-family: 'PaylocityIcons-Bold';
  speak: none;
  font-style: normal;
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-bold {
  font-family: 'PaylocityIcons-Bold';
  font-weight: 600;
}
.icon-copy:before,
.icon-copy-outline:before {
  content: "\e629";
}
.icon-drag-n-drop:before,
.icon-drag-n-drop-outline:before,
.icon-drag:before {
  content: "\e636";
}
.icon-download:before,
.icon-download-outline:before {
  content: "\e634";
}
.icon-export:before,
.icon-export-outline:before {
  content: "\e63c";
}
.icon-feedback:before,
.icon-feedback-outline:before,
.icon-comment:before {
  content: "\e63e";
}
.icon-filter:before,
.icon-filter-outline:before {
  content: "\e640";
}
.icon-history:before,
.icon-history-outline:before {
  content: "\e649";
}
.icon-import:before,
.icon-import-outline:before {
  content: "\e64d";
}
.icon-link:before,
.icon-link-outline:before {
  content: "\e6be";
}
.icon-lock:before,
.icon-lock-outline:before {
  content: "\e655";
}
.icon-logout:before,
.icon-logout-outline:before {
  content: "\e659";
}
.icon-more:before,
.icon-more-outline:before {
  content: "\e65f";
}
.icon-options:before,
.icon-options-outline:before {
  content: "\e669";
}
.icon-paste:before,
.icon-paste-outline:before {
  content: "\e66d";
}
.icon-play:before,
.icon-play-outline:before {
  content: "\e6ce";
}
.icon-printer:before,
.icon-printer-outline:before,
.icon-print:before {
  content: "\e671";
}
.icon-refresh:before,
.icon-refresh-outline:before {
  content: "\e67d";
}
.icon-reply:before,
.icon-reply-outline:before,
.icon-undo:before {
  content: "\e67f";
}
.icon-reset:before,
.icon-reset-outline:before {
  content: "\e687";
}
.icon-save:before,
.icon-save-outline:before {
  content: "\e68b";
}
.icon-search:before,
.icon-search-outline:before {
  content: "\e68f";
}
.icon-settings:before,
.icon-settings-outline:before {
  content: "\e698";
}
.icon-sync:before,
.icon-sync-outline:before {
  content: "\e6a0";
}
.icon-unlock:before,
.icon-unlock-outline:before {
  content: "\e6aa";
}
.icon-chevron:before,
.icon-chevron-outline:before {
  content: "\e61e";
}
.icon-first:before,
.icon-chevron-first:before {
  content: "\e601";
}
.icon-last:before,
.icon-chevron-last:before {
  content: "\e603";
}
.icon-back:before,
.icon-back-outline:before,
.icon-chevron-left:before {
  content: "\e613";
}
.icon-forward:before,
.icon-forward-outline:before,
.icon-chevron-right:before {
  content: "\e642";
}
.icon-collapse:before,
.icon-collapse-outline:before,
.icon-chevron-up:before {
  content: "\e621";
}
.icon-expand:before,
.icon-expand-outline:before,
.icon-chevron-down:before {
  content: "\e63a";
}
.icon-menu:before,
.icon-menu-outline:before {
  content: "\e65b";
}
.icon-return:before,
.icon-return-outline:before {
  content: "\e689";
}
.icon-sort:before,
.icon-sort-outline:before {
  content: "\e69c";
}
.icon-radio-unselected:before,
.icon-radio-unselected-outline:before,
.icon-circle:before {
  content: "\e678";
}
.icon-selected-empty:before,
.icon-square:before {
  content: "\e695";
}
.icon-about:before,
.icon-about-outline:before,
.icon-info-circle:before {
  content: "\e600";
}
.icon-help:before,
.icon-help-outline:before,
.icon-question-circle:before {
  content: "\e647";
}
.icon-add:before,
.icon-add-outline:before,
.icon-plus:before {
  content: "\e602";
}
.icon-added:before,
.icon-added-outline:before,
.icon-plus-circle:before {
  content: "\e604";
}
.icon-cancelled:before,
.icon-cancelled-outline:before,
.icon-minus-circle:before {
  content: "\e618";
}
.icon-attention:before,
.icon-attention-outline:before,
.icon-exclamation-triangle:before {
  content: "\e60f";
}
.icon-important:before,
.important-outline:before,
.icon-exclamation-circle:before {
  content: "\e64f";
}
.icon-webpay:before,
.icon-webpay-outline:before,
.icon-dollar:before {
  content: "\e6b0";
}
.icon-impressions:before,
.icon-impressions-outline:before,
.icon-star:before {
  content: "\e651";
}
.icon-compensation:before,
.icon-compensation-outline:before,
.icon-dollar-circle:before {
  content: "\e625";
}
.icon-rate:before,
.icon-rate-outline:before,
.icon-star-circle:before {
  content: "\e67b";
}
.icon-select:before,
.icon-select-outline:before,
.icon-checkmark:before {
  content: "\e693";
}
.icon-approved:before,
.icon-approved-outline:before,
.icon-checkmark-circle:before {
  content: "\e60d";
}
.icon-selected:before,
.icon-selected-outline:before,
.icon-checkmark-square:before {
  content: "\e696";
}
.icon-no:before,
.icon-no-outline:before {
  content: "\e663";
}
.icon-partial:before,
.icon-partial-outline:before {
  content: "\e66b";
}
.icon-radio:before,
.icon-radio-outline:before {
  content: "\e677";
}
.icon-grid:before,
.icon-grid-outline:before {
  content: "\e6ba";
}
.icon-index:before,
.icon-index-outline:before,
.icon-list:before {
  content: "\e653";
}
.icon-delete:before,
.icon-delete-outline:before,
.icon-x:before {
  content: "\e62b";
}
.icon-denied:before,
.icon-denied-outline:before,
.icon-x-circle:before {
  content: "\e62d";
}
.icon-notifications:before,
.icon-notifications-outline:before,
.icon-bell:before {
  content: "\e665";
}
.icon-onboarding:before,
.icon-onboarding-outline:before,
.icon-briefcase:before {
  content: "\e667";
}
.icon-bug:before,
.icon-bug-outline:before {
  content: "\e6c0";
}
.icon-calculator:before,
.icon-calculator-outline:before {
  content: "\e6c2";
}
.icon-camera:before,
.icon-camera-outline:before {
  content: "\e6b7";
}
.icon-task:before,
.icon-task-outline:before,
.icon-clipboard:before {
  content: "\e6c4";
}
.icon-time:before,
.icon-time-outline:before,
.icon-clock-left:before,
.icon-clock:before {
  content: "\e6a4";
}
.icon-pending:before,
.icon-pending-outline:before,
.icon-clock-right:before {
  content: "\e66f";
}
.icon-credit:before,
.icon-credit-outline:before,
.icon-creditcard:before {
  content: "\e6b3";
}
.icon-image:before,
.icon-image-outline:before {
  content: "\e6b5";
}
.icon-announce:before,
.icon-announce-outline:before,
.icon-megaphone:before {
  content: "\e6c6";
}
.icon-database:before,
.icon-database-outline:before {
  content: "\e6c8";
}
.icon-property:before,
.icon-property-outline:before,
.icon-cube:before {
  content: "\e6ca";
}
.icon-video:before,
.icon-video-outline:before {
  content: "\e6cc";
}
.icon-edit:before,
.icon-edit-outline:before,
.icon-pencil:before {
  content: "\e638";
}
.icon-tag:before,
.icon-tag-outline:before {
  content: "\e6d0";
}
.icon-bookmark:before,
.icon-bookmark-outline:before {
  content: "\e6d2";
}
.icon-attachment:before,
.icon-attachment-outline:before,
.icon-paperclip:before {
  content: "\e6d4";
}
.icon-folder:before,
.icon-folder-outline:before {
  content: "\e6d6";
}
.icon-world:before,
.icon-world-outline:before,
.icon-globe:before {
  content: "\e6dc";
}
.icon-mail:before,
.icon-mail-outline:before,
.icon-envelope:before {
  content: "\e6de";
}
.icon-alert:before,
.icon-alert-outline:before,
.icon-flag:before {
  content: "\e606";
}
.icon-analyze:before,
.icon-analyze-outline:before,
.icon-bullseye:before {
  content: "\e608";
}
.icon-application:before,
.icon-application-outline:before {
  content: "\e60b";
}
.icon-audit:before,
.icon-audit-outline:before,
.icon-filecabinet:before {
  content: "\e611";
}
.icon-benefits:before,
.icon-benefits-outline:before,
.icon-heart:before {
  content: "\e615";
}
.icon-check:before,
.icon-check-outline:before,
.icon-paycheck:before {
  content: "\e61c";
}
.icon-company:before,
.icon-company-outline:before,
.icon-building:before {
  content: "\e623";
}
.icon-completed:before,
.icon-completed-outline:before,
.icon-thumbs-up:before {
  content: "\e627";
}
.icon-home:before,
.icon-home-outline:before {
  content: "\e64b";
}
.icon-monitor:before,
.icon-monitor-outline:before {
  content: "\e65d";
}
.icon-news:before,
.icon-news-outline:before,
.icon-newspaper:before {
  content: "\e661";
}
.icon-punch:before,
.icon-punch-outline:before,
.icon-punchclock:before {
  content: "\e675";
}
.icon-security:before,
.icon-security-outline:before,
.icon-shield:before {
  content: "\e691";
}
.icon-setup:before,
.icon-setup-outline:before,
.icon-toolbox:before {
  content: "\e69a";
}
.icon-view:before,
.icon-view-outline:before,
.icon-eye:before {
  content: "\e6ac";
}
.icon-weblink:before,
.icon-weblink-outline:before {
  content: "\e6ae";
}
.icon-profile:before,
.icon-profile-outline:before,
.icon-user:before {
  content: "\e673";
}
.icon-directory:before,
.icon-directory-outline:before,
.icon-user-directory:before {
  content: "\e630";
}
.icon-track:before,
.icon-track-outline:before,
.icon-user-folder:before {
  content: "\e6a8";
}
.icon-group:before,
.icon-group-outline:before,
.icon-teams:before,
.icon-teams-outline:before,
.icon-user-group:before {
  content: "\e645";
}
.icon-supervisor:before,
.icon-supervisor-outline:before {
  content: "\e69e";
}
.icon-documents:before,
.icon-documents-outline:before,
.icon-file:before {
  content: "\e632";
}
.icon-log-file:before,
.icon-log-file-outline:before,
.icon-file-log:before {
  content: "\e657";
}
.icon-spreadsheet:before,
.icon-spreadsheet-outline:before {
  content: "\e6b9";
}
.icon-reports:before,
.icon-reports-outline:before,
.icon-file-report:before {
  content: "\e683";
}
.icon-reports-library:before,
.icon-reports-library-outline:before {
  content: "\e681";
}
.icon-reports-writer:before,
.icon-reports-writer-outline:before {
  content: "\e684";
}
.icon-timesheet:before,
.icon-timesheet-outline:before,
.icon-file-timesheet:before {
  content: "\e6a6";
}
.icon-calendar:before,
.icon-calendar-outline:before {
  content: "\e6bc";
}
.icon-time-off:before,
.icon-time-off-outline:before,
.icon-calendar-day:before,
.icon-cal-date:before {
  content: "\e6a2";
}
.icon-schedule:before,
.icon-schedule-outline:before,
.icon-calendar-schedule:before {
  content: "\e68d";
}
.icon-org:before,
.icon-org-outline:before,
.icon-chart-flow:before {
  content: "\e6e0";
}
.icon-trend:before,
.icon-trend-outline:before,
.icon-chart-area:before {
  content: "\e6e2";
}
.icon-bar:before,
.icon-bar-outline:before,
.icon-chart-bar:before {
  content: "\e6e4";
}
.icon-pie-slice:before,
.icon-pie-slice-outline:before,
.icon-chart-pieslice:before {
  content: "\e6e6";
}
.icon-pie:before,
.icon-pie-outline:before,
.icon-chart-pie:before {
  content: "\e6e8";
}
.icon-career:before,
.icon-career-outline:before,
.icon-chart-line:before {
  content: "\e61a";
}
.icon-mobile:before,
.icon-mobile-outline:before,
.icon-phone:before {
  content: "\e6ea";
}
.icon-tablet:before,
.icon-tablet-outline:before {
  content: "\e6ec";
}
.icon-laptop:before,
.icon-laptop-outline:before {
  content: "\e6ee";
}
.icon-desktop:before,
.icon-desktop-outline:before {
  content: "\e6f0";
}
.icon-pin:before,
.icon-pin-outline:before,
.icon-location-pin:before {
  content: "\e6d8";
}
.icon-maps:before,
.icon-maps-outline:before,
.icon-location-arrow:before {
  content: "\e6da";
}
.icon-chrome:before {
  content: "\e6f5";
}
.icon-firefox:before {
  content: "\e6f3";
}
.icon-explorer:before,
.icon-internetexplorer:before {
  content: "\e6f4";
}
.icon-opera:before {
  content: "\e6f2";
}
.icon-safari:before {
  content: "\e62f";
}
.icon-apple-app:before {
  content: "\e60a";
}
.icon-google-play:before {
  content: "\e644";
}
.icon-twitter:before {
  content: "\e90c";
}
.icon-linkedin:before {
  content: "\e90a";
}
.icon-googleplus:before {
  content: "\e90b";
}
.icon-facebook:before {
  content: "\e909";
}
.icon-company-set:before {
  content: "\e886";
}
.icon-partner-set:before {
  content: "\e887";
}
.icon-recruiting:before {
  content: "\e888";
}
.icon-webpay-processing:before,
.icon-web-pay-processing:before {
  content: "\e889";
}
.icon-weblink-alt:before {
  content: "\e88a";
}
.icon-maximize:before {
  content: "\e861";
}
.icon-file-pdf:before {
  content: "\e840";
}
.icon-file-word:before {
  content: "\e844";
}
.icon-file-excel:before {
  content: "\e83e";
}
.icon-file-text:before {
  content: "\e842";
}
.icon-calendar-ot:before {
  content: "\e80f";
}
.icon-calendar-add:before {
  content: "\e80d";
}
.icon-calendar-tor:before {
  content: "\e811";
}
.icon-minus:before {
  content: "\e865";
}
.icon-columns:before {
  content: "\e82c";
}
.icon-user-portal:before {
  content: "\e89a";
}
.icon-cart:before {
  content: "\e814";
}
.icon-sidebar:before {
  content: "\e870";
}
.icon-bell-no:before {
  content: "\e664";
}
.icon-book:before {
  content: "\e806";
}
.icon-mortarboard:before {
  content: "\e868";
}
.icon-license:before {
  content: "\e859";
}
.icon-certificate:before {
  content: "\e815";
}
.icon-thumbs-down:before {
  content: "\e891";
}
.icon-palette:before {
  content: "\e86d";
}
.icon-zoom-in:before {
  content: "\e8a1";
}
.icon-zoom-out:before {
  content: "\e8a2";
}
.icon-redo:before {
  content: "\e84b";
}
.icon-upload:before {
  content: "\e896";
}
.icon-replyall:before,
.icon-reply-all:before {
  content: "\e87d";
}
.icon-checklist:before {
  content: "\e81c";
}
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b,
strong {
  font-weight: bold;
}
dfn {
  font-style: italic;
}
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
mark {
  background: #ff0;
  color: #000;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input {
  line-height: normal;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
legend {
  border: 0;
  padding: 0;
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
@media print {
  * {
    text-shadow: none !important;
    color: #222222 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }
  pre,
  blockquote {
    border: 1px solid #dadada;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
  select {
    background: #fff !important;
  }
  .navbar {
    display: none;
  }
  .table td,
  .table th {
    background-color: #fff !important;
  }
  .btn > .caret,
  .dropup > .btn > .caret {
    border-top-color: #222222 !important;
  }
  .label {
    border: 1px solid #222222;
  }
  .table {
    border-collapse: collapse !important;
  }
  .table-bordered th,
  .table-bordered td {
    border: 1px solid #eaeaea !important;
  }
}
html {
  font-size: 14px;
  margin: 0;
  padding: 0;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
body.citrus {
  background: var(--color-background-tertiary, #fafcfd);
  cursor: default;
  margin: 0;
  padding: 0;
  position: relative;
}
.citrus {
  color: #222222;
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  font-size: 1rem;
  line-height: 1;
}
.citrus a {
  background-color: transparent;
  color: #1588af;
  cursor: pointer;
  outline: 0;
  -moz-user-select: none;
}
.citrus a:active,
.citrus a:focus,
.citrus a:hover {
  color: #085a7e;
  outline: 0;
}
.citrus button:focus {
  outline: none;
}
.citrus .hidden {
  display: none !important;
}
.citrus .clearfix {
  *zoom: 1;
}
.citrus .clearfix:before,
.citrus .clearfix:after {
  content: " ";
  display: table;
}
.citrus .clearfix:after {
  clear: both;
}
.citrus .float-right {
  float: right;
}
@media only screen and (max-width: 699px) {
  .citrus .float-xs-none {
    float: none;
  }
}
@media (max-width: 859px) {
  .citrus .float-sm-none {
    float: none;
  }
}
@media (max-width: 1023px) {
  .citrus .float-md-none {
    float: none;
  }
}
.citrus .background-gray-lighter {
  background-color: #f5f5f5;
}
.citrus .background-white {
  background-color: #fff;
}
.citrus .vertical-align-parent {
  position: relative;
}
.citrus .vertical-align-child {
  width: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.citrus .inline-block {
  display: inline-block;
}
.citrus h1,
.citrus .h1,
.citrus h2,
.citrus .h2,
.citrus h3,
.citrus .h3,
.citrus h4,
.citrus .h4,
.citrus h5,
.citrus .h5,
.citrus p {
  margin: 0;
}
.citrus h1.margin-bottom,
.citrus .h1.margin-bottom,
.citrus h2.margin-bottom,
.citrus .h2.margin-bottom,
.citrus h3.margin-bottom,
.citrus .h3.margin-bottom,
.citrus h4.margin-bottom,
.citrus .h4.margin-bottom,
.citrus h5.margin-bottom,
.citrus .h5.margin-bottom,
.citrus p.margin-bottom {
  margin-bottom: 15px;
  margin-bottom: 1.071rem;
}
.citrus h1,
.citrus .h1,
.citrus h2,
.citrus .h2,
.citrus h3,
.citrus .h3,
.citrus h4,
.citrus .h4,
.citrus h5,
.citrus .h5 {
  display: block;
}
.citrus h1,
.citrus .h1 {
  font-size: 36px;
  font-size: 2.571rem;
  font-weight: 300;
  line-height: 1.33;
}
.citrus h2,
.citrus .h2 {
  font-size: 26px;
  font-size: 1.857rem;
  font-weight: 300;
  line-height: 1.38;
}
.citrus h3,
.citrus .h3 {
  font-size: 18px;
  font-size: 1.286rem;
  font-weight: normal;
  line-height: 1.45;
}
.citrus h4,
.citrus .h4 {
  font-size: 14px;
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.6;
}
.citrus p {
  font-size: 14px;
  font-size: 1rem;
  line-height: 1.6;
}
.citrus p.compact {
  line-height: 1.2;
}
.citrus p.margin-top {
  margin-top: 15px;
  margin-top: 1.071rem;
}
.citrus blockquote {
  font-size: 14px;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.75;
  margin: 15px 30px;
  margin: 1.071rem 2.143rem;
}
.citrus.type-body,
.citrus .type-body {
  font-size: 14px;
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.6;
}
.citrus.type-callout,
.citrus .type-callout {
  font-size: 48px;
  font-size: 3.429rem;
  line-height: 1.33;
}
.citrus.type-footnote,
.citrus .type-footnote,
.citrus h5,
.citrus .h5 {
  font-size: 12px;
  font-size: 0.857rem;
  line-height: 1.66;
}
.citrus.type-bold,
.citrus .type-bold {
  font-weight: bold;
}
.citrus.type-semibold,
.citrus .type-semibold {
  font-weight: 600;
}
.citrus.type-normal,
.citrus .type-normal {
  font-weight: normal;
}
.citrus.type-light,
.citrus .type-light {
  font-weight: 300;
}
.citrus.type-italic,
.citrus .type-italic {
  font-style: italic;
}
.citrus.type-underline,
.citrus .type-underline {
  text-decoration: underline;
}
.citrus a.type-nounderline {
  text-decoration: none;
}
.citrus.type-leftalign,
.citrus .type-leftalign {
  text-align: left;
}
.citrus.type-centeralign,
.citrus .type-centeralign {
  text-align: center;
}
.citrus.type-rightalign,
.citrus .type-rightalign {
  text-align: right;
}
.citrus.type-helptrigger,
.citrus .type-helptrigger {
  border-bottom: 1px dashed;
  cursor: help;
  text-decoration: none;
}
.citrus.type-cardtitle,
.citrus .type-cardtitle {
  padding: 12px 15px;
  padding: 0.857rem 1.071rem;
}
.citrus.type-contenttitle,
.citrus .type-contenttitle {
  padding: 12px 15px;
  padding: 0.857rem 1.071rem;
  border-bottom: 1px solid #cccccc;
}
.citrus.type-contenttitle .portrait.size-xsmall,
.citrus .type-contenttitle .portrait.size-xsmall {
  display: inline-block;
  margin-right: 8px;
  margin-right: 0.571rem;
  line-height: 32px;
  vertical-align: text-bottom;
}
.citrus.type-contenttitle .portrait.size-xsmall img,
.citrus .type-contenttitle .portrait.size-xsmall img {
  vertical-align: inherit;
}
.citrus.type-sectiontitle,
.citrus .type-sectiontitle {
  border-bottom: 1px solid #2eab73;
  color: #2eab73;
  display: block;
  margin: 15px 0;
  margin: 1.071rem 0;
  padding-bottom: 5px;
  padding-bottom: 0.357rem;
  font-weight: 600;
}
.citrus.type-sectiontitle.success,
.citrus .type-sectiontitle.success,
.citrus.type-sectiontitle.color-green-light,
.citrus .type-sectiontitle.color-green-light {
  color: #3dc270;
  border-color: #3dc270;
}
.citrus.type-sectiontitle.error,
.citrus .type-sectiontitle.error,
.citrus.type-sectiontitle.color-red,
.citrus .type-sectiontitle.color-red {
  color: #c8102e;
  border-color: #c8102e;
}
.citrus.type-sectiontitle.warning,
.citrus .type-sectiontitle.warning,
.citrus.type-sectiontitle.color-orange,
.citrus .type-sectiontitle.color-orange {
  color: #ff8800;
  border-color: #ff8800;
}
.citrus.type-sectiontitle.info,
.citrus .type-sectiontitle.info,
.citrus.type-sectiontitle.color-blue,
.citrus .type-sectiontitle.color-blue {
  color: #1588af;
  border-color: #1588af;
}
.citrus.type-sectiontitle .color-yellow,
.citrus .type-sectiontitle .color-yellow {
  color: #ffd70b;
}
.citrus.type-sectiontitle .color-gray,
.citrus .type-sectiontitle .color-gray {
  color: #cccccc;
}
.citrus.type-sectiontitle .color-gray-darker,
.citrus .type-sectiontitle .color-gray-darker {
  color: #666666;
}
.citrus.type-sectiontitle .color-white,
.citrus .type-sectiontitle .color-white {
  color: #fff;
}
.citrus.type-sectiontitle .button,
.citrus .type-sectiontitle .button {
  margin-top: -5px;
  margin-top: -0.357rem;
}
.citrus.type-sectiontitle .right,
.citrus .type-sectiontitle .right {
  float: right;
}
.citrus.type-divider,
.citrus .type-divider {
  background: #fff;
  color: #a6a6a6;
  display: block;
  font-size: 12px;
  font-size: 0.857rem;
  line-height: 16px;
  position: relative;
  text-align: center;
}
.citrus.type-divider:before,
.citrus .type-divider:before {
  background: #eaeaea;
  content: '';
  display: block;
  height: 1px;
  position: absolute;
  top: 50%;
  width: 100%;
}
.citrus.type-divider span,
.citrus .type-divider span {
  background: #fff;
  display: inline-block;
  padding: 8px 4px;
  position: relative;
  z-index: 1;
}
.citrus .type-overflow-ellipsis {
  display: block;
  width: 100%;
  padding-bottom: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.citrus ul.type-bulleted {
  line-height: 1.6;
  list-style-type: disc;
}
.citrus ul.type-nonbulleted {
  line-height: 1.6;
  list-style-type: none;
}
.citrus ul.padding-none {
  padding: 0;
}
.citrus ul.margin-none {
  margin: 0;
}
.citrus .color-blue {
  color: #1588af;
}
.citrus .color-blue-green {
  color: #2eab73;
}
.citrus .color-green {
  color: #459644;
}
.citrus .color-green-light {
  color: #3dc270;
}
.citrus .color-red {
  color: #c8102e;
}
.citrus .color-orange {
  color: #ff8800;
}
.citrus .color-yellow {
  color: #ffd70b;
}
.citrus .color-gray {
  color: #cccccc;
}
.citrus .color-gray-dark {
  color: #a6a6a6;
}
.citrus .color-gray-darker {
  color: #666666;
}
.citrus .color-white {
  color: #fff;
}
.citrus .color-yellow-dark {
  color: #ffc400;
}
.citrus {
  /* Base styles
    /* .column only effects salvattore layout
    */
  /* ie8 Hack
    /* Separates columns in masonry
    /* Borders not accounted for so 1px from each side is subtracted to fit in grid
    */
  /* 3 Wide Colum Size at full width */
  /* 2 Wide Column Sizes */
  /* 1 Wide Column / Equal Column Sizes */
}
.citrus .scaffolding,
.citrus.scaffolding,
.citrus #column-equal,
.citrus #column-full {
  margin: 0 auto;
  max-width: 1260px;
}
.citrus .scaffolding .card.size-large,
.citrus.scaffolding .card.size-large,
.citrus #column-equal .card.size-large,
.citrus #column-full .card.size-large,
.citrus .scaffolding .card.size-medium,
.citrus.scaffolding .card.size-medium,
.citrus #column-equal .card.size-medium,
.citrus #column-full .card.size-medium,
.citrus .scaffolding .card.size-small,
.citrus.scaffolding .card.size-small,
.citrus #column-equal .card.size-small,
.citrus #column-full .card.size-small {
  width: 100%;
}
.citrus .column {
  display: inline-block;
  vertical-align: top;
  padding: 0 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.citrus #column-equal .card.size-small,
.citrus #column-full .card.size-large {
  margin-left: 9px\9;
  margin-right: 9px\9;
}
.citrus .card-1240px {
  width: 1260px;
}
.citrus .card-970px {
  width: 990px;
}
.citrus .card-820px {
  width: 840px;
}
.citrus .card-640px {
  width: 660px;
}
.citrus .card-400px {
  width: 420px;
}
.citrus .card-310px {
  width: 330px;
}
@media screen and (max-width: 699px) {
  .citrus #column-equal[data-columns]::before,
  .citrus #column-1wide[data-columns]::before,
  .citrus #column-2wide[data-columns]::before,
  .citrus #column-full[data-columns]::before {
    content: '1 .column';
  }
  .citrus #column-equal .card.size-small,
  .citrus #column-1wide .card.size-small {
    max-width: 500px;
  }
  .citrus #column-full .card.size-large,
  .citrus #column-2wide .card.size-medium,
  .citrus #column-1wide .card.size-small,
  .citrus #column-equal .card.size-small {
    margin: 0 0 5px 0;
  }
  .citrus #column-2wide .card.size-small + .card.size-small:nth-child(even) {
    margin-left: 0px;
  }
  .citrus .scaffolding {
    max-width: 500px;
    margin: 0 auto;
  }
  .citrus .column {
    padding: 0 5px;
  }
}
@media screen and (min-width: 700px) and (max-width: 859px) {
  .citrus #column-equal[data-columns]::before {
    content: '2 .column.card-310px';
  }
  .citrus #column-1wide[data-columns]::before {
    content: '2 .column.card-310px';
  }
  .citrus #column-2wide[data-columns]::before {
    content: '1 .column.card-640px';
  }
  .citrus #column-full[data-columns]::before {
    content: '1 .column.card-640px';
  }
  .citrus #column-full .card.size-large {
    width: 640px\9;
  }
  .citrus #column-equal .card.size-small {
    width: 310px\9;
  }
  .citrus .scaffolding {
    max-width: 660px;
  }
}
@media screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus #column-equal[data-columns]::before {
    content: '2 .column.card-400px';
  }
  .citrus #column-1wide[data-columns]::before {
    content: '2 .column.card-400px';
  }
  .citrus #column-2wide[data-columns]::before {
    content: '1 .column.card-820px';
  }
  .citrus #column-full[data-columns]::before {
    content: '1 .column.card-820px';
  }
  .citrus #column-full .card.size-large {
    width: 820px\9;
  }
  .citrus .scaffolding {
    max-width: 840px;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .citrus #column-equal[data-columns]::before {
    content: '3 .column.card-310px';
  }
  .citrus #column-1wide[data-columns]::before {
    content: '1 .column.card-310px';
  }
  .citrus #column-2wide[data-columns]::before {
    content: '1 .column.card-640px';
  }
  .citrus #column-full[data-columns]::before {
    content: '1 .column.card-970px';
  }
  .citrus #column-full .card.size-large {
    width: 970px\9;
  }
  .citrus #column-equal .card.size-small {
    width: 310px\9;
  }
  .citrus .scaffolding {
    max-width: 990px;
  }
  .citrus #column-1wide,
  .citrus #column-2wide {
    display: inline-block;
    vertical-align: top;
  }
}
@media screen and (min-width: 1280px) {
  .citrus #column-equal[data-columns]::before {
    content: '3 .column.card-400px';
  }
  .citrus #column-1wide[data-columns]::before {
    content: '1 .column.card-400px';
  }
  .citrus #column-2wide[data-columns]::before {
    content: '1 .column.card-820px';
  }
  .citrus #column-full[data-columns]::before {
    content: '1 .column.card-1240px';
  }
  .citrus #column-1wide,
  .citrus #column-2wide {
    display: inline-block;
    vertical-align: top;
  }
}
.citrus .sticky {
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
  position: sticky;
  top: 0;
  z-index: 2;
}
.citrus .sticky.sticky-shadow {
  box-shadow: 0 -1px 0 #cccccc;
  -moz-box-shadow: 0 -1px 0 #cccccc;
  -webkit-box-shadow: 0 -1px 0 #cccccc;
}
.citrus .row-float-fill {
  display: table;
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.citrus .row-float-fill:before,
.citrus .row-float-fill:after {
  content: " ";
  display: table;
}
.citrus .row-float-fill:after {
  clear: both;
}
.citrus .row-float-fill .col-fixed {
  height: 100%;
  position: relative;
  z-index: 0;
}
.citrus .row-float-fill .col-fixed:before,
.citrus .row-float-fill .col-fixed:after {
  content: " ";
  display: table;
}
.citrus .row-float-fill .col-fixed:after {
  clear: both;
}
.citrus .row-float-fill .col-fixed.right {
  float: right;
}
.citrus .row-float-fill .col-fixed.left {
  float: left;
}
@media only screen and (max-width: 699px) {
  .citrus .row-float-fill .col-fixed.mobile-above {
    float: none;
  }
  .citrus .row-float-fill .col-fixed.mobile-above.mobile-padding:after {
    content: '';
    display: block;
    padding-bottom: 15px;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .row-float-fill .col-fixed.mobile-below {
    display: table-footer-group;
    float: none;
  }
  .citrus .row-float-fill .col-fixed.mobile-below.mobile-padding:before {
    content: '';
    display: block;
    padding-top: 15px;
  }
}
.citrus .row-float-fill .col-fluid {
  height: auto;
  overflow: hidden;
}
@media only screen and (max-width: 699px) {
  .citrus .row-float-fill .col-fluid.mobile-full {
    display: table-row-group;
  }
}
.citrus .row-float-fill .col-fluid .background {
  background: #fff;
  position: relative;
  z-index: 1;
}
.citrus .row-float-fill .border-left {
  border-left: 1px solid #cccccc;
}
.citrus .row-float-fill .border-right {
  border-right: 1px solid #cccccc;
}
.citrus .row-float-fill .padding-left {
  padding-left: 15px;
  padding-left: 1.071rem;
}
.citrus .row-float-fill .padding-right {
  padding-right: 15px;
  padding-right: 1.071rem;
}
.citrus .row-float-fill .padding-bottom {
  padding-bottom: 15px;
  padding-bottom: 1.071rem;
}
.citrus .row-float-fill .padding-top {
  padding-top: 15px;
  padding-top: 1.071rem;
}
.citrus .row-float-fill .padding-vertical {
  padding-bottom: 15px;
  padding-bottom: 1.071rem;
  padding-top: 15px;
  padding-top: 1.071rem;
}
.citrus .row-float-fill .padding-horizontal {
  padding-left: 15px;
  padding-left: 1.071rem;
  padding-right: 15px;
  padding-right: 1.071rem;
}
.citrus .row-float-fill .padding-all {
  padding: 15px;
  padding: 1.071rem;
}
.citrus .row.expand-collapse {
  position: relative;
}
.citrus .row.expand-collapse .expand.col-full-width {
  width: 100%;
}
.citrus .row.expand-collapse .collapse {
  overflow: hidden;
}
.citrus .row.expand-collapse .collapse.col-width-none {
  border: none;
  overflow: hidden;
  padding-left: 0;
  padding-right: 0;
  width: 0;
}
.citrus .row.expand-collapse .collapse.col-width-none .wrapper {
  padding-left: 15px;
  padding-right: 15px;
}
.citrus .row.expand-collapse.mobile .collapse {
  background: #fff;
  border: none;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.25);
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
}
.citrus .row.expand-collapse.mobile .collapse.col-width-none {
  left: -110%;
}
.citrus .row.expand-collapse.mobile .collapse .wrapper {
  width: auto;
}
.citrus .row.expand-collapse.mobile > div {
  transition: left .25s ease;
}
.citrus .row.expand-collapse.mobile .wrapper {
  transition: padding .25s ease;
}
.citrus .row.expand-collapse:not(.mobile) > div {
  transition: all .25s ease;
}
.citrus .row.expand-collapse:not(.mobile) .wrapper {
  transition: padding .25s ease;
}
.citrus .clickable {
  cursor: pointer;
}
.citrus {
  /* Bootstrap 3 Scaffolding Styles
  	================================= */
}
.citrus .content-area > .row {
  margin: 0;
}
.citrus .row,
.citrus .row [class^="col-"] {
  box-sizing: border-box;
}
.citrus .row.content-header,
.citrus .row [class^="col-"].content-header {
  padding: 12px 15px;
  padding: 0.857rem 1.071rem;
  border-bottom: 1px solid #ccc;
}
.citrus .row.content-header .button.icon + h2,
.citrus .row [class^="col-"].content-header .button.icon + h2 {
  padding-left: 34px;
  padding-left: 2.429rem;
}
@media only screen and (max-width: 699px) {
  .citrus .row.content-header h2,
  .citrus .row [class^="col-"].content-header h2 {
    font-size: 18px;
    font-weight: normal;
    padding-top: 6px;
    padding-top: 0.429rem;
  }
}
.citrus .row.content-header .input-container,
.citrus .row [class^="col-"].content-header .input-container {
  position: relative;
  margin-left: 44px;
}
.citrus .row.content-header input,
.citrus .row [class^="col-"].content-header input {
  box-sizing: border-box;
  border: none;
  width: 100%;
  outline: none;
}
@media only screen and (max-width: 699px) {
  .citrus .row .hidden-xs-animated,
  .citrus .row [class^="col-"] .hidden-xs-animated {
    visibility: hidden;
    overflow: hidden;
    max-height: 0;
    padding: 0 !important;
  }
}
@media screen and (min-width: 700px) {
  .citrus .row .hidden-above-mobile,
  .citrus .row [class^="col-"] .hidden-above-mobile {
    display: none;
  }
}
@media (max-width: 699px) {
  .citrus .row .hidden-mobile,
  .citrus .row [class^="col-"] .hidden-mobile {
    display: none !important;
  }
}
@media (max-width: 859px) {
  .citrus .row .hidden-tablet-portrait,
  .citrus .row [class^="col-"] .hidden-tablet-portrait {
    display: none !important;
  }
}
@media (max-width: 1023px) {
  .citrus .row .hidden-tablet-landscape,
  .citrus .row [class^="col-"] .hidden-tablet-landscape {
    display: none !important;
  }
}
@media (max-width: 1279px) {
  .citrus .row .hidden-desktop-small,
  .citrus .row [class^="col-"] .hidden-desktop-small {
    display: none !important;
  }
}
@media (max-width: 699px) {
  .citrus .row.margin-xs-top,
  .citrus .row [class^="col-"].margin-xs-top {
    margin-top: 15px;
    margin-top: 1.071rem;
  }
}
@media (max-width: 859px) {
  .citrus .row.margin-sm-top,
  .citrus .row [class^="col-"].margin-sm-top {
    margin-top: 15px;
    margin-top: 1.071rem;
  }
}
@media (max-width: 1023px) {
  .citrus .row.margin-md-top,
  .citrus .row [class^="col-"].margin-md-top {
    margin-top: 15px;
    margin-top: 1.071rem;
  }
}
.citrus .row.padding-top,
.citrus .row [class^="col-"].padding-top {
  padding-top: 15px;
  padding-top: 1.071rem;
}
.citrus .row.padding-bottom,
.citrus .row [class^="col-"].padding-bottom {
  padding-bottom: 15px;
  padding-bottom: 1.071rem;
}
.citrus .row.padding-left,
.citrus .row [class^="col-"].padding-left {
  padding-left: 15px;
  padding-left: 1.071rem;
}
.citrus .row.padding-right,
.citrus .row [class^="col-"].padding-right {
  padding-right: 15px;
  padding-right: 1.071rem;
}
.citrus .row.padding-horizontal,
.citrus .row [class^="col-"].padding-horizontal {
  padding-left: 15px;
  padding-left: 1.071rem;
  padding-right: 15px;
  padding-right: 1.071rem;
}
.citrus .row.padding-vertical,
.citrus .row [class^="col-"].padding-vertical {
  padding-top: 15px;
  padding-top: 1.071rem;
  padding-bottom: 15px;
  padding-bottom: 1.071rem;
}
.citrus .row.padding-all,
.citrus .row [class^="col-"].padding-all {
  padding: 15px;
  padding: 1.071rem;
}
.citrus .row.compact-padding-top,
.citrus .row [class^="col-"].compact-padding-top {
  padding-top: 8px;
  padding-top: 0.571rem;
}
.citrus .row.compact-padding-bottom,
.citrus .row [class^="col-"].compact-padding-bottom {
  padding-bottom: 8px;
  padding-bottom: 0.571rem;
}
.citrus .row.compact-padding-left,
.citrus .row [class^="col-"].compact-padding-left {
  padding-left: 8px;
  padding-left: 0.571rem;
}
.citrus .row.compact-padding-right,
.citrus .row [class^="col-"].compact-padding-right {
  padding-right: 8px;
  padding-right: 0.571rem;
}
.citrus .row.compact-padding-horizontal,
.citrus .row [class^="col-"].compact-padding-horizontal {
  padding-left: 8px;
  padding-left: 0.571rem;
  padding-right: 8px;
  padding-right: 0.571rem;
}
.citrus .row.compact-padding-vertical,
.citrus .row [class^="col-"].compact-padding-vertical {
  padding-top: 8px;
  padding-top: 0.571rem;
  padding-bottom: 8px;
  padding-bottom: 0.571rem;
}
.citrus .row.compact-padding-all,
.citrus .row [class^="col-"].compact-padding-all {
  padding: 8px;
  padding: 0.571rem;
}
.citrus .row.padding-left-none,
.citrus .row [class^="col-"].padding-left-none {
  padding-left: 0;
}
@media screen and (min-width: 700px) {
  .citrus .row.padding-left-none-above-mobile,
  .citrus .row [class^="col-"].padding-left-none-above-mobile {
    padding-left: 0;
  }
}
.citrus .row.padding-right-none,
.citrus .row [class^="col-"].padding-right-none {
  padding-right: 0;
}
@media screen and (min-width: 700px) {
  .citrus .row.padding-right-none-above-mobile,
  .citrus .row [class^="col-"].padding-right-none-above-mobile {
    padding-right: 0;
  }
}
.citrus .row.padding-horizontal-none,
.citrus .row [class^="col-"].padding-horizontal-none {
  padding-right: 0;
  padding-left: 0;
}
.citrus .row.padding-none,
.citrus .row [class^="col-"].padding-none {
  padding: 0;
}
.citrus .row.border-fix,
.citrus .row [class^="col-"].border-fix {
  margin-left: -1px;
  margin-right: -1px;
}
@media (max-width: 699px) {
  .citrus .row.border-xs-none,
  .citrus .row [class^="col-"].border-xs-none {
    border: none;
  }
  .citrus .row.border-right-xs-none,
  .citrus .row [class^="col-"].border-right-xs-none {
    border-right: none;
  }
  .citrus .row.border-left-xs-none,
  .citrus .row [class^="col-"].border-left-xs-none {
    border-left: none;
  }
}
@media (max-width: 859px) {
  .citrus .row.border-sm-none,
  .citrus .row [class^="col-"].border-sm-none {
    border: none;
  }
  .citrus .row.border-right-sm-none,
  .citrus .row [class^="col-"].border-right-sm-none {
    border-right: none;
  }
  .citrus .row.border-left-sm-none,
  .citrus .row [class^="col-"].border-left-sm-none {
    border-left: none;
  }
}
@media (max-width: 1023px) {
  .citrus .row.border-md-none,
  .citrus .row [class^="col-"].border-md-none {
    border: none;
  }
  .citrus .row.border-right-md-none,
  .citrus .row [class^="col-"].border-right-md-none {
    border-right: none;
  }
  .citrus .row.border-left-md-none,
  .citrus .row [class^="col-"].border-left-md-none {
    border-left: none;
  }
}
@media screen and (min-width: 700px) {
  .citrus .hidden-above-mobile {
    display: none;
  }
}
@media (max-width: 699px) {
  .citrus .hidden-mobile {
    display: none !important;
  }
}
@media (max-width: 859px) {
  .citrus .hidden-tablet-portrait {
    display: none !important;
  }
}
@media (max-width: 1023px) {
  .citrus .hidden-tablet-landscape {
    display: none !important;
  }
}
@media (max-width: 1279px) {
  .citrus .hidden-desktop-small {
    display: none !important;
  }
}
.citrus .row.margin-top {
  margin-top: 15px;
  margin-top: 1.071rem;
}
.citrus .row.margin-bottom {
  margin-bottom: 15px;
  margin-bottom: 1.071rem;
}
.citrus .row.margin-left {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus .row.margin-right {
  margin-right: 15px;
  margin-right: 1.071rem;
}
.citrus .row.margin-horizontal {
  margin-left: 15px;
  margin-left: 1.071rem;
  margin-right: 15px;
  margin-right: 1.071rem;
}
.citrus .row.margin-horizontal-none {
  margin-right: 0;
  margin-left: 0;
}
.citrus .row.margin-vertical {
  margin-top: 15px;
  margin-top: 1.071rem;
  margin-bottom: 15px;
  margin-bottom: 1.071rem;
}
.citrus .card .row,
.citrus .card .card-content.row {
  margin-left: 8px;
  margin-left: 0.571rem;
  margin-right: 8px;
  margin-right: 0.571rem;
}
.citrus .card .row [class^="col-"] {
  padding-right: 7px;
  padding-right: 0.5rem;
  padding-left: 7px;
  padding-left: 0.5rem;
  /* Ensures long words wrap instead of being cut off */
  word-wrap: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
.citrus .row {
  margin-left: -15px;
  margin-right: -15px;
}
.citrus .row:before,
.citrus .row:after {
  content: " ";
  display: table;
}
.citrus .row:after {
  clear: both;
}
.citrus .col-xs-1,
.citrus .col-sm-1,
.citrus .col-md-1,
.citrus .col-lg-1,
.citrus .col-xs-2,
.citrus .col-sm-2,
.citrus .col-md-2,
.citrus .col-lg-2,
.citrus .col-xs-3,
.citrus .col-sm-3,
.citrus .col-md-3,
.citrus .col-lg-3,
.citrus .col-xs-4,
.citrus .col-sm-4,
.citrus .col-md-4,
.citrus .col-lg-4,
.citrus .col-xs-5,
.citrus .col-sm-5,
.citrus .col-md-5,
.citrus .col-lg-5,
.citrus .col-xs-6,
.citrus .col-sm-6,
.citrus .col-md-6,
.citrus .col-lg-6,
.citrus .col-xs-7,
.citrus .col-sm-7,
.citrus .col-md-7,
.citrus .col-lg-7,
.citrus .col-xs-8,
.citrus .col-sm-8,
.citrus .col-md-8,
.citrus .col-lg-8,
.citrus .col-xs-9,
.citrus .col-sm-9,
.citrus .col-md-9,
.citrus .col-lg-9,
.citrus .col-xs-10,
.citrus .col-sm-10,
.citrus .col-md-10,
.citrus .col-lg-10,
.citrus .col-xs-11,
.citrus .col-sm-11,
.citrus .col-md-11,
.citrus .col-lg-11,
.citrus .col-xs-12,
.citrus .col-sm-12,
.citrus .col-md-12,
.citrus .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
.citrus .col-xs-1,
.citrus .col-xs-2,
.citrus .col-xs-3,
.citrus .col-xs-4,
.citrus .col-xs-5,
.citrus .col-xs-6,
.citrus .col-xs-7,
.citrus .col-xs-8,
.citrus .col-xs-9,
.citrus .col-xs-10,
.citrus .col-xs-11,
.citrus .col-xs-12 {
  float: left;
}
.citrus .col-xs-12 {
  width: 100%;
}
.citrus .col-xs-11 {
  width: 91.66666667%;
}
.citrus .col-xs-10 {
  width: 83.33333333%;
}
.citrus .col-xs-9 {
  width: 75%;
}
.citrus .col-xs-8 {
  width: 66.66666667%;
}
.citrus .col-xs-7 {
  width: 58.33333333%;
}
.citrus .col-xs-6 {
  width: 50%;
}
.citrus .col-xs-5 {
  width: 41.66666667%;
}
.citrus .col-xs-4 {
  width: 33.33333333%;
}
.citrus .col-xs-3 {
  width: 25%;
}
.citrus .col-xs-2 {
  width: 16.66666667%;
}
.citrus .col-xs-1 {
  width: 8.33333333%;
}
.citrus .col-xs-pull-12 {
  right: 100%;
}
.citrus .col-xs-pull-11 {
  right: 91.66666667%;
}
.citrus .col-xs-pull-10 {
  right: 83.33333333%;
}
.citrus .col-xs-pull-9 {
  right: 75%;
}
.citrus .col-xs-pull-8 {
  right: 66.66666667%;
}
.citrus .col-xs-pull-7 {
  right: 58.33333333%;
}
.citrus .col-xs-pull-6 {
  right: 50%;
}
.citrus .col-xs-pull-5 {
  right: 41.66666667%;
}
.citrus .col-xs-pull-4 {
  right: 33.33333333%;
}
.citrus .col-xs-pull-3 {
  right: 25%;
}
.citrus .col-xs-pull-2 {
  right: 16.66666667%;
}
.citrus .col-xs-pull-1 {
  right: 8.33333333%;
}
.citrus .col-xs-pull-0 {
  right: auto;
}
.citrus .col-xs-push-12 {
  left: 100%;
}
.citrus .col-xs-push-11 {
  left: 91.66666667%;
}
.citrus .col-xs-push-10 {
  left: 83.33333333%;
}
.citrus .col-xs-push-9 {
  left: 75%;
}
.citrus .col-xs-push-8 {
  left: 66.66666667%;
}
.citrus .col-xs-push-7 {
  left: 58.33333333%;
}
.citrus .col-xs-push-6 {
  left: 50%;
}
.citrus .col-xs-push-5 {
  left: 41.66666667%;
}
.citrus .col-xs-push-4 {
  left: 33.33333333%;
}
.citrus .col-xs-push-3 {
  left: 25%;
}
.citrus .col-xs-push-2 {
  left: 16.66666667%;
}
.citrus .col-xs-push-1 {
  left: 8.33333333%;
}
.citrus .col-xs-push-0 {
  left: auto;
}
.citrus .col-xs-offset-12 {
  margin-left: 100%;
}
.citrus .col-xs-offset-11 {
  margin-left: 91.66666667%;
}
.citrus .col-xs-offset-10 {
  margin-left: 83.33333333%;
}
.citrus .col-xs-offset-9 {
  margin-left: 75%;
}
.citrus .col-xs-offset-8 {
  margin-left: 66.66666667%;
}
.citrus .col-xs-offset-7 {
  margin-left: 58.33333333%;
}
.citrus .col-xs-offset-6 {
  margin-left: 50%;
}
.citrus .col-xs-offset-5 {
  margin-left: 41.66666667%;
}
.citrus .col-xs-offset-4 {
  margin-left: 33.33333333%;
}
.citrus .col-xs-offset-3 {
  margin-left: 25%;
}
.citrus .col-xs-offset-2 {
  margin-left: 16.66666667%;
}
.citrus .col-xs-offset-1 {
  margin-left: 8.33333333%;
}
.citrus .col-xs-offset-0 {
  margin-left: 0%;
}
@media (min-width: 700px) {
  .citrus .col-sm-1,
  .citrus .col-sm-2,
  .citrus .col-sm-3,
  .citrus .col-sm-4,
  .citrus .col-sm-5,
  .citrus .col-sm-6,
  .citrus .col-sm-7,
  .citrus .col-sm-8,
  .citrus .col-sm-9,
  .citrus .col-sm-10,
  .citrus .col-sm-11,
  .citrus .col-sm-12 {
    float: left;
  }
  .citrus .col-sm-12 {
    width: 100%;
  }
  .citrus .col-sm-11 {
    width: 91.66666667%;
  }
  .citrus .col-sm-10 {
    width: 83.33333333%;
  }
  .citrus .col-sm-9 {
    width: 75%;
  }
  .citrus .col-sm-8 {
    width: 66.66666667%;
  }
  .citrus .col-sm-7 {
    width: 58.33333333%;
  }
  .citrus .col-sm-6 {
    width: 50%;
  }
  .citrus .col-sm-5 {
    width: 41.66666667%;
  }
  .citrus .col-sm-4 {
    width: 33.33333333%;
  }
  .citrus .col-sm-3 {
    width: 25%;
  }
  .citrus .col-sm-2 {
    width: 16.66666667%;
  }
  .citrus .col-sm-1 {
    width: 8.33333333%;
  }
  .citrus .col-sm-pull-12 {
    right: 100%;
  }
  .citrus .col-sm-pull-11 {
    right: 91.66666667%;
  }
  .citrus .col-sm-pull-10 {
    right: 83.33333333%;
  }
  .citrus .col-sm-pull-9 {
    right: 75%;
  }
  .citrus .col-sm-pull-8 {
    right: 66.66666667%;
  }
  .citrus .col-sm-pull-7 {
    right: 58.33333333%;
  }
  .citrus .col-sm-pull-6 {
    right: 50%;
  }
  .citrus .col-sm-pull-5 {
    right: 41.66666667%;
  }
  .citrus .col-sm-pull-4 {
    right: 33.33333333%;
  }
  .citrus .col-sm-pull-3 {
    right: 25%;
  }
  .citrus .col-sm-pull-2 {
    right: 16.66666667%;
  }
  .citrus .col-sm-pull-1 {
    right: 8.33333333%;
  }
  .citrus .col-sm-pull-0 {
    right: auto;
  }
  .citrus .col-sm-push-12 {
    left: 100%;
  }
  .citrus .col-sm-push-11 {
    left: 91.66666667%;
  }
  .citrus .col-sm-push-10 {
    left: 83.33333333%;
  }
  .citrus .col-sm-push-9 {
    left: 75%;
  }
  .citrus .col-sm-push-8 {
    left: 66.66666667%;
  }
  .citrus .col-sm-push-7 {
    left: 58.33333333%;
  }
  .citrus .col-sm-push-6 {
    left: 50%;
  }
  .citrus .col-sm-push-5 {
    left: 41.66666667%;
  }
  .citrus .col-sm-push-4 {
    left: 33.33333333%;
  }
  .citrus .col-sm-push-3 {
    left: 25%;
  }
  .citrus .col-sm-push-2 {
    left: 16.66666667%;
  }
  .citrus .col-sm-push-1 {
    left: 8.33333333%;
  }
  .citrus .col-sm-push-0 {
    left: auto;
  }
  .citrus .col-sm-offset-12 {
    margin-left: 100%;
  }
  .citrus .col-sm-offset-11 {
    margin-left: 91.66666667%;
  }
  .citrus .col-sm-offset-10 {
    margin-left: 83.33333333%;
  }
  .citrus .col-sm-offset-9 {
    margin-left: 75%;
  }
  .citrus .col-sm-offset-8 {
    margin-left: 66.66666667%;
  }
  .citrus .col-sm-offset-7 {
    margin-left: 58.33333333%;
  }
  .citrus .col-sm-offset-6 {
    margin-left: 50%;
  }
  .citrus .col-sm-offset-5 {
    margin-left: 41.66666667%;
  }
  .citrus .col-sm-offset-4 {
    margin-left: 33.33333333%;
  }
  .citrus .col-sm-offset-3 {
    margin-left: 25%;
  }
  .citrus .col-sm-offset-2 {
    margin-left: 16.66666667%;
  }
  .citrus .col-sm-offset-1 {
    margin-left: 8.33333333%;
  }
  .citrus .col-sm-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 860px) {
  .citrus .col-md-1,
  .citrus .col-md-2,
  .citrus .col-md-3,
  .citrus .col-md-4,
  .citrus .col-md-5,
  .citrus .col-md-6,
  .citrus .col-md-7,
  .citrus .col-md-8,
  .citrus .col-md-9,
  .citrus .col-md-10,
  .citrus .col-md-11,
  .citrus .col-md-12 {
    float: left;
  }
  .citrus .col-md-12 {
    width: 100%;
  }
  .citrus .col-md-11 {
    width: 91.66666667%;
  }
  .citrus .col-md-10 {
    width: 83.33333333%;
  }
  .citrus .col-md-9 {
    width: 75%;
  }
  .citrus .col-md-8 {
    width: 66.66666667%;
  }
  .citrus .col-md-7 {
    width: 58.33333333%;
  }
  .citrus .col-md-6 {
    width: 50%;
  }
  .citrus .col-md-5 {
    width: 41.66666667%;
  }
  .citrus .col-md-4 {
    width: 33.33333333%;
  }
  .citrus .col-md-3 {
    width: 25%;
  }
  .citrus .col-md-2 {
    width: 16.66666667%;
  }
  .citrus .col-md-1 {
    width: 8.33333333%;
  }
  .citrus .col-md-pull-12 {
    right: 100%;
  }
  .citrus .col-md-pull-11 {
    right: 91.66666667%;
  }
  .citrus .col-md-pull-10 {
    right: 83.33333333%;
  }
  .citrus .col-md-pull-9 {
    right: 75%;
  }
  .citrus .col-md-pull-8 {
    right: 66.66666667%;
  }
  .citrus .col-md-pull-7 {
    right: 58.33333333%;
  }
  .citrus .col-md-pull-6 {
    right: 50%;
  }
  .citrus .col-md-pull-5 {
    right: 41.66666667%;
  }
  .citrus .col-md-pull-4 {
    right: 33.33333333%;
  }
  .citrus .col-md-pull-3 {
    right: 25%;
  }
  .citrus .col-md-pull-2 {
    right: 16.66666667%;
  }
  .citrus .col-md-pull-1 {
    right: 8.33333333%;
  }
  .citrus .col-md-pull-0 {
    right: auto;
  }
  .citrus .col-md-push-12 {
    left: 100%;
  }
  .citrus .col-md-push-11 {
    left: 91.66666667%;
  }
  .citrus .col-md-push-10 {
    left: 83.33333333%;
  }
  .citrus .col-md-push-9 {
    left: 75%;
  }
  .citrus .col-md-push-8 {
    left: 66.66666667%;
  }
  .citrus .col-md-push-7 {
    left: 58.33333333%;
  }
  .citrus .col-md-push-6 {
    left: 50%;
  }
  .citrus .col-md-push-5 {
    left: 41.66666667%;
  }
  .citrus .col-md-push-4 {
    left: 33.33333333%;
  }
  .citrus .col-md-push-3 {
    left: 25%;
  }
  .citrus .col-md-push-2 {
    left: 16.66666667%;
  }
  .citrus .col-md-push-1 {
    left: 8.33333333%;
  }
  .citrus .col-md-push-0 {
    left: auto;
  }
  .citrus .col-md-offset-12 {
    margin-left: 100%;
  }
  .citrus .col-md-offset-11 {
    margin-left: 91.66666667%;
  }
  .citrus .col-md-offset-10 {
    margin-left: 83.33333333%;
  }
  .citrus .col-md-offset-9 {
    margin-left: 75%;
  }
  .citrus .col-md-offset-8 {
    margin-left: 66.66666667%;
  }
  .citrus .col-md-offset-7 {
    margin-left: 58.33333333%;
  }
  .citrus .col-md-offset-6 {
    margin-left: 50%;
  }
  .citrus .col-md-offset-5 {
    margin-left: 41.66666667%;
  }
  .citrus .col-md-offset-4 {
    margin-left: 33.33333333%;
  }
  .citrus .col-md-offset-3 {
    margin-left: 25%;
  }
  .citrus .col-md-offset-2 {
    margin-left: 16.66666667%;
  }
  .citrus .col-md-offset-1 {
    margin-left: 8.33333333%;
  }
  .citrus .col-md-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 1024px) {
  .citrus .col-lg-1,
  .citrus .col-lg-2,
  .citrus .col-lg-3,
  .citrus .col-lg-4,
  .citrus .col-lg-5,
  .citrus .col-lg-6,
  .citrus .col-lg-7,
  .citrus .col-lg-8,
  .citrus .col-lg-9,
  .citrus .col-lg-10,
  .citrus .col-lg-11,
  .citrus .col-lg-12 {
    float: left;
  }
  .citrus .col-lg-12 {
    width: 100%;
  }
  .citrus .col-lg-11 {
    width: 91.66666667%;
  }
  .citrus .col-lg-10 {
    width: 83.33333333%;
  }
  .citrus .col-lg-9 {
    width: 75%;
  }
  .citrus .col-lg-8 {
    width: 66.66666667%;
  }
  .citrus .col-lg-7 {
    width: 58.33333333%;
  }
  .citrus .col-lg-6 {
    width: 50%;
  }
  .citrus .col-lg-5 {
    width: 41.66666667%;
  }
  .citrus .col-lg-4 {
    width: 33.33333333%;
  }
  .citrus .col-lg-3 {
    width: 25%;
  }
  .citrus .col-lg-2 {
    width: 16.66666667%;
  }
  .citrus .col-lg-1 {
    width: 8.33333333%;
  }
  .citrus .col-lg-pull-12 {
    right: 100%;
  }
  .citrus .col-lg-pull-11 {
    right: 91.66666667%;
  }
  .citrus .col-lg-pull-10 {
    right: 83.33333333%;
  }
  .citrus .col-lg-pull-9 {
    right: 75%;
  }
  .citrus .col-lg-pull-8 {
    right: 66.66666667%;
  }
  .citrus .col-lg-pull-7 {
    right: 58.33333333%;
  }
  .citrus .col-lg-pull-6 {
    right: 50%;
  }
  .citrus .col-lg-pull-5 {
    right: 41.66666667%;
  }
  .citrus .col-lg-pull-4 {
    right: 33.33333333%;
  }
  .citrus .col-lg-pull-3 {
    right: 25%;
  }
  .citrus .col-lg-pull-2 {
    right: 16.66666667%;
  }
  .citrus .col-lg-pull-1 {
    right: 8.33333333%;
  }
  .citrus .col-lg-pull-0 {
    right: auto;
  }
  .citrus .col-lg-push-12 {
    left: 100%;
  }
  .citrus .col-lg-push-11 {
    left: 91.66666667%;
  }
  .citrus .col-lg-push-10 {
    left: 83.33333333%;
  }
  .citrus .col-lg-push-9 {
    left: 75%;
  }
  .citrus .col-lg-push-8 {
    left: 66.66666667%;
  }
  .citrus .col-lg-push-7 {
    left: 58.33333333%;
  }
  .citrus .col-lg-push-6 {
    left: 50%;
  }
  .citrus .col-lg-push-5 {
    left: 41.66666667%;
  }
  .citrus .col-lg-push-4 {
    left: 33.33333333%;
  }
  .citrus .col-lg-push-3 {
    left: 25%;
  }
  .citrus .col-lg-push-2 {
    left: 16.66666667%;
  }
  .citrus .col-lg-push-1 {
    left: 8.33333333%;
  }
  .citrus .col-lg-push-0 {
    left: auto;
  }
  .citrus .col-lg-offset-12 {
    margin-left: 100%;
  }
  .citrus .col-lg-offset-11 {
    margin-left: 91.66666667%;
  }
  .citrus .col-lg-offset-10 {
    margin-left: 83.33333333%;
  }
  .citrus .col-lg-offset-9 {
    margin-left: 75%;
  }
  .citrus .col-lg-offset-8 {
    margin-left: 66.66666667%;
  }
  .citrus .col-lg-offset-7 {
    margin-left: 58.33333333%;
  }
  .citrus .col-lg-offset-6 {
    margin-left: 50%;
  }
  .citrus .col-lg-offset-5 {
    margin-left: 41.66666667%;
  }
  .citrus .col-lg-offset-4 {
    margin-left: 33.33333333%;
  }
  .citrus .col-lg-offset-3 {
    margin-left: 25%;
  }
  .citrus .col-lg-offset-2 {
    margin-left: 16.66666667%;
  }
  .citrus .col-lg-offset-1 {
    margin-left: 8.33333333%;
  }
  .citrus .col-lg-offset-0 {
    margin-left: 0%;
  }
}
.citrus .border-all {
  border: 1px solid #cccccc;
  border-radius: 2px;
}
.citrus .border-top {
  border-top: 1px solid #cccccc;
}
.citrus .border-bottom {
  border-bottom: 1px solid #cccccc;
}
.citrus .border-left {
  border-left: 1px solid #cccccc;
}
.citrus .border-right {
  border-right: 1px solid #cccccc;
}
.citrus.backdrop,
.citrus .backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  outline: none;
  z-index: 900;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NEJBRjUwRjk2MkRFMTFFNEFCRThEMEMzMjQ5ODQzMkEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NEJBRjUwRkE2MkRFMTFFNEFCRThEMEMzMjQ5ODQzMkEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0QkFGNTBGNzYyREUxMUU0QUJFOEQwQzMyNDk4NDMyQSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0QkFGNTBGODYyREUxMUU0QUJFOEQwQzMyNDk4NDMyQSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhuHMKQAAAAPSURBVHjaYlBSUmoACDAAAbcA5/aIYDUAAAAASUVORK5CYII=);
  background-repeat: repeat;
}
.citrus.backdrop:focus,
.citrus .backdrop:focus {
  outline: 0px;
}
.citrus.button,
.citrus .button {
  background-color: #ff6611;
  border: 1px solid #ff6611;
  border-radius: 2px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  font-size: 1rem;
  font-weight: normal;
  line-height: 16px;
  outline: none;
  padding: 9px 15px;
  padding: 0.643rem 1.071rem;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  overflow: visible;
  vertical-align: top;
  zoom: 1;
  position: relative;
  /*----button alignment patterns----*/
  /*----outline buttons----*/
  /*----borderless buttons----*/
  /* Mobile Phone and Portrait Tablet */
  /*---icon only buttons---*/
  /*---count buttons---*/
  /*---disabled buttons----*/
  /*----default block buttons----*/
  /*-----button sizing-----*/
}
.citrus.button i,
.citrus .button i {
  font-size: 16px;
  font-size: 1.143rem;
  line-height: 13px;
  vertical-align: middle;
}
.citrus.button span,
.citrus .button span {
  vertical-align: middle;
}
.citrus.button i + span,
.citrus .button i + span {
  margin-left: 8px;
}
.citrus.button::selection,
.citrus .button::selection {
  background: transparent;
}
.citrus.button::-moz-selection,
.citrus .button::-moz-selection {
  background: transparent;
}
.citrus.button + .button,
.citrus .button + .button {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus.button.left,
.citrus .button.left {
  float: left;
}
.citrus.button.left + .left,
.citrus .button.left + .left {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus.button.right,
.citrus .button.right {
  margin-left: 0;
  float: right;
}
.citrus.button.float-right,
.citrus .button.float-right {
  margin-left: 0;
}
.citrus.button.right + .right,
.citrus .button.right + .right,
.citrus.button.float-right + .button.float-right,
.citrus .button.float-right + .button.float-right,
.citrus.button.float-right + .button-group.float-right,
.citrus .button.float-right + .button-group.float-right {
  margin-right: 15px;
  margin-right: 1.071rem;
}
.citrus.button.full-width + .button,
.citrus .button.full-width + .button {
  margin: 0;
}
.citrus.button.icon + .button.icon,
.citrus .button.icon + .button.icon {
  margin-left: 8px;
  margin-left: 0.571rem;
}
.citrus.button.margin-left,
.citrus .button.margin-left {
  margin-left: 8px;
  margin-left: 0.571rem;
}
.citrus.button.margin-right,
.citrus .button.margin-right {
  margin-right: 8px;
  margin-right: 0.571rem;
}
.citrus.button.outline,
.citrus .button.outline {
  background-color: transparent;
  border-color: #ff6611;
  color: #ff6611;
}
.citrus.button.outline.secondary,
.citrus .button.outline.secondary {
  background-color: transparent;
  border-color: #1588af;
  color: #1588af;
}
.citrus.button.outline.secondary.icon,
.citrus .button.outline.secondary.icon {
  border: 1px solid #1588af;
}
.citrus.button.outline.secondary.icon:hover,
.citrus .button.outline.secondary.icon:hover,
.citrus.button.outline.secondary.icon:focus,
.citrus .button.outline.secondary.icon:focus,
.citrus.button.outline.secondary.icon:active,
.citrus .button.outline.secondary.icon:active {
  border: 1px solid;
}
.citrus.button.outline.secondary.icon:hover:focus,
.citrus .button.outline.secondary.icon:hover:focus,
.citrus.button.outline.secondary.icon:focus:focus,
.citrus .button.outline.secondary.icon:focus:focus,
.citrus.button.outline.secondary.icon:active:focus,
.citrus .button.outline.secondary.icon:active:focus {
  border-color: #1588af;
  background: transparent;
  color: #1588af;
}
.citrus.button.outline.secondary.icon:hover:hover,
.citrus .button.outline.secondary.icon:hover:hover,
.citrus.button.outline.secondary.icon:focus:hover,
.citrus .button.outline.secondary.icon:focus:hover,
.citrus.button.outline.secondary.icon:active:hover,
.citrus .button.outline.secondary.icon:active:hover {
  border-color: #41a8d2;
  background: #41a8d2;
  color: #fff;
}
.citrus.button.outline.secondary.icon:hover:active,
.citrus .button.outline.secondary.icon:hover:active,
.citrus.button.outline.secondary.icon:focus:active,
.citrus .button.outline.secondary.icon:focus:active,
.citrus.button.outline.secondary.icon:active:active,
.citrus .button.outline.secondary.icon:active:active {
  border-color: #085a7e;
  background: #085a7e;
  color: #fff;
}
.citrus.button.outline.secondary.icon.disabled,
.citrus .button.outline.secondary.icon.disabled,
.citrus.button.outline.secondary.icon:disabled,
.citrus .button.outline.secondary.icon:disabled {
  background: transparent;
  color: #cccccc;
  border-color: #cccccc;
}
.citrus.button.outline.secondary.icon.disabled:hover,
.citrus .button.outline.secondary.icon.disabled:hover,
.citrus.button.outline.secondary.icon:disabled:hover,
.citrus .button.outline.secondary.icon:disabled:hover,
.citrus.button.outline.secondary.icon.disabled:focus,
.citrus .button.outline.secondary.icon.disabled:focus,
.citrus.button.outline.secondary.icon:disabled:focus,
.citrus .button.outline.secondary.icon:disabled:focus,
.citrus.button.outline.secondary.icon.disabled:active,
.citrus .button.outline.secondary.icon.disabled:active,
.citrus.button.outline.secondary.icon:disabled:active,
.citrus .button.outline.secondary.icon:disabled:active {
  background: transparent;
  color: #cccccc;
  border-color: #cccccc;
}
.citrus.button.outline.white,
.citrus .button.outline.white {
  border-color: #fff;
  color: #fff;
}
.citrus.button.outline.white:focus,
.citrus .button.outline.white:focus {
  background-color: transparent;
}
.citrus.button.outline.white:hover,
.citrus .button.outline.white:hover {
  border-color: rgba(255, 255, 255, 0.3);
  background-color: transparent;
  background-color: rgba(255, 255, 255, 0.3);
  /* For IE 8*/
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#4cffffff', endColorstr='#4cffffff');
}
.citrus.button.outline.white:active,
.citrus .button.outline.white:active {
  border-color: rgba(34, 34, 34, 0.3);
  background-color: transparent;
  background-color: rgba(34, 34, 34, 0.3);
  /* For IE 8*/
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#4c222222', endColorstr='#4c222222');
}
.citrus.button.outline.disabled,
.citrus .button.outline.disabled {
  color: #cccccc;
  border-color: #cccccc;
}
.citrus.button.outline.disabled:hover,
.citrus .button.outline.disabled:hover {
  border-color: #cccccc;
  background-color: transparent;
}
.citrus.button.borderless,
.citrus .button.borderless {
  background-color: transparent;
  border-color: transparent;
  color: #ff6611;
}
.citrus.button.borderless:hover,
.citrus .button.borderless:hover,
.citrus.button.borderless:focus,
.citrus .button.borderless:focus {
  background-color: transparent;
  border-color: transparent;
  color: #ff9633;
}
.citrus.button.borderless:active,
.citrus .button.borderless:active,
.citrus.button.borderless .loader,
.citrus .button.borderless .loader {
  background-color: transparent;
  border-color: transparent;
  color: #cc3d0c;
}
.citrus.button.borderless.white,
.citrus .button.borderless.white {
  color: #fff;
}
.citrus.button.borderless.white:hover,
.citrus .button.borderless.white:hover {
  color: rgba(255, 255, 255, 0.8);
}
.citrus.button.borderless.white:active,
.citrus .button.borderless.white:active {
  color: rgba(255, 255, 255, 0.8);
}
.citrus.button.borderless.secondary,
.citrus .button.borderless.secondary {
  background-color: transparent;
  border-color: transparent;
  color: #1588af;
}
.citrus.button.borderless.secondary:hover,
.citrus .button.borderless.secondary:hover,
.citrus.button.borderless.secondary:focus,
.citrus .button.borderless.secondary:focus {
  background-color: transparent;
  border-color: transparent;
  color: #41a8d2;
}
.citrus.button.borderless.secondary:active,
.citrus .button.borderless.secondary:active,
.citrus.button.borderless.secondary .loader,
.citrus .button.borderless.secondary .loader {
  background-color: transparent;
  border-color: transparent;
  color: #085a7e;
}
.citrus.button.borderless.disabled,
.citrus .button.borderless.disabled,
.citrus.button.borderless:disabled,
.citrus .button.borderless:disabled {
  border-color: transparent;
  color: #cccccc;
}
.citrus.button.borderless.disabled:hover,
.citrus .button.borderless.disabled:hover,
.citrus.button.borderless:disabled:hover,
.citrus .button.borderless:disabled:hover,
.citrus.button.borderless.disabled:focus,
.citrus .button.borderless.disabled:focus,
.citrus.button.borderless:disabled:focus,
.citrus .button.borderless:disabled:focus {
  border-color: transparent;
  color: #cccccc;
}
.citrus.button.borderless.disabled:active,
.citrus .button.borderless.disabled:active,
.citrus.button.borderless:disabled:active,
.citrus .button.borderless:disabled:active {
  border-color: transparent;
  color: #cccccc;
}
@media screen and (max-width: 1024px) {
  .citrus.button.borderless:active,
  .citrus .button.borderless:active {
    background-color: #cc3d0c;
    border-color: #cc3d0c;
    color: #fff;
  }
  .citrus.button.borderless.secondary:active,
  .citrus .button.borderless.secondary:active {
    background-color: #085a7e;
    border-color: #085a7e;
    color: #fff;
  }
}
.citrus.button.icon,
.citrus .button.icon {
  padding: 7px 7px;
  padding: 0.5rem 0.5rem;
  background-color: transparent;
  border-color: transparent;
  color: #222222;
  /* Mobile Phone and Portrait Tablet */
}
.citrus.button.icon i,
.citrus .button.icon i {
  font-size: 20px;
  line-height: 1;
}
.citrus.button.icon:hover,
.citrus .button.icon:hover,
.citrus.button.icon:focus,
.citrus .button.icon:focus {
  background-color: transparent;
  border-color: transparent;
  color: #a6a6a6;
}
.citrus.button.icon:active,
.citrus .button.icon:active {
  background-color: transparent;
  border-color: transparent;
  color: #222222;
}
.citrus.button.icon.secondary,
.citrus .button.icon.secondary {
  background-color: transparent;
  border-color: transparent;
  color: #1588af;
}
.citrus.button.icon.secondary:hover,
.citrus .button.icon.secondary:hover,
.citrus.button.icon.secondary:focus,
.citrus .button.icon.secondary:focus {
  background-color: transparent;
  border-color: transparent;
  color: #41a8d2;
}
.citrus.button.icon.secondary:active,
.citrus .button.icon.secondary:active {
  background-color: transparent;
  border-color: transparent;
  color: #085a7e;
}
.citrus.button.icon.white,
.citrus .button.icon.white {
  background-color: transparent;
  border-color: transparent;
  color: #fff;
}
.citrus.button.icon.white:hover,
.citrus .button.icon.white:hover,
.citrus.button.icon.white:focus,
.citrus .button.icon.white:focus {
  border-color: rgba(255, 255, 255, 0.3);
  background-color: transparent;
  background-color: rgba(255, 255, 255, 0.3);
  /* For IE 8*/
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#4cffffff', endColorstr='#4cffffff');
}
.citrus.button.icon.white:active,
.citrus .button.icon.white:active {
  border-color: rgba(34, 34, 34, 0.3);
  background-color: transparent;
  background-color: rgba(34, 34, 34, 0.3);
  /* For IE 8*/
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#4c222222', endColorstr='#4c222222');
}
.citrus.button.icon.disabled,
.citrus .button.icon.disabled,
.citrus.button.icon.disabled:hover,
.citrus .button.icon.disabled:hover,
.citrus.button.icon.disabled:active,
.citrus .button.icon.disabled:active {
  color: #cccccc;
  background-color: transparent;
  border-color: transparent;
}
@media screen and (max-width: 1024px) {
  .citrus.button.icon.icon:active,
  .citrus .button.icon.icon:active {
    background-color: #393939;
    border-color: #393939;
    color: #fff;
  }
  .citrus.button.icon.icon.secondary:active,
  .citrus .button.icon.icon.secondary:active {
    background-color: #085a7e;
    border-color: #085a7e;
    color: #fff;
  }
}
.citrus.button.count,
.citrus .button.count {
  border-radius: 14px;
  font-size: 12px;
  font-size: 0.857rem;
  line-height: 1;
  padding: 7px 8px;
  padding: 0.5rem 0.571rem;
  min-width: 28px;
}
.citrus.button.count.disabled,
.citrus .button.count.disabled {
  cursor: pointer;
}
.citrus.button.count:hover,
.citrus .button.count:hover,
.citrus.button.count:focus,
.citrus .button.count:focus,
.citrus.button.count:active,
.citrus .button.count:active {
  background-color: #ff6611;
  border-color: #ff6611;
  color: #fff;
}
.citrus.button.count.secondary.outline:hover,
.citrus .button.count.secondary.outline:hover,
.citrus.button.count.secondary.outline:focus,
.citrus .button.count.secondary.outline:focus,
.citrus.button.count.secondary.outline:active,
.citrus .button.count.secondary.outline:active {
  background-color: transparent;
  border-color: #1588af;
  color: #1588af;
}
.citrus.button.count.size-xsmall,
.citrus .button.count.size-xsmall {
  min-width: 20px;
  padding: 3px 6px;
  padding: 0.214rem 0.429rem;
  border-color: #fff;
}
.citrus.button.count.error,
.citrus .button.count.error {
  background-color: #c8102e;
  border-color: #c8102e;
}
.citrus.button .button.count,
.citrus .button .button.count {
  line-height: 1;
  margin-bottom: -10px;
  margin-top: -14px;
}
.citrus.button.disabled,
.citrus .button.disabled,
.citrus.button:disabled,
.citrus .button:disabled {
  background-color: transparent;
  color: #cccccc;
  border-color: #cccccc;
  cursor: not-allowed;
}
.citrus.button.disabled:hover,
.citrus .button.disabled:hover,
.citrus.button:disabled:hover,
.citrus .button:disabled:hover,
.citrus.button.disabled:focus,
.citrus .button.disabled:focus,
.citrus.button:disabled:focus,
.citrus .button:disabled:focus {
  color: #cccccc;
  border-color: #cccccc;
  background-color: transparent;
}
.citrus.button.disabled:active,
.citrus .button.disabled:active,
.citrus.button:disabled:active,
.citrus .button:disabled:active {
  color: #cccccc;
  border-color: #cccccc;
  background-color: transparent;
}
.citrus.button:hover,
.citrus .button:hover,
.citrus.button:focus,
.citrus .button:focus {
  background-color: #ff9633;
  border-color: #ff9633;
  color: #fff;
}
.citrus.button:active,
.citrus .button:active {
  background-color: #cc3d0c;
  border-color: #cc3d0c;
}
.citrus.button.secondary,
.citrus .button.secondary {
  background-color: #1588af;
  border-color: #1588af;
}
.citrus.button.secondary:hover,
.citrus .button.secondary:hover,
.citrus.button.secondary:focus,
.citrus .button.secondary:focus {
  background-color: #41a8d2;
  border-color: #41a8d2;
  color: #fff;
}
.citrus.button.secondary:active,
.citrus .button.secondary:active {
  background-color: #085a7e;
  border-color: #085a7e;
  color: #fff;
}
.citrus.button.secondary.disabled:hover,
.citrus .button.secondary.disabled:hover,
.citrus.button.secondary:disabled:hover,
.citrus .button.secondary:disabled:hover,
.citrus.button.secondary.disabled:focus,
.citrus .button.secondary.disabled:focus,
.citrus.button.secondary:disabled:focus,
.citrus .button.secondary:disabled:focus,
.citrus.button.secondary.disabled:active,
.citrus .button.secondary.disabled:active,
.citrus.button.secondary:disabled:active,
.citrus .button.secondary:disabled:active {
  background-color: transparent;
}
.citrus.button#tour-button,
.citrus .button#tour-button {
  border-radius: 0 0 2px 2px;
  background-color: #2eab73;
  border-color: #2eab73;
}
.citrus.button#tour-button:hover,
.citrus .button#tour-button:hover,
.citrus.button#tour-button:focus,
.citrus .button#tour-button:focus {
  background-color: #79e482;
  border-color: #79e482;
}
.citrus.button#tour-button:active,
.citrus .button#tour-button:active {
  background-color: #146b4d;
  border-color: #146b4d;
}
.citrus.button.size-small,
.citrus .button.size-small {
  font-size: 12px;
  font-size: 0.857rem;
  line-height: 1;
  padding: 7px 12px;
  padding: 0.5rem 0.857rem;
}
.citrus.button.size-small i,
.citrus .button.size-small i {
  font-size: 12px;
  font-size: 0.857rem;
  line-height: 1;
  display: inline-block;
  margin-top: -3px;
}
.citrus.button.size-small span,
.citrus .button.size-small span {
  line-height: 12px;
  display: inline-block;
  margin-top: -3px;
}
.citrus.button.size-small.icon,
.citrus .button.size-small.icon {
  padding: 5px 5px;
  padding: 0.357rem 0.357rem;
}
.citrus.button.size-small.icon i,
.citrus .button.size-small.icon i {
  font-size: 16px;
  font-size: 1.143rem;
  line-height: 1;
  margin-top: 0;
}
.citrus.button.size-medium,
.citrus .button.size-medium {
  font-size: 14px;
  font-size: 1rem;
  line-height: 16px;
  padding: 9px 15px;
  padding: 0.643rem 1.071rem;
}
.citrus.button.size-medium i,
.citrus .button.size-medium i {
  font-size: 16px;
  font-size: 1.143rem;
  line-height: 13px;
  display: inline-block;
  margin-top: -2px;
}
.citrus.button.size-medium span,
.citrus .button.size-medium span {
  line-height: 13px;
  display: inline-block;
  margin-top: -2px;
}
.citrus.button.size-medium.icon,
.citrus .button.size-medium.icon {
  padding: 7px 7px;
  padding: 0.5rem 0.5rem;
}
.citrus.button.size-medium.icon i,
.citrus .button.size-medium.icon i {
  font-size: 20px;
  font-size: 1.429rem;
  line-height: 1;
  margin-top: 0;
}
.citrus.button.size-large,
.citrus .button.size-large {
  font-size: 18px;
  font-size: 1.286rem;
  line-height: 20px;
  padding: 11px 17px;
  padding: 0.786rem 1.214rem;
}
.citrus.button.size-large i,
.citrus .button.size-large i {
  font-size: 20px;
  font-size: 1.429rem;
  line-height: 16px;
  display: inline-block;
  margin-top: -4px;
}
.citrus.button.size-large span,
.citrus .button.size-large span {
  line-height: 16px;
  display: inline-block;
  margin-top: -4px;
}
.citrus.button.size-large.icon,
.citrus .button.size-large.icon {
  padding: 7px 7px;
  padding: 0.5rem 0.5rem;
}
.citrus.button.size-large.icon i,
.citrus .button.size-large.icon i {
  font-size: 28px;
  font-size: 2rem;
  line-height: 1;
  margin-top: 0;
}
.citrus.button.full-width,
.citrus .button.full-width {
  text-align: center;
  margin: 0;
  width: 100%;
}
.citrus.button.full-width:before,
.citrus .button.full-width:before,
.citrus.button.full-width:after,
.citrus .button.full-width:after {
  content: " ";
  display: table;
}
.citrus.button.full-width:after,
.citrus .button.full-width:after {
  clear: both;
}
@media only screen and (max-width: 699px) {
  .citrus.button.full-width-mobile,
  .citrus .button.full-width-mobile {
    text-align: center;
    margin: 0;
    width: 100%;
    float: none;
  }
  .citrus.button.full-width-mobile:before,
  .citrus .button.full-width-mobile:before,
  .citrus.button.full-width-mobile:after,
  .citrus .button.full-width-mobile:after {
    content: " ";
    display: table;
  }
  .citrus.button.full-width-mobile:after,
  .citrus .button.full-width-mobile:after {
    clear: both;
  }
}
.citrus.button.padding-none,
.citrus .button.padding-none {
  padding: 0;
}
.citrus.button.disabled,
.citrus .button.disabled,
.citrus.button:disabled,
.citrus .button:disabled {
  background-color: transparent;
  border-color: #cccccc;
  color: #cccccc;
  cursor: not-allowed;
}
.citrus.button.disabled:hover,
.citrus .button.disabled:hover,
.citrus.button:disabled:hover,
.citrus .button:disabled:hover,
.citrus.button.disabled:focus,
.citrus .button.disabled:focus,
.citrus.button:disabled:focus,
.citrus .button:disabled:focus {
  background-color: transparent;
  border-color: #cccccc;
  color: #cccccc;
}
.citrus.button.disabled:active,
.citrus .button.disabled:active,
.citrus.button:disabled:active,
.citrus .button:disabled:active {
  background-color: transparent;
  border-color: #cccccc;
  color: #cccccc;
}
.citrus.button .loader,
.citrus .button .loader {
  color: #cc3d0c;
  background: #cc3d0c;
  border-color: #cc3d0c;
}
.citrus.button:hover .loader,
.citrus .button:hover .loader,
.citrus.button:focus .loader,
.citrus .button:focus .loader,
.citrus.button:active .loader,
.citrus .button:active .loader {
  border-color: #cc3d0c;
}
.citrus.button.secondary .loader,
.citrus .button.secondary .loader {
  background: #085a7e;
  border-color: #085a7e;
}
.citrus.button .emblem,
.citrus .button .emblem {
  border: none;
  margin: -2px 4px -2px 0;
  margin: -0.143rem 0.286rem -0.143rem 0;
  padding: 0 8px;
  padding: 0 0.571rem;
  font-size: 12px;
  font-size: 0.857rem;
  font-weight: normal;
  background: #fff;
  color: #ff6611;
}
.citrus.button .emblem.size-xsmall,
.citrus .button .emblem.size-xsmall {
  line-height: 20px;
  width: auto;
  min-width: 20px;
  border-radius: 20px;
}
.citrus.button:hover .emblem,
.citrus .button:hover .emblem,
.citrus.button:focus .emblem,
.citrus .button:focus .emblem {
  color: #ff9633;
}
.citrus.button:active .emblem,
.citrus .button:active .emblem {
  color: #cc3d0c;
}
.citrus.button.secondary .emblem,
.citrus .button.secondary .emblem {
  background: #fff;
  color: #1588af;
}
.citrus.button.secondary:hover .emblem,
.citrus .button.secondary:hover .emblem,
.citrus.button.secondary:focus .emblem,
.citrus .button.secondary:focus .emblem {
  color: #41a8d2;
}
.citrus.button.secondary:active .emblem,
.citrus .button.secondary:active .emblem {
  color: #085a7e;
}
.citrus.button.secondary.borderless .emblem,
.citrus .button.secondary.borderless .emblem {
  background: #1588af;
  color: #fff;
}
.citrus.button.secondary.borderless:hover .emblem,
.citrus .button.secondary.borderless:hover .emblem,
.citrus.button.secondary.borderless:focus .emblem,
.citrus .button.secondary.borderless:focus .emblem {
  background: #41a8d2;
}
.citrus.button.secondary.borderless:active .emblem,
.citrus .button.secondary.borderless:active .emblem {
  background: #085a7e;
}
.citrus.button.secondary.outline .emblem,
.citrus .button.secondary.outline .emblem {
  background: #1588af;
  color: #fff;
}
.citrus.button.secondary.outline:hover .emblem,
.citrus .button.secondary.outline:hover .emblem,
.citrus.button.secondary.outline:focus .emblem,
.citrus .button.secondary.outline:focus .emblem {
  background: #fff;
  color: #41a8d2;
}
.citrus.button.secondary.outline:active .emblem,
.citrus .button.secondary.outline:active .emblem {
  background: #fff;
  color: #085a7e;
}
.citrus.button.secondary.disabled .emblem,
.citrus .button.secondary.disabled .emblem,
.citrus.button.secondary:disabled .emblem,
.citrus .button.secondary:disabled .emblem {
  background: #cccccc;
  color: #fff;
}
.citrus.button.secondary.disabled:hover .emblem,
.citrus .button.secondary.disabled:hover .emblem,
.citrus.button.secondary:disabled:hover .emblem,
.citrus .button.secondary:disabled:hover .emblem,
.citrus.button.secondary.disabled:focus .emblem,
.citrus .button.secondary.disabled:focus .emblem,
.citrus.button.secondary:disabled:focus .emblem,
.citrus .button.secondary:disabled:focus .emblem,
.citrus.button.secondary.disabled:active .emblem,
.citrus .button.secondary.disabled:active .emblem,
.citrus.button.secondary:disabled:active .emblem,
.citrus .button.secondary:disabled:active .emblem {
  background: #cccccc;
  color: #fff;
}
.citrus.button.outline .emblem,
.citrus .button.outline .emblem {
  background: #ff6611;
  color: #fff;
}
.citrus.button.outline:hover .emblem,
.citrus .button.outline:hover .emblem,
.citrus.button.outline:focus .emblem,
.citrus .button.outline:focus .emblem {
  background: #fff;
  color: #ff9633;
}
.citrus.button.outline:active .emblem,
.citrus .button.outline:active .emblem {
  background: #fff;
  color: #cc3d0c;
}
.citrus.button.borderless .emblem,
.citrus .button.borderless .emblem {
  background: #ff6611;
  color: #fff;
}
.citrus.button.borderless:hover .emblem,
.citrus .button.borderless:hover .emblem,
.citrus.button.borderless:focus .emblem,
.citrus .button.borderless:focus .emblem {
  background: #ff9633;
}
.citrus.button.borderless:active .emblem,
.citrus .button.borderless:active .emblem {
  background: #cc3d0c;
}
.citrus.button.disabled .emblem,
.citrus .button.disabled .emblem,
.citrus.button:disabled .emblem,
.citrus .button:disabled .emblem {
  background: #cccccc;
  color: #fff;
}
.citrus.button.disabled:hover .emblem,
.citrus .button.disabled:hover .emblem,
.citrus.button:disabled:hover .emblem,
.citrus .button:disabled:hover .emblem,
.citrus.button.disabled:focus .emblem,
.citrus .button.disabled:focus .emblem,
.citrus.button:disabled:focus .emblem,
.citrus .button:disabled:focus .emblem,
.citrus.button.disabled:active .emblem,
.citrus .button.disabled:active .emblem,
.citrus.button:disabled:active .emblem,
.citrus .button:disabled:active .emblem {
  background: #cccccc;
  color: #fff;
}
.citrus .button + .button-group {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus .button-group {
  display: inline-block;
  padding: 0;
}
.citrus .button-group + .button,
.citrus .button-group + .button-group {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus .button-group.float-right {
  margin-left: 0;
}
.citrus .button-group.float-right + .button.float-right {
  margin-left: 0;
  margin-right: 15px;
  margin-right: 1.071rem;
}
.citrus .button-group .button {
  margin: 0;
  border-radius: 0;
  float: left;
}
.citrus .button-group .button:first-child {
  border-radius: 2px 0 0 2px;
}
.citrus .button-group .button:not(:first-child) {
  margin-left: -1px;
}
.citrus .button-group .button:last-child {
  border-radius: 0 2px 2px 0;
}
.citrus .button-group .button.icon + .button.icon {
  margin-left: -1px;
}
.citrus .button-group .button.secondary.outline:focus {
  background: transparent;
  color: #1588af;
}
.citrus .button-group .button.secondary.outline:active {
  background: #085a7e;
  color: #fff;
}
.citrus .button-group .button.secondary.outline.disabled {
  border-color: #1588af;
}
.citrus .button-group .button.secondary.outline.disabled:focus {
  background: transparent;
  color: #cccccc;
}
.citrus .button-group .button.secondary.outline.icon {
  border: 1px solid #1588af;
}
.citrus .button-group .button.secondary.outline.icon:hover {
  background: #41a8d2;
  color: #fff;
}
.citrus .button-group .button.secondary.outline.icon:active {
  background: #085a7e;
  color: #fff;
}
.citrus .button-group .button.secondary.outline.icon.disabled:hover,
.citrus .button-group .button.secondary.outline.icon.disabled:focus,
.citrus .button-group .button.secondary.outline.icon.disabled:active {
  background: transparent;
  color: #cccccc;
  border-color: #1588af;
}
.citrus.card,
.citrus .card {
  background: #fff;
  border: 1px solid #cccccc;
  box-sizing: border-box;
  color: #222222;
  display: block;
  margin: 0 auto;
  margin-bottom: 20px;
  margin-bottom: 1.429rem;
  /*Card sizes to override default 100% width. For use in non-responsive settings.*/
}
.citrus.card.size-small,
.citrus .card.size-small {
  width: 97%;
  max-width: 400px;
  max-width: 28.571rem;
}
.citrus.card.size-medium,
.citrus .card.size-medium {
  width: 97%;
  max-width: 820px;
  max-width: 58.571rem;
}
.citrus.card.size-large,
.citrus .card.size-large {
  width: 97%;
  max-width: 1240px;
  max-width: 88.571rem;
}
.citrus.card .card-header,
.citrus .card .card-header {
  padding: 12px 15px;
  padding: 0.857rem 1.071rem;
  position: relative;
}
.citrus.card .card-header a,
.citrus .card .card-header a {
  display: block;
  text-decoration: none;
  color: #222222;
}
.citrus.card .card-header a:hover,
.citrus .card .card-header a:hover,
.citrus.card .card-header a:active,
.citrus .card .card-header a:active,
.citrus.card .card-header a:visited,
.citrus .card .card-header a:visited {
  text-decoration: none;
  color: #222222;
}
.citrus.card .card-header .header-icon,
.citrus .card .card-header .header-icon {
  position: absolute;
  top: 18px;
  top: 1.286rem;
  left: 15px;
  left: 1.071rem;
}
.citrus.card .card-header .header-icon .size-large,
.citrus .card .card-header .header-icon .size-large {
  font-size: 24px;
}
.citrus.card .card-header h2,
.citrus .card .card-header h2,
.citrus.card .card-header .h2,
.citrus .card .card-header .h2 {
  display: block;
  overflow: hidden;
  padding: 0px 0px 0px 30px;
  padding: 0rem 0rem 0rem 2.143rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 85%;
}
.citrus.card .card-header .card-toggle,
.citrus .card .card-header .card-toggle {
  position: absolute;
  display: block;
  font-size: 20px;
  font-size: 1.429rem;
  text-decoration: none;
  top: 20px;
  top: 1.429rem;
  right: 16px;
  right: 1.143rem;
}
.citrus.card .card-header + section .card-content:first-child,
.citrus .card .card-header + section .card-content:first-child {
  margin-top: 0;
}
.citrus.card h3,
.citrus .card h3,
.citrus.card .card-subheader,
.citrus .card .card-subheader {
  margin: 0px 15px;
  margin: 0rem 1.071rem;
}
.citrus.card h3 + .card-content,
.citrus .card h3 + .card-content,
.citrus.card .card-subheader + .card-content,
.citrus .card .card-subheader + .card-content {
  margin-top: 0;
}
.citrus.card h3 + .banner-message,
.citrus .card h3 + .banner-message,
.citrus.card .card-subheader + .banner-message,
.citrus .card .card-subheader + .banner-message {
  margin-top: 7px;
  margin-top: 0.5rem;
}
.citrus.card .card-content,
.citrus .card .card-content {
  overflow: hidden;
  margin: 10px 15px;
  margin: 0.714rem 1.071rem;
}
.citrus.card .card-content .link,
.citrus .card .card-content .link {
  display: block;
  margin: 4px 0px;
  margin: 0.286rem 0rem;
  overflow: hidden;
  padding: 6px 0px;
  padding: 0.429rem 0rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.citrus.card .card-content .link:first-child,
.citrus .card .card-content .link:first-child {
  margin-top: 0;
  padding-top: 0;
}
.citrus.card .card-content.logo,
.citrus .card .card-content.logo {
  border: 1px solid #cccccc;
  border-radius: 2px;
  margin: 15px;
  margin: 1.071rem;
  padding: 15px;
  padding: 1.071rem;
  text-align: center;
}
.citrus.card .card-content p + p,
.citrus .card .card-content p + p {
  margin-top: 9px;
  margin-top: 0.643rem;
}
.citrus.card .card-content .form-group,
.citrus .card .card-content .form-group {
  margin: 10px 0px 5px 0px;
  margin: 0.714rem 0rem 0.357rem 0rem;
}
.citrus.card .card-content .k-form-group,
.citrus .card .card-content .k-form-group {
  margin: 10px 0px 5px 0px;
  margin: 0.714rem 0rem 0.357rem 0rem;
}
.citrus.card .card-content .toggle-group,
.citrus .card .card-content .toggle-group {
  margin: 10px 0px 5px 0px;
  margin: 0.714rem 0rem 0.357rem 0rem;
}
.citrus.card .card-actions,
.citrus .card .card-actions {
  margin: 0px 15px 15px 15px;
  margin: 0rem 1.071rem 1.071rem 1.071rem;
}
.citrus.card .card-actions .button,
.citrus .card .card-actions .button {
  margin-top: 12px;
  margin-top: 0.857rem;
}
.citrus.card .card-actions + .card-content,
.citrus .card .card-actions + .card-content {
  margin-top: 0;
}
.citrus.banner-message,
.citrus .banner-message {
  padding: 8px 8px 8px 45px;
  padding: 0.571rem 0.571rem 0.571rem 3.214rem;
  position: relative;
  overflow: hidden;
}
.citrus.banner-message:before,
.citrus .banner-message:before,
.citrus.banner-message:after,
.citrus .banner-message:after {
  content: " ";
  display: table;
}
.citrus.banner-message:after,
.citrus .banner-message:after {
  clear: both;
}
@media screen and (max-width: 699px) {
  .citrus.banner-message,
  .citrus .banner-message {
    padding: 8px 8px 8px 35px;
    padding: 0.571rem 0.571rem 0.571rem 2.5rem;
  }
}
.citrus.banner-message + h3,
.citrus .banner-message + h3,
.citrus.banner-message + .card-subheader,
.citrus .banner-message + .card-subheader {
  margin-top: 7px;
  margin-top: 0.5rem;
}
.citrus.banner-message + .card-content .link:first-child,
.citrus .banner-message + .card-content .link:first-child {
  margin-top: 6px;
  margin-top: 0.429rem;
}
.citrus.banner-message + .card-actions,
.citrus .banner-message + .card-actions {
  margin-top: 15px;
  margin-top: 1.071rem;
}
.citrus.banner-message + .modal-body,
.citrus .banner-message + .modal-body {
  border-width: 0 0 1px 0;
}
.citrus.banner-message [class^="icon-"],
.citrus .banner-message [class^="icon-"] {
  display: block;
  float: left;
  padding: 3px 10px 0 0;
}
.citrus.banner-message .icon.button,
.citrus .banner-message .icon.button {
  padding: 5px 5px;
  padding: 0.357rem 0.357rem;
}
.citrus.banner-message .icon.button i,
.citrus .banner-message .icon.button i {
  font-size: 16px;
}
.citrus.banner-message .icon.button [class^="icon-"],
.citrus .banner-message .icon.button [class^="icon-"] {
  float: none;
  padding: 0px;
  padding: 0rem;
}
.citrus.banner-message.reminder,
.citrus .banner-message.reminder {
  padding: 9px 15px;
  padding: 0.643rem 1.071rem;
  background: #f5f5f5;
  border-color: #cccccc;
  border-style: solid;
  border-width: 1px 0px 1px 0px;
}
.citrus.banner-message.reminder a,
.citrus .banner-message.reminder a {
  color: #1588af;
}
.citrus.banner-message.borderless,
.citrus .banner-message.borderless {
  border: none;
}
.citrus.banner-message a,
.citrus .banner-message a {
  color: #fff;
}
.citrus.banner-message.information,
.citrus .banner-message.information {
  color: #fff;
  background: #41a8d2;
}
.citrus.banner-message.information:before,
.citrus .banner-message.information:before {
  display: inline-block;
  color: #fff;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  left: 15px;
  left: 1.071rem;
  line-height: 1.4;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e600";
}
@media screen and (max-width: 699px) {
  .citrus.banner-message.information:before,
  .citrus .banner-message.information:before {
    font-size: 14px;
    font-size: 1rem;
    left: 10px;
    line-height: 1.2;
    top: 10px;
    top: 0.714rem;
  }
}
.citrus.banner-message.success,
.citrus .banner-message.success {
  color: #fff;
  background: #3dc270;
}
.citrus.banner-message.success:before,
.citrus .banner-message.success:before {
  display: inline-block;
  color: #fff;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  left: 15px;
  left: 1.071rem;
  line-height: 1.4;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e60d";
}
@media screen and (max-width: 699px) {
  .citrus.banner-message.success:before,
  .citrus .banner-message.success:before {
    font-size: 14px;
    font-size: 1rem;
    left: 10px;
    line-height: 1.2;
    top: 10px;
    top: 0.714rem;
  }
}
.citrus.banner-message.warning,
.citrus .banner-message.warning {
  color: #fff;
  background: #ff8800;
}
.citrus.banner-message.warning:before,
.citrus .banner-message.warning:before {
  display: inline-block;
  color: #fff;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  left: 15px;
  left: 1.071rem;
  line-height: 1.4;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e60f";
}
@media screen and (max-width: 699px) {
  .citrus.banner-message.warning:before,
  .citrus .banner-message.warning:before {
    font-size: 14px;
    font-size: 1rem;
    left: 10px;
    line-height: 1.2;
    top: 10px;
    top: 0.714rem;
  }
}
.citrus.banner-message.error,
.citrus .banner-message.error {
  color: #fff;
  background: #c8102e;
}
.citrus.banner-message.error:before,
.citrus .banner-message.error:before {
  display: inline-block;
  color: #fff;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  left: 15px;
  left: 1.071rem;
  line-height: 1.4;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e64f";
}
@media screen and (max-width: 699px) {
  .citrus.banner-message.error:before,
  .citrus .banner-message.error:before {
    font-size: 14px;
    font-size: 1rem;
    left: 10px;
    line-height: 1.2;
    top: 10px;
    top: 0.714rem;
  }
}
.citrus.banner-message p,
.citrus .banner-message p {
  display: table-cell;
  padding: 3px 0;
  padding: 0.214rem 0;
}
@media screen and (max-width: 699px) {
  .citrus.banner-message p,
  .citrus .banner-message p {
    line-height: 1.2;
  }
}
.citrus.banner-message p span,
.citrus .banner-message p span {
  font-weight: normal;
}
@media screen and (max-width: 699px) {
  .citrus.banner-message p span,
  .citrus .banner-message p span {
    font-weight: bold;
  }
}
.citrus.banner-message .banner-actions,
.citrus .banner-message .banner-actions {
  display: table-cell;
  clear: none;
  vertical-align: top;
  height: 100%;
  float: right;
  margin-top: 0;
  margin-left: 15px;
}
@media screen and (max-width: 699px) {
  .citrus.banner-message .banner-actions,
  .citrus .banner-message .banner-actions {
    margin-bottom: -3px;
    margin-top: -1px;
  }
  .citrus.banner-message .banner-actions .banner-dismiss,
  .citrus .banner-message .banner-actions .banner-dismiss,
  .citrus.banner-message .banner-actions .paging,
  .citrus .banner-message .banner-actions .paging {
    display: block;
    margin: 0 auto;
    font-size: 12px;
  }
}
.citrus.banner-message .banner-actions p,
.citrus .banner-message .banner-actions p {
  display: inline-block;
}
.citrus .banner-message + .banner-message {
  margin-top: 1px;
}
.citrus .card .banner-message .banner-actions,
.citrus.card .banner-message .banner-actions {
  margin-left: 5px;
  margin-left: 0.357rem;
}
@media screen and (max-width: 699px) {
  .citrus .card .banner-message .banner-actions,
  .citrus.card .banner-message .banner-actions {
    margin-bottom: -4px;
    margin-top: -4px;
  }
}
@media screen and (max-width: 699px) {
  .citrus .card .banner-message,
  .citrus.card .banner-message {
    padding: 8px 8px 8px 35px;
    padding: 0.571rem 0.571rem 0.571rem 2.5rem;
  }
  .citrus .card .banner-message.information:before,
  .citrus.card .banner-message.information:before,
  .citrus .card .banner-message.success:before,
  .citrus.card .banner-message.success:before,
  .citrus .card .banner-message.error:before,
  .citrus.card .banner-message.error:before,
  .citrus .card .banner-message.warning:before,
  .citrus.card .banner-message.warning:before {
    display: block;
  }
  .citrus .card .banner-message.information:before,
  .citrus.card .banner-message.information:before {
    content: "\e600";
  }
  .citrus .card .banner-message.success:before,
  .citrus.card .banner-message.success:before {
    content: "\e60d";
  }
  .citrus .card .banner-message.error:before,
  .citrus.card .banner-message.error:before {
    content: "\e64f";
  }
  .citrus .card .banner-message.warning:before,
  .citrus.card .banner-message.warning:before {
    content: "\e60f";
  }
  .citrus .card .banner-message.reminder,
  .citrus.card .banner-message.reminder {
    padding: 9px 15px;
    padding: 0.643rem 1.071rem;
  }
}
@media screen and (max-width: 699px) {
  .citrus .modal .banner-message {
    padding: 8px 8px 8px 35px;
    padding: 0.571rem 0.571rem 0.571rem 2.5rem;
  }
}
.citrus input:-ms-input-placeholder {
  color: #a6a6a6;
}
.citrus input[disabled='disabled']::-ms-value {
  color: #666666;
}
.citrus select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #222222;
}
.citrus.form-inline .form-group,
.citrus .form-inline .form-group,
.citrus.form-inline .k-form-group,
.citrus .form-inline .k-form-group {
  float: right;
  margin: 0px;
  width: 49%;
}
.citrus.form-inline .form-group:first-child,
.citrus .form-inline .form-group:first-child,
.citrus.form-inline .k-form-group:first-child,
.citrus .form-inline .k-form-group:first-child {
  float: left;
}
.citrus.form-inline.inline-7030 .form-group,
.citrus .form-inline.inline-7030 .form-group,
.citrus.form-inline.inline-7030 .k-form-group,
.citrus .form-inline.inline-7030 .k-form-group {
  float: right;
  margin: 0px;
  width: 30%;
}
.citrus.form-inline.inline-7030 .form-group:first-child,
.citrus .form-inline.inline-7030 .form-group:first-child,
.citrus.form-inline.inline-7030 .k-form-group:first-child,
.citrus .form-inline.inline-7030 .k-form-group:first-child {
  float: left;
  width: 68%;
}
.citrus.form-inline.inline-3070 .form-group,
.citrus .form-inline.inline-3070 .form-group,
.citrus.form-inline.inline-3070 .k-form-group,
.citrus .form-inline.inline-3070 .k-form-group {
  float: right;
  margin: 0px;
  width: 68%;
}
.citrus.form-inline.inline-3070 .form-group:first-child,
.citrus .form-inline.inline-3070 .form-group:first-child,
.citrus.form-inline.inline-3070 .k-form-group:first-child,
.citrus .form-inline.inline-3070 .k-form-group:first-child {
  float: left;
  width: 30%;
}
.citrus.form-inline.size-small,
.citrus .form-inline.size-small {
  width: 97%;
  max-width: 400px;
  max-width: 28.571rem;
}
.citrus.form-inline.size-medium,
.citrus .form-inline.size-medium {
  width: 97%;
  max-width: 820px;
  max-width: 58.571rem;
}
.citrus.form-inline.size-large,
.citrus .form-inline.size-large {
  width: 97%;
  max-width: 1240px;
  max-width: 88.571rem;
}
.citrus.form-group,
.citrus .form-group {
  display: inline-block;
  padding: 0px 0px 24px 0px;
  padding: 0rem 0rem 1.714rem 0rem;
  position: relative;
  width: 100%;
  vertical-align: top;
}
.citrus.form-group.padding-small,
.citrus .form-group.padding-small {
  padding-bottom: 12px;
  padding-bottom: 0.857rem;
}
.citrus.form-group.padding-none,
.citrus .form-group.padding-none {
  padding: 0;
}
.citrus.form-group div.select,
.citrus .form-group div.select {
  position: relative;
}
.citrus.form-group div.select:after,
.citrus .form-group div.select:after {
  background: #fff;
  border-radius: 2px;
  content: "\e63a";
  font-family: 'PaylocityIcons';
  font-style: normal;
  font-size: 14px;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 34px;
  pointer-events: none;
  position: absolute;
  right: 1px;
  text-align: center;
  top: 1px;
  height: 34px;
  width: 30px;
}
.citrus.form-group > input[type=text],
.citrus .form-group > input[type=text],
.citrus.form-group > input:not([type]),
.citrus .form-group > input:not([type]),
.citrus.form-group > input[type=url],
.citrus .form-group > input[type=url],
.citrus.form-group > input[type=email],
.citrus .form-group > input[type=email],
.citrus.form-group > input[type=number],
.citrus .form-group > input[type=number],
.citrus.form-group > input[type=time],
.citrus .form-group > input[type=time],
.citrus.form-group > input[type=tel],
.citrus .form-group > input[type=tel],
.citrus.form-group > input[type=datetime],
.citrus .form-group > input[type=datetime],
.citrus.form-group > input[type=search],
.citrus .form-group > input[type=search],
.citrus.form-group > input[type=password],
.citrus .form-group > input[type=password],
.citrus.form-group div.select > select,
.citrus .form-group div.select > select {
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 1rem;
  outline: none;
  padding: 8px 8px 7px 8px;
  padding: 0.571rem 0.571rem 0.5rem 0.571rem;
  transition: box-shadow 0.3s ease-in-out;
  -webkit-appearance: textfield;
  width: 100%;
  height: 36px;
}
.citrus.form-group > input[type=text]:focus,
.citrus .form-group > input[type=text]:focus,
.citrus.form-group > input:not([type]):focus,
.citrus .form-group > input:not([type]):focus,
.citrus.form-group > input[type=url]:focus,
.citrus .form-group > input[type=url]:focus,
.citrus.form-group > input[type=email]:focus,
.citrus .form-group > input[type=email]:focus,
.citrus.form-group > input[type=number]:focus,
.citrus .form-group > input[type=number]:focus,
.citrus.form-group > input[type=time]:focus,
.citrus .form-group > input[type=time]:focus,
.citrus.form-group > input[type=tel]:focus,
.citrus .form-group > input[type=tel]:focus,
.citrus.form-group > input[type=datetime]:focus,
.citrus .form-group > input[type=datetime]:focus,
.citrus.form-group > input[type=search]:focus,
.citrus .form-group > input[type=search]:focus,
.citrus.form-group > input[type=password]:focus,
.citrus .form-group > input[type=password]:focus,
.citrus.form-group div.select > select:focus,
.citrus .form-group div.select > select:focus {
  box-shadow: 0 0 5px #1588af;
  border: 1px solid #1588af;
}
.citrus.form-group > input[type=text]:disabled,
.citrus .form-group > input[type=text]:disabled,
.citrus.form-group > input:not([type]):disabled,
.citrus .form-group > input:not([type]):disabled,
.citrus.form-group > input[type=url]:disabled,
.citrus .form-group > input[type=url]:disabled,
.citrus.form-group > input[type=email]:disabled,
.citrus .form-group > input[type=email]:disabled,
.citrus.form-group > input[type=number]:disabled,
.citrus .form-group > input[type=number]:disabled,
.citrus.form-group > input[type=time]:disabled,
.citrus .form-group > input[type=time]:disabled,
.citrus.form-group > input[type=tel]:disabled,
.citrus .form-group > input[type=tel]:disabled,
.citrus.form-group > input[type=datetime]:disabled,
.citrus .form-group > input[type=datetime]:disabled,
.citrus.form-group > input[type=search]:disabled,
.citrus .form-group > input[type=search]:disabled,
.citrus.form-group > input[type=password]:disabled,
.citrus .form-group > input[type=password]:disabled,
.citrus.form-group div.select > select:disabled,
.citrus .form-group div.select > select:disabled,
.citrus.form-group > input[type=text][disabled],
.citrus .form-group > input[type=text][disabled],
.citrus.form-group > input:not([type])[disabled],
.citrus .form-group > input:not([type])[disabled],
.citrus.form-group > input[type=url][disabled],
.citrus .form-group > input[type=url][disabled],
.citrus.form-group > input[type=email][disabled],
.citrus .form-group > input[type=email][disabled],
.citrus.form-group > input[type=number][disabled],
.citrus .form-group > input[type=number][disabled],
.citrus.form-group > input[type=time][disabled],
.citrus .form-group > input[type=time][disabled],
.citrus.form-group > input[type=tel][disabled],
.citrus .form-group > input[type=tel][disabled],
.citrus.form-group > input[type=datetime][disabled],
.citrus .form-group > input[type=datetime][disabled],
.citrus.form-group > input[type=search][disabled],
.citrus .form-group > input[type=search][disabled],
.citrus.form-group > input[type=password][disabled],
.citrus .form-group > input[type=password][disabled],
.citrus.form-group div.select > select[disabled],
.citrus .form-group div.select > select[disabled] {
  background-color: #eaeaea;
  color: #a6a6a6;
  cursor: not-allowed;
}
.citrus.form-group > input[type=text]:disabled + i.icon-search,
.citrus .form-group > input[type=text]:disabled + i.icon-search,
.citrus.form-group > input:not([type]):disabled + i.icon-search,
.citrus .form-group > input:not([type]):disabled + i.icon-search,
.citrus.form-group > input[type=url]:disabled + i.icon-search,
.citrus .form-group > input[type=url]:disabled + i.icon-search,
.citrus.form-group > input[type=email]:disabled + i.icon-search,
.citrus .form-group > input[type=email]:disabled + i.icon-search,
.citrus.form-group > input[type=number]:disabled + i.icon-search,
.citrus .form-group > input[type=number]:disabled + i.icon-search,
.citrus.form-group > input[type=time]:disabled + i.icon-search,
.citrus .form-group > input[type=time]:disabled + i.icon-search,
.citrus.form-group > input[type=tel]:disabled + i.icon-search,
.citrus .form-group > input[type=tel]:disabled + i.icon-search,
.citrus.form-group > input[type=datetime]:disabled + i.icon-search,
.citrus .form-group > input[type=datetime]:disabled + i.icon-search,
.citrus.form-group > input[type=search]:disabled + i.icon-search,
.citrus .form-group > input[type=search]:disabled + i.icon-search,
.citrus.form-group > input[type=password]:disabled + i.icon-search,
.citrus .form-group > input[type=password]:disabled + i.icon-search,
.citrus.form-group div.select > select:disabled + i.icon-search,
.citrus .form-group div.select > select:disabled + i.icon-search,
.citrus.form-group > input[type=text][disabled] + i.icon-search,
.citrus .form-group > input[type=text][disabled] + i.icon-search,
.citrus.form-group > input:not([type])[disabled] + i.icon-search,
.citrus .form-group > input:not([type])[disabled] + i.icon-search,
.citrus.form-group > input[type=url][disabled] + i.icon-search,
.citrus .form-group > input[type=url][disabled] + i.icon-search,
.citrus.form-group > input[type=email][disabled] + i.icon-search,
.citrus .form-group > input[type=email][disabled] + i.icon-search,
.citrus.form-group > input[type=number][disabled] + i.icon-search,
.citrus .form-group > input[type=number][disabled] + i.icon-search,
.citrus.form-group > input[type=time][disabled] + i.icon-search,
.citrus .form-group > input[type=time][disabled] + i.icon-search,
.citrus.form-group > input[type=tel][disabled] + i.icon-search,
.citrus .form-group > input[type=tel][disabled] + i.icon-search,
.citrus.form-group > input[type=datetime][disabled] + i.icon-search,
.citrus .form-group > input[type=datetime][disabled] + i.icon-search,
.citrus.form-group > input[type=search][disabled] + i.icon-search,
.citrus .form-group > input[type=search][disabled] + i.icon-search,
.citrus.form-group > input[type=password][disabled] + i.icon-search,
.citrus .form-group > input[type=password][disabled] + i.icon-search,
.citrus.form-group div.select > select[disabled] + i.icon-search,
.citrus .form-group div.select > select[disabled] + i.icon-search,
.citrus.form-group > input[type=text]:disabled .button.icon,
.citrus .form-group > input[type=text]:disabled .button.icon,
.citrus.form-group > input:not([type]):disabled .button.icon,
.citrus .form-group > input:not([type]):disabled .button.icon,
.citrus.form-group > input[type=url]:disabled .button.icon,
.citrus .form-group > input[type=url]:disabled .button.icon,
.citrus.form-group > input[type=email]:disabled .button.icon,
.citrus .form-group > input[type=email]:disabled .button.icon,
.citrus.form-group > input[type=number]:disabled .button.icon,
.citrus .form-group > input[type=number]:disabled .button.icon,
.citrus.form-group > input[type=time]:disabled .button.icon,
.citrus .form-group > input[type=time]:disabled .button.icon,
.citrus.form-group > input[type=tel]:disabled .button.icon,
.citrus .form-group > input[type=tel]:disabled .button.icon,
.citrus.form-group > input[type=datetime]:disabled .button.icon,
.citrus .form-group > input[type=datetime]:disabled .button.icon,
.citrus.form-group > input[type=search]:disabled .button.icon,
.citrus .form-group > input[type=search]:disabled .button.icon,
.citrus.form-group > input[type=password]:disabled .button.icon,
.citrus .form-group > input[type=password]:disabled .button.icon,
.citrus.form-group div.select > select:disabled .button.icon,
.citrus .form-group div.select > select:disabled .button.icon,
.citrus.form-group > input[type=text][disabled] .button.icon,
.citrus .form-group > input[type=text][disabled] .button.icon,
.citrus.form-group > input:not([type])[disabled] .button.icon,
.citrus .form-group > input:not([type])[disabled] .button.icon,
.citrus.form-group > input[type=url][disabled] .button.icon,
.citrus .form-group > input[type=url][disabled] .button.icon,
.citrus.form-group > input[type=email][disabled] .button.icon,
.citrus .form-group > input[type=email][disabled] .button.icon,
.citrus.form-group > input[type=number][disabled] .button.icon,
.citrus .form-group > input[type=number][disabled] .button.icon,
.citrus.form-group > input[type=time][disabled] .button.icon,
.citrus .form-group > input[type=time][disabled] .button.icon,
.citrus.form-group > input[type=tel][disabled] .button.icon,
.citrus .form-group > input[type=tel][disabled] .button.icon,
.citrus.form-group > input[type=datetime][disabled] .button.icon,
.citrus .form-group > input[type=datetime][disabled] .button.icon,
.citrus.form-group > input[type=search][disabled] .button.icon,
.citrus .form-group > input[type=search][disabled] .button.icon,
.citrus.form-group > input[type=password][disabled] .button.icon,
.citrus .form-group > input[type=password][disabled] .button.icon,
.citrus.form-group div.select > select[disabled] .button.icon,
.citrus .form-group div.select > select[disabled] .button.icon {
  color: #a6a6a6;
}
.citrus.form-group > input[type=text].placeholder,
.citrus .form-group > input[type=text].placeholder,
.citrus.form-group > input:not([type]).placeholder,
.citrus .form-group > input:not([type]).placeholder,
.citrus.form-group > input[type=url].placeholder,
.citrus .form-group > input[type=url].placeholder,
.citrus.form-group > input[type=email].placeholder,
.citrus .form-group > input[type=email].placeholder,
.citrus.form-group > input[type=number].placeholder,
.citrus .form-group > input[type=number].placeholder,
.citrus.form-group > input[type=time].placeholder,
.citrus .form-group > input[type=time].placeholder,
.citrus.form-group > input[type=tel].placeholder,
.citrus .form-group > input[type=tel].placeholder,
.citrus.form-group > input[type=datetime].placeholder,
.citrus .form-group > input[type=datetime].placeholder,
.citrus.form-group > input[type=search].placeholder,
.citrus .form-group > input[type=search].placeholder,
.citrus.form-group > input[type=password].placeholder,
.citrus .form-group > input[type=password].placeholder,
.citrus.form-group div.select > select.placeholder,
.citrus .form-group div.select > select.placeholder {
  color: #a6a6a6;
}
.citrus.form-group > input[type=text][readonly],
.citrus .form-group > input[type=text][readonly],
.citrus.form-group > input:not([type])[readonly],
.citrus .form-group > input:not([type])[readonly],
.citrus.form-group > input[type=url][readonly],
.citrus .form-group > input[type=url][readonly],
.citrus.form-group > input[type=email][readonly],
.citrus .form-group > input[type=email][readonly],
.citrus.form-group > input[type=number][readonly],
.citrus .form-group > input[type=number][readonly],
.citrus.form-group > input[type=time][readonly],
.citrus .form-group > input[type=time][readonly],
.citrus.form-group > input[type=tel][readonly],
.citrus .form-group > input[type=tel][readonly],
.citrus.form-group > input[type=datetime][readonly],
.citrus .form-group > input[type=datetime][readonly],
.citrus.form-group > input[type=search][readonly],
.citrus .form-group > input[type=search][readonly],
.citrus.form-group > input[type=password][readonly],
.citrus .form-group > input[type=password][readonly],
.citrus.form-group div.select > select[readonly],
.citrus .form-group div.select > select[readonly] {
  background-color: transparent;
  border: 0px solid #cccccc;
  color: #222222;
  -webkit-text-fill-color: #222222;
  cursor: default;
  padding: 8px 0px;
  padding: 0.571rem 0rem;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
  opacity: 1;
}
.citrus.form-group > input[type=text][readonly]:focus,
.citrus .form-group > input[type=text][readonly]:focus,
.citrus.form-group > input:not([type])[readonly]:focus,
.citrus .form-group > input:not([type])[readonly]:focus,
.citrus.form-group > input[type=url][readonly]:focus,
.citrus .form-group > input[type=url][readonly]:focus,
.citrus.form-group > input[type=email][readonly]:focus,
.citrus .form-group > input[type=email][readonly]:focus,
.citrus.form-group > input[type=number][readonly]:focus,
.citrus .form-group > input[type=number][readonly]:focus,
.citrus.form-group > input[type=time][readonly]:focus,
.citrus .form-group > input[type=time][readonly]:focus,
.citrus.form-group > input[type=tel][readonly]:focus,
.citrus .form-group > input[type=tel][readonly]:focus,
.citrus.form-group > input[type=datetime][readonly]:focus,
.citrus .form-group > input[type=datetime][readonly]:focus,
.citrus.form-group > input[type=search][readonly]:focus,
.citrus .form-group > input[type=search][readonly]:focus,
.citrus.form-group > input[type=password][readonly]:focus,
.citrus .form-group > input[type=password][readonly]:focus,
.citrus.form-group div.select > select[readonly]:focus,
.citrus .form-group div.select > select[readonly]:focus {
  box-shadow: 0 0 0px #1588af;
  border: 0px solid #1588af;
}
.citrus.form-group > input[type=datetime-local],
.citrus .form-group > input[type=datetime-local],
.citrus.form-group > input[type=date],
.citrus .form-group > input[type=date],
.citrus.form-group > input[type=month],
.citrus .form-group > input[type=month],
.citrus.form-group > input[type=time],
.citrus .form-group > input[type=time] {
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 1rem;
  outline: none;
  padding: 7px 8px 6px 8px;
  padding: 0.5rem 0.571rem 0.429rem 0.571rem;
  transition: box-shadow 0.3s ease-in-out;
  -webkit-appearance: textfield;
  width: 100%;
}
.citrus.form-group > input[type=datetime-local]:focus,
.citrus .form-group > input[type=datetime-local]:focus,
.citrus.form-group > input[type=date]:focus,
.citrus .form-group > input[type=date]:focus,
.citrus.form-group > input[type=month]:focus,
.citrus .form-group > input[type=month]:focus,
.citrus.form-group > input[type=time]:focus,
.citrus .form-group > input[type=time]:focus {
  box-shadow: 0 0 5px #1588af;
  border: 1px solid #1588af;
}
.citrus.form-group > input[type=datetime-local]:disabled,
.citrus .form-group > input[type=datetime-local]:disabled,
.citrus.form-group > input[type=date]:disabled,
.citrus .form-group > input[type=date]:disabled,
.citrus.form-group > input[type=month]:disabled,
.citrus .form-group > input[type=month]:disabled,
.citrus.form-group > input[type=time]:disabled,
.citrus .form-group > input[type=time]:disabled,
.citrus.form-group > input[type=datetime-local][disabled],
.citrus .form-group > input[type=datetime-local][disabled],
.citrus.form-group > input[type=date][disabled],
.citrus .form-group > input[type=date][disabled],
.citrus.form-group > input[type=month][disabled],
.citrus .form-group > input[type=month][disabled],
.citrus.form-group > input[type=time][disabled],
.citrus .form-group > input[type=time][disabled] {
  background-color: transparent;
  color: #a6a6a6;
  cursor: not-allowed;
}
.citrus.form-group > input[type=datetime-local][readonly],
.citrus .form-group > input[type=datetime-local][readonly],
.citrus.form-group > input[type=date][readonly],
.citrus .form-group > input[type=date][readonly],
.citrus.form-group > input[type=month][readonly],
.citrus .form-group > input[type=month][readonly],
.citrus.form-group > input[type=time][readonly],
.citrus .form-group > input[type=time][readonly] {
  background-color: transparent;
  border: 0px solid #cccccc;
  color: #222222;
  -webkit-text-fill-color: #222222;
  cursor: default;
  padding: 8px 0px;
  padding: 0.571rem 0rem;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
  opacity: 1;
}
.citrus.form-group > input[type=datetime-local][readonly]:focus,
.citrus .form-group > input[type=datetime-local][readonly]:focus,
.citrus.form-group > input[type=date][readonly]:focus,
.citrus .form-group > input[type=date][readonly]:focus,
.citrus.form-group > input[type=month][readonly]:focus,
.citrus .form-group > input[type=month][readonly]:focus,
.citrus.form-group > input[type=time][readonly]:focus,
.citrus .form-group > input[type=time][readonly]:focus {
  box-shadow: 0 0 0px #1588af;
  border: 0px solid #1588af;
}
.citrus.form-group.search,
.citrus .form-group.search {
  padding: 0px;
  padding: 0rem;
}
.citrus.form-group.search i.icon-search,
.citrus .form-group.search i.icon-search,
.citrus.form-group.search .button.icon,
.citrus .form-group.search .button.icon {
  pointer-events: none;
  position: absolute;
  bottom: 8px;
  color: #1588af;
  left: 10px;
  top: 11px;
}
.citrus.form-group.search input,
.citrus .form-group.search input {
  text-indent: 24px;
}
.citrus.form-group.search input.k-input,
.citrus .form-group.search input.k-input {
  width: 100%;
  text-indent: 0;
}
.citrus.form-group.search .k-multiselect-wrap,
.citrus .form-group.search .k-multiselect-wrap {
  padding-left: 40px;
}
.citrus.form-group.search .k-multiselect-wrap > .k-reset .k-button,
.citrus .form-group.search .k-multiselect-wrap > .k-reset .k-button {
  height: 37px;
  height: 2.643rem;
  line-height: 2.4em;
}
.citrus.form-group.search .k-multiselect-wrap .k-input,
.citrus .form-group.search .k-multiselect-wrap .k-input {
  margin-left: 5px;
  margin-left: 0.357rem;
  height: 42px;
  height: 3rem;
}
.citrus.form-group.search.search-tall i.icon-search,
.citrus .form-group.search.search-tall i.icon-search,
.citrus.form-group.search.search-tall .button.icon,
.citrus .form-group.search.search-tall .button.icon {
  display: block;
  position: absolute;
  top: 13px;
  font-size: 20px;
  font-size: 1.429rem;
}
.citrus.form-group.search.search-tall input,
.citrus .form-group.search.search-tall input {
  font-size: 18px;
  font-size: 1.286rem;
  height: 44px;
  padding: 9px 38px 9px 8px;
  padding: 0.643rem 2.714rem 0.643rem 0.571rem;
  text-indent: 30px;
}
.citrus.form-group.search.search-tall input.k-input,
.citrus .form-group.search.search-tall input.k-input {
  padding: 0;
}
.citrus.form-group.search.search-tall input.k-readonly,
.citrus .form-group.search.search-tall input.k-readonly {
  color: #a6a6a6;
}
.citrus.form-group.search.search-tall .button.icon,
.citrus .form-group.search.search-tall .button.icon {
  top: 4px;
  right: 5px;
}
.citrus.form-group > input[type=file],
.citrus .form-group > input[type=file] {
  display: block;
}
.citrus.form-group input[type=range]:disabled + .range .range-fill,
.citrus .form-group input[type=range]:disabled + .range .range-fill {
  background-color: #eaeaea;
}
.citrus.form-group input[type=range]:disabled + .range .range-handle:after,
.citrus .form-group input[type=range]:disabled + .range .range-handle:after {
  background-color: #a6a6a6;
}
.citrus.form-group .range,
.citrus .form-group .range {
  background-color: #fff;
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  display: block;
  height: 24px;
  height: 1.714rem;
  margin: 11px 0 5px 0;
  position: relative;
  vertical-align: middle;
}
.citrus.form-group .range .range-fill,
.citrus .form-group .range .range-fill {
  background: #c3e9f2;
  border: 3px solid #fff;
  box-sizing: border-box;
  display: block;
  height: 22px;
  height: 1.571rem;
  left: 0;
  position: absolute;
  top: 0;
}
.citrus.form-group .range .range-handle,
.citrus .form-group .range .range-handle {
  background: transparent;
  cursor: pointer;
  height: 36px;
  height: 2.571rem;
  position: relative;
  top: -7px;
  width: 28px;
  width: 2rem;
}
.citrus.form-group .range .range-handle:after,
.citrus .form-group .range .range-handle:after {
  background: #1588af url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAO9JREFUWAntl/0JgzAQxU3pAI7iBmYkR+lGyQgZxQ30PejB5TXQQkH/uQO5r1+MXOSh0yE2DQxIEWxVDP1VmKIMc2GOxwi6shYPcOW0Y6+YwHACCcJQfSellH3OGMwLbnH1DVxzORn2yZk1MJsl5nW/D2Uy0HssKri8hRL6Af0VP7E6/3AHnuXsuOZiC1nLlsDvLvZh9knEMQEKUfdSQDyqjgXMgtrs6hSZ7iUDwz45s13Fig3dL4To9k8yClHl2XyxJv3u/N891qrjdI21PGO18DGBGycAZeps9CgASgfhP1A59Fdh4t9QhzTMb1fCE8nnQ5hcHBVSAAAAAElFTkSuQmCC) no-repeat center center;
  background-size: 12px 12px;
  border: none;
  border-radius: 2px;
  box-sizing: border-box;
  content: '';
  display: block;
  height: 36px;
  height: 2.571rem;
  left: 3px;
  position: absolute;
  top: 0;
  width: 20px;
  width: 1.429rem;
}
.citrus.form-group input[type="checkbox"],
.citrus .form-group input[type="checkbox"],
.citrus.form-group input[type="radio"],
.citrus .form-group input[type="radio"] {
  box-sizing: border-box;
  display: inline-block;
  padding: 0;
}
.citrus.form-group input[type=checkbox]:disabled + label,
.citrus .form-group input[type=checkbox]:disabled + label,
.citrus.form-group input[type=radio]:disabled + label,
.citrus .form-group input[type=radio]:disabled + label {
  color: #a6a6a6;
  cursor: not-allowed;
}
.citrus.form-group input[type=radio] + label,
.citrus .form-group input[type=radio] + label,
.citrus.form-group input[type=checkbox] + label,
.citrus .form-group input[type=checkbox] + label {
  font-weight: 500;
  display: inline-block;
  cursor: pointer;
  width: auto;
  line-height: 1.5;
  padding: 0 0 0 4px;
  padding: 0 0 0 0.286rem;
  margin: 0 15px 0 0;
  margin: 0 1.071rem 0 0;
  position: relative;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
}
.citrus.form-group.toggle-inline,
.citrus .form-group.toggle-inline {
  padding: 0 0 25px 0;
  padding: 0 0 1.786rem 0;
}
.citrus.form-group.toggle-inline label,
.citrus .form-group.toggle-inline label {
  display: inline-block;
  margin: 0px 20px 3px 0px;
  margin: 0rem 1.429rem 0.214rem 0rem;
  width: auto;
}
.citrus.form-group.toggle-inline label:first-child,
.citrus .form-group.toggle-inline label:first-child {
  display: block;
  line-height: 1;
  padding: 0px 0px 14px 0px;
  padding: 0rem 0rem 1rem 0rem;
}
.citrus.form-group.toggle-inline input[type="checkbox"],
.citrus .form-group.toggle-inline input[type="checkbox"],
.citrus.form-group.toggle-inline input[type="radio"],
.citrus .form-group.toggle-inline input[type="radio"] {
  line-height: 1.5;
}
.citrus.form-group > fieldset,
.citrus .form-group > fieldset {
  border: 0px;
  margin: 0px;
  padding: 0px;
}
.citrus.form-group > select,
.citrus .form-group > select {
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 1rem;
  width: 100%;
}
.citrus.form-group > select:disabled,
.citrus .form-group > select:disabled {
  background-color: #eaeaea;
  color: #a6a6a6;
  cursor: not-allowed;
}
.citrus.form-group > select:focus,
.citrus .form-group > select:focus {
  box-shadow: 0 0 5px #1588af;
  border: 1px solid #1588af;
  outline: 0;
}
.citrus.form-group > select:not([multiple]),
.citrus .form-group > select:not([multiple]) {
  background: #eaeaea;
  height: 36px;
  height: 2.571rem;
  line-height: normal;
  margin-top: 5px;
  margin-top: 0.357rem;
  padding: 0px 0px 0px 8px;
  padding: 0rem 0rem 0rem 0.571rem;
  overflow: visible;
}
.citrus.form-group > select:not([multiple]):disabled,
.citrus .form-group > select:not([multiple]):disabled {
  background-color: #eaeaea;
  color: #a6a6a6;
  cursor: not-allowed;
}
.citrus.form-group .multiselect,
.citrus .form-group .multiselect {
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  cursor: text;
  font-size: 0;
  padding: 8px 8px 7px 8px;
  padding: 0.571rem 0.571rem 0.5rem 0.571rem;
  position: relative;
}
.citrus.form-group .multiselect:before,
.citrus .form-group .multiselect:before,
.citrus.form-group .multiselect:after,
.citrus .form-group .multiselect:after {
  content: " ";
  display: table;
}
.citrus.form-group .multiselect:after,
.citrus .form-group .multiselect:after {
  clear: both;
}
.citrus.form-group .multiselect .item,
.citrus .form-group .multiselect .item {
  background: #eaeaea;
  border-radius: 2px;
  color: #1588af;
  cursor: default;
  display: inline-block;
  font-size: 12px;
  font-size: 0.857rem;
  font-weight: 600;
  line-height: 1;
  margin: 2px 4px 2px 0;
  padding: 4px;
  padding: 0.286rem;
  position: relative;
  z-index: 10;
}
.citrus.form-group .multiselect .item.active,
.citrus .form-group .multiselect .item.active {
  background: #1588af;
  color: #fff;
}
.citrus.form-group .multiselect input,
.citrus .form-group .multiselect input {
  border: none;
  box-sizing: border-box;
  display: inline-block;
  font-size: 12px;
  max-width: 100%;
  padding: 4px;
  padding: 0.286rem;
  width: auto;
}
.citrus.form-group .multiselect input:focus,
.citrus .form-group .multiselect input:focus {
  box-shadow: 0 0 0 transparent;
  outline-width: 0;
}
.citrus.form-group .multiselect ul,
.citrus .form-group .multiselect ul {
  background: #fff;
  border: 1px solid #cccccc;
  border-radius: 0 0 2px 2px;
  display: block;
  font-size: 12px;
  left: -1px;
  line-height: 1;
  margin: 0;
  max-height: 0;
  overflow: auto;
  padding: 0;
  position: absolute;
  top: 100%;
  transition: all 0.1s linear;
  visibility: hidden;
  width: 100%;
  z-index: 1;
}
.citrus.form-group .multiselect ul.open,
.citrus .form-group .multiselect ul.open {
  max-height: 148px;
  visibility: visible;
}
.citrus.form-group .multiselect ul li,
.citrus .form-group .multiselect ul li {
  box-sizing: border-box;
  display: block;
  font-size: 14px;
  font-size: 1rem;
  padding: 8px;
  padding: 0.571rem;
  width: 100%;
}
.citrus.form-group .multiselect ul li:hover,
.citrus .form-group .multiselect ul li:hover {
  background: #eaeaea;
}
@media screen and (min-width: 0px) {
  .citrus.form-group > select:not([multiple]),
  .citrus .form-group > select:not([multiple]) {
    background: #fff;
    padding: 0px 0px 0px 8px;
    padding: 0rem 0rem 0rem 0.571rem;
  }
}
.citrus.form-group > textarea,
.citrus .form-group > textarea {
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  font-size: 14px;
  font-size: 1rem;
  height: 113px;
  height: 8.071rem;
  line-height: 1.6;
  padding: 8px;
  padding: 0.571rem;
  resize: none;
  transition: all 0.3s ease-in-out;
  width: 100%;
}
.citrus.form-group > textarea:disabled,
.citrus .form-group > textarea:disabled {
  background-color: #eaeaea;
  color: #666666;
  cursor: not-allowed;
}
.citrus.form-group > textarea:focus,
.citrus .form-group > textarea:focus {
  box-shadow: 0 0 5px #1588af;
  border: 1px solid #1588af;
}
.citrus.form-group > textarea.placeholder,
.citrus .form-group > textarea.placeholder {
  color: #a6a6a6;
}
.citrus.form-group.form-button:before,
.citrus .form-group.form-button:before,
.citrus.form-group.form-button:after,
.citrus .form-group.form-button:after {
  content: " ";
  display: table;
}
.citrus.form-group.form-button:after,
.citrus .form-group.form-button:after {
  clear: both;
}
.citrus.form-group.form-button > input,
.citrus .form-group.form-button > input {
  border-radius: 2px 0px 0px 2px;
  float: left;
  border-width: 1px 0px 1px 1px;
  width: 70%;
  margin: 5px 0px 0px 0px;
  margin: 0.357rem 0rem 0rem 0rem;
}
.citrus.form-group.form-button > input:focus,
.citrus .form-group.form-button > input:focus {
  border-width: 1px 0px 1px 1px;
}
.citrus.form-group.form-button > .button,
.citrus .form-group.form-button > .button {
  box-sizing: border-box;
  border-radius: 0px 2px 2px 0px;
  float: right;
  margin: 5px 0px 0px 0px;
  margin: 0.357rem 0rem 0rem 0rem;
  padding: 10px 0px 8px 0px;
  padding: 0.714rem 0rem 0.571rem 0rem;
  width: 30%;
}
.citrus.form-group.form-button.form-success,
.citrus .form-group.form-button.form-success,
.citrus.form-group.form-button.form-pending,
.citrus .form-group.form-button.form-pending,
.citrus.form-group.form-button.form-warning,
.citrus .form-group.form-button.form-warning,
.citrus.form-group.form-button.form-error,
.citrus .form-group.form-button.form-error,
.citrus.form-group.form-button.form-information,
.citrus .form-group.form-button.form-information {
  box-shadow: none;
}
.citrus.form-group.form-button.form-success:before,
.citrus .form-group.form-button.form-success:before,
.citrus.form-group.form-button.form-pending:before,
.citrus .form-group.form-button.form-pending:before,
.citrus.form-group.form-button.form-warning:before,
.citrus .form-group.form-button.form-warning:before,
.citrus.form-group.form-button.form-error:before,
.citrus .form-group.form-button.form-error:before,
.citrus.form-group.form-button.form-information:before,
.citrus .form-group.form-button.form-information:before {
  right: 32%;
}
.citrus.form-group > a,
.citrus .form-group > a {
  color: #666666;
  display: inline-block;
  font-size: 20px;
  font-size: 1.429rem;
  position: absolute;
  text-decoration: none;
  top: 26px;
  top: 1.857rem;
  right: 12px;
  right: 0.857rem;
}
.citrus.form-group > a:hover i,
.citrus .form-group > a:hover i {
  font-family: 'PaylocityIcons-Bold';
  font-weight: 600;
}
.citrus.form-group > label,
.citrus .form-group > label {
  display: inline-block;
  font-size: 14px;
  font-size: 1rem;
  font-weight: 600;
  width: 100%;
}
.citrus.form-group > label + input,
.citrus .form-group > label + input,
.citrus.form-group > label + textarea,
.citrus .form-group > label + textarea,
.citrus.form-group > label + select,
.citrus .form-group > label + select,
.citrus.form-group > label + div.select,
.citrus .form-group > label + div.select {
  margin: 5px 0px 0px 0px;
  margin: 0.357rem 0rem 0rem 0rem;
}
.citrus.form-group > label em,
.citrus .form-group > label em {
  color: #666666;
  font-style: normal;
  text-transform: lowercase;
}
.citrus.form-group > .tooltip,
.citrus .form-group > .tooltip {
  width: 100%;
}
.citrus.form-group > .tooltip .tooltip-inner,
.citrus .form-group > .tooltip .tooltip-inner {
  font-weight: normal;
  max-width: 100%;
}
.citrus.form-group > .tooltip.bottom .tooltip-arrow,
.citrus .form-group > .tooltip.bottom .tooltip-arrow {
  right: 12px;
  right: 0.857rem;
  left: auto;
}
.citrus.form-group > .type-footnote,
.citrus .form-group > .type-footnote {
  color: #393939;
  margin: 0;
  text-align: left;
  display: block;
  width: 100%;
}
.citrus.form-group.form-success input,
.citrus .form-group.form-success input,
.citrus.form-group.form-success textarea,
.citrus .form-group.form-success textarea,
.citrus.form-group.form-success select,
.citrus .form-group.form-success select {
  border-color: #3dc270;
}
.citrus.form-group.form-success input:focus,
.citrus .form-group.form-success input:focus,
.citrus.form-group.form-success textarea:focus,
.citrus .form-group.form-success textarea:focus,
.citrus.form-group.form-success select:focus,
.citrus .form-group.form-success select:focus {
  box-shadow: 0 0 5px #3dc270;
  border-color: #3dc270;
}
.citrus.form-group.form-success .type-footnote,
.citrus .form-group.form-success .type-footnote {
  color: #3dc270;
}
.citrus.form-group.form-pending input,
.citrus .form-group.form-pending input,
.citrus.form-group.form-pending textarea,
.citrus .form-group.form-pending textarea,
.citrus.form-group.form-pending select,
.citrus .form-group.form-pending select {
  border-color: #ffc400;
}
.citrus.form-group.form-pending input:focus,
.citrus .form-group.form-pending input:focus,
.citrus.form-group.form-pending textarea:focus,
.citrus .form-group.form-pending textarea:focus,
.citrus.form-group.form-pending select:focus,
.citrus .form-group.form-pending select:focus {
  box-shadow: 0 0 5px #ffc400;
  border-color: #ffc400;
}
.citrus.form-group.form-pending .type-footnote,
.citrus .form-group.form-pending .type-footnote {
  color: #ffc400;
}
.citrus.form-group.form-warning input,
.citrus .form-group.form-warning input,
.citrus.form-group.form-warning textarea,
.citrus .form-group.form-warning textarea,
.citrus.form-group.form-warning select,
.citrus .form-group.form-warning select {
  border-color: #ff8800;
  border-width: 1px;
}
.citrus.form-group.form-warning input:focus,
.citrus .form-group.form-warning input:focus,
.citrus.form-group.form-warning textarea:focus,
.citrus .form-group.form-warning textarea:focus,
.citrus.form-group.form-warning select:focus,
.citrus .form-group.form-warning select:focus {
  box-shadow: 0 0 5px #ff8800;
  border-color: #ff8800;
  border-width: 1px;
}
.citrus.form-group.form-warning .type-footnote,
.citrus .form-group.form-warning .type-footnote {
  color: #ff8800;
}
.citrus.form-group.form-error,
.citrus .form-group.form-error {
  padding: 0px 0px 5px 0px;
  padding: 0rem 0rem 0.357rem 0rem;
}
.citrus.form-group.form-error input,
.citrus .form-group.form-error input,
.citrus.form-group.form-error textarea,
.citrus .form-group.form-error textarea,
.citrus.form-group.form-error select,
.citrus .form-group.form-error select {
  border-color: #c8102e;
  border-width: 2px;
}
.citrus.form-group.form-error input:focus,
.citrus .form-group.form-error input:focus,
.citrus.form-group.form-error textarea:focus,
.citrus .form-group.form-error textarea:focus,
.citrus.form-group.form-error select:focus,
.citrus .form-group.form-error select:focus {
  box-shadow: 0 0 5px #c8102e;
  border-color: #c8102e;
  border-width: 2px;
  outline: none;
}
.citrus.form-group.form-error input[type="checkbox"],
.citrus .form-group.form-error input[type="checkbox"],
.citrus.form-group.form-error input[type="radio"],
.citrus .form-group.form-error input[type="radio"] {
  outline: 2px solid #c8102e;
}
.citrus.form-group.form-error .type-footnote,
.citrus .form-group.form-error .type-footnote {
  color: #c8102e;
}
.citrus.form-group.form-information .type-footnote,
.citrus .form-group.form-information .type-footnote {
  color: #393939;
}
.citrus.form-group.margin-top > input,
.citrus .form-group.margin-top > input,
.citrus.form-group.margin > input,
.citrus .form-group.margin > input,
.citrus.form-group.margin-top > textarea,
.citrus .form-group.margin-top > textarea,
.citrus.form-group.margin > textarea,
.citrus .form-group.margin > textarea,
.citrus.form-group.margin-top > select,
.citrus .form-group.margin-top > select,
.citrus.form-group.margin > select,
.citrus .form-group.margin > select,
.citrus.form-group.margin-top > .button,
.citrus .form-group.margin-top > .button,
.citrus.form-group.margin > .button,
.citrus .form-group.margin > .button,
.citrus.form-group.margin-top > .toggle-switch,
.citrus .form-group.margin-top > .toggle-switch,
.citrus.form-group.margin > .toggle-switch,
.citrus .form-group.margin > .toggle-switch,
.citrus.form-group.margin-top > .switch,
.citrus .form-group.margin-top > .switch,
.citrus.form-group.margin > .switch,
.citrus .form-group.margin > .switch {
  margin: 19px 0px 0px 0px;
  margin: 1.357rem 0rem 0rem 0rem;
}
.citrus.form-group.margin-top > .range,
.citrus .form-group.margin-top > .range,
.citrus.form-group.margin > .range,
.citrus .form-group.margin > .range {
  margin-top: 19px;
  margin-top: 1.357rem;
}
.citrus.form-group.margin-top > input[type='checkbox'],
.citrus .form-group.margin-top > input[type='checkbox'],
.citrus.form-group.margin > input[type='checkbox'],
.citrus .form-group.margin > input[type='checkbox'],
.citrus.form-group.margin-top > input[type='radio'],
.citrus .form-group.margin-top > input[type='radio'],
.citrus.form-group.margin > input[type='radio'],
.citrus .form-group.margin > input[type='radio'] {
  margin-top: 36px;
  margin-top: 2.571rem;
}
.citrus.form-group.padding-bottom-none,
.citrus .form-group.padding-bottom-none {
  padding-bottom: 0;
}
.citrus.form-group.label-left,
.citrus .form-group.label-left {
  width: auto;
  margin-right: 0;
}
.citrus.form-group.label-left label,
.citrus .form-group.label-left label {
  width: auto;
  padding-right: 8px;
  padding-right: 0.571rem;
  vertical-align: middle;
}
.citrus.form-group.label-left label + *,
.citrus .form-group.label-left label + * {
  width: auto;
  margin: 0;
  display: inline-block;
  min-width: inherit;
}
.citrus.form-group.label-left .range,
.citrus .form-group.label-left .range {
  display: inline-block;
  margin: 0;
  vertical-align: middle;
  width: 164px;
  width: 11.714rem;
}
.citrus.form-group input[type=text]::-ms-clear,
.citrus .form-group input[type=text]::-ms-clear,
.citrus.form-group input:not([type])::-ms-clear,
.citrus .form-group input:not([type])::-ms-clear {
  display: none;
  height: 0;
  width: 0;
}
.citrus.form-group textarea.borderless,
.citrus .form-group textarea.borderless {
  padding: 8px 15px;
  padding: 0.571rem 1.071rem;
  border: 0px;
  margin-bottom: 0;
  outline: none;
}
.citrus.form-group textarea.borderless:focus,
.citrus .form-group textarea.borderless:focus {
  box-shadow: none;
  border: 0px;
}
.citrus.form-group .k-state-disabled,
.citrus .form-group .k-state-disabled,
.citrus.k-form-group .k-state-disabled,
.citrus .k-form-group .k-state-disabled {
  background-color: #eaeaea;
}
.citrus .toggle-switch {
  background-color: #fff;
  border: 1px solid #cccccc;
  border-radius: 2px;
  height: 34px;
  height: 2.429rem;
  margin: 5px 0px 5px 0px;
  margin: 0.357rem 0rem 0.357rem 0rem;
  position: relative;
  width: 160px;
  width: 11.429rem;
}
.citrus .toggle-switch .switch-label {
  color: #666666;
  cursor: pointer;
  float: left;
  line-height: 1.8;
  position: relative;
  text-align: center;
  width: 76px;
  width: 5.429rem;
  z-index: 2;
  margin: 0;
}
.citrus .toggle-switch .switch-label-off {
  padding: 4px 4px 0 0;
}
.citrus .toggle-switch .switch-label-on {
  padding: 4px 0 0 0;
  padding: 0.286rem 0 0 0;
}
.citrus .toggle-switch label {
  z-index: 2;
}
.citrus .toggle-switch input {
  position: absolute;
  left: -9999px;
  z-index: -100;
  -moz-appearance: none;
  -webkit-appearance: none;
}
.citrus .toggle-switch input + label:after {
  display: none;
}
.citrus .toggle-switch input + label:after:after {
  content: '';
}
.citrus .toggle-switch .switch-selection {
  background-color: #666666;
  border-radius: 2px;
  display: block;
  height: 26px;
  height: 1.857rem;
  left: 4px;
  left: 0.286rem;
  top: 4px;
  top: 0.286rem;
  margin: 0;
  position: absolute;
  transition: left 0.15s ease-out;
  width: 74px;
  width: 5.286rem;
  z-index: 1;
}
.citrus .toggle-switch input:checked + .switch-label-on ~ .switch-selection {
  background-color: #1588af;
  left: 80px;
}
.citrus .toggle-switch input[type='radio'] + .switch-label {
  color: #666666;
  cursor: pointer;
  float: left;
  line-height: 1.8;
  position: relative;
  text-align: center;
  width: 76px;
  width: 5.429rem;
  z-index: 2;
  margin: 0;
}
.citrus .toggle-switch input[type='radio'] + .switch-label-off {
  padding: 4px 4px 0 0;
}
.citrus .toggle-switch input[type='radio'] + .switch-label-on {
  padding: 4px 0 0 0;
  padding: 0.286rem 0 0 0;
}
.citrus .toggle-switch input:checked + .switch-label {
  color: #fff;
  transition: color 0.1s ease-out;
}
.citrus .toggle-switch.disabled .switch-selection,
.citrus .toggle-switch.disabled input:checked + .switch-label-on ~ .switch-selection {
  background-color: #eaeaea;
}
.citrus .toggle-switch.disabled .switch-label {
  cursor: not-allowed;
}
.citrus .toggle-switch.transition-none .switch-selection,
.citrus .toggle-switch.transition-none input:checked + .switch-label {
  transition: none;
}
.citrus .toggle-switch.margin-none {
  margin: 0;
}
.citrus .switch.compact input[type="checkbox"]:checked + label {
  background: #1588af;
}
.citrus .switch.compact input[type="checkbox"]:checked + label:before {
  background: #fff;
  left: 20px;
  left: 1.429rem;
}
.citrus .switch.compact input[type="checkbox"]:disabled + label {
  background: #a6a6a6;
}
.citrus .switch.compact input[type="checkbox"]:disabled + label:before {
  background: #fff;
}
.citrus .switch.compact input[type="checkbox"] + label {
  background: #666666;
  border: none;
  height: 28px;
  height: 2rem;
  width: 44px;
  width: 3.143rem;
}
.citrus .switch.compact input[type="checkbox"] + label:before {
  background: #fff;
  content: '';
  height: 20px;
  height: 1.429rem;
  width: 20px;
  width: 1.429rem;
}
.citrus .switch.compact input[type="checkbox"] + label:after {
  display: none;
}
.citrus .switch input[type="checkbox"] {
  display: none;
}
.citrus .switch input[type="checkbox"]:checked + label:before {
  background: #1588af;
  content: attr(data-on);
  left: 82px;
  left: 5.857rem;
}
.citrus .switch input[type="checkbox"]:checked + label:after {
  content: attr(data-off);
  left: 4px;
  left: 0.286rem;
}
.citrus .switch input[type="checkbox"]:disabled + label:before {
  background: #a6a6a6;
}
.citrus .switch input[type="checkbox"] + label {
  background: #fff;
  border: 1px solid #cccccc;
  border-radius: 2px;
  cursor: pointer;
  display: inline-block;
  height: 34px;
  height: 2.429rem;
  margin: 5px 0px 5px 0px;
  margin: 0.357rem 0rem 0.357rem 0rem;
  padding: 0;
  position: relative;
  width: 160px;
  width: 11.429rem;
}
.citrus .switch input[type="checkbox"] + label:before {
  background: #666666;
  border-radius: 2px;
  color: #fff;
  content: attr(data-off);
  font-size: 14px;
  font-size: 1rem;
  font-weight: 500;
  height: 26px;
  height: 1.857rem;
  left: 4px;
  left: 0.286rem;
  line-height: 26px;
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: center;
  top: 4px;
  top: 0.286rem;
  transition: left 0.15s ease-out;
  width: 74px;
  width: 5.286rem;
  z-index: 1;
}
.citrus .switch input[type="checkbox"] + label:after {
  color: #666666;
  content: attr(data-on);
  font-size: 14px;
  font-size: 1rem;
  font-weight: 500;
  height: 26px;
  height: 1.857rem;
  left: 82px;
  left: 5.857rem;
  line-height: 26px;
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: center;
  top: 4px;
  top: 0.286rem;
  width: 74px;
  width: 5.286rem;
}
.ie8 .citrus.form-group > .switch,
.ie8 .citrus .form-group > .switch {
  margin: 5px 0px 5px 5px;
  margin: 0.357rem 0rem 0.357rem 0.357rem;
}
.ie8 .citrus.toggle-group input[type="checkbox"],
.ie8 .citrus .toggle-group input[type="checkbox"],
.ie8 .citrus .form-group.toggle input[type="checkbox"],
.ie8 .citrus.toggle-group input[type="radio"],
.ie8 .citrus .toggle-group input[type="radio"],
.ie8 .citrus .form-group.toggle input[type="radio"] {
  display: inline-block;
  margin: 2px 0 0 0;
  margin: 0.143rem 0 0 0;
}
.ie8 .citrus.toggle-group input + label:after,
.ie8 .citrus .toggle-group input + label:after,
.ie8 .citrus .form-group.toggle input + label:after {
  display: none;
}
.ie8 .citrus.toggle-group input + label:after:after,
.ie8 .citrus .toggle-group input + label:after:after,
.ie8 .citrus .form-group.toggle input + label:after:after {
  content: '';
}
.ie8 .citrus.toggle-group label,
.ie8 .citrus .toggle-group label,
.ie8 .citrus .form-group.toggle label {
  padding: 0 0 0 4px;
  padding: 0 0 0 0.286rem;
}
.citrus .filter-controls,
.citrus.filter-controls {
  position: relative;
  padding-bottom: 15px;
  padding-bottom: 1.071rem;
}
.citrus .filter-controls .advanced-filter,
.citrus.filter-controls .advanced-filter {
  padding-right: 30px;
  padding-right: 2.143rem;
}
.citrus .filter-controls .advanced-filter:after,
.citrus.filter-controls .advanced-filter:after {
  position: absolute;
  content: "\e63a";
  /* icon-expand */
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 14px;
  font-size: 1rem;
  font-style: normal;
  font-weight: 300;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  right: 10px;
  right: 0.714rem;
}
.citrus .filter-controls .advanced-filter.active,
.citrus.filter-controls .advanced-filter.active {
  padding-bottom: 25px;
  padding-bottom: 1.786rem;
  margin-bottom: -18px;
  margin-bottom: -1.286rem;
  border-radius: 2px 2px 0 0;
}
.citrus .filter-controls .advanced-filter.active:after,
.citrus.filter-controls .advanced-filter.active:after {
  content: "\e621";
  /* icon-collapse */
}
.citrus .filter-controls .primary-search,
.citrus.filter-controls .primary-search {
  max-width: 400px;
  max-width: 28.571rem;
  margin: 0 15px;
  margin: 0 1.071rem;
  padding: 0;
}
.citrus .filter-controls .primary-search input,
.citrus.filter-controls .primary-search input {
  width: 50%;
}
.citrus .filter-controls .primary-search.form-button,
.citrus.filter-controls .primary-search.form-button {
  max-width: 600px;
  max-width: 42.857rem;
  width: 80%;
}
.citrus .filter-controls .primary-search.form-button input,
.citrus.filter-controls .primary-search.form-button input {
  max-width: 275px;
  max-width: 19.643rem;
}
.citrus .filter-controls .primary-search.form-button .button + .button,
.citrus.filter-controls .primary-search.form-button .button + .button {
  margin-left: 15px;
  margin-left: 1.071rem;
  border-radius: 2px;
}
@media screen and (max-width: 859px) {
  .citrus .filter-controls .primary-search.form-button,
  .citrus.filter-controls .primary-search.form-button {
    max-width: 400px;
    max-width: 28.571rem;
  }
}
.citrus .filter-controls .primary-search input,
.citrus.filter-controls .primary-search input,
.citrus .filter-controls .primary-search .button,
.citrus.filter-controls .primary-search .button,
.citrus .filter-controls .primary-search .k-widget.k-dropdown,
.citrus.filter-controls .primary-search .k-widget.k-dropdown {
  margin-top: 0;
  float: left;
}
.citrus .filter-controls .primary-search .button,
.citrus.filter-controls .primary-search .button {
  max-width: 90px;
  max-width: 6.429rem;
}
.citrus .filter-controls .primary-search .k-widget.k-dropdown,
.citrus.filter-controls .primary-search .k-widget.k-dropdown {
  max-width: 115px;
  max-width: 8.214rem;
  min-width: 115px;
  min-width: 8.214rem;
  text-align: right;
}
.citrus .filter-controls .primary-search .k-widget.k-dropdown .k-dropdown-wrap.k-state-default,
.citrus.filter-controls .primary-search .k-widget.k-dropdown .k-dropdown-wrap.k-state-default {
  padding: 1px;
  background-color: #fff;
  border-color: #cccccc;
  border-right: none;
  border-left: none;
  border-radius: none;
}
.citrus .filter-controls .primary-search .k-widget.k-dropdown .k-dropdown-wrap.k-state-default.k-state-active.k-state-border-down,
.citrus.filter-controls .primary-search .k-widget.k-dropdown .k-dropdown-wrap.k-state-default.k-state-active.k-state-border-down {
  margin-bottom: 1px;
}
.citrus .filter-controls .primary-search .k-widget.k-dropdown .k-dropdown-wrap.k-state-default .k-input,
.citrus.filter-controls .primary-search .k-widget.k-dropdown .k-dropdown-wrap.k-state-default .k-input {
  padding: 2px 25px 1px 0;
}
@media screen and (max-width: 1024px) {
  .citrus .filter-controls .primary-search .k-widget.k-dropdown,
  .citrus.filter-controls .primary-search .k-widget.k-dropdown {
    display: none;
  }
}
.citrus .filter-controls .load-saved-filters.k-widget.k-dropdown,
.citrus.filter-controls .load-saved-filters.k-widget.k-dropdown {
  float: right;
  width: 200px;
  width: 14.286rem;
}
.citrus .filter-controls .filter-options,
.citrus.filter-controls .filter-options {
  clear: both;
  padding: 15px;
  padding: 1.071rem;
  box-sizing: border-box;
  background: #dadada;
  border: 1px solid #a6a6a6;
  border-radius: 0px 2px 2px 2px;
  position: absolute;
  top: 50px;
  top: 3.571rem;
  z-index: 2;
  max-width: 1240px;
  max-width: 88.571rem;
}
.citrus .filter-controls .filter-options .row [class^="col-"],
.citrus.filter-controls .filter-options .row [class^="col-"] {
  border-left: 1px solid #a6a6a6;
  margin-left: -1px;
}
.citrus .filter-controls .filter-options .row [class^="col-"]:first-child,
.citrus.filter-controls .filter-options .row [class^="col-"]:first-child {
  border-left: none;
}
.citrus .filter-controls #active-filters-more-less,
.citrus.filter-controls #active-filters-more-less {
  position: absolute;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
  opacity: 0;
}
.citrus .filter-controls #active-filters-more-less:checked ~ .active-filters,
.citrus.filter-controls #active-filters-more-less:checked ~ .active-filters,
.citrus .filter-controls #active-filters-more-less.checked ~ .active-filters,
.citrus.filter-controls #active-filters-more-less.checked ~ .active-filters {
  max-height: 1000px;
  max-height: 71.429rem;
}
.citrus .filter-controls #active-filters-more-less:checked ~ .active-filters-more-less-label:before,
.citrus.filter-controls #active-filters-more-less:checked ~ .active-filters-more-less-label:before,
.citrus .filter-controls #active-filters-more-less.checked ~ .active-filters-more-less-label:before,
.citrus.filter-controls #active-filters-more-less.checked ~ .active-filters-more-less-label:before {
  position: relative;
  content: "\e618";
  height: 100%;
  width: 100%;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 14px;
  font-size: 1rem;
  font-style: normal;
  font-weight: 300;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-size: 1.143rem;
  vertical-align: top;
}
.citrus .filter-controls #active-filters-more-less:checked ~ .active-filters-more-less-label:after,
.citrus.filter-controls #active-filters-more-less:checked ~ .active-filters-more-less-label:after,
.citrus .filter-controls #active-filters-more-less.checked ~ .active-filters-more-less-label:after,
.citrus.filter-controls #active-filters-more-less.checked ~ .active-filters-more-less-label:after {
  position: relative;
  content: "Less";
  height: 100%;
  width: 100%;
  font-weight: normal;
  font-size: 14px;
  font-size: 1rem;
  margin-left: 5px;
  margin-left: 0.357rem;
  vertical-align: bottom;
}
.citrus .filter-controls .active-filters-more-less-label,
.citrus.filter-controls .active-filters-more-less-label {
  color: #1588af;
  position: absolute;
  right: 15px;
  right: 1.071rem;
  bottom: 10px;
  bottom: 0.714rem;
  font-weight: bold;
  cursor: pointer;
}
.citrus .filter-controls .active-filters-more-less-label:before,
.citrus.filter-controls .active-filters-more-less-label:before {
  position: relative;
  content: "\e604";
  height: 100%;
  width: 100%;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 14px;
  font-size: 1rem;
  font-style: normal;
  font-weight: 300;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-size: 1.143rem;
  vertical-align: top;
}
.citrus .filter-controls .active-filters-more-less-label:after,
.citrus.filter-controls .active-filters-more-less-label:after {
  position: relative;
  content: "More";
  height: 100%;
  width: 100%;
  font-weight: normal;
  font-size: 14px;
  font-size: 1rem;
  margin-left: 5px;
  margin-left: 0.357rem;
  vertical-align: bottom;
}
.citrus .filter-controls .active-filters,
.citrus.filter-controls .active-filters {
  display: inline-block;
  text-align: left;
  margin: 4px 0 0 0;
  margin: 0.286rem 0 0 0;
  padding: 0;
}
.citrus .filter-controls .active-filters li,
.citrus.filter-controls .active-filters li {
  display: inline-block;
  padding: 4px 7px 4px 3px;
  padding: 0.286rem 0.5rem 0.286rem 0.214rem;
  margin-right: 5px;
  margin-right: 0.357rem;
  cursor: pointer;
  line-height: 1.45;
}
.citrus .filter-controls .active-filters li.filter-label,
.citrus.filter-controls .active-filters li.filter-label {
  cursor: default;
}
.citrus .filter-controls .active-filters li a,
.citrus.filter-controls .active-filters li a {
  display: block;
  padding: 0;
  color: #1588af;
  text-decoration: none;
}
.citrus .filter-controls .active-filters li a:hover,
.citrus.filter-controls .active-filters li a:hover {
  color: #41a8d2;
}
.citrus .filter-controls .active-filters li a:active,
.citrus.filter-controls .active-filters li a:active {
  color: #085a7e;
}
.citrus .filter-controls .active-filters li a:before,
.citrus.filter-controls .active-filters li a:before {
  position: relative;
  content: "\e62b";
  /* icon-delete */
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 14px;
  font-size: 1rem;
  font-style: normal;
  font-weight: 300;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-right: 5px;
  padding-right: 0.357rem;
  top: 1px;
  top: 0.071rem;
}
@media screen and (max-width: 1024px) {
  .citrus .filter-controls .active-filters,
  .citrus.filter-controls .active-filters {
    max-height: 30px;
    max-height: 2.143rem;
    margin-right: 55px;
    margin-right: 3.929rem;
    transition: max-height 0.2s ease;
    overflow: hidden;
  }
}
.citrus .filter-controls .filter-footer,
.citrus.filter-controls .filter-footer {
  margin-top: 15px;
  margin-top: 1.071rem;
}
.citrus .filter-controls .save-search-controls .form-group,
.citrus.filter-controls .save-search-controls .form-group {
  float: right;
  max-width: 200px;
  margin-right: 15px;
  margin-right: 1.071rem;
}
.citrus .filter-controls .save-search-controls .form-group input,
.citrus.filter-controls .save-search-controls .form-group input,
.citrus .filter-controls .save-search-controls .form-group .button,
.citrus.filter-controls .save-search-controls .form-group .button {
  margin-top: 0;
}
.citrus .filter-controls .save-search-controls .form-group.form-button,
.citrus.filter-controls .save-search-controls .form-group.form-button {
  padding-bottom: 0;
}
.citrus .filter-controls .save-search-controls .button,
.citrus.filter-controls .save-search-controls .button {
  float: right;
}
@media screen and (max-width: 699px) {
  .citrus .filter-controls .save-search-controls,
  .citrus.filter-controls .save-search-controls {
    display: none;
  }
}
.citrus .content-area .filter-controls,
.citrus.content-area .filter-controls {
  margin: 15px 15px 0 15px;
  margin: 1.071rem 1.071rem 0 15px;
  margin: 1.071rem 1.071rem 0 1.071rem;
}
.citrus .content-area .filter-controls.filter-limited,
.citrus.content-area .filter-controls.filter-limited {
  margin: 0;
  padding: 15px;
  padding: 1.071rem;
}
.citrus .content-area .filter-controls.filter-limited .advanced-filter.active,
.citrus.content-area .filter-controls.filter-limited .advanced-filter.active {
  padding-bottom: 10px;
  padding-bottom: 0.714rem;
  margin-bottom: 0;
  border-radius: 2px;
}
.citrus .content-area .filter-controls.filter-limited .advanced-filter.active:after,
.citrus.content-area .filter-controls.filter-limited .advanced-filter.active:after {
  content: "\e621";
  /* icon-collapse */
}
.citrus .content-area .filter-controls.filter-limited .active-filters-more-less-label:before,
.citrus.content-area .filter-controls.filter-limited .active-filters-more-less-label:before {
  content: "\e65f";
}
.citrus .content-area .filter-controls.filter-limited .active-filters-more-less-label:after,
.citrus.content-area .filter-controls.filter-limited .active-filters-more-less-label:after {
  content: " ";
}
.citrus .content-area .filter-controls.filter-limited .active-filters,
.citrus.content-area .filter-controls.filter-limited .active-filters {
  padding: 0;
  margin-right: 15px;
  margin-right: 1.071rem;
  transition: none;
}
.citrus .content-area .filter-controls.filter-limited .filter-options,
.citrus.content-area .filter-controls.filter-limited .filter-options {
  position: relative;
  top: 15px;
  background: #f5f5f5;
  border-color: #cccccc;
  border-right: none;
  border-left: none;
  border-radius: 0;
  margin-bottom: -1px;
  z-index: 1;
}
.citrus .content-area .filter-controls.filter-limited .filter-options .row [class^="col-"],
.citrus.content-area .filter-controls.filter-limited .filter-options .row [class^="col-"] {
  border-left: none;
  margin-left: 0;
}
.citrus .filters .save-input {
  width: auto;
  min-width: 300px;
}
.citrus .filters .save-input > input {
  margin-top: 0;
  margin-left: 15px;
  width: auto;
}
.citrus .filters .save-input.form-group > button {
  margin-top: 0;
  width: 80px;
  float: none;
}
.citrus .filters .active-filters {
  display: inline-block;
  text-align: left;
  margin: 0 0;
  padding: 0;
  overflow: hidden;
  transition: all 0.3s ease;
  max-height: 1000px;
}
.citrus .filters .active-filters.collapsed {
  max-height: 28px;
}
.citrus .filters .active-filters li {
  display: inline-block;
  cursor: pointer;
  line-height: 1.45;
}
.citrus .filters .active-filters li.filter-label {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  cursor: default;
  padding-top: 6px;
  vertical-align: middle;
}
.citrus .filters .active-filters li a {
  white-space: normal;
}
.citrus .filters .active-filters li a:before {
  position: relative;
  content: "\e62b";
  /* icon-delete */
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 14px;
  font-size: 1rem;
  font-style: normal;
  font-weight: 300;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 12px;
  padding-right: 5px;
  padding-right: 0.357rem;
  top: 1px;
  top: 0.071rem;
}
.citrus .filters .active-filters li a.icon:before {
  content: "";
  padding: 0;
}
.citrus .drawer .filter-accordion {
  padding: 0 15px;
  padding: 0 1.071rem;
}
.citrus .drawer .form-filter:before {
  color: #1588af !important;
  top: 25px;
  top: 1.786rem;
  left: 25px;
  left: 1.786rem;
}
.citrus .drawer .accordion .filter-section {
  padding: 0 24px !important;
  padding: 0 1.714rem !important;
}
.citrus .drawer .accordion .form-filter-alternate {
  padding: 15px 15px 16px 0;
  padding: 1.071rem 1.071rem 1.143rem 0;
  border-bottom: 1px solid #dadada;
  box-sizing: border-box;
  position: relative;
}
.citrus .filters-drawer-form {
  padding: 15px;
  padding: 1.071rem;
  width: 45%;
}
.citrus .filters-drawer-form .apply-action {
  color: #fff;
  text-decoration: none;
}
.citrus .filters-drawer-form .form-group {
  width: 55%;
  float: right;
  margin-right: 16px;
  margin-right: 1.143rem;
}
.citrus .filters-drawer-form .form-group input {
  margin-top: 0px;
  width: 65%;
}
.citrus .filters-drawer-form .form-group .button {
  margin-top: 0px;
  width: 35%;
}
.citrus .update-filter {
  float: left;
}
.citrus .save-filter-modal .form-group {
  margin-top: 15px;
  margin-top: 1.071rem;
}
.citrus .filter-border-none {
  border-bottom: none !important;
}
.citrus .filter-border-none :before {
  color: #41a8d2;
}
.citrus .filters-toggle .card-content {
  float: left;
  margin-bottom: 20px;
  margin-bottom: 1.429rem;
  margin-right: 20px;
  margin-right: 1.429rem;
}
.citrus .load-filters-action {
  display: none;
  width: 200px;
  width: 14.286rem;
  margin-right: 15px;
  margin-right: 1.071rem;
}
.citrus .initial-update {
  display: none;
}
.citrus .save-initial-state {
  display: none;
  margin-left: 50px;
  margin-left: 3.571rem;
  float: left;
}
.citrus .edit-filters-action {
  display: none;
  float: left;
  margin-top: 15px;
  margin-top: 1.071rem;
  width: 1px;
  width: 0.071rem;
}
.citrus .sorting-filters {
  float: right;
}
.citrus .form-filter:before {
  color: #1588af !important;
  top: 25px;
  top: 1.786rem;
  right: 25px;
  right: 1.786rem;
}
.citrus .filters-clear {
  margin: 15px 0 10px 0;
  margin: 1.071rem 0 0.714rem 0;
}
.citrus .js-save-field {
  visibility: visible;
}
.ie8 .citrus .filter-controls .primary-search input,
.ie8 .citrus.filter-controls .primary-search input {
  width: 45%;
}
.ie8 .citrus .filter-controls #active-filtersmore-less,
.ie8 .citrus.filter-controls #active-filtersmore-less,
.ie8 .citrus .filter-controls .active-filters-more-less-label,
.ie8 .citrus.filter-controls .active-filters-more-less-label {
  display: none;
}
.ie8 .citrus .filter-controls .active-filters,
.ie8 .citrus.filter-controls .active-filters {
  max-height: 1000px;
  overflow: auto;
  display: block;
}
.citrus .content-area .loader {
  position: absolute;
  display: block;
}
.citrus .content-area .loader.backdrop {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP4vwkAArMBsonMJUgAAAAASUVORK5CYII=);
}
.citrus .content-area .loader .loading-animation {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 80px;
  height: 24px;
}
.citrus .loader {
  position: relative;
  display: table;
  width: 100%;
  height: 100%;
}
.citrus .loader .loading-animation {
  position: relative;
  display: table-cell;
  width: 100%;
  height: auto;
  vertical-align: middle;
  text-align: center;
  padding: 40px 0;
}
.citrus .loader .loading-animation div {
  width: 12px;
  height: 12px;
  background-color: #DADADA;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: bouncedelay 1.2s infinite ease-in-out;
  animation: bouncedelay 1.2s infinite ease-in-out;
  /* Prevent first frame from flickering when animation starts */
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.citrus .loader .loading-animation .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.citrus .loader .loading-animation .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
@-webkit-keyframes bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes bouncedelay {
  0%,
  80%,
  100% {
    transform: scale(0);
  }
  40% {
    transform: scale(1);
  }
}
.citrus > .loader {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: fixed;
  top: 0;
  bottom: 0;
  z-index: 1000;
}
.citrus > .loader .loading-animation {
  position: absolute;
  display: inline-block;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  z-index: 1200;
  height: 24px;
  width: 80px;
}
.citrus > .loader .loading-animation div {
  width: 24px;
  height: 24px;
  background-color: #FFF;
}
.citrus .button .loader,
.citrus.button .loader {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: table-cell;
  border: 1px solid;
  margin-top: -1px;
  margin-left: -1px;
  border-radius: 2px;
}
.citrus .button .loader .loading-animation,
.citrus.button .loader .loading-animation {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50%;
  margin: auto;
  padding: 0;
}
.citrus .button .loader .loading-animation div,
.citrus.button .loader .loading-animation div {
  vertical-align: middle;
  width: 8px;
  height: 8px;
  background-color: #FFF;
}
.ie8 .citrus .loader .loading-animation,
.ie9 .citrus .loader .loading-animation {
  width: 44px;
  height: 12px;
  background: url(../assets/images/loader-page.gif) no-repeat 50% 50%;
}
.ie8 .citrus .loader .loading-animation div,
.ie9 .citrus .loader .loading-animation div {
  display: none;
}
.ie8 .citrus > .loader .loading-animation,
.ie9 .citrus > .loader .loading-animation {
  width: 88px;
  height: 24px;
  background-image: url(../assets/images/loader-global.gif);
  padding: 0;
}
.ie8 .citrus > .loader .loading-animation div,
.ie9 .citrus > .loader .loading-animation div {
  display: none;
}
.ie8 .citrus .button .loader,
.ie9 .citrus .button .loader,
.ie8 .citrus.button .loader,
.ie9 .citrus.button .loader {
  display: table;
  height: 100%;
  width: 100%;
}
.ie8 .citrus .button .loader .loading-animation,
.ie9 .citrus .button .loader .loading-animation,
.ie8 .citrus.button .loader .loading-animation,
.ie9 .citrus.button .loader .loading-animation {
  display: table-cell;
  background-image: url(../assets/images/loader-button.gif);
  width: 100%;
  height: auto;
  vertical-align: middle;
  text-align: center;
}
.citrus .bounding-box,
.citrus.bounding-box {
  position: relative;
  margin: 0 auto;
  border: 1px solid #cccccc;
  border-radius: 8px;
  &.insights-wrapper {
    border: none;
  }
}
.citrus .bounding-box.width-1280,
.citrus.bounding-box.width-1280 {
  max-width: 1280px;
  max-width: 91.429rem;
  padding: 15px 20px;
  padding: 1.071rem 1.429rem;
  box-sizing: border-box;
}
@media screen and (max-width: 699px) {
  .citrus .bounding-box.width-1280,
  .citrus.bounding-box.width-1280 {
    padding: 0;
  }
}
.citrus .bounding-box.width-960,
.citrus.bounding-box.width-960 {
  max-width: 960px;
  max-width: 68.571rem;
  padding: 15px 20px;
  padding: 1.071rem 1.429rem;
  box-sizing: border-box;
}
@media screen and (max-width: 699px) {
  .citrus .bounding-box.width-960,
  .citrus.bounding-box.width-960 {
    padding: 0;
  }
}
.citrus .bounding-box .content-area,
.citrus.bounding-box .content-area {
  background: #fff;
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  margin-bottom: 20px;
  margin-bottom: 1.429rem;
}
@media screen and (max-width: 699px) {
  .citrus .bounding-box .content-area,
  .citrus.bounding-box .content-area {
    border: none;
    margin-bottom: 0;
  }
}
.citrus.accordion,
.citrus .accordion {
  width: 100%;
}
.citrus.accordion .accordion-expand > a,
.citrus .accordion .accordion-expand > a {
  display: block;
  padding: 15px 15px 15px 0px;
  padding: 1.071rem 1.071rem 1.071rem 0rem;
  text-decoration: none;
}
.citrus.accordion .accordion-header,
.citrus .accordion .accordion-header {
  border-top: 1px solid #cccccc;
}
.citrus.accordion .accordion-header a,
.citrus .accordion .accordion-header a {
  display: block;
  font-weight: 600;
  line-height: 2;
  padding: 8px 20px 8px 24px;
  padding: 0.571rem 1.429rem 0.571rem 1.714rem;
  position: relative;
  text-decoration: none;
}
.citrus.accordion .accordion-header a:after,
.citrus .accordion .accordion-header a:after {
  position: absolute;
  content: "\e63a";
  /* icon-expand */
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 16px;
  font-size: 1.143rem;
  font-style: normal;
  font-weight: 600;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  top: 5px;
  top: 0.357rem;
  left: 0px;
  left: 0rem;
}
.citrus.accordion .accordion-header p,
.citrus .accordion .accordion-header p {
  color: #222222;
  font-weight: 400;
  margin-top: 4px;
  margin-top: 0.286rem;
}
.citrus.accordion .accordion-header.active a:after,
.citrus .accordion .accordion-header.active a:after {
  content: "\e621";
  /* icon-collapse */
}
.citrus.accordion .accordion-header.active + section,
.citrus .accordion .accordion-header.active + section {
  padding: 0px 30px 20px 30px;
  padding: 0rem 2.143rem 1.429rem 2.143rem;
  max-height: 2400px;
  max-height: 171.429rem;
}
.citrus.accordion section,
.citrus .accordion section {
  box-sizing: border-box;
  border-width: 0 1px 0 1px;
  border-top: 0;
  line-height: 1.2;
  max-height: 0px;
  margin: 0;
  overflow: hidden;
  padding: 0px 30px 0px 30px;
  padding: 0rem 2.143rem 0rem 2.143rem;
  transition: max-height 0.2s ease-in-out;
  transition: padding 0.1s ease-in-out;
}
.citrus.accordion section:last-of-type,
.citrus .accordion section:last-of-type {
  border-bottom: 1px solid #cccccc;
}
.citrus.accordion section.padding-none,
.citrus .accordion section.padding-none {
  padding: 0px;
  padding: 0rem;
}
.citrus.accordion.section-title > .accordion-expand > a,
.citrus .accordion.section-title > .accordion-expand > a {
  color: #2eab73;
}
.citrus.accordion.section-title > .accordion-header,
.citrus .accordion.section-title > .accordion-header {
  border-bottom: 1px solid #2eab73;
  border-width: 0px 0 1px 0;
}
.citrus.accordion.section-title > .accordion-header a,
.citrus .accordion.section-title > .accordion-header a {
  color: #2eab73;
  font-size: 18px;
  font-size: 1.286rem;
  line-height: 1.45;
  padding: 12px 0px 5px 0px;
  padding: 0.857rem 0rem 0.357rem 0rem;
}
.citrus.accordion.section-title > .accordion-header a:after,
.citrus .accordion.section-title > .accordion-header a:after {
  color: #2eab73;
  font-size: 20px;
  font-size: 1.429rem;
  font-weight: 400;
  left: auto;
  right: 0px;
  right: 0rem;
  top: 13px;
  top: 0.929rem;
}
.citrus.accordion.section-title > .accordion-header p,
.citrus .accordion.section-title > .accordion-header p {
  display: none;
}
.citrus.accordion.section-title > .accordion-header.active + section,
.citrus .accordion.section-title > .accordion-header.active + section {
  padding: 20px 0px 20px 0px;
  padding: 1.429rem 0rem 1.429rem 0rem;
  max-height: 2400px;
  max-height: 171.429rem;
}
.citrus.accordion.section-title > section,
.citrus .accordion.section-title > section {
  padding: 0px;
  padding: 0rem;
}
.citrus.accordion.section-title > section:last-of-type,
.citrus .accordion.section-title > section:last-of-type {
  border-bottom: none;
}
.citrus .shuttle .shuttle-container .k-pager-wrap {
  display: none;
}
.citrus .shuttle .shuttle-container .k-grid {
  border: none;
}
.citrus .shuttle .shuttle-container .k-grid .k-grid-header {
  border: none;
}
.citrus .shuttle .shuttle-container .k-grid .k-grid-content {
  overflow: hidden;
  margin-top: -1px;
}
.citrus .shuttle .shuttle-container .k-grid tbody:first-child {
  border: none;
}
.citrus .shuttle .shuttle-container .k-grid tr:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.citrus .shuttle .shuttle-container .k-grid tr td {
  border-left: none;
}
@media only screen and (max-width: 1024px) {
  .citrus .shuttle .shuttle-container .k-grid .k-pager-numbers .k-current-page .k-link {
    background-color: #ff6611;
    color: #fff;
  }
}
.citrus .shuttle .shuttle-container .shuttle-selection-grid {
  border: 1px solid #cccccc;
  margin-bottom: 15px;
  margin-bottom: 1.071rem;
}
.citrus .shuttle[readonly] .shuttle-container .k-grid tr:hover {
  background-color: transparent;
  cursor: default;
}
.citrus .date-nav-controls,
.citrus.date-nav-controls {
  border-bottom: 1px solid #cccccc;
  padding: 8px 0;
  padding: 0.571rem 0;
}
.citrus .date-nav-controls .button.icon + .button.icon,
.citrus.date-nav-controls .button.icon + .button.icon {
  margin-left: 0;
}
.citrus .date-nav-controls .button.icon,
.citrus.date-nav-controls .button.icon {
  height: 28px;
  height: 2rem;
  width: 28px;
  width: 2rem;
}
.citrus .date-nav-controls .button.icon i,
.citrus.date-nav-controls .button.icon i {
  font-size: 18px;
  font-size: 1.286rem;
}
.citrus .date-nav-controls .date-range a,
.citrus.date-nav-controls .date-range a {
  text-decoration: none;
}
.citrus .date-nav-controls .date-range .h2,
.citrus.date-nav-controls .date-range .h2 {
  display: inline-block;
  font-size: 18px;
  font-size: 1.286rem;
  margin: 5px 15px 0px 5px;
  margin: 0.357rem 1.071rem 0rem 0.357rem;
  vertical-align: text-bottom;
}
.citrus .date-nav-controls .date-range .h2.range-start,
.citrus.date-nav-controls .date-range .h2.range-start {
  margin-right: 5px;
  margin-right: 0.357rem;
}
.citrus .date-nav-controls .date-range .range-separator,
.citrus.date-nav-controls .date-range .range-separator {
  margin-right: 5px;
  margin-right: 0.357rem;
}
.citrus .date-nav-controls .date-range .k-widget.k-datepicker.k-header,
.citrus.date-nav-controls .date-range .k-widget.k-datepicker.k-header {
  visibility: hidden;
  position: absolute;
  left: 15px;
  left: 1.071rem;
  margin-top: 10px;
  margin-top: 0.714rem;
}
.citrus .date-nav-controls .date-range .range-dropdown-start.k-widget.k-datepicker.k-header,
.citrus.date-nav-controls .date-range .range-dropdown-start.k-widget.k-datepicker.k-header {
  left: 15px;
  left: 1.071rem;
}
.citrus .date-nav-controls .date-range .range-dropdown-end.k-widget.k-datepicker.k-header,
.citrus.date-nav-controls .date-range .range-dropdown-end.k-widget.k-datepicker.k-header {
  left: 140px;
  left: 10rem;
}
.citrus .date-nav-controls .date-range .button.size-small,
.citrus.date-nav-controls .date-range .button.size-small {
  margin-top: 3px;
  margin-top: 0.214rem;
}
.citrus .date-nav-controls .date-range i,
.citrus.date-nav-controls .date-range i {
  font-size: 18px;
  font-size: 1.286rem;
  margin-top: 8px;
  margin-top: 0.571rem;
}
.citrus .date-nav-controls .right-controls,
.citrus.date-nav-controls .right-controls {
  float: right;
}
.citrus .date-nav-controls .right-controls .k-form-group,
.citrus.date-nav-controls .right-controls .k-form-group {
  display: inline-block;
  width: 180px;
  width: 12.857rem;
}
.citrus .date-nav-controls .right-controls label,
.citrus.date-nav-controls .right-controls label {
  vertical-align: middle;
}
@media screen and (max-width: 1024px) {
  .citrus .date-nav-controls .right-controls label,
  .citrus.date-nav-controls .right-controls label {
    display: none;
  }
}
.citrus .draggable-item-mirror {
  position: fixed !important;
  margin: 0 !important;
  z-index: 9999 !important;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  filter: alpha(opacity=80);
  background: #1588af;
  color: #fff;
}
.citrus .draggable-item-mirror:before {
  color: #fff;
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}
.citrus .draggable-item-unselectable {
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
}
.citrus .draggable-transit {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";
  opacity: 0.5;
}
.citrus .draggable-item-transit {
  display: block;
  padding: 10px;
  padding: 0.714rem;
  color: #a6a6a6;
  border-color: #dadada;
  background: #dadada;
}
.citrus .draggable-item-transit:before {
  color: #dadada;
}
.citrus .draggable-item-transit i {
  color: #a6a6a6;
}
.citrus .draggable-item-ghost {
  color: #fff;
  border-color: #cccccc;
  padding: 10px 10px 0;
  box-sizing: border-box;
}
.citrus .draggable-item-ghost:before {
  color: #cccccc;
}
.citrus .draggable-item-ghost i {
  color: #fff;
}
.citrus .draggable-item {
  position: relative;
  list-style: none;
  box-sizing: border-box;
  padding: 12px 10px 12px 40px;
  margin-bottom: 10px;
  margin-bottom: 0.714rem;
  border: 1px solid #1588af;
  font-size: 16px;
  font-size: 1.143rem;
  border-radius: 2px;
  color: #393939;
}
.citrus .draggable-item:before {
  position: absolute;
  left: 10px;
  top: 10px;
  font-family: 'PaylocityIcons-Bold';
  speak: none;
  font-style: normal;
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 20px;
  font-size: 1.429rem;
  margin-right: 10px;
  margin-right: 0.714rem;
  content: "\e636";
  color: #1588af;
  font-weight: bold;
  cursor: move;
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
}
.citrus .draggable-item.size-small {
  padding: 10px 10px 10px 28px;
  font-size: 14px;
  font-size: 1rem;
  position: relative;
}
.citrus .draggable-item.size-small:before {
  top: 10px;
  left: 8px;
  font-size: 14px;
  font-size: 1rem;
}
.citrus .draggable-item.disabled {
  background: #fff;
  color: #cccccc;
  border-color: #cccccc;
}
.citrus .draggable-item.disabled:before {
  color: #cccccc;
}
.citrus .scheduled-shift-transit {
  color: #dadada;
  border-color: #dadada;
  background: #dadada;
}
.citrus .scheduled-shift-transit:before {
  color: #dadada;
}
.citrus .scheduled-shift-transit .shift-info {
  border-color: #dadada;
}
.citrus .scheduled-shift-mirror {
  border-color: #1588af;
  color: #222222;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);
}
.citrus .scheduled-shift-mirror .shift-info {
  border-color: #1588af;
}
.citrus .scheduled-shift-ghost {
  color: #cccccc;
  border-color: #cccccc;
}
.citrus .scheduled-shift-ghost:before {
  color: #cccccc;
}
.citrus .scheduled-shift-ghost .shift-info {
  border-color: #cccccc;
}
.citrus .draggable-placeholder {
  border: 1px dashed #eaeaea;
  color: #a6a6a6;
  text-align: center;
  font-size: 18px;
  font-size: 1.286rem;
  padding: 12px;
  padding: 0.857rem;
}
.citrus .list-draggable {
  list-style: none;
  margin: 0px;
  margin: 0rem;
  padding: 10px 0px;
}
.citrus .gu-mirror {
  position: fixed !important;
  margin: 0 !important;
  z-index: 9999 !important;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  filter: alpha(opacity=80);
  background: #1588af;
  color: #fff;
}
.citrus .gu-mirror:before {
  color: #fff;
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}
.citrus li.gu-mirror {
  list-style: none;
  margin: 0px;
  margin: 0rem;
}
.citrus .gu-hide {
  display: none !important;
}
.citrus .gu-unselectable {
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
}
.citrus .gu-transit {
  display: block;
  padding: 10px;
  padding: 0.714rem;
  color: #a6a6a6;
  border-color: #dadada;
  background: #dadada;
}
.citrus .gu-transit:before {
  color: #dadada;
}
.citrus .gu-transit i {
  color: #a6a6a6;
}
.citrus .gu-ghost {
  color: #fff;
  border-color: #cccccc;
  padding: 10px 10px 0;
  box-sizing: border-box;
}
.citrus .gu-ghost:before {
  color: #cccccc;
}
.citrus .gu-ghost i {
  color: #fff;
}
.citrus .gu-source .gu-ghost {
  display: none;
}
.citrus .scheduled-shift.gu-transit.color-1 {
  color: #dadada;
  border-color: #dadada;
  background: #dadada;
}
.citrus .scheduled-shift.gu-transit.color-1:before {
  color: #dadada;
}
.citrus .scheduled-shift.gu-transit.color-1 .shift-info {
  border-color: #dadada;
}
.citrus .scheduled-shift.gu-mirror.color-1 {
  border-color: #1588af;
  color: #222222;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);
}
.citrus .scheduled-shift.gu-mirror.color-1 .shift-info {
  border-color: #1588af;
}
.citrus .scheduled-shift.gu-ghost.color-1 {
  color: #cccccc;
  border-color: #cccccc;
}
.citrus .scheduled-shift.gu-ghost.color-1:before {
  color: #cccccc;
}
.citrus .scheduled-shift.gu-ghost.color-1 .shift-info {
  border-color: #cccccc;
}
.citrus .row-draggable {
  position: relative;
}
.citrus .row-draggable [contenteditable="true"] {
  cursor: text;
}
.citrus .row-draggable [contenteditable="true"]:focus {
  outline: none;
  position: relative;
  border-bottom: 1px dashed #a6a6a6;
}
.citrus .row-draggable [contenteditable="true"]:empty:before {
  content: attr(placeholder);
  color: #a6a6a6;
  display: block;
  /* For Firefox */
}
.citrus .row-draggable:hover .row-draggable-content {
  margin-top: -1px;
  margin-bottom: -1px;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eaeaea;
}
.citrus .row-draggable:hover .draggable-options,
.citrus .row-draggable.active .draggable-options {
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -14px;
  font-size: 14px;
  font-size: 1rem;
  margin-right: 10px;
  margin-right: 0.714rem;
  color: #a6a6a6;
  font-weight: bold;
  cursor: move;
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
  background: #fff;
  border: 1px solid #eaeaea;
  z-index: 11;
}
.citrus .row-draggable:hover .draggable-options:hover,
.citrus .row-draggable.active .draggable-options:hover {
  color: #1588af;
}
.citrus .row-draggable.gu-ghost {
  margin: 5px 0;
  border-radius: 2px;
}
.citrus .row-draggable.gu-ghost .row-draggable-container {
  display: none;
  color: white;
}
.citrus .row-draggable.gu-ghost .row-draggable-ghost {
  display: block;
}
.citrus .row-draggable .draggable-options {
  display: none;
}
.citrus .row-draggable.active .draggable-options a.button.icon .icon-edit {
  font-weight: bold;
  color: #1588af;
}
.citrus .row-draggable.active {
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);
  z-index: 10;
  margin: -1px -20px 0px;
  border-top: 1px solid #eaeaea;
}
.citrus .row-draggable.active .edit {
  font-weight: bold;
  right: -40px;
}
.citrus .row-draggable.active .edit i {
  font-weight: bold;
}
.citrus .row-draggable.active:hover .row-draggable-content {
  background: inherit;
}
.citrus .row-draggable.active .row-draggable-content {
  padding: 0px 5px;
}
.citrus .row-draggable.active .row-draggable-content.paragraph {
  padding: 0;
}
.citrus .row-draggable.active .row-draggable-header,
.citrus .row-draggable.active .row-draggable-footer {
  display: block;
  padding: 0px 5px;
}
.citrus .row-draggable .row-draggable-header {
  display: none;
}
.citrus .row-draggable .row-draggable-footer {
  border-top: 1px dashed #dadada;
  display: none;
  overflow: hidden;
  background: #f5f5f5;
}
.citrus .row-draggable .row-draggable-ghost {
  display: none;
}
.citrus .disabler {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 3;
  opacity: 0;
}
.citrus .row-draggable.preview:hover .row-draggable-content {
  border: none;
  margin-top: 0;
  margin-bottom: 0;
}
.citrus .row-draggable.preview .draggable-options {
  display: none;
}
.citrus .icon-drag {
  cursor: move;
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
}
.citrus .icon-drag:active {
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}
.citrus .disabled {
  cursor: not-allowed;
}
body.drawer-open {
  overflow: hidden;
}
.citrus .drawer {
  background: #fff;
  bottom: 0;
  display: block;
  max-width: 1280px;
  position: fixed;
  right: -65%;
  top: 0;
  transition: all 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
  width: 65%;
  z-index: 810;
}
@media only screen and (max-width: 1323px) {
  .citrus .drawer {
    right: -860px;
    width: 860px;
  }
}
@media only screen and (max-width: 859px) {
  .citrus .drawer {
    right: -100%;
    width: 100%;
  }
}
.citrus .drawer.small {
  right: -400px;
  max-width: 400px;
  width: 100%;
}
@media only screen and (max-width: 699px) {
  .citrus .drawer.small {
    max-width: 100%;
    right: -100%;
    width: 100%;
  }
}
.citrus .drawer.small.open {
  right: 0;
}
.citrus .drawer.small.left {
  left: -400px;
  right: auto;
}
@media only screen and (max-width: 699px) {
  .citrus .drawer.small.left {
    left: -100%;
  }
}
.citrus .drawer.small.left.open {
  left: 0;
}
.citrus .drawer.medium {
  right: -700px;
  max-width: 700px;
  width: 100%;
}
@media only screen and (max-width: 859px) {
  .citrus .drawer.medium {
    max-width: 100%;
    right: -100%;
    width: 100%;
  }
}
.citrus .drawer.medium.open {
  right: 0;
}
.citrus .drawer.medium.left {
  left: -700px;
  right: auto;
}
@media only screen and (max-width: 859px) {
  .citrus .drawer.medium.left {
    left: -100%;
  }
}
.citrus .drawer.medium.left.open {
  left: 0;
}
.citrus .drawer.left {
  left: -65%;
  right: auto;
}
@media only screen and (max-width: 1323px) {
  .citrus .drawer.left {
    left: -860px;
    width: 860px;
  }
}
@media only screen and (max-width: 859px) {
  .citrus .drawer.left {
    left: -100%;
    width: 100%;
  }
}
.citrus .drawer.left.open {
  left: 0;
}
.citrus .drawer.col-fixed {
  bottom: auto;
  height: 100%;
  margin-left: -100%;
  padding: 0;
  position: relative;
  right: 0;
  width: 25%;
}
@media only screen and (min-width: 700px) and (max-width: 859px) {
  .citrus .drawer.col-fixed {
    width: 33.3%;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .drawer.col-fixed {
    position: fixed;
    right: -100%;
    width: 100%;
    z-index: 30;
  }
}
.citrus .drawer.col-fixed.open {
  margin-left: 0;
}
@media only screen and (max-width: 699px) {
  .citrus .drawer.col-fixed.open {
    right: 0;
  }
}
@media screen and (min-width: 700px) {
  .citrus .drawer.col-fixed.open .drawer-content .drawer-scroll {
    position: static;
  }
}
.citrus .drawer.col-fixed.left {
  left: 0;
  margin-left: 0;
  margin-right: -100%;
}
@media only screen and (max-width: 699px) {
  .citrus .drawer.col-fixed.left {
    left: -100%;
    right: auto;
  }
}
.citrus .drawer.col-fixed.left.open {
  margin-right: 0;
}
@media only screen and (max-width: 699px) {
  .citrus .drawer.col-fixed.left.open {
    left: 0;
    right: auto;
  }
}
.citrus .drawer.col-fixed .overlay {
  display: none;
}
@media only screen and (max-width: 699px) {
  .citrus .drawer.col-fixed .overlay {
    display: block;
  }
}
.citrus .drawer.col-fixed .drawer {
  bottom: auto;
  height: 100%;
  overflow: auto;
  position: absolute;
  right: -100%;
  width: 100%;
}
.citrus .drawer.col-fixed .drawer.open {
  right: 0;
}
.citrus .drawer.col-fixed .drawer.left {
  left: -100%;
  right: auto;
}
.citrus .drawer.col-fixed .drawer.left.open {
  left: 0;
}
.citrus .drawer.open {
  right: 0;
}
.citrus .drawer.open .overlay {
  opacity: 1;
  visibility: visible;
}
.citrus .drawer.open .drawer .overlay {
  opacity: 0;
  visibility: hidden;
}
.citrus .drawer .overlay {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NEJBRjUwRjk2MkRFMTFFNEFCRThEMEMzMjQ5ODQzMkEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NEJBRjUwRkE2MkRFMTFFNEFCRThEMEMzMjQ5ODQzMkEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0QkFGNTBGNzYyREUxMUU0QUJFOEQwQzMyNDk4NDMyQSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0QkFGNTBGODYyREUxMUU0QUJFOEQwQzMyNDk4NDMyQSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhuHMKQAAAAPSURBVHjaYlBSUmoACDAAAbcA5/aIYDUAAAAASUVORK5CYII=);
  bottom: 0;
  content: '';
  display: block;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  transition: all 0.2s linear;
  visibility: hidden;
  width: 100%;
  z-index: -1;
}
.citrus .drawer .wrapper {
  background: #fff;
  height: 100%;
}
.citrus .drawer .wrapper:before {
  content: '';
  float: left;
  height: 100%;
}
.citrus .drawer .drawer-header {
  overflow: hidden;
}
.citrus .drawer .drawer-content {
  position: relative;
}
.citrus .drawer .drawer-content:after {
  clear: both;
  content: '';
  display: block;
}
.citrus .drawer .drawer-content .drawer-scroll {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  width: 100%;
}
.citrus.header,
.citrus .header {
  box-sizing: border-box;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);
  height: auto;
  left: 0;
  top: 0;
  margin: 0px 0px 20px 0px;
  margin: 0rem 0rem 1.429rem 0rem;
  width: 100%;
  z-index: 800;
}
.citrus.header:after,
.citrus .header:after {
  clear: both;
  content: "";
  display: table;
}
.citrus.header.impersonation,
.citrus .header.impersonation {
  background-color: #5e4982;
}
.citrus.header.impersonation .impersonation-bar,
.citrus .header.impersonation .impersonation-bar {
  display: block;
}
.citrus.header.impersonation .header-top,
.citrus .header.impersonation .header-top {
  margin-top: -1px;
  margin-top: -0.071rem;
}
.citrus.header .impersonation-bar,
.citrus .header .impersonation-bar {
  border-bottom: 1px solid #fff;
  color: #fff;
  display: none;
  font-size: 50px;
  font-size: 3.571rem;
  line-height: 0.4;
  padding: 1px 0px 10px 0px;
  padding: 0.071rem 0rem 0.714rem 0rem;
  margin: 0px;
  text-align: center;
  width: 100%;
}
.citrus.header-nav,
.citrus .header-nav {
  background-color: #fff;
  box-sizing: border-box;
  display: block;
  position: relative;
  width: 100%;
  z-index: 810;
}
.citrus.header-nav:after,
.citrus .header-nav:after {
  clear: both;
  content: "";
  display: table;
}
.citrus.header-nav .menu,
.citrus .header-nav .menu {
  border-bottom: 1px solid #cccccc;
  box-sizing: border-box;
  list-style: none;
  margin: 0px;
  min-height: 38px;
  min-height: 2.714rem;
  padding: 0px 20px;
  padding: 0rem 1.429rem;
  width: 100%;
}
.citrus.header-nav .menu li,
.citrus .header-nav .menu li {
  display: inline-block;
  margin: 0px 4px;
  margin: 0rem 0.286rem;
}
.citrus.header-nav .menu li > a,
.citrus .header-nav .menu li > a {
  display: block;
  color: #666666;
  padding: 12px 8px 6px 8px;
  padding: 0.857rem 0.571rem 0.429rem 0.571rem;
  text-decoration: none;
}
.citrus.header-nav .menu li > a:hover,
.citrus .header-nav .menu li > a:hover,
.citrus.header-nav .menu li > a:active,
.citrus .header-nav .menu li > a:active {
  border-bottom: 5px solid #0052a1;
  color: #222222;
  text-decoration: none;
}
.citrus.header-nav .menu li.active > a,
.citrus .header-nav .menu li.active > a {
  border-bottom: 5px solid #0052a1;
  color: #222222;
  text-decoration: none;
}
.citrus.header-nav .menu li:first-child,
.citrus .header-nav .menu li:first-child {
  margin: 0px 4px 0px 0px;
  margin: 0rem 0.286rem 0rem 0rem;
}
.citrus.header-nav .menu li:first-child > a,
.citrus .header-nav .menu li:first-child > a {
  padding: 12px 6px 6px 0px;
  padding: 0.857rem 0.429rem 0.429rem 0rem;
}
.citrus.header-nav .menu li:last-child,
.citrus .header-nav .menu li:last-child {
  margin: 0px 0px 0px 4px;
  margin: 0rem 0rem 0rem 0.286rem;
}
.citrus.header-nav .menu li:last-child a,
.citrus .header-nav .menu li:last-child a {
  padding: 12px 6px 6px 6px;
  padding: 0.857rem 0.429rem 0.429rem 0.429rem;
}
.citrus.header-nav .menu li.right-item,
.citrus .header-nav .menu li.right-item {
  float: right;
}
.citrus.header-nav .sub-menu,
.citrus .header-nav .sub-menu {
  box-sizing: border-box;
  list-style: none;
  padding: 0px 20px;
  padding: 0rem 1.429rem;
  margin: 12px 0px 8px 0px;
  margin: 0.857rem 0rem 0.571rem 0rem;
}
.citrus.header-nav .sub-menu li,
.citrus .header-nav .sub-menu li {
  border-right: 1px solid #cccccc;
  display: inline-block;
}
.citrus.header-nav .sub-menu li.company-logo,
.citrus .header-nav .sub-menu li.company-logo {
  padding: 0px 20px 0px 0px;
  padding: 0rem 1.429rem 0rem 0rem;
}
.citrus.header-nav .sub-menu li.company-logo img,
.citrus .header-nav .sub-menu li.company-logo img {
  border: none;
  height: 41px;
  height: 2.929rem;
}
.citrus.header-nav .sub-menu li a,
.citrus .header-nav .sub-menu li a {
  color: #666666;
  display: block;
  padding: 2px 20px;
  padding: 0.143rem 1.429rem;
  text-decoration: none;
}
.citrus.header-nav .sub-menu li a:hover,
.citrus .header-nav .sub-menu li a:hover,
.citrus.header-nav .sub-menu li a:active,
.citrus .header-nav .sub-menu li a:active {
  color: #0052a1;
}
.citrus.header-nav .sub-menu li a:hover i,
.citrus .header-nav .sub-menu li a:hover i,
.citrus.header-nav .sub-menu li a:active i,
.citrus .header-nav .sub-menu li a:active i {
  color: #0052a1;
}
.citrus.header-nav .sub-menu li a i,
.citrus .header-nav .sub-menu li a i {
  color: #666666;
  display: block;
  font-size: 24px;
  font-size: 1.714rem;
  text-align: center;
  padding: 0px 0px 5px 0px;
  padding: 0rem 0rem 0.357rem 0rem;
}
.citrus.header-nav .sub-menu li.active a,
.citrus .header-nav .sub-menu li.active a {
  color: #0052a1;
}
.citrus.header-nav .sub-menu li.active a i,
.citrus .header-nav .sub-menu li.active a i {
  color: #0052a1;
  font-family: 'PaylocityIcons-Bold';
  font-weight: 600;
}
.citrus.header-nav .sub-menu li:first-child a,
.citrus .header-nav .sub-menu li:first-child a {
  padding: 2px 20px 2px 0px;
  padding: 0.143rem 1.429rem 0.143rem 0rem;
}
.citrus.header-nav .sub-menu li:last-child,
.citrus .header-nav .sub-menu li:last-child {
  border-right: 0px solid #cccccc;
}
.citrus.header-nav .sub-menu li:last-child a,
.citrus .header-nav .sub-menu li:last-child a {
  padding: 2px 0px 2px 20px;
  padding: 0.143rem 0rem 0.143rem 1.429rem;
}
.citrus.header-top,
.citrus .header-top {
  color: #393939;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAsCAMAAACT+SJTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MEMzMDVFMDMwMjRBMTFFNUE5RDY4NUJBODg5MUUxMDciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MEMzMDVFMDQwMjRBMTFFNUE5RDY4NUJBODg5MUUxMDciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowQzMwNUUwMTAyNEExMUU1QTlENjg1QkE4ODkxRTEwNyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowQzMwNUUwMjAyNEExMUU1QTlENjg1QkE4ODkxRTEwNyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlbyUHUAAABCUExURe/v7/f39/39/fr6+vLy8urq6u3t7fX19fT09Pj4+PDw8Pv7+/z8/Ovr6+zs7PPz8/b29vn5+f////Hx8f7+/u7u7gXR1+cAAAA1SURBVHjaJMELAkAgAETBjYjyC93/qj1rRrdeDb6xcPSqlcEvJS48Gf1R5q9p5sGd07cLMAA/tAFvKNUmxgAAAABJRU5ErkJggg==);
  background-repeat: repeat-x;
  background: linear-gradient(to bottom, #fff 0%, #eaeaea 100%);
  position: relative;
  height: 44px;
  height: 3.143rem;
  width: 100%;
  z-index: 820;
}
.citrus.header-top:after,
.citrus .header-top:after {
  clear: both;
  content: "";
  display: table;
}
.citrus.header-top .paylocity-logo,
.citrus .header-top .paylocity-logo {
  height: 44px;
  height: 3.143rem;
  position: absolute;
  text-align: center;
  width: 100%;
}
.citrus.header-top .paylocity-logo a,
.citrus .header-top .paylocity-logo a {
  display: block;
  background-image: url("Images/paylocity-logo.svg");
  background-repeat: no-repeat;
  background-position: center 6px;
  background-position: center 0.428rem;
  background-size: 78px 33px;
  background-size: 5.571rem 2.357rem;
  height: 44px;
  height: 3.143rem;
  width: 90px;
  width: 6.429rem;
  margin: 0 auto;
}
.citrus.header-top .paylocity-logo a:hover,
.citrus .header-top .paylocity-logo a:hover,
.citrus.header-top .paylocity-logo a:active,
.citrus .header-top .paylocity-logo a:active {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=80)";
  opacity: 0.8;
}
.citrus.header-top .company-id,
.citrus .header-top .company-id {
  color: #666666;
  display: block;
  font-size: 14px;
  font-size: 1rem;
  text-decoration: none;
  position: absolute;
  text-align: left;
  padding: 16px 20px 0px 20px;
  padding: 1.143rem 1.429rem 0rem 1.429rem;
  width: auto;
  height: 28px;
  height: 2rem;
  left: 0px;
  z-index: 1;
}
.citrus.header-top .company-id i,
.citrus .header-top .company-id i {
  font-size: 12px;
  font-size: 0.857rem;
  padding-left: 5px;
  padding-left: 0.357rem;
}
.citrus.header-top a.company-id:hover,
.citrus .header-top a.company-id:hover,
.citrus.header-top a.company-id:active,
.citrus .header-top a.company-id:active {
  background-color: #cccccc;
}
.citrus.header-top .user-portrait,
.citrus .header-top .user-portrait {
  color: #666666;
  font-size: 20px;
  font-size: 1.429rem;
  font-weight: 300;
  display: inline-block;
  text-decoration: none;
  position: absolute;
  text-align: center;
  width: 44px;
  width: 3.143rem;
  height: 44px;
  height: 3.143rem;
  padding: 0px;
  right: 0px;
}
.citrus.header-top .user-portrait:hover,
.citrus .header-top .user-portrait:hover,
.citrus.header-top .user-portrait:active,
.citrus .header-top .user-portrait:active {
  background-color: #cccccc;
}
.citrus.header-top .user-portrait:hover img,
.citrus .header-top .user-portrait:hover img,
.citrus.header-top .user-portrait:active img,
.citrus .header-top .user-portrait:active img {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=75)";
  opacity: 0.75;
}
.citrus.header-top .user-portrait i,
.citrus .header-top .user-portrait i {
  display: table-cell;
  width: 44px;
  width: 3.143rem;
  height: 44px;
  height: 3.143rem;
  vertical-align: middle;
}
.citrus.header-top .user-portrait span,
.citrus .header-top .user-portrait span {
  display: table-cell;
  width: 44px;
  width: 3.143rem;
  height: 44px;
  height: 3.143rem;
  vertical-align: middle;
}
.citrus.header-top .user-portrait img,
.citrus .header-top .user-portrait img {
  width: 100%;
}
.citrus.header-top .notifications,
.citrus .header-top .notifications {
  color: #666666;
  display: inline-block;
  font-size: 22px;
  font-size: 1.571rem;
  font-weight: lighter;
  position: absolute;
  text-align: center;
  text-decoration: none;
  padding-top: 12px;
  padding-top: 0.857rem;
  right: 44px;
  right: 3.143rem;
  width: 44px;
  width: 3.143rem;
  height: 32px;
  height: 2.286rem;
}
.citrus.header-top .notifications:hover,
.citrus .header-top .notifications:hover,
.citrus.header-top .notifications:active,
.citrus .header-top .notifications:active {
  background-color: #cccccc;
}
.citrus.header-top .notifications.alert,
.citrus .header-top .notifications.alert {
  color: #fff;
  background-color: #c8102e;
  font-size: 22px;
  font-size: 1.571rem;
}
.citrus.header-top .notifications.alert:hover,
.citrus .header-top .notifications.alert:hover {
  background-color: #85071e;
}
.citrus.header-top .searchfield,
.citrus .header-top .searchfield {
  color: #666666;
  display: block;
  font-size: 24px;
  font-size: 1.714rem;
  text-decoration: none;
  position: absolute;
  text-align: center;
  padding-top: 5px;
  padding-top: 0.357rem;
  width: 20px;
  width: 1.429rem;
  right: 300px;
  right: 21.429rem;
}
.citrus.header-top .searchfield input,
.citrus .header-top .searchfield input {
  border: 1px solid #cccccc;
  border-radius: 2px;
  font-size: 14px;
  font-size: 1rem;
  padding: 5px;
  padding: 0.357rem;
  transition: all 0.3s ease-in-out;
  width: 210px;
  width: 15rem;
}
.citrus.header-top .searchfield input:focus,
.citrus .header-top .searchfield input:focus {
  box-shadow: 0 0 5px #1588af;
  border: 1px solid #1588af;
}
.citrus .gallery-image {
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  border: 1px solid #cccccc;
  background: #eaeaea;
  padding-bottom: 100%;
}
.citrus .gallery-image .image-actions {
  display: none;
  position: absolute;
  width: 100%;
  height: 40px;
  height: 2.857rem;
  font-size: 16px;
  font-size: 1.143rem;
  border-bottom: 1px solid #cccccc;
  background: #fff;
  z-index: 1;
}
.citrus .gallery-image .image-actions .select-image {
  margin: 12px 0 0 15px;
  margin: 0.857rem 0 0 1.071rem;
}
.citrus .gallery-image .image {
  position: absolute;
  max-width: 100%;
  max-height: 100%;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
}
.citrus .gallery-image .image-desc {
  position: absolute;
  width: 100%;
  bottom: 0;
  padding: 8px;
  padding: 0.571rem;
  box-sizing: border-box;
  background: #222222;
  background: rgba(34, 34, 34, 0.7);
  color: #fff;
  z-index: 1;
}
.citrus .gallery-image .desc-text {
  display: block;
  line-height: 1.6;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.citrus .gallery-image.selected {
  border-color: #1588af;
  outline: 1px solid #1588af;
}
.citrus .gallery-image.selected .image-desc {
  background: #1588af;
}
.citrus .gallery-image:hover .image-actions,
.citrus .gallery-image.selected .image-actions {
  display: block;
}
.citrus.list,
.citrus .list {
  list-style: none;
  margin: 0px;
  padding: 0px;
}
.citrus.list.size-small,
.citrus .list.size-small {
  max-height: 350px;
  max-height: 25rem;
  overflow-y: scroll;
}
.citrus.list.size-medium,
.citrus .list.size-medium {
  max-height: 450px;
  max-height: 32.143rem;
  overflow-y: scroll;
}
.citrus.list.popover-list > li,
.citrus .list.popover-list > li {
  margin: 0px;
  padding: 0px;
  width: 290px;
  width: 20.714rem;
}
.citrus.list.popover-list > li > a,
.citrus .list.popover-list > li > a {
  border-bottom: 0px;
  font-size: 14px;
  font-size: 1rem;
  margin: 0px;
  padding: 14px 15px;
  padding: 1rem 1.071rem;
  position: relative;
  width: 260px;
  width: 18.571rem;
}
.citrus.list.popover-list > li > a:hover,
.citrus .list.popover-list > li > a:hover,
.citrus.list.popover-list > li > a:active,
.citrus .list.popover-list > li > a:active {
  border-bottom: 0px;
}
.citrus.list.popover-list > li > a:first-child,
.citrus .list.popover-list > li > a:first-child,
.citrus.list.popover-list > li > a:last-child,
.citrus .list.popover-list > li > a:last-child {
  padding: 14px 15px;
  padding: 1rem 1.071rem;
}
.citrus.list.popover-list > li > a.link-icon,
.citrus .list.popover-list > li > a.link-icon {
  padding: 14px 15px 14px 38px;
  padding: 1rem 1.071rem 1rem 2.714rem;
  width: 225px;
  width: 16.071rem;
}
.citrus.list.popover-list > li > a.link-icon > i,
.citrus .list.popover-list > li > a.link-icon > i {
  font-size: 16px;
  font-size: 1.143rem;
  top: 13px;
  left: 15px;
  position: absolute;
}
.citrus.list.popover-list > li > a.link-notification,
.citrus .list.popover-list > li > a.link-notification {
  padding: 14px 15px 14px 38px;
  padding: 1rem 1.071rem 1rem 2.714rem;
  width: 225px;
  width: 16.071rem;
}
.citrus.list.popover-list > li > a.link-notification > i,
.citrus .list.popover-list > li > a.link-notification > i {
  font-size: 16px;
  font-size: 1.143rem;
  color: #c8102e;
  top: 13px;
  left: 15px;
  position: absolute;
}
.citrus.list.popover-list > li > a.link-notification > .date-label,
.citrus .list.popover-list > li > a.link-notification > .date-label {
  display: block;
  font-weight: 600;
}
.citrus.list.popover-list > li > p,
.citrus .list.popover-list > li > p {
  border-bottom: 1px;
  font-weight: 600;
  margin: 0px;
  padding: 16px 15px 12px 15px;
  padding: 1.143rem 1.071rem 0.857rem 1.071rem;
  width: 260px;
  width: 18.571rem;
}
.citrus.list.popover-list > li:first-child,
.citrus .list.popover-list > li:first-child,
.citrus.list.popover-list > li:last-child,
.citrus .list.popover-list > li:last-child {
  margin: 0px;
  padding: 0px;
}
.citrus.list.popover-list > li.user div:first-child,
.citrus .list.popover-list > li.user div:first-child {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus.list.popover-list > li.user div:last-child,
.citrus .list.popover-list > li.user div:last-child {
  width: 67%;
}
.citrus.list.popover-list > li.user-small > a > span,
.citrus .list.popover-list > li.user-small > a > span {
  color: #222222;
  display: inline-block;
  vertical-align: top;
  padding: 0px 0px;
  padding: 0rem 0rem;
}
.citrus.list.popover-list > li.user-small > a > span p,
.citrus .list.popover-list > li.user-small > a > span p {
  margin: 0px;
}
.citrus.list.popover-list > li.user-small > a > span p span,
.citrus .list.popover-list > li.user-small > a > span p span {
  color: #a6a6a6;
}
.citrus.list.popover-list > li.user-small > a > span:first-child,
.citrus .list.popover-list > li.user-small > a > span:first-child {
  margin-right: 1.5%;
  width: 44px;
  width: 3.143rem;
}
.citrus.list.popover-list > li.user-small > a > span:last-child,
.citrus .list.popover-list > li.user-small > a > span:last-child {
  padding: 2px 0px 0px 0px;
  padding: 0.143rem 0rem 0rem 0rem;
  width: 71%;
}
.citrus.list.popover-list > ul,
.citrus .list.popover-list > ul {
  border-top: 1px solid #cccccc;
  line-style: none;
  margin: 0px;
  padding: 0px;
}
.citrus.list.popover-list > ul > li,
.citrus .list.popover-list > ul > li {
  margin: 0px;
  padding: 0px;
  width: 290px;
  width: 20.714rem;
}
.citrus.list.popover-list > ul > li > a,
.citrus .list.popover-list > ul > li > a {
  border-bottom: 0px;
  margin: 0px;
  padding: 14px 15px 14px 25px;
  padding: 1rem 1.071rem 1rem 1.786rem;
  width: 250px;
  width: 17.857rem;
}
.citrus.list.popover-list > ul > li > a:hover,
.citrus .list.popover-list > ul > li > a:hover,
.citrus.list.popover-list > ul > li > a:active,
.citrus .list.popover-list > ul > li > a:active {
  border-bottom: 0px;
}
.citrus.list.popover-list > ul > li > a:first-child,
.citrus .list.popover-list > ul > li > a:first-child,
.citrus.list.popover-list > ul > li > a:last-child,
.citrus .list.popover-list > ul > li > a:last-child {
  padding: 14px 15px 14px 25px;
  padding: 1rem 1.071rem 1rem 1.786rem;
}
.citrus.list.popover-list > ul > li:first-child,
.citrus .list.popover-list > ul > li:first-child,
.citrus.list.popover-list > ul > li:last-child,
.citrus .list.popover-list > ul > li:last-child {
  margin: 0px;
  padding: 0px;
}
.citrus.list.popover-list.size-medium,
.citrus .list.popover-list.size-medium {
  max-height: 450px;
  max-height: 32.143rem;
  overflow-y: auto;
  overflow-x: hidden;
}
.citrus.list.drawer-list,
.citrus .list.drawer-list {
  color: #222222;
  margin: 0px 0px 30px 0px;
  margin: 0rem 0rem 2.143rem 0rem;
  padding-bottom: 81px;
  padding-bottom: 5.786rem;
  overflow-x: hidden;
}
.citrus.list.drawer-list > li,
.citrus .list.drawer-list > li {
  width: 300px;
  width: 21.429rem;
}
.citrus.list.drawer-list > li > a,
.citrus .list.drawer-list > li > a {
  min-width: 270px;
  min-width: 19.286rem;
}
.citrus.list.drawer-list > li > a.link-icon,
.citrus .list.drawer-list > li > a.link-icon {
  width: 246px;
  width: 17.571rem;
  min-width: 246px;
  min-width: 17.571rem;
}
.citrus.list.drawer-list > li > a.link-notification,
.citrus .list.drawer-list > li > a.link-notification {
  width: 246px;
  width: 17.571rem;
  min-width: 246px;
  min-width: 17.571rem;
}
.citrus.list.drawer-list + .button,
.citrus .list.drawer-list + .button {
  margin: 0px 5%;
  margin: 0rem 5%;
  width: 89.6%;
}
.citrus.list.tabs-list,
.citrus .list.tabs-list {
  background-color: #f5f5f5;
  border-top: 1px solid #cccccc;
  bottom: -3px;
  bottom: -0.214rem;
  margin: 0px;
  margin: 0rem;
  position: fixed;
  width: 305px;
  width: 21.786rem;
  z-index: 2;
}
.citrus.list.tabs-list:before,
.citrus .list.tabs-list:before,
.citrus.list.tabs-list:after,
.citrus .list.tabs-list:after {
  content: " ";
  display: table;
}
.citrus.list.tabs-list:after,
.citrus .list.tabs-list:after {
  clear: both;
}
.citrus.list.tabs-list > li,
.citrus .list.tabs-list > li {
  border: 0px solid #cccccc;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  margin: 0px;
  padding: 0px;
  width: 32%;
}
.citrus.list.tabs-list > li > a,
.citrus .list.tabs-list > li > a {
  box-sizing: border-box;
  color: #393939;
  font-size: 12px;
  font-size: 0.857rem;
  text-align: center;
  width: 100%;
}
.citrus.list.tabs-list > li > a:hover,
.citrus .list.tabs-list > li > a:hover {
  background-color: #fff;
  color: #222222;
}
.citrus.list.tabs-list > li > a i,
.citrus .list.tabs-list > li > a i {
  display: block;
  padding: 0px 0px 4px 0px;
  padding: 0rem 0rem 0.286rem 0rem;
}
.citrus.list.tabs-list > li > a > .notification,
.citrus .list.tabs-list > li > a > .notification {
  display: block;
  font-size: 24px;
  font-size: 1.714rem;
  padding: 0px 0px 4px 0px;
  padding: 0rem 0rem 0.286rem 0rem;
}
.citrus.list.tabs-list > li > a.active,
.citrus .list.tabs-list > li > a.active {
  color: #1588af;
}
.citrus.list.tabs-list > li > a.active:hover,
.citrus .list.tabs-list > li > a.active:hover {
  background-color: #f5f5f5;
}
.citrus.list.tabs-list > li > a.active > i,
.citrus .list.tabs-list > li > a.active > i {
  font-family: 'PaylocityIcons-Bold';
  font-weight: 600;
}
.citrus.list.tabs-list > li > a.active > .notification,
.citrus .list.tabs-list > li > a.active > .notification {
  color: #1588af;
  font-weight: 600;
}
.citrus.list.list-horizontal > li,
.citrus .list.list-horizontal > li {
  padding: 3px 0px;
  padding: 0.214rem 0rem;
}
.citrus.list.list-horizontal > li > a,
.citrus .list.list-horizontal > li > a {
  text-align: left;
  padding: 0px;
  padding: 0rem;
  border: 0px;
}
@media screen and (min-width: 700px) {
  .citrus.list.list-horizontal > li,
  .citrus .list.list-horizontal > li {
    margin: 0px 15px;
    margin: 0rem 1.071rem;
    padding: 0px;
    padding: 0rem;
    border: 0px;
    display: inline-block;
  }
  .citrus.list.list-horizontal > li:first-child,
  .citrus .list.list-horizontal > li:first-child {
    margin-left: 0px;
  }
  .citrus.list.list-horizontal > li > i,
  .citrus .list.list-horizontal > li > i {
    float: left;
    margin: -1px 5px 0px 0px;
    margin: -0.071rem 0.357rem 0rem 0rem;
  }
}
.citrus.list li,
.citrus .list li {
  border-top: 1px solid #cccccc;
}
.citrus.list li:first-child,
.citrus .list li:first-child {
  border-top: 0px solid #cccccc;
}
.citrus.list li > a,
.citrus .list li > a {
  color: #222222;
  display: block;
  padding: 14px 0px;
  padding: 1rem 0rem;
  text-decoration: none;
}
.citrus.list li > a.inline,
.citrus .list li > a.inline {
  display: inline-block;
  padding: 0;
}
.citrus.list li > a:hover,
.citrus .list li > a:hover,
.citrus.list li > a:active,
.citrus .list li > a:active {
  background-color: #eaeaea;
}
.citrus.list li.user div,
.citrus .list li.user div {
  color: #222222;
  display: inline-block;
  vertical-align: top;
  padding: 14px 0px;
  padding: 1rem 0rem;
}
.citrus.list li.user div p,
.citrus .list li.user div p {
  margin: 0px;
}
.citrus.list li.user div p span,
.citrus .list li.user div p span {
  color: #a6a6a6;
}
.citrus.list li.user div:first-child,
.citrus .list li.user div:first-child {
  margin-right: 1.5%;
  width: 72px;
  width: 5.143rem;
}
.citrus.list li.user div:last-child,
.citrus .list li.user div:last-child {
  padding: 16px 0px 12px 0px;
  padding: 1.143rem 0rem 0.857rem 0rem;
  width: 71%;
}
.citrus.lists,
.citrus .lists {
  border-bottom: 1px solid #cccccc;
  box-sizing: border-box;
  display: table;
  margin: 0;
  padding: 0;
  width: 100%;
}
.citrus.lists.fixed-layout,
.citrus .lists.fixed-layout {
  table-layout: fixed;
}
.citrus.lists.nohover tr:not(.details):not(.active):hover,
.citrus .lists.nohover tr:not(.details):not(.active):hover,
.citrus.lists.nohover li:hover,
.citrus .lists.nohover li:hover {
  background-color: transparent;
  cursor: inherit;
}
.citrus.lists .h2,
.citrus .lists .h2,
.citrus.lists h2,
.citrus .lists h2 {
  line-height: 32px;
}
.citrus.lists .h3,
.citrus .lists .h3,
.citrus.lists h3,
.citrus .lists h3 {
  line-height: 24px;
}
.citrus.lists .h4,
.citrus .lists .h4,
.citrus.lists h4,
.citrus .lists h4 {
  line-height: 18px;
}
.citrus.lists p,
.citrus .lists p {
  line-height: 18px;
}
.citrus.lists tr,
.citrus .lists tr,
.citrus.lists li,
.citrus .lists li {
  background: #fff;
  color: #222222;
  display: table-row;
}
.citrus.lists tr:hover,
.citrus .lists tr:hover,
.citrus.lists li:hover,
.citrus .lists li:hover {
  background-color: #eaeaea;
  cursor: pointer;
}
.citrus.lists tr.active,
.citrus .lists tr.active,
.citrus.lists li.active,
.citrus .lists li.active {
  background-color: #1588af;
  color: #fff;
}
.citrus.lists tr.active a,
.citrus .lists tr.active a,
.citrus.lists li.active a,
.citrus .lists li.active a {
  color: #fff;
}
.citrus.lists tr.active a.button,
.citrus .lists tr.active a.button,
.citrus.lists li.active a.button,
.citrus .lists li.active a.button {
  color: #fff;
}
.citrus.lists tr.active:hover,
.citrus .lists tr.active:hover,
.citrus.lists li.active:hover,
.citrus .lists li.active:hover {
  background-color: #1588af;
}
.citrus.lists tr.active td.toggle,
.citrus .lists tr.active td.toggle,
.citrus.lists li.active td.toggle,
.citrus .lists li.active td.toggle,
.citrus.lists tr.active .column.toggle,
.citrus .lists tr.active .column.toggle,
.citrus.lists li.active .column.toggle,
.citrus .lists li.active .column.toggle {
  color: #fff;
}
.citrus.lists tr.active td.toggle i:before,
.citrus .lists tr.active td.toggle i:before,
.citrus.lists li.active td.toggle i:before,
.citrus .lists li.active td.toggle i:before,
.citrus.lists tr.active .column.toggle i:before,
.citrus .lists tr.active .column.toggle i:before,
.citrus.lists li.active .column.toggle i:before,
.citrus .lists li.active .column.toggle i:before {
  content: '\e621';
}
.citrus.lists tr.active td.checkbox,
.citrus .lists tr.active td.checkbox,
.citrus.lists li.active td.checkbox,
.citrus .lists li.active td.checkbox,
.citrus.lists tr.active .column.checkbox,
.citrus .lists tr.active .column.checkbox,
.citrus.lists li.active .column.checkbox,
.citrus .lists li.active .column.checkbox {
  border-right: none;
}
.citrus.lists tr.active td.checkbox:before,
.citrus .lists tr.active td.checkbox:before,
.citrus.lists li.active td.checkbox:before,
.citrus .lists li.active td.checkbox:before,
.citrus.lists tr.active .column.checkbox:before,
.citrus .lists tr.active .column.checkbox:before,
.citrus.lists li.active .column.checkbox:before,
.citrus .lists li.active .column.checkbox:before {
  background: #fff;
  border: 2px solid #1588af;
  border-right: 1px solid #1588af;
  box-sizing: border-box;
  content: '';
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.citrus.lists tr.active + .details td .wrapper,
.citrus .lists tr.active + .details td .wrapper,
.citrus.lists li.active + .details td .wrapper,
.citrus .lists li.active + .details td .wrapper {
  max-height: 2400px;
  max-height: 171.429rem;
}
.citrus.lists tr.zero-state td,
.citrus .lists tr.zero-state td,
.citrus.lists li.zero-state td,
.citrus .lists li.zero-state td {
  padding: 75px 0 75px 0;
  padding: 5.357rem 0 5.357rem 0;
}
.citrus.lists tr.details,
.citrus .lists tr.details,
.citrus.lists li.details,
.citrus .lists li.details {
  background: #f5f5f5;
}
.citrus.lists tr.details:hover,
.citrus .lists tr.details:hover,
.citrus.lists li.details:hover,
.citrus .lists li.details:hover {
  cursor: inherit;
}
.citrus.lists tr.details > td,
.citrus .lists tr.details > td,
.citrus.lists li.details > td,
.citrus .lists li.details > td {
  border: none;
  margin: 0;
  padding: 0;
}
.citrus.lists tr.details > td .wrapper,
.citrus .lists tr.details > td .wrapper,
.citrus.lists li.details > td .wrapper,
.citrus .lists li.details > td .wrapper {
  max-height: 0;
  padding: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-in-out;
}
.citrus.lists tr th,
.citrus .lists tr th,
.citrus.lists li th,
.citrus .lists li th {
  background: #fff;
  color: #666666;
  font-weight: bold;
  text-align: left;
  margin: 0;
  padding: 8px 15px;
  padding: 0.571rem 1.071rem;
  vertical-align: middle;
}
.citrus.lists tr th.type-centeralign,
.citrus .lists tr th.type-centeralign,
.citrus.lists li th.type-centeralign,
.citrus .lists li th.type-centeralign {
  text-align: center;
}
.citrus.lists tr th.type-rightalign,
.citrus .lists tr th.type-rightalign,
.citrus.lists li th.type-rightalign,
.citrus .lists li th.type-rightalign {
  text-align: right;
}
.citrus.lists tr th.ascending:after,
.citrus .lists tr th.ascending:after,
.citrus.lists li th.ascending:after,
.citrus .lists li th.ascending:after,
.citrus.lists tr th.decending:after,
.citrus .lists tr th.decending:after,
.citrus.lists li th.decending:after,
.citrus .lists li th.decending:after {
  font-family: 'PaylocityIcons-Bold';
  speak: none;
  font-style: normal;
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 12px;
  font-size: 0.857rem;
  margin-left: 8px;
}
.citrus.lists tr th.ascending:after,
.citrus .lists tr th.ascending:after,
.citrus.lists li th.ascending:after,
.citrus .lists li th.ascending:after {
  content: "\e621";
}
.citrus.lists tr th.decending:after,
.citrus .lists tr th.decending:after,
.citrus.lists li th.decending:after,
.citrus .lists li th.decending:after {
  content: "\e63a";
}
.citrus.lists tr td,
.citrus .lists tr td,
.citrus.lists li td,
.citrus .lists li td,
.citrus.lists tr .column,
.citrus .lists tr .column,
.citrus.lists li .column,
.citrus .lists li .column {
  border-top: 1px solid #cccccc;
  display: table-cell;
  padding: 8px 15px;
  padding: 0.571rem 1.071rem;
  vertical-align: middle;
}
.citrus.lists tr td.align-top,
.citrus .lists tr td.align-top,
.citrus.lists li td.align-top,
.citrus .lists li td.align-top,
.citrus.lists tr .column.align-top,
.citrus .lists tr .column.align-top,
.citrus.lists li .column.align-top,
.citrus .lists li .column.align-top {
  vertical-align: top;
}
.citrus.lists tr td.padding-none,
.citrus .lists tr td.padding-none,
.citrus.lists li td.padding-none,
.citrus .lists li td.padding-none,
.citrus.lists tr .column.padding-none,
.citrus .lists tr .column.padding-none,
.citrus.lists li .column.padding-none,
.citrus .lists li .column.padding-none {
  padding: 0;
}
.citrus.lists tr td.toggle,
.citrus .lists tr td.toggle,
.citrus.lists li td.toggle,
.citrus .lists li td.toggle,
.citrus.lists tr .column.toggle,
.citrus .lists tr .column.toggle,
.citrus.lists li .column.toggle,
.citrus .lists li .column.toggle {
  color: #1588af;
  padding-right: 0;
  width: 16px;
  width: 1.143rem;
}
.citrus.lists tr td.toggle i,
.citrus .lists tr td.toggle i,
.citrus.lists li td.toggle i,
.citrus .lists li td.toggle i,
.citrus.lists tr .column.toggle i,
.citrus .lists tr .column.toggle i,
.citrus.lists li .column.toggle i,
.citrus .lists li .column.toggle i {
  font-weight: bold;
  vertical-align: middle;
}
.citrus.lists tr td.checkbox,
.citrus .lists tr td.checkbox,
.citrus.lists li td.checkbox,
.citrus .lists li td.checkbox,
.citrus.lists tr .column.checkbox,
.citrus .lists tr .column.checkbox,
.citrus.lists li .column.checkbox,
.citrus .lists li .column.checkbox {
  border-right: 1px solid #cccccc;
  position: relative;
  text-align: center;
  width: 16px;
  width: 1.143rem;
}
.citrus.lists tr td.checkbox input,
.citrus .lists tr td.checkbox input,
.citrus.lists li td.checkbox input,
.citrus .lists li td.checkbox input,
.citrus.lists tr .column.checkbox input,
.citrus .lists tr .column.checkbox input,
.citrus.lists li .column.checkbox input,
.citrus .lists li .column.checkbox input {
  position: relative;
  z-index: 1;
}
.citrus.lists tr td a,
.citrus .lists tr td a,
.citrus.lists li td a,
.citrus .lists li td a,
.citrus.lists tr .column a,
.citrus .lists tr .column a,
.citrus.lists li .column a,
.citrus .lists li .column a {
  display: inline-block;
}
.citrus.modal,
.citrus .modal {
  display: table;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: fixed;
  top: -9999px;
  bottom: 0;
  z-index: 1000;
}
.citrus.modal .modal-dialog,
.citrus .modal .modal-dialog {
  display: table-cell;
  position: relative;
  width: auto;
  vertical-align: middle;
  z-index: 1150;
}
.citrus.modal .modal-content,
.citrus .modal .modal-content {
  background-color: #fff;
  background-clip: padding-box;
  border-radius: 2px;
  margin-left: auto;
  margin-right: auto;
  min-width: 290px;
  min-width: 20.714rem;
  position: relative;
  outline: none;
  z-index: 1200;
}
.citrus.modal .modal-content.size-small,
.citrus .modal .modal-content.size-small {
  width: 400px;
  width: 28.571rem;
}
@media only screen and (max-width: 699px) {
  .citrus.modal .modal-content.size-small,
  .citrus .modal .modal-content.size-small {
    width: 97%;
    max-width: 500px;
    max-width: 35.714rem;
  }
}
.citrus.modal .modal-content.size-medium,
.citrus .modal .modal-content.size-medium {
  width: 820px;
  width: 58.571rem;
}
@media only screen and (max-width: 840px) {
  .citrus.modal .modal-content.size-medium,
  .citrus .modal .modal-content.size-medium {
    width: 97%;
  }
}
@media screen and (min-width: 700px) and (max-width: 859px) {
  .citrus.modal .modal-content.size-medium,
  .citrus .modal .modal-content.size-medium {
    width: 640px;
    width: 45.714rem;
  }
}
@media screen and (max-width: 699px) {
  .citrus.modal .modal-content.size-medium,
  .citrus .modal .modal-content.size-medium {
    width: 97%;
  }
}
.citrus.modal .modal-content.size-large,
.citrus .modal .modal-content.size-large {
  width: 1240px;
  width: 88.571rem;
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .citrus.modal .modal-content.size-large,
  .citrus .modal .modal-content.size-large {
    width: 970px;
    width: 69.286rem;
  }
}
@media screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.modal .modal-content.size-large,
  .citrus .modal .modal-content.size-large {
    width: 820px;
    width: 58.571rem;
  }
}
@media screen and (min-width: 700px) and (max-width: 859px) {
  .citrus.modal .modal-content.size-large,
  .citrus .modal .modal-content.size-large {
    width: 640px;
    width: 45.714rem;
  }
}
@media screen and (max-width: 699px) {
  .citrus.modal .modal-content.size-large,
  .citrus .modal .modal-content.size-large {
    width: 97%;
  }
}
.citrus.modal .modal-header,
.citrus .modal .modal-header {
  margin: 0px 45px;
  margin: 0rem 3.214rem;
  padding: 15px 0px;
  padding: 1.071rem 0rem;
  position: relative;
}
@media screen and (max-width: 699px) {
  .citrus.modal .modal-header,
  .citrus .modal .modal-header {
    margin: 0px 15px;
    margin: 0rem 1.071rem;
  }
}
.citrus.modal .modal-header .close,
.citrus .modal .modal-header .close {
  position: absolute;
  right: -5px;
  right: -0.357rem;
  top: 15px;
  top: 1.071rem;
}
.citrus.modal .modal-subtitle,
.citrus .modal .modal-subtitle {
  margin: 0 auto;
}
.citrus.modal .modal-subtitle h3,
.citrus .modal .modal-subtitle h3,
.citrus.modal .modal-subtitle select,
.citrus .modal .modal-subtitle select {
  display: inline-block;
  vertical-align: middle;
}
.citrus.modal .modal-subtitle h3,
.citrus .modal .modal-subtitle h3 {
  float: left;
}
@media screen and (max-width: 699px) {
  .citrus.modal .modal-subtitle h3,
  .citrus .modal .modal-subtitle h3 {
    display: block;
    float: none;
  }
}
.citrus.modal .modal-subtitle select,
.citrus .modal .modal-subtitle select {
  float: right;
  width: 150px;
  width: 10.714rem;
}
@media screen and (max-width: 699px) {
  .citrus.modal .modal-subtitle select,
  .citrus .modal .modal-subtitle select {
    float: none;
    margin-top: 10px;
    margin-top: 0.714rem;
    width: 100%;
    max-width: 360px;
    max-width: 25.714rem;
  }
}
.citrus.modal .modal-subtitle:before,
.citrus .modal .modal-subtitle:before,
.citrus.modal .modal-subtitle:after,
.citrus .modal .modal-subtitle:after {
  content: " ";
  display: table;
}
.citrus.modal .modal-subtitle:after,
.citrus .modal .modal-subtitle:after {
  clear: both;
}
.citrus.modal .modal-body,
.citrus .modal .modal-body {
  border-bottom: 1px solid #cccccc;
  border-top: 1px solid #cccccc;
  background: #eaeaea;
  margin: 0;
  padding: 15px 45px;
  padding: 1.071rem 3.214rem;
  position: relative;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
@media screen and (max-width: 699px) {
  .citrus.modal .modal-body,
  .citrus .modal .modal-body {
    padding: 15px;
    padding: 1.071rem;
  }
}
.citrus.modal .modal-footer,
.citrus .modal .modal-footer {
  margin: 0px 45px;
  margin: 0rem 3.214rem;
  padding: 15px 0px;
  padding: 1.071rem 0rem;
  text-align: left;
}
.citrus.modal .modal-footer:before,
.citrus .modal .modal-footer:before,
.citrus.modal .modal-footer:after,
.citrus .modal .modal-footer:after {
  content: " ";
  display: table;
}
.citrus.modal .modal-footer:after,
.citrus .modal .modal-footer:after {
  clear: both;
}
.citrus.modal .modal-footer.right-align,
.citrus .modal .modal-footer.right-align {
  text-align: right;
}
@media screen and (max-width: 699px) {
  .citrus.modal .modal-footer,
  .citrus .modal .modal-footer {
    margin: 0px 15px;
    margin: 0rem 1.071rem;
  }
}
.citrus.modal-open,
.citrus .modal-open {
  -webkit-overflow-scrolling: touch;
  overflow: hidden;
}
.citrus.modal-open.modal,
.citrus .modal-open.modal,
.citrus.modal-open .modal,
.citrus .modal-open .modal {
  top: 0;
}
.citrus .overview-control-toggle {
  direction: rtl;
  font-weight: 600;
  line-height: 20px;
  padding: 9px 0;
  padding: 0.643rem 0;
  text-align: left;
}
.citrus .overview-control-toggle:after {
  display: block;
  position: absolute;
  right: 15px;
  right: 1.071rem;
  top: 50%;
  margin-top: -9px;
  margin-top: -0.643rem;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 16px;
  font-size: 1.143rem;
  font-style: normal;
  font-weight: 700;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e63a";
}
.citrus .overview-control-toggle.expanded:after {
  content: "\e621";
}
.citrus .overview-control-toggle:hover,
.citrus .overview-control-toggle:focus {
  color: #1588af;
}
.citrus .overview-control-toggle h4 {
  color: #222222;
  display: inline-block;
  margin-left: 10px;
  vertical-align: middle;
}
.citrus .overview-control-toggle .type-callout,
.citrus .overview-control-toggle i {
  display: inline-block;
  font-size: 30px;
  font-size: 2.143rem;
  font-weight: bold;
  line-height: 1.1;
  vertical-align: middle;
}
.citrus .overview-control-toggle .type-callout.primary,
.citrus .overview-control-toggle i.primary {
  color: #ff6611;
}
.citrus .overview-control {
  box-sizing: border-box;
  display: table;
  font-size: 0;
  padding: 15px;
  padding: 1.071rem;
  table-layout: fixed;
  text-align: center;
  width: 100%;
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control.tabbed {
    border-bottom: 1px solid #dadada;
    display: block;
    padding: 0;
    text-align: left;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control.tabbed .overview-item,
  .citrus .overview-control.tabbed > li {
    border: none;
    direction: rtl;
    display: block;
    padding: 0;
    width: auto;
  }
  .citrus .overview-control.tabbed .overview-item.active,
  .citrus .overview-control.tabbed > li.active {
    background: #1588af;
    display: none;
  }
  .citrus .overview-control.tabbed .overview-item.active h4,
  .citrus .overview-control.tabbed > li.active h4 {
    color: #fff;
  }
  .citrus .overview-control.tabbed .overview-item.active .type-callout,
  .citrus .overview-control.tabbed > li.active .type-callout,
  .citrus .overview-control.tabbed .overview-item.active i,
  .citrus .overview-control.tabbed > li.active i {
    color: #fff;
  }
  .citrus .overview-control.tabbed .overview-item.active a:hover,
  .citrus .overview-control.tabbed > li.active a:hover,
  .citrus .overview-control.tabbed .overview-item.active a:focus,
  .citrus .overview-control.tabbed > li.active a:focus {
    color: #fff;
    background-color: #1588af;
  }
  .citrus .overview-control.tabbed .overview-item a,
  .citrus .overview-control.tabbed > li a {
    margin: 0;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control.tabbed .overview-item a,
  .citrus .overview-control.tabbed > li a {
    box-sizing: border-box;
    display: block;
    padding: 9px 15px;
    padding: 0.643rem 1.071rem;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control.tabbed .overview-item a h4,
  .citrus .overview-control.tabbed > li a h4 {
    display: inline-block;
    margin-left: 10px;
    vertical-align: middle;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control.tabbed .overview-item a .type-callout,
  .citrus .overview-control.tabbed > li a .type-callout,
  .citrus .overview-control.tabbed .overview-item a i,
  .citrus .overview-control.tabbed > li a i {
    display: inline-block;
    font-size: 30px;
    font-size: 2.143rem;
    line-height: 1.1;
    vertical-align: middle;
  }
}
.citrus .overview-control .overview-item,
.citrus .overview-control li {
  border-left: 1px solid #dadada;
  box-sizing: border-box;
  display: table-cell;
  overflow: hidden;
  padding: 9px 15px;
  padding: 0.643rem 1.071rem;
  vertical-align: bottom;
}
.citrus .overview-control .overview-item.active,
.citrus .overview-control li.active {
  background: #eaeaea;
}
.citrus .overview-control .overview-item.active .type-callout,
.citrus .overview-control li.active .type-callout,
.citrus .overview-control .overview-item.active i,
.citrus .overview-control li.active i {
  font-weight: bold;
}
.citrus .overview-control .overview-item:first-child,
.citrus .overview-control li:first-child {
  border-left: none;
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control .overview-item,
  .citrus .overview-control li {
    border: none;
    display: inline-block;
    width: 33.3%;
  }
}
.citrus .overview-control .overview-item a,
.citrus .overview-control li a {
  text-decoration: none;
  display: block;
  margin: -9px -15px;
  margin: -0.643rem -1.071rem;
  padding: 9px 15px;
  padding: 0.643rem 1.071rem;
  position: relative;
  width: 100%;
}
.citrus .overview-control .overview-item a:before,
.citrus .overview-control li a:before {
  bottom: 100%;
  content: '';
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  width: 100%;
}
.citrus .overview-control .overview-item a.disabled,
.citrus .overview-control li a.disabled {
  cursor: not-allowed;
  color: #cccccc;
}
.citrus .overview-control .overview-item a.disabled h4,
.citrus .overview-control li a.disabled h4 {
  color: #cccccc;
}
.citrus .overview-control .overview-item a.disabled:hover,
.citrus .overview-control li a.disabled:hover,
.citrus .overview-control .overview-item a.disabled:focus,
.citrus .overview-control li a.disabled:focus,
.citrus .overview-control .overview-item a.disabled:active,
.citrus .overview-control li a.disabled:active {
  color: #cccccc;
  background-color: transparent;
}
.citrus .overview-control .overview-item a:hover,
.citrus .overview-control li a:hover,
.citrus .overview-control .overview-item a:focus,
.citrus .overview-control li a:focus {
  background-color: #eaeaea;
}
.citrus .overview-control .overview-item a:hover:before,
.citrus .overview-control li a:hover:before,
.citrus .overview-control .overview-item a:focus:before,
.citrus .overview-control li a:focus:before {
  background: #eaeaea;
}
.citrus .overview-control .overview-item a:hover .primary,
.citrus .overview-control li a:hover .primary,
.citrus .overview-control .overview-item a:focus .primary,
.citrus .overview-control li a:focus .primary {
  color: #cc3d0c;
}
.citrus .overview-control .overview-item h4,
.citrus .overview-control li h4 {
  color: #222222;
  line-height: 16px;
  margin: 0;
}
.citrus .overview-control .overview-item .type-footnote,
.citrus .overview-control li .type-footnote {
  color: #666666;
  display: block;
}
@media only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus .overview-control .overview-item .type-callout,
  .citrus .overview-control li .type-callout {
    font-size: 36px;
    font-size: 2.571rem;
    line-height: 1.1;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control .overview-item .type-callout,
  .citrus .overview-control li .type-callout {
    font-size: 26px;
    font-size: 1.857rem;
    font-weight: normal;
  }
}
.citrus .overview-control .overview-item .type-callout.primary,
.citrus .overview-control li .type-callout.primary {
  color: #ff6611;
}
.citrus .overview-control .overview-item .type-callout.success,
.citrus .overview-control li .type-callout.success {
  color: #3dc270;
}
.citrus .overview-control .overview-item .type-callout.error,
.citrus .overview-control li .type-callout.error {
  color: #c8102e;
}
.citrus .overview-control .overview-item .type-callout.warning,
.citrus .overview-control li .type-callout.warning {
  color: #ff8800;
}
.citrus .overview-control .overview-item .type-callout.information,
.citrus .overview-control li .type-callout.information {
  color: #41a8d2;
}
.citrus .overview-control .overview-item .type-callout.pending,
.citrus .overview-control li .type-callout.pending {
  color: #ffc400;
}
@media only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus .overview-control .overview-item i,
  .citrus .overview-control li i {
    font-size: 34px;
    font-size: 2.429rem;
  }
}
@media only screen and (max-width: 699px) {
  .citrus .overview-control .overview-item i,
  .citrus .overview-control li i {
    font-size: 24px;
    font-size: 1.714rem;
  }
}
.citrus .overview-control .overview-item .type-helptrigger,
.citrus .overview-control li .type-helptrigger {
  border: none;
}
.citrus.popover,
.citrus .popover {
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  max-width: 276px;
  max-width: 19.714rem;
  padding: 1px;
  padding: 0.071rem;
  text-align: left;
  z-index: 850;
  white-space: normal;
}
.citrus.popover.top,
.citrus .popover.top {
  margin-top: -10px;
  margin-top: -0.714rem;
}
.citrus.popover.right,
.citrus .popover.right {
  margin-left: 10px;
  margin-left: 0.714rem;
}
.citrus.popover.bottom,
.citrus .popover.bottom {
  margin-top: 10px;
  margin-top: 0.714rem;
}
.citrus.popover.left,
.citrus .popover.left {
  margin-left: -10px;
  margin-left: -0.714rem;
}
.citrus.popover > .arrow,
.citrus .popover > .arrow,
.citrus.popover > .arrow:after,
.citrus .popover > .arrow:after {
  border-color: transparent;
  border-style: solid;
  display: block;
  height: 0;
  position: absolute;
  width: 0;
}
.citrus.popover > .arrow,
.citrus .popover > .arrow {
  border-width: 11px;
}
.citrus.popover > .arrow:after,
.citrus .popover > .arrow:after {
  border-width: 10px;
  content: "";
}
.citrus .popover-views {
  display: none;
}
.citrus .popover-content .content {
  overflow: hidden;
}
.citrus.popover.top > .arrow,
.citrus .popover.top > .arrow {
  border-bottom-width: 0;
  border-top-color: #cccccc;
  bottom: -11px;
  bottom: -0.786rem;
  left: 50%;
  margin-left: -11px;
  margin-left: -0.786rem;
}
.citrus.popover.top > .arrow:after,
.citrus .popover.top > .arrow:after {
  border-bottom-width: 0;
  border-top-color: #fff;
  bottom: 1px;
  bottom: 0.071rem;
  content: " ";
  margin-left: -10px;
  margin-left: -0.714rem;
}
.citrus.popover.right > .arrow,
.citrus .popover.right > .arrow {
  border-left-width: 0;
  border-right-color: #cccccc;
  left: -11px;
  left: -0.786rem;
  margin-top: -11px;
  margin-top: -0.786rem;
  top: 50%;
}
.citrus.popover.right > .arrow:after,
.citrus .popover.right > .arrow:after {
  bottom: -10px;
  bottom: -0.714rem;
  border-left-width: 0;
  border-right-color: #fff;
  content: " ";
  left: 1px;
  left: 0.071rem;
}
.citrus.popover.bottom > .arrow,
.citrus .popover.bottom > .arrow {
  border-top-width: 0;
  border-bottom-color: #cccccc;
  left: 50%;
  margin-left: -11px;
  margin-left: -0.786rem;
  top: -11px;
  top: -0.786rem;
}
.citrus.popover.bottom > .arrow:after,
.citrus .popover.bottom > .arrow:after {
  border-top-width: 0;
  border-bottom-color: #fff;
  content: " ";
  top: 1px;
  top: 0.071rem;
  margin-left: -10px;
  margin-left: -0.714rem;
}
.citrus.popover.left > .arrow,
.citrus .popover.left > .arrow {
  border-right-width: 0;
  border-left-color: #cccccc;
  top: 50%;
  margin-top: -11px;
  margin-top: -0.786rem;
  right: -11px;
  right: -0.786rem;
}
.citrus.popover.left > .arrow:after,
.citrus .popover.left > .arrow:after {
  border-right-width: 0;
  border-left-color: #fff;
  bottom: -10px;
  bottom: -0.714rem;
  content: " ";
  right: 1px;
  right: 0.071rem;
}
.citrus .portrait,
.citrus .emblem {
  display: inline-block;
  color: #fff;
  background-color: #a6a6a6;
  border: 1px solid;
  border-radius: 50%;
  font-size: 14px;
  font-size: 1rem;
  font-weight: 300;
  height: 36px;
  height: 2.571rem;
  width: 36px;
  width: 2.571rem;
  text-align: center;
  overflow: hidden;
  box-sizing: border-box;
  vertical-align: middle;
}
.citrus .portrait img,
.citrus .emblem img {
  width: 100%;
}
.citrus .portrait span,
.citrus .emblem span {
  line-height: 36px;
}
.citrus .portrait i,
.citrus .emblem i {
  font-size: 16px;
  font-size: 1.143rem;
  line-height: 35px;
}
.citrus .portrait.margin-right,
.citrus .emblem.margin-right {
  margin-right: 8px;
  margin-right: 0.571rem;
}
.citrus .portrait.margin-left,
.citrus .emblem.margin-left {
  margin-left: 8px;
  margin-left: 0.571rem;
}
.citrus .portrait.square,
.citrus .emblem.square {
  border-radius: 0;
}
.citrus .portrait.borderless,
.citrus .emblem.borderless {
  border: none;
}
.citrus .portrait.size-xxsmall,
.citrus .emblem.size-xxsmall {
  height: 12px;
  height: 0.857rem;
  width: 12px;
  width: 0.857rem;
}
.citrus .portrait.size-xxsmall span,
.citrus .emblem.size-xxsmall span {
  display: none;
}
.citrus .portrait.size-xxsmall i,
.citrus .emblem.size-xxsmall i {
  font-size: 10px;
  font-size: 0.714rem;
  line-height: 12px;
}
.citrus .portrait.size-xsmall,
.citrus .emblem.size-xsmall {
  font-size: 14px;
  font-size: 1rem;
  height: 20px;
  height: 1.429rem;
  width: 20px;
  width: 1.429rem;
}
.citrus .portrait.size-xsmall span,
.citrus .emblem.size-xsmall span {
  display: none;
}
.citrus .portrait.size-xsmall i,
.citrus .emblem.size-xsmall i {
  font-size: 12px;
  font-size: 0.857rem;
  line-height: 18px;
}
.citrus .portrait.size-small,
.citrus .emblem.size-small {
  font-size: 12px;
  font-size: 0.857rem;
  height: 28px;
  height: 2rem;
  width: 28px;
  width: 2rem;
}
.citrus .portrait.size-small span,
.citrus .emblem.size-small span {
  line-height: 27px;
}
.citrus .portrait.size-small i,
.citrus .emblem.size-small i {
  font-size: 20px;
  font-size: 1.429rem;
  line-height: 28px;
}
.citrus .portrait.size-medium,
.citrus .emblem.size-medium {
  font-size: 14px;
  font-size: 1rem;
  height: 36px;
  height: 2.571rem;
  width: 36px;
  width: 2.571rem;
}
.citrus .portrait.size-medium span,
.citrus .emblem.size-medium span {
  line-height: 36px;
}
.citrus .portrait.size-large,
.citrus .emblem.size-large {
  font-size: 18px;
  font-size: 1.286rem;
  height: 44px;
  height: 3.143rem;
  width: 44px;
  width: 3.143rem;
}
.citrus .portrait.size-large span,
.citrus .emblem.size-large span {
  line-height: 44px;
}
.citrus .portrait.size-large i,
.citrus .emblem.size-large i {
  font-size: 20px;
  font-size: 1.429rem;
  line-height: 43px;
}
.citrus .portrait.size-xlarge,
.citrus .emblem.size-xlarge {
  font-size: 26px;
  font-size: 1.857rem;
  height: 60px;
  height: 4.286rem;
  width: 60px;
  width: 4.286rem;
}
.citrus .portrait.size-xlarge span,
.citrus .emblem.size-xlarge span {
  line-height: 60px;
}
.citrus .portrait.size-xlarge i,
.citrus .emblem.size-xlarge i {
  font-size: 28px;
  font-size: 2rem;
  line-height: 60px;
}
.citrus .portrait.color-1,
.citrus .emblem.color-1 {
  background: #085a7e;
}
.citrus .portrait.color-2,
.citrus .emblem.color-2 {
  background: #2eab73;
}
.citrus .portrait.color-3,
.citrus .emblem.color-3 {
  background: #459644;
}
.citrus .portrait.color-4,
.citrus .emblem.color-4 {
  background: #c3dd50;
}
.citrus .portrait.color-5,
.citrus .emblem.color-5 {
  background: #ffc400;
}
.citrus .portrait.color-6,
.citrus .emblem.color-6 {
  background: #ff8800;
}
.citrus .portrait.color-7,
.citrus .emblem.color-7 {
  background: #ff9633;
}
.citrus .portrait.color-8,
.citrus .emblem.color-8 {
  background: #e35e6b;
}
.citrus .portrait.color-9,
.citrus .emblem.color-9 {
  background: #85071e;
}
.citrus .portrait.color-10,
.citrus .emblem.color-10 {
  background: #a95998;
}
.citrus .portrait.color-11,
.citrus .emblem.color-11 {
  background: #5e4982;
}
.citrus .portrait.color-12,
.citrus .emblem.color-12 {
  background: #462756;
}
.citrus .portrait {
  border-color: #eaeaea;
}
.citrus .portrait.anonymous {
  background-color: #fff;
}
.citrus .portrait.anonymous i {
  color: #eaeaea;
}
.citrus .emblem.online {
  background: #3dc270;
  border-color: #fff;
}
.citrus .emblem.offline {
  background: #c8102e;
  border-color: #fff;
}
.citrus .emblem.complete {
  background: none;
  border-color: #3dc270;
  color: #3dc270;
}
.citrus .emblem.complete.active {
  background: #3dc270;
  color: #fff;
}
.citrus .emblem.incomplete {
  background: none;
  border-color: #1588af;
  color: #1588af;
}
.citrus .emblem.incomplete.active {
  background: #1588af;
  color: #fff;
}
.citrus .emblem.disabled {
  background: none;
  border-color: #cccccc;
  color: #cccccc;
}
.citrus .emblem.filtered {
  background: #ff6611;
  border-color: #fff;
}
.citrus .badge-stack {
  position: relative;
  height: 44px;
  height: 3.143rem;
  width: 44px;
  width: 3.143rem;
}
.citrus .badge-stack .portrait + *,
.citrus .badge-stack .emblem + * {
  position: absolute;
  bottom: 0;
  right: 0;
}
.citrus .badge-stack .portrait + .button.count {
  position: absolute;
  bottom: auto;
  top: 0;
  right: 0;
}
.citrus .rounded-box {
  border-radius: 4px;
  margin-bottom: 12px;
  margin-bottom: 0.857rem;
  display: block;
  overflow: hidden;
  position: relative;
  /* Colors */
}
.citrus .rounded-box.inverse {
  color: #fff;
}
.citrus .rounded-box.shadow {
  box-shadow: 0 0 5px #cccccc;
}
.citrus .rounded-box.anniversary {
  background: #f5f5f5;
}
.citrus .rounded-box.anniversary .emblem {
  color: #1588af;
}
.citrus .rounded-box.birthday {
  background: #462756;
}
.citrus .rounded-box.hire {
  background: #f5f5f5;
}
.citrus .rounded-box.hire .emblem {
  color: #1588af;
}
.citrus .rounded-box.impression-custom {
  background: #f5f5f5;
}
.citrus .rounded-box.impression-help,
.citrus .rounded-box.impression-leadership,
.citrus .rounded-box.impression-presentation {
  background: #e35e6b;
}
.citrus .rounded-box.impression-customer-satisfaction,
.citrus .rounded-box.impression-problem-solver,
.citrus .rounded-box.impression-thanks {
  background: #f8b100;
}
.citrus .rounded-box.impression-communications,
.citrus .rounded-box.impression-innovation,
.citrus .rounded-box.impression-team-player {
  background: #085a7e;
}
.citrus .rounded-box.impression-efficiency,
.citrus .rounded-box.impression-mentor,
.citrus .rounded-box.impression-top-gun {
  background: #563b70;
}
.citrus .rounded-box.impression-get-it-done,
.citrus .rounded-box.impression-motivation {
  background: #2eab73;
}
.citrus .rounded-box.impression-great-job,
.citrus .rounded-box.impression-outstanding {
  background: #146b4d;
}
.citrus .rounded-box.news {
  background: #f5f5f5;
}
.citrus .rounded-box .impression-image {
  display: block;
  width: 44px;
  width: 3.143rem;
}
.citrus .rounded-box .padding,
.citrus .rounded-box.padding {
  padding: 12px;
  padding: 0.857rem;
}
.citrus .rounded-box .margin-right {
  margin-right: 12px;
  margin-right: 0.857rem;
}
.citrus .rounded-box .portrait {
  border: none;
}
.citrus .rounded-box .emblem {
  background: none;
  border: none;
}
.citrus .rounded-box .emblem i {
  font-size: 28px;
  font-size: 2rem;
}
.citrus .rounded-box h3 {
  line-height: 1.2;
  margin: 0;
}
.citrus .rounded-box h4 {
  line-height: 1.2;
}
.citrus .rounded-box p.opaque {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";
  opacity: 0.5;
}
.citrus a.rounded-box {
  color: inherit;
}
.citrus a.rounded-box:hover {
  background: #f5f5f5;
}
.citrus .data-table {
  width: 100%;
}
.citrus .data-table th,
.citrus .data-table td {
  text-align: right;
  padding: 8px;
  padding: 0.571rem;
}
.citrus .data-table th:first-child,
.citrus .data-table td:first-child {
  text-align: left;
}
.citrus.table,
.citrus .table {
  background: none;
  border-width: 0px;
  border-style: solid;
  border-color: #cccccc;
  border-collapse: collapse;
  border-radius: 2px;
  box-sizing: border-box;
  color: #666666;
  margin: 10px 0px;
  margin: 0.714rem 0rem;
  width: 100%;
}
.citrus.table .left,
.citrus .table .left {
  text-align: left;
}
.citrus.table .right,
.citrus .table .right {
  text-align: right;
}
.citrus.table .type-centeralign,
.citrus .table .type-centeralign,
.citrus.table .center,
.citrus .table .center {
  text-align: center;
}
.citrus.table.fixed-layout,
.citrus .table.fixed-layout {
  table-layout: fixed;
}
.citrus.table thead tr,
.citrus .table thead tr {
  background: #eaeaea;
  /* For WebKit (Safari, Google Chrome etc) */
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ddd));
  /* For Mozilla/Gecko (Firefox etc) */
  background: -moz-linear-gradient(top, #fff, #ddd);
  /* For Internet Explorer 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF, endColorstr=#FFDDDDDD)";
  color: #222222;
}
.citrus.table thead tr th,
.citrus .table thead tr th {
  border-width: 1px 1px 0px 1px;
  border-style: solid;
  border-color: #cccccc;
  text-align: left;
  padding: 11px 8px;
  padding: 0.786rem 0.571rem;
  margin: 0px;
  font-weight: normal;
}
.citrus.table thead tr th.ascending:after,
.citrus .table thead tr th.ascending:after,
.citrus.table thead tr th.decending:after,
.citrus .table thead tr th.decending:after {
  font-family: 'PaylocityIcons-Bold';
  speak: none;
  font-style: normal;
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 12px;
  font-size: 0.857rem;
  margin-left: 8px;
}
.citrus.table thead tr th.ascending:after,
.citrus .table thead tr th.ascending:after {
  content: "\e621";
}
.citrus.table thead tr th.decending:after,
.citrus .table thead tr th.decending:after {
  content: "\e63a";
}
.citrus.table tbody tr,
.citrus .table tbody tr {
  background: #fff;
  color: #222222;
}
.citrus.table tbody tr:nth-child(even),
.citrus .table tbody tr:nth-child(even) {
  background-color: #dff4f8;
}
.citrus.table tbody tr.highlight,
.citrus .table tbody tr.highlight {
  background-color: #1588af;
  color: #fff;
}
.citrus.table tbody tr.highlight td a,
.citrus .table tbody tr.highlight td a {
  color: #fff;
}
.citrus.table tbody tr td,
.citrus .table tbody tr td {
  border-width: 1px;
  border-style: solid;
  border-color: #cccccc;
  /*color: @black;*/
  text-align: left;
  padding: 10px 8px;
  padding: 0.714rem 0.571rem;
}
.citrus.table tbody tr td.padding-none,
.citrus .table tbody tr td.padding-none {
  padding: 0;
}
.citrus.table tbody tr td.highlight,
.citrus .table tbody tr td.highlight {
  background-color: #1588af;
  color: #fff;
}
.citrus.table tbody tr td.highlight a,
.citrus .table tbody tr td.highlight a {
  color: #fff;
}
.citrus.table tbody tr td.upload,
.citrus .table tbody tr td.upload {
  padding: 0px 8px;
  padding: 0rem 0.571rem;
}
.citrus.table tbody tr td.status i,
.citrus .table tbody tr td.status i {
  position: relative;
  top: 2px;
  margin-right: 8px;
  line-height: 0;
}
.citrus.table tbody tr td a,
.citrus .table tbody tr td a {
  display: inline-block;
}
.citrus.table tbody tr.zero-state td,
.citrus .table tbody tr.zero-state td {
  padding: 75px 0 75px 0;
  padding: 5.357rem 0 5.357rem 0;
  vertical-align: center;
}
.citrus.table tbody tr.zero-state:hover,
.citrus .table tbody tr.zero-state:hover {
  background-color: transparent;
}
.citrus.table.compact thead tr th,
.citrus .table.compact thead tr th {
  font-size: 12px;
}
.citrus.table.compact tbody tr td,
.citrus .table.compact tbody tr td {
  font-size: 12px;
  padding: 8px 8px 8px 8px;
  padding: 0.571rem 0.571rem 0.571rem 0.571rem;
}
.citrus.table.style-list,
.citrus .table.style-list {
  margin: 0px;
  margin: 0rem;
}
.citrus.table.style-list thead tr,
.citrus .table.style-list thead tr {
  background: none;
}
.citrus.table.style-list thead tr th,
.citrus .table.style-list thead tr th {
  display: none;
  border: none;
  font-weight: bold;
  color: #666666;
}
.citrus.table.style-list tbody tr,
.citrus .table.style-list tbody tr {
  cursor: pointer;
  background-color: transparent;
}
.citrus.table.style-list tbody tr:hover,
.citrus .table.style-list tbody tr:hover {
  background-color: #eaeaea;
}
.citrus.table.style-list tbody tr td,
.citrus .table.style-list tbody tr td {
  display: none;
  vertical-align: middle;
  border-width: 1px 0px 1px 0px;
}
.citrus.table.style-list tbody tr td.vertical-align-top,
.citrus .table.style-list tbody tr td.vertical-align-top {
  vertical-align: top;
}
.citrus.table.style-list tbody tr:last-child td,
.citrus .table.style-list tbody tr:last-child td {
  border-bottom: 0px;
}
.citrus.table.style-list tbody tr.zero-state td,
.citrus .table.style-list tbody tr.zero-state td {
  padding: 75px 0 75px 0;
  padding: 5.357rem 0 5.357rem 0;
  vertical-align: center;
}
.citrus.table.style-list tbody tr.zero-state:hover,
.citrus .table.style-list tbody tr.zero-state:hover {
  background-color: transparent;
}
.citrus.table.style-list thead tr th.keep-mobile,
.citrus .table.style-list thead tr th.keep-mobile,
.citrus.table.style-list tbody tr td.keep-mobile,
.citrus .table.style-list tbody tr td.keep-mobile {
  display: table-cell;
}
@media screen and (min-width: 700px) {
  .citrus.table.style-list thead tr th,
  .citrus .table.style-list thead tr th,
  .citrus.table.style-list tbody tr td,
  .citrus .table.style-list tbody tr td {
    display: table-cell;
  }
}
.citrus.table.style-full-width thead tr th,
.citrus .table.style-full-width thead tr th,
.citrus.table.style-full-width tbody tr td,
.citrus .table.style-full-width tbody tr td {
  padding: 8px 15px;
  padding: 0.571rem 1.071rem;
}
.citrus.table.style-full-width thead tr th:first-child,
.citrus .table.style-full-width thead tr th:first-child,
.citrus.table.style-full-width tbody tr td:first-child,
.citrus .table.style-full-width tbody tr td:first-child {
  border-left: 0px;
}
.citrus.table.style-full-width thead tr th:last-child,
.citrus .table.style-full-width thead tr th:last-child,
.citrus.table.style-full-width tbody tr td:last-child,
.citrus .table.style-full-width tbody tr td:last-child {
  border-right: 0px;
}
.citrus.table.style-accordion td .row-float-fill,
.citrus .table.style-accordion td .row-float-fill {
  width: auto;
}
.citrus.table.style-accordion th:first-child,
.citrus .table.style-accordion th:first-child {
  padding-left: 44px;
}
.citrus.table.style-accordion tr td:first-child:before,
.citrus .table.style-accordion tr td:first-child:before {
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 16px;
  font-size: 1.143rem;
  font-style: normal;
  font-weight: 600;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-right: 16px;
  margin-right: 1.143rem;
  color: #1588af;
  content: "\e63a";
  /* icon-expand */
  float: left;
  position: relative;
  top: 16px;
}
.citrus.table.style-accordion tr.active td:first-child:before,
.citrus .table.style-accordion tr.active td:first-child:before {
  content: "\e621";
  /* icon-collapse */
}
.citrus.table.style-accordion tr.active td,
.citrus .table.style-accordion tr.active td {
  border-bottom: 1px solid #ccc;
}
.citrus.table.style-accordion tr.active + .table-details td,
.citrus .table.style-accordion tr.active + .table-details td {
  display: table-cell;
  max-height: 2400px;
  max-height: 171.429rem;
  padding: 8px 0px;
}
.citrus.table.style-accordion tr.active + .table-details td > div,
.citrus .table.style-accordion tr.active + .table-details td > div {
  display: inline;
}
.citrus.table.style-accordion td,
.citrus .table.style-accordion td {
  border-bottom: none;
}
.citrus.table.style-accordion .table-details,
.citrus .table.style-accordion .table-details {
  background: #f5f5f5;
}
.citrus.table.style-accordion .table-details td:first-child:before,
.citrus .table.style-accordion .table-details td:first-child:before {
  content: none;
}
.citrus.table.style-accordion .table-details:hover,
.citrus .table.style-accordion .table-details:hover {
  background: #f5f5f5;
}
.citrus.table.style-accordion .table-details td,
.citrus .table.style-accordion .table-details td {
  box-sizing: border-box;
  border-width: 0 1px 0 1px;
  border-top: 0;
  line-height: 1.2;
  max-height: 0px;
  margin: 0;
  overflow: hidden;
  display: block;
  padding: 0;
  transition: max-height 0.2s ease-in-out;
  transition: padding 0.1s ease-in-out;
}
.citrus.table.style-accordion .table-details td > div,
.citrus .table.style-accordion .table-details td > div {
  display: none;
}
.citrus .table-pager {
  font-size: 0;
}
.citrus .table-pager a {
  text-decoration: none;
}
.citrus .table-pager a.link {
  line-height: 28px;
  height: 28px;
  margin-right: 1px;
  min-width: 28px;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
}
.citrus .table-pager a.link.disabled {
  color: #cccccc;
  cursor: not-allowed;
}
.citrus .table-pager a.link i {
  line-height: 28px;
}
.citrus .table-pager a.link:hover {
  background: #eaeaea;
}
.citrus .table-pager span.info {
  display: inline-block;
  font-size: 14px;
  font-size: 1rem;
  line-height: 28px;
  margin-left: 20px;
  vertical-align: middle;
}
.citrus .table-pager ul {
  display: inline-block;
  margin: 0;
  padding: 0;
  vertical-align: middle;
}
.citrus .table-pager ul li {
  border-radius: 2px;
  display: inline-block;
  font-size: 14px;
  font-size: 1rem;
  line-height: 28px;
  height: 28px;
  margin-right: 1px;
  min-width: 28px;
  text-align: center;
  vertical-align: middle;
}
.citrus .table-pager ul li.selected {
  background: #ff6611;
  color: white;
  font-weight: bold;
}
.citrus .table-pager ul li a {
  border-radius: 2px;
  color: #666666;
  display: block;
  height: 100%;
  width: 100%;
}
.citrus .table-pager ul li a:hover {
  background: #eaeaea;
}
.citrus {
  /* Card Tabs i.e. Segmented Controls*/
  /* For cards smaller than 400px in scaffolding */
}
.citrus .tabs-group,
.citrus.tabs-group {
  font-size: 0;
  margin-bottom: 20px;
  margin-bottom: 1.429rem;
}
.citrus .tabs-group.attached,
.citrus.tabs-group.attached {
  margin-bottom: 0;
}
.citrus .tabs {
  width: 100%;
  list-style-type: none;
  padding: 0;
}
.citrus .tabs.inset {
  font-size: 0;
}
.citrus .tabs.inset li {
  background: none;
  border-radius: 0;
  font-size: 14px;
  font-size: 1rem;
  line-height: 16px;
  margin: 0;
  padding: 0;
}
.citrus .tabs.inset li a,
.citrus .tabs.inset li a:visited {
  background: none;
  border: none;
  color: #085a7e;
  display: block;
  padding: 16px;
  padding: 1.143rem;
  position: relative;
}
.citrus .tabs.inset li a:hover,
.citrus .tabs.inset li a:visited:hover,
.citrus .tabs.inset li a:active,
.citrus .tabs.inset li a:visited:active {
  background: none;
}
.citrus .tabs.inset li.active {
  top: 0;
}
.citrus .tabs.inset li.active a,
.citrus .tabs.inset li.active a:hover,
.citrus .tabs.inset li.active a:active,
.citrus .tabs.inset li.active a:visited {
  background: none;
  border: none;
  color: #085a7e;
  padding: 16px;
  padding: 1.143rem;
}
.citrus .tabs.inset li.active a:before,
.citrus .tabs.inset li.active a:hover:before,
.citrus .tabs.inset li.active a:active:before,
.citrus .tabs.inset li.active a:visited:before {
  background: #085a7e;
  bottom: 0;
  content: '';
  display: block;
  height: 4px;
  left: 0;
  position: absolute;
  width: 100%;
}
.citrus .tabs a,
.citrus .tabs a:visited {
  background-color: #dadada;
  display: inline-block;
  text-decoration: none;
  padding: 15px;
  padding: 1.071rem;
}
.citrus .tabs li {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 2px;
  display: inline-block;
  font-size: 14px;
  font-size: 1rem;
  margin: 0 5px 0 0;
  margin: 0 0.357rem 0 0;
  overflow: hidden;
  background: #fff;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  vertical-align: bottom;
}
.citrus .tabs li a {
  color: #666666;
  border-bottom: 1px solid #cccccc;
}
.citrus .tabs li a:hover {
  background: #f5f5f5;
}
.citrus .tabs li a:active {
  background: #cccccc;
}
.citrus .tabs li.active {
  position: relative;
  top: 1px;
}
.citrus .tabs li.active a,
.citrus .tabs li.active a:hover,
.citrus .tabs li.active a:active,
.citrus .tabs li.active a:visited {
  background: #fff;
  color: #c8102e;
  font-weight: 600;
  border: 1px solid #cccccc;
  border-width: 4px 1px 1px 1px;
  border-top-color: #c8102e;
  border-bottom-color: #fff;
  padding: 14px 15px 16px 15px;
  padding: 1rem 1.071rem 1.143rem 1.071rem;
}
.citrus .subtabs {
  border: 1px solid #cccccc;
  border-width: 1px 1px 0px 1px;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  font-size: 14px;
  font-size: 1rem;
  color: #222222;
}
.citrus .subtabs:after {
  content: '';
  display: block;
  height: 2px;
  background: #fff;
  position: relative;
  margin-bottom: -1px;
  padding: 2px;
}
.citrus .subtabs ul {
  background: #fff;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  margin: 0;
  padding: 0 0 0 15px;
  padding: 0 0 0 1.071rem;
}
.citrus .subtabs li {
  display: inline-block;
  padding: 0;
}
.citrus .subtabs a {
  border: 1px solid #fff;
  display: block;
  border-radius: 2px;
  color: #1588af;
  text-decoration: none;
  padding: 10px 12px 10px 12px;
  padding: 0.714rem 0.857rem 0.714rem 0.857rem;
  margin: 12px 10px 12px 0px;
  margin: 0.857rem 0.714rem 0.857rem 0rem;
}
.citrus .subtabs a:hover {
  background-color: #dff4f8;
  border-color: #dff4f8;
  color: #1588af;
}
.citrus .subtabs a:active,
.citrus .subtabs a.active:active {
  background-color: #085a7e;
  border-color: #085a7e;
  color: #fff;
}
.citrus .subtabs a.active,
.citrus .subtabs a.active a:hover,
.citrus .subtabs a.active a:active,
.citrus .subtabs a.active a:visited {
  background-color: #1588af;
  border-color: #1588af;
  color: #fff;
}
.citrus.card .tabs,
.citrus .card .tabs,
.citrus.segmented-control,
.citrus .segmented-control {
  display: block;
  border-radius: 2px;
  box-sizing: border-box;
  margin: 10px 15px;
  margin: 0.714rem 1.071rem;
  padding-left: 0px;
  padding-left: 0rem;
  width: auto;
  font-size: 0;
  text-align: center;
  /*compact option*/
  /*secondary color option*/
}
@media only screen and (max-width: 699px) {
  .citrus.card .tabs,
  .citrus .card .tabs,
  .citrus.segmented-control,
  .citrus .segmented-control {
    display: table;
    margin-left: 0;
    margin-right: 0;
    padding: 0 15px;
    padding: 0 1.071rem;
    width: 100%;
  }
}
.citrus.card .tabs li,
.citrus .card .tabs li,
.citrus.segmented-control li,
.citrus .segmented-control li {
  font-size: 14px;
  font-size: 1rem;
  line-height: 16px;
  display: inline-block;
  box-sizing: border-box;
  text-align: center;
  width: 122px;
  margin: auto;
  border-radius: 0;
  top: auto;
}
@media only screen and (max-width: 699px) {
  .citrus.card .tabs li,
  .citrus .card .tabs li,
  .citrus.segmented-control li,
  .citrus .segmented-control li {
    display: table-cell;
  }
}
.citrus.card .tabs li:first-child a,
.citrus .card .tabs li:first-child a,
.citrus.segmented-control li:first-child a,
.citrus .segmented-control li:first-child a,
.citrus.card .tabs li:first-child a:hover,
.citrus .card .tabs li:first-child a:hover,
.citrus.segmented-control li:first-child a:hover,
.citrus .segmented-control li:first-child a:hover {
  border-left: 1px solid #1588af;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 2px;
  border-top-left-radius: 2px;
}
.citrus.card .tabs li:last-child a,
.citrus .card .tabs li:last-child a,
.citrus.segmented-control li:last-child a,
.citrus .segmented-control li:last-child a {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.citrus.card .tabs li a,
.citrus .card .tabs li a,
.citrus.segmented-control li a,
.citrus .segmented-control li a {
  background: transparent;
  border-radius: 0;
  color: #1588af;
  text-decoration: none;
  display: block;
  padding: 10px 10px;
  padding: 0.714rem 0.714rem;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  border: 1px solid #1588af;
  border-left: none;
}
@media only screen and (max-width: 699px) {
  .citrus.card .tabs li a,
  .citrus .card .tabs li a,
  .citrus.segmented-control li a,
  .citrus .segmented-control li a {
    padding: 5px 5px;
    padding: 0.357rem 0.357rem;
  }
}
.citrus.card .tabs li a:hover,
.citrus .card .tabs li a:hover,
.citrus.segmented-control li a:hover,
.citrus .segmented-control li a:hover,
.citrus.card .tabs li a:focus,
.citrus .card .tabs li a:focus,
.citrus.segmented-control li a:focus,
.citrus .segmented-control li a:focus {
  background: #c3e9f2;
  color: #1588af;
  border: 1px solid #1588af;
  border-left: none;
}
.citrus.card .tabs li a:active,
.citrus .card .tabs li a:active,
.citrus.segmented-control li a:active,
.citrus .segmented-control li a:active {
  background: #085a7e;
  color: #fff;
}
.citrus.card .tabs li.active a,
.citrus .card .tabs li.active a,
.citrus.segmented-control li.active a,
.citrus .segmented-control li.active a {
  background: #1588af;
  color: #fff;
  font-weight: normal;
}
.citrus.card .tabs li.active a:hover,
.citrus .card .tabs li.active a:hover,
.citrus.segmented-control li.active a:hover,
.citrus .segmented-control li.active a:hover {
  color: #1588af;
  background: #c3e9f2;
}
.citrus.card .tabs li.active a:active,
.citrus .card .tabs li.active a:active,
.citrus.segmented-control li.active a:active,
.citrus .segmented-control li.active a:active {
  background: #085a7e;
  color: #fff;
}
.citrus.card .tabs.compact li,
.citrus .card .tabs.compact li,
.citrus.segmented-control.compact li,
.citrus .segmented-control.compact li {
  font-size: 12px;
  font-size: 0.857rem;
}
.citrus.card .tabs.compact li a,
.citrus .card .tabs.compact li a,
.citrus.segmented-control.compact li a,
.citrus .segmented-control.compact li a {
  padding: 5px 10px;
  padding: 0.357rem 0.714rem;
}
.citrus.card .tabs.secondary li:first-child a,
.citrus .card .tabs.secondary li:first-child a,
.citrus.segmented-control.secondary li:first-child a,
.citrus .segmented-control.secondary li:first-child a {
  border-left: 1px solid #ff6611;
}
.citrus.card .tabs.secondary li a,
.citrus .card .tabs.secondary li a,
.citrus.segmented-control.secondary li a,
.citrus .segmented-control.secondary li a {
  color: #ff6611;
  border-color: #ff6611;
}
.citrus.card .tabs.secondary li a:hover,
.citrus .card .tabs.secondary li a:hover,
.citrus.segmented-control.secondary li a:hover,
.citrus .segmented-control.secondary li a:hover,
.citrus.card .tabs.secondary li a:focus,
.citrus .card .tabs.secondary li a:focus,
.citrus.segmented-control.secondary li a:focus,
.citrus .segmented-control.secondary li a:focus {
  background: #ffe0d4;
  color: #ff6611;
}
.citrus.card .tabs.secondary li a:active,
.citrus .card .tabs.secondary li a:active,
.citrus.segmented-control.secondary li a:active,
.citrus .segmented-control.secondary li a:active {
  background: #cc3d0c;
  color: #fff;
}
.citrus.card .tabs.secondary li.active a,
.citrus .card .tabs.secondary li.active a,
.citrus.segmented-control.secondary li.active a,
.citrus .segmented-control.secondary li.active a {
  background: #ff6611;
  color: #fff;
}
.citrus.card .tabs.secondary li.active a:hover,
.citrus .card .tabs.secondary li.active a:hover,
.citrus.segmented-control.secondary li.active a:hover,
.citrus .segmented-control.secondary li.active a:hover {
  color: #ff6611;
  background: #ffe0d4;
}
.citrus.card .tabs.secondary li.active a:active,
.citrus .card .tabs.secondary li.active a:active,
.citrus.segmented-control.secondary li.active a:active,
.citrus .segmented-control.secondary li.active a:active {
  background: #cc3d0c;
  color: #fff;
}
.citrus.card .tabs.icons li,
.citrus .card .tabs.icons li,
.citrus.segmented-control.icons li,
.citrus .segmented-control.icons li {
  width: auto;
}
@media only screen and (max-width: 397px) {
  .citrus.card .tabs li,
  .citrus .card .tabs li,
  .citrus.segmented-control li,
  .citrus .segmented-control li {
    font-size: 12px;
    font-size: 0.857rem;
    width: 33%;
  }
  .citrus.card .tabs li a,
  .citrus .card .tabs li a,
  .citrus.segmented-control li a,
  .citrus .segmented-control li a {
    padding: 9px;
    padding: 0.643rem;
  }
}
@media only screen and (max-width: 519px) {
  .citrus.card .tabs li:first-child:nth-last-child(4),
  .citrus .card .tabs li:first-child:nth-last-child(4),
  .citrus.segmented-control li:first-child:nth-last-child(4),
  .citrus .segmented-control li:first-child:nth-last-child(4),
  .citrus.card .tabs li:first-child:nth-last-child(4) ~ li,
  .citrus .card .tabs li:first-child:nth-last-child(4) ~ li,
  .citrus.segmented-control li:first-child:nth-last-child(4) ~ li,
  .citrus .segmented-control li:first-child:nth-last-child(4) ~ li {
    font-size: 12px;
    font-size: 0.857rem;
    width: 25%;
  }
  .citrus.card .tabs li:first-child:nth-last-child(4) a,
  .citrus .card .tabs li:first-child:nth-last-child(4) a,
  .citrus.segmented-control li:first-child:nth-last-child(4) a,
  .citrus .segmented-control li:first-child:nth-last-child(4) a,
  .citrus.card .tabs li:first-child:nth-last-child(4) ~ li a,
  .citrus .card .tabs li:first-child:nth-last-child(4) ~ li a,
  .citrus.segmented-control li:first-child:nth-last-child(4) ~ li a,
  .citrus .segmented-control li:first-child:nth-last-child(4) ~ li a {
    padding: 9px 0;
    padding: 0.643rem 0;
  }
}
.citrus .card-310px .card.size-small .tabs li,
.citrus .card-310px .card.size-small .segmented-control li {
  width: 92px;
}
.citrus [data-tooltip] {
  position: relative;
  z-index: 1;
}
.citrus [data-tooltip]:before {
  content: attr(data-tooltip);
  font-weight: normal;
  font-size: 14px;
  font-size: 1rem;
  position: absolute;
  bottom: 100%;
  color: #222222;
  background: #ffee7e;
  padding: 11px 15px;
  border-radius: 2px;
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
  white-space: nowrap;
  visibility: hidden;
  left: 50%;
  transform: translateX(-50%);
}
.citrus [data-tooltip]:hover:before,
.citrus [data-tooltip]:hover:after,
.citrus [data-tooltip]:focus:before,
.citrus [data-tooltip]:focus:after {
  visibility: visible;
  -webkit-transition: visibility 0s linear .3s;
  -moz-transition: visibility 0s linear .3s;
  -o-transition: visibility 0s linear .3s;
  transition: visibility 0s linear .3s;
}
.citrus.side-nav,
.citrus .side-nav {
  width: 100%;
  margin: 0;
  padding: 0;
}
.citrus.side-nav li,
.citrus .side-nav li {
  box-sizing: border-box;
  display: block;
}
.citrus.side-nav li a,
.citrus .side-nav li a {
  display: block;
  color: #1588af;
  padding: 9px 15px;
  padding: 0.643rem 1.071rem;
  position: relative;
  text-decoration: none;
}
.citrus.side-nav li a i,
.citrus .side-nav li a i {
  margin-right: 10px;
  margin-right: 0.714rem;
  display: inline-block;
  vertical-align: top;
  margin-top: 5px;
  margin-top: 0.357rem;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav li a i,
  .citrus .side-nav li a i {
    font-size: 16px;
    margin-right: 5px;
    margin-right: 0.357rem;
    margin-top: 2px;
    margin-top: 0.143rem;
  }
}
.citrus.side-nav li a:hover,
.citrus .side-nav li a:hover {
  background-color: #eaeaea;
  border-color: #eaeaea;
}
.citrus.side-nav li a h3,
.citrus .side-nav li a h3,
.citrus.side-nav li a .h3,
.citrus .side-nav li a .h3 {
  display: inline-block;
  vertical-align: top;
  word-wrap: break-word;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav li a h3,
  .citrus .side-nav li a h3,
  .citrus.side-nav li a .h3,
  .citrus .side-nav li a .h3 {
    font-size: 14px;
    font-size: 1rem;
    font-weight: 600;
  }
}
.citrus.side-nav li a i + h3,
.citrus .side-nav li a i + h3,
.citrus.side-nav li a i + .h3,
.citrus .side-nav li a i + .h3 {
  max-width: 80%;
}
.citrus.side-nav li.active,
.citrus .side-nav li.active {
  background-color: #1588af;
  border-color: #1588af;
  color: #fff;
}
.citrus.side-nav li.active .button.secondary.count.outline,
.citrus .side-nav li.active .button.secondary.count.outline {
  background-color: #fff;
}
.citrus.side-nav li.active a,
.citrus .side-nav li.active a {
  color: #fff;
}
.citrus.side-nav li.active a:hover,
.citrus .side-nav li.active a:hover {
  background-color: #1588af;
}
.citrus.side-nav li.active i,
.citrus .side-nav li.active i {
  font-weight: bold;
}
.citrus.side-nav li.disabled > a,
.citrus .side-nav li.disabled > a {
  cursor: not-allowed;
  color: #cccccc;
}
.citrus.side-nav li.disabled > a:hover,
.citrus .side-nav li.disabled > a:hover {
  background: #fff;
}
.citrus.side-nav.side-arrows a,
.citrus .side-nav.side-arrows a {
  padding: 9px 40px 9px 15px;
  padding: 0.643rem 2.857rem 0.643rem 1.071rem;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav.side-arrows a,
  .citrus .side-nav.side-arrows a {
    padding: 12px 40px 12px 15px;
    padding: 0.857rem 2.857rem 0.857rem 1.071rem;
  }
}
.citrus.side-nav.side-arrows a:hover:after,
.citrus .side-nav.side-arrows a:hover:after {
  content: "\e642";
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: 600;
  font-variant: normal;
  text-transform: none;
  right: 15px;
  right: 1.071rem;
  top: 10px;
  top: 0.714rem;
  line-height: 0.7;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-top: -7px;
  margin-top: -0.5rem;
  top: 50%;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav.side-arrows a:hover:after,
  .citrus .side-nav.side-arrows a:hover:after {
    margin-top: -5px;
    margin-top: -0.357rem;
    font-size: 16px;
    font-size: 1.143rem;
  }
}
.citrus.side-nav.side-arrows .active a:after,
.citrus .side-nav.side-arrows .active a:after {
  content: "\e642";
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: 600;
  font-variant: normal;
  text-transform: none;
  right: 15px;
  right: 1.071rem;
  top: 10px;
  top: 0.714rem;
  line-height: 0.7;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-top: -7px;
  margin-top: -0.5rem;
  top: 50%;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav.side-arrows .active a:after,
  .citrus .side-nav.side-arrows .active a:after {
    margin-top: -5px;
    margin-top: -0.357rem;
    font-size: 16px;
    font-size: 1.143rem;
  }
}
.citrus.side-nav.side-arrows .disabled a:hover:after,
.citrus .side-nav.side-arrows .disabled a:hover:after {
  content: " ";
}
.citrus.side-nav.side-accordion > li a,
.citrus .side-nav.side-accordion > li a {
  padding: 9px 40px 9px 15px;
  padding: 0.643rem 2.857rem 0.643rem 1.071rem;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav.side-accordion > li a,
  .citrus .side-nav.side-accordion > li a {
    padding: 12px 40px 12px 15px;
    padding: 0.857rem 2.857rem 0.857rem 1.071rem;
  }
  .citrus.side-nav.side-accordion > li a.h3,
  .citrus .side-nav.side-accordion > li a.h3 {
    font-size: 14px;
    font-size: 1rem;
    font-weight: 600;
  }
}
.citrus.side-nav.side-accordion > li a:after,
.citrus .side-nav.side-accordion > li a:after {
  content: "\e63a";
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: 600;
  font-variant: normal;
  text-transform: none;
  right: 15px;
  right: 1.071rem;
  top: 10px;
  top: 0.714rem;
  line-height: 0.7;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-top: -7px;
  margin-top: -0.5rem;
  top: 50%;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav.side-accordion > li a:after,
  .citrus .side-nav.side-accordion > li a:after {
    font-size: 16px;
    font-size: 1.143rem;
    margin-top: -5px;
    margin-top: -0.357rem;
  }
}
.citrus.side-nav.side-accordion > li.active,
.citrus .side-nav.side-accordion > li.active {
  background-color: #fff;
}
.citrus.side-nav.side-accordion > li.active .button.count.secondary.outline,
.citrus .side-nav.side-accordion > li.active .button.count.secondary.outline {
  background-color: transparent;
}
.citrus.side-nav.side-accordion > li.active > a,
.citrus .side-nav.side-accordion > li.active > a {
  color: #1588af;
  background-color: #fff;
}
.citrus.side-nav.side-accordion > li.active > a:hover,
.citrus .side-nav.side-accordion > li.active > a:hover {
  color: #1588af;
  background-color: #eaeaea;
}
.citrus.side-nav.side-accordion > li.active > a:after,
.citrus .side-nav.side-accordion > li.active > a:after {
  content: "\e621";
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 20px;
  font-size: 1.429rem;
  font-style: normal;
  font-weight: 600;
  font-variant: normal;
  text-transform: none;
  right: 15px;
  right: 1.071rem;
  top: 10px;
  top: 0.714rem;
  line-height: 0.7;
  position: absolute;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-top: -7px;
  margin-top: -0.5rem;
  top: 50%;
}
@media only screen and (max-width: 699px), only screen and (min-width: 700px) and (max-width: 859px), only screen and (min-width: 860px) and (max-width: 1023px) {
  .citrus.side-nav.side-accordion > li.active > a:after,
  .citrus .side-nav.side-accordion > li.active > a:after {
    font-size: 16px;
    font-size: 1.143rem;
    margin-top: -5px;
    margin-top: -0.357rem;
  }
}
.citrus.side-nav.side-accordion > li.active > ul,
.citrus .side-nav.side-accordion > li.active > ul {
  max-height: 1200px;
  max-height: 85.714rem;
}
.citrus.side-nav.side-accordion > li > ul,
.citrus .side-nav.side-accordion > li > ul {
  max-height: 0;
  margin: 0;
  padding: 0;
  transition: max-height 0.2s ease-in-out;
  overflow: hidden;
}
.citrus.side-nav.side-accordion > li > ul > li,
.citrus .side-nav.side-accordion > li > ul > li {
  background-color: #fff;
}
.citrus.side-nav.side-accordion > li > ul > li > a,
.citrus .side-nav.side-accordion > li > ul > li > a {
  color: #1588af;
  padding: 11px 40px 11px 30px;
  padding: 0.786rem 2.857rem 0.786rem 2.143rem;
}
.citrus.side-nav.side-accordion > li > ul > li > a:hover,
.citrus .side-nav.side-accordion > li > ul > li > a:hover {
  background-color: #eaeaea;
}
.citrus.side-nav.side-accordion > li > ul > li > a:after,
.citrus .side-nav.side-accordion > li > ul > li > a:after {
  content: none;
}
.citrus.side-nav.side-accordion > li > ul > li.active a,
.citrus .side-nav.side-accordion > li > ul > li.active a {
  background-color: #1588af;
  color: #fff;
}
.citrus.side-nav.border-bottom > li,
.citrus .side-nav.border-bottom > li {
  border-bottom: 1px solid #eaeaea;
}
.citrus.side-nav.border-bottom > li:last-child,
.citrus .side-nav.border-bottom > li:last-child {
  border-bottom: 0;
}
.citrus .side-nav-toggle {
  display: none;
  font-weight: 600;
  line-height: 20px;
  padding: 12px 0;
  padding: 0.857rem 0;
}
.citrus .side-nav-toggle .h3 {
  font-size: 14px;
  font-size: 1rem;
  font-weight: 600;
}
.citrus .side-nav-toggle .h3 i {
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: bold;
}
.citrus .side-nav-toggle:after {
  display: block;
  position: absolute;
  right: 15px;
  right: 1.071rem;
  top: 50%;
  margin-top: -9px;
  margin-top: -0.643rem;
  font-family: 'PaylocityIcons';
  speak: none;
  font-size: 16px;
  font-size: 1.143rem;
  font-style: normal;
  font-weight: 700;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e63a";
}
.citrus .side-nav-toggle.expanded:after {
  content: "\e621";
}
.citrus .side-nav.compact {
  background: #fff;
}
.citrus .side-nav.compact > li > a {
  background: #f5f5f5;
}
.citrus .side-nav.compact > li > a:after {
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: 400;
  margin-top: -4px;
  margin-top: -0.286rem;
}
.citrus .side-nav.compact > li > a.no-sub:after {
  content: "";
}
.citrus .side-nav.compact > li > a i {
  margin: 0px 7px 0 0;
}
.citrus .side-nav.compact > li.active > a {
  background: #f5f5f5;
}
.citrus .side-nav.compact > li.active > a:after {
  font-size: 16px;
  font-size: 1.143rem;
  font-weight: 400;
  margin-top: -4px;
  margin-top: -0.286rem;
}
.citrus .side-nav.compact > li.active ul li {
  background: none;
}
.citrus .side-nav.compact > li.active ul li a {
  color: #1588af;
}
.citrus .side-nav.compact > li.active ul li a:hover {
  background: #f5f5f5;
}
.citrus .side-nav.compact > li ul {
  margin: 0;
  padding: 0;
  transition: max-height 0.3s ease-in-out;
}
.citrus .side-nav.compact > li ul li {
  list-style-type: none;
}
.citrus .side-nav.compact > li ul li a {
  padding: 9px 15px;
  padding: 0.643rem 1.071rem;
}
.citrus .side-nav.compact > li ul li a.active {
  background: #1588af;
  color: #fff;
}
.citrus .side-nav.compact > li ul li a.active:hover {
  background: #1588af;
  color: #fff;
}
@media only screen and (max-width: 699px) {
  .citrus .side-nav-toggle {
    display: block;
  }
  .citrus .side-nav a:after {
    display: none;
  }
  .citrus .side-nav {
    border-bottom: 1px solid #cccccc;
    transition: max-height 0.3s ease;
    max-height: 400px;
    overflow-y: auto;
  }
}
.citrus.webclock,
.citrus .webclock {
  display: block;
  height: 254px;
  text-align: center;
  position: relative;
}
.citrus.webclock canvas,
.citrus .webclock canvas {
  display: inline;
  margin: 0 auto;
  top: 24px;
  position: relative;
  z-index: 1;
}
.citrus.webclock .title,
.citrus .webclock .title {
  display: block;
  text-align: center;
  top: 0px;
  position: absolute;
  width: 100%;
  z-index: 2;
}
.citrus.webclock .clock,
.citrus .webclock .clock {
  display: block;
  font-size: 64px;
  font-size: 4.571rem;
  font-weight: 300;
  text-align: center;
  top: 98px;
  top: 7rem;
  position: absolute;
  width: 100%;
  z-index: 2;
}
.citrus.webclock .clock-seconds,
.citrus .webclock .clock-seconds {
  display: block;
  color: #1588af;
  font-size: 18px;
  font-size: 1.286rem;
  text-align: center;
  top: 46px;
  top: 3.286rem;
  position: absolute;
  width: 100%;
  z-index: 2;
}
.citrus.webclock .clock-details,
.citrus .webclock .clock-details {
  display: block;
  color: #1588af;
  font-size: 18px;
  font-size: 1.286rem;
  text-align: center;
  top: 208px;
  top: 14.857rem;
  position: absolute;
  width: 100%;
  z-index: 2;
}
.bar {
  border-radius: 2px;
  position: relative;
  width: 100%;
  height: 10px;
  background: transparent;
}
.bar .progress,
.bar .current-step {
  display: block;
  position: absolute;
  height: 100%;
  background: #41a8d2;
  border-radius: 2px;
}
.bar .current-step {
  background: #1588af;
}
.bar.has-background {
  background: #dadada;
  overflow: hidden;
}
.bar.has-background .progress,
.bar.has-background .current-step {
  border-radius: 0px;
}
.bar.complete .progress {
  background: #3dc270;
}
.bar.complete .current-step {
  background: #459644;
}
.bar.warning .progress {
  background: #ff8800;
}
.bar.warning .current-step {
  background: #8b1910;
}
.bar.data .progress {
  background: #2eab73;
}
p.progress-header,
.progress-description {
  color: #666666;
}
p.progress-header {
  margin: 0 0 4px 0;
  margin: 0 0 0.286rem 0;
  font-size: 12px;
  font-size: 0.857rem;
}
.progress-description {
  padding: 4px 0px 0px 0px;
  padding: 0.286rem 0rem 0rem 0rem;
}
@media screen and (min-width: 860px) {
  .bar {
    height: 20px;
  }
  p.progress-header a {
    font-size: 12px;
    font-size: 0.857rem;
  }
}
.citrus .steps li a {
  position: static;
}
.citrus .step {
  display: block;
  position: relative;
  text-decoration: none;
  padding: 2px 25px 2px 0;
  padding: 0.143rem 1.786rem 0.143rem 0;
  color: #1588af;
}
.citrus .step:before {
  content: '';
  position: absolute;
  z-index: 0;
  width: 1px;
  left: 9.5px;
  margin-top: 20px;
  border: 0px;
  border-left: 1px dashed;
  border-color: #cccccc;
  height: 100%;
}
.citrus .step.step-last:before {
  display: none;
}
.citrus .step .emblem {
  position: absolute;
  margin-right: 15px;
  z-index: 1;
  background-color: #fff;
  height: 20px;
  height: 1.429rem;
  width: 20px;
  width: 1.429rem;
}
.citrus .step .emblem i {
  display: none;
}
.citrus .step .emblem.complete {
  background: #3dc270;
}
.citrus .step span[class*='step-'] {
  display: block;
  margin: 0px 0px 0px 30px;
  margin: 0rem 0rem 0rem 2.143rem;
  line-height: 1.2;
}
.citrus .step .step-title {
  font-weight: bold;
  margin-top: 3px;
}
.citrus .step .overdue {
  color: #c8102e;
}
.citrus .step .step-message {
  position: absolute;
  right: -6px;
  top: 4px;
}
.citrus .step.active {
  color: #1588af;
  min-height: 42px;
  min-height: 3rem;
}
.citrus .step.step-complete {
  color: #3dc270;
}
.citrus .step.step-complete .emblem {
  background: #3dc270;
}
.citrus .step.step-complete .emblem i {
  color: #3dc270;
}
.citrus .step.step-complete.active .emblem.complete {
  background: #3dc270;
}
.citrus .step.step-complete.active .emblem i {
  color: #fff;
}
.citrus .step.step-disabled {
  color: #cccccc;
}
.citrus .step.step-disabled a {
  color: #cccccc;
}
.citrus .step.step-disabled .emblem {
  color: #cccccc;
  border-color: #cccccc;
  background: #f5f5f5;
}
.citrus .steps-ordered .step {
  color: #cccccc;
}
.citrus .steps-ordered .step.active {
  color: #1588af;
}
.citrus .steps-ordered .step.active:before {
  border-color: #1588af;
}
.citrus .steps-ordered .step.step-complete {
  color: #3dc270;
}
.citrus .steps-ordered .step.step-complete:before {
  border-style: solid;
  border-color: #3dc270;
}
.citrus .steps-horizontal {
  list-style: none;
  padding: 0;
  margin: 0;
  display: table;
  width: 100%;
}
.citrus .steps-horizontal li {
  display: table-cell;
}
.citrus .steps-horizontal li a {
  display: block;
}
.citrus .steps-horizontal .step {
  float: left;
  padding-right: 10px;
  list-style: none;
  width: 100%;
}
.citrus .steps-horizontal .step a {
  text-decoration: none;
  display: block;
}
.citrus .steps-horizontal .step:before {
  height: auto;
  width: 100%;
  margin-top: 18px;
  border: 0px;
  border-bottom: 1px dashed #cccccc;
  left: 5px;
}
.citrus .steps-horizontal .step span[class*='step-'] {
  margin-bottom: 5px;
  margin-left: 47px;
}
.citrus .steps-horizontal .step .step-title {
  margin-top: -1px;
  margin-right: 25px;
}
.citrus .steps-horizontal .step .step-message {
  top: auto;
  bottom: 15px;
  right: 10px;
}
.citrus .steps li.active a {
  background: #fff;
}
.citrus .steps li.active a:hover {
  background: #eaeaea;
}
.citrus .side-nav-toggle .step {
  padding-left: 0;
}
.citrus .side-nav-toggle .step:before {
  display: none;
}
.citrus .side-nav-toggle .step .emblem {
  display: none;
}
.citrus .side-nav-toggle .step span[class*='step-'] {
  margin-left: 0px;
}
.citrus [class^="col-"].padding-all.multi-step-content {
  padding-bottom: 67px;
}
.citrus .multi-step-actions {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  border-top: 1px solid #dadada;
}
@media screen and (min-width: 700px) {
  .citrus [class^="col-"].padding-all.multi-step-content {
    padding-bottom: 15px;
  }
  .citrus .multi-step-actions {
    position: static;
    width: 75%;
    background-color: transparent;
    border-top: 0px;
  }
  .citrus .step.step-complete .emblem {
    background: #fff;
  }
}
@media only screen and (min-width: 700px) and (max-width: 859px) {
  .citrus .steps li a {
    padding: 8px 0px;
    padding: 0.571rem 0rem;
  }
  .citrus .step {
    padding-left: 8px;
    padding-left: 0.571rem;
  }
  .citrus .step:before {
    left: 17.5px;
  }
  .citrus .step .step-message {
    top: 2px;
    right: 0px;
  }
  .citrus .step span[class*='step-'] {
    margin: 0px 15px 0px 30px;
    margin: 0rem 1.071rem 0rem 2.143rem;
    font-size: 12px;
    font-size: 0.857rem;
  }
}
@media screen and (min-width: 860px) {
  .citrus .steps li a {
    padding: 0px 0px 0px 15px;
    padding: 0rem 0rem 0rem 1.071rem;
  }
  .citrus .step {
    padding: 12px 25px 12px 0px;
    padding: 0.857rem 1.786rem 0.857rem 0rem;
  }
  .citrus .step:before {
    left: 18px;
  }
  .citrus .step span[class*='step-'] {
    margin: 0px 15px 0px 52px;
    margin: 0rem 1.071rem 0rem 3.714rem;
    font-size: 14px;
    font-size: 1rem;
  }
  .citrus .step .emblem {
    height: 36px;
    height: 2.571rem;
    width: 36px;
    width: 2.571rem;
    margin: 0 0 0 1px;
    margin: 0 0 0 0.071rem;
  }
  .citrus .step .emblem i {
    display: inline-block;
    margin: auto;
  }
  .citrus .step .emblem.complete {
    background: #fff;
  }
  .citrus .step .emblem.complete.active {
    background: #3dc270;
  }
  .citrus .step .emblem.complete.active i {
    color: #fff;
  }
  .citrus .step .emblem.size-large {
    margin: 0 0 0 -3.5px;
    margin: 0 0 0 -0.214rem;
    height: 44px;
    height: 3.143rem;
    width: 44px;
    width: 3.143rem;
  }
  .citrus .step .step-message {
    right: 0px;
    top: 17px;
  }
}
.citrus ul.list-items {
  margin: 0;
  padding: 0;
  list-style: none;
}
.citrus ul.list-items li {
  border-top: 1px solid #cccccc;
}
.citrus ul.list-items li:last-child {
  border-bottom: 1px solid #cccccc;
}
.citrus ul.list-items li > a,
.citrus ul.list-items li label {
  text-decoration: none;
  box-sizing: border-box;
  display: table;
  width: 100%;
  padding: 4px 7px 4px 15px;
  padding: 0.286rem 0.5rem 0.286rem 1.071rem;
}
.citrus ul.list-items li > a > div,
.citrus ul.list-items li label > div {
  display: table-cell;
  vertical-align: middle;
  box-sizing: border-box;
  padding-left: 8px;
}
.citrus ul.list-items li > a > div:first-child,
.citrus ul.list-items li label > div:first-child {
  padding-left: 0;
}
.citrus ul.list-items li > a > div.sizing-icon,
.citrus ul.list-items li label > div.sizing-icon {
  width: 24px;
  text-align: right;
}
.citrus ul.list-items li > a > div.sizing-input,
.citrus ul.list-items li label > div.sizing-input {
  width: 20px;
}
.citrus ul.list-items li > a > div.content,
.citrus ul.list-items li label > div.content {
  padding-right: 8px;
  padding-right: 0.571rem;
}
.citrus ul.list-items li > a > div.content span,
.citrus ul.list-items li label > div.content span {
  color: #666666;
  line-height: 16px;
  font-size: 14px;
  font-size: 1rem;
  display: block;
  overflow: hidden;
  white-space: nowrap;
}
.citrus ul.list-items li > a > div.content span:first-child,
.citrus ul.list-items li label > div.content span:first-child {
  font-weight: bold;
  color: #222222;
}
.citrus ul.list-items li > a:hover,
.citrus ul.list-items li label:hover {
  background-color: #eaeaea;
}
.citrus ul.list-items li > a.active,
.citrus ul.list-items li label.active,
.citrus ul.list-items li > a:active,
.citrus ul.list-items li label:active {
  background-color: #1588af;
  border-color: #1588af;
  color: #fff;
}
.citrus ul.list-items li > a.active .button.secondary.count.outline,
.citrus ul.list-items li label.active .button.secondary.count.outline,
.citrus ul.list-items li > a:active .button.secondary.count.outline,
.citrus ul.list-items li label:active .button.secondary.count.outline {
  background-color: #fff;
}
.citrus ul.list-items li > a.active:hover,
.citrus ul.list-items li label.active:hover,
.citrus ul.list-items li > a:active:hover,
.citrus ul.list-items li label:active:hover {
  background-color: #1588af;
}
.citrus ul.list-items li > a.active i,
.citrus ul.list-items li label.active i,
.citrus ul.list-items li > a:active i,
.citrus ul.list-items li label:active i {
  color: #fff;
}
.citrus ul.list-items li > a.active .content span,
.citrus ul.list-items li label.active .content span,
.citrus ul.list-items li > a:active .content span,
.citrus ul.list-items li label:active .content span {
  color: #fff;
}
.citrus ul.list-items li > a.active .content span:first-child,
.citrus ul.list-items li label.active .content span:first-child,
.citrus ul.list-items li > a:active .content span:first-child,
.citrus ul.list-items li label:active .content span:first-child {
  color: #fff;
}
.citrus ul.list-items li > a.checked,
.citrus ul.list-items li label.checked {
  position: relative;
}
.citrus ul.list-items li > a.checked:after,
.citrus ul.list-items li label.checked:after {
  background: #1588af;
  color: #fff;
  content: "\e693";
  font-family: 'PaylocityIcons';
  font-size: 22px;
  font-size: 1.571rem;
  height: 100%;
  line-height: 44px;
  padding: 0 15px;
  padding: 0 1.071rem;
  top: 0;
  position: absolute;
  right: 0;
}
.citrus ul.list-items li > .action-item {
  display: table;
  width: 100%;
  box-sizing: border-box;
  vertical-align: middle;
}
.citrus ul.list-items li > .action-item > a,
.citrus ul.list-items li > .action-item label,
.citrus ul.list-items li > .action-item .sizing-icon,
.citrus ul.list-items li > .action-item .sizing-input {
  text-decoration: none;
  display: table-cell;
  box-sizing: border-box;
  vertical-align: middle;
  padding: 4px 7px 4px 15px;
  padding: 0.286rem 0.5rem 0.286rem 1.071rem;
}
.citrus ul.list-items li > .action-item > a > div,
.citrus ul.list-items li > .action-item label > div,
.citrus ul.list-items li > .action-item .sizing-icon > div,
.citrus ul.list-items li > .action-item .sizing-input > div {
  display: table-cell;
  vertical-align: middle;
  padding-left: 8px;
  padding-left: 0.571rem;
}
.citrus ul.list-items li > .action-item > a > div.align-top,
.citrus ul.list-items li > .action-item label > div.align-top,
.citrus ul.list-items li > .action-item .sizing-icon > div.align-top,
.citrus ul.list-items li > .action-item .sizing-input > div.align-top {
  vertical-align: top;
}
.citrus ul.list-items li > .action-item > a > div:first-child,
.citrus ul.list-items li > .action-item label > div:first-child,
.citrus ul.list-items li > .action-item .sizing-icon > div:first-child,
.citrus ul.list-items li > .action-item .sizing-input > div:first-child {
  padding-left: 0;
}
.citrus ul.list-items li > .action-item > a > div.sizing-button,
.citrus ul.list-items li > .action-item label > div.sizing-button,
.citrus ul.list-items li > .action-item .sizing-icon > div.sizing-button,
.citrus ul.list-items li > .action-item .sizing-input > div.sizing-button {
  padding-right: 8px;
  padding-right: 0.571rem;
}
.citrus ul.list-items li > .action-item > a > div.sizing-icon,
.citrus ul.list-items li > .action-item label > div.sizing-icon,
.citrus ul.list-items li > .action-item .sizing-icon > div.sizing-icon,
.citrus ul.list-items li > .action-item .sizing-input > div.sizing-icon {
  width: 24px;
  text-align: right;
}
.citrus ul.list-items li > .action-item > a > div.sizing-input,
.citrus ul.list-items li > .action-item label > div.sizing-input,
.citrus ul.list-items li > .action-item .sizing-icon > div.sizing-input,
.citrus ul.list-items li > .action-item .sizing-input > div.sizing-input {
  width: 20px;
}
.citrus ul.list-items li > .action-item > a > div.content,
.citrus ul.list-items li > .action-item label > div.content,
.citrus ul.list-items li > .action-item .sizing-icon > div.content,
.citrus ul.list-items li > .action-item .sizing-input > div.content {
  padding-right: 8px;
  padding-right: 0.571rem;
}
.citrus ul.list-items li > .action-item > a > div.content span,
.citrus ul.list-items li > .action-item label > div.content span,
.citrus ul.list-items li > .action-item .sizing-icon > div.content span,
.citrus ul.list-items li > .action-item .sizing-input > div.content span {
  color: #666666;
  line-height: 16px;
  font-size: 14px;
  font-size: 1rem;
  display: block;
  overflow: hidden;
  white-space: nowrap;
}
.citrus ul.list-items li > .action-item > a > div.content span:first-child,
.citrus ul.list-items li > .action-item label > div.content span:first-child,
.citrus ul.list-items li > .action-item .sizing-icon > div.content span:first-child,
.citrus ul.list-items li > .action-item .sizing-input > div.content span:first-child {
  font-weight: bold;
  color: #222222;
}
.citrus ul.list-items li > .action-item > div {
  display: table-cell;
  vertical-align: middle;
  padding-left: 8px;
  padding-left: 0.571rem;
}
.citrus ul.list-items li > .action-item > div.align-top {
  vertical-align: top;
}
.citrus ul.list-items li > .action-item > div:first-child {
  padding-left: 0;
}
.citrus ul.list-items li > .action-item > div.sizing-button {
  padding-right: 8px;
  padding-right: 0.571rem;
}
.citrus ul.list-items li > .action-item > div.sizing-icon {
  width: 24px;
  text-align: right;
}
.citrus ul.list-items li > .action-item > div.sizing-input {
  width: 20px;
}
.citrus ul.list-items li > .action-item > div.content {
  padding-right: 8px;
  padding-right: 0.571rem;
}
.citrus ul.list-items li > .action-item > div.content span {
  color: #666666;
  line-height: 16px;
  font-size: 14px;
  font-size: 1rem;
  display: block;
  overflow: hidden;
  white-space: nowrap;
}
.citrus ul.list-items li > .action-item > div.content span:first-child {
  font-weight: bold;
  color: #222222;
}
.citrus ul.list-items li > .action-item:hover {
  background-color: #eaeaea;
}
.citrus ul.list-items li > .action-item.active,
.citrus ul.list-items li > .action-item:active {
  background-color: #1588af;
  border-color: #1588af;
  color: #fff;
}
.citrus ul.list-items li > .action-item.active .button.secondary.count.outline,
.citrus ul.list-items li > .action-item:active .button.secondary.count.outline {
  background-color: #fff;
}
.citrus ul.list-items li > .action-item.active:hover,
.citrus ul.list-items li > .action-item:active:hover {
  background-color: #1588af;
}
.citrus ul.list-items li > .action-item.active i,
.citrus ul.list-items li > .action-item:active i {
  color: #fff;
}
.citrus ul.list-items li > .action-item.active .content span,
.citrus ul.list-items li > .action-item:active .content span {
  color: #fff;
}
.citrus ul.list-items li > .action-item.active .content span:first-child,
.citrus ul.list-items li > .action-item:active .content span:first-child {
  color: #fff;
}
.citrus ul.list-items li.border-none {
  border: 0;
}
.citrus ul.list-items li.border-top-none {
  border-top: 0;
}
.citrus ul.list-items li.border-bottom-none {
  border-bottom: 0;
}
.citrus ul.list-items.size-small li div.action-item {
  height: 36px;
  height: 2.571rem;
  min-height: 36px;
  min-height: 2.571rem;
}
.citrus ul.list-items.size-small li div.action-item > a,
.citrus ul.list-items.size-small li div.action-item label {
  height: 36px;
  height: 2.571rem;
  min-height: 36px;
  min-height: 2.571rem;
}
.citrus ul.list-items.size-small li div.action-item > a .sizing-portrait,
.citrus ul.list-items.size-small li div.action-item label .sizing-portrait {
  width: 28px;
}
.citrus ul.list-items.size-small li > a,
.citrus ul.list-items.size-small li label {
  height: 36px;
  height: 2.571rem;
  min-height: 36px;
  min-height: 2.571rem;
}
.citrus ul.list-items.size-small li > a .sizing-portrait,
.citrus ul.list-items.size-small li label .sizing-portrait {
  width: 28px;
}
.citrus ul.list-items.size-medium li div.action-item {
  height: 44px;
  height: 3.143rem;
  min-height: 44px;
  min-height: 3.143rem;
}
.citrus ul.list-items.size-medium li div.action-item > a,
.citrus ul.list-items.size-medium li div.action-item label {
  height: 44px;
  height: 3.143rem;
  min-height: 44px;
  min-height: 3.143rem;
}
.citrus ul.list-items.size-medium li div.action-item > a .sizing-portrait,
.citrus ul.list-items.size-medium li div.action-item label .sizing-portrait {
  width: 35px;
}
.citrus ul.list-items.size-medium li > a,
.citrus ul.list-items.size-medium li label {
  height: 44px;
  height: 3.143rem;
  min-height: 44px;
  min-height: 3.143rem;
}
.citrus ul.list-items.size-medium li > a .sizing-portrait,
.citrus ul.list-items.size-medium li label .sizing-portrait {
  width: 35px;
}
.citrus ul.list-items.size-large li div.action-item {
  height: 60px;
  height: 4.286rem;
  min-height: 60px;
  min-height: 4.286rem;
}
.citrus ul.list-items.size-large li div.action-item > a,
.citrus ul.list-items.size-large li div.action-item label {
  height: 60px;
  height: 4.286rem;
  min-height: 60px;
  min-height: 4.286rem;
}
.citrus ul.list-items.size-large li div.action-item > a .sizing-portrait,
.citrus ul.list-items.size-large li div.action-item label .sizing-portrait {
  width: 44px;
}
.citrus ul.list-items.size-large li > a,
.citrus ul.list-items.size-large li label {
  height: 60px;
  height: 4.286rem;
  min-height: 60px;
  min-height: 4.286rem;
}
.citrus ul.list-items.size-large li > a .sizing-portrait,
.citrus ul.list-items.size-large li label .sizing-portrait {
  width: 44px;
}
.citrus ul.list-items.threaded li {
  position: relative;
}
.citrus ul.list-items.threaded li:before {
  content: '';
  position: absolute;
  z-index: 0;
  width: 1px;
  left: 35px;
  top: 15px;
  border-left: 1px solid #cccccc;
  height: 100%;
}
.citrus ul.list-items.threaded li:last-child:before {
  display: none;
}
.citrus ul.list-items.threaded .sizing-portrait {
  text-align: center;
}
.citrus ul.list-items.threaded .emblem {
  position: relative;
  z-index: 1;
  background: #fff;
}
.citrus ul.list-items.threaded .emblem.active {
  background: #1588af;
}
.citrus ul.list-items.threaded .emblem.complete.active {
  background: #3dc270;
}
.citrus ul.list-items.threaded .sizing-icon i {
  color: #1588af;
}
.citrus ul.list-items.threaded li a div.content span {
  color: #1588af;
  white-space: normal;
}
.citrus ul.list-items.threaded li a div.content span:first-child {
  color: #1588af;
}
.citrus ul.list-items.threaded li.complete a div.content span {
  color: #3dc270;
}
.citrus ul.list-items.threaded li.complete a div.content span:first-child {
  color: #3dc270;
}
.citrus ul.list-items.threaded li.overdue a div.content span:last-child {
  color: #c8102e;
}
.citrus ul.list-items.threaded li.overdue .sizing-icon i {
  color: #c8102e;
}
.citrus ul.list-items.threaded li.disabled a div.content span {
  color: #cccccc;
}
.citrus ul.list-items.threaded li.disabled .sizing-icon i {
  color: #cccccc;
}
.citrus ul.list-items.threaded li.disabled-alternate a div.content span {
  color: #1588af;
}
.citrus ul.list-items.threaded li.disabled-alternate .sizing-icon i {
  color: #1588af;
}
.citrus ul.list-items.no-hover > li > .action-item:hover {
  background-color: inherit;
}
.citrus ul.list-group {
  margin: 0;
  line-height: 1.6;
  list-style: none;
  padding: 0 0 0 30px;
  padding: 0 0 0 2.143rem;
  position: relative;
}
.citrus ul.list-group.margin-top {
  margin-top: 15px;
  margin-top: 1.071rem;
}
.citrus ul.list-group.margin-bottom {
  margin-bottom: 15px;
  margin-bottom: 1.071rem;
}
.citrus ul.list-group i.group-icon {
  left: 0;
  position: absolute;
  top: 2px;
}
.citrus ul.list-group li a {
  text-decoration: none;
}
.employee-view {
  text-align: center;
}
.employee-view.employee-view-list {
  text-align: left;
}
.employee-view.employee-view-list .button.icon {
  display: inline-block;
  margin-left: -7px;
  margin-right: 8px;
  vertical-align: middle;
}
@media only screen and (max-width: 699px) {
  .employee-view.employee-view-list .button.icon {
    margin-right: 0;
  }
}
.employee-view.employee-view-list .portrait {
  display: inline-block;
  float: none;
  vertical-align: middle;
}
.employee-view.employee-view-list .text-group {
  display: inline-block;
  max-width: 75%;
  vertical-align: middle;
}
@media only screen and (max-width: 699px) {
  .employee-view.employee-view-list .text-group {
    max-width: 65%;
  }
}
.employee-view.employee-view-list h3,
.employee-view.employee-view-list .h3 {
  line-height: 1.3;
  padding-left: 15px;
  text-indent: -15px;
}
@media only screen and (max-width: 699px) {
  .employee-view.employee-view-list h3,
  .employee-view.employee-view-list .h3 {
    font-size: 14px;
    font-size: 1rem;
  }
}
.employee-view.employee-view-list .offset {
  display: block;
  padding-left: 15px;
}
.employee-view .h2 {
  display: block;
}
.employee-view .list li {
  border: 0px;
  padding: 3px 0px;
  padding: 0.214rem 0rem;
}
.employee-view .list-horizontal {
  margin: 9px 0 3px 0;
  margin: 0.643rem 0 0.214rem 0;
}
.employee-view .list-horizontal li a {
  display: inline-block;
}
@media screen and (min-width: 700px) {
  .employee-view {
    text-align: left;
  }
  .employee-view .portrait {
    float: left;
  }
  .employee-view .h2 {
    display: inline-block;
  }
  .employee-view .list {
    margin-left: 55px;
  }
}
.pdf-styles {
  padding: 20px;
  background: #fff !important;
}
.pdf-styles.padding-none {
  padding: 0px;
  padding: 0rem;
}
.pdf-styles .table tbody tr:nth-child(even) {
  background: #eaeaea;
}
.citrus .status-label {
  font-size: 12px;
  font-size: 0.857rem;
  border-radius: 2px;
  padding: 4px 4px 5px 4px;
  padding: 0.286rem 0.286rem 0.357rem 0.286rem;
  box-sizing: border-box;
  line-height: 1;
  font-weight: normal;
  display: inline-block;
  vertical-align: middle;
  background: #666666;
  color: #fff;
}
.citrus .status-label.positive {
  background: #3dc270;
}
.citrus .status-label.negative {
  background: #c8102e;
}
.citrus .status-label.warning {
  background: #ff8800;
}
.citrus .status-label.pending {
  background: #ffd70b;
  color: #222222;
}
.citrus .status-label.info {
  background: #41a8d2;
}
.citrus .status-label.right {
  float: right;
}
.citrus .status-label.margin-right {
  margin-right: 15px;
  margin-right: 1.071rem;
}
.citrus .status-label.margin-compact-right {
  margin-right: 8px;
  margin-right: 0.571rem;
}
.citrus .status-label.margin-left {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus .status-label.margin-compact-left {
  margin-left: 8px;
  margin-left: 0.571rem;
}
.citrus .status-label.margin-compact-top {
  margin-top: 8px;
  margin-top: 0.571rem;
}
.citrus .status-label + .button {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus .button + .status-label {
  margin-left: 15px;
  margin-left: 1.071rem;
}
.citrus .status-label-list .status-label {
  margin: 2px 4px 2px 0;
  margin: 0.143rem 0.286rem 0.143rem 0;
}
.citrus .signature-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.citrus .signature-wrapper .signature-messaging {
  position: absolute;
  bottom: 4px;
  left: 0;
  color: #a6a6a6;
}
.citrus .signature-wrapper canvas {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.02) inset;
}
/*# sourceMappingURL=citrus.core.css.map */
/*
 * @version 2.3.0
 * @repo https://code.paylocity.com/projects/CIT/repos/citrus/browse?at=refs%2Fheads%2Fmaster
 * @contact ui/ux team at Paylocity via citrusfeedback@paylocity.com or through slack
 */
.icon-bold,.icon-font{font-family:PaylocityIcons-Bold}.icon-font{speak:none;font-style:normal;font-size:16px;font-size:1.143rem;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-bold{font-weight:600}.citrus .toast-message,.citrus.toast-message{padding:.571rem .571rem .571rem 1.143rem;left:50%;transform:translate(-50%,0);position:fixed;bottom:8px;max-width:600px;overflow:hidden;box-sizing:border-box;transition:.3s;max-height:400px;z-index:1200;box-shadow:0 1px 2px 0 rgba(0,0,0,.25);border-radius:4px}.citrus .toast-message:after,.citrus .toast-message:before,.citrus.toast-message:after,.citrus.toast-message:before{content:" ";display:table}.citrus .toast-message:after,.citrus.toast-message:after{clear:both}.citrus .toast-message.hidden-animated,.citrus.toast-message.hidden-animated{overflow:hidden;max-height:0;bottom:-500px;padding:0!important}.citrus .toast-message .close-button,.citrus.toast-message .close-button{margin-left:8px}.citrus .toast-message a,.citrus.toast-message a{color:#fff}.citrus .toast-message.information,.citrus.toast-message.information{color:#fff;background:#41a8d2}.citrus .toast-message.success,.citrus.toast-message.success{color:#fff;background:#3dc270}.citrus .toast-message.warning,.citrus.toast-message.warning{color:#fff;background:#ff8800}.citrus .toast-message.error,.citrus.toast-message.error{color:#fff;background:#c8102e}.citrus .toast-message p,.citrus.toast-message p{display:table-cell;padding:.286rem 0}@media only screen and (max-width:699px){.citrus .toast-message,.citrus.toast-message{width:100%;bottom:0;left:0;transform:none;border-radius:0;max-width:inherit}}