.clear-fix {
  zoom: 1;
}
.clear-fix:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.color-primary {
  color: #000000;
}
.color-secondary {
  color: #000000;
}
html,
body {
  height: 100%;
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
select,
textarea,
button,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}
ul,
ol {
  padding-left: 2em;
}
header,
footer,
nav,
section,
article,
aside {
  display: block;
}
table {
  border-spacing: 0;
  font: inherit;
  color: inherit;
  text-decoration: inherit;
}
td {
  vertical-align: top;
}
fieldset,
img,
abbr,
acronym,
iframe {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
th,
var {
  font-style: normal;
  font-weight: normal;
}
xol,
xul {
  list-style: none;
}
caption,
th {
  text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
q:before,
q:after {
  content: '';
}
form {
  display: inline;
}
b {
  font-weight: bold;
}
i {
  font-style: italic;
}
p {
  margin: 1em 0;
}
object,
embed,
iframe {
  vertical-align: bottom;
}
.button,
button {
  background: ButtonFace;
  border-color: ButtonFace;
  color: ButtonText;
  border-width: 1px;
  font: bold 12px/15px Arial;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: bottom;
}
.button {
  display: -moz-inline-box;
  display: inline-block;
  border-style: outset;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  text-decoration: none;
}
.button:hover:active {
  border-style: inset;
}
.button.selected,
button.selected {
  border-style: inset;
  cursor: default;
}
.button b {
  height: 15px;
  display: block;
  text-align: center;
  overflow: hidden;
}
.button b,
button {
  padding: 2px 8px 3px;
}
button {
  border-radius: 0;
}
button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
.button.disabled,
button[disabled] {
  border-style: solid;
  color: GrayText;
  pointer-events: none;
}
.button.disabled > i,
button[disabled] > i {
  opacity: 0.25;
}
.button.disabled,
.button.disabled * {
  cursor: default;
}
.button > i,
button > i {
  display: -moz-inline-block;
  display: inline-block;
  margin: -0.125em 0.25em -0.1875em -0.5em;
  width: 1.25em;
  height: 1.25em;
  vertical-align: bottom;
  background: url(images/webshop/button-icons.png);
  pointer-events: none;
}
button > i.right {
  margin: -0.125em -0.5em -0.1875em 0.25em;
}
.button-icon,
button.icon {
  width: 1.375em;
  padding: 0;
  color: transparent !important;
  text-indent: -625em;
}
.button-icon b {
  height: 1.25em;
  padding: 0;
}
.button-icon > i,
button.icon > i {
  display: block;
  margin: 0;
}
.button-arrowLeft > i,
button.arrowLeft > i {
  background-position: 0 0;
}
.button-arrowRight > i,
button.arrowRight > i {
  background-position: -1.25em 0;
}
.coz-input-search button > i,
.button-search > i,
button.search > i {
  background-position: -2.5em 0;
}
#blockView > i {
  background-position: -3.75em 0;
}
#largeView > i {
  background-position: -5em 0;
}
#smallView > i {
  background-position: -6.25em 0;
}
#listView > i {
  background-position: -7.5em 0;
}
.coz-input-datepicker button > i,
.button-datepicker > i,
button.datepicker > i {
  background-position: -8.75em 0;
}
.button-add > i,
button.add > i {
  background-position: -10em 0;
}
.button-close > i,
.button-remove > i,
button.close > i,
button.remove > i {
  background-position: -11.25em 0;
}
.button-check > i,
button.check > i {
  background-position: -12.5em 0;
}
.button-copy > i,
button.copy > i {
  background-position: -13.75em 0;
}
.button-edit > i,
button.edit > i {
  background-position: -15em 0;
}
.button-maximize > i,
button.maximize > i {
  background-position: -16.25em 0;
}
.button-restore > i,
button.restore > i {
  background-position: -17.5em 0;
}
.button-minimize > i,
button.minimize > i {
  background-position: -18.75em 0;
}
.button-info > i,
button.info > i {
  background-position: -20em 0;
}
.button-down > i,
button.down > i {
  background-position: -21.25em 0;
}
.button-up > i,
button.up > i {
  background-position: -22.5em 0;
}
.coz-input-select button > i,
.coz-input-combo button > i,
.button-drop > i,
button.drop > i {
  background-position: -21.375em 0;
}
.coz-input-open button > i {
  background-position: -22.625em 0;
}
.button-sort > i,
button.sort > i {
  background-position: -23.75em 0;
}
.button-asc > i,
button.asc > i {
  background-position: -25em 0;
}
.button-desc > i,
button.desc > i {
  background-position: -26.25em 0;
}
.button-doubleArrow > i,
button.doubleArrow > i {
  float: left;
  margin: 0 -0.6875em 0 -0.25em;
}
.coz-input-number button > i {
  height: 0.5625em;
  width: 0.75em;
}
.coz-input-number .increment > i {
  background-position: -27.75em -0.0625em;
}
.coz-input-number .decrement > i {
  background-position: -27.75em -0.625em;
}
button.cart > i,
.button-cart > i {
  background-position: 0 -1.25em;
  width: 2.5em;
}
button.wishlist > i,
button.inwishlist > i,
.button-wishlist > i,
.button-inwishlist > i {
  width: 1.8125em;
}
button.wishlist > i,
.button-wishlist > i {
  background-position: -2.5em -1.25em;
}
button.inwishlist > i,
.button-inwishlist > i {
  background-position: -4.3125em -1.25em;
}
button.favorites > i,
.button-favorites > i {
  background-position: -6.125em -1.25em;
}
button.play > i,
.button-play > i {
  background-position: -7.375em -1.25em;
}
button.pause > i,
.button-pause > i {
  background-position: -8.625em -1.25em;
}
.button-doubleArrowLeft > i,
button.doubleArrowLeft > i {
  background-position: -9.875em -1.25em;
}
.button-doubleArrowRight > i,
button.doubleArrowRight > i {
  background-position: -11.125em -1.25em;
} /* 
button.disabled > i,
.button-disabled > i { background-position:-158/16em -20/16em; }
button.locked > i,
.button-locked > i { background-position:-178/16em -20/16em; } */
.coz-input > .button,
.coz-input > button,
.coz-input-number-buttons,
.coz-input-number-buttons > button {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
}
.coz-input > button {
  cursor: default;
}
.safari .coz-input > button {
  cursor: pointer;
}
.coz-input-select > button.icon,
.coz-input-combo > button.icon,
.button-drop,
button.drop {
  width: 1.125em;
}
.coz-input-select > button.icon > i,
.coz-input-combo > button.icon > i,
.button-drop > i,
button.drop > i {
  width: 1em;
}
.coz-input-number-buttons {
  width: 0.9375em;
}
.coz-input-number-buttons > button.icon {
  width: 0.9375em;
  height: 0.6875em;
  padding: 0;
}
.coz-input-number-buttons > button.decrement {
  top: auto;
  bottom: 0;
}
.coz-input-time > button {
  padding-left: 0.125em;
  padding-right: 0.125em;
}
.coz-input-search > button {
  cursor: pointer;
}
.coz-input-search > .button {
  position: absolute;
  right: 1.375em;
  top: 0;
}
.coz-input-copy > a {
  display: block;
  position: absolute;
}
/* Form Inputs */
input,
select,
textarea,
.mooeditable-container .mooeditable-iframe,
.coz-input-checkbox input + i,
.coz-input-radio input + i {
  background: #fff;
  border: 1px inset ThreeDFace;
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
input,
textarea,
.mooeditable-container .mooeditable-iframe {
  padding: 2px 3px;
}
select {
  padding: 0.5px 2px;
}
textarea {
  resize: vertical;
  min-height: 16px;
}
input[type="checkbox"],
input[type="radio"] {
  height: 14px;
  padding: 2px;
}
input[type="image"] {
  border: 0;
}
datalist {
  display: none;
}
input .firefox.android,
textarea .firefox.android,
select .firefox.android {
  border-radius: 0;
}
.ios input,
.ios textarea,
.ios select {
  -webkit-appearance: none;
}
input[type="number"] {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  width: 3em;
}
input[type="number"].count {
  width: 2em;
}
input[type="number"],
input[type="search"] {
  -moz-appearance: textfield;
  -webkit-appearance: textfield;
}
.coz-input-placeholder,
.coz-input-select-empty,
.coz-input-select-empty input,
select option[value=""] {
  color: #999;
  color: rgba(0, 0, 0, 0.4);
  opacity: 1;
}
:-moz-placeholder {
  color: #999;
  color: rgba(0, 0, 0, 0.4);
  opacity: 1;
}
::-moz-placeholder {
  color: #999;
  color: rgba(0, 0, 0, 0.4);
  opacity: 1;
}
::-webkit-input-placeholder {
  color: #999;
  color: rgba(0, 0, 0, 0.4);
  opacity: 1;
}
:-ms-input-placeholder {
  color: #999;
  color: rgba(0, 0, 0, 0.4);
  opacity: 1;
}
.coz-input-select-empty option {
  color: #000;
}
.coz-input-select-empty option[value=""] {
  display: none;
}
.coz-input-placeholder-focus,
.coz-input-placeholder:focus,
.coz-input-select-empty:focus,
.coz-input-select-empty input:focus,
select:focus option[value=""] {
  color: #ccc;
  color: rgba(0, 0, 0, 0.2);
}
:focus :-moz-placeholder {
  color: #ccc;
  color: rgba(0, 0, 0, 0.2);
}
:focus::-moz-placeholder {
  color: #ccc;
  color: rgba(0, 0, 0, 0.2);
}
:focus::-webkit-input-placeholder {
  color: #ccc;
  color: rgba(0, 0, 0, 0.2);
}
:focus :-ms-input-placeholder {
  color: #ccc;
  color: rgba(0, 0, 0, 0.2);
}
.coz-input {
  display: inline-block;
  position: relative;
  vertical-align: bottom;
}
.coz-input > *,
.coz-input-checkbox input + i,
.coz-input-radio input + i {
  vertical-align: top;
}
.coz-input > input,
.coz-input-select > select {
  display: inline;
}
.coz-input-time > input:first-child,
.coz-input-datetime > input:first-child,
.coz-input-datetime-local > input:first-child,
.coz-input-month > input:first-child,
.coz-input-week > input:first-child {
  display: none;
}
.coz-input-numberx > input,
.coz-input-datepicker > input,
.coz-input-search > input,
.coz-input-copy > input,
.coz-input-select > input,
.coz-input-combo > input {
  width: auto;
}
.coz-input-number > input:first-child,
.coz-input-date > input:first-child,
.coz-input-time > input:first-child,
.coz-input-datepicker > input:first-child,
.coz-input-datetime > input:first-child,
.coz-input-datetime-local > input:first-child,
.coz-input-week > input:first-child,
.coz-input-password-placeholder > input:first-child,
.coz-input-select > select {
  visibility: hidden;
}
.coz-input-number > input:first-child ~ input,
.coz-input-date > input:first-child ~ input,
.coz-input-time > input:first-child ~ input,
.coz-input-datepicker > input:first-child ~ input,
.coz-input-datetime > input:first-child ~ input,
.coz-input-datetime-local > input:first-child ~ input,
.coz-input-week > input:first-child ~ input,
.coz-input-password-placeholder > input:first-child ~ input,
.coz-input-select > select ~ input {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.coz-input-checkbox input,
.coz-input-radio input {
  position: absolute;
  left: -10000px;
}
.coz-input-password-placeholder-active > input:first-child {
  visibility: visible;
}
.coz-input-password-placeholder-active > input:first-child + input {
  display: none;
}
div.coz-input {
  display: block;
}
div.coz-input > input {
  width: 100%;
}
.coz-input > input ~ * ~ * {
  margin-left: 3px;
}
.coz-input > ul {
  margin-left: 0;
}
.coz-input-datetime > .coz-input-time,
.coz-input-datetime-local > .coz-input-time {
  margin-left: 6px;
}
.coz-input-date > input + * + * + input,
.coz-input-time > input {
  width: 41px;
  text-align: right;
}
.coz-locale-mdy .coz-input-month > span {
  float: right;
  margin-left: 0;
}
.coz-locale-mdy .coz-input-month > .coz-input-number {
  margin-left: 3px;
}
input[type="number"],
.coz-input-number > input {
  padding-right: 17px;
  text-align: right;
}
.coz-input-copy > input {
  padding-right: 90px;
}
.coz-input-checkbox,
.coz-input-radio {
  color: WindowText !important;
  text-decoration: none !important;
}
.coz-input-checkbox,
.coz-input-checkbox *,
.coz-input-radio,
.coz-input-radio * {
  cursor: default;
}
label input[type="checkbox"],
label input[type="radio"],
.coz-input-checkbox input + i,
.coz-input-radio input + i {
  margin: 2px 4px 2px 2px;
}
.coz-input-checkbox input + i,
.coz-input-radio input + i {
  cursor: default;
  width: 12px;
  height: 12px;
  display: -moz-inline-box;
  display: inline-block;
  background: #fff;
}
.coz-input-radio input + i {
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
}
.coz-input .coz-input-checked + i {
  background: #000;
}
.coz-input :checked + i {
  background: #000;
}
.coz-input .coz-input-indeterminate + i {
  background: #808080;
}
.coz-input :indeterminate + i {
  background: #808080;
}
.coz-input-checkbox input {
  display: block;
}
.coz-input-select,
.coz-input-combo {
  position: relative;
}
.coz-input-open {
  z-index: 2;
}
.coz-input-select input,
.coz-input-combo:not(.coz-input-combo-nooptions) input {
  display: inline;
  padding-right: 20px;
  vertical-align: top;
}
.coz-input-select input {
  -moz-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.coz-input-combo-nooptions button {
  display: none;
}
.coz-input-select *,
.coz-input-combo a {
  cursor: default;
  white-space: nowrap;
}
.coz-input-select ul,
.coz-input-combo ul {
  display: none;
  margin: 0;
  padding: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  border: 1px solid WindowFrame;
  background-color: Window;
  max-height: 200px;
  overflow-x: hidden;
  overflow-y: auto;
  font: 12px/15px Verdana;
}
.coz-input-select ul a,
.coz-input-combo ul a,
.coz-input-select-dialog ul a {
  display: block;
  padding: 2px 4px 2px;
  color: WindowText;
  text-decoration: none !important;
  text-align: left;
}
.coz-input-select li.selected a,
.coz-input-combo li.selected a,
.coz-input-select-dialog li.selected a {
  background: ActiveBorder;
  color: HighlightText;
}
.coz-input-select ul a:hover,
.coz-input-combo ul a:hover,
.coz-input-select-dialog ul a:hover {
  background: Highlight;
  color: HighlightText;
}
.coz-input-open ul,
.coz-input-select-dialog ul {
  display: block;
  list-style: none;
}
.coz-input-select li,
.coz-input-combo li,
.coz-input-select-dialog li {
  margin: 0;
}
.dialog.coz-input-select-dialog {
  padding: 0;
}
.dialog.coz-input-select-dialog .dialog-content-div {
  overflow: auto;
}
.dialog.coz-input-select-dialog li {
  margin: 0;
}
.dialog.coz-input-select-dialog ul {
  list-style: none;
  padding: 0;
}
.dialog.coz-input-select-dialog ul a {
  padding: 8px 10px 8px;
}
input.coz-input-invalid,
select.coz-input-invalid,
textarea.coz-input-invalid,
.coz-input-invalid > input + i {
  border-color: #c00;
  background-color: #fdd;
}
.coz-input-invalid:focus {
  border-color: #f00;
  background-color: #fff;
  outline-color: #f00;
}
.coz-input-invalid label {
  color: #c00;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type="number"] {
    padding-right: 0;
  }
  input[type="checkbox"],
  input[type="radio"] {
    -webkit-appearance: none;
    border: 0 !important;
  }
  input[readonly]:focus {
    outline: auto 5px -webkit-focus-ring-color;
  }
}
.datePicker {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 999;
}
.datePicker .box {
  background: Menu;
  border-color: WindowFrame;
}
.calendar {
  background: none !important;
  position: relative;
  width: 160px;
  font-weight: bold;
}
.calendar caption {
  color: MenuText;
  font-weight: bold;
  text-align: center;
  width: 100%;
  cursor: default;
}
.calendar caption > select,
.calendar caption > span.coz-input-select {
  width: 100px;
  float: left;
}
.calendar caption > input,
.calendar caption > span.coz-input-number {
  width: 57px;
  float: right;
}
.calendar table {
  background: none;
}
.calendar td,
.calendar th {
  color: MenuText;
  font-weight: bold;
  width: 22px;
  height: 22px;
  text-align: center;
  vertical-align: middle;
  padding: 0 1px 1px 0;
  cursor: default;
  -moz-user-select: none;
  -khtml-user-select: none;
}
.calendar td {
  color: GrayText;
  font-size: 12px;
  line-height: 15px;
}
.calendar td.invalid {
  color: #fff;
}
.calendar td button {
  width: 22px;
  height: 22px;
  padding: 0;
}
.calendar td button.active {
  outline-color: #f60 !important;
}
.clear-fix:after {
  content: '';
  display: table;
  clear: both;
}
html {
  font: 10px Dosis, sans-serif;
  color: #222;
}
body {
  margin: 0;
  background: #fff;
  font-size: 16px;
  line-height: 1.375;
}
h1 {
  font-size: 2em;
  font-weight: normal;
  color: #000000;
}
h2 {
  font-size: 1.5em;
  font-weight: normal;
}
h1,
h2,
h3,
h4,
p,
ul,
hr {
  margin: 1em 0;
}
hr {
  clear: both;
  border: 0 solid #ccc;
  border-top-width: 1px;
  margin: 1em 0;
}
h3,
h4,
th,
strong,
b,
#body p > a {
  font-weight: 600;
}
img {
  vertical-align: top;
  border: 0;
  max-width: 100%;
}
a[href],
a:visited {
  color: #000000;
}
a[href]:hover {
  color: #333333;
}
a[href]:focus {
  color: #000000;
}
a[href]:hover:active {
  color: #000000;
}
main {
  display: block;
  max-width: 960px;
  padding: 2em;
  margin: auto;
  border-top: 56px solid transparent;
}
main.home {
  max-width: none;
  padding: 0;
}
main > ul {
  margin: 0 0 0.5em;
  padding: 0;
  list-style: none;
}
main > ul > li {
  display: inline-block;
  line-height: 20px;
}
main > ul > li + li::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: top;
  background-position: -278px -20px;
  background-image: url('//www.arclearn.com/colorReplace/333333/images/webshop/button-icons-mask.png');
  background-image: url('//www.arclearn.com/colorReplace/333333/images/webshop/button-icons-mask.svg'), none;
  transform: scaleX(-1);
}
main > h1 {
  margin-top: 0;
}
section {
  zoom: 1;
}
section:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
section:after {
  content: '';
  display: table;
  clear: both;
}
section > img {
  width: 33.333%;
  float: left;
}
section > img.overlay {
  margin-left: -33.333%;
}
@media (max-width: 800px) {
  section > img {
    width: 50%;
  }
  section > img.overlay {
    margin-left: -50%;
  }
}
@media (max-width: 480px) {
  section > img {
    width: 100%;
  }
  section > img.overlay {
    margin-left: -100%;
  }
  section > img:nth-child(9),
  section > img:nth-child(10) {
    margin-top: 85.390625%;
  }
  section > img:nth-child(11) {
    margin-top: -231.796875%;
  }
}
main footer {
  clear: both;
  position: relative;
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8) 2em, #ffffff);
  text-align: right;
}
main footer label {
  margin-bottom: 0.4375em;
}
main footer label.coz-input-checkbox {
  margin-bottom: 0;
  line-height: 36px;
}
main footer label.coz-input-checkbox i {
  margin: calc((36px - 2px - 1.375em) / 2);
}
main footer > * {
  display: block;
  max-width: 960px;
  padding: 2em 0;
}
main footer.spacer {
  position: absolute;
  visibility: hidden;
}
main footer.fixed {
  position: fixed;
}
main footer.fixed > * {
  margin: auto;
}
main footer.fixed + main footer.spacer {
  position: relative;
}
main label + footer,
main .columns + footer {
  margin-top: -0.5em;
}
main p + footer > *,
main p + footer.fixed + footer.spacer > * {
  margin-top: -1em;
  margin-bottom: -2em;
}
.body-left {
  float: left;
}
.body-right {
  float: right;
}
.body-center {
  clear: both;
  margin: auto;
}
.body-clear {
  clear: both;
}
.body-left,
.body-right,
.body-center {
  width: 464px;
}
.body-message,
.body-error {
  border: 1px solid #c00;
  background: #fcc;
  padding: 10px;
  position: relative;
  z-index: 2;
  margin: 0 0 1em;
}
.body-message {
  border-color: #0c0;
  background: #cfc;
}
.big {
  font-size: 2.2rem;
}
.notice {
  color: #c00;
  font-weight: 600;
}
.center {
  text-align: center;
}
.left {
  float: left;
}
.right {
  float: right;
}
.columns {
  zoom: 1;
}
.columns:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.columns:after {
  content: '';
  display: table;
  clear: both;
}
.column {
  width: 50%;
  box-sizing: border-box;
  float: left;
  padding: 0 0.5em 0 0;
}
.column-3 {
  width: 33.333333333333336%;
}
.column-4 {
  width: 25%;
}
.column + * {
  clear: both;
}
.column + .column + .column,
.column-3 + .column-3 + .column-3 + .column-3,
.column-4 + .column-4 + .column-4 + .column-4 + .column-4 {
  clear: both;
  float: left;
  padding: 0 0.5em 0 0;
}
.column + .column,
.column-3 + .column-3 + .column-3,
.column-4 + .column-4 + .column-4 + .column-4 {
  clear: none;
  float: right;
  padding: 0 0 0 0.5em;
}
.column-3 + .column-3,
.column-4 + .column-4,
.column-4 + .column-4 + .column-4 {
  clear: none;
  float: left;
  padding: 0 0.5em;
}
@media (min-width: 960px) {
  .sessionnotes .column-3 {
    width: 309.3333333333333px;
  }
}
@media (max-width: 959px) {
  .column {
    width: auto;
  }
  .column,
  .column + .column,
  .column-3 + .column-3 + .column-3,
  .column-4 + .column-4 + .column-4,
  .column-4 + .column-4 + .column-4 + .column-4 {
    float: none;
    padding: 0;
  }
}
label {
  display: block;
  cursor: default;
  background: none !important;
  margin: 0 0 0.5em 0;
  font-weight: bolder;
  line-height: 2;
}
label > * {
  font-weight: normal;
}
label > input,
label > select,
label > textarea,
label > .coz-input,
form h4 {
  margin: 0 0 0.25em 0;
}
#entries div {
  position: relative;
}
#entries div.entry {
  display: block;
  position: relative;
  padding: 0 2.75em 0 2.5em;
  margin: 0 0 0.25em;
  float: none;
  zoom: 1;
}
#entries div.entry > input,
#entries div.entry > select,
#entries div.entry > textarea,
#entries div.entry > .coz-input {
  width: 50%;
  float: left;
  margin: 0;
}
#entries div.entry > .coz-input > input,
#entries div.entry > .coz-input > select,
#entries div.entry > .coz-input > textarea {
  width: 100%;
}
#entries div.entry > * + input,
#entries div.entry > * + select,
#entries div.entry > * + textarea,
#entries div.entry > * + .coz-input {
  margin: 0 -0.25em 0 0.25em;
}
#entries div.entry button.remove {
  position: absolute;
  top: 0;
  right: 0;
}
#entries div.entry .button-sort {
  position: absolute;
  top: 0;
  left: 0;
}
#entries div.entry:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
#entries div.entry:after {
  content: '';
  display: table;
  clear: both;
}
#entries div.entry.dragging {
  z-index: 10;
}
#phones {
  margin-top: -0.5em;
}
#phones label {
  display: block;
  position: relative;
  padding: 0 2.75em 0 0;
  margin-bottom: 0.25em;
  zoom: 1;
}
#phones label > * {
  float: left;
  margin: 0;
}
#phones label > select,
#phones label > .coz-input-select {
  width: 30%;
}
#phones label > input,
#phones label > .coz-input {
  width: 70%;
  margin: 0 -0.25em 0 0.25em;
}
#phones label button.remove {
  position: absolute;
  top: 0;
  right: 0;
}
#phones label:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
#phones label:after {
  content: '';
  display: table;
  clear: both;
}
input,
select,
textarea,
.coz-input-display,
button,
.button {
  padding: 0.3125em 0.4375em;
  border: 0.0625em solid #999;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: inherit;
  font-size: inherit;
  line-height: 1.5;
  color: inherit;
}
option {
  color: #000;
}
select option[value=""],
.coz-select-empty {
  color: #999;
  color: rgba(0, 0, 0, 0.4);
}
textarea {
  min-height: 2.25em;
  height: 6.75em;
}
textarea.goal {
  height: 3.75em;
}
.touch textarea {
  resize: none;
}
label,
label > input,
label > select,
label > textarea,
label > input[type="number"],
label > .coz-input,
label > .coz-input > input,
label > .coz-input > select,
label > .coz-input > textarea {
  display: block;
  width: 100%;
  *width: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
label > input[type="checkbox"],
label > input[type="radio"],
label > input[size] {
  display: inline;
  width: auto;
}
label > input[type="checkbox"] + i {
  margin: 0.4375em 0.5em;
}
label > div {
  zoom: 1;
}
label > div:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
label > div:after {
  content: '';
  display: table;
  clear: both;
}
label > div > * {
  vertical-align: top;
  float: left;
  margin: 0 0.25em 0.25em 0;
}
label > div.dates {
  padding-right: 0.25em;
}
label > div.dates > * {
  width: 50%;
}
label > div.dates > * + * {
  float: right;
  margin-right: -0.25em;
}
label > div.dates > * > input[type="date"] {
  width: 100%;
}
label > div.right {
  float: none;
}
label > div.right > * {
  float: right;
  margin: 0 0 0.25em 0.25em;
}
label > h4 {
  display: inline;
}
.coz-input-time > input[type="time"],
.coz-input-datetime > input[type="datetime"],
.coz-input-datetime-local > input[type="datetime-local"],
.coz-input-month > input[type="month"],
.coz-input-password-placeholder-active > input[type="text"] {
  display: none;
}
.coz-input-number > input[type="number"],
.coz-input-date > input[type="date"],
.coz-input-datepicker > input[type="date"],
.coz-input-password-placeholder > input[type="password"],
.coz-input-checkbox input[type="checkbox"],
.coz-input-radio input[type="radio"],
.coz-input-date-display > input[type="date"],
.coz-input-time-display > input[type="time"] {
  display: block;
  visibility: hidden;
}
.coz-input-number > input[type="number"],
.coz-input-date > input[type="date"],
.coz-input-datepicker > input[type="date"],
.coz-input-password-placeholder-active > input[type="password"],
.coz-input-checkbox input[type="checkbox"],
.coz-input-radio input[type="radio"],
.coz-input-date-display > input[type="date"],
.coz-input-time-display > input[type="time"] {
  visibility: visible;
}
@media print {
  .coz-input-number > input[type="number"],
  .coz-input-date > input[type="date"],
  .coz-input-datepicker > input[type="date"],
  .coz-input-password-placeholder-active > input[type="password"],
  .coz-input-checkbox input[type="checkbox"],
  .coz-input-radio input[type="radio"],
  .coz-input-date-display > input[type="date"],
  .coz-input-time-display > input[type="time"] {
    visibility: hidden;
  }
}
.coz-input-number > input[type="text"],
.coz-input-date > input[type="text"],
.coz-input-datepicker > input[type="text"],
.coz-input-password-placeholder > input[type="text"],
.coz-input-date-display > input[type="text"],
.coz-input-time-display > input[type="text"] {
  position: absolute;
  left: 0;
  width: 100%;
  top: 0;
}
.coz-input-checkbox > input[type="checkbox"],
.coz-input-radio > input[type="radio"] {
  position: absolute;
  left: -10000px;
}
.coz-input-datepicker > input[type="date"],
.coz-input-date-display > input[type="date"] {
  width: 12.5em;
}
.coz-input-time-display > input[type="time"] {
  width: 7.75em;
}
.coz-input-date-display > input[type="text"],
.coz-input-date-display > button,
.coz-input-time-display > input[type="text"],
.coz-input-time-display > button {
  pointer-events: none;
}
.coz-input-time-display > button > i {
  background-position: -238px -20px;
}
.coz-input-number > input {
  text-align: left;
}
.coz-input-time .coz-input-number > input {
  text-align: right;
}
.coz-input-checkbox input + i {
  float: right;
  width: 1.375em;
  height: 1.375em;
  margin: 0.1875em 0;
  border: 1px solid #999;
  background: #fff;
}
.coz-input-checkbox input.coz-input-checked + i,
.coz-input-checkbox input:checked + i {
  background: #fff url(/styles/images/webshop/button-icons.png) -12.5em 0;
  background-size: 28.75em 3.375em;
}
input,
select,
textarea,
.coz-input-display,
.coz-input-checkbox input + i,
.coz-input-radio input + i {
  background: #fefefe;
  box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.1) inset;
  border-radius: 0;
}
.coz-input-number > input {
  padding-right: 1.5em;
}
.coz-input-time input[type="number"] {
  display: inline !important;
  position: static !important;
  width: 1.25em !important;
}
.coz-input-time button {
  min-width: 0;
}
.coz-input-number-buttons > button.icon {
  width: 1.125em;
  height: 1.125em;
  padding: 0 0.125em;
} /* 
.coz-input-checkbox {
	width:auto;
} */
.coz-input-checkbox input {
  display: none;
}
.coz-input-checkbox input + i {
  vertical-align: middle;
}
select {
  padding: 0.375em 0.1875em;
  height: 2.25em;
}
select[multiple] {
  padding: 0;
  height: auto;
}
option {
  padding: 0.4375em 0.5625em;
  height: 1.125em;
}
.chrome option,
.edge option {
  -webkit-appearance: none;
  -ms-appearance: none;
  padding: 0.375em 0.1875em;
  line-height: 2.25em;
}
.ie input[type="date"],
.ie input[type="text"],
.ie input[type="tel"],
.ie label > input[type="number"],
.ie label > .coz-input > input[type="number"],
.chrome input[type="date"],
.safari input[type="date"] {
  height: 2.25em;
}
.ie input[type="number"] {
  height: 1.5em;
}
.form-req {
  color: #c00;
}
button,
.button {
  display: inline-block;
  min-width: 4em;
  line-height: 1.25em;
  height: 2.25em;
  border-width: 0.0625em;
  padding: 0.4375em 0.6875em;
  text-decoration: none;
  text-align: center;
  font-weight: 500;
  border-color: transparent;
  background-color: #e6e6e6;
  background-color: rgba(0, 0, 0, 0.1);
  cursor: default;
  transition: background-color 0.3s;
}
button,
.button,
button[href],
.button[href],
button[href]:hover,
.button[href]:hover,
button[href]:focus,
.button[href]:focus,
button[href]:hover:active,
.button[href]:hover:active {
  color: #000;
}
button:hover,
.button:hover,
button:focus,
.button:focus {
  background-color: #cccccc;
  background-color: rgba(0, 0, 0, 0.2);
  transition: none;
}
button:hover:active,
.button:hover:active {
  background-color: #999999;
  background-color: rgba(0, 0, 0, 0.4);
}
button.selected,
.button.selected {
  border-color: #000;
  background-color: #000;
}
button.selected,
.button.selected,
button.selected[href],
.button.selected[href],
button.selected[href]:hover,
.button.selected[href]:hover,
button.selected[href]:focus,
.button.selected[href]:focus,
button.selected[href]:hover:active,
.button.selected[href]:hover:active {
  color: #fff;
}
button[disabled],
.button[disabled],
button.disabled,
.button.disabled {
  border-color: transparent;
  background-color: #f2f2f2;
  background-color: rgba(0, 0, 0, 0.05);
  color: rgba(0, 0, 0, 0.2);
}
button.selected,
.button.selected {
  border-style: solid;
}
button.selected,
.button.selected,
button[disabled],
.button[disabled],
button.disabled,
.button.disabled {
  pointer-events: none;
}
button > i,
.button > i {
  background-image: url(//www.arclearn.com/colorReplace/000000/images/webshop/button-icons-mask.svg);
  background-size: 31.25em 3.375em;
  margin: 0 0.5em 0 -0.25em;
}
button.icon,
.button-icon {
  width: auto;
  padding: 0.4375em;
}
button.icon i,
.button-icon i {
  margin: 0;
}
.button.action,
button.action,
button[name="action"] {
  color: #fff;
  background-color: #000000;
}
.button.action:hover,
button.action:hover,
button[name="action"]:hover,
.button.action:focus,
button.action:focus,
button[name="action"]:focus {
  color: #fff;
  background-color: #333333;
}
.button.action:focus,
button.action:focus,
button[name="action"]:focus {
  border-color: #000000;
}
.button.action:hover:active,
button.action:hover:active,
button[name="action"]:hover:active {
  color: #fff;
  background-color: #000000;
}
.button-red[href],
.button-red[name="action"] {
  color: #fff;
  background-color: #c00;
}
.button-red[href]:hover,
.button-red[name="action"]:hover,
.button-red[href]:focus,
.button-red[name="action"]:focus {
  color: #fff;
  background-color: #d63333;
}
.button-red[href]:hover:active,
.button-red[name="action"]:hover:active {
  color: #fff;
  background-color: #a30000;
}
button[type="submit"],
.button:link {
  cursor: pointer;
}
button::moz-focus-inner {
  border: 0;
  padding: 0;
}
input:focus,
select:focus,
textarea:focus,
button:focus,
.button:focus,
button:hover:active,
.button:hover:active,
button.selected,
.coz-input-checkbox input:hover:not(:disabled) + i,
.coz-input-checkbox input:focus:not(:disabled) + i {
  border-color: #000000;
  border-style: solid;
  outline: 0;
}
input[type="file"] {
  padding: 0;
  border: 0;
  box-shadow: none;
  width: auto;
}
input[type="file"]::-ms-value {
  border: 0;
  background: none;
  display: none;
}
input[type="file"]:valid::-ms-value {
  display: block;
}
input[type="file"]::-ms-browse {
  background: ButtonFace;
  border-color: ButtonFace;
  color: ButtonText;
  border-width: 1px;
  font: bold 12px/15px Arial;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: bottom;
  display: -moz-inline-box;
  border-style: outset;
  -ms-box-sizing: border-box;
  padding: 0.3125em 0.4375em;
  border: 0.0625em solid #999;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: inherit;
  font-size: inherit;
  line-height: 1.5;
  color: inherit;
  display: inline-block;
  min-width: 4em;
  line-height: 1.25em;
  height: 2.25em;
  border-width: 0.0625em;
  padding: 0.4375em 0.6875em;
  text-decoration: none;
  text-align: center;
  font-weight: 500;
  border-color: transparent;
  background-color: #e6e6e6;
  background-color: rgba(0, 0, 0, 0.1);
  cursor: default;
  transition: background-color 0.3s;
}
input[type="file"]::-ms-browse,
input[type="file"]::-ms-browse[href],
input[type="file"]::-ms-browse[href]:hover,
input[type="file"]::-ms-browse[href]:focus,
input[type="file"]::-ms-browse[href]:hover:active {
  color: #000;
}
input[type="file"]::-ms-browse:hover,
input[type="file"]::-ms-browse:focus {
  background-color: #cccccc;
  background-color: rgba(0, 0, 0, 0.2);
  transition: none;
}
input[type="file"]::-ms-browse:hover:active {
  background-color: #999999;
  background-color: rgba(0, 0, 0, 0.4);
}
input[type="file"]::-ms-browse.selected {
  border-color: #000;
  background-color: #000;
}
input[type="file"]::-ms-browse.selected,
input[type="file"]::-ms-browse.selected[href],
input[type="file"]::-ms-browse.selected[href]:hover,
input[type="file"]::-ms-browse.selected[href]:focus,
input[type="file"]::-ms-browse.selected[href]:hover:active {
  color: #fff;
}
input[type="file"]::-ms-browse[disabled],
input[type="file"]::-ms-browse.disabled {
  border-color: transparent;
  background-color: #f2f2f2;
  background-color: rgba(0, 0, 0, 0.05);
  color: rgba(0, 0, 0, 0.2);
}
input[type="file"]::-ms-browse.selected {
  border-style: solid;
}
input[type="file"]::-ms-browse.selected,
input[type="file"]::-ms-browse[disabled],
input[type="file"]::-ms-browse.disabled {
  pointer-events: none;
}
input[type="file"]::-ms-browse > i {
  background-image: url(//www.arclearn.com/colorReplace/000000/images/webshop/button-icons-mask.svg);
  background-size: 31.25em 3.375em;
  margin: 0 0.5em 0 -0.25em;
}
input.coz-input-invalid,
select.coz-input-invalid,
textarea.coz-input-invalid,
.coz-input-invalid > input + i {
  border-color: #c00;
  background-color: #fdd;
}
.coz-input-invalid:focus,
.coz-input-invalid > input:hover:not(:disabled) + i,
.coz-input-invalid > input:focus:not(:disabled) + i {
  border-color: #f00;
}
.coz-input-invalid:focus,
.coz-input-invalid > input:focus:not(:disabled) + i {
  background-color: #fff;
}
.coz-input-error {
  color: #c00;
  margin: 0 !important;
}
button.icon,
.button-icon,
.calendar button,
.paging .button,
.paging-header .button {
  min-width: 0;
}
.field-date {
  position: relative;
}
.datePicker {
  background: #ccc;
  padding: 0.5em;
}
.calendar {
  width: auto;
  font-size: 0.75em;
}
.calendar td {
  color: rgba(0, 0, 0, 0.25);
}
.calendar caption {
  padding-bottom: 0.5em;
  text-align: left;
}
.calendar caption > .coz-input-number > input,
.calendar caption > .coz-input > select {
  line-height: 1.6666666666666667;
  height: 2.5em;
}
.calendar caption > .coz-input-number > input,
.calendar caption > .coz-input > select,
.calendar caption > .coz-input-number {
  margin: 0;
}
.calendar caption > .coz-input > select {
  width: 92px;
  padding: 0 0.25em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.ie .calendar caption > .coz-input > select,
.chrome .calendar caption > .coz-input > select,
.safari .calendar caption > .coz-input > select {
  padding: 0.25em;
}
.calendar caption > .coz-input > select > option {
  padding: 0.2916666666666667em 0.5em;
}
.calendar caption > .coz-input-number,
.calendar caption > .coz-input-number input {
  width: 60px !important;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.calendar caption > .coz-input-number input {
  padding: 0.3333333333333333em 2em 0.3333333333333333em 0.5em;
}
.calendar caption > .coz-input-number button {
  width: 1.3333333333333333em;
  height: 1.25em;
}
.calendar td:last-child,
.calendar th:last-child {
  padding-right: 0;
}
.calendar tbody > tr:last-child > td {
  padding-bottom: 0;
}
table {
  border: 0;
  border-collapse: collapse;
}
th,
td {
  padding: 0.375em 0.375em 0 0;
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}
th ~ td {
  padding-left: 0.875em;
}
x thead th {
  border-bottom: 0.0625em solid #000;
}
x thead ~ tbody td {
  border-bottom: 0.0625em solid #ccc;
}
/* Message Bar */
.message-wrapper {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  -webkit-box-shadow: 0 0 40px #000;
  -moz-box-shadow: 0 0 40px #000;
  box-shadow: 0 0 40px #000;
}
.message-bar {
  width: 100%;
  background: #000;
  color: #fff;
  font-weight: bold;
  text-align: center;
  cursor: default;
}
.message-bar button.remove {
  position: absolute;
  bottom: 10px;
  right: 10px;
  top: auto;
  left: auto;
  width: 28px;
  height: 28px;
  padding: 4px;
}
.message-bar button.remove i {
  margin: 0;
}
.message-icon {
  position: absolute;
  top: 5px;
  left: 6px;
  width: 20px;
  height: 20px;
  display: block;
}
.message-busy .throbber {
  width: 20px;
  height: 20px;
  background-image: url('../images/webshop/throbber2.gif');
  vertical-align: bottom;
  display: block;
  margin: -3px auto -2px;
}
.message-text {
  width: 100%;
  padding: 10px 0px;
}
.message-error {
  background: #c00;
}
.coz-input-checkbox span {
  float: left;
}
.coz-input-checkbox input + i {
  float: none;
  vertical-align: top;
  margin: 0 0 0 0.5em;
}
footer .coz-input-checkbox {
  width: auto;
}
label.row {
  position: relative;
  padding-right: 5.2rem;
  margin: 0.5em 0;
  height: 4.2rem;
}
label.row .coz-input-datepicker {
  width: 100%;
}
label.row .remove {
  position: absolute;
  right: 0;
  top: 0;
}
section > form {
  display: block;
  margin-top: 1em;
  zoom: 1;
}
section > form:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
section > form:after {
  content: '';
  display: table;
  clear: both;
}
#Items div {
  position: relative;
}
#Items div.item {
  display: block;
  position: relative;
  padding: 0 3.75em 0.25em 0;
  margin: 0 0 0.25em;
  border-bottom: 1px solid #e6e6e6;
  zoom: 1;
}
#Items div.item:last-of-type {
  border: 0;
}
#Items div.item > b {
  float: left;
  margin: 0;
  min-height: 1px;
  font-weight: normal;
}
#Items div.item > b:nth-child(1) {
  width: 16%;
}
#Items div.item > b:nth-child(2) {
  width: 32%;
  margin-left: 0.25em;
}
#Items div.item > b:nth-child(3) {
  width: 10%;
  margin-left: 0.25em;
}
#Items div.item > b:nth-child(3),
#Items div.item > b:nth-child(3) input {
  box-sizing: border-box;
}
#Items div.item > b:nth-child(4) {
  width: 10%;
  margin-left: 0.25em;
}
#Items div.item > b:nth-child(5) {
  width: 24%;
  margin-left: 0.25em;
}
#Items div.item > b:nth-child(6) {
  width: 8%;
  margin-left: 0.25em;
  margin-right: -1.25em;
}
#Items div.item > b > .coz-input,
#Items div.item > b > .coz-input input,
#Items div.item > b > .coz-input select,
#Items div.item > b > .coz-input textarea {
  width: 100%;
}
#Items div.item > b > .coz-input textarea {
  height: 2.25em;
}
#Items div.item > button.remove {
  position: absolute;
  top: 0;
  right: 0;
}
#Items div.item:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
#Items div.item:after {
  content: '';
  display: table;
  clear: both;
}
@media (max-width: 959px) {
  #Items div.item { /* 
			& > :nth-child(1) { width:25%; }
			& > :nth-child(2) { width:50%; }
			& > :nth-child(3) { width:25%; margin-right:-8/16em; } 
			& > :nth-child(4) { width:75%; width:~"calc(75% + 0.25em)"; margin-left:0; margin-top:4/16em; }
			& > :nth-child(5) { width:25%; margin-right:-8/16em; margin-top:4/16em; } */
    padding-right: 0;
  }
  #Items div.item > b:nth-child(n) {
    clear: both;
    width: 100%;
    margin: 0;
  }
  #Items div.item > b:before {
    float: left;
    width: 33.333%;
    font-size: 0.75em;
    line-height: 3;
    color: #999999;
  }
  #Items div.item > b:nth-child(1):before {
    content: 'Code';
  }
  #Items div.item > b:nth-child(2):before {
    content: 'Description';
  }
  #Items div.item > b:nth-child(3):before {
    content: 'Quantity';
  }
  #Items div.item > b:nth-child(4):before {
    content: 'Sales Rep';
  }
  #Items div.item > b:nth-child(5):before {
    content: 'Comment';
  }
  #Items div.item > b:nth-child(6):before {
    content: 'Included';
  }
  #Items div.item > b:not(:first-child) {
    margin-top: 0.25em;
  }
  #Items div.item > b:nth-child(1) > .coz-input,
  #Items div.item > b:nth-child(2) > .coz-input,
  #Items div.item > b:nth-child(5) > .coz-input {
    width: 66.666%;
  }
  #Items div.item > b:nth-child(3) > .coz-input,
  #Items div.item > b:nth-child(4) > .coz-input {
    width: 33.333%;
  }
  #Items div.item > b:nth-child(6) > .coz-input {
    width: 16.666%;
  }
  #Items div.item > button.remove {
    position: absolute;
    top: auto;
    right: 0;
    bottom: 0.25em;
  }
}
#Items div.item-header {
  border-bottom: 1px solid #222;
  margin-top: 0;
}
#Items div.item-header:last-of-type {
  display: none;
}
@media (max-width: 959px) {
  #Items div.item-header {
    display: none;
  }
}
.data {
  width: 100%;
} /* 

.data {
	width:100%;
	th, td { white-space:normal; }
	th { border-bottom:1/16em solid #222; padding:0 8/16em; line-height:2; }
	td { border-bottom:1/16em solid #ccc; padding:6/16em 8/16em; line-height:36/16em; }
	th:first-child,
	td:first-child { padding-left:0; }
	th:last-child,
	td:last-child { padding-right:0; white-space:nowrap; }
	tbody:first-child tr:first-child td { padding-top:0; }
	tbody ~ thead th { padding-top:0.5em; }
	section > * ~ & { margin-top:1em; }
	section > form ~ & { margin-top:0.5em; }
	td > select,
	td > input,
	td > .coz-input,
	td > form > select,
	td > form > input,
	td > form > .coz-input { vertical-align:top; max-width:100%; }
	.tip-element { display:none; }
} */
.data th,
.data td {
  vertical-align: middle;
  white-space: normal;
}
.data th {
  padding: 0 0.5em;
  line-height: 2;
}
.data td {
  padding: 0.375em 0.5em;
}
.data th:first-child,
.data td:first-child {
  padding-left: 0;
}
.data th:last-child,
.data td:last-child {
  padding-right: 0;
  white-space: nowrap;
}
.data th,
.data td {
  border-bottom: 0;
}
.data thead > tr {
  border-bottom: 1px solid #222;
}
.data tbody > tr:not(:last-child) {
  border-bottom: 1px solid #e6e6e6;
}
#deliveries tr > td > div + div small + small:before {
  content: '\2022\00a0';
}
@media (max-width: 959px) {
  #deliveries table,
  #driver_items table,
  #users table,
  #deliveries tbody,
  #driver_items tbody,
  #users tbody,
  #deliveries tr,
  #driver_items tr,
  #users tr,
  #deliveries th,
  #driver_items th,
  #users th,
  #deliveries td,
  #driver_items td,
  #users td {
    display: block;
  }
  #deliveries thead > tr,
  #driver_items thead > tr,
  #users thead > tr {
    display: none;
  }
  #deliveries tr,
  #driver_items tr,
  #users tr {
    zoom: 1;
  }
  #deliveries tr:after,
  #driver_items tr:after,
  #users tr:after {
    content: '.';
    display: block;
    clear: both;
    visibility: hidden;
    font-size: 0;
    height: 0;
  }
  #deliveries tr:after,
  #driver_items tr:after,
  #users tr:after {
    content: '';
    display: table;
    clear: both;
  }
  #deliveries tr > th,
  #driver_items tr > th,
  #users tr > th {
    display: none;
  }
  #deliveries tr > td,
  #driver_items tr > td,
  #users tr > td {
    border-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    clear: left;
  }
  #deliveries tr > td[data-label]:before,
  #driver_items tr > td[data-label]:before,
  #users tr > td[data-label]:before {
    content: attr(data-label);
    float: left;
    width: 33.333%;
    font-size: 0.75em;
    line-height: 1.8333333333333333;
    color: #999999;
  }
  #deliveries tr > td:after,
  #driver_items tr > td:after,
  #users tr > td:after {
    content: '\00a0';
  }
  #deliveries tr:first-child > :first-child,
  #driver_items tr:first-child > :first-child,
  #users tr:first-child > :first-child,
  #deliveries tr > :not(:first-child),
  #driver_items tr > :not(:first-child),
  #users tr > :not(:first-child) {
    padding-top: 0;
  }
  #deliveries tr:last-child > :last-child,
  #driver_items tr:last-child > :last-child,
  #users tr:last-child > :last-child,
  #deliveries tr > :not(:last-child),
  #driver_items tr > :not(:last-child),
  #users tr > :not(:last-child) {
    padding-bottom: 0;
  }
  #deliveries tr > td:after {
    content: none;
  }
  #deliveries tr > td > small,
  #deliveries tr > td > div + div small {
    display: block;
    padding-left: 33.333%;
  }
  #deliveries tr > td > small + small:before,
  #deliveries tr > td > div + div small + small:before {
    content: none;
  }
}
span.required:before {
  content: '*';
  color: #c00;
  font-size: 2em;
  line-height: 0.34375;
  vertical-align: bottom;
}
#deliveries tr > :last-child,
#users tr > :last-child {
  width: 1%;
}
@media (max-width: 959px) {
  #deliveries tr > :last-child,
  #users tr > :last-child {
    width: auto;
    text-align: right;
    padding-top: 0.375em;
  }
  #deliveries tr > :last-child:before,
  #users tr > :last-child:before,
  #deliveries tr > :last-child:after,
  #users tr > :last-child:after {
    content: none;
  }
}
.paging {
  position: relative;
  text-align: center;
  padding: 0 74px;
  word-spacing: -3.45px;
  background: #eee;
}
.paging-header {
  font-weight: bolder;
  line-height: 2.25em;
}
.paging-counts {
  float: right;
}
.paging .button-arrowLeft {
  position: absolute;
  left: 0;
}
.paging .button-arrowRight {
  position: absolute;
  right: 0;
}
.paging .button-doubleArrowLeft {
  position: absolute;
  left: 0;
}
.paging .button-doubleArrowRight {
  position: absolute;
  right: 0;
}
.paging .button-doubleArrowLeft + .button-arrowLeft {
  left: 37px;
}
.paging .button-doubleArrowRight + .button-arrowRight {
  right: 37px;
}
.terms-and-conditions {
  padding-left: 1em;
}
.terms-and-conditions li {
  margin: 0.5em 0;
}
.warning {
  color: #c00;
  line-height: 1.5;
}
.warning i {
  display: inline-block;
  width: 1.125em;
  height: 1em;
  vertical-align: top;
  margin-top: 0.25em;
  background: url(/images/warning.svg);
  background-size: 100% 100%;/* 
		border-width:0 9/16em 16/16em 9/16em;
		border-color:#c00 transparent;
		border-style:solid;
		line-height:0;
		width:0;
		height:0;
		vertical-align:top;
		margin-top:4/16em;
		position:relative;
		&:before {
			content:'!';
			display:inline-block;
			color:#fff;
			font-size:12/16em;
			font-style:normal;
			font-weight:bold;
			line-height:12/12;
			width:18/12em;
			text-align:center;
			position:absolute;
			top:4/12em;
			left:-9/12em;
		} */
}
label .warning {
  display: inline-block;
  margin: -0.25em 0;
}
.deliveries-header {
  margin-top: 0;
  margin-bottom: 0.5em;
}
.deliveries-header a.button {
  margin-bottom: 0.25em;
}
.deliveries-header button {
  display: none;
}
.deliveries-header a.button,
.deliveries-header button {
  vertical-align: top;
}
@media (max-width: 959px) {
  .deliveries-header .button {
    display: none;
  }
  .deliveries-header button,
  .deliveries-header .selected,
  .deliveries-header.open .button {
    display: inline-block;
    vertical-align: top;
  }
}
@media (max-width: 479px) {
  #datetime {
    display: block;
    padding-left: 0.25em;
    text-align: right;
  }
  #datetime > .coz-input {
    float: left;
    width: 50%;
  }
  #datetime > .coz-input > input[type="date"] {
    width: 100%;
  }
  #datetime > .coz-input:first-child {
    margin: 0 0.25em 0 -0.25em;
  }
  #datetime > button {
    margin-top: 0.25em;
  }
}
.delivery-tabs {
  display: block;
  padding: 0 3px 0 0;
  zoom: 1;
}
.delivery-tabs:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.delivery-tabs:after {
  content: '';
  display: table;
  clear: both;
}
.delivery-tabs li {
  display: block;
  float: left;
  width: 25%;
  text-align: center;
}
.delivery-tabs li + li {
  margin-left: 1px;
}
.delivery-tabs li:last-child {
  margin-right: -3px;
}
.delivery-tabs li .button {
  width: 100%;
}
.delivery-tabs ~ div {
  display: none;
}
.delivery-tabs ~ div:target,
.delivery-tabs ~ div.selected {
  display: block;
}
.delivery-calendar .heading {
  zoom: 1;
}
.delivery-calendar .heading:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.delivery-calendar .heading:after {
  content: '';
  display: table;
  clear: both;
}
.delivery-calendar .range {
  text-align: center;
  line-height: 2.25em;
}
.delivery-calendar .day {
  display: none;
}
.delivery-calendar dl {
  float: left;
  width: 12.5%;
  font-size: smaller;
  margin: 1em 0 0;
}
.delivery-calendar dt,
.delivery-calendar dd {
  display: block;
}
.delivery-calendar dt {
  height: 1.25em;
  padding: 0.5em;
  font-weight: bolder;
}
.delivery-calendar dd {
  height: 2.25em;
}
.delivery-calendar .time-slots dt {
  border-bottom: 1px solid transparent;
}
.delivery-calendar .time-slots dt ~ dt {
  border-right: 1px solid #000;
}
.delivery-calendar .date dt,
.delivery-calendar .date dd {
  text-align: center;
  border-bottom: 1px solid #000;
}
.delivery-calendar .date dt {
  border-right: 1px solid transparent;
}
.delivery-calendar .date dd {
  border-right: 1px solid #000;
  position: relative;
  vertical-align: middle;
  padding: 0;
}
.delivery-calendar .date dd:first-child {
  border: 0;
  color: #000;
  text-align: left;
}
.delivery-calendar .date dd a,
.delivery-calendar .date dd button {
  display: block;
  width: 100%;
  line-height: 1.25;
  padding: 0.5em;
  color: #000;
  text-decoration: none;
  text-align: center;
  border: 0 !important;
  background-color: transparent;
  box-sizing: border-box;
}
.delivery-calendar .date dd a[href]:hover,
.delivery-calendar .date dd a[href]:focus {
  background-color: #D6AF30;
  color: #fff;
}
.delivery-calendar .date dd button[value="insert"]:hover,
.delivery-calendar .date dd button[value="insert"]:focus {
  background-color: #c00;
  color: #fff;
}
.delivery-calendar .date dd button[value="delete"]:hover,
.delivery-calendar .date dd button[value="delete"]:focus {
  background-color: #0c0;
  color: #fff;
}
.delivery-calendar .date dd a[data-count="1"] {
  background: rgba(214, 175, 48, 0.2);
}
.delivery-calendar .date dd a[data-count="2"] {
  background: rgba(214, 175, 48, 0.3);
}
.delivery-calendar .date dd a[data-count="3"] {
  background: rgba(214, 175, 48, 0.4);
}
.delivery-calendar .date dd a[data-count="4"] {
  background: rgba(214, 175, 48, 0.5);
}
.delivery-calendar .date dd a[data-count="5"] {
  background: rgba(214, 175, 48, 0.6);
}
.delivery-calendar .date dd a[data-count="6"] {
  background: rgba(214, 175, 48, 0.7);
}
.delivery-calendar .date dd a[data-count="7"] {
  background: rgba(214, 175, 48, 0.8);
}
.delivery-calendar .date dd a[data-count="8"] {
  background: rgba(214, 175, 48, 0.9);
}
.delivery-calendar .date dd a.past {
  background: rgba(0, 0, 0, 0.1);
}
.delivery-calendar .date dd a.selected {
  background-color: #000000;
  color: #fff;
}
.delivery-calendar .date dd a.blocked {
  background: #c00;
  color: #fff;
  cursor: default;
}
.delivery-calendar .date dd a + * {
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
}
.delivery-calendar .date dd a + * + * {
  display: none;
}
.delivery-calendar .date dd a:first-child + :hover,
.delivery-calendar .date dd a:first-child + * + .selected {
  display: block;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
}
@media (max-width: 959px) {
  .delivery-calendar dl {
    width: 50%;
  }
  .delivery-calendar .week,
  .delivery-calendar .range,
  .delivery-calendar .date {
    display: none;
  }
  .delivery-calendar .day,
  .delivery-calendar .view {
    display: block;
  }
}
.delivery-header {
  zoom: 1;
}
.delivery-header:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.delivery-header:after {
  content: '';
  display: table;
  clear: both;
}
.delivery-header > dt {
  float: left;
  clear: left;
  font-weight: bolder;
  width: 320px;
}
.delivery-header > dd ~ dt,
.delivery-header > dd ~ dt ~ dd {
  padding-top: 0.5em;
}
.delivery-header > dd {
  overflow: hidden;
}
@media (max-width: 767px) {
  .delivery-header > dt {
    width: 240px;
  }
}
@media (max-width: 599px) {
  .delivery-header > dt {
    float: none;
    width: auto;
  }
  .delivery-header > dd ~ dt ~ dd {
    padding-top: 0;
  }
}
.delivery-filters {
  zoom: 1;
}
.delivery-filters:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.delivery-filters:after {
  content: '';
  display: table;
  clear: both;
}
.delivery-filters > * {
  float: left;
}
.delivery-filters > select {
  margin-right: 0.25em;
}
@media (max-width: 959px) {
  .delivery-filters > * {
    float: none;
  }
  .delivery-filters > form {
    display: block;
    margin-top: 0.25em;
  }
}
.radio_toggle input {
  display: none;
}
.radio_toggle [value="N"]:checked ~ button:after {
  content: 'No';
}
.radio_toggle [value="Y"]:checked ~ button:after {
  content: 'Yes';
}
@media screen and (max-width: 599px), screen and (max-height: 599px) {
  main {
    padding: 1em;
  }
  main > h1 {
    margin-bottom: 0.5em;
  }
  footer {
    background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8) 1em, #ffffff);
  }
  footer > * {
    padding: 1em 0;
  }
  footer.fixed {
    padding: 0 1em;
  }
  p + footer > * {
    margin-top: -1em;
  }
}
@media screen and (max-width: 414px), screen and (max-height: 414px) and (min-width: 436px) {
  body,
  .paging-pages .button {
    font-size: 14.222222222222221px;
  }
  .paging-pages {
    border-width: 0 33px;
  }
  .paging {
    word-spacing: -3px;
  }
  .paging .button-doubleArrowLeft + .button-arrowLeft {
    left: 33px;
  }
  .paging .button-doubleArrowRight + .button-arrowRight {
    right: 33px;
  }
  button,
  .button,
  input {
    height: 2.6666666666666665em;
    border-width: 0.08333333333333333em;
    line-height: 1.3333333333333333em;
    padding: 0.5833333333333334em 0.75em;
  }
  button.icon,
  .button-icon {
    padding: 6.111111111111111px;
  }
  button > i,
  .button > i {
    margin: -1.5px 6.5px -1.5px -3.5px;
  }
  button.icon > i,
  .button-icon > i {
    margin: 0;
  }
  .coz-input-number-buttons > button > i {
    margin: -1.5px 6.5px -1.5px -3.5px;
  }
}
@media screen and (max-width: 320px), screen and (max-height: 320px) and (min-width: 436px) {
  body,
  .paging-pages .button {
    font-size: 12px;
  }
  .paging-pages {
    border-width: 0 28px;
  }
  main {
    border-top-width: 48px;
  }
  .paging {
    word-spacing: -2px;
  }
  .paging .button-doubleArrowLeft + .button-arrowLeft {
    left: 28px;
  }
  .paging .button-doubleArrowRight + .button-arrowRight {
    right: 28px;
  }
  button.icon,
  .button-icon {
    padding: 5px;
  }
}
@media print {
  body {
    height: auto;
  }
  main,
  header > a {
    padding: 0 !important;
  }
  menu,
  footer,
  form,
  button,
  .button {
    display: none !important;
  }
  tr.hide {
    display: table-row !important;
  }
}
header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  padding: 0;
  z-index: 1000;
  background: #000000;
}
header img {
  padding: 0.625em 0;
  height: 2.25em;
}
header menu {
  margin: 0;
  padding: 0;
}
header menuitem {
  line-height: 56px;
}
header #account_menu {
  float: right;
}
header #navigation_menu {
  display: block;
  max-width: 960px;
  margin: auto;
  font-size: 0;
  white-space: nowrap;
}
header b {
  display: inline-block;
  font-size: 16px;
  padding: 0 1em;
  color: #fff;
}
header a,
header a:link,
header a:visited {
  display: inline-block;
  font-size: 16px;
  padding: 0 1em;
  color: #fff !important;
  text-decoration: none;
  vertical-align: top;
}
header a[href]:hover,
header a[href]:focus {
  background: brighten(brighten(#000000, 10%), 10%);
  background: rgba(255, 255, 255, 0.1);
  outline: 0;
}
header a.current {
  background: #000000;
}
header > a {
  float: left;
}
header:after {
  content: '';
  display: table;
  clear: both;
}
@media screen and (max-width: 959px) {
  header header {
    overflow: visible;
  }
  header menu {
    display: none !important;
  }
  header .open {
    display: block !important;
    clear: both;
    width: 100%;
    overflow: auto;
    text-align: right;
  }
  header .open:after {
    content: '';
    display: block;
    position: absolute;
    top: 100%;
    bottom: -10000px;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.6);
  }
  header #account_button,
  header #navigation_button,
  header #back_button {
    float: right;
    line-height: 20px;
    padding: 18px;
  }
  header #account_button:before,
  header #navigation_button:before,
  header #back_button:before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: top;
    background: url(//www.arclearn.com/colorReplace/fff/images/webshop/button-icons-mask.svg);
  }
  header #account_button:before {
    background-position: -358px -20px;
  }
  header #account_button.loggedin:before {
    background-position: -298px -20px;
  }
  header #navigation_button:before {
    background-position: -198px -20px;
  }
  header #back_button:before {
    background-position: 0 0;
  }
  header #back_button {
    float: left;
  }
}
@media screen and (max-width: 599px) {
  header,
  header:before {
    height: 56px;
  }
  header {
    background: rgba(0, 0, 0, 0);
    transition: background 0.3s, height 0s 0.3s;
  }
  header.open {
    background: rgba(0, 0, 0, 0.6);
    height: 100%;
    transition: background 0.3s;
  }
  header:before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    background: #000000;
    z-index: -1;
  }
  header menu {
    display: block !important;
    transform: translateX(100%);
    transition: transform 0.3s;
    position: absolute;
    top: 56px;
    right: 0;
    bottom: 0;
    left: 56px;
    width: auto;
    background: #000000;
  }
  header .open {
    transform: translateX(0);
    text-align: left;
    z-index: 1;
  }
  header .right {
    float: none;
  }
  header a,
  header a:link,
  header a:visited {
    display: block;
  }
  .no-transform header menu {
    left: 100%;
    right: -1000px;
    transition: left 0.3s, right 0.3s;
  }
  .no-transform header .open {
    left: 56px;
    right: 0;
  }
}
@media screen and (max-width: 320px), screen and (max-height: 320px) and (min-width: 436px) {
  header,
  header:before {
    height: 48px;
  }
  header menu {
    top: 48px;
    left: 48px;
  }
  header menuitem {
    line-height: 48px;
  }
  header a,
  header a:link,
  header a:visited {
    font-size: 12px;
  }
  header img {
    height: 32px;
  }
  header #account_button,
  header #navigation_button {
    padding: 14px;
  }
  .no-transform header .open {
    left: 48px;
  }
}
.tool-tip {
  position: absolute;
  left: -10000px;
  top: -10000px;
  z-index: 10000;
  visibility: hidden;
  overflow: visible;
  pointer-events: none;
  min-width: 10px;
  max-width: 400px;
  padding: 0.5em;
  color: #fff;
  background: #000000;
}
.tip-title,
.tip-text {
  font-size: 0.75em;
  line-height: 1.25;
  white-space: pre-line;
}
.tip-title {
  color: #000000;
  font-weight: bolder;
}
:root {
  --padding: max(64px, calc(50vw - 600px));
}
body {
  height: auto;
}
body > footer {
  display: none;
}
body:not(.ios):not(.app) #back_button {
  display: none !important;
}
header > a:first-child span {
  font-size: 24px;
  line-height: 56px;
}
header > a:first-child sup {
  font-size: 11px;
}
h1 {
  margin: 0 0 16px;
}
h2 {
  margin: 16px 0;
}
.app header {
  display: flex;
  align-items: flex-start;
}
.app.ios header > a[href="/"] {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.app #account_button {
  margin-left: auto;
}
.app #navigation_button,
.app:not(.home) #account_button {
  display: none !important;
}
main.home {
  position: relative;
  z-index: 2;
  background: #fff;
}
main.home,
main.home + header:before {
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.4);
}
main.home ~ footer {
  display: block;
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  background: #ccc;
  font-size: 12px;
  line-height: 16px;
  padding: 12px 16px;
}
main.home ~ footer > * {
  padding: 4px 0;
}
main.home .grit-image {
  position: relative;
  max-height: 33.333333333333336vh;
  overflow: hidden;
}
main.home .grit-image > div {
  position: absolute;
  bottom: 0;
  padding: 16px;
  width: 100%;
  box-sizing: border-box;
}
main.home .grit-image .grit-text {
  font-size: 48px;
  line-height: 24px;
  color: #fff;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.8);
}
main.home .grit-image .get-grit {
  margin-top: 16px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.8);
}
main.home .grit-image sup {
  font-size: 26px;
}
main.home .grit-image small {
  font-size: 18px;
}
main.home .grit-image form {
  display: flex;
}
main.home .grit-image form :first-child {
  width: 100%;
}
main.home .grit-image form > span:not(.coz-input) {
  padding: 7px 0;
}
main.home .grit-image form button {
  flex-shrink: 0;
  margin-left: 8px;
}
main.home .grit-image a {
  display: block;
  margin-top: 16px;
  text-align: center;
  font-weight: bolder;
  text-decoration: none;
}
main.home .grit-image input[type="image"] {
  width: auto;
  background: none;
  border: 0;
  padding: 0;
  margin: -3px 0;
  box-shadow: none;
}
main.home .grit-header {
  position: relative;
  max-height: 304px;
}
main.home .grit-header:before {
  content: '';
  display: block;
  padding-top: 60%;
}
main.home .grit-header > img,
main.home .grit-header > div {
  position: absolute;
  bottom: 0;
}
main.home .grit-header > div {
  padding: 16px;
  font-size: 48px;
  line-height: 24px;
  color: #fff;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.8);
}
main.home .grit-header > div > sup {
  font-size: 26px;
}
main.home .grit-header > div > small {
  font-size: 18px;
}
main.home .grit-header-marketing > div {
  bottom: 96px;
}
main.home .grit-marketing {
  position: relative;
  padding: 16px;
  background: linear-gradient(to right, #e6e6ee, #979088);
} /* 
	
	.grit-tagline {
		padding:16px; background:#000; color:#fff; font-size:1.25em; font-weight:bold; text-align:center;
		span { display:block; }
	}
	.grit-marketing {
		padding:0;
		dt { margin:1em 0 0.5em; font-weight:bold; }
		dd { margin:0.5em 0 1em; }
	} */
main.home .grit-marketing > div {
  margin-top: -112px;
  padding: 16px;
  background: #fff;
}
main.home section {
  position: relative;
  padding: 0 0 16px;
  overflow: hidden;
}
main.home section:nth-of-type(2n) {
  background: #f7f7f7;
}
main.home section > * {
  display: block;
  padding: 0 16px;
}
main.home .section-title {
  line-height: 24px;
  padding: 16px;
  /* 80px 16px 16px; */ font-size: 1.4rem;
  font-weight: bold;
}
main.home .view-all {
  position: absolute;
  right: 0;
  top: 0;
  line-height: 24px;
  padding: 16px;
  font-size: 1.2rem;
  text-decoration: none;
  color: #ccc;
}
main.home .videos {
  position: relative;
  clear: both;
  padding: 0;
  overflow: hidden;
}
main.home .videos-scroller {
  display: flex;
  flex-wrap: nowrap;
  padding-left: 16px;
  overflow: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  will-change: transform;
  padding-bottom: 32px;
  margin-bottom: -32px;
}
x main.home .videos-scroller {
  scroll-snap-type: x mandatory;
  scroll-padding: 0 0 0 16px;
  scroll-snap-stop: always;
}
main.home .videos-scroller > * {
  position: relative;
  float: left;
  color: inherit !important;
  text-decoration: none !important;
  flex-stretch: 0;
  min-width: calc((100% - 8px) / 2 - 8px);
  max-width: calc((100% - 8px) / 2 - 8px);
  scroll-snap-align: start;
}
@media (min-width: 640px) {
  main.home .videos-scroller > * {
    min-width: calc((100% - 8px) / 3 - 8px);
    max-width: calc((100% - 8px) / 3 - 8px);
  }
}
@media (min-width: 960px) {
  main.home .videos-scroller > * {
    min-width: calc((100% - 24px) / 4 - 8px);
    max-width: calc((100% - 24px) / 4 - 8px);
  }
}
@media (min-width: 1280px) {
  main.home .videos-scroller > * {
    min-width: calc((100% - 56px) / 6 - 8px);
    max-width: calc((100% - 56px) / 6 - 8px);
  }
}
main.home .videos-scroller.no-snap {
  scroll-snap-type: none;
}
main.home .videos-scroller.no-snap > * {
  scroll-snap-align: initial;
}
main.home .videos-scroller > * + * {
  margin-left: 8px;
}
/* & > :last-child { border-right:16px solid transparent; } */
main.home .videos-scroller:after {
  content: '';
  display: block;
  width: 16px;
  flex-shrink: 0;
}
main.home .videos-scroller > * > img {
  position: absolute;
  width: 100%;
  transition: opacity 0.3s;
}
main.home .videos-scroller > * > img:not(.loaded) {
  opacity: 0;
}
main.home .videos-scroller > [data-video-levels] {
  overflow: hidden;
}
main.home .videos-scroller > [data-video-levels]:after {
  content: attr(data-video-levels);
  position: absolute;
  top: 16px;
  left: -76px;
  transform: rotate(-45deg) translate3d(0, 0, 1px);
  background: #000;
  width: 200px;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  font-size: 10px;
  line-height: 20px;
  box-shadow: 0 0 5px #fff;
} /* & > [data-video-levels] > img { filter:grayscale(100%); } */
main.home .videos-section > a {
  position: absolute;
  height: 56px;
  margin-top: -56px;
}
@media screen and (max-width: 320px), screen and (max-height: 320px) and (min-width: 436px) {
  main.home .videos-section > a {
    height: 48px;
    margin-top: -48px;
  }
}
main.home .videos-image {
  display: block;
  width: 100%;
  padding-top: 100%;
  background-position: center;
  background-size: cover;
}
main.home .videos-text {
  font-size: 1.2rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
main.home .videos-text:before {
  content: '';
  display: block;
  background: #000;
  padding-top: 56.25%;
  margin-bottom: 8px;
}
main.home .videos-left,
main.home .videos-right {
  position: absolute;
  top: 0;
  min-width: 0;
  height: 100%;
  padding: 0 16px;
  border: 0;
  font-size: 24px;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 4px #fff;
  opacity: 0;
  transition: transform 0.3s, opacity 0.3s;
}
main.home .videos-left {
  left: 0;
  transform: translateX(-100%);
  background: linear-gradient(to right, #ffffff, rgba(255, 255, 255, 0));
}
main.home .videos-right {
  right: 0;
  transform: translateX(100%);
  background: linear-gradient(to left, #ffffff, rgba(255, 255, 255, 0));
}
main.home .videos-button-visible {
  transform: translateX(0);
  opacity: 0.5;
}
main.home .videos-button-visible:hover {
  background-color: transparent;
  opacity: 1;
}
main.home section:nth-of-type(2n) .videos-left {
  background: linear-gradient(to right, #f7f7f7, rgba(247, 247, 247, 0));
}
main.home section:nth-of-type(2n) .videos-right {
  background: linear-gradient(to left, #f7f7f7, rgba(247, 247, 247, 0));
}
.grit-marketing {
  padding: 16px;
}
.grit-marketing > div > div + div {
  margin-top: 16px;
}
.grit-marketing > div > form > span {
  display: block;
}
.grit-marketing > div > .button,
.grit-marketing > div > form button {
  /* width:100%; */ margin-top: 16px;
}
.grit-marketing > div > div:last-child {
  /* text-align:center; */ margin-top: 16px;
/* font-size:1.2rem; */ }
.grit-marketing > div > div:last-child > a {
  text-decoration: none;
}
.grit-marketing > div > div:last-child > img {
  position: absolute;
}
#vimeo-iframe {
  display: none;
}
.video-overlay {
  position: fixed;
  z-index: 3;
  transition: left 0.3s, top 0.3s, width 0.3s, height 0.3s, opacity 0.3s, margin-left 0.3s;
  background: #fff;
  opacity: 0;
}
.video-overlay-close {
  position: absolute;
  top: 56px;
  right: 0;
  opacity: 0;
  transition: background-color 0.3s, opacity 0.3s 0.3s;
  background-image: linear-gradient(to right, rgba(255,255,255,0), rgb(255,255,255,1) 20px);
  background-origin: border-box;
}
.video-overlay-close:hover,
.video-overlay-close:focus {
  background-image: none;
}
.video-overlay-title {
  height: 0;
  margin-top: 0;
  padding: 0 16px;
  font-size: 1.4rem;
  font-weight: bold;
  overflow: hidden;
  line-height: 56px;
  opacity: 0;
  transition: height 0.3s, margin-top 0.3s, opacity 0.3s 0.3s;
}
.video-overlay-iframe-container {
  position: relative;
  background: #000;
  background-position: center;
  background-size: cover;
}
.video-overlay-iframe-container iframe {
  position: absolute;
  width: 100%;
  height: 100%;
}
.video-overlay-buttons button {
  float: left;
  height: 56px;
}
.video-overlay-buttons button[data-count]:after {
  content: attr(data-count);
  margin-left: 8px;
}
.video-overlay-iframe-container:before {
  content: '';
  float: left;
  padding-bottom: 56.25%;
}
.video-overlay-iframe-container:after {
  content: '';
  display: table;
  clear: both;
}
.video-overlay .grit-marketing {
  border: 16px solid transparent;
  background: #fff;
  background-clip: padding-box;
  opacity: 0;
  transition: opacity 0.3s;
}
.video-overlay-maximized {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: auto;
  opacity: 1;
}
.video-overlay-maximized .video-overlay-close {
  opacity: 1;
}
.video-overlay-maximized .video-overlay-title {
  height: 56px;
  margin-top: 56px;
  opacity: 1;
}
.video-overlay > button {
  height: 56px;
  min-width: 56px;
}
.video-overlay > button:not(:hover):not(:focus),
.video-overlay-buttons > button:not(:hover):not(:focus) {
  background-color: transparent;
}
.video-overlay #vimeo-iframe {
  display: block;
}
img.desktop {
  display: none;
}
@media screen and (max-width: 320px), screen and (max-height: 320px) and (min-width: 436px) {
  header > a:first-child span {
    line-height: 48px;
  }
  main.home .grit-image > div {
    padding: 12px;
  }
  main.home .grit-header > div {
    padding: 12px;
  }
  main.home .grit-image .get-grit {
    margin-top: 12px;
    padding: 12px;
  } /* 
		.grit-marketing { padding:16px 0 32px; } */
  main.home .section-title,
  main.home .view-all {
    line-height: 16px;
  }
  .video-overlay-close {
    top: 48px;
  }
  .video-overlay button {
    height: 48px;
    min-width: 48px;
  }
  .video-overlay-title {
    line-height: 48px;
  }
  .video-overlay-maximized .video-overlay-title {
    height: 48px;
    margin-top: 48px;
  }
}
@media screen and (min-width: 800px) {
  .video-overlay {
    box-shadow: 0 0 0 2000px rgba(0, 0, 0, 0.8);
  }
  .video-overlay-close {
    top: 0;
  }
  .video-overlay-maximized {
    left: 50% !important;
    width: 640px !important;
    top: 112px !important;
    height: auto !important;
    margin-left: -320px;
  }
  .video-overlay-maximized .video-overlay-title {
    margin-top: 0;
  }
}
@media screen and (min-width: 960px) {
  main.home .grit-image > div {
    padding: 32px;
  }
  main.home .grit-header > div {
    padding: 32px;
  }
  main.home .grit-tagline div {
    display: inline;
  } /* 
		.grit-marketing { padding:16px; } */
  main.home .grit-header {
    overflow: hidden;
  }
  main.home .grit-header > img {
    bottom: -50%;
  }
  main.home .grit-header-marketing > div {
    bottom: 0;
  }
  main.home .grit-marketing {
    padding: 0;
  }
  main.home .grit-marketing > div {
    position: absolute;
    width: 640px;
    left: auto;
    right: 32px;
    bottom: 32px;
  }
  main.home .video-overlay .grit-marketing {
    margin: 32px;
  }
  main.home .videos-section {
    padding-bottom: 32px;
  }
  main.home .section-title {
    padding: 32px 96px 16px 32px;
  }
  main.home .view-all {
    padding: 32px 32px 16px;
  }
  main.home .videos-scroller {
    padding-left: 32px;
    scroll-padding: 0 0 0 32px;
  }
  /* .videos-scroller > :last-child { border-right-width:32px; } */
  main.home .videos-scroller:after {
    width: 32px;
  }
  .video-overlay-maximized {
    left: 16.667% !important;
    width: 66.667% !important;
    margin-left: 0;
  }
  img.phone {
    display: none;
  }
  img.desktop {
    display: inline;
  }
}
@media screen and (min-width: 1280px) {
  main.home .grit-image > div {
    padding: 32px var(--padding);
  }
  main.home .grit-header > img {
    bottom: -100%;
  }
  main.home .grit-header > div,
  main.home .section-content {
    padding: 32px var(--padding);
  } /* 
		.grit-marketing { padding:16px 48px; } */
  main.home .grit-marketing > div {
    right: var(--padding);
  }
  main.home .section-title {
    padding: 32px calc(2 * var(--padding)) 16px var(--padding);
  }
  main.home .view-all {
    padding: 32px var(--padding) 16px;
  }
  main.home .videos-scroller {
    padding-left: var(--padding);
    scroll-padding: 0 0 0 var(--padding);
  }
  /* .videos-scroller > :last-child { border-right-width:var(--padding); } */
  main.home .videos-scroller:after {
    width: var(--padding);
  }
  main.home .column {
    padding: 0 32px 0 0;
  }
  main.home .column-3 + .column-3 {
    padding: 0 32px;
  }
  main.home .column-3 + .column-3 + .column-3 {
    padding: 0 0 0 32px;
  }
  main.home .videos-left {
    left: calc(var(--padding) - 64px);
    z-index: 2;
  }
  main.home .videos-right {
    right: calc(var(--padding) - 64px);
    z-index: 2;
  }
  .videos:before,
  .videos:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    width: var(--padding);
    z-index: 1;
    background: #fff;
  }
  section:nth-of-type(2n) .videos:before,
  section:nth-of-type(2n) .videos:after {
    background: #f7f7f7;
  }
  .videos:before {
    left: 0;
  }
  .videos:after {
    right: 0;
  }
}
.video {
  width: 100%;
  max-width: 640px;
  padding-bottom: calc(56.25%);
  position: relative;
}
.video iframe {
  width: 100%;
  height: 100%;
  position: absolute;
}
.icons {
  margin: 16px 0;
}
.icons i {
  margin-right: 4px;
}
.icons a {
  text-decoration: none !important;
}
.icons a + a {
  margin-left: 16px;
}
.comments div {
  position: relative;
  padding-top: 1.5em;
  margin: 16px 0;
}
.comments div:before {
  content: attr(data-name);
  position: absolute;
  top: 0;
  left: 0;
  font-size: smaller;
}
.comments div:after {
  content: attr(data-datetime);
  position: absolute;
  top: 0;
  right: 0;
  font-size: smaller;
  color: #999999;
}
#section-videos .section-video,
#page-sections .section-video {
  display: flex;
  position: relative;
  float: none;
  margin: 0;
}
#section-videos .section-video .coz-input,
#page-sections .section-video .coz-input,
#section-videos .section-video input,
#page-sections .section-video input,
#section-videos .section-video select,
#page-sections .section-video select {
  width: 100%;
  order: 1;
}
#section-videos .section-video .button-sort,
#page-sections .section-video .button-sort {
  order: 0;
  margin-right: 0.25em;
}
#section-videos .section-video button.remove,
#page-sections .section-video button.remove {
  order: 2;
  margin-left: 0.25em;
}
#section-videos .section-video.dragging,
#page-sections .section-video.dragging {
  z-index: 10;
}
#section-videos .section-video:not(.section-video-clone) ~ .section-video,
#page-sections .section-video:not(.section-video-clone) ~ .section-video {
  margin-top: 0.25em;
}
#section-videos .section-video-clone,
#page-sections .section-video-clone {
  position: absolute;
  z-index: 10;
  visibility: hidden;
}
#section-videos > div + div,
#page-sections > div + div {
  margin-top: 0.25em;
}
#entries .coz-input-error {
  line-height: 2;
}
@media (max-width: 959px) {
  #subscriptions table,
  #subscriptions tbody,
  #subscriptions tr,
  #subscriptions th,
  #subscriptions td {
    display: block;
  }
  #subscriptions thead > tr {
    display: none;
  }
  #subscriptions tr {
    zoom: 1;
  }
  #subscriptions tr:after {
    content: '.';
    display: block;
    clear: both;
    visibility: hidden;
    font-size: 0;
    height: 0;
  }
  #subscriptions tr:after {
    content: '';
    display: table;
    clear: both;
  }
  #subscriptions tr > th {
    display: none;
  }
  #subscriptions tr > td {
    border-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    clear: left;
  }
  #subscriptions tr > td[data-label]:not(:empty):before {
    content: attr(data-label);
    float: left;
    width: 33.333%;
    font-size: 0.75em;
    line-height: 1.8333333333333333;
    color: #999999;
  }
  #subscriptions tr > td:not(:empty):after {
    content: '\00a0';
  }
  #subscriptions tr:first-child > :first-child,
  #subscriptions tr > :not(:first-child) {
    padding-top: 0;
  }
  #subscriptions tr:last-child > :last-child,
  #subscriptions tr > :not(:last-child) {
    padding-bottom: 0;
  }
  #deliveries tr > td:after {
    content: none;
  }
  #deliveries tr > td > small,
  #deliveries tr > td > div + div small {
    display: block;
    padding-left: 33.333%;
  }
  #deliveries tr > td > small + small:before,
  #deliveries tr > td > div + div small + small:before {
    content: none;
  }
}
main.home .body-message {
  background-color: rgba(0, 255, 0, 0.2);
  padding: 10px;
}
.night-mode body,
.night-mode main,
.night-mode main.home,
.night-mode main.home section,
.night-mode .video-overlay {
  background-color: #121212;
  color: #ededed;
}
.night-mode main.home .grit-marketing {
  background-image: linear-gradient(to right, #67676a, #474541);
}
.night-mode main.home .grit-marketing > div,
.night-mode .video-overlay .grit-marketing {
  background-color: rgba(18, 18, 18, 0.8);
}
.night-mode main.home .grit-header > img {
  opacity: 0.4;
}
.night-mode main.home .videos-left,
.night-mode main.home .videos-right {
  text-shadow: 0 0 1px #121212, 0 0 2px #121212, 0 0 4px #121212;
}
.night-mode main.home .videos-left {
  background: linear-gradient(to right, #121212, rgba(18, 18, 18, 0));
}
.night-mode main.home .videos-right {
  background: linear-gradient(to left, #121212, rgba(18, 18, 18, 0));
}
.night-mode main footer {
  background: linear-gradient(rgba(18, 18, 18, 0), rgba(18, 18, 18, 0.8) 2em, #121212);
}
.night-mode main.home ~ footer,
.night-mode main.home .videos:before,
.night-mode main.home .videos:after {
  background: #121212;
}
.night-mode main.home section:nth-of-type(2n) {
  background: #242424;
}
.night-mode main.home section:nth-of-type(2n) .videos-left {
  background: linear-gradient(to right, #242424, rgba(36, 36, 36, 0));
}
.night-mode main.home section:nth-of-type(2n) .videos-right {
  background: linear-gradient(to left, #242424, rgba(36, 36, 36, 0));
}
.night-mode main.home section:nth-of-type(2n) .videos:before,
.night-mode main.home section:nth-of-type(2n) .videos:after {
  background: #242424;
}
.night-mode h1,
.night-mode a[href],
.night-mode a:visited,
.night-mode a[href]:hover,
.night-mode a[href]:focus,
.night-mode a[href]:hover:active {
  color: #fff;
}
.night-mode .button,
.night-mode button,
.night-mode .button[href] {
  background-color: #3c3c3c;
  color: #fff;
}
.night-mode .button:hover,
.night-mode button:hover,
.night-mode .button[href]:hover,
.night-mode .button:focus,
.night-mode button:focus,
.night-mode .button[href]:focus {
  background-color: #606060;
  color: #fff;
}
.night-mode .button:focus,
.night-mode button:focus,
.night-mode .button[href]:focus {
  border-color: #818181;
}
.night-mode .button:hover:active,
.night-mode button:hover:active,
.night-mode .button[href]:hover:active {
  background-color: #818181;
  color: #fff;
}
.night-mode .button.action,
.night-mode button.action,
.night-mode button[name="action"] {
  background-color: #9ba4eb;
  color: #000;
}
.night-mode .button.action:hover,
.night-mode button.action:hover,
.night-mode button[name="action"]:hover,
.night-mode .button.action:focus,
.night-mode button.action:focus,
.night-mode button[name="action"]:focus {
  background-color: #6f80e4;
  color: #000;
}
.night-mode .button.action:focus,
.night-mode button.action:focus,
.night-mode button[name="action"]:focus {
  border-color: #4c63de;
}
.night-mode .button.action:hover:active,
.night-mode button.action:hover:active,
.night-mode button[name="action"]:hover:active {
  background-color: #4c63de;
  color: #000;
}
.night-mode input,
.night-mode select,
.night-mode textarea,
.night-mode .coz-input-checkbox input + i {
  background: #3c3c3c;
  color: #fff;
  border-color: #606060;
}
.night-mode input:focus,
.night-mode select:focus,
.night-mode textarea:focus,
.night-mode .coz-input-checkbox input:focus:not(:disabled) + i {
  border-color: #818181;
}
.night-mode .coz-input-checkbox input.coz-input-checked + i,
.night-mode .coz-input-checkbox input:checked:not(:disabled) + i {
  background: #c3c3c3 url(/styles/images/webshop/button-icons.png) -12.5em 0;
  background-size: 28.75em 3.375em;
  border-color: #7f7f7f;
  filter: invert(1);
}
.night-mode option {
  color: #fff;
}
.night-mode select option[value=""],
.night-mode .coz-select-empty {
  color: #606060;
}
.night-mode .coz-input-checkbox,
.night-mode .coz-input-radio {
  color: #fff !important;
}
.night-mode .video-overlay-close {
  background-image: linear-gradient(to right, rgba(0,0,0,0), rgb(0,0,0,1) 20px);
}
@media (prefers-color-scheme: dark) {
  body,
  main,
  main.home,
  main.home section,
  .video-overlay {
    background-color: #121212;
    color: #ededed;
  }
  main.home .grit-marketing {
    background-image: linear-gradient(to right, #67676a, #474541);
  }
  main.home .grit-marketing > div,
  .video-overlay .grit-marketing {
    background-color: rgba(18, 18, 18, 0.8);
  }
  main.home .grit-header > img {
    opacity: 0.4;
  }
  main.home .videos-left,
  main.home .videos-right {
    text-shadow: 0 0 1px #121212, 0 0 2px #121212, 0 0 4px #121212;
  }
  main.home .videos-left {
    background: linear-gradient(to right, #121212, rgba(18, 18, 18, 0));
  }
  main.home .videos-right {
    background: linear-gradient(to left, #121212, rgba(18, 18, 18, 0));
  }
  main footer {
    background: linear-gradient(rgba(18, 18, 18, 0), rgba(18, 18, 18, 0.8) 2em, #121212);
  }
  main.home ~ footer,
  main.home .videos:before,
  main.home .videos:after {
    background: #121212;
  }
  main.home section:nth-of-type(2n) {
    background: #242424;
  }
  main.home section:nth-of-type(2n) .videos-left {
    background: linear-gradient(to right, #242424, rgba(36, 36, 36, 0));
  }
  main.home section:nth-of-type(2n) .videos-right {
    background: linear-gradient(to left, #242424, rgba(36, 36, 36, 0));
  }
  main.home section:nth-of-type(2n) .videos:before,
  main.home section:nth-of-type(2n) .videos:after {
    background: #242424;
  }
  h1,
  a[href],
  a:visited,
  a[href]:hover,
  a[href]:focus,
  a[href]:hover:active {
    color: #fff;
  }
  .button,
  button,
  .button[href] {
    background-color: #3c3c3c;
    color: #fff;
  }
  .button:hover,
  button:hover,
  .button[href]:hover,
  .button:focus,
  button:focus,
  .button[href]:focus {
    background-color: #606060;
    color: #fff;
  }
  .button:focus,
  button:focus,
  .button[href]:focus {
    border-color: #818181;
  }
  .button:hover:active,
  button:hover:active,
  .button[href]:hover:active {
    background-color: #818181;
    color: #fff;
  }
  .button.action,
  button.action,
  button[name="action"] {
    background-color: #9ba4eb;
    color: #000;
  }
  .button.action:hover,
  button.action:hover,
  button[name="action"]:hover,
  .button.action:focus,
  button.action:focus,
  button[name="action"]:focus {
    background-color: #6f80e4;
    color: #000;
  }
  .button.action:focus,
  button.action:focus,
  button[name="action"]:focus {
    border-color: #4c63de;
  }
  .button.action:hover:active,
  button.action:hover:active,
  button[name="action"]:hover:active {
    background-color: #4c63de;
    color: #000;
  }
  input,
  select,
  textarea,
  .coz-input-checkbox input + i {
    background: #3c3c3c;
    color: #fff;
    border-color: #606060;
  }
  input:focus,
  select:focus,
  textarea:focus,
  .coz-input-checkbox input:focus:not(:disabled) + i {
    border-color: #818181;
  }
  .coz-input-checkbox input.coz-input-checked + i,
  .coz-input-checkbox input:checked:not(:disabled) + i {
    background: #c3c3c3 url(/styles/images/webshop/button-icons.png) -12.5em 0;
    background-size: 28.75em 3.375em;
    border-color: #7f7f7f;
    filter: invert(1);
  }
  option {
    color: #fff;
  }
  select option[value=""],
  .coz-select-empty {
    color: #606060;
  }
  .coz-input-checkbox,
  .coz-input-radio {
    color: #fff !important;
  }
  .video-overlay-close {
    background-image: linear-gradient(to right, rgba(0,0,0,0), rgb(0,0,0,1) 20px);
  }
}
@media (max-width: 959px) {
  .night-mode #subscriptions tr > td[data-label]:not(:empty):before {
    color: #cccccc;
  }
  .night-mode .data tbody > tr:not(:last-child) {
    border-color: #666666;
  }
}
@media (max-width: 959px) and (prefers-color-scheme: dark) {
  #subscriptions tr > td[data-label]:not(:empty):before {
    color: #cccccc;
  }
  .data tbody > tr:not(:last-child) {
    border-color: #666666;
  }
}
@media screen and (max-width: 414px), screen and (max-height: 414px) and (min-width: 436px) {
  main footer button,
  main footer .button {
    float: none;
    display: block;
    width: 100%;
  }
  main footer .button + button,
  main footer button + .button {
    margin-top: 1em;
  }
}