html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
:focus {
  outline: 0;
}
* {
  -webkit-box-sizing: border-box;
  -khtml-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
img {
  width: 100%;
  height: auto;
  display: block;
}
a {
  text-decoration: none;
}
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-thumb {
  background: rgba(50, 50, 50, 0.3);
}
::-webkit-scrollbar-track {
  background-color: transparent;
}
:root {
  --primary: #158039;
  --primary: #388d54;
  --primary-text: #ffffff;
  --primary-color: #388d54;
  --padding: 16px;
  --font-size: 14px;
  --input-height: 36px;
  --input-radius: 2px;
  --navigation-height: 36px;
  --white: #FFF;
  --themePrimary: #b71c1c;
  --themeLighterAlt: #fcf4f4;
  --themeLighter: #f4d2d2;
  --themeLight: #eaaeae;
  --themeTertiary: #d46868;
  --themeSecondary: #c03030;
  --themeDarkAlt: #a51919;
  --themeDark: #8c1515;
  --themeDarker: #670f0f;
  --neutralLighterAlt: #f8f8f8;
  --neutralLighter: #F5F5F5;
  --neutralLight: #eaeaea;
  --neutralQuaternaryAlt: #dadada;
  --neutralQuaternary: #d0d0d0;
  --neutralTertiaryAlt: #c8c8c8;
  --neutralTertiary: #b4b2b0;
  --neutralSecondary: #9b9997;
  --neutralPrimaryAlt: #83817e;
  --neutralPrimary: #201f1e;
  --neutralDark: #52504e;
  --cell-unit: 12px;
}
.theme--light {
  --primary-color: #21242E;
  --secondary-color: #939598;
  --active-color: #21242E;
  --primary-background: #FFF;
  --secondary-background: #F5F5F5;
  --subtle-background: #d5d8dd;
  --primary-border: #d5d8dd;
  --primary-header: #F0F6FB;
  --primary-active: #d5d8dd;
  --primary-hover: #f4f6f8;
  --primary-shadow: rgba(185, 190, 198, 0.35);
  --primary-disable: #d5d8dd;
  --input-background: #fcfcfd;
  --input-color: #21242E;
}
.theme-light {
  --primary-color: #21242E;
  --secondary-color: #838588;
  --active-color: #41444E;
  --primary-background: #F2F2F2;
  --secondary-background: #ffffff;
  --subtle-background: #d5d8dd;
  --primary-border: #d5d8dd;
  --primary-header: #F0F6FB;
  --primary-active: #d5d8dd;
  --primary-hover: #d5d8dd;
  --primary-shadow: #d5d8dd80;
  --primary-disable: #d5d8dd;
  --input-color: #03060b;
  --input-background: #fcfcfd;
  --button-background: #d5d8dd;
}
.theme-dark {
  --primary-color: #8f98a3;
  --secondary-color: #6d7478;
  --active-color: #DBDBDB;
  --primary-background: #1d2024;
  --secondary-background: #18191d;
  --subtle-background: #222930;
  --primary-border: #30373c;
  --primary-header: #23272b;
  --primary-active: #30373c;
  --primary-hover: #30373c;
  --primary-shadow: #30373c80;
  --primary-disable: #30373c;
  --input-color: #8f98a3;
  --input-background: #2a2b31;
  --button-background: #2a2b31;
}
/*!
 *  MDL2 Icons 1.0.0 by @sdorman
 */
/* FONT PATH
 * -------------------------- */
/* makes the font 33% larger relative to the icon container */
.mdl2-lg {
  font-size: 1.33333em;
  line-height: 0.75em;
  vertical-align: -15%;
}
.mdl2-2x {
  font-size: 2em;
}
.mdl2-3x {
  font-size: 3em;
}
.mdl2-4x {
  font-size: 4em;
}
.mdl2-5x {
  font-size: 5em;
}
.mdl2-6x {
  font-size: 6em;
}
.mdl2-fw {
  width: 1.28571em;
  text-align: center;
}
.mdl2-ul {
  padding-left: 0;
  margin-left: 2.14286em;
  list-style-type: none;
}
.mdl2-ul > li {
  position: relative;
}
.mdl2-li {
  position: absolute;
  left: -2.14286em;
  width: 2.14286em;
  top: 0.14286em;
  text-align: center;
}
.mdl2-li.mdl2-lg {
  left: -1.85714em;
}
.mdl2-border {
  padding: 0.2em 0.25em 0.15em;
  border: solid 0.08em #eee;
  border-radius: 0.1em;
}
.mdl2-pull-left {
  float: left;
}
.mdl2-pull-right {
  float: right;
}
.mdl2.mdl2-pull-left {
  margin-right: 0.3em;
}
.mdl2.mdl2-pull-right {
  margin-left: 0.3em;
}
.mdl2.pull-left {
  margin-right: 0.3em;
}
.mdl2.pull-right {
  margin-left: 0.3em;
}
.mdl2-spin {
  -webkit-animation: mdl2-spin 2s infinite linear;
  -moz-animation: mdl2-spin 2s infinite linear;
  -o-animation: mdl2-spin 2s infinite linear;
  animation: mdl2-spin 2s infinite linear;
}
.mdl2-pulse {
  -webkit-animation: mdl2-spin 1s infinite steps(8);
  -moz-animation: mdl2-spin 1s infinite steps(8);
  -o-animation: mdl2-spin 1s infinite steps(8);
  animation: mdl2-spin 1s infinite steps(8);
}
@-webkit-keyframes mdl2-spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-moz-keyframes mdl2-spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-o-keyframes mdl2-spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes mdl2-spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
.mdl2-rotate-90 {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
.mdl2-rotate-180 {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.mdl2-rotate-270 {
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}
.mdl2-flip-horizontal {
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.mdl2-flip-vertical {
  -webkit-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  transform: scale(1, -1);
}
:root .mdl2-rotate-90,
:root .mdl2-rotate-180,
:root .mdl2-rotate-270,
:root .mdl2-flip-horizontal,
:root .mdl2-flip-vertical {
  filter: none;
}
.mdl2-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}
.mdl2-stack-1x,
.mdl2-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}
.mdl2-stack-1x {
  line-height: inherit;
}
.mdl2-stack-2x {
  font-size: 2em;
}
.mdl2-inverse {
  color: #fff;
}
.mdl2-accept:before {
  content: "\e8fb";
}
.mdl2-accounts:before {
  content: "\e910";
}
.mdl2-add:before {
  content: "\e710";
}
.mdl2-add-friend:before {
  content: "\e8fa";
}
.mdl2-admin:before {
  content: "\e7ef";
}
.mdl2-align-center:before {
  content: "\e8e3";
}
.mdl2-align-left:before {
  content: "\e8e4";
}
.mdl2-align-right:before {
  content: "\e8e2";
}
.mdl2-all-apps:before {
  content: "\e71d";
}
.mdl2-arrow-html-legacy:before {
  content: "\e0d5";
}
.mdl2-arrow-html-mirrored-legacy:before {
  content: "\e0ae";
}
.mdl2-attach:before {
  content: "\e723";
}
.mdl2-paperclip:before {
  content: "\e723";
}
.mdl2-attach-camera:before {
  content: "\e8a2";
}
.mdl2-audio:before {
  content: "\e8d6";
}
.mdl2-back:before {
  content: "\e72b";
}
.mdl2-back-bttn-arrow-20-legacy:before {
  content: "\e0c4";
}
.mdl2-back-bttn-arrow-42-legacy:before {
  content: "\e0a6";
}
.mdl2-back-bttn-mirrored-arrow-20-legacy:before {
  content: "\e0ad";
}
.mdl2-back-bttn-mirrored-arrow-42-legacy:before {
  content: "\e0ab";
}
.mdl2-back-to-window:before {
  content: "\e73f";
}
.mdl2-battery-0:before {
  content: "\e850";
}
.mdl2-battery-1:before {
  content: "\e851";
}
.mdl2-battery-10:before {
  content: "\e83f";
}
.mdl2-battery-2:before {
  content: "\e852";
}
.mdl2-battery-3:before {
  content: "\e853";
}
.mdl2-battery-4:before {
  content: "\e854";
}
.mdl2-battery-5:before {
  content: "\e855";
}
.mdl2-battery-6:before {
  content: "\e856";
}
.mdl2-battery-7:before {
  content: "\e857";
}
.mdl2-battery-8:before {
  content: "\e858";
}
.mdl2-battery-9:before {
  content: "\e859";
}
.mdl2-battery-charging-0:before {
  content: "\e85a";
}
.mdl2-battery-charging-1:before {
  content: "\e85b";
}
.mdl2-battery-charging-10:before {
  content: "\ea93";
}
.mdl2-battery-charging-2:before {
  content: "\e85c";
}
.mdl2-battery-charging-3:before {
  content: "\e85d";
}
.mdl2-battery-charging-4:before {
  content: "\e85e";
}
.mdl2-battery-charging-5:before {
  content: "\e85f";
}
.mdl2-battery-charging-6:before {
  content: "\e860";
}
.mdl2-battery-charging-7:before {
  content: "\e861";
}
.mdl2-battery-charging-8:before {
  content: "\e862";
}
.mdl2-battery-charging-9:before {
  content: "\e83e";
}
.mdl2-battery-saver-0:before {
  content: "\e863";
}
.mdl2-battery-saver-1:before {
  content: "\e864";
}
.mdl2-battery-saver-10:before {
  content: "\ea95";
}
.mdl2-battery-saver-2:before {
  content: "\e865";
}
.mdl2-battery-saver-3:before {
  content: "\e866";
}
.mdl2-battery-saver-4:before {
  content: "\e867";
}
.mdl2-battery-saver-5:before {
  content: "\e868";
}
.mdl2-battery-saver-6:before {
  content: "\e869";
}
.mdl2-battery-saver-7:before {
  content: "\e86a";
}
.mdl2-battery-saver-8:before {
  content: "\e86b";
}
.mdl2-battery-saver-9:before {
  content: "\ea94";
}
.mdl2-battery-unknown:before {
  content: "\e996";
}
.mdl2-block-contact:before {
  content: "\e8f8";
}
.mdl2-blocked-legacy:before {
  content: "\e25b";
}
.mdl2-bold:before {
  content: "\e8dd";
}
.mdl2-bookmarks:before {
  content: "\e8a4";
}
.mdl2-browse-photos:before {
  content: "\e7c5";
}
.mdl2-bulleted-list:before {
  content: "\e8fd";
}
.mdl2-calculator:before {
  content: "\e8ef";
}
.mdl2-calendar:before {
  content: "\e787";
}
.mdl2-calendar-day:before {
  content: "\e8bf";
}
.mdl2-calendar-week:before {
  content: "\e8c0";
}
.mdl2-camera:before {
  content: "\e722";
}
.mdl2-cancel:before {
  content: "\e711";
}
.mdl2-caption:before {
  content: "\e8ba";
}
.mdl2-cc:before {
  content: "\e7f0";
}
.mdl2-cellphone:before {
  content: "\e8ea";
}
.mdl2-characters:before {
  content: "\e8c1";
}
.mdl2-checkbox:before {
  content: "\e739";
}
.mdl2-checkbox-composite:before {
  content: "\e73a";
}
.mdl2-checkbox-composite-legacy:before {
  content: "\e0a2";
}
.mdl2-checkbox-composite-reversed:before {
  content: "\e73d";
}
.mdl2-checkbox-composite-reversed-legacy:before {
  content: "\e005";
}
.mdl2-checkbox-fill:before {
  content: "\e73b";
}
.mdl2-checkbox-fill-legacy:before {
  content: "\e002";
}
.mdl2-checkbox-fill-zero-width-legacy:before {
  content: "\e009";
}
.mdl2-checkbox-indeterminate:before {
  content: "\e73c";
}
.mdl2-checkbox-indeterminate-legacy:before {
  content: "\e004";
}
.mdl2-checkbox-legacy:before {
  content: "\e003";
}
.mdl2-check-mark:before {
  content: "\e73e";
}
.mdl2-check-mark-legacy:before {
  content: "\e001";
}
.mdl2-check-mark-zero-width-legacy:before {
  content: "\e008";
}
.mdl2-chrome-back:before {
  content: "\e830";
}
.mdl2-chrome-back-mirrored:before {
  content: "\ea47";
}
.mdl2-clear:before {
  content: "\e894";
}
.mdl2-clear-selection:before {
  content: "\e8e6";
}
.mdl2-close-pane:before {
  content: "\e89f";
}
.mdl2-cloud:before {
  content: "\e753";
}
.mdl2-comment:before {
  content: "\e90a";
}
.mdl2-comment-legacy:before {
  content: "\e134";
}
.mdl2-contact:before {
  content: "\e77b";
}
.mdl2-contact-2:before {
  content: "\e8d4";
}
.mdl2-contact-info:before {
  content: "\e779";
}
.mdl2-contact-presence:before {
  content: "\e8cf";
}
.mdl2-copy:before {
  content: "\e8c8";
}
.mdl2-crop:before {
  content: "\e7a8";
}
.mdl2-cut:before {
  content: "\e8c6";
}
.mdl2-delete:before {
  content: "\e74d";
}
.mdl2-trash:before {
  content: "\e74d";
}
.mdl2-trashcan:before {
  content: "\e74d";
}
.mdl2-directions:before {
  content: "\e8f0";
}
.mdl2-disable-updates:before {
  content: "\e8d8";
}
.mdl2-disconnect-drive:before {
  content: "\e8cd";
}
.mdl2-dislike:before {
  content: "\e8e0";
}
.mdl2-dislike-legacy:before {
  content: "\e19e";
}
.mdl2-dock-bottom:before {
  content: "\e90e";
}
.mdl2-dock-left:before {
  content: "\e90c";
}
.mdl2-dock-right:before {
  content: "\e90d";
}
.mdl2-document:before {
  content: "\e8a5";
}
.mdl2-download:before {
  content: "\e896";
}
.mdl2-edit:before {
  content: "\e70f";
}
.mdl2-pencil:before {
  content: "\e70f";
}
.mdl2-emoji:before {
  content: "\e899";
}
.mdl2-emoji-2:before {
  content: "\e76e";
}
.mdl2-favorite-2-legacy:before {
  content: "\e249";
}
.mdl2-favorite-legacy:before {
  content: "\e113";
}
.mdl2-favorite-list:before {
  content: "\e728";
}
.mdl2-favorite-star:before {
  content: "\e734";
}
.mdl2-favorite-star-fill:before {
  content: "\e735";
}
.mdl2-filter:before {
  content: "\e71c";
}
.mdl2-find-legacy:before {
  content: "\e11a";
}
.mdl2-flag:before {
  content: "\e7c1";
}
.mdl2-folder:before {
  content: "\e8b7";
}
.mdl2-font:before {
  content: "\e8d2";
}
.mdl2-fontcolor:before {
  content: "\e8d3";
}
.mdl2-font-decrease:before {
  content: "\e8e7";
}
.mdl2-font-increase:before {
  content: "\e8e8";
}
.mdl2-font-size:before {
  content: "\e8e9";
}
.mdl2-forward:before {
  content: "\e72a";
}
.mdl2-four-bars:before {
  content: "\e908";
}
.mdl2-full-screen:before {
  content: "\e740";
}
.mdl2-globe:before {
  content: "\e774";
}
.mdl2-go:before {
  content: "\e8ad";
}
.mdl2-go-to-start:before {
  content: "\e8fc";
}
.mdl2-go-to-today:before {
  content: "\e8d1";
}
.mdl2-half-star-left:before {
  content: "\e7c6";
}
.mdl2-half-star-right:before {
  content: "\e7c7";
}
.mdl2-hangup:before {
  content: "\e778";
}
.mdl2-heart-broken-legacy:before {
  content: "\e007";
}
.mdl2-heart-broken-zero-width-legacy:before {
  content: "\e00c";
}
.mdl2-heart-fill-legacy:before {
  content: "\e0a5";
}
.mdl2-heart-fill-zero-width-legacy:before {
  content: "\e00b";
}
.mdl2-heart-legacy:before {
  content: "\e006";
}
.mdl2-help:before {
  content: "\e897";
}
.mdl2-hide-bcc:before {
  content: "\e8c5";
}
.mdl2-highlight:before {
  content: "\e7e6";
}
.mdl2-home:before {
  content: "\e80f";
}
.mdl2-import:before {
  content: "\e8b5";
}
.mdl2-import-all:before {
  content: "\e8b6";
}
.mdl2-important:before {
  content: "\e8c9";
}
.mdl2-italic:before {
  content: "\e8db";
}
.mdl2-keyboard-classic:before {
  content: "\e765";
}
.mdl2-leave-chat:before {
  content: "\e89b";
}
.mdl2-library:before {
  content: "\e8f1";
}
.mdl2-like:before {
  content: "\e8e1";
}
.mdl2-like-dislike:before {
  content: "\e8df";
}
.mdl2-like-dislike-legacy:before {
  content: "\e19d";
}
.mdl2-like-legacy:before {
  content: "\e19f";
}
.mdl2-link:before {
  content: "\e71b";
}
.mdl2-list:before {
  content: "\ea37";
}
.mdl2-location:before {
  content: "\e81d";
}
.mdl2-mail:before {
  content: "\e715";
}
.mdl2-mail-fill:before {
  content: "\e8a8";
}
.mdl2-mail-forward:before {
  content: "\e89c";
}
.mdl2-mail-message-legacy:before {
  content: "\e20b";
}
.mdl2-mail-reply:before {
  content: "\e8ca";
}
.mdl2-mail-reply-all:before {
  content: "\e8c2";
}
.mdl2-manage:before {
  content: "\e912";
}
.mdl2-map-drive:before {
  content: "\e8ce";
}
.mdl2-map-pin:before {
  content: "\e707";
}
.mdl2-map-layers:before {
  content: "\E81E";
}
.mdl2-memo:before {
  content: "\e77c";
}
.mdl2-voicemail:before {
  content: "\e77c";
}
.mdl2-message:before {
  content: "\e88d";
}
.mdl2-microphone:before {
  content: "\e720";
}
.mdl2-mob-battery-0:before {
  content: "\eba0";
}
.mdl2-mob-battery-1:before {
  content: "\eba1";
}
.mdl2-mob-battery-10:before {
  content: "\ebaa";
}
.mdl2-mob-battery-2:before {
  content: "\eba2";
}
.mdl2-mob-battery-3:before {
  content: "\eba3";
}
.mdl2-mob-battery-4:before {
  content: "\eba4";
}
.mdl2-mob-battery-5:before {
  content: "\eba5";
}
.mdl2-mob-battery-6:before {
  content: "\eba6";
}
.mdl2-mob-battery-7:before {
  content: "\eba7";
}
.mdl2-mob-battery-8:before {
  content: "\eba8";
}
.mdl2-mob-battery-9:before {
  content: "\eba9";
}
.mdl2-mob-battery-chargin-10:before {
  content: "\ebb5";
}
.mdl2-mob-battery-charging-0:before {
  content: "\ebab";
}
.mdl2-mob-battery-charging-1:before {
  content: "\ebac";
}
.mdl2-mob-battery-charging-2:before {
  content: "\ebad";
}
.mdl2-mob-battery-charging-3:before {
  content: "\ebae";
}
.mdl2-mob-battery-charging-4:before {
  content: "\ebaf";
}
.mdl2-mob-battery-charging-5:before {
  content: "\ebb0";
}
.mdl2-mob-battery-charging-6:before {
  content: "\ebb1";
}
.mdl2-mob-battery-charging-7:before {
  content: "\ebb2";
}
.mdl2-mob-battery-charging-8:before {
  content: "\ebb3";
}
.mdl2-mob-battery-charging-9:before {
  content: "\ebb4";
}
.mdl2-mob-battery-saver-0:before {
  content: "\ebb6";
}
.mdl2-mob-battery-saver-1:before {
  content: "\ebb7";
}
.mdl2-mob-battery-saver-10:before {
  content: "\ebc0";
}
.mdl2-mob-battery-saver-2:before {
  content: "\ebb8";
}
.mdl2-mob-battery-saver-3:before {
  content: "\ebb9";
}
.mdl2-mob-battery-saver-4:before {
  content: "\ebba";
}
.mdl2-mob-battery-saver-5:before {
  content: "\ebbb";
}
.mdl2-mob-battery-saver-6:before {
  content: "\ebbc";
}
.mdl2-mob-battery-saver-7:before {
  content: "\ebbd";
}
.mdl2-mob-battery-saver-8:before {
  content: "\ebbe";
}
.mdl2-mob-battery-saver-9:before {
  content: "\ebbf";
}
.mdl2-mob-battery-unknown:before {
  content: "\ec02";
}
.mdl2-mobile-contact-legacy:before {
  content: "\e25a";
}
.mdl2-more:before {
  content: "\e712";
}
.mdl2-ellipse:before {
  content: "\e712";
}
.mdl2-menu:before {
  content: "\e712";
}
.mdl2-move-to-folder:before {
  content: "\e8de";
}
.mdl2-music-info:before {
  content: "\e90b";
}
.mdl2-mute:before {
  content: "\e74f";
}
.mdl2-new-folder:before {
  content: "\e8f4";
}
.mdl2-new-window:before {
  content: "\e78b";
}
.mdl2-next:before {
  content: "\e893";
}
.mdl2-one-bar:before {
  content: "\e905";
}
.mdl2-open-file:before {
  content: "\e8e5";
}
.mdl2-open-local:before {
  content: "\e8da";
}
.mdl2-folder-up:before {
  content: "\e8da";
}
.mdl2-open-pane:before {
  content: "\e8a0";
}
.mdl2-open-with:before {
  content: "\e7ac";
}
.mdl2-orientation:before {
  content: "\e8b4";
}
.mdl2-other-user:before {
  content: "\e7ee";
}
.mdl2-outline-star-legacy:before {
  content: "\e1ce";
}
.mdl2-page:before {
  content: "\e7c3";
}
.mdl2-paste:before {
  content: "\e77f";
}
.mdl2-pause:before {
  content: "\e769";
}
.mdl2-people:before {
  content: "\e716";
}
.mdl2-permissions:before {
  content: "\e8d7";
}
.mdl2-key:before {
  content: "\e8d7";
}
.mdl2-phone:before {
  content: "\e717";
}
.mdl2-phone-book:before {
  content: "\e780";
}
.mdl2-pin:before {
  content: "\e718";
}
.mdl2-play:before {
  content: "\e768";
}
.mdl2-post-update:before {
  content: "\e8f3";
}
.mdl2-presence-chicklet-legacy:before {
  content: "\e25e";
}
.mdl2-presence-chicklet-video-legacy:before {
  content: "\e25d";
}
.mdl2-preview:before {
  content: "\e8ff";
}
.mdl2-preview-link:before {
  content: "\e8a1";
}
.mdl2-previous:before {
  content: "\e892";
}
.mdl2-priority:before {
  content: "\e8d0";
}
.mdl2-protected-document:before {
  content: "\e8a6";
}
.mdl2-rating-star-fill-legacy:before {
  content: "\e0b4";
}
.mdl2-rating-star-fill-reduced-padding-html-legacy:before {
  content: "\e082";
}
.mdl2-rating-star-fill-small-legacy:before {
  content: "\e0b5";
}
.mdl2-rating-star-fill-zero-width-legacy:before {
  content: "\e00a";
}
.mdl2-rating-star-legacy:before {
  content: "\e224";
}
.mdl2-read:before {
  content: "\e8c3";
}
.mdl2-redo:before {
  content: "\e7a6";
}
.mdl2-refresh:before {
  content: "\e72c";
}
.mdl2-reload:before {
  content: "\e72c";
}
.mdl2-remote:before {
  content: "\e8af";
}
.mdl2-remove:before {
  content: "\e738";
}
.mdl2-rename:before {
  content: "\e8ac";
}
.mdl2-repair:before {
  content: "\e90f";
}
.mdl2-wrench:before {
  content: "\e90f";
}
.mdl2-repeat-all:before {
  content: "\e8ee";
}
.mdl2-repeat-one:before {
  content: "\e8ed";
}
.mdl2-reply-legacy:before {
  content: "\e248";
}
.mdl2-report-hacked:before {
  content: "\e730";
}
.mdl2-reshare:before {
  content: "\e8eb";
}
.mdl2-retweet:before {
  content: "\e8eb";
}
.mdl2-rotate:before {
  content: "\e7ad";
}
.mdl2-rotate-camera:before {
  content: "\e89e";
}
.mdl2-save:before {
  content: "\e74e";
}
.mdl2-save-local:before {
  content: "\e78c";
}
.mdl2-scan:before {
  content: "\e8fe";
}
.mdl2-scroll-chevron-down-bold-legacy:before {
  content: "\e019";
}
.mdl2-scroll-chevron-down-legacy:before {
  content: "\e011";
}
.mdl2-scroll-chevron-left-bold-legacy:before {
  content: "\e016";
}
.mdl2-scroll-chevron-left-legacy:before {
  content: "\e00e";
}
.mdl2-scroll-chevron-right-bold-legacy:before {
  content: "\e017";
}
.mdl2-scroll-chevron-right-legacy:before {
  content: "\e00f";
}
.mdl2-scroll-chevron-up-bold-legacy:before {
  content: "\e018";
}
.mdl2-scroll-chevron-up-legacy:before {
  content: "\e010";
}
.mdl2-select-all:before {
  content: "\e8b3";
}
.mdl2-send:before {
  content: "\e724";
}
.mdl2-set-lock-screen:before {
  content: "\e7b5";
}
.mdl2-set-tile:before {
  content: "\e97b";
}
.mdl2-settings:before {
  content: "\e713";
}
.mdl2-cog:before {
  content: "\e713";
}
.mdl2-gear:before {
  content: "\e713";
}
.mdl2-share:before {
  content: "\e72d";
}
.mdl2-shop:before {
  content: "\e719";
}
.mdl2-bag:before {
  content: "\e719";
}
.mdl2-show-bcc:before {
  content: "\e8c4";
}
.mdl2-show-results:before {
  content: "\e8bc";
}
.mdl2-shuffle:before {
  content: "\e8b1";
}
.mdl2-slideshow:before {
  content: "\e786";
}
.mdl2-solid-star-legacy:before {
  content: "\e1cf";
}
.mdl2-sort:before {
  content: "\e8cb";
}
.mdl2-stop:before {
  content: "\e71a";
}
.mdl2-street:before {
  content: "\e913";
}
.mdl2-switch:before {
  content: "\e8ab";
}
.mdl2-switch-apps:before {
  content: "\e8f9";
}
.mdl2-sync:before {
  content: "\e895";
}
.mdl2-sync-folder:before {
  content: "\e8f7";
}
.mdl2-tag:before {
  content: "\e8ec";
}
.mdl2-three-bars:before {
  content: "\e907";
}
.mdl2-touch-pointer:before {
  content: "\e7c9";
}
.mdl2-trim:before {
  content: "\e78a";
}
.mdl2-two-bars:before {
  content: "\e906";
}
.mdl2-two-page:before {
  content: "\e89a";
}
.mdl2-typing-indicator-legacy:before {
  content: "\e25c";
}
.mdl2-underline:before {
  content: "\e8dc";
}
.mdl2-undo:before {
  content: "\e7a7";
}
.mdl2-unfavorite:before {
  content: "\e8d9";
}
.mdl2-unfavorite-2-legacy:before {
  content: "\e24e";
}
.mdl2-unfavorite-legacy:before {
  content: "\e195";
}
.mdl2-un-pin:before {
  content: "\e77a";
}
.mdl2-un-sync-folder:before {
  content: "\e8f6";
}
.mdl2-up:before {
  content: "\e74a";
}
.mdl2-down:before {
  content: "\e74b";
}
.mdl2-upload:before {
  content: "\e898";
}
.mdl2-video:before {
  content: "\e714";
}
.mdl2-video-chat:before {
  content: "\e8aa";
}
.mdl2-video-legacy:before {
  content: "\e116";
}
.mdl2-view:before {
  content: "\e890";
}
.mdl2-view-all:before {
  content: "\e8a9";
}
.mdl2-volume:before {
  content: "\e767";
}
.mdl2-webcam:before {
  content: "\e8b8";
}
.mdl2-world:before {
  content: "\e909";
}
.mdl2-zero-bars:before {
  content: "\e904";
}
.mdl2-zoom:before {
  content: "\e71e";
}
.mdl2-zoom-in:before {
  content: "\e8a3";
}
.mdl2-zoom-out:before {
  content: "\e71f";
}
.mdl2-export:before {
  content: "\ede1";
}
.mdl2-report-document:before {
  content: "\e9f9";
}
.mdl2-shopping-cart:before {
  content: "\e7bf";
}
.mdl2-search:before {
  content: "\e721";
}
.mdl2-horizontal-tab-key:before {
  content: "\e7fd";
}
.mdl2-chevron-left:before {
  content: "\e76b";
}
.mdl2-chevron-right:before {
  content: "\e76c";
}
.mdl2-chevron-down:before {
  content: "\e70d";
}
.mdl2-chevron-up:before {
  content: "\e70e";
}
.mdl2-personalize:before {
  content: "\e771";
}
.mdl2-add-surface-hub:before {
  content: "\ecc4";
}
.mdl2-puzzle:before {
  content: "\ea86";
}
.mdl2-connect:before {
  content: "\e703";
}
.mdl2-photo2:before {
  content: "\eb9f";
}
.mdl2-payment-card:before {
  content: "\e8c7";
}
.mdl2-view-dashboard:before {
  content: "\F246";
}
.mdl2-oem:before {
  content: "\E74C";
}
.mdl2-this-pc:before {
  content: "\EC4E";
}
.mdl2-app-icon-default:before {
  content: "\ECAA";
}
.mdl2-power-button:before {
  content: "\E7E8";
}
.mdl2-speakers:before {
  content: "\E7F5";
}
.mdl2-education:before {
  content: "\E7BE";
}
.mdl2-print:before {
  content: "\E749";
}
.mdl2-radio-btn-on:before {
  content: "\ECCB";
}
.mdl2-radio-btn-off:before {
  content: "\ECCA";
}
.mdl2-end-point:before {
  content: "\E81B";
}
.mdl2-devices2:before {
  content: "\E975";
}
.mdl2-equalizer:before {
  content: "\E9E9";
}
.mdl2-wind-direction:before {
  content: "\EBE6";
}
.mdl2-open-in-new-window:before {
  content: "\E8A7";
}
.mdl2-emoji-swatch:before {
  content: "\ED5B";
}
.mdl2-emoji-tab-favorites:before {
  content: "\ED5A";
}
.mdl2-group:before {
  content: "\E902";
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}
@font-face {
  font-family: 'Calibri';
  src: url(570b51dc5c610cbdb445d1b3f74afd16.woff2) format('woff2'), url(1c486a3a620bd493e077e6a973d2c0c9.woff) format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Calibri';
  src: url(03aead310a209944ea7656c9c16d586f.woff2) format('woff2'), url(8a6318c7177db350bb2ee03e66d31b23.woff) format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Calibri';
  src: url(29ec323a22143e59be6b01876ebd90bd.woff2) format('woff2'), url(80bc336d2ffd157e88170c47b2d93927.woff) format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Calibri';
  src: url(1d0ed55402c3e18aa3886595db02a48e.woff2) format('woff2'), url(2fa92715449567a87646dc8cb028caa2.woff) format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Calibri';
  src: url(b370e4ed41830144ad1f9a9e5c18af1d.woff2) format('woff2'), url(1393f05f3c7920a63509f40aea68ccde.woff) format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Calibri';
  src: url(9e44ba165a7dcfa21ac47a5308fec2dd.woff2) format('woff2'), url(3ef83175ffa4d2c5295a82c2b34c400b.woff) format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Segoe MDL2 Assets';
  src: url(df7c201e9bd126c30ebd00b05d859bc2.woff2);
  src: url(657480d2f5f0efbcf693c6f4e89a78fe.woff) format('woff');
  font-weight: normal;
  font-style: normal;
}
[class^="mdl2-"],
[class*="mdl2-"] {
  font-family: 'Segoe MDL2 Assets';
}
.ni,
.mdl2 {
  display: inline-block;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body {
  font-family: "Calibri", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: var(--font-size);
  font-style: normal;
  font-weight: 400;
  line-height: 1.46em;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  -webkit-text-decoration-skip: ink;
  text-decoration-skip: ink;
  color: var(--primary-color);
  background: var(--primary-background);
}
a,
a:visited {
  color: var(--primary-color);
}
h1 {
  font-size: 30px;
  font-weight: 700;
}
h2 {
  font-size: 24px;
  font-weight: 700;
}
h3 {
  font-size: 18px;
  font-weight: 700;
}
h4 {
  font-size: 13px;
  font-weight: 700;
}
.strong,
strong,
b {
  font-weight: 700;
}
.semi-bold {
  font-weight: 600;
}
html {
  width: 100%;
  height: 100%;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}
body {
  width: 100%;
  height: 100vh;
}
#app {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
#app-container3 {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
#app-container2 {
  display: block;
  height: 100vh;
  overflow: hidden;
}
#app-container2 .app-content {
  display: block;
  position: relative;
  overflow-y: auto;
  height: 100%;
}
#app-container2 .header-inner {
  position: fixed;
  top: 0;
  height: 60px;
  width: calc(100vw - 64px);
  padding: 0 16px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: 'place-a place-b place-c';
  align-items: center;
  grid-gap: 16px;
  background-color: var(--secondary-background);
  z-index: 100;
}
#app-container2 .header-inner .place {
  display: grid;
  grid-auto-flow: column;
  grid-gap: 16px;
}
#app-container2 .header-inner .place-a {
  grid-area: place-a;
}
#app-container2 .header-inner .place-b {
  grid-area: place-b;
}
#app-container2 .header-inner .place-c {
  grid-area: place-c;
  justify-items: end;
}
#app-container2 .header-inner .header_title {
  line-height: 60px;
}
#app-container2 .header-inner .header_title li {
  display: inline-block;
}
#app-container2 .header-inner .header_title .subtitle::before {
  content: "/";
  display: inline-block;
  padding: 0 6px 0 2px;
}
#app-navbar {
  display: grid;
  grid-template-rows: 1fr 64px;
  height: 100%;
  position: relative;
  background-color: var(--primary-background);
}
#app-navbar .logo {
  width: 36px;
  margin: 12px auto;
}
#app-navbar .app-navigation {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
#app-navbar .app-navigation .item {
  width: 64px;
  height: 56px;
  position: relative;
  display: inline-block;
  line-height: 56px;
  white-space: nowrap;
  text-align: center;
}
#app-navbar .app-navigation .item a {
  position: relative;
  display: inline-block;
  height: 56px;
  line-height: 56px;
  white-space: nowrap;
}
#app-navbar .app-navigation .item .icon {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin: 8px 12px;
  text-align: center;
  border-radius: 4px;
  font-size: 18px;
}
#app-navbar .app-navigation .item .label {
  position: absolute;
  left: 100%;
  top: 50%;
  display: inline-block;
  height: 26px;
  line-height: 26px;
  margin-top: -12px;
  background-color: var(--primary-active);
  padding: 0 8px;
  border-radius: 6px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
  -webkit-transform-origin: left center;
  transform-origin: left center;
  pointer-events: none;
  transition: opacity 0.2s, transform 0.2s, -webkit-transform 0.2s;
  z-index: 2;
}
#app-navbar .app-navigation .item .label:before {
  position: absolute;
  top: 50%;
  left: -4px;
  margin-top: -4px;
  content: "";
  display: inline-block;
  border-top: 4px solid transparent;
  border-right: 4px solid var(--primary-active);
  border-bottom: 4px solid transparent;
}
#app-navbar .app-navigation .item.active .icon {
  background-color: var(--primary-active);
  color: var(--primary);
}
#app-navbar .app-navigation .item:hover .icon {
  background-color: var(--primary-active);
}
#app-navbar .app-navigation .item:hover .label {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}
#app-navbar .app-setting .item {
  width: 64px;
  height: 64px;
  position: relative;
  display: inline-block;
  line-height: 64px;
  white-space: nowrap;
  text-align: center;
  font-size: 18px;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  #app-navbar {
    position: absolute;
    width: 0;
    display: none;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    transition: opacity 1s, transform 1s, -webkit-transform 1s;
  }
  #app-navbar.open {
    display: grid;
    width: 75%;
    z-index: 10;
  }
  #app-navbar .app-navigation .item {
    display: block;
    width: 100%;
    height: 48px;
  }
  #app-navbar .app-navigation .item a {
    display: grid;
    grid-template-columns: 64px 1fr;
    align-items: center;
  }
  #app-navbar .app-navigation .item a .label {
    position: relative;
    left: 0;
    opacity: 1;
    background: transparent;
    font-size: var(--font-size);
    top: auto;
    text-align: left;
    margin-top: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.navbar-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
  z-index: 5;
}
.navbar-overlay.open {
  display: block;
  background: #d8cece1a;
}
.app-toolbar {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: 'place-a place-b place-c';
  align-items: center;
  grid-gap: 16px;
}
.app-toolbar .item {
  display: grid;
  grid-auto-flow: column;
  grid-gap: 16px;
}
.app-toolbar .place-a,
.app-toolbar .item-a {
  grid-area: place-a;
}
.app-toolbar .place-b,
.app-toolbar .item-b {
  grid-area: place-b;
}
.app-toolbar .place-c,
.app-toolbar .item-c {
  grid-area: place-c;
  justify-items: end;
}
.view-toolbar {
  display: grid;
  grid-auto-flow: column;
  grid-gap: 16px;
  justify-items: start;
}
.view-toolbar.end {
  justify-items: end;
}
.view-toolbar.center {
  justify-items: center;
}
.menu-primary__menu {
  position: absolute;
  bottom: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
  pointer-events: none;
  -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
  transition: transform 0.2s, opacity 0.2s, -webkit-transform 0.2s;
}
.menu-user {
  position: relative;
  display: inline-block;
}
.menu-user .menu-item {
  position: relative;
  height: 100%;
  width: 100%;
  display: inline-block;
}
.menu-user:hover .menu-primary__menu {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
  pointer-events: auto;
  z-index: 20;
}
.menu-primary__user:hover {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
  pointer-events: auto;
}
.menu-container {
  width: 200px;
  background: var(--primary-background);
  padding: 16px 0;
  z-index: 10;
  border: 1px solid var(--primary-border);
  border-radius: var(--input-radius);
  -webkit-box-shadow: 4px 4px 5px 0px var(--primary-shadow);
  -moz-box-shadow: 4px 4px 5px 0px var(--primary-shadow);
  box-shadow: 4px 4px 5px 0px var(--primary-shadow);
}
#app-header {
  position: fixed;
  top: 0;
  height: 72px;
  width: calc(100vw - 64px);
  padding: 0 16px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: 'place-a place-b place-c';
  align-items: center;
  grid-gap: 16px;
  z-index: 1000;
  background-color: var(--secondary-background);
}
#app-header .place {
  display: grid;
  grid-auto-flow: column;
  grid-gap: 8px;
  align-items: center;
}
#app-header .place-a {
  grid-area: place-a;
}
#app-header .place-b {
  grid-area: place-b;
}
#app-header .place-c {
  grid-area: place-c;
  justify-items: end;
}
#app-header .app-title li {
  display: inline-block;
  font-size: 18px;
}
#app-header .app-title .title {
  font-weight: 600;
}
#app-header .app-title .subtitle::before {
  content: "/";
  display: inline-block;
  padding: 0 6px 0 2px;
}
#app-header .nav-toggle {
  display: none;
}
#app-header .nav-toggle .hamburger {
  width: 28px;
}
#app-header .nav-toggle .hamburger span {
  display: block;
  margin-bottom: 6px;
  background-color: white;
  width: 100%;
  height: 3px;
  border-radius: var(--input-radius);
  transition: all 0.5s ease;
}
@media screen and (max-width: 768px) {
  #app-header {
    width: 100%;
    grid-template-columns: auto auto;
    grid-template-areas: 'place-a place-c';
    background-color: var(--primary-background);
  }
  #app-header .nav-toggle {
    display: block;
  }
  #app-header .app-title .subtitle {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: calc(100vw - 76px);
  }
}
.app-container {
  display: grid;
  grid-template-columns: 64px 1fr;
  grid-template-rows: 1fr;
}
@media screen and (max-width: 768px) {
  .app-container {
    grid-template-columns: 1fr;
  }
}
.container {
  display: block;
  width: 100%;
  height: 100%;
}
#app-view {
  background-color: var(--secondary-background);
  overflow: hidden;
  width: 100%;
  height: 100%;
  display: block;
}
.app-content {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: block;
}
.scroll-x {
  overflow-x: auto;
}
.scroll-y {
  overflow-y: auto;
}
.content-view {
  height: 100%;
  width: 100%;
}
label,
.label {
  color: var(--secondary-color);
  text-transform: uppercase;
  font-weight: 600;
  display: block;
}
.label8 {
  color: var(--secondary-color);
  text-transform: uppercase;
  font-weight: 600;
  display: block;
  margin-top: 8px;
}
.label16 {
  color: var(--secondary-color);
  text-transform: uppercase;
  font-weight: 600;
  display: block;
  margin-top: 16px;
}
.navy--button,
.navy-button {
  font-size: var(--font-size);
  line-height: var(--input-height);
  height: var(--input-height);
  text-align: center;
  text-decoration: none;
  -webkit-border-radius: var(--input-radius);
  -moz-border-radius: var(--input-radius);
  -ms-border-radius: var(--input-radius);
  -o-border-radius: var(--input-radius);
  border-radius: var(--input-radius);
  display: inline-block;
  cursor: pointer;
  transition: all 0.3s ease-out;
  padding: 0 16px;
  color: var(--primary-color);
  background-color: var(--button-background);
}
.navy--button:hover,
.navy-button:hover,
.navy--button:active,
.navy-button:active,
.navy--button:focus,
.navy-button:focus {
  background: var(--primary-active);
}
.navy--button[disabled],
.navy-button[disabled] {
  background: #e6e6e6;
  color: #999999;
}
.navy--button a,
.navy-button a,
.navy--button span,
.navy-button span {
  display: block;
}
.navy--button.w120px,
.navy-button.w120px {
  width: 120px;
}
.navy--button.large,
.navy-button.large {
  width: 120px;
}
.navy--button.tiny,
.navy-button.tiny {
  font-size: 11px;
  line-height: 20px;
  padding: 5px;
}
.navy--button.tinyicon,
.navy-button.tinyicon {
  width: 24px;
  line-height: 24px;
  padding: 0 !important;
}
.navy--button i,
.navy-button i {
  margin-right: 8px;
  font-size: 12px;
}
.navy--button.icon,
.navy-button.icon {
  width: var(--input-height);
  min-width: var(--input-height);
  padding: 0 !important;
  line-height: var(--input-height);
}
.navy--button.icon i,
.navy-button.icon i {
  margin-right: 0px;
  font-size: 14px;
  font-weight: 700;
}
.navy--button.transparent,
.navy-button.transparent {
  background-color: transparent;
}
.navy--button.transparent:hover,
.navy-button.transparent:hover {
  background-color: transparent;
}
.navy--button.left,
.navy-button.left {
  float: left;
}
.navy--button.right,
.navy-button.right {
  float: right;
}
.navy--button.full,
.navy-button.full {
  width: 100%;
}
.navy--button.primary,
.navy-button.primary {
  background-color: var(--primary);
  color: var(--white);
}
.navy--button .transparent,
.navy-button .transparent {
  background-color: transparent;
  color: var(--primary-color);
}
.navy--button .fileUpload,
.navy-button .fileUpload {
  display: block;
  position: relative;
}
.navy--button .fileUpload input,
.navy-button .fileUpload input {
  opacity: 0;
  position: absolute;
  left: 0;
  padding: 0;
}
/*
a.navy-button{
	display: block;
}
*/
input.button,
button {
  border: 0;
  padding: 0;
}
.dropzone {
  position: relative;
  border: 2px dashed var(--primary-border);
  border-radius: 4px;
  text-align: center;
}
.file-dropzone {
  height: 200px;
  position: relative;
  border: 2px dashed var(--primary-border);
  border-radius: 4px;
  text-align: center;
}
.file-dropzone .fileUpload {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
  display: grid;
  align-items: center;
}
.file-dropzone .fileUpload input.upload {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: 0;
  padding: 0;
  height: 100%;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
}
.btn {
  color: var(--primary-color);
  background-color: transparent;
  border: 1px solid #d3d6db;
  display: inline-block;
  padding: 5px 15px;
  margin-bottom: 0;
  font-size: var(--font-size);
  font-weight: 400;
  line-height: 20px;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border-radius: var(--input-radius);
}
.btn:hover,
.btn:focus {
  color: var(--primary-background);
  background: var(--primary-border);
}
input,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: var(--font-size);
  display: inline-block;
  padding: 6px 8px;
  width: 100%;
  color: var(--input-color);
  border: 1px solid var(--primary-border);
  background-color: var(--input-background);
  border-radius: var(--input-radius);
  outline: none;
}
input {
  height: var(--input-height);
}
input.border-bottom {
  border: none;
  border-bottom: 1px solid var(--primary-border);
}
input:hover,
textarea:hover {
  border-color: var(--primary);
}
input:focus,
textarea:focus {
  border-color: var(--primary);
  outline: none;
}
.readonly {
  background: #e5e5e5;
}
textarea {
  overflow: auto;
  resize: none;
}
::placeholder {
  color: var(--secondary-color);
}
::-moz-placeholder {
  color: var(--secondary-color) !important;
  opacity: 1;
}
::-webkit-input-placeholder {
  color: var(--secondary-color);
}
:-ms-input-placeholder {
  color: var(--secondary-color);
}
select {
  margin: 0;
  line-height: normal;
  font-family: inherit;
  font-size: 100%;
  cursor: pointer;
}
.select {
  display: block;
  position: relative;
  height: var(--input-height);
  /*	background: var(--white);*/
  border: 1px solid var(--primary-border);
  border-radius: var(--input-radius);
  width: 100%;
  cursor: pointer;
}
.select option {
  color: var(--primary-color);
  padding: 5px;
}
.select:hover {
  border-color: var(--primary);
}
.select > select {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 18px;
  padding: 6px 8px;
  color: var(--primary-color);
  background: var(--input-background);
  border: 0;
}
.select > select:focus {
  color: var(--primary-color);
  outline: 1px solid var(--primary);
  outline-offset: 0;
  -moz-outline-radius: 2px;
}
.select > select::-ms-expand {
  display: none;
}
.select:before,
.select:after {
  content: '';
  position: absolute;
  pointer-events: none;
}
.select:before {
  top: 0;
  bottom: 1px;
  right: 0;
  width: 20px;
  background: var(--input-background);
}
.select:after {
  top: calc((var(--input-height) - 2px) / 2);
  right: 6px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-top-color: var(--primary);
}
.checkbox {
  line-height: 26px;
  cursor: pointer;
  padding: 4px 0;
}
.checkbox input {
  width: 1px;
  height: 1px;
  opacity: 0;
}
.checkbox label {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
}
.checkbox label::before {
  content: '\E739';
  display: inline-block;
  font-size: 20px;
  font-family: 'Segoe MDL2 Assets';
  color: var(--primary);
  text-align: center;
  margin-right: 10px;
  position: relative;
  top: 5px;
  font-weight: 700;
  cursor: pointer;
}
.checkbox input:checked + label::before {
  content: "\E73A";
}
.input-group,
.input--group {
  display: grid;
  grid-template-columns: 1fr var(--input-height);
  border: 1px solid var(--primary-border);
  pointer-events: none;
  color: var(--primary-color);
  background: var(--input-background);
  position: relative;
}
.input-group input,
.input--group input {
  border: none;
  pointer-events: auto;
  height: calc(var(--input-height) - 2px);
}
.input-group.left,
.input--group.left {
  grid-template-columns: var(--input-height) 1fr;
}
.input-group.left input,
.input--group.left input {
  padding-left: 0;
}
.input-group > .button,
.input--group > .button {
  text-align: center;
  cursor: pointer;
  align-self: center;
  pointer-events: auto;
  font-size: 15px;
  height: 100%;
  line-height: calc(var(--input-height) - 2px);
}
.input-group > .button:hover,
.input--group > .button:hover {
  background-color: var(--primary-active);
  color: var(--active-color);
}
.input-group > .button.primary,
.input--group > .button.primary {
  background-color: var(--primary);
  color: var(--primary-text);
}
.input-group:hover,
.input--group:hover {
  border-color: var(--primary);
}
.input-group:hover .navy-dropdown2,
.input--group:hover .navy-dropdown2 {
  border: none;
}
.input-group .navy-dropdown2,
.input--group .navy-dropdown2 {
  pointer-events: auto;
}
.input-group .navy-dropdown2 .dropdown2-container,
.input--group .navy-dropdown2 .dropdown2-container {
  height: calc(var(--input-height) - 2px);
  border: none;
}
.input-group2 {
  display: grid;
  grid-template-columns: var(--input-height) 1fr var(--input-height);
  border: 1px solid var(--primary-border);
  pointer-events: none;
  color: var(--primary-color);
  background: var(--input-background);
  position: relative;
}
.input-group2 input {
  border: none;
  pointer-events: auto;
  height: calc(var(--input-height) - 2px);
}
.input-group2 > .button {
  text-align: center;
  cursor: pointer;
  align-self: center;
  pointer-events: auto;
  font-size: 15px;
  height: 100%;
  line-height: calc(var(--input-height) - 2px);
}
.input-group2 > .button:hover {
  background-color: var(--primary-active);
  color: var(--active-color);
}
.input-group2 > .button.primary {
  background-color: var(--primary);
  color: var(--primary-text);
}
div.parent {
  pointer-events: none;
}
div.child {
  pointer-events: auto;
}
.navy-form {
  display: grid;
}
.navy-form.horizontal {
  grid-template-columns: 128px 1fr 80px;
  grid-gap: 16px;
  align-items: center;
}
.navy-form.horizontal label {
  text-align: right;
  padding: 6px 0;
  font-weight: 600;
  grid-column-start: 1;
  grid-column-end: 2;
}
.navy-form.horizontal .col2 {
  grid-column-start: 2;
  grid-column-end: 3;
}
.navy-form.horizontal.l128 {
  grid-template-columns: 128px 1fr 128px;
}
.navy-form.stacked label {
  padding-top: 16px;
}
.navy-form.stacked.col-2 {
  grid-template-columns: 1fr 1fr;
  grid-gap: 16px 32px;
}
.navy-form.stacked.col-2 .full {
  grid-column: span 2;
}
.navy-form.stacked.col-3 {
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 16px 32px;
}
.navy-form.stacked.col-3 .full {
  grid-column: span 3;
}
.navy-form.stacked.col-4 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 16px 32px;
}
.navy-form.stacked.col-4 .full {
  grid-column: span 3;
}
.navy-form .message {
  display: none;
  font-style: italic;
}
.navy-form .error {
  display: block;
}
@media screen and (max-width: 640px) {
  .navy-form.horizontal {
    grid-template-columns: 1fr;
    grid-gap: 0;
  }
  .navy-form.horizontal label {
    padding-top: 16px;
    grid-column-start: 1;
    grid-column-end: 3;
    text-align: left;
  }
  .navy-form.horizontal input {
    grid-column-start: 1;
    grid-column-end: 3;
  }
}
.navy--navigation,
.navy-navigation {
  position: relative;
  overflow: visible;
}
.navy--navigation .right,
.navy-navigation .right {
  float: right;
}
.navy--navigation ul li,
.navy-navigation ul li {
  color: var(--primary-color);
}
.navy--navigation ul li.heading,
.navy-navigation ul li.heading {
  font-weight: 700;
  color: var(--active-color);
  padding: 8px 12px 0 !important;
  line-height: 24px;
}
.navy--navigation ul li:hover,
.navy-navigation ul li:hover {
  color: var(--active-color);
  background: var(--primary-hover);
}
.navy--navigation ul li.active,
.navy-navigation ul li.active {
  color: var(--primary-color);
  background: var(--primary-hover);
}
.navy--navigation ul li a.active,
.navy-navigation ul li a.active {
  color: var(--primary-color);
  background: var(--primary-hover);
}
.navy--navigation ul li a:hover,
.navy-navigation ul li a:hover {
  color: var(--active-color);
  background: var(--primary-hover);
}
.navy--navigation ul li.no__hover:hover,
.navy-navigation ul li.no__hover:hover {
  background: transparent !important;
}
.navy--navigation ul li a,
.navy-navigation ul li a {
  color: var(--primary-color);
  display: block;
  text-decoration: none;
}
.navy--navigation ul:after,
.navy-navigation ul:after {
  content: "";
  display: table;
  clear: both;
}
.navy--navigation .horizontal > li:first-child a,
.navy-navigation .horizontal > li:first-child a {
  -webkit-border-radius: var(--input-radius) 0 0 2px;
  -moz-border-radius: var(--input-radius) 0 0 2px;
  -ms-border-radius: var(--input-radius) 0 0 2px;
  -o-border-radius: var(--input-radius) 0 0 2px;
  border-radius: var(--input-radius) 0 0 2px;
}
.navy--navigation .horizontal,
.navy-navigation .horizontal {
  display: flex;
}
.navy--navigation .horizontal li,
.navy-navigation .horizontal li {
  position: relative;
}
.navy--navigation .horizontal li a,
.navy-navigation .horizontal li a {
  line-height: 24px;
  padding: 8px 16px;
}
.navy--navigation .horizontal.end,
.navy-navigation .horizontal.end {
  justify-content: flex-end;
}
.navy--navigation .vertical li,
.navy-navigation .vertical li {
  position: relative;
  line-height: calc(var(--input-height) + 4px);
  padding: 0 16px;
  cursor: pointer;
  font-weight: normal;
  text-align: left;
  font-size: var(--font-size);
}
.navy--navigation .vertical li.separator-above,
.navy-navigation .vertical li.separator-above {
  padding-top: 5px;
  margin-top: 5px;
  border-top: 1px solid var(--primary-border);
}
.navy--navigation .vertical li.separator-bellow,
.navy-navigation .vertical li.separator-bellow {
  padding-top: 5px;
  margin-top: 5px;
  border-bottom: 1px solid var(--primary-border);
}
.navy--navigation .vertical li a,
.navy-navigation .vertical li a {
  display: block;
  clear: both;
}
.navy--navigation .vertical li i,
.navy-navigation .vertical li i {
  font-size: calc(var(--font-size) + 2px);
  padding-right: 8px;
  position: relative;
  top: 2px;
}
.navy-navigation .vertical li.level-1 {
  padding-left: 52px;
}
.navy-navigation .vertical li.level-2 {
  padding-left: 88px;
}
.navy-navigation .vertical li.level-3 {
  padding-left: 124px;
}
.navy-navigation .vertical li.level-4 {
  padding-left: 160px;
}
.navy-navigation .vertical li.level-5 {
  padding-left: 196px;
}
.navy-navigation .vertical li.level-6 {
  padding-left: 232px;
}
.navy-navigation .vertical li.level-7 {
  padding-left: 268px;
}
.navy-navigation .vertical li.level-8 {
  padding-left: 304px;
}
.navy-navigation .vertical li.level-9 {
  padding-left: 340px;
}
.navy-navigation .vertical li.level-10 {
  padding-left: 376px;
}
/***(tables 2.html)***/
.navy-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--primary-background);
}
.navy-table thead td {
  padding: 12px 8px;
  font-weight: 600;
  font-size: 14px;
  text-align: left;
  color: var(--primary-color);
}
.navy-table thead th {
  padding: 12px 8px;
  font-weight: 600;
  font-size: 14px;
  text-align: left;
  color: var(--primary-color);
}
.navy-table tbody tr td {
  padding: 12px 8px;
}
.navy-table tr.selected {
  background-color: var(--secondary-background);
}
.navy-table tbody tr.even td {
  background-color: var(--secondary-background);
}
.navy-table span {
  border-radius: var(--input-radius);
  cursor: pointer;
}
.navy-table span.action {
  cursor: pointer;
}
.navy-table .button {
  margin-right: 4px;
}
.navy-table input[type=checkbox] {
  height: 14px;
}
.navy-table tbody > tr:nth-child(odd) > td,
.navy-table tbody > tr:nth-child(odd) > th {
  background-color: var(--secondary-background);
}
.navy-table tbody tr:hover td {
  background-color: var(--primary-hover);
}
.navy-table tbody > tr:last-child td {
  border-bottom: 1px solid var(--primary-border);
}
.navy__pagination {
  display: grid;
  grid-template-columns: auto 1fr 175px;
  padding: 0 16px;
}
.navy__pagination .info {
  padding: 0 16px;
  line-height: 32px;
}
.navy__pagination .ipp {
  display: grid;
  grid-template-columns: 1fr 70px 1fr;
}
.navy__pagination .ipp .label {
  line-height: 32px;
  text-align: right;
  padding-right: 8px;
}
.navy__pagination .ipp .navy-navigation .vertical li {
  line-height: var(--input-height);
}
.navy__pagination .pagination ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-flow: row wrap;
}
.navy__pagination .pagination ul li {
  cursor: pointer;
}
.navy__pagination .pagination ul li a,
.navy__pagination .pagination ul li span {
  display: block;
  color: var(--primary-color);
  padding: 4px 10px;
  background: var(--primary-background);
  border: 1px solid var(--primary-border);
  min-width: var(--input-height);
  margin-left: -1px;
  line-height: 22px;
  text-align: center;
}
.navy__pagination .pagination ul li a:hover,
.navy__pagination .pagination ul li span:hover {
  background: var(--base-2);
}
.navy__pagination .pagination ul li.active a,
.navy__pagination .pagination ul li.active span {
  background: var(--primary);
  border: 1px solid var(--primary);
  color: var(--active-color);
}
/* General styles for the modal */
/*
Styles for the html/body for special modal where we want 3d effects
Note that we need a container wrapping all content on the page for the
perspective effects (not including the modals and the overlay).
*/
.md-perspective,
.md-perspective body {
  height: 100%;
  overflow: hidden;
}
.md-perspective body {
  background: #222;
  -webkit-perspective: 600px;
  -moz-perspective: 600px;
  perspective: 600px;
}
.navy-modal,
.navy__modal {
  display: grid;
  grid-template-rows: 48px 1fr 68px;
  border-radius: 4px;
  position: fixed;
  top: 50%;
  left: 50%;
  background: var(--primary-background);
  width: 640px;
  min-width: 320px;
  min-height: 280px;
  max-height: 90%;
  z-index: 2000;
  visibility: hidden;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  /* Effect 1: Fade in and scale up */
  /* Effect 7:  slide and stick to top */
}
.navy-modal.show,
.navy__modal.show {
  visibility: visible;
}
.navy-modal .header,
.navy__modal .header {
  display: grid;
  grid-template-columns: 1fr 44px;
  align-items: center;
  font-weight: 600;
}
.navy-modal .header .title,
.navy__modal .header .title {
  padding-left: 16px;
  font-size: 14px;
}
.navy-modal .header .controls,
.navy__modal .header .controls {
  justify-self: center;
  cursor: pointer;
}
.navy-modal .content,
.navy__modal .content {
  padding: 16px;
  margin-bottom: 16px;
  overflow: hidden;
}
.navy-modal .footer,
.navy__modal .footer {
  padding: 16px;
  border-top: 1px solid var(--primary-border);
  display: grid;
  justify-items: end;
}
.navy-modal .footer .modal-footer,
.navy__modal .footer .modal-footer {
  display: grid;
  width: 100%;
  grid-template-columns: auto 1fr;
  grid-template-areas: 'place-start place-end';
}
.navy-modal .footer .modal-footer .end,
.navy__modal .footer .modal-footer .end {
  justify-self: end;
}
.navy-modal.effect-1 .content,
.navy__modal.effect-1 .content {
  -webkit-transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  transform: scale(0.7);
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.navy-modal.show.effect-1 .content,
.navy__modal.show.effect-1 .content {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
.navy-modal .effect-7,
.navy__modal .effect-7 {
  top: 0;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.navy-modal .effect-7 .content,
.navy__modal .effect-7 .content {
  -webkit-transform: translateY(-200%);
  -moz-transform: translateY(-200%);
  -ms-transform: translateY(-200%);
  transform: translateY(-200%);
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0;
}
.navy-modal .show.effect-7 .content,
.navy__modal .show.effect-7 .content {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -ms-transform: translateY(0%);
  transform: translateY(0%);
  opacity: 1;
}
.navy-modal.tiny,
.navy__modal.tiny {
  width: 320px;
}
.navy-modal.small,
.navy__modal.small {
  width: 640px;
}
.navy-modal.medium,
.navy__modal.medium {
  width: 940px;
}
.navy-modal.large,
.navy__modal.large {
  width: 60%;
}
.navy-modal.extralarge,
.navy__modal.extralarge {
  width: 80%;
}
.navy-modal.fullscreen,
.navy__modal.fullscreen {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 640px) {
  .navy-modal,
  .navy__modal {
    max-height: 90%;
  }
  .navy-modal.medium,
  .navy__modal.medium,
  .navy-modal.small,
  .navy__modal.small,
  .navy-modal.tiny,
  .navy__modal.tiny,
  .navy-modal.large,
  .navy__modal.large,
  .navy-modal.extralarge,
  .navy__modal.extralarge {
    width: 90%;
  }
}
.navy-modal.overflow-auto .content,
.navy__modal.overflow-auto .content {
  overflow: auto;
}
.navy-modal.overflow-initial .content,
.navy__modal.overflow-initial .content {
  overflow: initial;
}
.overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  visibility: hidden;
  top: 0;
  left: 0;
  z-index: 1000;
  opacity: 0;
  background: rgba(76, 76, 76, 0.8);
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.overlay.show {
  opacity: 1;
  visibility: visible;
}
.md-show ~ .md-overlay {
  opacity: 1;
  visibility: visible;
}
/* Individual modal styles with animations/transitions */
/* Effect 1: Fade in and scale up */
.md-effect-1 .md-content {
  -webkit-transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  transform: scale(0.7);
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show.md-effect-1 .md-content {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
/* Effect 2: Slide from the right */
.md-effect-2 .md-content {
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
  -moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
  transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}
.md-show.md-effect-2 .md-content {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
}
/* Effect 3: Slide from the bottom */
.md-effect-3 .md-content {
  -webkit-transform: translateY(20%);
  -moz-transform: translateY(20%);
  -ms-transform: translateY(20%);
  transform: translateY(20%);
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show.md-effect-3 .md-content {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
/* Effect 4: Newspaper */
.md-effect-4 .md-content {
  -webkit-transform: scale(0) rotate(720deg);
  -moz-transform: scale(0) rotate(720deg);
  -ms-transform: scale(0) rotate(720deg);
  transform: scale(0) rotate(720deg);
  opacity: 0;
}
.md-show.md-effect-4 ~ .md-overlay,
.md-effect-4 .md-content {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}
.md-show.md-effect-4 .md-content {
  -webkit-transform: scale(1) rotate(0deg);
  -moz-transform: scale(1) rotate(0deg);
  -ms-transform: scale(1) rotate(0deg);
  transform: scale(1) rotate(0deg);
  opacity: 1;
}
/* Effect 5: fall */
.md-effect-5.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-5 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: translateZ(600px) rotateX(20deg);
  -moz-transform: translateZ(600px) rotateX(20deg);
  -ms-transform: translateZ(600px) rotateX(20deg);
  transform: translateZ(600px) rotateX(20deg);
  opacity: 0;
}
.md-show.md-effect-5 .md-content {
  -webkit-transition: all 0.3s ease-in;
  -moz-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  -webkit-transform: translateZ(0px) rotateX(0deg);
  -moz-transform: translateZ(0px) rotateX(0deg);
  -ms-transform: translateZ(0px) rotateX(0deg);
  transform: translateZ(0px) rotateX(0deg);
  opacity: 1;
}
/* Effect 6: side fall */
.md-effect-6.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-6 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: translate(30%) translateZ(600px) rotate(10deg);
  -moz-transform: translate(30%) translateZ(600px) rotate(10deg);
  -ms-transform: translate(30%) translateZ(600px) rotate(10deg);
  transform: translate(30%) translateZ(600px) rotate(10deg);
  opacity: 0;
}
.md-show.md-effect-6 .md-content {
  -webkit-transition: all 0.3s ease-in;
  -moz-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  -webkit-transform: translate(0%) translateZ(0) rotate(0deg);
  -moz-transform: translate(0%) translateZ(0) rotate(0deg);
  -ms-transform: translate(0%) translateZ(0) rotate(0deg);
  transform: translate(0%) translateZ(0) rotate(0deg);
  opacity: 1;
}
/* Effect 7:  slide and stick to top */
.md-effect-7 {
  top: 0;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.md-effect-7 .md-content {
  -webkit-transform: translateY(-200%);
  -moz-transform: translateY(-200%);
  -ms-transform: translateY(-200%);
  transform: translateY(-200%);
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0;
}
.md-show.md-effect-7 .md-content {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -ms-transform: translateY(0%);
  transform: translateY(0%);
  border-radius: 0 0 3px 3px;
  opacity: 1;
}
/* Effect 8: 3D flip horizontal */
.md-effect-8.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-8 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateY(-70deg);
  -moz-transform: rotateY(-70deg);
  -ms-transform: rotateY(-70deg);
  transform: rotateY(-70deg);
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0;
}
.md-show.md-effect-8 .md-content {
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  transform: rotateY(0deg);
  opacity: 1;
}
/* Effect 9: 3D flip vertical */
.md-effect-9.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-9 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateX(-70deg);
  -moz-transform: rotateX(-70deg);
  -ms-transform: rotateX(-70deg);
  transform: rotateX(-70deg);
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0;
}
.md-show.md-effect-9 .md-content {
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  transform: rotateX(0deg);
  opacity: 1;
}
/* Effect 10: 3D sign */
.md-effect-10.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-10 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateX(-60deg);
  -moz-transform: rotateX(-60deg);
  -ms-transform: rotateX(-60deg);
  transform: rotateX(-60deg);
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  transform-origin: 50% 0;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show.md-effect-10 .md-content {
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  transform: rotateX(0deg);
  opacity: 1;
}
/* Effect 11: Super scaled */
.md-effect-11 .md-content {
  -webkit-transform: scale(2);
  -moz-transform: scale(2);
  -ms-transform: scale(2);
  transform: scale(2);
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show.md-effect-11 .md-content {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
/* Effect 12:  Just me */
.md-effect-12 .md-content {
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show.md-effect-12 ~ .md-overlay {
  background: #e74c3c;
}
.md-effect-12 .md-content h3,
.md-effect-12 .md-content {
  background: transparent;
}
.md-show.md-effect-12 .md-content {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}
/* Effect 13: 3D slit */
.md-effect-13.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-13 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: translateZ(-3000px) rotateY(90deg);
  -moz-transform: translateZ(-3000px) rotateY(90deg);
  -ms-transform: translateZ(-3000px) rotateY(90deg);
  transform: translateZ(-3000px) rotateY(90deg);
  opacity: 0;
}
.md-show.md-effect-13 .md-content {
  -webkit-animation: slit 0.7s forwards ease-out;
  -moz-animation: slit 0.7s forwards ease-out;
  animation: slit 0.7s forwards ease-out;
}
@-webkit-keyframes slit {
  50% {
    -webkit-transform: translateZ(-250px) rotateY(89deg);
    opacity: 0.5;
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    -webkit-transform: translateZ(0) rotateY(0deg);
    opacity: 1;
  }
}
@-moz-keyframes slit {
  50% {
    -moz-transform: translateZ(-250px) rotateY(89deg);
    opacity: 0.5;
    -moz-animation-timing-function: ease-out;
  }
  100% {
    -moz-transform: translateZ(0) rotateY(0deg);
    opacity: 1;
  }
}
@keyframes slit {
  50% {
    transform: translateZ(-250px) rotateY(89deg);
    opacity: 1;
    animation-timing-function: ease-in;
  }
  100% {
    transform: translateZ(0) rotateY(0deg);
    opacity: 1;
  }
}
/* Effect 14:  3D Rotate from bottom */
.md-effect-14.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-14 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: translateY(100%) rotateX(90deg);
  -moz-transform: translateY(100%) rotateX(90deg);
  -ms-transform: translateY(100%) rotateX(90deg);
  transform: translateY(100%) rotateX(90deg);
  -webkit-transform-origin: 0 100%;
  -moz-transform-origin: 0 100%;
  transform-origin: 0 100%;
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.md-show.md-effect-14 .md-content {
  -webkit-transform: translateY(0%) rotateX(0deg);
  -moz-transform: translateY(0%) rotateX(0deg);
  -ms-transform: translateY(0%) rotateX(0deg);
  transform: translateY(0%) rotateX(0deg);
  opacity: 1;
}
/* Effect 15:  3D Rotate in from left */
.md-effect-15.navy__modal {
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  perspective: 1300px;
}
.md-effect-15 .md-content {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
  -moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
  -ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
  transform: translateZ(100px) translateX(-30%) rotateY(90deg);
  -webkit-transform-origin: 0 100%;
  -moz-transform-origin: 0 100%;
  transform-origin: 0 100%;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show.md-effect-15 .md-content {
  -webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg);
  -moz-transform: translateZ(0px) translateX(0%) rotateY(0deg);
  -ms-transform: translateZ(0px) translateX(0%) rotateY(0deg);
  transform: translateZ(0px) translateX(0%) rotateY(0deg);
  opacity: 1;
}
/* Effect 16:  Blur */
.md-show.md-effect-16 ~ .md-overlay {
  background: rgba(180, 46, 32, 0.5);
}
.md-show.md-effect-16 ~ .container {
  -webkit-filter: blur(3px);
  -moz-filter: blur(3px);
  filter: blur(3px);
}
.md-effect-16 .md-content {
  -webkit-transform: translateY(-5%);
  -moz-transform: translateY(-5%);
  -ms-transform: translateY(-5%);
  transform: translateY(-5%);
  opacity: 0;
}
.md-show.md-effect-16 ~ .container,
.md-effect-16 .md-content {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.md-show.md-effect-16 .md-content {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
/* Effect 17:  Slide in from bottom with perspective on container */
.md-show.md-effect-17 ~ .container {
  height: 100%;
  overflow: hidden;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}
.md-show.md-effect-17 ~ .container,
.md-show.md-effect-17 ~ .md-overlay {
  -webkit-transform: rotateX(-2deg);
  -moz-transform: rotateX(-2deg);
  -ms-transform: rotateX(-2deg);
  transform: rotateX(-2deg);
  -webkit-transform-origin: 50% 0%;
  -moz-transform-origin: 50% 0%;
  transform-origin: 50% 0%;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.md-effect-17 .md-content {
  opacity: 0;
  -webkit-transform: translateY(200%);
  -moz-transform: translateY(200%);
  -ms-transform: translateY(200%);
  transform: translateY(200%);
}
.md-show.md-effect-17 .md-content {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
  -webkit-transition: all 0.3s 0.2s;
  -moz-transition: all 0.3s 0.2s;
  transition: all 0.3s 0.2s;
}
/* Effect 18:  Slide from right with perspective on container */
.md-show.md-effect-18 ~ .container {
  height: 100%;
  overflow: hidden;
}
.md-show.md-effect-18 ~ .md-overlay {
  background: rgba(143, 27, 15, 0.8);
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}
.md-show.md-effect-18 ~ .container,
.md-show.md-effect-18 ~ .md-overlay {
  -webkit-transform-style: preserve-3d;
  -webkit-transform-origin: 0% 50%;
  -webkit-animation: rotateRightSideFirst 0.5s forwards ease-in;
  -moz-transform-style: preserve-3d;
  -moz-transform-origin: 0% 50%;
  -moz-animation: rotateRightSideFirst 0.5s forwards ease-in;
  transform-style: preserve-3d;
  transform-origin: 0% 50%;
  animation: rotateRightSideFirst 0.5s forwards ease-in;
}
@-webkit-keyframes rotateRightSideFirst {
  50% {
    -webkit-transform: translateZ(-50px) rotateY(5deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    -webkit-transform: translateZ(-200px);
  }
}
@-moz-keyframes rotateRightSideFirst {
  50% {
    -moz-transform: translateZ(-50px) rotateY(5deg);
    -moz-animation-timing-function: ease-out;
  }
  100% {
    -moz-transform: translateZ(-200px);
  }
}
@keyframes rotateRightSideFirst {
  50% {
    transform: translateZ(-50px) rotateY(5deg);
    animation-timing-function: ease-out;
  }
  100% {
    transform: translateZ(-200px);
  }
}
.md-effect-18 .md-content {
  -webkit-transform: translateX(200%);
  -moz-transform: translateX(200%);
  -ms-transform: translateX(200%);
  transform: translateX(200%);
  opacity: 0;
}
.md-show.md-effect-18 .md-content {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
  -webkit-transition: all 0.5s 0.1s;
  -moz-transition: all 0.5s 0.1s;
  transition: all 0.5s 0.1s;
}
/* Effect 19:  Slip in from the top with perspective on container */
.md-show.md-effect-19 ~ .container {
  height: 100%;
  overflow: hidden;
}
.md-show.md-effect-19 ~ .md-overlay {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}
.md-show.md-effect-19 ~ .container,
.md-show.md-effect-19 ~ .md-overlay {
  -webkit-transform-style: preserve-3d;
  -webkit-transform-origin: 50% 100%;
  -webkit-animation: OpenTop 0.5s forwards ease-in;
  -moz-transform-style: preserve-3d;
  -moz-transform-origin: 50% 100%;
  -moz-animation: OpenTop 0.5s forwards ease-in;
  transform-style: preserve-3d;
  transform-origin: 50% 100%;
  animation: OpenTop 0.5s forwards ease-in;
}
@-webkit-keyframes OpenTop {
  50% {
    -webkit-transform: rotateX(10deg);
    -webkit-animation-timing-function: ease-out;
  }
}
@-moz-keyframes OpenTop {
  50% {
    -moz-transform: rotateX(10deg);
    -moz-animation-timing-function: ease-out;
  }
}
@keyframes OpenTop {
  50% {
    transform: rotateX(10deg);
    animation-timing-function: ease-out;
  }
}
.md-effect-19 .md-content {
  -webkit-transform: translateY(-200%);
  -moz-transform: translateY(-200%);
  -ms-transform: translateY(-200%);
  transform: translateY(-200%);
  opacity: 0;
}
.md-show.md-effect-19 .md-content {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
  -webkit-transition: all 0.5s 0.1s;
  -moz-transition: all 0.5s 0.1s;
  transition: all 0.5s 0.1s;
}
@media screen and (max-width: 32em) {
  body {
    font-size: 75%;
  }
}
.modal {
  display: block;
}
.modal {
  background: rgba(0, 0, 0, 0.75);
  height: 100%;
  cursor: pointer;
  left: 0;
  opacity: 0;
  position: fixed;
  transition: opacity 0.5s ease-in-out, visibility 0.5s linear;
  top: 0;
  visibility: hidden;
  width: 100%;
  z-index: 9999;
}
.modal__inner {
  background: #FFF;
  cursor: default;
  left: 50%;
  padding: 30px 60px;
  position: fixed;
  text-align: center;
  top: 50%;
  transform: translate(-50%, -50%);
}
.modal--showing {
  opacity: 1;
  visibility: visible;
}
.modal--fullscreen > .modal__inner {
  height: 100vh;
  left: 0;
  padding: 0;
  transform: none;
  top: 0;
  width: 100vw;
}
.dialog-media {
  width: 100%;
  margin: 0 auto;
  pointer-events: none;
  height: 100%;
  position: relative;
  padding: 2rem;
}
.dialog-media .file-dropzone {
  height: calc(100% - 36px);
}
.dialog-container {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  overflow: hidden;
  outline: 0;
  opacity: 1;
  display: block;
  background-color: rgba(0, 0, 0, 0.4);
}
.dialog-container .dialog-content {
  position: relative;
  display: grid;
  grid-template-rows: 50px 1fr 64px;
  width: 100%;
  height: 100%;
  pointer-events: auto;
  background-color: var(--primary-background);
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem;
  outline: 0;
}
.dialog-header,
.dialog-footer {
  padding: 16px;
}
.dialog-header .controls {
  position: absolute;
  right: 12px;
  top: 12px;
  font-size: 20px;
  font-weight: 700;
  cursor: pointer;
}
.dialog-body {
  padding: 4px 16px 4px;
  height: 100%;
  overflow: hidden;
}
.dialog-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  border-top: 1px solid var(--primary-border);
}
.auto-grid {
  --auto-grid-min-size: 8rem;
  --auto-grid-max-size: 12rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--auto-grid-min-size), var(--auto-grid-max-size)));
  grid-gap: 1rem 0.5rem;
  height: 100%;
}
.auto-grid > * {
  max-width: unset;
}
.auto-grid > * + * {
  margin-top: unset;
}
.auto-grid {
  overflow-y: auto;
  height: 100%;
}
.auto-grid .item {
  border: 2px solid transparent;
  cursor: pointer;
  min-height: 8rem;
  overflow: hidden;
  padding: 4px;
}
.auto-grid .item:hover,
.auto-grid .item.active {
  border-color: var(--primary);
}
.galleries-grid {
  display: grid;
  grid-template-columns: 1fr 320px;
  grid-gap: 8px;
  height: calc(100% - 40px);
}
.galleries-grid .image-attr {
  height: 100%;
}
.galleries-grid .image-attr .img {
  max-height: 50%;
  overflow: hidden;
}
.tab--header {
  display: grid;
  grid-template-columns: repeat(auto-fit, 120px);
  border-bottom: 1px solid var(--primary-border);
}
.tab--header .tab {
  cursor: pointer;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.tab--header .tab .tab-name {
  text-align: center;
  padding: 16px 0 8px;
  font-weight: 600;
}
.tab--header .tab .indicator {
  width: 80%;
  margin: 0 auto;
  height: 2px;
  display: none;
  transition: 0.3s ease;
}
.tab--header .tab:hover .indicator {
  display: block;
  background: var(--primary-border);
}
.tab--header .tab.active {
  color: var(--primary);
}
.tab--header .tab.active .indicator {
  display: block;
  background: var(--primary);
}
.navy-panel > .header {
  margin-bottom: 8px;
  border-bottom: 1px solid var(--primary-border);
  padding: 8px 16px;
  position: relative;
}
.navy-panel > .body {
  padding: var(--padding);
}
.tag {
  display: inline-block;
  padding: 4px 6px;
  border-radius: 4px;
  margin-right: 4px;
  background-color: var(--primary-active);
}
.aurelia-tags-input {
  position: relative;
  display: block;
  overflow: visible;
  cursor: text;
  width: 100%;
  border-radius: 4px;
  min-height: 30px;
}
.tag .tag_name {
  margin: 0;
  display: inline-block;
  vertical-align: middle;
  font-size: 13px;
}
.tag .tag_name:focus {
  outline: none;
}
.tag .close {
  display: inline-block;
  padding-left: 4px;
  padding-right: 2px;
  vertical-align: middle;
  font-size: 11px;
  padding-top: 4px;
}
.tag .close:hover {
  cursor: pointer;
}
.tag-input {
  position: relative;
}
.tags-select {
  z-index: 34;
  position: absolute;
  background: var(--primary-background);
  border: 1px solid var(--primary-border);
  height: 320px;
  overflow-y: auto;
  width: 100%;
  -webkit-box-shadow: 2px 2px 8px 0px rgba(50, 50, 50, 0.3);
  -moz-box-shadow: 2px 2px 8px 0px rgba(50, 50, 50, 0.3);
  box-shadow: 2px 2px 8px 0px rgba(50, 50, 50, 0.3);
}
.navy-dropdown2 {
  position: relative;
  width: 100%;
  color: var(--input-color);
}
.navy-dropdown2 .dropdown-content {
  background: var(--input-background);
  z-index: 34;
  display: block;
  overflow-x: auto;
  border: 1px solid var(--primary-border);
  position: absolute;
  width: 100%;
  top: var(--input-height);
  padding: 8px 0;
}
.navy-dropdown2 .dropdown2-toggle {
  text-align: center;
  color: var(--primary);
  font-weight: 600;
}
.navy-dropdown2 .dropdown2-title {
  padding: 0 8px;
  line-height: 30px;
}
.navy-dropdown2 .dropdown2-container {
  display: grid;
  grid-template-columns: 1fr var(--input-height);
  border: 1px solid var(--primary-border);
  cursor: pointer;
  padding-left: 8px;
  background: var(--input-background);
  align-items: center;
  height: var(--input-height);
}
.navy-dropdown2 .dropdown2-container:hover {
  border-color: var(--primary);
}
.navy-dropdown2 .dropdown2-container.focus {
  border-color: var(--primary);
}
.navy-dropdown {
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
  position: relative;
}
.navy-dropdown .dropdown-container {
  width: 200px;
  right: 0;
  position: absolute;
  background: var(--primary-background);
  padding: 16px 0;
  z-index: 10;
  border: 1px solid var(--primary-border);
  border-radius: var(--input-radius);
  -webkit-box-shadow: 4px 4px 5px 0px var(--primary-shadow);
  -moz-box-shadow: 4px 4px 5px 0px var(--primary-shadow);
  box-shadow: 4px 4px 5px 0px var(--primary-shadow);
  top: calc(var(--input-height) + 8px);
}
.navy-dropdown .dropdown-container.t12 {
  top: calc(var(--input-height) + 12px);
}
.navy-dropdown .dropdown-container::before {
  top: -16px;
  right: 9px;
  left: auto;
  border: 8px solid transparent;
  border-bottom-color: var(--primary-border);
}
.navy-dropdown .dropdown-container::after {
  top: -14px;
  right: 10px;
  left: auto;
  border: 7px solid transparent;
  border-bottom-color: var(--primary-background);
}
.navy-dropdown .dropdown-container::before,
.navy-dropdown .dropdown-container::after {
  position: absolute;
  display: inline-block;
  content: "";
}
.navy-dropdown .dropdown-toggle {
  position: relative;
  cursor: pointer;
  font-size: 20px;
  text-align: right;
  font-weight: 700;
}
.navy-dropdown .dropdown-toggle .button {
  text-align: center;
  height: var(--input-height);
  line-height: var(--input-height);
  width: var(--input-height);
  background-color: var(--input-background);
  border-radius: var(--input-radius);
}
.navy-dropdown .dropdown-toggle .white {
  background: var(--primary-background);
}
.navy-dropdown .dropdown-toggle .button:hover {
  background: var(--primary-hover);
}
.navy-dropdown .dropdown-toggle .primary {
  background: var(--primary-background);
}
.quickedit-toolbar {
  display: grid;
  grid-template-columns: 1fr var(--input-height);
  grid-gap: 8px;
  align-items: center;
}
.quickedit-toolbar.x2:hover {
  grid-template-columns: 1fr var(--input-height) var(--input-height);
}
.quickedit-toolbar .edit,
.quickedit-toolbar .quick-edit {
  display: none;
}
.quickedit-toolbar:hover .edit,
.quickedit-toolbar:hover .quick-edit {
  display: block;
}
.quickedit {
  padding: 16px 16px 32px;
}
.quickedit .ql-container {
  height: 280px;
}
.quickedit .quickcard {
  margin-bottom: 16px;
}
.quickedit-grid {
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 64px;
  margin-bottom: 16px;
}
.toolbar {
  display: flex;
}
.toolbar > div {
  margin-right: 16px;
}
.toolbar > div::last-child {
  margin-right: 0;
}
.rot90 {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  position: relative;
  top: 0;
  top: 2px;
  left: 0;
}
.navy-grid {
  display: grid;
}
.pull-right {
  float: right;
}
.pointer {
  cursor: pointer;
}
.bg-primary {
  background: var(--primary-background);
}
.bg-secondary {
  background: var(--secondary-background);
}
.bg-input {
  background: var(--input-background);
}
.border-none {
  border: none;
}
.border-transparent {
  border-color: transparent;
}
.border-primary {
  border: 1px solid var(--primary-border);
}
.border-top {
  border-top: 1px solid var(--primary-border);
}
.border-bottom {
  border-bottom: 1px solid var(--primary-border);
}
.font12 {
  font-size: 12px;
}
.level-40 {
  padding-left: 1440px;
}
.level-39 {
  padding-left: 1404px;
}
.level-38 {
  padding-left: 1368px;
}
.level-37 {
  padding-left: 1332px;
}
.level-36 {
  padding-left: 1296px;
}
.level-35 {
  padding-left: 1260px;
}
.level-34 {
  padding-left: 1224px;
}
.level-33 {
  padding-left: 1188px;
}
.level-32 {
  padding-left: 1152px;
}
.level-31 {
  padding-left: 1116px;
}
.level-30 {
  padding-left: 1080px;
}
.level-29 {
  padding-left: 1044px;
}
.level-28 {
  padding-left: 1008px;
}
.level-27 {
  padding-left: 972px;
}
.level-26 {
  padding-left: 936px;
}
.level-25 {
  padding-left: 900px;
}
.level-24 {
  padding-left: 864px;
}
.level-23 {
  padding-left: 828px;
}
.level-22 {
  padding-left: 792px;
}
.level-21 {
  padding-left: 756px;
}
.level-20 {
  padding-left: 720px;
}
.level-19 {
  padding-left: 684px;
}
.level-18 {
  padding-left: 648px;
}
.level-17 {
  padding-left: 612px;
}
.level-16 {
  padding-left: 576px;
}
.level-15 {
  padding-left: 540px;
}
.level-14 {
  padding-left: 504px;
}
.level-13 {
  padding-left: 468px;
}
.level-12 {
  padding-left: 432px;
}
.level-11 {
  padding-left: 396px;
}
.level-10 {
  padding-left: 360px;
}
.level-9 {
  padding-left: 324px;
}
.level-8 {
  padding-left: 288px;
}
.level-7 {
  padding-left: 252px;
}
.level-6 {
  padding-left: 216px;
}
.level-5 {
  padding-left: 180px;
}
.level-4 {
  padding-left: 144px;
}
.level-3 {
  padding-left: 108px;
}
.level-2 {
  padding-left: 72px;
}
.level-1 {
  padding-left: 36px;
}
.w1600 {
  width: 1600px;
}
.w1560 {
  width: 1560px;
}
.w1520 {
  width: 1520px;
}
.w1480 {
  width: 1480px;
}
.w1440 {
  width: 1440px;
}
.w1400 {
  width: 1400px;
}
.w1360 {
  width: 1360px;
}
.w1320 {
  width: 1320px;
}
.w1280 {
  width: 1280px;
}
.w1240 {
  width: 1240px;
}
.w1200 {
  width: 1200px;
}
.w1160 {
  width: 1160px;
}
.w1120 {
  width: 1120px;
}
.w1080 {
  width: 1080px;
}
.w1040 {
  width: 1040px;
}
.w1000 {
  width: 1000px;
}
.w960 {
  width: 960px;
}
.w920 {
  width: 920px;
}
.w880 {
  width: 880px;
}
.w840 {
  width: 840px;
}
.w800 {
  width: 800px;
}
.w760 {
  width: 760px;
}
.w720 {
  width: 720px;
}
.w680 {
  width: 680px;
}
.w640 {
  width: 640px;
}
.w600 {
  width: 600px;
}
.w560 {
  width: 560px;
}
.w520 {
  width: 520px;
}
.w480 {
  width: 480px;
}
.w440 {
  width: 440px;
}
.w400 {
  width: 400px;
}
.w360 {
  width: 360px;
}
.w320 {
  width: 320px;
}
.w280 {
  width: 280px;
}
.w240 {
  width: 240px;
}
.w200 {
  width: 200px;
}
.w160 {
  width: 160px;
}
.w120 {
  width: 120px;
}
.w80 {
  width: 80px;
}
.w40 {
  width: 40px;
}
.pt160 {
  padding-top: 160px;
}
.pl160 {
  padding-left: 160px;
}
.pr160 {
  padding-right: 160px;
}
.pb160 {
  padding-bottom: 160px;
}
.pd {
  padding: 160px;
}
.mt160 {
  margin-top: 160px;
}
.pd160 {
  padding: 160px;
}
.mt160 {
  margin-top: 160px;
}
.mb160 {
  margin-bottom: 160px;
}
.ml160 {
  margin-left: 160px;
}
.mr160 {
  margin-right: 160px;
}
.mg160 {
  margin: 160px;
}
.pt156 {
  padding-top: 156px;
}
.pl156 {
  padding-left: 156px;
}
.pr156 {
  padding-right: 156px;
}
.pb156 {
  padding-bottom: 156px;
}
.pd {
  padding: 156px;
}
.mt156 {
  margin-top: 156px;
}
.pd156 {
  padding: 156px;
}
.mt156 {
  margin-top: 156px;
}
.mb156 {
  margin-bottom: 156px;
}
.ml156 {
  margin-left: 156px;
}
.mr156 {
  margin-right: 156px;
}
.mg156 {
  margin: 156px;
}
.pt152 {
  padding-top: 152px;
}
.pl152 {
  padding-left: 152px;
}
.pr152 {
  padding-right: 152px;
}
.pb152 {
  padding-bottom: 152px;
}
.pd {
  padding: 152px;
}
.mt152 {
  margin-top: 152px;
}
.pd152 {
  padding: 152px;
}
.mt152 {
  margin-top: 152px;
}
.mb152 {
  margin-bottom: 152px;
}
.ml152 {
  margin-left: 152px;
}
.mr152 {
  margin-right: 152px;
}
.mg152 {
  margin: 152px;
}
.pt148 {
  padding-top: 148px;
}
.pl148 {
  padding-left: 148px;
}
.pr148 {
  padding-right: 148px;
}
.pb148 {
  padding-bottom: 148px;
}
.pd {
  padding: 148px;
}
.mt148 {
  margin-top: 148px;
}
.pd148 {
  padding: 148px;
}
.mt148 {
  margin-top: 148px;
}
.mb148 {
  margin-bottom: 148px;
}
.ml148 {
  margin-left: 148px;
}
.mr148 {
  margin-right: 148px;
}
.mg148 {
  margin: 148px;
}
.pt144 {
  padding-top: 144px;
}
.pl144 {
  padding-left: 144px;
}
.pr144 {
  padding-right: 144px;
}
.pb144 {
  padding-bottom: 144px;
}
.pd {
  padding: 144px;
}
.mt144 {
  margin-top: 144px;
}
.pd144 {
  padding: 144px;
}
.mt144 {
  margin-top: 144px;
}
.mb144 {
  margin-bottom: 144px;
}
.ml144 {
  margin-left: 144px;
}
.mr144 {
  margin-right: 144px;
}
.mg144 {
  margin: 144px;
}
.pt140 {
  padding-top: 140px;
}
.pl140 {
  padding-left: 140px;
}
.pr140 {
  padding-right: 140px;
}
.pb140 {
  padding-bottom: 140px;
}
.pd {
  padding: 140px;
}
.mt140 {
  margin-top: 140px;
}
.pd140 {
  padding: 140px;
}
.mt140 {
  margin-top: 140px;
}
.mb140 {
  margin-bottom: 140px;
}
.ml140 {
  margin-left: 140px;
}
.mr140 {
  margin-right: 140px;
}
.mg140 {
  margin: 140px;
}
.pt136 {
  padding-top: 136px;
}
.pl136 {
  padding-left: 136px;
}
.pr136 {
  padding-right: 136px;
}
.pb136 {
  padding-bottom: 136px;
}
.pd {
  padding: 136px;
}
.mt136 {
  margin-top: 136px;
}
.pd136 {
  padding: 136px;
}
.mt136 {
  margin-top: 136px;
}
.mb136 {
  margin-bottom: 136px;
}
.ml136 {
  margin-left: 136px;
}
.mr136 {
  margin-right: 136px;
}
.mg136 {
  margin: 136px;
}
.pt132 {
  padding-top: 132px;
}
.pl132 {
  padding-left: 132px;
}
.pr132 {
  padding-right: 132px;
}
.pb132 {
  padding-bottom: 132px;
}
.pd {
  padding: 132px;
}
.mt132 {
  margin-top: 132px;
}
.pd132 {
  padding: 132px;
}
.mt132 {
  margin-top: 132px;
}
.mb132 {
  margin-bottom: 132px;
}
.ml132 {
  margin-left: 132px;
}
.mr132 {
  margin-right: 132px;
}
.mg132 {
  margin: 132px;
}
.pt128 {
  padding-top: 128px;
}
.pl128 {
  padding-left: 128px;
}
.pr128 {
  padding-right: 128px;
}
.pb128 {
  padding-bottom: 128px;
}
.pd {
  padding: 128px;
}
.mt128 {
  margin-top: 128px;
}
.pd128 {
  padding: 128px;
}
.mt128 {
  margin-top: 128px;
}
.mb128 {
  margin-bottom: 128px;
}
.ml128 {
  margin-left: 128px;
}
.mr128 {
  margin-right: 128px;
}
.mg128 {
  margin: 128px;
}
.pt124 {
  padding-top: 124px;
}
.pl124 {
  padding-left: 124px;
}
.pr124 {
  padding-right: 124px;
}
.pb124 {
  padding-bottom: 124px;
}
.pd {
  padding: 124px;
}
.mt124 {
  margin-top: 124px;
}
.pd124 {
  padding: 124px;
}
.mt124 {
  margin-top: 124px;
}
.mb124 {
  margin-bottom: 124px;
}
.ml124 {
  margin-left: 124px;
}
.mr124 {
  margin-right: 124px;
}
.mg124 {
  margin: 124px;
}
.pt120 {
  padding-top: 120px;
}
.pl120 {
  padding-left: 120px;
}
.pr120 {
  padding-right: 120px;
}
.pb120 {
  padding-bottom: 120px;
}
.pd {
  padding: 120px;
}
.mt120 {
  margin-top: 120px;
}
.pd120 {
  padding: 120px;
}
.mt120 {
  margin-top: 120px;
}
.mb120 {
  margin-bottom: 120px;
}
.ml120 {
  margin-left: 120px;
}
.mr120 {
  margin-right: 120px;
}
.mg120 {
  margin: 120px;
}
.pt116 {
  padding-top: 116px;
}
.pl116 {
  padding-left: 116px;
}
.pr116 {
  padding-right: 116px;
}
.pb116 {
  padding-bottom: 116px;
}
.pd {
  padding: 116px;
}
.mt116 {
  margin-top: 116px;
}
.pd116 {
  padding: 116px;
}
.mt116 {
  margin-top: 116px;
}
.mb116 {
  margin-bottom: 116px;
}
.ml116 {
  margin-left: 116px;
}
.mr116 {
  margin-right: 116px;
}
.mg116 {
  margin: 116px;
}
.pt112 {
  padding-top: 112px;
}
.pl112 {
  padding-left: 112px;
}
.pr112 {
  padding-right: 112px;
}
.pb112 {
  padding-bottom: 112px;
}
.pd {
  padding: 112px;
}
.mt112 {
  margin-top: 112px;
}
.pd112 {
  padding: 112px;
}
.mt112 {
  margin-top: 112px;
}
.mb112 {
  margin-bottom: 112px;
}
.ml112 {
  margin-left: 112px;
}
.mr112 {
  margin-right: 112px;
}
.mg112 {
  margin: 112px;
}
.pt108 {
  padding-top: 108px;
}
.pl108 {
  padding-left: 108px;
}
.pr108 {
  padding-right: 108px;
}
.pb108 {
  padding-bottom: 108px;
}
.pd {
  padding: 108px;
}
.mt108 {
  margin-top: 108px;
}
.pd108 {
  padding: 108px;
}
.mt108 {
  margin-top: 108px;
}
.mb108 {
  margin-bottom: 108px;
}
.ml108 {
  margin-left: 108px;
}
.mr108 {
  margin-right: 108px;
}
.mg108 {
  margin: 108px;
}
.pt104 {
  padding-top: 104px;
}
.pl104 {
  padding-left: 104px;
}
.pr104 {
  padding-right: 104px;
}
.pb104 {
  padding-bottom: 104px;
}
.pd {
  padding: 104px;
}
.mt104 {
  margin-top: 104px;
}
.pd104 {
  padding: 104px;
}
.mt104 {
  margin-top: 104px;
}
.mb104 {
  margin-bottom: 104px;
}
.ml104 {
  margin-left: 104px;
}
.mr104 {
  margin-right: 104px;
}
.mg104 {
  margin: 104px;
}
.pt100 {
  padding-top: 100px;
}
.pl100 {
  padding-left: 100px;
}
.pr100 {
  padding-right: 100px;
}
.pb100 {
  padding-bottom: 100px;
}
.pd {
  padding: 100px;
}
.mt100 {
  margin-top: 100px;
}
.pd100 {
  padding: 100px;
}
.mt100 {
  margin-top: 100px;
}
.mb100 {
  margin-bottom: 100px;
}
.ml100 {
  margin-left: 100px;
}
.mr100 {
  margin-right: 100px;
}
.mg100 {
  margin: 100px;
}
.pt96 {
  padding-top: 96px;
}
.pl96 {
  padding-left: 96px;
}
.pr96 {
  padding-right: 96px;
}
.pb96 {
  padding-bottom: 96px;
}
.pd {
  padding: 96px;
}
.mt96 {
  margin-top: 96px;
}
.pd96 {
  padding: 96px;
}
.mt96 {
  margin-top: 96px;
}
.mb96 {
  margin-bottom: 96px;
}
.ml96 {
  margin-left: 96px;
}
.mr96 {
  margin-right: 96px;
}
.mg96 {
  margin: 96px;
}
.pt92 {
  padding-top: 92px;
}
.pl92 {
  padding-left: 92px;
}
.pr92 {
  padding-right: 92px;
}
.pb92 {
  padding-bottom: 92px;
}
.pd {
  padding: 92px;
}
.mt92 {
  margin-top: 92px;
}
.pd92 {
  padding: 92px;
}
.mt92 {
  margin-top: 92px;
}
.mb92 {
  margin-bottom: 92px;
}
.ml92 {
  margin-left: 92px;
}
.mr92 {
  margin-right: 92px;
}
.mg92 {
  margin: 92px;
}
.pt88 {
  padding-top: 88px;
}
.pl88 {
  padding-left: 88px;
}
.pr88 {
  padding-right: 88px;
}
.pb88 {
  padding-bottom: 88px;
}
.pd {
  padding: 88px;
}
.mt88 {
  margin-top: 88px;
}
.pd88 {
  padding: 88px;
}
.mt88 {
  margin-top: 88px;
}
.mb88 {
  margin-bottom: 88px;
}
.ml88 {
  margin-left: 88px;
}
.mr88 {
  margin-right: 88px;
}
.mg88 {
  margin: 88px;
}
.pt84 {
  padding-top: 84px;
}
.pl84 {
  padding-left: 84px;
}
.pr84 {
  padding-right: 84px;
}
.pb84 {
  padding-bottom: 84px;
}
.pd {
  padding: 84px;
}
.mt84 {
  margin-top: 84px;
}
.pd84 {
  padding: 84px;
}
.mt84 {
  margin-top: 84px;
}
.mb84 {
  margin-bottom: 84px;
}
.ml84 {
  margin-left: 84px;
}
.mr84 {
  margin-right: 84px;
}
.mg84 {
  margin: 84px;
}
.pt80 {
  padding-top: 80px;
}
.pl80 {
  padding-left: 80px;
}
.pr80 {
  padding-right: 80px;
}
.pb80 {
  padding-bottom: 80px;
}
.pd {
  padding: 80px;
}
.mt80 {
  margin-top: 80px;
}
.pd80 {
  padding: 80px;
}
.mt80 {
  margin-top: 80px;
}
.mb80 {
  margin-bottom: 80px;
}
.ml80 {
  margin-left: 80px;
}
.mr80 {
  margin-right: 80px;
}
.mg80 {
  margin: 80px;
}
.pt76 {
  padding-top: 76px;
}
.pl76 {
  padding-left: 76px;
}
.pr76 {
  padding-right: 76px;
}
.pb76 {
  padding-bottom: 76px;
}
.pd {
  padding: 76px;
}
.mt76 {
  margin-top: 76px;
}
.pd76 {
  padding: 76px;
}
.mt76 {
  margin-top: 76px;
}
.mb76 {
  margin-bottom: 76px;
}
.ml76 {
  margin-left: 76px;
}
.mr76 {
  margin-right: 76px;
}
.mg76 {
  margin: 76px;
}
.pt72 {
  padding-top: 72px;
}
.pl72 {
  padding-left: 72px;
}
.pr72 {
  padding-right: 72px;
}
.pb72 {
  padding-bottom: 72px;
}
.pd {
  padding: 72px;
}
.mt72 {
  margin-top: 72px;
}
.pd72 {
  padding: 72px;
}
.mt72 {
  margin-top: 72px;
}
.mb72 {
  margin-bottom: 72px;
}
.ml72 {
  margin-left: 72px;
}
.mr72 {
  margin-right: 72px;
}
.mg72 {
  margin: 72px;
}
.pt68 {
  padding-top: 68px;
}
.pl68 {
  padding-left: 68px;
}
.pr68 {
  padding-right: 68px;
}
.pb68 {
  padding-bottom: 68px;
}
.pd {
  padding: 68px;
}
.mt68 {
  margin-top: 68px;
}
.pd68 {
  padding: 68px;
}
.mt68 {
  margin-top: 68px;
}
.mb68 {
  margin-bottom: 68px;
}
.ml68 {
  margin-left: 68px;
}
.mr68 {
  margin-right: 68px;
}
.mg68 {
  margin: 68px;
}
.pt64 {
  padding-top: 64px;
}
.pl64 {
  padding-left: 64px;
}
.pr64 {
  padding-right: 64px;
}
.pb64 {
  padding-bottom: 64px;
}
.pd {
  padding: 64px;
}
.mt64 {
  margin-top: 64px;
}
.pd64 {
  padding: 64px;
}
.mt64 {
  margin-top: 64px;
}
.mb64 {
  margin-bottom: 64px;
}
.ml64 {
  margin-left: 64px;
}
.mr64 {
  margin-right: 64px;
}
.mg64 {
  margin: 64px;
}
.pt60 {
  padding-top: 60px;
}
.pl60 {
  padding-left: 60px;
}
.pr60 {
  padding-right: 60px;
}
.pb60 {
  padding-bottom: 60px;
}
.pd {
  padding: 60px;
}
.mt60 {
  margin-top: 60px;
}
.pd60 {
  padding: 60px;
}
.mt60 {
  margin-top: 60px;
}
.mb60 {
  margin-bottom: 60px;
}
.ml60 {
  margin-left: 60px;
}
.mr60 {
  margin-right: 60px;
}
.mg60 {
  margin: 60px;
}
.pt56 {
  padding-top: 56px;
}
.pl56 {
  padding-left: 56px;
}
.pr56 {
  padding-right: 56px;
}
.pb56 {
  padding-bottom: 56px;
}
.pd {
  padding: 56px;
}
.mt56 {
  margin-top: 56px;
}
.pd56 {
  padding: 56px;
}
.mt56 {
  margin-top: 56px;
}
.mb56 {
  margin-bottom: 56px;
}
.ml56 {
  margin-left: 56px;
}
.mr56 {
  margin-right: 56px;
}
.mg56 {
  margin: 56px;
}
.pt52 {
  padding-top: 52px;
}
.pl52 {
  padding-left: 52px;
}
.pr52 {
  padding-right: 52px;
}
.pb52 {
  padding-bottom: 52px;
}
.pd {
  padding: 52px;
}
.mt52 {
  margin-top: 52px;
}
.pd52 {
  padding: 52px;
}
.mt52 {
  margin-top: 52px;
}
.mb52 {
  margin-bottom: 52px;
}
.ml52 {
  margin-left: 52px;
}
.mr52 {
  margin-right: 52px;
}
.mg52 {
  margin: 52px;
}
.pt48 {
  padding-top: 48px;
}
.pl48 {
  padding-left: 48px;
}
.pr48 {
  padding-right: 48px;
}
.pb48 {
  padding-bottom: 48px;
}
.pd {
  padding: 48px;
}
.mt48 {
  margin-top: 48px;
}
.pd48 {
  padding: 48px;
}
.mt48 {
  margin-top: 48px;
}
.mb48 {
  margin-bottom: 48px;
}
.ml48 {
  margin-left: 48px;
}
.mr48 {
  margin-right: 48px;
}
.mg48 {
  margin: 48px;
}
.pt44 {
  padding-top: 44px;
}
.pl44 {
  padding-left: 44px;
}
.pr44 {
  padding-right: 44px;
}
.pb44 {
  padding-bottom: 44px;
}
.pd {
  padding: 44px;
}
.mt44 {
  margin-top: 44px;
}
.pd44 {
  padding: 44px;
}
.mt44 {
  margin-top: 44px;
}
.mb44 {
  margin-bottom: 44px;
}
.ml44 {
  margin-left: 44px;
}
.mr44 {
  margin-right: 44px;
}
.mg44 {
  margin: 44px;
}
.pt40 {
  padding-top: 40px;
}
.pl40 {
  padding-left: 40px;
}
.pr40 {
  padding-right: 40px;
}
.pb40 {
  padding-bottom: 40px;
}
.pd {
  padding: 40px;
}
.mt40 {
  margin-top: 40px;
}
.pd40 {
  padding: 40px;
}
.mt40 {
  margin-top: 40px;
}
.mb40 {
  margin-bottom: 40px;
}
.ml40 {
  margin-left: 40px;
}
.mr40 {
  margin-right: 40px;
}
.mg40 {
  margin: 40px;
}
.pt36 {
  padding-top: 36px;
}
.pl36 {
  padding-left: 36px;
}
.pr36 {
  padding-right: 36px;
}
.pb36 {
  padding-bottom: 36px;
}
.pd {
  padding: 36px;
}
.mt36 {
  margin-top: 36px;
}
.pd36 {
  padding: 36px;
}
.mt36 {
  margin-top: 36px;
}
.mb36 {
  margin-bottom: 36px;
}
.ml36 {
  margin-left: 36px;
}
.mr36 {
  margin-right: 36px;
}
.mg36 {
  margin: 36px;
}
.pt32 {
  padding-top: 32px;
}
.pl32 {
  padding-left: 32px;
}
.pr32 {
  padding-right: 32px;
}
.pb32 {
  padding-bottom: 32px;
}
.pd {
  padding: 32px;
}
.mt32 {
  margin-top: 32px;
}
.pd32 {
  padding: 32px;
}
.mt32 {
  margin-top: 32px;
}
.mb32 {
  margin-bottom: 32px;
}
.ml32 {
  margin-left: 32px;
}
.mr32 {
  margin-right: 32px;
}
.mg32 {
  margin: 32px;
}
.pt28 {
  padding-top: 28px;
}
.pl28 {
  padding-left: 28px;
}
.pr28 {
  padding-right: 28px;
}
.pb28 {
  padding-bottom: 28px;
}
.pd {
  padding: 28px;
}
.mt28 {
  margin-top: 28px;
}
.pd28 {
  padding: 28px;
}
.mt28 {
  margin-top: 28px;
}
.mb28 {
  margin-bottom: 28px;
}
.ml28 {
  margin-left: 28px;
}
.mr28 {
  margin-right: 28px;
}
.mg28 {
  margin: 28px;
}
.pt24 {
  padding-top: 24px;
}
.pl24 {
  padding-left: 24px;
}
.pr24 {
  padding-right: 24px;
}
.pb24 {
  padding-bottom: 24px;
}
.pd {
  padding: 24px;
}
.mt24 {
  margin-top: 24px;
}
.pd24 {
  padding: 24px;
}
.mt24 {
  margin-top: 24px;
}
.mb24 {
  margin-bottom: 24px;
}
.ml24 {
  margin-left: 24px;
}
.mr24 {
  margin-right: 24px;
}
.mg24 {
  margin: 24px;
}
.pt20 {
  padding-top: 20px;
}
.pl20 {
  padding-left: 20px;
}
.pr20 {
  padding-right: 20px;
}
.pb20 {
  padding-bottom: 20px;
}
.pd {
  padding: 20px;
}
.mt20 {
  margin-top: 20px;
}
.pd20 {
  padding: 20px;
}
.mt20 {
  margin-top: 20px;
}
.mb20 {
  margin-bottom: 20px;
}
.ml20 {
  margin-left: 20px;
}
.mr20 {
  margin-right: 20px;
}
.mg20 {
  margin: 20px;
}
.pt16 {
  padding-top: 16px;
}
.pl16 {
  padding-left: 16px;
}
.pr16 {
  padding-right: 16px;
}
.pb16 {
  padding-bottom: 16px;
}
.pd {
  padding: 16px;
}
.mt16 {
  margin-top: 16px;
}
.pd16 {
  padding: 16px;
}
.mt16 {
  margin-top: 16px;
}
.mb16 {
  margin-bottom: 16px;
}
.ml16 {
  margin-left: 16px;
}
.mr16 {
  margin-right: 16px;
}
.mg16 {
  margin: 16px;
}
.pt12 {
  padding-top: 12px;
}
.pl12 {
  padding-left: 12px;
}
.pr12 {
  padding-right: 12px;
}
.pb12 {
  padding-bottom: 12px;
}
.pd {
  padding: 12px;
}
.mt12 {
  margin-top: 12px;
}
.pd12 {
  padding: 12px;
}
.mt12 {
  margin-top: 12px;
}
.mb12 {
  margin-bottom: 12px;
}
.ml12 {
  margin-left: 12px;
}
.mr12 {
  margin-right: 12px;
}
.mg12 {
  margin: 12px;
}
.pt8 {
  padding-top: 8px;
}
.pl8 {
  padding-left: 8px;
}
.pr8 {
  padding-right: 8px;
}
.pb8 {
  padding-bottom: 8px;
}
.pd {
  padding: 8px;
}
.mt8 {
  margin-top: 8px;
}
.pd8 {
  padding: 8px;
}
.mt8 {
  margin-top: 8px;
}
.mb8 {
  margin-bottom: 8px;
}
.ml8 {
  margin-left: 8px;
}
.mr8 {
  margin-right: 8px;
}
.mg8 {
  margin: 8px;
}
.pt4 {
  padding-top: 4px;
}
.pl4 {
  padding-left: 4px;
}
.pr4 {
  padding-right: 4px;
}
.pb4 {
  padding-bottom: 4px;
}
.pd {
  padding: 4px;
}
.mt4 {
  margin-top: 4px;
}
.pd4 {
  padding: 4px;
}
.mt4 {
  margin-top: 4px;
}
.mb4 {
  margin-bottom: 4px;
}
.ml4 {
  margin-left: 4px;
}
.mr4 {
  margin-right: 4px;
}
.mg4 {
  margin: 4px;
}
.no-padding {
  padding: 0;
}
.bb {
  border-bottom: 1px solid var(--primary-border);
}
.separator {
  border-bottom: 1px solid var(--primary-border);
}
.navy-grid12 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
}
[class*="navy-grid12"] > [class*="col-12"] {
  grid-column: span 12;
}
[class*="navy-grid12"] > [class*="col-11"] {
  grid-column: span 11;
}
[class*="navy-grid12"] > [class*="col-10"] {
  grid-column: span 10;
}
[class*="navy-grid12"] > [class*="col-9"] {
  grid-column: span 9;
}
[class*="navy-grid12"] > [class*="col-8"] {
  grid-column: span 8;
}
[class*="navy-grid12"] > [class*="col-7"] {
  grid-column: span 7;
}
[class*="navy-grid12"] > [class*="col-6"] {
  grid-column: span 6;
}
[class*="navy-grid12"] > [class*="col-5"] {
  grid-column: span 5;
}
[class*="navy-grid12"] > [class*="col-4"] {
  grid-column: span 4;
}
[class*="navy-grid12"] > [class*="col-3"] {
  grid-column: span 3;
}
[class*="navy-grid12"] > [class*="col-2"] {
  grid-column: span 2;
}
[class*="navy-grid12"] > [class*="col-1"] {
  grid-column: span 1;
}
@media screen and (max-width: 85rem) {
  [class*="navy-grid12"] > [class*="_md-12"] {
    grid-column: span 12;
  }
  [class*="navy-grid12"] > [class*="_md-11"] {
    grid-column: span 11;
  }
  [class*="navy-grid12"] > [class*="_md-10"] {
    grid-column: span 10;
  }
  [class*="navy-grid12"] > [class*="_md-9"] {
    grid-column: span 9;
  }
  [class*="navy-grid12"] > [class*="_md-8"] {
    grid-column: span 8;
  }
  [class*="navy-grid12"] > [class*="_md-7"] {
    grid-column: span 7;
  }
  [class*="navy-grid12"] > [class*="_md-6"] {
    grid-column: span 6;
  }
  [class*="navy-grid12"] > [class*="_md-5"] {
    grid-column: span 5;
  }
  [class*="navy-grid12"] > [class*="_md-4"] {
    grid-column: span 4;
  }
  [class*="navy-grid12"] > [class*="_md-3"] {
    grid-column: span 3;
  }
  [class*="navy-grid12"] > [class*="_md-2"] {
    grid-column: span 2;
  }
  [class*="navy-grid12"] > [class*="_md-1"] {
    grid-column: span 1;
  }
}
@media screen and (max-width: 40rem) {
  [class*="navy-grid12"] > [class*="_xs-12"] {
    grid-column: span 12;
  }
  [class*="navy-grid12"] > [class*="_xs-11"] {
    grid-column: span 11;
  }
  [class*="navy-grid12"] > [class*="_xs-10"] {
    grid-column: span 10;
  }
  [class*="navy-grid12"] > [class*="_xs-9"] {
    grid-column: span 9;
  }
  [class*="navy-grid12"] > [class*="_xs-8"] {
    grid-column: span 8;
  }
  [class*="navy-grid12"] > [class*="_xs-7"] {
    grid-column: span 7;
  }
  [class*="navy-grid12"] > [class*="_xs-6"] {
    grid-column: span 6;
  }
  [class*="navy-grid12"] > [class*="_xs-5"] {
    grid-column: span 5;
  }
  [class*="navy-grid12"] > [class*="_xs-4"] {
    grid-column: span 4;
  }
  [class*="navy-grid12"] > [class*="_xs-3"] {
    grid-column: span 3;
  }
  [class*="navy-grid12"] > [class*="_xs-2"] {
    grid-column: span 2;
  }
  [class*="navy-grid12"] > [class*="_xs-1"] {
    grid-column: span 1;
  }
}
.gap-16 {
  grid-gap: 16px;
}
.gap-32 {
  grid-gap: 32px;
}
.gap-64 {
  grid-gap: 64px;
}
.poststatus {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  margin-right: 8px;
  position: relative;
  top: 1px;
}
.poststatus.status-0 {
  background: #bdbdbd;
}
.poststatus.status-2 {
  background: #f9a825;
}
.poststatus.status-1 {
  background: #4caf50;
}
.poststatus .order-status-3,
.poststatus .adjust-status-1 {
  background: #00bcd4;
}
.poststatus .order-status-4 {
  background: #2196f3;
}
.text-uppercase {
  text-transform: uppercase;
}
.text-underline {
  text-decoration: underline;
}
.text-capitalize {
  text-transform: capitalize;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-left {
  text-align: left;
}
.text-justify {
  text-align: justify;
}
.text-hover:hover {
  color: var(--active-color);
}
.ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.sub-text {
  color: var(--secondary-color);
  font-size: calc(font-size - 2px);
}
.text-secondary {
  color: var(--secondary-color);
}
.ellipsis {
  text-overflow: ellipsis;
  /* Required for text-overflow to do anything */
  white-space: nowrap;
  overflow: hidden;
}
.cell-40 {
  width: calc(40 * var(--cell-unit));
}
.cell-39 {
  width: calc(39 * var(--cell-unit));
}
.cell-38 {
  width: calc(38 * var(--cell-unit));
}
.cell-37 {
  width: calc(37 * var(--cell-unit));
}
.cell-36 {
  width: calc(36 * var(--cell-unit));
}
.cell-35 {
  width: calc(35 * var(--cell-unit));
}
.cell-34 {
  width: calc(34 * var(--cell-unit));
}
.cell-33 {
  width: calc(33 * var(--cell-unit));
}
.cell-32 {
  width: calc(32 * var(--cell-unit));
}
.cell-31 {
  width: calc(31 * var(--cell-unit));
}
.cell-30 {
  width: calc(30 * var(--cell-unit));
}
.cell-29 {
  width: calc(29 * var(--cell-unit));
}
.cell-28 {
  width: calc(28 * var(--cell-unit));
}
.cell-27 {
  width: calc(27 * var(--cell-unit));
}
.cell-26 {
  width: calc(26 * var(--cell-unit));
}
.cell-25 {
  width: calc(25 * var(--cell-unit));
}
.cell-24 {
  width: calc(24 * var(--cell-unit));
}
.cell-23 {
  width: calc(23 * var(--cell-unit));
}
.cell-22 {
  width: calc(22 * var(--cell-unit));
}
.cell-21 {
  width: calc(21 * var(--cell-unit));
}
.cell-20 {
  width: calc(20 * var(--cell-unit));
}
.cell-19 {
  width: calc(19 * var(--cell-unit));
}
.cell-18 {
  width: calc(18 * var(--cell-unit));
}
.cell-17 {
  width: calc(17 * var(--cell-unit));
}
.cell-16 {
  width: calc(16 * var(--cell-unit));
}
.cell-15 {
  width: calc(15 * var(--cell-unit));
}
.cell-14 {
  width: calc(14 * var(--cell-unit));
}
.cell-13 {
  width: calc(13 * var(--cell-unit));
}
.cell-12 {
  width: calc(12 * var(--cell-unit));
}
.cell-11 {
  width: calc(11 * var(--cell-unit));
}
.cell-10 {
  width: calc(10 * var(--cell-unit));
}
.cell-9 {
  width: calc(9 * var(--cell-unit));
}
.cell-8 {
  width: calc(8 * var(--cell-unit));
}
.cell-7 {
  width: calc(7 * var(--cell-unit));
}
.cell-6 {
  width: calc(6 * var(--cell-unit));
}
.cell-5 {
  width: calc(5 * var(--cell-unit));
}
.cell-4 {
  width: calc(4 * var(--cell-unit));
}
.cell-3 {
  width: calc(3 * var(--cell-unit));
}
.cell-2 {
  width: calc(2 * var(--cell-unit));
}
.cell-1 {
  width: calc(1 * var(--cell-unit));
}
.ql-toolbar.ql-snow {
  background-color: var(--input-background);
  border: 1px solid var(--primary-border);
}
.ql-container.ql-snow {
  background-color: transparent;
  border: 1px solid var(--primary-border);
  color: var(--primary-color);
}
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
  fill: var(--primary-color);
}
.ql-snow .ql-picker {
  color: var(--primary-color);
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: var(--primary-color);
}
.ql-snow .ql-toolbar.snow,
.ql-snow .ql-stroke {
  stroke: var(--primary-color);
}
ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  color: var(--primary);
}
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: var(--primary);
}
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-mitter,
.ql-snow .ql-toolbar button:hover .ql-stroke-mitter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-mitter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-mitter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-mitter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-mitter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-mitter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-mitter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-mitter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-mitter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-mitter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-mitter {
  stroke: var(--primary);
}
.ql-editor.ql-blank::before {
  color: rgba(255, 99, 71, 0.6);
}
.ql-container {
  height: 560px;
  overflow: hidden;
}
.ql-snow .ql-editor img {
  max-width: 60%;
}
.ql-snow .ql-tooltip {
  background-color: var(--primary-background);
  border-color: var(--primary-border);
}
.ql-snow .ql-tooltip input[type=text] {
  display: none;
  border-color: var(--primary-border);
  background-color: var(--input-background);
  height: var(--input-height);
}
.ql-snow .ql-tooltip a {
  color: var(--primary);
  line-height: var(--input-height);
}
.ql-snow .ql-editor {
  background-color: var(--input-background);
}
.flatpickr-calendar {
  background: var(--input-background);
  -webkit-box-shadow: 1px 0 0 var(--primary-border), -1px 0 0 var(--primary-border), 0 1px 0 var(--primary-border), 0 -1px 0 var(--primary-border), 0 3px 13px rgba(0, 0, 0, 0.08);
  box-shadow: 1px 0 0 var(--primary-border), -1px 0 0 var(--primary-border), 0 1px 0 var(--primary-border), 0 -1px 0 var(--primary-border), 0 3px 13px rgba(0, 0, 0, 0.08);
}
.flatpickr-calendar.open {
  margin-top: 8px;
  border-radius: var(--input-radius);
  border-color: var(--primary-border);
}
.flatpickr-calendar.open.arrowBottom {
  margin-top: -4px;
}
.flatpickr-calendar .showTimeInput.hasTime .flatpickr-time {
  border-top-color: var(--primary-border);
}
.flatpickr-day {
  color: var(--primary-color);
}
.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  background: var(--primary-active);
  border-color: var(--primary-active);
  color: var(--active-color);
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: var(--primary-active);
  border-color: var(--primary-active);
  color: var(--active-color);
}
.flatpickr-current-month .flatpickr-monthDropdown-months {
  font-weight: 400;
  font-size: 18px;
}
.flatpickr-current-month input.cur-year {
  font-weight: 400;
}
span.flatpickr-weekday {
  color: var(--primary-color);
}
.flatpickr-months .flatpickr-month {
  color: var(--primary-color);
  height: var(--input-height);
}
.numInputWrapper:hover {
  background: var(--primary-active);
}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  background: var(--primary-active);
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
  background: var(--input-background);
  border: var(--primary-border);
}
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
.flatpickr-months .flatpickr-next-month.flatpickr-next-month,
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
  fill: var(--primary-color);
}
.flatpickr-current-month .numInputWrapper {
  width: 64px;
  font-size: 18px;
}
.flatpickr-current-month .numInputWrapper span.arrowUp:after {
  border-bottom-color: var(--active-color);
}
.flatpickr-current-month .numInputWrapper span.arrowDown:after {
  border-top-color: var(--active-color);
}
.flatpickr-calendar.arrowTop:before {
  border-bottom-color: var(--primary-border);
}
.flatpickr-calendar.arrowTop:after {
  border-bottom-color: var(--input-background);
}
.flatpickr-calendar.arrowBottom:after {
  border-top-color: var(--input-background);
}
.flatpickr-calendar.arrowBottom:before {
  border-top-color: var(--primary-border);
}
.flatpickr-time .flatpickr-time-separator,
.flatpickr-time .flatpickr-am-pm,
.flatpickr-time input {
  color: var(--primary-color);
}
.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time .flatpickr-am-pm:focus {
  background: var(--primary-active);
}
.flatpickr-time .numInputWrapper span.arrowUp:after {
  border-bottom-color: var(--active-color);
}
.flatpickr-time .numInputWrapper span.arrowDown:after {
  border-top-color: var(--active-color);
}
.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time {
  height: 40px;
  border-top: 1px solid var(--primary-border);
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay,
.flatpickr-day.notAllowed,
.flatpickr-day.notAllowed.prevMonthDay,
.flatpickr-day.notAllowed.nextMonthDay {
  color: var(--primary-color);
  opacity: 0.5;
}
.printable {
  visibility: hidden;
  display: none;
  background: #FFF;
  float: none;
  page-break-after: always;
  page-break-before: always;
}
.page-break {
  display: none;
}
/*//        min-height: 297mm;*/
/*  max-width: 81mm;*/
.page {
  width: 100%;
  padding: 0;
  margin: 2.5mm auto;
  background: white;
  color: #000;
}
.page strong {
  color: #000;
}
@media print {
  #printable:last-child {
    page-break-after: auto;
  }
  body * {
    visibility: hidden;
  }
  .printable,
  .printable * {
    visibility: visible;
  }
  .printable {
    display: block !important;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background: #FFF;
  }
  .printable .inventory_name {
    font-weight: 700;
  }
  .printable h1 {
    font-size: 30px;
    margin-bottom: 10px;
  }
  .printable .subtitle {
    margin-bottom: 50px;
    font-style: italic;
  }
  .page-break {
    display: block;
    page-break-before: always;
  }
}
/*
.page {
        width: 210mm;
        min-height: 297mm;
        padding: 20mm;
        margin: 10mm auto;
        border: 1px #D3D3D3 solid;
        border-radius: 5px;
        background: white;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    }
    .subpage {
        padding: 1cm;
        border: 5px red solid;
        height: 257mm;
        outline: 2cm #FFEAEA solid;
    }
    
    @page {
        size: A4;
        margin: 0;
    }
    @media print {
        html, body {
            width: 210mm;
            height: 297mm;        
        }
        .page {
            margin: 0;
            border: initial;
            border-radius: initial;
            width: initial;
            min-height: initial;
            box-shadow: initial;
            background: initial;
            page-break-after: always;
        }


    }


    <div class="book">
    <div class="page">
        <div class="subpage">Page 1/2</div>    
    </div>
    <div class="page">
        <div class="subpage">Page 2/2</div>    
    </div>
</div>
    */
@page {
  margin: 0;
}
body {
  margin: 0;
}
.sheet {
  margin: 0;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  page-break-after: always;
}
/** Paper sizes **/
body.A3 .sheet {
  width: 297mm;
  height: 419mm;
}
body.A3.landscape .sheet {
  width: 420mm;
  height: 296mm;
}
body.A4 .sheet {
  width: 210mm;
  height: 296mm;
}
body.A4.landscape .sheet {
  width: 297mm;
  height: 209mm;
}
body.A5 .sheet {
  width: 148mm;
  height: 209mm;
}
body.A5.landscape .sheet {
  width: 210mm;
  height: 147mm;
}
body.letter .sheet {
  width: 216mm;
  height: 279mm;
}
body.letter.landscape .sheet {
  width: 280mm;
  height: 215mm;
}
body.legal .sheet {
  width: 216mm;
  height: 356mm;
}
body.legal.landscape .sheet {
  width: 357mm;
  height: 215mm;
}
/** Padding area **/
.sheet.padding-10mm {
  padding: 10mm;
}
.sheet.padding-15mm {
  padding: 15mm;
}
.sheet.padding-20mm {
  padding: 20mm;
}
.sheet.padding-25mm {
  padding: 25mm;
}
/** Fix for Chrome issue #273306 **/
@media print {
  body {
    background: #e0e0e0;
  }
  .sheet {
    background: white;
    box-shadow: 0 0.5mm 2mm rgba(0, 0, 0, 0.3);
    margin: 5mm auto;
  }
  body.A3.landscape {
    width: 420mm;
  }
  body.A3,
  body.A4.landscape {
    width: 297mm;
  }
  body.A4,
  body.A5.landscape {
    width: 210mm;
  }
  body.A5 {
    width: 148mm;
  }
  body.letter,
  body.legal {
    width: 216mm;
  }
  body.letter.landscape {
    width: 280mm;
  }
  body.legal.landscape {
    width: 357mm;
  }
}
.grid-line {
  display: grid;
  grid-template-columns: 1fr var(--input-height);
  align-items: end;
}
#app-order .view-content {
  height: 100%;
}
#app-order .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-order .order-collection {
  display: grid;
  grid-template-columns: 100px minmax(260px, 1fr) 2fr 132px 132px 3fr 264px 88px;
  align-items: center;
  min-height: 44px;
}
#app-order .cart-grid {
  grid-template-columns: 1fr 420px;
  height: 100%;
}
#app-order .cart-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 8fr) 3fr 3fr 2fr 264px;
  align-items: center;
  padding: 8px;
  grid-gap: 8px;
}
#app-order .search-product {
  position: relative;
}
#app-order .search-result {
  display: none;
}
#app-order .search-result.open {
  display: block;
}
#app-order .info-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  height: 36px;
}
#app-order .info-row .val {
  text-align: right;
}
#app-order .order--discounttype {
  display: grid;
  grid-template-columns: 36px 36px 1fr;
  justify-items: center;
  align-items: center;
}
#app-order .order--discounttype .discounttype {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 36px;
  text-align: center;
  border: 1px solid var(--primary-border);
  cursor: pointer;
}
#app-order .order--discounttype .discounttype:hover {
  border-color: var(--primary);
}
#app-order .order--discounttype .discounttype.active {
  background-color: var(--primary);
  color: #FFF;
}
#app-order .search-customer {
  position: relative;
}
#app-order .search-customer .vertical li {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
#app-order .search-result {
  pointer-events: initial;
}
#app-order .discount_label {
  text-transform: uppercase;
  font-weight: 600;
}
#app-order .activity-row {
  display: grid;
  grid-template-columns: 36px 200px 160px 1fr;
  line-height: 36px;
  padding: 8px 0;
}
#app-order .order-information {
  height: 100%;
  background-color: var(--primary-background);
}
#login {
  display: grid;
  align-items: center;
  justify-items: center;
  height: 100%;
}
#login .login-panel {
  width: 360px;
  display: grid;
  grid-template-rows: 1fr 100px;
  height: 100%;
}
#login .login-panel .login {
  align-self: center;
}
#login .login-panel .login .logo {
  width: 75%;
  margin: 32px auto;
}
#login .login-panel .copyright {
  align-self: end;
}
#login .login-panel .copyright img {
  width: 50%;
  margin: 16px auto;
}
#app-customer .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-customer .customer-collection {
  display: grid;
  grid-template-columns: 48px minmax(280px, 3fr) 5fr 2fr 6fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-customer .customer-collection .customer-information {
  --column-width-min: 120px;
  grid-template-columns: 1fr var(--column-width-min);
}
#app-customer .customer-collection .service-information {
  grid-template-columns: 1fr 132px;
  align-items: center;
  grid-gap: 16px;
}
#app-customer .customer-collection .service-information .service-attribute {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
#app-customer .customer-collection .avatar {
  justify-self: center;
}
#app-customer .customer-collection .avatar img {
  width: 36px;
  border-radius: 50%;
}
#app-customer .histories {
  padding: 16px;
  background-color: var(--primary-background);
}
#app-customer .histories .history-collection {
  display: grid;
  grid-template-columns: 44px minmax(260px, 3fr) 4fr 3fr 3fr 4fr 4fr 88px;
  align-items: center;
  padding: 8px 0;
}
#app-customer .contacts {
  padding: 16px;
  background-color: var(--primary-background);
}
#app-customer .contacts .contact-collection {
  display: grid;
  grid-template-columns: 44px minmax(260px, 3fr) 3fr 3fr 3fr 4fr 3fr 3fr 88px;
  align-items: center;
  padding: 8px 0;
}
#app-customer .customer-tags {
  padding: 0 16px;
}
#app-customer .customer-tags .tag.active {
  background-color: var(--primary);
  color: #ffffff;
}
#app-customer .avatar-box {
  width: 320px;
}
#app-customer .media-grid {
  grid-template-columns: 120px 1fr 36px 36px 36px;
  align-items: center;
}
#app-customer .media-grid .tool {
  text-align: center;
}
#app-customer .media-collection {
  display: grid;
  grid-template-columns: 320px 1fr 120px;
  align-items: center;
  min-height: 52px;
  grid-gap: 16px;
}
#app-customer .media-collection .img {
  width: 80px;
}
#app-customer .invoice-collection {
  display: grid;
  grid-template-columns: 120px  5fr 3fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-customer .customer-profile {
  padding: 16px;
}
#app-customer .customer-profile .information {
  grid-template-columns: 320px 1fr;
  grid-gap: 16px;
}
#app-customer .customer-profile .information .avatar {
  position: relative;
}
#app-customer .customer-profile .information .avatar .edit {
  position: absolute;
  top: 8px;
  right: 8px;
}
#app-customer .customer-profile .contact-collection {
  display: grid;
  grid-template-columns: 44px minmax(260px, 3fr) 3fr 3fr 3fr 4fr 3fr 3fr 88px;
  align-items: center;
  padding: 8px 0;
}
#app-customer .customer-profile .order-collection {
  display: grid;
  grid-template-columns: 52px 132px 132px 132px 132px 164px 2fr 264px;
  align-items: center;
  min-height: 44px;
}
#app-customer .customer-profile .product-collection {
  display: grid;
  grid-template-columns: 44px minmax(260px, 2fr) 1fr 1fr 1fr 264px;
  align-items: center;
  min-height: 44px;
}
#app-customer .resident-input .navy-button {
  pointer-events: auto;
}
@media screen and (max-width: 1279px) {
  #app-customer .customer-collection {
    grid-template-columns: 44px 240px 4fr 8fr 132px 88px;
  }
  #app-customer .customer-collection .customer-information {
    --column-width-min: 132px;
    grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));
  }
}
@media screen and (max-width: 1024px) {
  #app-customer .customer-collection {
    display: block;
  }
}
#app-product .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-product .product-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 8fr) 3fr 3fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-product .product-collection .product-information {
  --column-width-min: 180px;
  grid-template-columns: 1fr var(--column-width-min);
}
#app-product .category-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 4fr) 4fr 132px 132px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-product .vendor-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 4fr) 4fr 132px 132px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-product .unit-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 4fr) 4fr 4fr 132px 132px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-product .product-edit {
  display: grid;
  grid-template-columns: 392px 1fr;
  height: 100%;
}
#app-product .product-edit .navigation-panel {
  height: 100%;
  padding: 32px 16px;
}
#app-product .product-edit .information-panel {
  height: 100%;
  padding: 32px;
}
@media screen and (max-width: 1366px) {
  #app-product .product-collection {
    grid-template-columns: 44px 360px 3fr 3fr 2fr 132px 88px;
  }
  #app-product .product-collection .product-information {
    --column-width-min: 200px;
    grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));
  }
  #app-product .product-collection .product-information .sku {
    color: var(--secondary-color);
  }
}
@media screen and (max-width: 1024px) {
  #app-product .unit-collection,
  #app-product .category-collection,
  #app-product .vendor-collection,
  #app-product .product-collection {
    display: block;
    padding: 8px;
  }
}
#app-inventory .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-inventory .product-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 8fr) 3fr 3fr 2fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-inventory .product-collection .product-information {
  --column-width-min: 180px;
  grid-template-columns: 1fr var(--column-width-min);
}
#app-inventory .adjustment-collection {
  display: grid;
  grid-template-columns: 44px 1fr 1fr 1fr 1fr minmax(480px, 3fr) 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-inventory .adjustment-edit {
  margin: 16px;
}
#app-inventory .adjustment-edit .adjustment-panel {
  padding: 16px;
  background-color: var(--primary-background);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 16px 32px;
}
#app-inventory .adjustment-edit .product-panel {
  padding: 16px;
  margin: 16px 0;
  background-color: var(--primary-background);
}
#app-inventory .adjustment-edit .product-panel .product-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 4fr) 2fr 2fr 2fr 6fr;
}
#app-inventory #adjustment-preview .product-collection {
  grid-template-columns: 44px minmax(480px, 4fr) 2fr 6fr;
}
#app-inventory #check-preview .product-collection {
  grid-template-columns: 44px minmax(480px, 4fr) 2fr 2fr 4fr;
}
@media screen and (max-width: 1366px) {
  #app-inventory .product-collection {
    grid-template-columns: 44px 360px 3fr 3fr 2fr 132px 88px;
  }
  #app-inventory .product-collection .product-information {
    --column-width-min: 200px;
    grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));
  }
  #app-inventory .product-collection .product-information .sku {
    color: var(--secondary-color);
  }
}
@media screen and (max-width: 1024px) {
  #app-inventory .product-collection {
    display: block;
    padding: 8px;
  }
}
.card-grid {
  grid-template-columns: 48px 648px 1fr 48px 48px 48px 48px 48px;
  grid-gap: 8px;
  align-items: center;
  height: 52px;
  padding: 0 4px;
  background-color: var(--primary-background);
  margin-bottom: 8px;
}
.card-grid .img {
  height: 48px;
  overflow: hidden;
  cursor: pointer;
  display: grid;
  align-items: center;
}
.card-grid .name {
  cursor: pointer;
  padding-left: 8px;
}
.card-grid .tool {
  text-align: center;
  cursor: pointer;
}
#app-provider .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-provider .provider-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 4fr) 2fr 2fr 2fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-provider .provider-collection .provider-information {
  --column-width-min: 180px;
  grid-template-columns: 1fr var(--column-width-min);
}
#app-provider .category-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 4fr) 4fr 132px 132px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-report .order-collection {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 3fr) 132px 132px 132px 132px 132px 280px;
  align-items: center;
  min-height: 44px;
}
#app-profile .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-profile .order-collection {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 3fr) 132px 132px 132px 132px 132px 280px;
  align-items: center;
  min-height: 44px;
}
#app-account .comission-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 3fr) 3fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-account .customer-collection {
  display: grid;
  grid-template-columns: 44px minmax(320px, 3fr) 1fr 1fr 1fr;
  align-items: center;
  padding: 8px 0;
}
.animate {
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.post-grid {
  align-items: center;
  height: 52px;
}
.post-grid.header {
  color: var(--secondary-color);
  border-bottom: 1px solid var(--primary-border);
  margin-bottom: 8px;
  padding-top: 16px !important;
  font-weight: 600;
  text-transform: uppercase;
}
@media screen and (max-width: 1360px) {
  .post-grid {
    height: 48px;
  }
}
.zibra > div:nth-child(even) {
  background-color: var(--secondary-background);
}
.filter-toolbox {
  display: none;
  padding: 0 16px;
}
.filter-toolbox.show {
  display: block;
}
.edit-grid {
  display: grid;
  grid-template-columns: 320px 1fr;
  height: 100%;
}
.grid-2-36 {
  grid-template-columns: repeat(2, 36px);
}
.grid-3-36 {
  grid-template-columns: repeat(2, 36px);
}
.collection-header {
  color: var(--secondary-color);
  border-bottom: 1px solid var(--primary-border);
  margin-bottom: 8px;
  padding-top: 16px !important;
  font-weight: 600;
  text-transform: uppercase;
}
/* In order to maximize row lines, only display one line for a cell */
.attribute-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));
}
.attribute {
  padding: 0 2px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
/* Definition of wrapping column width for attribute groups. */
.date-information {
  --column-width-min: 120px;
}
#app-account .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-account .account-collection {
  display: grid;
  grid-template-columns: 44px minmax(360px, 5fr) 4fr 8fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-account .account-collection .account-information {
  --column-width-min: 120px;
  grid-template-columns: 1fr var(--column-width-min);
}
@media screen and (max-width: 1279px) {
  #app-account .account-collection {
    grid-template-columns: 44px 240px 4fr 8fr 132px 88px;
  }
  #app-account .account-collection .account-information {
    --column-width-min: 132px;
    grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));
  }
}
@media screen and (max-width: 1024px) {
  #app-account .account-collection {
    display: block;
  }
}
/* 1 Column Card Layout */
@media screen and (max-width: 1024px) {
  .collection-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .collection-container > div:first-child {
    display: none !important;
  }
  .collection-container .attribute-container {
    display: block;
  }
  .collection-container .attribute {
    display: grid;
    grid-template-columns: minmax(9em, 30%) 1fr;
  }
  .collection-container .attribute::before {
    content: attr(data);
  }
}
@media screen and (max-width: 768px) {
  .collection-container {
    display: grid;
    grid-template-columns: 1fr;
  }
}
.search-box {
  position: relative;
  pointer-events: auto;
}
.search-result {
  position: absolute;
  width: 100%;
  background: var(--primary-background);
  border: 1px solid var(--primary-border);
  padding: 8px 0;
  z-index: 100;
}
.info-panel .heading {
  text-transform: uppercase;
  font-weight: 700;
}
.info-panel label {
  margin-top: 16px;
}
.panel {
  position: fixed;
  width: 50%;
  height: 100vh;
  top: 0;
  z-index: 2000;
  background-color: var(--primary-background);
  -webkit-transition: -webkit-transform 0.5s 0.5s;
  transition: transform 0.5s 0.5s;
}
.panel .close {
  cursor: pointer;
  width: var(--input-height);
  line-height: var(--input-height);
  text-align: center;
  font-size: 18px;
  font-weight: 600;
}
.panel.panel-right {
  right: 0;
  transform: translate3d(100%, 0, 0);
}
.panel.visible {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
.panel .panel-container {
  display: block;
  width: 100%;
  height: 100%;
  padding: 16px;
}
.payment-status-0,
.poststatus.status-0 {
  background: #bdbdbd;
}
.payment-status-1,
.order-status-1 {
  background: #f9a825;
}
.payment-status-2,
.order-status-5 {
  background: #4caf50;
}
.poststatus .order-status-3,
.poststatus .adjust-status-1 {
  background: #00bcd4;
}
.poststatus .order-status-4 {
  background: #2196f3;
}
.mh280 {
  max-height: 280px;
}
.timeline-container {
  padding: 16px 16px 16px 32px;
  overflow: hidden;
}
.timeline {
  position: relative;
  background: var(--background-secondaary);
  margin-bottom: 16px;
  padding: 16px;
}
.timeline .date {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 8px;
}
.timeline .info {
  margin-bottom: 20px;
}
.timeline:last-child .info {
  margin-bottom: 0;
}
.timeline:before {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  top: 6px;
  left: -24px;
  background: var(--primary);
  border-radius: 50%;
  box-shadow: 0 0 0 3px #388d5475;
}
.timeline:after {
  content: "";
  position: absolute;
  top: 18px;
  left: -21px;
  width: 2px;
  height: 100%;
  background: var(--primary);
}
.calendar-container {
  background-color: var(--secondary-background);
  padding: 8px;
}
.calendar-container .calendar-navbar {
  display: grid;
  grid-template-columns: 36px 36px 1fr 120px;
  align-items: center;
  margin-bottom: 4px;
}
.calendar-container .calendar-navbar .title {
  text-align: center;
  font-weight: 700;
  font-size: 18px;
}
.calendar-container .calendar-header {
  grid-template-columns: repeat(7, 1fr);
  align-items: center;
  justify-items: center;
  background-color: var(--primary-background);
  border: 1px solid var(--primary-border);
}
.calendar-container .calendar-header .calendar-date {
  width: 100%;
  height: 100%;
  line-height: 40px;
  text-align: center;
  font-weight: 700;
}
.calendar-container .calendar-month {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}
.calendar-container .calendar-month .prev_month,
.calendar-container .calendar-month .next_month {
  background-color: var(--primary-background);
}
.calendar-container .calendar-month .prev_month .date,
.calendar-container .calendar-month .next_month .date {
  background: var(--primary-background) !important;
}
.calendar-container .calendar-month .calendar-date {
  position: relative;
  height: 144px;
  border-bottom: 1px solid var(--primary-border);
  border-right: 1px solid var(--primary-border);
}
.calendar-container .calendar-month .calendar-date .date {
  position: absolute;
  top: 3px;
  right: 8px;
  background: #fff;
  width: 20px;
  text-align: center;
  font-weight: bold;
}
.calendar-container .calendar-month .calendar-date .calendar-events {
  padding-top: 24px;
  height: 100%;
  overflow-y: auto;
}
.calendar-container .calendar-month .calendar-date .calendar-events .calendar-task {
  cursor: pointer;
  padding: 0 4px;
  color: #fff;
}
.calendar-container .calendar-month .calendar-date .calendar-events .calendar-task .task {
  font-size: 11px;
  font-weight: bold;
}
.calendar-container .calendar-month .calendar-date .calendar-events .calendar-task .name {
  font-size: 11px;
}
.calendar-container .calendar-month .calendar-date.sun {
  border-left: 1px solid var(--primary-border);
  color: red;
}
.widget {
  min-height: 295px;
  margin: 16px;
  padding: 16px;
  background-color: var(--primary-background);
}
.search-box {
  position: relative;
}
#app-account .permission-collection {
  display: grid;
  grid-template-columns: 44px minmax(260px, 3fr) 3fr 3fr 3fr 3fr 3fr 3fr;
  align-items: center;
  padding: 8px 0;
}
.lh36 {
  line-height: var(--input-height);
}
.input-group1-2x {
  display: grid;
  grid-template-columns: 1fr var(--input-height) var(--input-height);
  align-items: center;
}
.input-group1-2x .icon {
  text-align: center;
  cursor: pointer;
  line-height: calc(var(--input-height) - 2px);
  border: 1px solid var(--primary-border);
}
.input-group1-2x .icon:hover {
  border-color: var(--primary);
}
.input-group1-2x .icon.active {
  background-color: var(--primary);
  color: #fff;
}
.input-group2x-1 {
  display: grid;
  grid-template-columns: var(--input-height) 1fr var(--input-height);
  align-items: center;
}
.input-group2x-1 .icon {
  text-align: center;
  cursor: pointer;
  line-height: var(--input-height);
  border: 1px solid var(--primary-border);
}
.input-group2x-1 .icon:hover {
  border-color: var(--primary-color);
}
.input-group2x-1 .icon.active {
  background-color: var(--primary);
  color: #fff;
}
.collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
.servicestatus {
  cursor: pointer;
  display: grid;
  grid-template-columns: 8px 1fr;
  margin-bottom: 4px;
}
.servicestatus .service-status-0,
.servicestatus .status-0-0,
.servicestatus .status-1-0 {
  background: #bdbdbd;
  width: 4px;
  margin-right: 4px;
  border-radius: 4px;
}
.servicestatus .service-status-1,
.servicestatus .status-0-1,
.servicestatus .status-1-1 {
  background: #00bcd4;
  width: 4px;
  margin-right: 4px;
  border-radius: 4px;
}
.servicestatus .service-status-2,
.servicestatus .service-status-3,
.servicestatus .status-0-2,
.servicestatus .status-1-2 {
  background: #2196f3;
  width: 4px;
  margin-right: 4px;
  border-radius: 4px;
}
.servicestatus .service-status-4,
.servicestatus .service-status-6,
.servicestatus .status-0-3,
.servicestatus .status-1-3 {
  background: #4caf50;
  width: 4px;
  margin-right: 4px;
  border-radius: 4px;
}
.servicestatus .service-status-5,
.servicestatus .status-0-4,
.servicestatus .status-1-4 {
  background: #b71c1c;
  width: 4px;
  margin-right: 4px;
  border-radius: 4px;
}
#app-invoice .cart-collection {
  display: grid;
  grid-template-columns: 88px minmax(480px, 8fr) 3fr 3fr 3fr 3fr;
  align-items: center;
  padding: 8px 0;
}
#app-invoice .invoice-collection {
  display: grid;
  grid-template-columns: 100px minmax(320px, 1.5fr) 2fr 1fr 1fr 3fr 264px 88px;
  align-items: center;
  padding: 8px 0;
}
#app-invoice .invoice-print {
  width: 960px;
  margin: 0 auto;
  border: 1px solid var(--primary-border);
  padding: 32px;
  min-height: calc(100vh - 88px);
}
#app-invoice .invoice-print .invoice-products {
  background-color: var(--primary-background);
  padding: 16px;
}
#app-invoice .invoice-print .invoice-products .cart-collection {
  display: grid;
  grid-template-columns: 44px minmax(180px, 5fr) 3fr 3fr 3fr;
  align-items: center;
  padding: 8px;
}
#app-invoice .invoice--discounttype {
  display: grid;
  grid-template-columns: 36px 36px 1fr;
  height: 36px;
  align-items: center;
}
#app-invoice .invoice--discounttype .discounttype {
  cursor: pointer;
  text-align: center;
  line-height: 36px;
}
#app-invoice .invoice--discounttype .discounttype.active {
  background-color: var(--primary);
  color: #fff;
}
#app-invoice .company-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  border-bottom: 1px solid var(--primary-border);
  padding-bottom: 16px;
}
#app-invoice .company-row .logo {
  width: 200px;
}
#app-invoice .company-row .information {
  font-weight: 600;
  color: var(--secondary-color);
}
#app-invoice .contact-row {
  padding: 120px 0 60px 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
#app-invoice .contact-row .title {
  font-weight: 700;
  font-size: 36px;
}
#app-invoice .summary-row {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  margin-top: 32px;
}
#app-invoice .summary-row .summary-total .payment-box,
#app-invoice .summary-row .summary-total .summary-box {
  background-color: var(--primary-background);
  padding: 16px;
}
#app-invoice .summary-row .info-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  height: 36px;
}
#app-invoice .summary-row .note-box {
  padding: 16px 60px 16px 0;
}
.printable .invoice-print {
  -webkit-print-color-adjust: exact !important;
  width: 100% !important;
  padding: 8%;
  border: none;
}
.printable .navy__modal {
  display: none;
}
.task-modal .task-label {
  display: block;
  width: 100%;
  height: 24px;
  border-radius: 4px;
}
.task-modal ul.task-labels li {
  margin-bottom: 4px;
}
.task-modal ul.task-labels li:hover {
  background: none;
}
.person-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  display: inline-block;
}
.person-grid {
  display: grid;
  grid-template-columns: 36px 1fr 36px;
  align-items: center;
  grid-gap: 8px;
}
.person-grid:hover {
  background-color: var(--primary-hover);
}
.account-card {
  text-align: center;
  padding: 32px;
  background: var(--primary-background);
  margin: 16px;
}
.account-card .icon {
  font-size: 40px;
  padding-bottom: 16px;
}
.account-card .title {
  font-size: 20px;
  font-weight: 700;
}
.tooltip {
  position: relative;
}
.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: var(--primary-background);
  color: var(--primary-color);
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
  width: 120px;
  top: 100%;
  left: 50%;
  margin-left: -60px;
  /* Use half of the width (120/2 = 60), to center the tooltip */
}
.widget-container {
  background-color: var(--secondary-background);
  padding: 16px;
  height: 100%;
}
.widget-container .widget-title {
  font-weight: 700;
  padding-bottom: 16px;
  text-transform: uppercase;
}
.widget-container .widget-priority {
  display: grid;
  grid-template-columns: 36px 1fr 132px;
  align-items: center;
  grid-gap: 8px;
  margin-bottom: 8px;
}
.task-detail {
  padding: 8px;
  color: #fff !important;
}
.task-detail .task-note {
  color: #fff !important;
}
.grid-info {
  display: grid;
  grid-template-columns: 80px 1fr 32px;
  font-weight: 700;
  line-height: 24px;
}
.grid-info .task-label {
  text-transform: capitalize;
}
.task-61bd4f {
  background: #61bd4f;
}
.task-f2d600 {
  background: #f2d600;
}
.task-ff9f1a {
  background: #ff9f1a;
}
.task-eb5a46 {
  background: #eb5a46;
}
.task-c377e0 {
  background: #c377e0;
}
.task-0079bf {
  background: #0079bf;
}
.task-00c2e0 {
  background: #00c2e0;
}

.grid-line {
  display: grid;
  grid-template-columns: 1fr var(--input-height);
  align-items: end;
}
#app-order .view-content {
  height: 100%;
}
#app-order .collection {
  padding: 16px;
  margin: 16px;
  background-color: var(--primary-background);
}
#app-order .order-collection {
  display: grid;
  grid-template-columns: 100px minmax(260px, 1fr) 2fr 132px 132px 3fr 264px 88px;
  align-items: center;
  min-height: 44px;
}
#app-order .cart-grid {
  grid-template-columns: 1fr 420px;
  height: 100%;
}
#app-order .cart-collection {
  display: grid;
  grid-template-columns: 44px minmax(480px, 8fr) 3fr 3fr 2fr 264px;
  align-items: center;
  padding: 8px;
  grid-gap: 8px;
}
#app-order .search-product {
  position: relative;
}
#app-order .search-result {
  display: none;
}
#app-order .search-result.open {
  display: block;
}
#app-order .info-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  height: 36px;
}
#app-order .info-row .val {
  text-align: right;
}
#app-order .order--discounttype {
  display: grid;
  grid-template-columns: 36px 36px 1fr;
  justify-items: center;
  align-items: center;
}
#app-order .order--discounttype .discounttype {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 36px;
  text-align: center;
  border: 1px solid var(--primary-border);
  cursor: pointer;
}
#app-order .order--discounttype .discounttype:hover {
  border-color: var(--primary);
}
#app-order .order--discounttype .discounttype.active {
  background-color: var(--primary);
  color: #FFF;
}
#app-order .search-customer {
  position: relative;
}
#app-order .search-customer .vertical li {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
#app-order .search-result {
  pointer-events: initial;
}
#app-order .discount_label {
  text-transform: uppercase;
  font-weight: 600;
}
#app-order .activity-row {
  display: grid;
  grid-template-columns: 36px 200px 160px 1fr;
  line-height: 36px;
  padding: 8px 0;
}
#app-order .order-information {
  height: 100%;
  background-color: var(--primary-background);
}


/*# sourceMappingURL=app~01e7b97c.b3d5360d376298985f29.bundle.map*/