/* #region Basics */
@import url("../fonts/open-iconic/font/css/open-iconic-bootstrap.min.css");
:root {
  --earcu-purple: #0C263F;
  --earcu-purple-light: rgb(16.08, 50.92, 84.42);
  --earcu-purple-dark: rgb(7.92, 25.08, 41.58);
  --pageup-blue: #0C263F;
  --pageup-blue-light: rgb(16.08, 50.92, 84.42);
  --pageup-blue-dark: rgb(7.92, 25.08, 41.58);
  --earcu-pale-purple: #0C263F;
  --earcu-pale-purple-light: rgb(16.08, 50.92, 84.42);
  --earcu-pale-purple-dark: rgb(7.92, 25.08, 41.58);
  --earcu-pale-blue: #D5EAFE;
  --earcu-pale-blue-light: rgb(237.9069767442, 246.4534883721, 254.5930232558);
  --earcu-pale-blue-dark: rgb(188.0930232558, 221.5465116279, 253.4069767442);
  --off-black: #191716;
  --off-black-light: rgb(38.5638297872, 35.4787234043, 33.9361702128);
  --off-black-dark: rgb(11.4361702128, 10.5212765957, 10.0638297872);
  --off-white: #FDFFFC;
  --off-white-light: white;
  --off-white-dark: rgb(236, 255, 226.5);
  --earcu-grey: #F1EDF7;
  --earcu-grey-light: rgb(254.7307692308, 254.6538461538, 254.8461538462);
  --earcu-grey-dark: rgb(227.2692307692, 219.3461538462, 239.1538461538);
  --earcu-grey-darkest: #999;
  --earcu-bright-pink: #FF4782;
  --earcu-bright-pink-light: rgb(255, 96.5, 147.3233695652);
  --earcu-bright-pink-dark: rgb(255, 45.5, 112.6766304348);
  --pink: #FF4782;
  --color-1: var(--earcu-purple);
  --color-2: var(--pageup-blue);
  --color-3: var(--earcu-pale-purple);
  --color-4: var(--earcu-pale-blue);
  --color-5: var(--off-black);
  --color-6: var(--off-white);
  --color-7: var(--earcu-grey);
  --color-8: var(--earcu-bright-pink);
  --blue-1: #D5EAFE;
  --blue-2: #ABD5FE;
  --blue-3: #82C1FD;
  --blue-4: #58ACFD;
  --blue-5: #2371BD;
  --blue-6: #174C7E;
  --blue-7: #0C263F;
  --blue-8: #000000;
}

/* #endregion */
/* #region html & body */
@font-face {
  font-display: swap;
  font-family: "Apercu Pro";
  src: url(../fonts/ApercuPro/ApercuPro.woff2) format("woff2");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-display: swap;
  font-family: "Apercu Pro";
  src: url(../fonts/ApercuPro/ApercuPro-Medium.woff2) format("woff2");
  font-weight: 500;
  font-style: normal;
}
html, body {
  font-family: "Apercu Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: var(--main-color, var(--pageup-blue));
  --bs-heading-color: var(--main-color, var(--pageup-blue));
  scroll-padding-top: calc(var(--scroll-margin-top, 276px) + 10px);
}

body {
  scrollbar-width: thin;
}
body:not(.no-background) {
  background: url(../img/bg-image_icons-logo.png?v=3.5);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
body::-webkit-scrollbar {
  width: 10px;
  height: 15px;
}
body::-webkit-scrollbar-track {
  border-radius: 10px;
}
body::-webkit-scrollbar-thumb {
  background-color: #b2b2b2;
}

body img.logo-white,
body img.img-white,
html[data-bs-theme=light] body img.logo-white {
  display: none;
}

html[data-bs-theme=dark] body:not(.no-background) {
  background-image: url(../img/bg-image_icons-logo-dark-2.png?v=3.5);
}
/* #endregion */
/* #region Basic elements */
h1 {
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--main-color, var(--pageup-blue));
  margin-bottom: 2rem;
  text-align: center;
}
h1:focus {
  outline: none;
}
h1.text-center {
  border-bottom: none;
}
@media (min-width: 768px) {
  h1 {
    text-align: start;
  }
}

a, .btn-link {
  color: var(--earcu-bright-pink);
}

.page-surround {
  position: relative;
  padding: 1.5rem 0.5rem 0.5rem;
  background-color: #FFF;
  transition: background-color 0.2s;
}
.page-surround:not(.page-surround-light) {
  background-color: var(--main-bg-color, #FFF);
}
@media (min-width: 576px) {
  .page-surround {
    padding: 3rem;
    border-radius: 1rem;
  }
  .page-surround:where(:not(body.no-background .page-surround)) {
    box-shadow: 0 0 0.5rem var(--page-surround-shadow-color, #CCC);
  }
}
@media (min-width: 576px) {
  .page-surround {
    margin: 0 auto 3rem;
    max-width: 80vw;
  }
}
@media (min-width: 992px) {
  .page-surround {
    padding: 3rem;
  }
}
@media (min-width: 1200px) {
  .page-surround {
    padding: 5rem;
  }
}
@media (min-width: 1400px) {
  .page-surround .container {
    width: 100%;
    max-width: 100%;
  }
}

.page {
  position: relative;
  display: flex;
  flex-direction: column;
}
@media (min-width: 641px) {
  .page {
    flex-direction: row;
  }
}

img {
  max-width: 100%;
}

main {
  flex: 1;
}

.back-to-top {
  --btn-color-1: var(--earcu-bright-pink);
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  z-index: 99;
  border: none;
  outline: none;
  cursor: pointer;
  font-size: 1.5rem;
  background-color: var(--btn-color-1);
  border: 2px solid var(--btn-color-1);
  color: #FFF;
  padding: 0.75rem 1.5rem;
  border-radius: 0.375rem;
  opacity: 0;
  transition: opacity 0.3s;
}
.back-to-top:hover {
  background-color: #FFF;
  border: 2px solid var(--btn-color-1);
  color: var(--btn-color-1);
}

/* #endregion */
/* #region Login */
body:has(.login-container) .page,
body:has(.login-container) main,
body:has(.login-container) article {
  display: flex;
  flex-wrap: wrap;
  width: 100vw;
  height: 100vh;
  align-items: center;
  justify-content: center;
}
body:has(.login-container) footer {
  display: none;
}

.login-container {
  width: 100%;
  max-width: 550px;
  padding: 0.5rem;
  background-color: var(--main-bg-color, #FFF);
  transition: background-color 0.2s;
  position: relative;
  padding: 3rem;
  border-radius: 1rem;
  margin: 0 0.75rem;
  box-shadow: 0 0 0.5rem var(--page-surround-shadow-color, #CCC);
}
.login-container .login-logo-container {
  display: flex;
  width: 100%;
  justify-content: center;
  margin-bottom: 2rem;
}
.login-container .login-logo {
  max-width: 187.5px;
  color: var(--earcu-purple);
}
.login-container h1 {
  text-align: center;
  margin-bottom: 1.5rem;
  color: var(--main-color, var(--pageup-blue));
  transition: color 0.2s;
  font-size: calc(2rem + 0.4vw);
}
.login-container p {
  font-weight: 500;
  text-align: center;
  color: var(--main-color, var(--pageup-blue));
  transition: color 0.2s;
}
.login-container .input-container {
  width: 100%;
  position: relative;
  margin: 0 auto 1rem;
}
@media (min-width: 992px) {
  .login-container .input-container {
    width: fit-content;
  }
}
.login-container .input-container:has(#username) {
  display: flex;
  align-items: center;
  justify-content: center;
}
.login-container .input-container:has(#username):before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  line-height: 1;
  color: var(--border-color);
  content: "\f007";
  display: flex;
  position: absolute;
  left: 0;
  width: 30px;
  z-index: 1;
  justify-content: center;
  align-items: center;
}
.login-container .input-container:has(#username) #username {
  padding-left: 25px;
}
.login-container .button-container {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  text-align: center;
}
.login-container .button-container .btn {
  padding: 0.75rem 5rem;
  width: 100%;
}
@media (min-width: 992px) {
  .login-container .button-container .btn {
    width: auto;
  }
}
@media (min-width: 576px) {
  .login-container {
    padding: 4rem;
  }
}
@media (min-width: 768px) {
  .login-container {
    padding: 3rem 5rem;
  }
}
@media (min-width: 1400px) {
  .login-container .container {
    width: 100%;
    max-width: 100%;
  }
}

.social-login-provider {
  display: flex;
  align-items: center;
  margin-right: 16px;
  padding: 12px 16px;
  border-radius: 4px;
  border: 1px solid #c5c7d0;
  box-sizing: border-box;
  cursor: pointer;
  background: unset;
  text-decoration: none !important;
  color: var(--main-color, #333);
  transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}
.social-login-provider:hover {
  --part-1-fill: #FFF;
  --part-2-fill: #FFF;
  --part-3-fill: #FFF;
  --part-4-fill: #FFF;
  border-color: var(--earcu-bright-pink);
  background-color: var(--earcu-bright-pink);
  color: #FFF;
}

.social-login-logo {
  height: 16px;
  width: 16px;
  margin-right: 8px;
}
.social-login-logo .part {
  transition: fill 0.2s;
}
.social-login-logo .part-1 {
  fill: var(--part-1-fill, #4285F4);
}
.social-login-logo .part-2 {
  fill: var(--part-2-fill, #34A853);
}
.social-login-logo .part-3 {
  fill: var(--part-3-fill, #FBBC05);
}
.social-login-logo .part-4 {
  fill: var(--part-4-fill, #EA4335);
}

.social-login-provider-name {
  font-size: 1rem;
}

#version {
  text-align: left;
  position: absolute;
  font-size: 0.875rem;
  bottom: 0.5rem;
  right: 0.5rem;
  margin: 0;
  padding: 0;
}

/* #endregion */
/* #region Form elements */
input[type=text],
input[type=number],
input[type=password],
input:not([type]),
textarea {
  padding: 0.5rem;
  border-radius: 0.25rem;
  border: 2px solid var(--border-color);
  width: 100%;
  outline-color: var(--border-color);
  max-width: 400px;
}

textarea {
  max-width: 100%;
  max-height: 12rem;
  min-height: 6rem;
}

.modal input[type=text],
.modal input[type=number],
.modal input[type=password],
.modal input:not([type]),
.modal textarea {
  max-width: 100%;
}

.btn {
  width: 100%;
  padding: 0.5rem;
}
@media (min-width: 576px) {
  .btn {
    width: auto;
  }
}
.btn.btn-primary {
  --btn-color-1: var(--earcu-bright-pink);
  background-color: var(--btn-color-1);
  border-color: var(--btn-color-1);
  border-width: 2px;
  color: #FFF;
}
.btn.btn-primary:hover, .btn.btn-primary:focus {
  background-color: transparent;
  border-color: var(--btn-color-1);
  color: var(--btn-color-1);
}
.btn.btn-primary.btn-apply-discount {
  margin-bottom: 1rem;
}
@media (min-width: 992px) {
  .btn.btn-primary.btn-apply-discount {
    position: absolute;
    top: 3rem;
    right: 5rem;
    width: auto;
  }
}
@media (min-width: 1200px) {
  .btn.btn-primary.btn-apply-discount {
    top: 5rem;
    right: 8rem;
  }
}
.btn.btn-primary.btn-apply-discount.btn-disabled {
  background-color: var(--earcu-grey);
  color: var(--earcu-grey-darkest);
  border-color: var(--earcu-grey);
}
.btn.btn-primary.btn-pageup-blue {
  --btn-color-1: var(--primary-btn-color, var(--pageup-blue));
}
.btn.btn-primary.btn-bordered {
  background-color: #FFF;
  color: var(--btn-color-1);
}
.btn.btn-primary.btn-padded {
  padding: 0.75rem 1rem;
}
.btn.btn-danger {
  --btn-color-1: var(--earcu-bright-pink);
  background-color: var(--btn-color-1);
  border-color: var(--btn-color-1);
  border-width: 2px;
  color: #FFF;
}
.btn.btn-danger:hover, .btn.btn-danger:focus {
  background-color: transparent;
  border-color: var(--btn-color-1);
  color: var(--btn-color-1);
}
.btn.btn-danger.btn-start-over {
  --btn-color-1: var(--bs-danger);
}

.input-container:has(input[type=text], input[type=number], input[type=password], input:not([type]), textarea) {
  --border-color: var(--main-border-color, var(--pageup-blue));
}
.input-container:has(input[type=text], input[type=number], input[type=password], input:not([type]), textarea):has(input:focus, textarea:focus) {
  --border-color: var(--earcu-bright-pink);
}

.readonly label {
  font-size: 0.75rem;
  display: flex;
  align-items: center;
}
.readonly label:before {
  font-family: "Font Awesome 6 Pro";
  content: "\f14a";
  font-size: 1.25rem;
  margin-right: 0.5rem;
  font-weight: 400;
}
.readonly label input[type=radio], .readonly label input[type=checkbox] {
  display: none;
}

label:has(input[type=radio], input[type=checkbox]) {
  border-radius: 1rem;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  padding: 0.5rem 0.5rem;
  position: relative;
}
label:has(input[type=radio], input[type=checkbox]).button:not(.readonly label), label:has(input[type=radio], input[type=checkbox]):has(svg):not(.readonly label), label:has(input[type=radio], input[type=checkbox]).has-icon:not(.readonly label) {
  padding: 0.75rem 1rem;
  background-color: var(--alt-bg-color, var(--earcu-pale-blue-light));
  color: var(--main-color, var(--pageup-blue));
  transition: background-color 0.2s, color 0.2s;
}
label:has(input[type=radio], input[type=checkbox]).button:not(.readonly label):not:has(input:disabled):hover, label:has(input[type=radio], input[type=checkbox]):has(svg):not(.readonly label):not:has(input:disabled):hover, label:has(input[type=radio], input[type=checkbox]).has-icon:not(.readonly label):not:has(input:disabled):hover {
  background-color: var(--alt-bg-hover-color, var(--earcu-pale-blue));
}
label:has(input[type=radio], input[type=checkbox]).button:not(.readonly label) input[type=radio]:not(.readonly input[type=radio]),
label:has(input[type=radio], input[type=checkbox]).button:not(.readonly label) input[type=checkbox]:not(.readonly input[type=checkbox]), label:has(input[type=radio], input[type=checkbox]):has(svg):not(.readonly label) input[type=radio]:not(.readonly input[type=radio]),
label:has(input[type=radio], input[type=checkbox]):has(svg):not(.readonly label) input[type=checkbox]:not(.readonly input[type=checkbox]), label:has(input[type=radio], input[type=checkbox]).has-icon:not(.readonly label) input[type=radio]:not(.readonly input[type=radio]),
label:has(input[type=radio], input[type=checkbox]).has-icon:not(.readonly label) input[type=checkbox]:not(.readonly input[type=checkbox]) {
  display: none;
}
label:has(input[type=radio], input[type=checkbox]).has-icon {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  width: 10rem;
  height: 10rem;
}
label:has(input[type=radio], input[type=checkbox]).has-icon .has-tooltip {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  line-height: 1;
}
label:has(input[type=radio], input[type=checkbox]).button:not(.readonly label):has(.has-tooltip) {
  padding-right: 2rem;
}
label:has(input[type=radio], input[type=checkbox]).button:not(.readonly label) .has-tooltip {
  position: absolute;
  top: 0.25rem;
  right: 0.5rem;
}
label:has(input[type=radio], input[type=checkbox]).button:not(.readonly label):has(input:disabled) .has-tooltip:before {
  color: var(--earcu-bright-pink);
}
label:has(input[type=radio], input[type=checkbox])[style*=background-image] {
  width: 100%;
  max-width: 100%;
  background-size: 100%;
  background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
  padding: 0;
  border: 1rem solid var(--earcu-pale-blue-light);
  box-shadow: 1px 1px 5px var(--earcu-grey);
  border-radius: 1rem;
  overflow: hidden;
}
@media (min-width: 992px) {
  label:has(input[type=radio], input[type=checkbox])[style*=background-image] {
    max-width: calc(50% - 0.5rem);
  }
}
@media (min-width: 1400px) {
  label:has(input[type=radio], input[type=checkbox])[style*=background-image] {
    max-width: calc(33.3333333333% - 0.6666666667rem);
  }
}
label:has(input[type=radio], input[type=checkbox])[style*=background-image] img {
  visibility: hidden;
  max-width: 100%;
}
label:has(input[type=radio], input[type=checkbox])[style*=background-image] .label {
  display: block;
  background-color: #FFF;
  color: var(--main-bg-color, var(--pageup-blue));
  transition: color 0.2s;
  padding: 1rem 0;
  font-weight: bold;
  font-size: calc(1rem + 0.1vw);
  margin-top: -1px;
}
label:has(input[type=radio], input[type=checkbox])[style*=background-image] .label .description {
  font-size: calc(1.2rem + 0.2vw);
  color: var(--main-bg-color, var(--pageup-blue));
}
label:has(input[type=radio], input[type=checkbox])[style*=background-image] input[type=radio]:not(.readonly input[type=radio]),
label:has(input[type=radio], input[type=checkbox])[style*=background-image] input[type=checkbox]:not(.readonly input[type=checkbox]) {
  display: none;
}
label:has(input[type=radio], input[type=checkbox]):has(svg) {
  display: flex;
  flex-wrap: wrap;
  width: 10rem;
  height: 10rem;
}
label:has(input[type=radio], input[type=checkbox]):has(svg) svg {
  margin: 0 auto 0.5rem;
  max-width: 100%;
  height: calc(100% - 40px);
  max-height: 80px;
}

label:has(input[type=radio]:disabled:not(.is-forced)):not(.readonly label),
label:has(input[type=checkbox]:disabled:not(.is-forced)):not(.readonly label) {
  background-color: var(--earcu-grey);
  color: var(--earcu-grey-darkest);
}
label:has(input[type=radio]:disabled:not(.is-forced)):not(.readonly label)[style*=background-image],
label:has(input[type=checkbox]:disabled:not(.is-forced)):not(.readonly label)[style*=background-image] {
  border-color: var(--earcu-grey);
}

label.button:not(.readonly label):has(input[type=radio]:checked), label.button:not(.readonly label):has(input[type=checkbox]:checked), label:has(svg):not(.readonly label):has(input[type=radio]:checked), label:has(svg):not(.readonly label):has(input[type=checkbox]:checked), label.has-icon:not(.readonly label):has(input[type=radio]:checked), label.has-icon:not(.readonly label):has(input[type=checkbox]:checked), label[style*=background-image]:has(input[type=radio]:checked), label[style*=background-image]:has(input[type=checkbox]:checked) {
  background-color: var(--earcu-bright-pink);
  color: #FFF;
}
label.button:not(.readonly label):has(input[type=radio]:checked)[style*=background-image], label.button:not(.readonly label):has(input[type=checkbox]:checked)[style*=background-image], label:has(svg):not(.readonly label):has(input[type=radio]:checked)[style*=background-image], label:has(svg):not(.readonly label):has(input[type=checkbox]:checked)[style*=background-image], label.has-icon:not(.readonly label):has(input[type=radio]:checked)[style*=background-image], label.has-icon:not(.readonly label):has(input[type=checkbox]:checked)[style*=background-image], label[style*=background-image]:has(input[type=radio]:checked)[style*=background-image], label[style*=background-image]:has(input[type=checkbox]:checked)[style*=background-image] {
  border-color: var(--earcu-bright-pink);
}

label.has-icon[data-icon]:before {
  font-family: "Font Awesome 6 Pro";
  font-weight: 100;
  font-size: 48px;
  line-height: 1;
  color: inherit;
  content: attr(data-icon);
  display: inline-block;
  width: 100%;
  margin-bottom: 0.5rem;
}

.side-by-side .options-container {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

form:where(:not(.w-100)) {
  max-width: 500px;
}
form p {
  margin-bottom: 0.25rem;
}
form p.error {
  color: #DD0F0F;
  padding: 0.5rem 0;
  margin-bottom: 0;
}

.button-container {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 2rem;
}

.btn-continue {
  padding: 0.75rem 5rem;
}

.btn.btn-recommender-back, .btn.btn-recommender-reset, .btn.btn-start-over {
  border-color: var(--earcu-bright-pink);
  border-width: 2px;
}
.btn.btn-recommender-back:hover, .btn.btn-recommender-reset:hover, .btn.btn-start-over:hover {
  color: var(--earcu-bright-pink);
}

.btn-deselect-recommendations {
  border-color: var(--earcu-bright-pink);
  border-width: 2px;
  text-decoration: none;
  color: var(--earcu-bright-pink);
}
.btn-deselect-recommendations:hover {
  border-color: var(--earcu-bright-pink);
  color: var(--earcu-bright-pink);
}

.field-container:has(#ClientURL) {
  display: none;
}

.field-container:has(input[type=radio][name=CreateYourDesign][value=SEAMLESS]:checked) ~ .field-container:has(#ClientURL) {
  display: block;
}

.field-container:has(input[type=checkbox][name=Product][value=RECRUITMENTMARKETING]:checked) ~ .field-container label:has(input[name=AtsPackage][value=EMPOWER]) {
  display: none !important;
}

.field-container:has(input[name=ContractLength], input[name=ASPAgreementDate]) {
  display: none !important;
  /*label:has(input[value="LESSTHAN12"]) {
  	display: none;
  }*/
}

.field-container:has(input[type=radio][name=ClientType][value=EXISTING]:checked) ~ .field-container:has(input[name=ContractLength], input[name=ASPAgreementDate]) {
  display: block !important;
}

#Field-Product:not(:has(input:checked)) + #Field-ProjectType {
  display: none;
}

.btn-recommender-back,
.btn-save-results,
.btn-start-over,
.btn-download,
.btn-download-proposal,
.btn-save-results,
.btn-recommender-results,
.btn-recommender-reset {
  padding: 0.75rem 5rem;
  text-decoration: none;
  color: var(--earcu-bright-pink);
}
.btn-recommender-back:hover .text,
.btn-save-results:hover .text,
.btn-start-over:hover .text,
.btn-download:hover .text,
.btn-download-proposal:hover .text,
.btn-save-results:hover .text,
.btn-recommender-results:hover .text,
.btn-recommender-reset:hover .text {
  text-decoration: underline;
}

.btn.btn-download-proposal {
  --btn-color-1: var(--earcu-pale-purple);
  background-color: var(--earcu-pale-purple);
}

.btn-demo {
  padding: 0.375rem 2.5rem;
}

.form {
  max-width: 100%;
}

.main-field-label {
  font-size: 1.5rem;
  margin-bottom: 1rem;
  color: var(--main-color, var(--pageup-blue));
  transition: color 0.2s;
}

/* #endregion */
/* #region Modals */
.modal .btn {
  padding: 0.75rem 2rem;
}

/* #endregion */
/* #region Progress bar */
.section-pricebook ul.navbar-nav {
  margin-left: 0.25rem;
}
.section-pricebook .nav-item .nav-link {
  color: var(--main-color, var(--earcu-purple));
  transition: color 0.2s;
}
.section-pricebook .nav-item.current-step .nav-link {
  color: var(--earcu-bright-pink);
  font-weight: bold;
}

.progress-bar-container {
  background-color: var(--main-bg-color, #FFF);
  transition: background-color 0.2s;
  padding: 1rem 0;
  position: relative;
  display: none;
}
@media (min-width: 992px) {
  .progress-bar-container {
    padding: 1rem;
    display: block;
  }
}
.progress-bar-container .container {
  position: relative;
}
.progress-bar-container .btn-back {
  font-size: 1.25rem;
  font-weight: bold;
  text-decoration: none;
  color: var(--earcu-purple);
}
.progress-bar-container div:has(> .btn-back) {
  display: flex;
  align-items: center;
}

.pb-progress-bar {
  display: flex;
  flex-wrap: nowrap;
  padding: 0;
  align-items: center;
  width: 100%;
}
.pb-progress-bar .nav-item {
  --default-color: var(--earcu-grey);
  --completed-color: var(--main-color, var(--earcu-purple));
  --current-color: var(--earcu-bright-pink);
  --blob-color: var(--main-color, var(--default-color));
  --line-color: var(--main-color, var(--default-color));
  --blob-size: 40px;
  --line-size: 10px;
  display: inline-block;
  width: 100%;
  padding: 0;
  min-height: 30px;
}
.pb-progress-bar .nav-item:has(+ .completed-step, ~ .completed-step) {
  --line-color: var(--current-color);
}
.pb-progress-bar .nav-item.completed-step {
  --blob-color: var(--current-color);
}
.pb-progress-bar .nav-item.completed-step a {
  font-weight: bold;
}
.pb-progress-bar .nav-item:has(+ .current-step, ~ .current-step) {
  --line-color: var(--current-color);
}
.pb-progress-bar .nav-item.current-step {
  --blob-color: var(--current-color);
}
.pb-progress-bar .nav-item.current-step a {
  font-weight: bold;
}
.pb-progress-bar .nav-item.current-step a:before {
  transform: scale(1.25);
}
.pb-progress-bar .nav-item:not(.current-step) a:hover:before {
  transform: scale(1.125);
}
.pb-progress-bar .nav-item a.nav-link {
  min-height: 30px;
  position: relative;
  display: inline-block;
  padding: calc(var(--blob-size) + 10px) 0 0;
  color: var(--blob-color);
  transition: color 0.2s;
  width: 100%;
  text-align: center;
}
.pb-progress-bar .nav-item a.nav-link:before {
  position: absolute;
  left: calc(50% - var(--blob-size) / 2);
  top: 0;
  content: "";
  width: var(--blob-size);
  height: var(--blob-size);
  background-color: var(--blob-color);
  border-radius: 50%;
  display: inline-block;
  z-index: 2;
  transition: transform 0.35s;
}
.pb-progress-bar .nav-item a.nav-link .dividing-line {
  position: absolute;
  top: calc(var(--blob-size) / 2 - var(--line-size) / 2);
  height: var(--line-size);
  width: 100%;
  left: calc(50% + var(--blob-size) / 2);
  z-index: 1;
}
.pb-progress-bar .nav-item a.nav-link .dividing-line:before, .pb-progress-bar .nav-item a.nav-link .dividing-line:after {
  content: "";
  background-color: var(--line-color);
  transition: background-color 0.2s;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.pb-progress-bar .nav-item a.nav-link .dividing-line:before {
  background-color: #CCC;
}
.pb-progress-bar .nav-item:last-child a .dividing-line {
  display: none;
}

.page-finish section.group:has(#collapse-Notes) {
  display: none;
}

.beta-container {
  position: absolute;
  top: 0;
  right: 0;
  width: 200px;
  height: 200px;
  pointer-events: none;
  display: block;
  z-index: 99;
  overflow: hidden;
}
.beta-container:before {
  content: "New";
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  right: -50%;
  top: 90%;
  width: 200%;
  height: 36px; /* ribbon thickness */
  background: #FF4782;
  color: #FFF;
  transform: rotate(45deg);
  transform-origin: top right;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  border-radius: 2px;
  pointer-events: none;
  text-align: center;
}
.beta-container:hover:before {
  transform: rotate(30deg);
}
.beta-container.beta-container-small {
  width: 75px;
  height: 75px;
}
.beta-container.beta-container-small:before {
  right: -60%;
  top: 80%;
  width: 200%;
  height: 36px; /* ribbon thickness */
}
.beta-container.beta-container-small:is(label:has(input:checked) .beta-container):before {
  background: #fff;
  color: #FF4782;
}

/* #endregion */
/* #region Page scroll progress bar */
/* The progress container (grey background) */
.progress-container {
  width: 100%;
  background: #ccc;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 8px;
  z-index: 10000;
}

/* The progress bar (scroll indicator) */
.progress-bar {
  height: 8px;
  background: #04AA6D;
  /*background: #FF426F;*/
  width: 0%;
}

.pb-tooltip-content-container {
  display: none;
}

/* #endregion */
/* #region Finish */
.page-finish section {
  margin: 0 0 3rem;
}
@media (min-width: 992px) {
  .page-finish section {
    margin-bottom: 4rem;
  }
}
.page-finish section:has(+ .row .button-container) {
  margin-bottom: 0;
}
.page-finish h2 {
  font-size: calc(1.2rem + 0.1vw);
  margin: 0;
  font-weight: 400;
}
@media (min-width: 1200px) {
  .page-finish h2 {
    font-size: 1.5rem;
  }
}
.page-finish h3 {
  font-size: calc(1rem + 0.4vw);
  margin-bottom: 0;
  font-weight: 400;
  line-height: 1;
}
@media (min-width: 1200px) {
  .page-finish h3 {
    font-size: 1.25rem;
  }
}
.page-finish h3 + div ul {
  margin-top: 0.5rem;
  margin-bottom: 0;
}
.page-finish hr {
  margin: 0;
  background-color: #000;
  height: 1px;
  opacity: 1;
}
.page-finish ul {
  padding-left: 0.5rem;
  margin-left: 0;
}
.page-finish ul:where(.group.bordered ul) {
  list-style-type: "- ";
}
.page-finish li {
  padding-left: 0;
  margin-left: 0;
  font-size: 0.9rem;
}
.page-finish .btn {
  width: 100%;
}
@media (min-width: 992px) {
  .page-finish .btn {
    width: auto;
  }
}
.page-finish .button-container {
  flex-wrap: wrap;
}
.page-finish .row [class*=col]:has(h2, h3) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.page-finish .row [class*=col]:has(h2, h3) h2, .page-finish .row [class*=col]:has(h2, h3) h3 {
  width: 100%;
  font-weight: bold;
}
@media (min-width: 992px) {
  .page-finish .row [class*=col]:has(h2, h3) h2, .page-finish .row [class*=col]:has(h2, h3) h3 {
    font-weight: normal;
  }
}
.page-finish .row [class*=col]:has(h2, h3) p {
  width: 100%;
}
.page-finish section.group {
  --base-padding: 1.5rem;
  width: 100%;
  margin-bottom: var(--base-padding, 0);
}
@media (min-width: 1200px) {
  .page-finish section.group {
    --base-padding: 2rem;
  }
}
.page-finish section.group.bordered {
  border: 1px solid var(--main-color, var(--pageup-blue));
  transition: border-color 0.2s;
}
.page-finish section.group.combine-options section:not(:has(h2)) {
  margin-bottom: 0;
}
.page-finish section.group section:last-child {
  margin-bottom: 0;
}
.page-finish section.group:has(> h3) {
  margin-top: 1.5rem;
}
.page-finish section.group > h2 {
  margin-bottom: 1.5rem;
}
.page-finish section.group > h3 {
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-size: 1.5rem;
}
.page-finish section.group .group-header {
  position: relative;
}
.page-finish section.group .group-header .content-container {
  padding: var(--base-padding, 0);
}
.page-finish section.group .group-content .content-container {
  padding: 0 var(--base-padding, 0) var(--base-padding, 0);
  gap: 1rem;
}
.page-finish section.group .group-content .content-container > .group {
  margin-bottom: 1rem;
}
@media (min-width: 992px) {
  .page-finish section.group .group-content .content-container > .group {
    margin-bottom: 2rem;
  }
}
@media (min-width: 992px) {
  .page-finish section.group .group-content .content-container {
    gap: 2rem;
  }
}
.page-finish section.group .group-content .content-container .content-container {
  gap: 0;
}
@media (min-width: 992px) {
  .page-finish section.group .group-content .content-container .content-container {
    gap: 0;
  }
}
.page-finish section.group .group-content .content-container > *:last-child {
  margin-bottom: 0;
}
@media (min-width: 992px) {
  .page-finish section.group .group-content .content-container > *:last-child {
    margin-bottom: 0;
  }
}
.page-finish section.group .group-footer .content-container {
  padding: 0 var(--base-padding, 0) var(--base-padding, 0);
}
.page-finish section.group .group {
  --base-padding: 0;
}
.page-finish .unit-value,
.page-finish .unit-label {
  display: flex;
  width: 100%;
}
@media (min-width: 992px) {
  .page-finish .unit-value,
  .page-finish .unit-label {
    text-align: center;
    justify-content: center;
    line-height: 1;
  }
}
.page-finish .unit-value-container .unit-value {
  text-align: end;
  justify-content: end;
}
@media (min-width: 992px) {
  .page-finish .unit-value-container .unit-value {
    text-align: center;
    justify-content: center;
  }
}
.page-finish .row.heading-row .unit-label-container {
  display: none;
  justify-content: center;
  align-items: center;
}
@media (min-width: 992px) {
  .page-finish .row.heading-row .unit-label-container {
    display: flex;
  }
}
.page-finish .row.heading-row .unit-label-container .unit-label {
  color: var(--earcu-bright-pink);
}
@media (min-width: 992px) {
  .page-finish .row.data-row .unit-label-container {
    display: none;
  }
}
.page-finish .row.data-row .unit-label-container .unit-label {
  color: var(--earcu-bright-pink);
}
@media (min-width: 992px) {
  .page-finish .row.data-row .unit-label-container .unit-label {
    color: var(--pageup-blue);
  }
}
.page-finish .row.data-row .unit-value-container {
  display: flex;
  align-items: center;
  justify-content: end;
}
@media (min-width: 992px) {
  .page-finish .row.data-row .unit-value-container {
    justify-content: center;
  }
}
.page-finish .row.notes-row {
  transition: border-color 0.2s;
  padding: 1rem 0;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.page-finish .row.subtotal-row {
  border-top: 1px solid var(--main-color, var(--pageup-blue));
  transition: border-color 0.2s;
  color: var(--earcu-bright-pink);
  margin-top: 0.5rem;
  padding-top: 1rem;
  font-size: 1.25rem;
}
.page-finish .row.subtotal-row .row-header {
  display: flex;
  align-content: center;
  flex-wrap: wrap;
}
.page-finish .row.subtotal-row .row-header .subtotal-heading {
  display: inline-block;
  position: relative;
  line-height: 1;
  padding-bottom: 3px;
}
.page-finish .row.subtotal-row .row-header .subtotal-heading:before {
  content: "";
  position: absolute;
  bottom: 0;
  width: 80%;
  left: 10%;
  margin: 0 auto;
  border-bottom: 1px solid var(--pageup-blue);
  display: block;
}
@media (min-width: 992px) {
  .page-finish .row.subtotal-row .row-header .subtotal-heading:before {
    border-bottom-color: transparent;
  }
}
@media (min-width: 992px) {
  .page-finish .row.subtotal-row .row-header .subtotal-heading {
    line-height: 1.5;
  }
}
@media (min-width: 992px) {
  .page-finish .row.subtotal-row .unit-label-container {
    display: none;
  }
}
.page-finish .row.subtotal-row .unit-value-container {
  display: flex;
  align-items: center;
  justify-content: end;
  flex-wrap: wrap;
  position: relative;
}
@media (min-width: 992px) {
  .page-finish .row.subtotal-row .unit-value-container {
    justify-content: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
.page-finish .row.subtotal-row .unit-value-container .unit-value {
  color: var(--main-color, var(--pageup-blue));
  transition: color 0.2s;
  font-weight: bold;
  font-size: 1.25rem;
}
@media (min-width: 1200px) {
  .page-finish .row.subtotal-row .unit-value-container .unit-value {
    font-size: 1rem;
  }
}
@media (min-width: 1400px) {
  .page-finish .row.subtotal-row .unit-value-container .unit-value {
    font-size: 1.25rem;
  }
}
.page-finish .row.subtotal-row .unit-value-container .unit-label {
  font-size: 1rem;
  opacity: 0;
  color: var(--earcu-bright-pink);
  transition: opacity 0.35s;
  display: none;
}
@media (min-width: 992px) {
  .page-finish .row.subtotal-row .unit-value-container .unit-label {
    display: flex;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
  }
}
.page-finish .row.total-row {
  padding: 0.5rem;
  border-top: 3px solid var(--main-color, var(--pageup-blue));
  transition: border-color 0.2s;
  margin-top: 2rem;
  font-weight: bold;
  font-size: 1.5rem;
  color: var(--earcu-bright-pink);
}
@media (min-width: 768px) {
  .page-finish .row.total-row {
    padding: 0.5rem 2rem 2rem;
  }
}
.page-finish .row.total-row .row-header {
  padding-top: 1rem;
  padding-bottom: 1rem;
  line-height: 1;
}
@media (min-width: 992px) {
  .page-finish .row.total-row .unit-label-container {
    display: none;
  }
}
.page-finish .row.total-row .unit-value-container {
  display: flex;
  align-items: center;
  justify-content: end;
  flex-wrap: wrap;
}
.page-finish .row.total-row .unit-value-container .unit-label {
  display: none;
}
@media (min-width: 992px) {
  .page-finish .row.total-row .unit-value-container {
    justify-content: center;
    position: relative;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .page-finish .row.total-row .unit-value-container .unit-value {
    color: var(--main-color, var(--pageup-blue));
    transition: color 0.2s;
  }
  .page-finish .row.total-row .unit-value-container .unit-label {
    display: block;
    font-size: 1rem;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
  }
}
.page-finish .row.total-row .unit-value-container .unit-value {
  white-space: nowrap;
}
.page-finish .row.total-row.discount-row, .page-finish .row.total-row.estimate-subtotals {
  padding: 0.5rem 2rem 0;
  margin-top: 1rem;
  font-weight: normal;
  border-top-width: 1px;
}
.page-finish .row.total-row.discount-row .row-header, .page-finish .row.total-row.estimate-subtotals .row-header {
  font-weight: normal;
}
.page-finish .row.total-row.discount-row + .total-row {
  margin-top: 1rem;
}
.page-finish .unit-label-container {
  transition: opacity 0.35s;
}
.page-finish a[data-bs-toggle=collapse][aria-expanded=false] ~ .unit-label-container {
  opacity: 0;
}
.page-finish .group-header:has(> .content-container > .row.heading-row > a[data-bs-toggle=collapse][aria-expanded=false]) ~ .group-footer .subtotal-row {
  margin-top: 0;
}
@media (min-width: 992px) {
  .page-finish .group-header:has(> .content-container > .row.heading-row > a[data-bs-toggle=collapse][aria-expanded=false]) ~ .group-footer .subtotal-row .unit-value-container .unit-label {
    opacity: 1;
  }
}

h1.estimates-heading {
  margin-bottom: 1rem;
}

.intro {
  font-size: calc(1rem + 0.1vw);
  font-weight: 400;
  margin-bottom: 3rem;
}
@media print {
  .intro {
    margin-bottom: 0.5rem;
  }
}

@media screen {
  .printing .intro {
    margin-bottom: 0.5rem;
  }
}
.requested-by {
  font-size: 0.9rem !important;
  margin-top: 0;
  padding-top: 0;
  margin-bottom: 2rem;
}

@media screen {
  .print-only {
    display: none;
  }
}

h2.notes-heading {
  margin-bottom: 1rem;
}

.item-row {
  margin-top: 0.5rem;
}

.item-description {
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
}
.item-description ul {
  padding-left: 1.25rem;
}
.item-description p, .item-description li {
  font-size: 1rem;
}
.item-description li {
  list-style-type: disc;
}

.row:has(> a[data-bs-toggle=collapse]) > a[data-bs-toggle=collapse] {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: end;
  text-decoration: none;
  z-index: 1;
  padding-right: var(--base-padding, 0);
}
.row:has(> a[data-bs-toggle=collapse]) > a[data-bs-toggle=collapse]:after {
  font-family: "Font Awesome 6 Pro";
  content: "\f078";
  font-size: 1.25rem;
  color: var(--main-color, var(--pageup-blue));
  transition: color 0.2s;
}
.row:has(> a[data-bs-toggle=collapse]) > a[data-bs-toggle=collapse][aria-expanded=true]:after {
  content: "\f077";
}

/* #endregion */
/* #region Admin */
.conditions {
  border: 2px solid #0C263F;
  padding: 1rem;
  border-radius: 1rem;
  margin-bottom: 1rem;
}

td:has(> .conditions, > .rows) {
  padding: 0;
  border-bottom: 0;
}

.rows {
  border: 2px solid #0C263F;
  padding: 1rem;
  border-radius: 1rem;
  margin-bottom: 1rem;
}

/* #endregion */
/* #region Accordions */
.row[data-bs-toggle] {
  position: relative;
  cursor: pointer;
}
.row[data-bs-toggle] h3 {
  position: relative;
  padding-right: 1.5rem;
}
@media (min-width: 992px) {
  .row[data-bs-toggle] h3 {
    position: static;
  }
}
.row[data-bs-toggle] h3:after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  line-height: 1;
  color: inherit;
  content: "\f078";
  display: inline-block;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 992px) {
  .row[data-bs-toggle] h3:after {
    right: 1rem;
  }
}
.row[data-bs-toggle] h3:has(+ .show):after {
  content: "\f077";
}

/* #endregion */
.boxed {
  border: 1px solid var(--main-color, var(--pageup-blue));
}
.boxed:not([class*=col-], .row) {
  padding: 1rem 2rem;
  margin: 0;
}
.boxed.field-container {
  margin-bottom: 1.5rem;
}

@media screen {
  .printing .progress-bar-container {
    display: none !important;
  }
  .printing body {
    background-image: none !important;
  }
  .printing .page-surround {
    padding: 1rem !important;
    border-radius: 0 !important;
    margin: 0 auto !important;
    max-width: 100% !important;
    box-shadow: none !important;
  }
  .printing .btn-apply-discount {
    display: none !important;
  }
  .printing .button-container {
    display: none !important;
  }
  .printing .row[data-bs-toggle] h3:after,
  .printing .row[data-bs-toggle] h3:has(+ .show):after {
    content: none;
  }
  .printing .collapse:not(.show) {
    display: block !important;
  }
  @supports selector(:has) {
    .printing .row:has(.button-container) {
      display: none !important;
    }
    .printing .row:has(hr) {
      display: none !important;
    }
  }
  .printing footer {
    display: none !important;
  }
  .printing .back-to-top {
    display: none !important;
  }
  .printing .page-finish section {
    margin-bottom: 1rem !important;
  }
  .printing hr {
    display: none !important;
  }
  .printing .page-finish h2 {
    font-size: 1.2rem !important;
  }
  .printing .page-finish h3 {
    font-size: 1.1rem !important;
  }
  .printing .page-recommender .congratulations-card {
    margin-top: 0 !important;
  }
}
@media print {
  header,
  .breadcrumb-trail,
  .hero {
    display: none;
  }
  .progress-bar-container {
    display: none !important;
  }
  body {
    background-image: none !important;
  }
  .page-surround {
    padding: 0 !important;
    border-radius: 0 !important;
    margin: 0 auto !important;
    max-width: 100% !important;
    box-shadow: none !important;
  }
  .btn-apply-discount {
    display: none !important;
  }
  .button-container {
    display: none !important;
  }
  .row[data-bs-toggle] h3:after,
  .row[data-bs-toggle] h3:has(+ .show):after {
    content: none;
  }
  .collapse:not(.show) {
    display: block !important;
  }
  @supports selector(:has) {
    .row:has(.button-container) {
      display: none !important;
    }
    .row:has(hr) {
      display: none !important;
    }
  }
  footer {
    display: none !important;
  }
  .back-to-top {
    display: none !important;
  }
  .page-finish section {
    margin-bottom: 1rem !important;
  }
  hr {
    display: none !important;
  }
  .page-finish h2 {
    font-size: 1.2rem !important;
  }
  .page-finish h3 {
    font-size: 1.1rem !important;
  }
}
.option-group-heading span.has-tooltip {
  margin-left: 0.5rem;
}

.option-group {
  padding-top: 1rem;
}
.option-group.boxed {
  border: 1px solid var(--main-color, var(--pageup-blue));
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.option-group .checkbox {
  margin-bottom: 0.5rem;
  border-radius: 0.25rem;
  font-size: 1rem;
  font-weight: 400;
  padding: 0.25rem 2rem;
  display: flex;
  align-items: center;
}
.option-group .checkbox:before {
  font-family: "Font Awesome 6 Pro";
  content: "\f0c8";
  margin-right: 1rem;
  font-weight: 400;
  font-size: 1.5rem;
}
.option-group .checkbox.checked:before {
  content: "\f00c";
}
.option-group.readonly .checkbox {
  margin-bottom: 0;
  padding: 0 2rem;
}
.option-group .col-12:has(label input[type=checkbox]) {
  display: flex;
  align-items: center;
}
.option-group label:has(input[type=checkbox]) {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 0.5rem;
  user-select: none;
  text-align: left;
}
.option-group label:has(input[type=checkbox]) input[type=checkbox] {
  display: none;
}
.option-group label:has(input[type=checkbox]):before {
  font-family: "Font Awesome 6 Pro";
  content: "\f0c8";
  font-size: 1.1rem;
}
.option-group label:has(input[type=checkbox]:checked):before {
  content: var(--checked-icon, "\f14a");
}
.option-group label:has(.is-recommended), .option-group label:has(.is-forced) {
  color: var(--earcu-bright-pink);
}
.option-group label:has(.is-forced):before {
  font-weight: 900;
}
.option-group .selected-span {
  font-size: 0.9rem;
  margin-left: 1rem;
}
.option-group h3 {
  font-size: 1.25rem;
  border-bottom: 1px solid var(--main-color, var(--pageup-blue));
  padding-bottom: 0.5rem;
  margin-bottom: 0;
  margin-top: 1rem;
}
.option-group .row:has(h3 [data-bs-toggle=collapse]) a[data-bs-toggle=collapse] {
  color: inherit;
  font-size: inherit;
  text-decoration: inherit;
  position: relative;
  display: block;
  width: 100%;
}
.option-group .row:has(h3 [data-bs-toggle=collapse]) a[data-bs-toggle=collapse]:hover {
  color: inherit;
  font-size: inherit;
  text-decoration: inherit;
}
.option-group .row:has(h3 [data-bs-toggle=collapse]) a[data-bs-toggle=collapse]:after {
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  line-height: 1;
  color: inherit;
  content: "\f078";
  display: inline-block;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s;
}
@media (min-width: 992px) {
  .option-group .row:has(h3 [data-bs-toggle=collapse]) a[data-bs-toggle=collapse]:after {
    right: 1rem;
  }
}
.option-group .row:has(h3 [data-bs-toggle=collapse]):has(+ .show, + .collapsing) a[data-bs-toggle=collapse]:not(.collapsed):after {
  transform: rotate(180deg);
}
.option-group .collapsing, .option-group .collapse {
  transition: all 0.2s;
  padding-top: 1rem;
}
.option-group .collapsing.expanded-items, .option-group .collapse.expanded-items {
  padding-top: 0;
}
.option-group:has(.expanded-items.collapse) + .expanded-items-footer .collapse-expanded {
  display: none;
}
.option-group:has(.expanded-items.collapse) + .expanded-items-footer .expanded-items-expanded {
  display: none;
}
.option-group:has(.expanded-items.collapse.show) + .expanded-items-footer .collapse-expanded {
  display: inline;
}
.option-group:has(.expanded-items.collapse.show) + .expanded-items-footer .collapse-collapsed {
  display: none;
}
.option-group:has(.expanded-items.collapse.show) + .expanded-items-footer .expanded-items-expanded {
  display: flex;
}
.option-group:has(.expanded-items.collapse.show) + .expanded-items-footer .expanded-items-collapsed {
  display: none;
}

section {
  position: relative;
}
section.extra-padding {
  padding-top: 4rem;
}
section h2.extra-margin {
  margin-top: 2.5rem;
  margin-bottom: 1.5rem;
}
section p.extra-margin {
  margin-top: 1.5rem;
  margin-bottom: 2.5rem;
}
section .recommendation-btn-container {
  gap: 1rem;
  display: flex;
  width: 100%;
}
@media (min-width: 768px) {
  section .recommendation-btn-container {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
  }
}
section .recommendation-btn-container .btn {
  width: 100%;
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  section .recommendation-btn-container .btn {
    width: auto;
    margin-bottom: 0;
  }
}
section:not(:has(input.is-recommended)) .recommendation-btn-container {
  display: none;
}
section .btn-select-recommendations,
section .btn-deselect-recommendations {
  display: none;
}
section:has(label input.is-recommended:checked) .btn-deselect-recommendations, section:has(label input.is-recommended:not(:checked)) .btn-select-recommendations {
  display: inline-block;
}

.field-container {
  margin-bottom: 1.5rem;
  padding: 1rem 0;
}
.field-container:has(+ .field-container) {
  padding-bottom: 0;
}
.field-container + .field-container {
  padding-top: 0;
}
.field-container:has(+ .field-container h3) {
  padding-bottom: 1rem;
}
.field-container + .field-container:has(h3) {
  padding-top: 1rem;
}
.field-container:last-child:first-child {
  padding: 0;
}
.field-container h2 {
  margin-top: 1rem;
  font-size: 1.75rem;
}
.field-container .row.option-group.boxed {
  margin-left: -2rem;
  margin-right: -2rem;
}
.field-container:has(.boxed) {
  padding-left: 2rem;
  padding-right: 2rem;
}

.has-tooltip {
  text-decoration: none;
  display: inline-block;
}
.has-tooltip:before {
  font-family: "Font Awesome 6 Pro";
  content: "\f05a";
  font-weight: bold;
  color: var(--main-color, var(--pageup-blue));
  transition: color 0.2s;
}
.has-tooltip:hover {
  text-decoration: none;
}

.field-container .has-tooltip:before {
  color: var(--main-color, var(--pageup-blue));
}
.field-container .item-row .has-tooltip:before {
  color: var(--main-color, var(--pageup-blue));
}

.expanded-items-footer {
  margin-top: 1rem;
  padding-bottom: 1rem;
}
.expanded-items-footer .expanded-items-collapsed {
  margin-bottom: 0.5rem;
}

/* #region Recommender */
.page-surround.page-recommender {
  backdrop-filter: blur(4px);
}

.page-recommender .intro {
  font-size: 1.5rem;
}
.page-recommender .question {
  margin-bottom: 1.5rem;
  overflow: hidden;
  background-color: var(--alt-bg-color, transparent);
  border-radius: 0;
}
.page-recommender .question label:has(input[type=radio], input[type=checkbox]) {
  background-color: transparent;
  color: var(--main-color, var(--pageup-blue));
  padding: 2rem;
  border-radius: 0.5rem;
  transition: color 0.2s, background-color 0.2s;
  font-size: 1.5rem;
}
.page-recommender .question label:has(input[type=radio]:checked, input[type=checkbox]:checked),
.page-recommender .question label:has(input[type=radio]:checked, input[type=checkbox]:checked):hover {
  color: var(--main-color, var(--pageup-blue));
}
.page-recommender .question label:has(input[type=radio], input[type=checkbox]) {
  padding: 2rem;
}
.page-recommender .question .toggle-container {
  display: flex;
  margin-left: auto;
  border-radius: 500px;
  border: 3px solid transparent;
  padding: 3px;
  background-color: #AAA;
  transition: all 0.2s;
}
.page-recommender .question .toggle-container:before {
  font-family: "Font Awesome 6 Pro";
  content: "\f00d";
  display: flex;
  width: 2rem;
  aspect-ratio: 1/1;
  margin-left: 0;
  margin-right: 2.5rem;
  transition: all 0.2s;
  border: 2px solid #FFF;
  background-color: #FFF;
  border-radius: 500px;
  text-align: center;
  justify-content: center;
  align-items: center;
  line-height: 1;
  color: #AAA;
  font-size: 1rem;
}
.page-recommender .question .toggle-container:has(input:checked) {
  background-color: var(--earcu-bright-pink);
  border-color: var(--earcu-bright-pink);
}
.page-recommender .question .toggle-container:has(input:checked):before {
  content: "\f00c";
  margin-left: 2.5rem;
  margin-right: 0;
  color: var(--earcu-bright-pink);
}
.page-recommender .question .toggle-container input[type=checkbox] {
  display: none;
}
.page-recommender .question:nth-child(even) {
  background-color: var(--alt-bg-hover-color, #FDF9FB);
}
.page-recommender .question label {
  width: 100%;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: start;
}
.page-recommender .question label:focus, .page-recommender .question label:focus-within {
  border: none !important;
  outline: none !important;
}
.page-recommender .question label:focus .toggle-container, .page-recommender .question label:focus-within .toggle-container {
  border: 3px solid var(--pageup-blue);
}
.page-recommender .results {
  display: none;
}
.page-recommender a.btn:where(:not(.btn-apply-discount)) {
  padding: 0.75rem 5rem;
}
.page-recommender .congratulations-card {
  margin: 5rem auto 0;
}
.page-recommender .congratulations-card:before {
  font-family: "Font Awesome 6 Pro";
  content: "\f762";
  margin: 0 auto;
  width: 100px;
  aspect-ratio: 1/1;
  font-weight: 900;
  font-size: 80px;
  display: block;
  margin-bottom: 1rem;
}
.page-recommender .congratulations-card h2.congratulations, .page-recommender .congratulations-card p {
  text-align: center;
}
.page-recommender .congratulations-card h2.congratulations {
  margin-bottom: 2rem;
}
.page-recommender .congratulations-card h2.estimate {
  margin-top: 4rem;
}
.page-recommender .congratulations-card p {
  font-size: 1.25rem;
}
.page-recommender .congratulations-card hr {
  max-width: 10vw;
  height: 2px;
  background-color: var(--pageup-blue);
  margin: 2rem auto;
}
.page-recommender .table {
  margin-top: 4rem;
  margin-bottom: 4rem;
}
.page-recommender .table th, .page-recommender .table td {
  font-size: 1.25rem;
}

/* #endregion */
.popover {
  --bs-popover-max-width: 340px;
}
.popover .popover-header {
  background-color: var(--alt-bg-color, var(--pageup-blue));
  color: #FFF;
}
.popover .popover-body {
  color: var(--main-color, var(--pageup-blue));
}

.table {
  margin-bottom: 0;
  --bs-table-color: var(--main-color, var(--pageup-blue));
  --bs-table-striped-color: var(--main-color, var(--pageup-blue));
  --bs-table-striped-bg: var(--alt-bg-hover-color, #FDF9FB);
  --bs-table-bg: var(--alt-bg-color, #212121);
}
.table thead th,
.table tfoot td {
  --bs-table-color: var(--earcu-bright-pink);
  font-weight: bold;
}
.table tbody td {
  background-color: var(--alt-bg-color, #FFF);
}

.field-option-group-container + .field-option-group-container {
  margin-top: 2rem;
}
.field-option-group-container .group-header {
  margin-bottom: 1rem;
}
.field-option-group-container .group-header .has-tooltip {
  margin-left: 0.5rem;
}

main.floating {
  height: 100vh;
  display: flex;
  align-items: center;
}

.tile {
  background-color: var(--alt-bg-color, #FFF);
  border: 5px solid var(--tile-border-color, var(--blue-7));
  text-align: center;
  min-height: 15vh;
  border-radius: 2rem;
  padding: 0.5rem;
  aspect-ratio: 3/2;
  display: flex;
  align-items: center;
  color: var(--main-color, var(--blue-7));
  text-decoration: none;
  width: 100%;
  margin: 0 auto 1rem;
  transition: background-color 0.2s, border-color 0.2s;
}
@media (min-width: 992px) {
  .tile {
    width: 100%;
    padding: 1rem;
    aspect-ratio: 1/1;
  }
}
@media (min-width: 1400px) {
  .tile {
    aspect-ratio: 3/2;
  }
}
.tile h2 {
  color: var(--main-color, var(--blue-7));
}
.tile:hover h2 {
  text-decoration: underline;
}
.tile .tile-content {
  width: 100%;
}
.tile .fa {
  font-size: 2rem;
}
@media (min-width: 1200px) {
  .tile .fa {
    font-size: 2.5rem;
  }
}
@media (min-width: 1400px) {
  .tile .fa {
    font-size: 3rem;
  }
}
.tile h2 {
  margin-top: 0.5rem;
  font-size: 1.5rem;
  font-weight: 100;
  text-decoration-thickness: 2px;
}
.tile h2 strong {
  font-weight: 900;
  text-shadow: 0px 1px var(--main-color, #333);
  text-decoration: none;
}
@media (min-width: 1400px) {
  .tile h2 {
    margin-top: 1rem;
    font-size: 1.75rem;
  }
}
.tile:hover {
  text-decoration: none;
  background-color: var(--pink);
  color: #FFF;
  border-color: var(--pink);
}
.tile:hover h2 {
  color: #FFF;
  text-decoration: none;
  transition: color 0.2s;
}

/* Chrome, Safari, Edge, Opera */
/*input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}*/
/* Firefox */
/*input[type=number] {
	-moz-appearance: textfield;
}*/
footer {
  min-height: 120px;
  background-color: var(--main-bg-color, var(--blue-7));
  transition: background-color 0.2s;
}
footer .row {
  min-height: 120px;
}
footer img,
footer img.img-fluid {
  max-width: 124px;
}
footer p {
  color: #fdfffc;
  font-size: 0.9rem;
  font-weight: 700;
  margin: 0;
}

.sec-col {
  text-align: right;
}

a.imglink {
  text-decoration: none;
}

.header,
.header .row {
  min-height: 104px;
}

.menu-container {
  display: flex;
  flex-direction: row;
  justify-content: start;
  flex-wrap: wrap;
}
@media (min-width: 992px) {
  .menu-container .menu-item:first-child {
    margin-left: auto;
  }
}

.menu-item {
  display: flex;
  width: auto;
  align-items: stretch;
  padding: 0.5rem;
  width: 100%;
  height: 40px;
}
@media (min-width: 992px) {
  .menu-item {
    flex-direction: column;
    width: auto;
    justify-content: center;
    align-content: stretch;
  }
}
.menu-item .fa {
  color: var(--pink);
}
.menu-item .blx {
  color: var(--main-color, var(--blue-7));
  font-size: 30px;
}
.menu-item .menu-item-img {
  width: 40px;
  margin-right: 1rem;
  justify-content: center;
  text-align: center;
  display: flex;
}
@media (min-width: 992px) {
  .menu-item .menu-item-img {
    margin-right: 0;
    margin-bottom: 0.5rem;
    width: 100%;
  }
  .menu-item .menu-item-img img {
    max-width: 40px;
  }
}
.menu-item .menu-item-img,
.menu-item .menu-item-text {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
}

.menu-item-img {
  display: flex;
}
@media (min-width: 992px) {
  .menu-item-img {
    justify-content: center;
    text-align: center;
  }
}

.menu-item-text {
  display: flex;
  justify-content: center;
  text-align: center;
  color: var(--main-color, var(--blue-7));
}

a.menu-item:hover .menu-item-text {
  text-decoration: underline;
  text-decoration-color: var(--blue-7);
}

.hero {
  background-color: var(--alt-bg-color, var(--blue-7));
  transition: background-color 0.2s;
  background-size: 350px;
  min-height: 370px;
}
@media (min-width: 576px) {
  .hero {
    margin-bottom: 3rem;
  }
}
.hero .row {
  min-height: 370px;
}
.hero h1 {
  font-size: 3.4rem;
  font-weight: 400;
  color: #ffffff;
  border-bottom: none;
  margin-bottom: 0;
}
.hero h1:last-child {
  margin-bottom: 0;
}
.hero h2 {
  font-size: 2.8rem;
  color: #FFF;
  margin-top: 0;
}
@media print {
  .hero {
    display: none;
  }
}

@media (min-width: 576px) {
  header:where(:not(:has(+ .hero))) {
    margin-bottom: 3rem;
  }
}

.hi-col {
  justify-content: end;
  display: flex;
}

@media screen and (max-width: 768px) {
  .hi-col {
    display: none;
  }
  .footer .col-md-6 {
    text-align: center;
  }
}
/* Style the header: fixed position (always stay at the top) */
.header-logo {
  max-width: 250px;
}

.header {
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
  background: var(--main-bg-color, #fff);
  transition: background-color 0.2s;
  box-shadow: 0px 4px 5px 0px var(--main-box-shadow-color, rgba(0, 0, 0, 0.2));
}

/* The progress container (grey background) */
.progress-container {
  width: 100%;
  height: 8px;
  background: #ccc;
}

/* The progress bar (scroll indicator) */
.progress-bar {
  height: 8px;
  background: #04AA6D;
  /*background: #FF426F;*/
  width: 0%;
}

.page-step {
  margin-top: 1em;
}

.rotateimg-toright {
  transform: rotate(3deg);
  border-radius: 20px;
}

.page-requests .r-cards {
  --gap: 12px;
  --cols: 1;
  --item-width: calc((100% / var(--cols, 1)) - (((var(--cols, 1) - 1) * var(--gap, 0)) / var(--cols, 1)));
  display: flex;
  justify-content: center;
  gap: var(--gap);
  flex-wrap: wrap;
}
.page-requests .modal .r-cards {
  --cols: 2;
}
@media (min-width: 768px) {
  .page-requests .r-cards {
    --cols: 2;
    --gap: 24px;
  }
  .page-requests .modal .r-cards {
    --cols: 2;
  }
}
@media (min-width: 992px) {
  .page-requests .r-cards {
    --cols: 3;
    --gap: 48px;
  }
  .page-requests .modal .r-cards {
    --cols: 2;
  }
}
.page-requests a.r-card {
  flex: 0 0 var(--item-width);
  background-color: var(--alt-bg-color, var(--blue-7));
  text-decoration: none;
  color: var(--main-color, #FFF);
  text-align: center;
  padding: 26px;
  border-radius: 20px;
  transition: background-color 0.2s;
}
.page-requests a.r-card h2 {
  color: var(--main-color, #FFF);
  transition: color 0.2s;
}
.page-requests a.r-card:hover {
  background-color: var(--pink);
  color: #FFF;
}
.page-requests a.r-card:hover h2 {
  color: #FFF;
}
.page-requests a.r-card:hover .rc-img .curved-corner {
  --corner-color: #FFF;
}
.page-requests .rc-img-outer {
  position: relative;
  aspect-ratio: 1/1;
  overflow: hidden;
  border-radius: 20px;
}
.page-requests .rc-img {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  aspect-ratio: 1/1;
  transition: transform 0.5s;
}
.page-requests .r-card:hover .rc-img {
  transform: scale(1.05);
}
.page-requests .rci-professional-services {
  background-image: url(../img/requests/professional-services.png?v=3.5);
}
.page-requests .rci-customer-experience {
  background-image: url(../img/requests/customer-experience.jpg?v=3.5);
}
.page-requests .rci-integrations {
  background-image: url(../img/requests/integrations.png?v=3.5);
}
.page-requests .rci-support {
  background-image: url(../img/requests/support.png?v=3.5);
  background-position: center;
}
.page-requests .rci-internal {
  background-image: url(../img/requests/internal.jpg?v=3.5);
}
.page-requests .rci-chargeable {
  background-image: url(../img/requests/chargeable.jpg?v=3.5);
}
.page-requests .rci-community {
  background-image: url(../img/requests/community.jpg?v=3.5);
}
.page-requests .rci-community-client {
  background-image: url(../img/requests/community-client.jpg?v=3.5);
}
.page-requests .rci-community-internal {
  background-image: url(../img/requests/community-internal.jpg?v=3.5);
}
.page-requests .rc-text {
  height: 120px;
  padding: 10px;
  text-decoration: none;
  display: grid;
  place-items: center left;
  text-align: left;
  height: 80px;
  padding: 10px 0 20px 0;
}
.page-requests .rc-text h2 {
  font-weight: 400;
  font-size: 1.5rem;
  text-align: center;
  width: 100%;
}
.page-requests .card-col {
  display: flex;
  align-items: stretch;
}
.page-requests .video-link,
.page-requests .video-link:hover,
.page-requests .video-link:visited,
.page-requests .video-link:active,
.page-requests .video-link:focus {
  color: #333;
  text-decoration: none;
}
.page-requests .video-card {
  width: 100%;
}
.page-requests .video-card .card-title {
  text-align: center;
}
.page-requests .video-container {
  position: relative;
}
.page-requests .play-video {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 40px;
  transform: translate(-50%, -50%);
  text-shadow: 0 0 30px #444, 0 0 40px #444, 0 0 55px #444, 0 0 75px #444;
  color: #FFF;
}
.page-requests .video-link:hover .play-video {
  text-shadow: 0 0 30px #000, 0 0 40px #000, 0 0 55px #000, 0 0 75px #000;
}
.page-requests .accordion-item {
  border: none;
}
.page-requests .accordion-item .accordion-header .accordion-button {
  background-color: var(--blue-1);
  color: #000;
}
.page-requests .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  background-color: var(--pink);
  color: #FFF;
}
.page-requests .accordion-button.collapsed::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: var(--bs-accordion-btn-icon-transform), rotate(180deg);
}
.page-requests .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFFFFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: var(--bs-accordion-btn-icon-transform);
}
@media screen and (max-width: 768px) {
  .page-requests .rc-img:before,
  .page-requests .rc-img:after {
    display: none;
  }
  .page-requests a.r-card {
    flex: 1 1 340px;
  }
}
.page-requests #email-preview * {
  box-sizing: unset;
}
.page-requests #contactForm label {
  color: #b1b1b1;
}

html body.page-requests {
  /* Stop Outlook resizing small text. */
  /* Stop Outlook from adding extra spacing to tables. */
  /* Use a better rendering method when resizing images in Outlook IE. */
  /* Prevent Windows 10 Mail from underlining links. Styles for underlined links should be inline. */
}
html body.page-requests #formsubmit {
  display: none !important;
}
html body.page-requests .se-placeholder,
html body.page-requests .sun-editor * {
  font-family: apercupro, sans-serif !important;
  font-size: 1rem !important;
}
html body.page-requests .sun-editor .se-dialog .se-dialog-footer button {
  background-color: #0d6efd;
  color: #fff;
  border-color: #0d6efd;
}
html body.page-requests .sun-editor .se-dialog .se-dialog-footer button:hover {
  background-color: #0b5ed7;
  color: #fff;
  border-color: #0a58ca;
}
html body.page-requests .sun-editor .se-dialog .se-dialog-inner .se-dialog-content label,
html body.page-requests .sun-editor .se-dialog .se-dialog-inner .se-dialog-header .se-modal-title,
html body.page-requests #contactForm .sun-editor .se-dialog label {
  font-weight: normal;
  color: #142c52;
}
html body.page-requests .sun-editor .se-dialog .se-dialog-inner .se-anchor-preview-form .se-link-preview {
  max-height: 30px;
}
html body.page-requests #email-preview strong {
  font-family: sans-serif;
  font-weight: bold;
}
html body.page-requests #email-preview {
  font-family: sans-serif;
  margin: 0 auto !important;
  padding: 0 !important;
  width: 100% !important;
}
html body.page-requests * {
  -ms-text-size-adjust: 100%;
}
html body.page-requests #email-preview table,
html body.page-requests #email-preview td {
  mso-table-lspace: 0pt !important;
  mso-table-rspace: 0pt !important;
}
html body.page-requests #email-preview img {
  -ms-interpolation-mode: bicubic;
}
html body.page-requests #email-preview a {
  text-decoration: none;
}
html body.page-requests #email-preview table,
html body.page-requests #email-preview tr,
html body.page-requests #email-preview td {
  border: none !important;
}
@media only screen and (min-width: 520px) {
  html body.page-requests #email-preview .u-row {
    width: 600px !important;
  }
  html body.page-requests #email-preview .u-row .u-col {
    vertical-align: top;
  }
  html body.page-requests #email-preview .u-row .u-col-33p33 {
    width: 100px !important;
  }
  html body.page-requests #email-preview .u-row .u-col-66p67 {
    width: 500px !important;
  }
  html body.page-requests #email-preview .u-row .u-col-100 {
    width: 600px !important;
  }
}
@media (max-width: 520px) {
  html body.page-requests #email-preview .u-row-container {
    max-width: 100% !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  html body.page-requests #email-preview .u-row .u-col {
    min-width: 320px !important;
    max-width: 100% !important;
    display: block !important;
  }
  html body.page-requests #email-preview .u-row {
    width: 100% !important;
  }
  html body.page-requests #email-preview .u-col {
    width: 100% !important;
  }
  html body.page-requests #email-preview .u-col > div {
    margin: 0 auto;
  }
}
html body.page-requests #email-preview {
  margin: 0;
  padding: 0;
}
html body.page-requests #email-preview table,
html body.page-requests #email-preview tr,
html body.page-requests #email-preview td {
  vertical-align: top;
  border-collapse: collapse;
  border: none;
}
html body.page-requests #email-preview p {
  margin: 0;
}
html body.page-requests #email-preview .ie-container table,
html body.page-requests #email-preview .mso-container table {
  table-layout: fixed;
}
html body.page-requests #email-preview * {
  line-height: inherit;
  border: none !important;
}
html body.page-requests #email-preview a[x-apple-data-detectors=true] {
  color: inherit !important;
  text-decoration: none !important;
}
@media (max-width: 480px) {
  html body.page-requests #email-preview .hide-mobile {
    max-height: 0px;
    overflow: hidden;
    display: none !important;
  }
}
html body.page-requests #email-preview table,
html body.page-requests #email-preview td {
  color: #000000;
}
html body.page-requests #email-preview #u_body a {
  color: #0000ee;
  text-decoration: underline;
}
@media (max-width: 480px) {
  html body.page-requests #email-preview #u_content_heading_1 .v-line-height {
    line-height: 300% !important;
  }
}
html body.page-requests .locations-map {
  max-width: 100%;
}
html body.page-requests .area-emea {
  background-color: red;
}
html body.page-requests .area-apac {
  background-color: green;
}
html body.page-requests .area-us {
  background-color: blue;
}
html body.page-requests input.form-control {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  background-color: var(--bs-body-bg);
  background-clip: padding-box;
  border: var(--bs-border-width) solid var(--bs-border-color);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: var(--bs-border-radius);
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
html body.page-requests input.form-control.is-invalid {
  border-color: var(--bs-form-invalid-border-color);
}
html body.page-requests form.w-100 input.form-control {
  width: 100%;
  max-width: none;
}
html body.page-requests .btn.btn-primary {
  --btn-color-1: var(--blue-7);
  padding: 0.75rem 5rem;
}

.navbar.bg-light {
  background-color: var(--main-bg-color, #FFF) !important;
  transition: background-color 0.2s;
}

.navbar:not(.navbar-container .navbar) {
  width: 100%;
  position: relative;
  display: flex;
  align-items: stretch;
  min-height: 104px;
}
.navbar:not(.navbar-container .navbar) .navbar-brand,
.navbar:not(.navbar-container .navbar) .container-fluid {
  display: flex;
  align-items: stretch;
}
.navbar:not(.navbar-container .navbar) .navbar-brand a {
  display: flex;
  align-items: center;
}
.navbar:not(.navbar-container .navbar) .navbar-brand a img {
  width: auto;
  height: auto;
  max-height: 100%;
  max-width: 200px;
}
@media (min-width: 992px) {
  .navbar:not(.navbar-container .navbar) .collapse {
    display: flex;
    align-items: center;
    /*.logged-in-msg {
    	margin-left: auto;
    	margin-bottom: 0;
    }*/
  }
}

.navbar-toggler {
  border: none;
  box-shadow: none;
}
.navbar-toggler:focus, .navbar-toggler:hover, .navbar-toggler:active {
  border: none;
  box-shadow: none;
}

.breadcrumb-trail {
  display: flex;
  flex-wrap: wrap;
  padding: 0 1rem 0.5rem;
  align-items: center;
}
@media print {
  .breadcrumb-trail {
    display: none;
  }
}
.breadcrumb-trail .breadcrumb {
  line-height: 1;
  margin: 0;
  padding: 0;
  display: inline-block;
}
.breadcrumb-trail .breadcrumb:has(+ .breadcrumb):after {
  font-family: "Font Awesome 6 Pro";
  content: "\f054";
  margin: 0 0.5rem;
}
.breadcrumb-trail .breadcrumb .fa + .text {
  margin-left: 0.5rem;
}
.breadcrumb-trail a.breadcrumb {
  text-decoration: none;
}
.breadcrumb-trail a.breadcrumb .text {
  text-decoration: underline;
}
.breadcrumb-trail .logged-in-msg {
  margin-bottom: 0;
  line-height: 1;
  width: 100%;
  display: block;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .breadcrumb-trail .logged-in-msg {
    margin-top: 0;
    margin-left: auto;
    margin-right: 1rem;
    margin-bottom: 0;
    display: inline-block;
    width: fit-content;
  }
}

@media (min-width: 992px) {
  .section-pricebook header .navbar-nav {
    display: none;
  }
}

@media screen and (prefers-color-scheme: dark) {
  html:not([data-bs-theme=light]) body {
    --main-bg-color: #1F1F1F;
    --main-color: #FFF;
    --main-box-shadow-color: #00000088;
    --tile-border-color: #2F2F2F;
    --primary-btn-color: var(--earcu-bright-pink);
    --alt-bg-color: #2F2F2F;
    --alt-bg-hover-color: #3F3F3F;
    --main-border-color: #2F2F2F;
    --page-surround-shadow-color: #000;
    --part-1-fill: #FFF;
    --part-2-fill: #FFF;
    --part-3-fill: #FFF;
    --part-4-fill: #FFF;
  }
  html:not([data-bs-theme=light]) body img.logo-colour,
  html:not([data-bs-theme=light]) body img.img-color {
    display: none;
  }
  html:not([data-bs-theme=light]) body img.logo-white,
  html:not([data-bs-theme=light]) body img.img-white {
    display: block;
  }
}
@media screen {
  html[data-bs-theme=dark] body {
    --main-bg-color: #1F1F1F;
    --main-color: #FFF;
    --main-box-shadow-color: #00000088;
    --tile-border-color: #2F2F2F;
    --primary-btn-color: var(--earcu-bright-pink);
    --alt-bg-color: #2F2F2F;
    --alt-bg-hover-color: #3F3F3F;
    --main-border-color: #2F2F2F;
    --page-surround-shadow-color: #000;
    --part-1-fill: #FFF;
    --part-2-fill: #FFF;
    --part-3-fill: #FFF;
    --part-4-fill: #FFF;
  }
  html[data-bs-theme=dark] body img.logo-colour,
  html[data-bs-theme=dark] body img.img-color {
    display: none;
  }
  html[data-bs-theme=dark] body img.logo-white,
  html[data-bs-theme=dark] body img.img-white {
    display: block;
  }
}
.dark-mode-label {
  width: 56px;
  height: 28px;
  position: relative;
  display: inline-block;
}

.dark-mode-label input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: 0.4s;
  border-radius: 28px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  transition: 0.4s;
  border-radius: 50%;
}

input.no-transition + .slider,
input.no-transition + .slider:before {
  transition: none;
}

input:checked + .slider {
  background-color: #0d6efd;
}

input:checked + .slider:before {
  transform: translateX(28px);
}

.theme-toggler .bi {
  font-size: 1.5rem;
}

.theme-toggle {
  cursor: pointer;
}

.theme-toggle:hover {
  opacity: 0.8;
}

body.centred-content {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}