@charset "UTF-8";
/*
 * Normally I'd do this with a ::before pseudo-element
 * but that doesn't work properly inside a flex container.
 * This instead expects an anchor tag itself.
 */
/*
    Copyright (C) Hoefler & Co.
    This software is the property of Hoefler & Co. (H&Co).
    Your right to access and use this software is subject to the
    applicable License Agreement, or Terms of Service, that exists
    between you and H&Co. If no such agreement exists, you may not
    access or use this software for any purpose.
    This software may only be hosted at the locations specified in
    the applicable License Agreement or Terms of Service, and only
    for the purposes expressly set forth therein. You may not copy,
    modify, convert, create derivative works from or distribute this
    software in any way, or make it accessible to any third party,
    without first obtaining the written permission of H&Co.
    For more information, please visit us at http://typography.com.
*/
@font-face {
  font-family: "HCo Gotham SSm";
  src: url(/fonts/GothamSSm-Light_Web.woff2?b0e79820df3aed09e69a9bc35fdb2b8e) format("woff2"), url(/fonts/GothamSSm-Light_Web.woff?9549abde91d6ffe3cf8da0eca471cdcf) format("woff");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "HCo Gotham SSm";
  src: url(/fonts/GothamSSm-LightItalic_Web.woff2?819fd25595a830fde1597d72ffc100cb) format("woff2"), url(/fonts/GothamSSm-LightItalic_Web.woff?74449822f47d12685e2fbbf1ba6b7379) format("woff");
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: "HCo Gotham SSm";
  src: url(/fonts/GothamSSm-Book_Web.woff2?299e9ca606232b303d774724dc648995) format("woff2"), url(/fonts/GothamSSm-Book_Web.woff?66e30a197d6da2d000accfddddc6c353) format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "HCo Gotham SSm";
  src: url(/fonts/GothamSSm-BookItalic_Web.woff2?12b28fd14e608eca839e7d18c9937753) format("woff2"), url(/fonts/GothamSSm-BookItalic_Web.woff?4464aa6ce8b8b6988c320c49efb69e51) format("woff");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "HCo Gotham SSm";
  src: url(/fonts/GothamSSm-Medium_Web.woff2?9604c34cb4433672053b963ae5d77146) format("woff2"), url(/fonts/GothamSSm-Medium_Web.woff?c328510c74745065cc928af6a23ce572) format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "HCo Gotham SSm";
  src: url(/fonts/GothamSSm-MediumItalic_Web.woff2?7a84ed4b1e364f3e3c41a981dc67295d) format("woff2"), url(/fonts/GothamSSm-MediumItalic_Web.woff?53aa364b18f5eb9fa24d8000d0e0125e) format("woff");
  font-weight: 500;
  font-style: italic;
}
* {
  box-sizing: border-box;
}

html {
  background: #f2f2f2;
  color: #000;
  font-family: "HCo Gotham SSm", Gotham, Montserrat, "Century Gothic", sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.875;
  scroll-behavior: smooth;
  scroll-padding-top: 60px;
  height: 100%;
}

body {
  margin: 0;
  min-height: 100%;
  padding-top: 72px;
  display: flex;
  flex-direction: column;
}

a {
  color: inherit;
  font-weight: 500;
}
a:hover, a:focus {
  color: #ea5022;
}

strong {
  font-weight: 500;
}

input,
select,
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid #ccc;
  border-radius: 0;
  font: inherit;
  padding: 9px 16px;
}

input[type=search] {
  background: #fff url(/images/icon-search.svg?7e16685b90d46e0f3c33c011d84b1f0c) 16px 50% no-repeat;
  max-width: 100%;
  padding-left: 48px;
  width: 340px;
}

body > header {
  background: #fff;
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.16);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 13px 40px 13px;
  position: fixed;
  top: 0;
  width: 100%;
  height: 72px;
  z-index: 1;
}
body > header .logo {
  margin: -16px;
}
body > header .logo a {
  display: block;
  padding: 16px;
}
body > header .logo img {
  display: block;
}
body > header nav > ul {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 48px;
  list-style: none;
  margin: 0;
  padding: 0;
}
body > header nav a {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  display: inline-block;
  padding: 4px 0;
  line-height: 30px;
  text-decoration: none;
}
body > header nav input[type=submit].signout {
  border: none;
  background: transparent;
  display: inline-block;
  font-weight: 500;
  padding: 4px 0;
  line-height: 30px;
  text-decoration: none;
  cursor: pointer;
}
body > header nav .active a {
  border-bottom: 4px solid #ea5022;
}
body > header .success-message {
  background: #ea5022;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  padding: 10px 0;
  position: absolute;
  right: 36px;
  text-align: center;
  transition: opacity 1s;
  top: 68px;
  white-space: nowrap;
  width: 195px;
}
body > header .success-message p {
  display: inline-block;
  margin: 0;
  vertical-align: middle;
}
body > header .success-message::before {
  content: "";
  background: url(/images/icon-tick.svg?1efb8aa914c7432f3c2e9c53a67c0f84) 50% 50% no-repeat;
  background-size: 16px 12px;
  border: 2px solid #fff;
  border-radius: 50%;
  display: inline-block;
  height: 30px;
  margin-right: 4px;
  vertical-align: middle;
  width: 30px;
}
body > header .success-message::after {
  content: "";
  border: 8px solid transparent;
  border-bottom-color: #ea5022;
  border-top-width: 0;
  position: absolute;
  top: -8px;
  left: 50%;
  margin-left: -8px;
}
body > header .success-message.dismissed {
  opacity: 0;
}
body > header .success-message button {
  display: none;
}
@media screen and (min-width: 901px) {
  body > header details {
    position: relative;
  }
  body > header details summary {
    background: url(/images/icon-chevron-down.svg?fe216eae51161ca47e697cda06faa5d3) calc(100% - 12px) 50% no-repeat;
    border: 1px solid transparent;
    list-style: none;
    min-width: 166px;
    padding: 6px 36px 6px 12px;
    cursor: pointer;
  }
  body > header details summary::-webkit-details-marker {
    display: none;
  }
  body > header details[open] summary,
body > header details summary:hover {
    border: 1px solid #ccc;
  }
  body > header details > ul {
    background: #fff;
    border: 1px solid #ccc;
    list-style: none;
    margin: 0;
    min-width: 100%;
    padding: 8px 0;
    position: absolute;
    top: calc(100% + 13px);
    right: 0;
  }
  body > header details > ul::before, body > header details > ul::after {
    content: "";
    border: 8px solid transparent;
    border-top: 0;
    position: absolute;
    right: 10px;
  }
  body > header details > ul::before {
    border-bottom-color: #ccc;
    top: -8px;
  }
  body > header details > ul::after {
    border-bottom-color: #fff;
    top: -7px;
  }
  body > header details > ul > li > a {
    display: block;
    font-size: 14px;
    line-height: 20px;
    padding: 4px 16px;
    white-space: nowrap;
    font-weight: inherit;
  }
  body > header details > ul > li input[type=submit] {
    color: inherit;
    display: block;
    font-size: 14px;
    line-height: 20px;
    padding: 4px 16px;
    white-space: nowrap;
    font-weight: inherit;
    border: none;
    background-color: transparent;
    cursor: pointer;
  }
  body > header details > ul > li input[type=submit]:hover, body > header details > ul > li input[type=submit]:focus {
    color: #ea5022;
  }
}

.toggle-mobile-nav {
  display: none;
}

li.sign-out > a::after {
  content: "";
  background: url(/images/icon-sign-out.svg?35fb7a794ac3e31d9e2788a784500f2c) 0 0 no-repeat;
  display: inline-block;
  height: 1em;
  width: 1em;
  margin-left: 10px;
  vertical-align: middle;
}

main {
  max-width: 892px;
  margin: 72px auto;
}
main.with-sidebar {
  max-width: unset;
  margin: 72px;
  display: flex;
  flex-direction: row;
  gap: 24px;
}
main.with-sidebar aside {
  flex: 0 0 276px;
  margin-top: 36px;
}
main.with-sidebar .content-container {
  flex: 1 1 auto;
}
main.with-sidebar .content-block {
  margin-top: 36px;
}
main.no-top-margin {
  margin-top: 0px;
}
.page-login main {
  max-width: unset;
  display: flex;
  flex-direction: row;
  margin: 0;
  flex: 1;
}
main h1 {
  font-weight: 300;
  margin: 0;
  font-size: 36px;
  line-height: 1.3333;
}
main h2 {
  font-weight: 500;
  margin: 36px 0;
  font-size: 30px;
  line-height: 36px;
}
main h3 {
  font-weight: 500;
  margin: 0 0 12px;
  font-size: 1em;
}
main a {
  color: #ea5022;
}

.page-login aside {
  background: #fff;
  padding: 200px 40px 0;
}
@media screen and (min-width: 1300px) {
  .page-login aside {
    padding-left: 80px;
    padding-right: 80px;
  }
}
.page-login aside .content {
  max-width: 370px;
}
.page-login .content-container {
  flex: 1;
}
@media screen and (min-width: 1300px) {
  .page-login .content-container {
    padding: 0 190px;
  }
}
.page-login form {
  max-width: 892px;
  margin: 72px auto;
}

#register-form .button.primary,
#contact-form .button.primary {
  max-width: 412px;
}

a.back::before {
  content: "";
  background: url(/images/icon-arrow-left.svg?861b8b4c8e226f9e4ec799f95f6c684a) 0 0 no-repeat;
  width: 18px;
  height: 19px;
  display: inline-block;
  margin-right: 13px;
  vertical-align: middle;
}

#authenticate-form .content-block > p {
  max-width: 627px;
}

.digit-input-container {
  display: flex;
  flex-direction: row;
  gap: 16px;
}

.digit-input {
  display: inline-block;
  border: 16px solid #fff;
}
.digit-input input {
  border: 0;
  border-bottom: 1px solid #ccc;
  font-size: 36px;
  line-height: 48px;
  width: 36px;
  padding: 0;
  margin: 0;
  text-align: center;
}
.digit-input input:focus {
  border-bottom: 2px solid #ea5022;
  outline: none;
  margin-bottom: -1px;
}

.inline-help {
  font-size: 20px;
  font-style: italic;
}
.inline-help a {
  font-style: normal;
  font-weight: 400;
}

.input {
  width: auto;
}
.input label {
  display: block;
  font-weight: 400;
  font-size: 18px;
  line-height: 20px;
  margin-bottom: 6px;
}
.input label a {
  color: inherit;
}
.input label .optional {
  font-size: 16px;
  font-weight: 300;
  float: right;
}
.input.checkbox label, .input.radio label {
  display: inline-block;
  margin-bottom: 0;
  margin-left: 20px;
  font: inherit;
}
.input input,
.input select,
.input textarea {
  background-color: #fff;
  width: 100%;
}
.input select {
  background: #fff url(/images/icon-chevron-down.svg?fe216eae51161ca47e697cda06faa5d3) calc(100% - 16px) 50% no-repeat;
  padding-right: 42px;
}
.input input[type=checkbox],
.input input[type=radio] {
  padding: 0;
  width: auto;
}
.input input[type=checkbox] {
  background: #fff;
  width: 32px;
  height: 32px;
  display: inline-block;
  vertical-align: middle;
  margin: 0;
}
.input input[type=checkbox]:checked {
  background: #ea5022 url(/images/icon-tick.svg?1efb8aa914c7432f3c2e9c53a67c0f84) 50% 50% no-repeat;
  border-color: #ea5022;
}
.input .password-field {
  position: relative;
}
.input .password-field input {
  padding-right: 50px;
}
.input .password-field input.has-value + .reveal {
  display: block;
}
.input .password-field ::-ms-reveal {
  display: none;
}
.input .password-field .reveal {
  background: url(/images/icon-password-hide.svg?76caa30b918344f8a4d451368777394b) 50% 50% no-repeat;
  border: 0;
  display: none;
  height: 50px;
  overflow: hidden;
  padding: 50px 0 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 50px;
}
.input .password-field .reveal.revealed {
  background-image: url(/images/icon-password-reveal.svg?f700b02e5c95af781e5f424c947b892e);
}
.input .validation-error {
  display: none;
  background: url(/images/icon-error.svg?6f80d68e42a5769b1d1a47e8dbb2a643) 0 0 no-repeat;
  color: #cd212d;
  font-size: 14px;
  line-height: 20px;
  padding-left: 22px;
}
.input.invalid input,
.input.invalid select,
.input.invalid textarea {
  border: 1px solid #cd212d;
  border-left-width: 11px;
}
.input.invalid input[type=checkbox] {
  border-left-width: 1px;
}
.input.invalid .validation-error {
  display: block;
}

small {
  display: block;
  font-size: 14px;
  line-height: 20px;
}
small a {
  color: inherit;
}

.form-container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 36px 20px;
}
.form-container > * {
  flex: 1 1 calc(50% - 10px);
}
.form-container.single-column > * {
  flex-basis: 520px;
  max-width: 520px;
}

.content-block {
  padding: 0 24px;
  position: relative;
  margin: 36px 0;
}
.content-block.notice {
  margin: 0 0 16px;
  padding-left: 0;
}
.content-block.notice p {
  color: #ea5022;
  margin: 0;
}

.with-container {
  background: #fff;
  margin: 36px 0;
  padding: 24px 24px 24px;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.04);
}

.jump-block-group {
  display: flex;
  flex-direction: row;
  gap: 20px;
  margin: 24px 0 48px;
}

.jump-block {
  background: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.08);
  border-left: 6px solid #ea5022;
  max-width: 268px;
  display: flex;
  flex: 1 1 0px;
  flex-direction: column;
}
.jump-block.push {
  margin-left: auto;
}
.jump-block p {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  padding: 14px 10px;
  margin: 0;
  flex: 1;
}
.jump-block a {
  color: #ea5022;
  display: block;
  padding: 14px 10px;
  font-size: 14px;
}
.jump-block a::after {
  content: "";
  background: url(/images/icon-arrow-down.svg?48b61a79e21d4b9fd8fcd3d2ef9635ea) 0 0 no-repeat;
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-left: 10px;
}
.jump-block a.na::after {
  content: none;
  background: none;
}
.jump-block.clear {
  margin: 16px auto;
}
.jump-block.clear a::after {
  content: "";
  background: none;
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-left: 10px;
}

.header-block {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.items-block {
  background: #fff;
  margin: 36px 0;
  padding: 24px 24px 12px;
}
.items-block .header-block {
  padding: 0 0 24px;
}
.items-block h1 {
  flex-grow: 1;
  font-size: 21px;
  font-weight: 500;
  line-height: 30px;
  margin: 0;
}
.items-block > .item {
  border-top: 1px solid #ccc;
  display: flex;
  align-items: center;
  padding: 24px 0;
}
.items-block > .item:first-child {
  border-top: 0;
  padding-top: 0;
}
.items-block .thumbnail {
  width: 88px;
  margin-right: 24px;
}
.items-block .thumbnail > * {
  display: block;
  margin: auto;
}
.items-block .thumbnail .brochure {
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.16);
}
.items-block .description {
  flex-grow: 1;
  margin-right: 24px;
}
.items-block .description label {
  display: block;
  font-weight: 400;
  font-size: 18px;
}
.items-block .description p {
  font-size: 14px;
  margin: 0;
}
.items-block .description .button {
  margin-top: 16px;
}
.items-block .quantity {
  display: flex;
  align-items: center;
}
.items-block .quantity label {
  color: #808080;
  font-size: 14px;
  margin-right: 10px;
}
.items-block .quantity input,
.items-block .quantity select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  color: #808080;
  font-size: 18px;
  line-height: 24px;
  text-align: right;
  padding: 13px 13px 11px 13px;
  width: 83px;
}
.items-block .quantity input[type=number] {
  -moz-appearance: textfield;
}
.items-block .quantity input::-webkit-inner-spin-button,
.items-block .quantity input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.items-block .quantity select {
  background: url(/images/icon-chevron-down.svg?fe216eae51161ca47e697cda06faa5d3) calc(100% - 14px) 50% no-repeat;
  padding-right: 33px;
}
.items-block .has-button .quantity {
  padding-bottom: 62px;
}
.items-block > .colour {
  padding: 12px 0;
}
.items-block > .colour .thumbnail {
  margin-right: 12px;
}
.items-block > .colour .description label {
  font-size: 16px;
}

a[name]:empty {
  display: block;
  height: 80px;
  margin-top: -80px;
  visibility: hidden;
}
a[name]:empty + .items-block {
  margin-top: 0;
}

#delivery-info header,
#contact-info header,
#reset-password header {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 48px;
}
#delivery-info h1,
#contact-info h1,
#reset-password h1 {
  flex-grow: 1;
  font-size: 30px;
  line-height: 36px;
  font-weight: 500;
}

#delivery-info {
  margin: 72px 0 48px;
}

.delivery-info-form,
.contact-info-form,
.reset-password-form {
  display: flex;
  flex-wrap: wrap;
  gap: 36px 20px;
}
.delivery-info-form .input,
.contact-info-form .input,
.reset-password-form .input {
  flex: 1 1 calc(50% - 10px);
}
.delivery-info-form output,
.contact-info-form output,
.reset-password-form output {
  display: none;
}
.readonly .delivery-info-form .field,
.readonly .delivery-info-form .optional,
.readonly .delivery-info-form .validation-error,
.readonly .contact-info-form .field,
.readonly .contact-info-form .optional,
.readonly .contact-info-form .validation-error,
.readonly .reset-password-form .field,
.readonly .reset-password-form .optional,
.readonly .reset-password-form .validation-error {
  display: none;
}
.readonly .delivery-info-form output,
.readonly .contact-info-form output,
.readonly .reset-password-form output {
  display: block;
}

#reset-password.readonly label,
#reset-password.readonly .reset-password-form {
  display: none;
}
#reset-password.readonly .form-header {
  visibility: hidden;
}

#done-editing-delivery-details {
  display: block;
  width: 100%;
  margin-top: 12px;
}
.readonly #done-editing-delivery-details {
  display: none;
}

button,
.button {
  background-color: transparent;
  border: 1px solid #ea5022;
  color: #ea5022;
  cursor: pointer;
  display: inline-block;
  font: inherit;
  font-size: 12px;
  line-height: 1;
  margin: 0;
  font-weight: 500;
  padding: 16px 24px;
  text-decoration: none;
  text-align: center;
}
button:hover,
.button:hover {
  background-color: #fff;
  color: #ea5022;
}
button.primary,
.button.primary {
  background-color: #ea5022;
  color: #fff;
}
button.primary:hover,
.button.primary:hover {
  background-color: #d23d0e;
  color: #fff;
}
button.large,
.button.large {
  font-size: 18px;
  padding: 23px;
  min-width: 172px;
  width: 100%;
}
button.btn-close,
.button.btn-close {
  box-sizing: content-box;
  width: 2em;
  height: 2em;
  padding: 0.25em 0.25em;
  color: #000;
  background: transparent url(/images/icon-close.svg?7432ddde035149cacee7c68f25b0963f) 6px 14px no-repeat;
  border: 0;
}
button.readonly,
.button.readonly {
  display: none;
}

form > button {
  margin: 0 24px;
  width: calc(100% - 48px);
}

dialog {
  background: #fff;
  border: 1px solid #ccc;
}
dialog::-webkit-backdrop {
  -webkit-backdrop-filter: blur(30px);
  backdrop-filter: blur(30px);
  top: 72px;
}
dialog::backdrop {
  -webkit-backdrop-filter: blur(30px);
  backdrop-filter: blur(30px);
  top: 72px;
}
dialog h1 {
  font-size: 18px;
  font-weight: 500;
  line-height: 22px;
  margin: 0;
}

#first-run-dialog {
  background: #fff url(/images/icon-info.svg?94f943826addefb9f5b7ed0464604e12) 16px 16px no-repeat;
  padding: 16px 60px 24px 50px;
  right: 32px;
  top: 69px;
  margin: 0;
  left: auto;
  overflow: visible;
}
#first-run-dialog::before, #first-run-dialog::after {
  content: "";
  border: 14px solid transparent;
  border-top: 0;
  position: absolute;
  right: 10px;
}
#first-run-dialog::before {
  border-bottom-color: #ccc;
  top: -14px;
}
#first-run-dialog::after {
  border-bottom-color: #fff;
  top: -13px;
}
#first-run-dialog button.close {
  border: 0;
  padding: 16px;
  margin: 0;
  position: absolute;
  top: 0;
  right: 0;
  width: auto;
}
#first-run-dialog ul {
  list-style: none;
  padding: 0;
}
#first-run-dialog button.primary {
  margin: 0;
  font-size: 16px;
  width: 100%;
}

.order-summary {
  font-size: 14px;
}
.order-summary .back {
  font-size: 20px;
  font-weight: 400;
}
.order-summary h2 {
  font-size: 21px;
  line-height: 30px;
  margin-bottom: 22px;
}
.order-summary .order-details {
  display: flex;
  flex-direction: row;
  gap: 20px;
}
.order-summary .order-details > div {
  flex: 1 1 100%;
}
.order-summary .order-details > .date-and-time {
  flex: 0 0 196px;
}
.order-summary .order-details p {
  margin: 0;
}

.order-summary table,
table.order-summary {
  width: 100%;
  border: 1px solid #ccc;
  border-width: 1px 0;
  border-collapse: collapse;
  margin: 24px 0;
}

.order-summary th {
  text-align: left;
}
.order-summary th[scope=col] {
  font-weight: 500;
  padding: 24px 0 0;
}
.order-summary th[scope=row] {
  vertical-align: top;
  font-weight: inherit;
}

.order-summary .first-in-item > * {
  border-top: 1px solid #ccc;
  padding-top: 24px;
}
.order-summary .first-in-item:first-child > * {
  border-top: 0;
}

.order-summary .last-in-item > * {
  padding-bottom: 24px;
}

.order-summary td {
  vertical-align: top;
}

.order-summary .swatch {
  vertical-align: middle;
  margin: 0 8px 4px 0;
}

.order-summary .last-in-item .swatch {
  margin-bottom: 0;
}

.order-summary .qty {
  text-align: right;
}

.order-summary .inline-help {
  margin: 36px 0;
}

aside .welcome {
  font-size: 21px;
  line-height: 30px;
  font-weight: 500;
  margin: 0 0 48px;
  padding-left: 12px;
}
aside nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
aside nav li {
  border-left: 4px solid transparent;
}
aside nav .active {
  border-left-color: #ea5022;
}
aside nav a {
  color: inherit;
  display: block;
  margin: 8px 0;
  padding: 1px 12px 1px 8px;
  text-decoration: none;
}
aside nav input[type=submit] {
  color: inherit;
  display: block;
  margin: 8px 0;
  padding: 1px 12px 1px 8px;
  text-decoration: none;
  border: none;
  background-color: transparent;
  font-weight: 500;
  cursor: pointer;
}
aside nav input[type=submit]:hover, aside nav input[type=submit]:focus {
  color: #ea5022;
}

.page-order-history .header-block {
  margin-right: -24px;
}

.order-block {
  background: #fff;
  padding: 24px;
  margin: 24px 0;
  font-size: 14px;
  position: relative;
}
.order-block h1 {
  font-size: 21px;
  line-height: 30px;
  font-weight: 500;
}
.order-block h2 {
  font-size: 18px;
  line-height: 30px;
  margin: 24px 0 8px;
}
.order-block h2,
.order-block h3 {
  display: none;
}
.order-block details::before {
  content: "";
  background: url(/images/icon-chevron-down.svg?fe216eae51161ca47e697cda06faa5d3) 50% 50% no-repeat;
  background-size: contain;
  position: absolute;
  width: 24px;
  height: 24px;
  top: 24px;
  right: 24px;
  transform: rotate(0);
  transform-origin: center;
  transition: transform 0.2s;
  pointer-events: none;
}
.order-block details::before[open] {
  transform: rotate(-180deg);
}
.order-block details[open] h2,
.order-block details[open] h3 {
  display: block;
}
.order-block summary {
  cursor: pointer;
  list-style: none;
  padding: 24px;
  margin: -24px;
}
.order-block summary::-webkit-details-marker {
  display: none;
}

.order-block .order-details,
.order-block .order-summary,
.order-block .button {
  margin: 0 -12px;
}

.order-block .order-details {
  background: #f2f2f2;
  padding: 16px 12px 16px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 20px;
}
.order-block .order-details p {
  margin: 0;
}

.order-block summary .order-details {
  background: transparent;
  padding-bottom: 0;
}

.order-block details[open] summary .order-details {
  display: none;
}

.order-block .order-details > * {
  flex: 1;
}

.order-block .order-details .status {
  flex: 0 1 108px;
}

.order-block .status p {
  background: #f2f2f2;
  border: 1px solid #ccc;
  color: #ccc;
  padding: 6px 12px;
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  cursor: default;
}
.order-block .status .status-pending {
  background: rgba(0, 133, 255, 0.1);
  border-color: #0085ff;
  color: #0085ff;
}
.order-block .status .status-delivered {
  background: rgba(77, 166, 96, 0.2);
  border-color: #4da660;
  color: #4da660;
}

.order-block .order-summary {
  margin-top: 16px;
  margin-bottom: 24px;
  width: calc(100% + 24px);
}

.order-block .order-summary,
.order-block .order-summary .first-in-item > * {
  border: 0;
}

.order-block .order-summary tr.even > * {
  background: #f2f2f2;
}

.order-block .order-summary th:first-child {
  padding: 12px 12px 0;
}

.order-block .order-summary .first-in-item > * {
  padding-top: 12px;
}

.order-block .order-summary .last-in-item > * {
  padding-bottom: 12px;
}

.order-block .order-summary .swatch {
  margin-bottom: 8px;
}

.order-block .order-summary .last-in-item .swatch {
  margin-bottom: 0;
}

.order-block .order-summary .qty {
  padding-right: 12px;
}

.order-block .button {
  display: block;
  margin-bottom: -12px;
  width: calc(100% + 24px);
}

.pagination {
  text-align: center;
}

.page-thank-you p,
.page-thank-you .button {
  display: block;
  max-width: 412px;
  margin: 16px 0;
}

.hero-block {
  margin: 0 auto;
}
.hero-block img {
  display: block;
  max-width: 100%;
}

.page-downloads .intro {
  padding: 0 0 48px;
  margin: 26px 24px 48px;
  border-bottom: 1px solid #ccc;
}
.page-downloads #whats-changed h2 {
  font-size: 21px;
  line-height: 30px;
  margin: 0 0 24px;
}
.page-downloads #whats-changed .item {
  align-items: flex-start;
}
.page-downloads #whats-changed .item .description {
  padding-right: 72px;
}
.page-downloads #assets h2 {
  font-size: 18px;
  font-weight: 400;
  line-height: 20px;
  margin: 0 0 12px;
}

.page-account-details section {
  border-top: 1px solid #ccc;
  padding: 36px 0 0;
}
.page-account-details button[type=submit] {
  display: block;
  width: 100%;
  margin-top: 12px;
}
.page-account-details .readonly button[type=submit] {
  display: none;
}
.page-account-details #reset-password.readonly h1,
.page-account-details #reset-password.readonly .input {
  display: none;
}
.page-account-details #reset-password.readonly button {
  border: 0;
  padding: 0;
  font-size: 20px;
  font-weight: 400;
  text-decoration: underline;
}
.page-account-details #reset-password.readonly button:hover {
  background: transparent;
}

#success-screen .icon-success {
  left: -48px;
  position: absolute;
  top: 0;
}
@media screen and (max-width: 892px) {
  #success-screen .icon-success {
    position: static;
  }
}

.error-message {
  display: block;
  border-radius: 3px;
  background-color: #FFE1E1;
  border: solid 2px #FF0000;
  padding: 10px 15px;
  font-size: 14px;
  color: #000;
  margin-top: 20px;
}

@media screen and (max-width: 1024px) {
  main.with-sidebar {
    margin: 72px 36px;
  }
  main.with-sidebar aside {
    flex-basis: 175px;
  }

  input[type=search] {
    width: 200px;
  }
}
@media screen and (max-width: 900px) {
  body > header {
    padding: 0 12px;
  }
  body > header .logo {
    margin-left: -12px;
  }
  body > header .logo a {
    display: flex;
    height: 72px;
    padding: 12px;
  }
  body > header .logo img {
    width: 98px;
  }
  body > header nav {
    background: #fff;
    height: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 72px;
    transition: height 0.2s;
    width: 100vw;
    z-index: -1;
  }
  body > header nav > ul {
    align-items: stretch;
    flex-direction: column;
    gap: 16px;
    height: 100%;
    padding: 36px 0 0;
    margin: 0;
  }
  body > header nav > ul > li {
    height: 32px;
    margin: 0 12px;
  }
  body > header nav > ul > li a {
    border: 0;
    display: block;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    margin: -6px 0;
    padding: 10px 0 10px 16px;
  }
  body > header nav > ul > li.active {
    border-left: 4px solid #ea5022;
  }
  body > header nav > ul > li.active a {
    border: 0;
    padding-left: 12px;
  }
  body > header nav > ul > li:nth-child(4) {
    flex: 1;
  }
  body > header nav .profile {
    background: #f2f2f2;
    height: auto;
    margin: 0;
    padding: 0 12px 52px;
  }
  body > header nav .profile summary {
    border-bottom: 1px solid rgba(204, 204, 204, 0.5);
    font-size: 18px;
    font-weight: 500;
    list-style: none;
    margin: 0 16px;
    padding: 16px 0;
  }
  body > header nav .profile summary::-webkit-details-marker {
    display: none;
  }
  body > header nav .profile ul {
    margin: 0;
    padding: 0;
  }
  body > header nav .profile li {
    list-style: none;
  }
  body > header nav .profile a {
    font-size: 14px;
    font-weight: inherit;
    margin: 0;
    padding: 14px 16px;
  }
  body > header .success-message {
    background: #f2f2f2;
    bottom: 0;
    color: inherit;
    font-size: 24px;
    font-weight: 300;
    left: 0;
    padding: 72px 28px;
    position: fixed;
    top: 72px;
    width: 100vw;
    white-space: normal;
    z-index: -2;
  }
  body > header .success-message p {
    display: block;
    margin: 16px 0 24px;
  }
  body > header .success-message::before {
    content: "";
    background-image: url(/images/icon-success.svg?c46a524ea1086e0fb82d217fb8a18109);
    background-size: 48px 48px;
    border: 0;
    display: block;
    height: 48px;
    margin: 0 auto;
    width: 48px;
  }
  body > header .success-message::after {
    border: 0;
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.16);
    height: 72px;
    left: 0;
    pointer-events: none;
    right: 0;
    top: -72px;
  }
  body > header .success-message.dismissed {
    display: none;
  }
  body > header .success-message button {
    display: block;
  }
  body.mobile-nav-open > header::before {
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.16);
    content: "";
    left: 0;
    height: 100%;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
  }
  body.mobile-nav-open > header nav {
    height: calc(100vh - 72px);
    overflow: auto;
  }
  body.mobile-nav-open .toggle-mobile-nav {
    background-image: url(/images/icon-menu-close.svg?baa1925fd79a9d400287e185f95987f6);
  }

  .toggle-mobile-nav {
    display: block;
    background: url(/images/icon-menu.svg?63ea7cf5b419e3a41b5692137afa3381) 50% 50% no-repeat;
    border: 0;
    height: 0;
    overflow: hidden;
    padding: 72px 0 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
  }

  #first-run-dialog {
    right: 0;
  }
}
@media screen and (max-width: 840px) {
  main.with-sidebar {
    display: block;
    margin: 36px;
    max-width: unset;
  }
  main.with-sidebar aside {
    display: none;
  }
  main.with-sidebar .content-container {
    flex: none;
  }
  main.with-sidebar .content-block {
    margin-top: 0;
  }
}
@media screen and (max-width: 500px) {
  html {
    font-size: 12px;
    line-height: 1.667;
  }

  main {
    margin: 36px 12px;
  }
  main h1 {
    font-size: 24px;
    margin-bottom: 24px;
  }
  main h2 {
    font-size: 18px;
    margin: 24px 0;
  }
  main.with-sidebar {
    margin: 36px 12px;
  }

  .hero-block + main {
    margin-top: 24px;
  }

  .inline-help {
    font-size: 14px;
  }

  .form-container {
    gap: 24px;
  }

  button,
.button {
    width: 100%;
  }
  button.large,
.button.large {
    font-size: 12px;
    padding-top: 17px;
    padding-bottom: 17px;
  }

  input {
    font-size: 14px;
  }
  input[type=search] {
    width: 100%;
  }

  .input label {
    font-size: 14px;
  }
  .input label .optional {
    font-size: 12px;
  }
  .input.checkbox label {
    margin-left: 8px;
  }
  .input input[type=checkbox] {
    height: 26px;
    width: 26px;
  }
  .input .password-field .reveal {
    height: 42px;
    padding-top: 42px;
  }
  .input .validation-error {
    font-size: inherit;
  }

  small {
    font-size: 10px;
    line-height: 16px;
  }

  .jump-block {
    margin: 36px 0;
    max-width: unset;
  }

  .jump-block-group {
    flex-direction: column;
    gap: 12px;
    margin: 24px 0;
  }
  .jump-block-group .jump-block {
    margin: 0;
  }

  .header-block {
    display: block;
    padding-bottom: 16px;
  }

  .content-block {
    margin: 0 0 24px;
    padding: 16px;
  }
  .items-block {
    margin: 24px 0;
    padding: 16px;
  }
  .items-block .header-block {
    padding-bottom: 16px;
  }
  .items-block h1 {
    font-size: 14px;
    line-height: 20px;
  }
  .items-block h1 + .quantity {
    margin-top: 16px;
  }
  .items-block > .item {
    display: grid;
    gap: 12px;
    grid-template-areas: "description description" "preview quantity";
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
  }
  .items-block > .item.has-button {
    padding-bottom: 84px;
    position: relative;
  }
  .items-block > .colour {
    gap: 8px;
    grid-template-areas: "preview description quantity";
    grid-template-columns: 36px 1fr auto;
    grid-template-rows: auto;
  }
  .items-block > .colour .thumbnail {
    margin: 0;
    width: auto;
  }
  .items-block > .colour .thumbnail svg {
    height: 36px;
    width: 36px;
  }
  .items-block > .colour .description label {
    font-size: 12px;
  }
  .items-block > .download {
    gap: 12px;
    grid-template-areas: "description" "preview" "actions";
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto auto;
  }
  .items-block > .download .thumbnail {
    padding-bottom: 4px;
  }
  .items-block > .download a[name]:empty {
    grid-area: description;
  }
  .items-block .description {
    grid-area: description;
  }
  .items-block .description label,
.items-block .description p {
    font-size: 12px;
  }
  .items-block .description label {
    font-weight: 500;
  }
  .items-block .description .button {
    position: absolute;
    bottom: 24px;
    left: 0;
  }
  .items-block .thumbnail {
    grid-area: preview;
  }
  .items-block .quantity {
    align-items: center;
    align-self: start;
    display: flex;
    grid-area: quantity;
  }
  .items-block .quantity label {
    flex: 1;
  }
  .items-block .quantity input,
.items-block .quantity select {
    font-size: 14px;
    padding: 6px 12px 4px;
    width: 62px;
  }
  .items-block .quantity select {
    background-position-x: calc(100% - 10px);
    background-size: 11px;
    padding-right: 27px;
  }
  .items-block .actions {
    grid-area: actions;
  }

  .order-block {
    padding: 16px;
  }
  .order-block h1 {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 0;
  }
  .order-block details::before {
    height: 20px;
    top: 16px;
    width: 13px;
  }
  .order-block details .order-details {
    align-items: start;
    background: none;
    flex-direction: column;
    margin: 0;
    padding: 12px 0 0;
  }
  .order-block details .order-details .status {
    flex-basis: auto;
  }
  .order-block details[open] summary {
    margin-bottom: 0;
  }
  .order-block details[open] h2 {
    display: none;
  }
  .order-block details[open] .order-details {
    border-top: 1px solid #ccc;
    padding: 24px 0;
  }
  .order-block summary {
    margin: -16px;
    padding: 16px;
  }
  .order-block summary .order-details .business-details,
.order-block summary .order-details .delivery-address {
    display: none;
  }
  .order-block .order-summary {
    border-bottom: 1px solid #ccc;
    display: block;
    margin: 0;
    width: 100%;
  }
  .order-block .order-summary thead,
.order-block .order-summary tbody,
.order-block .order-summary tr,
.order-block .order-summary th,
.order-block .order-summary td {
    display: block;
  }
  .order-block .order-summary tr {
    display: grid;
    gap: 0 12px;
    grid-template-areas: "description description" "preview quantity";
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
  }
  .order-block .order-summary tr.even > * {
    background: none;
  }
  .order-block .order-summary tr th {
    grid-area: description;
  }
  .order-block .order-summary tr td {
    grid-area: preview;
    padding-top: 8px;
  }
  .order-block .order-summary tr td.qty {
    grid-area: quantity;
    padding-right: 0;
  }
  .order-block .order-summary tr td.qty::after {
    content: " Qty";
  }
  .order-block .order-summary tr .swatch {
    height: 24px;
    margin-bottom: 0;
    margin-right: 4px;
    width: 24px;
  }
  .order-block .order-summary th:first-child {
    padding: 16px 0 0;
  }
  .order-block .order-summary th[scope=col] {
    display: none;
  }
  .order-block .order-summary .first-in-item > * {
    padding-top: 8px;
  }
  .order-block .order-summary .first-in-item > th {
    border-top: 1px solid #ccc;
  }
  .order-block .order-summary .last-in-item > * {
    padding-bottom: 16px;
  }
  .order-block .button {
    margin: 24px 0 0;
  }

  .page-login main {
    flex-direction: column;
  }
  .page-login form {
    margin: 36px 12px;
  }
  .page-login aside {
    padding: 36px 28px;
  }
  .page-login aside .inline-help {
    margin: 24px 0 0;
  }
  .page-login aside + .content-container h1 {
    display: none;
  }
  .page-login aside + .content-container h1 + .inline-help {
    display: none;
  }
  .page-login aside + .content-container form {
    margin-top: 24px;
  }

  .back {
    font-size: 16px;
    font-weight: 400;
  }

  #register-form h2 {
    margin: 48px 0 8px;
  }
  #register-form h2 + .inline-help {
    margin: 0 0 36px;
  }

  .digit-input-container {
    gap: 7px;
  }

  .digit-input {
    border-width: 8px 10px;
  }
  .digit-input input {
    font-size: 21px;
    line-height: 32px;
    width: 20px;
  }

  #success-screen .icon-success {
    display: block;
    width: 48px;
    margin: 36px auto 16px;
  }

  #delivery-info header,
#contact-info header,
#reset-password header {
    display: block;
    margin-bottom: 24px;
  }
  #delivery-info h1,
#contact-info h1,
#reset-password h1 {
    font-size: 18px;
    line-height: 20px;
  }

  #delivery-info {
    margin: 36px 0 24px;
  }

  #edit-delivery-info {
    bottom: -60px;
    position: absolute;
    left: 16px;
    width: calc(100% - 32px);
  }

  .readonly #edit-delivery-info {
    bottom: -136px;
  }

  .delivery-info-form,
.contact-info-form,
.reset-password-form {
    gap: 16px;
  }
  .delivery-info-form .input,
.contact-info-form .input,
.reset-password-form .input {
    flex-basis: 100%;
  }

  #order-form {
    margin-bottom: 72px;
  }

  form > button {
    margin: 0 16px;
    width: calc(100% - 32px);
  }

  .page-downloads .intro {
    margin: 0 0 24px;
    padding: 0 16px 12px;
  }
  .page-downloads #whats-changed h2 {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 12px;
  }
  .page-downloads #whats-changed .item .description {
    padding: 0;
  }
  .page-downloads #assets h2 {
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 4px;
  }

  .page-order-summary main {
    margin: 0;
    padding: 0;
  }
  .page-order-summary .order-summary {
    font-size: 12px;
    margin: 0;
    padding: 36px 28px;
  }
  .page-order-summary .order-summary .header-block {
    padding: 0;
  }
  .page-order-summary .order-summary h2 {
    font-size: 14px;
    line-height: 20px;
  }
  .page-order-summary .order-summary .back {
    font-size: 16px;
  }
  .page-order-summary .order-summary .order-details {
    flex-wrap: wrap;
    gap: 24px 12px;
  }
  .page-order-summary .order-summary .order-details > div {
    flex-basis: calc(50% - 6px);
  }
  .page-order-summary .order-summary .order-details > .date-and-time {
    flex-basis: 100%;
  }
  .page-order-summary .order-summary table {
    border: 0;
    border-top: 1px solid rgba(204, 204, 204, 0.5);
    display: block;
    margin: 24px 0 0;
    padding: 0 0 24px;
    width: 100%;
  }
  .page-order-summary .order-summary table thead,
.page-order-summary .order-summary table tbody,
.page-order-summary .order-summary table tr,
.page-order-summary .order-summary table th,
.page-order-summary .order-summary table td {
    display: block;
  }
  .page-order-summary .order-summary table tr {
    display: grid;
    gap: 0 12px;
    grid-template-areas: "description description" "preview quantity";
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
  }
  .page-order-summary .order-summary table tr.even > * {
    background: none;
  }
  .page-order-summary .order-summary table tr th {
    font-weight: 500;
    grid-area: description;
  }
  .page-order-summary .order-summary table tr td {
    grid-area: preview;
    padding-top: 8px;
  }
  .page-order-summary .order-summary table tr td.qty {
    grid-area: quantity;
    padding-right: 0;
  }
  .page-order-summary .order-summary table tr td.qty::after {
    content: " Qty";
  }
  .page-order-summary .order-summary table tr .swatch {
    height: 24px;
    margin-bottom: 0;
    margin-right: 4px;
    width: 24px;
  }
  .page-order-summary .order-summary table th:first-child {
    padding: 24px 0 0;
  }
  .page-order-summary .order-summary table th[scope=col] {
    display: none;
  }
  .page-order-summary .order-summary table .first-in-item > * {
    border-top: 0;
    padding-top: 8px;
  }
  .page-order-summary .order-summary table .last-in-item > * {
    padding-bottom: 12px;
  }
  .page-order-summary .order-summary table + p {
    margin: 0;
    padding: 24px 0;
    border: 1px solid rgba(204, 204, 204, 0.5);
    border-width: 1px 0;
  }
  .page-order-summary .order-summary .inline-help {
    margin: 24px 0;
  }

  .page-order-history .header-block {
    margin-right: 0;
    padding-bottom: 0;
  }
  .page-order-history .content-block {
    padding: 0;
  }

  .page-account-details .content-container {
    padding: 0 16px;
  }
  .page-account-details .header-block {
    padding-bottom: 0;
  }
  .page-account-details section {
    padding: 24px 0;
  }
  .page-account-details section header button {
    position: absolute;
    bottom: 0;
    left: 0;
  }
  .page-account-details section {
    margin-bottom: 36px;
    padding-bottom: 68px;
  }
  .page-account-details #reset-password {
    padding-top: 36px;
  }
  .page-account-details #reset-password.readonly {
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .page-account-details #reset-password.readonly button {
    font-size: 16px;
    position: static;
    text-align: left;
  }
}
select[data-multi-select-plugin] {
  display: none !important;
}

.multi-select-component {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  height: auto;
  width: 100%;
  font: inherit;
  padding: 11px 16px;
  background: #fff url(/images/icon-chevron-down.svg?fe216ea…) calc(100% - 16px) 50% no-repeat;
  border: 1px solid #ccc;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.autocomplete-list {
  border-radius: 4px 0px 0px 4px;
}

.multi-select-component:focus-within {
  box-shadow: inset 0px 0px 0px 2px #78ABFE;
}

.multi-select-component .btn-group {
  display: none !important;
}

.multiselect-native-select .multiselect-container {
  width: 100%;
}

.selected-wrapper {
  box-sizing: border-box;
  border-radius: 3px;
  display: inline-block;
  white-space: nowrap;
  margin: 0px 5px 5px 0;
  height: 20px;
  vertical-align: top;
  cursor: default;
}

.selected-wrapper .selected-label {
  max-width: 514px;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 4px;
  vertical-align: top;
}

.selected-wrapper .selected-close {
  display: inline-block;
  text-decoration: none;
  font-size: 18px;
  line-height: 1.49em;
  margin-left: 5px;
  padding-bottom: 10px;
  height: 100%;
  vertical-align: top;
  padding-right: 4px;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  font-weight: bold;
}

.search-container {
  display: flex;
  flex-direction: row;
}

.search-container .selected-input {
  background: none;
  border: 0;
  height: 20px;
  width: 60px;
  padding: 0;
  margin-bottom: 6px;
  box-shadow: none;
}

.search-container .selected-input:focus {
  outline: none;
}

.dropdown-icon.active {
  transform: rotateX(180deg);
}

.search-container .dropdown-icon {
  display: inline-block;
  padding: 10px 5px;
  position: absolute;
  top: 5px;
  right: 5px;
  width: 10px;
  height: 10px;
  border: 0 !important;
  /* needed */
  -webkit-appearance: none;
  -moz-appearance: none;
}

.search-container ul {
  position: absolute;
  list-style: none;
  padding: 0;
  z-index: 3;
  margin-top: 29px;
  width: 100%;
  right: 0px;
  background: #fff;
  border: 1px solid #ccc;
  border-top: none;
  border-bottom: none;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}

.search-container ul :focus {
  outline: none;
}

.search-container ul li {
  display: block;
  text-align: left;
  padding: 8px 29px 2px 12px;
  border-bottom: 1px solid #ccc;
  font-size: 16px;
  min-height: 31px;
}

.search-container ul li:first-child {
  border-top: 1px solid #ccc;
  border-radius: 4px 0px 0 0;
}

.search-container ul li:last-child {
  border-radius: 4px 0px 0 0;
}

.search-container ul li:hover.not-cursor {
  cursor: default;
}

.search-container ul li:hover {
  border-color: #adadad;
  cursor: pointer;
}

/* Adding scrool to select options */
.autocomplete-list {
  max-height: 130px;
  overflow-y: auto;
}

.alert {
  position: absolute;
  width: 100%;
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  opacity: 1;
  visibility: visible;
  transition: all 300ms cubic-bezier(0.335, 0.01, 0.03, 1.36);
  top: 73px;
}
.alert.dismissed {
  opacity: 0;
  visibility: hidden;
  top: 0px;
}

.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.alert-danger .btn-close {
  color: #721c24 !important;
}

.alert-success {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.alert-success p {
  display: inline-block;
}
.alert-success .btn-close {
  color: #155724 !important;
}

.download-page-nav .jump-block-group a {
  text-decoration: none;
  background-color: #fff;
  display: block;
  padding: 5px 10px;
  color: #000;
}
.download-page-nav .jump-block-group a:hover {
  color: #d23d0e;
}
.download-page-nav .jump-block-group a.active {
  color: #ea5022;
}

.promotion--steel-the-show {
  margin: 0 auto;
}
.promotion--steel-the-show .hero-block {
  position: relative;
}
@media screen and (max-width: 900px) {
  .promotion--steel-the-show .hero-block img:nth-child(1) {
    height: 417px;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.promotion--steel-the-show .hero-block img:nth-child(2) {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 900px) {
  .promotion--steel-the-show .jump-block-group {
    flex-direction: column;
  }
}
.promotion--steel-the-show .quantity select {
  padding-right: 44px;
}
@media screen and (max-width: 500px) {
  .promotion--steel-the-show .quantity select {
    padding-right: 34px;
  }
}
.promotion--steel-the-show .items-block .description {
  flex: 1;
}
.promotion--steel-the-show .items-block .description label span {
  display: block;
  font-size: 14px;
  font-weight: 300;
}
@media screen and (max-width: 500px) {
  .promotion--steel-the-show .items-block .thumbnail {
    width: 100%;
  }
}
.promotion--steel-the-show .items-block .thumbnail img {
  width: 100%;
  max-height: 130px;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (max-width: 500px) {
  .promotion--steel-the-show .items-block .thumbnail img {
    max-height: 220px;
  }
}
@media screen and (max-width: 500px) {
  .promotion--steel-the-show .content-block h1 {
    margin-bottom: 0;
  }
}
.promotion--steel-the-show #point-of-sale > h1 {
  padding: 0 24px;
}
@media screen and (max-width: 500px) {
  .promotion--steel-the-show #point-of-sale > h1 {
    padding: 0;
  }
}
.promotion--steel-the-show .promo-terms {
  font-size: 10px;
}
.promotion--steel-the-show .inline-help-block {
  margin: 60px 0;
}
@media screen and (max-width: 500px) {
  .promotion--steel-the-show .inline-help-block {
    margin-bottom: 40px;
  }
}
.promotion--steel-the-show .inline-help-block .header {
  font-weight: 500;
}

.order-delay-message {
  background-color: rgba(215, 64, 58, 0.2);
  padding: 5px 20px;
  border: 1px solid #d7403a;
  margin: 20px 0;
}

body > header .logo img.logo60th {
  width: 200px;
}
@media screen and (max-width: 900px) {
  body > header .logo img.logo60th {
    padding-top: 8px;
  }
}
body .cta-banner-wrapper {
  display: flex;
  padding: 20px 40px;
  justify-content: space-between;
  background-color: #d9d9d9;
  align-items: center;
}
@media screen and (max-width: 900px) {
  body .cta-banner-wrapper {
    padding: 20px 12px;
  }
}
@media screen and (max-width: 630px) {
  body .cta-banner-wrapper {
    align-items: start;
  }
}
body .cta-banner-wrapper .cta-content {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 630px) {
  body .cta-banner-wrapper .cta-content {
    flex-direction: column;
    align-items: flex-start;
  }
}
body .cta-banner-wrapper .cta-content p {
  margin: 0;
}
body .cta-banner-wrapper .cta-content .cta-button {
  margin-left: 40px;
  background-color: #e9542f;
  padding: 12px 20px;
  color: white;
  text-decoration: none;
}
@media screen and (max-width: 630px) {
  body .cta-banner-wrapper .cta-content .cta-button {
    margin-left: 0;
    margin-top: 20px;
  }
}
body .cta-banner-wrapper .close-cta-btn {
  height: 33px;
}
body .cta-banner-wrapper .close-cta-btn:hover {
  cursor: pointer;
}
body .cta-banner-wrapper .close-cta-btn img {
  height: 33px;
}
@media screen and (max-width: 900px) {
  body .cta-banner-wrapper .close-cta-btn img {
    height: 26px;
  }
}