/**
 * @file
 * Olivero specific CSS overrides.
 */
/* CSS Reset */
/*html,*/
/*body,*/
/*div,*/
/*span,*/
/*applet,*/
/*object,*/
/*iframe,*/
/*h1,*/
/*h2,*/
/*h3,*/
/*h4,*/
/*h5,*/
/*h6,*/
/*p,*/
/*blockquote,*/
/*pre,*/
/*a,*/
/*abbr,*/
/*acronym,*/
/*address,*/
/*big,*/
/*cite,*/
/*code,*/
/*del,*/
/*dfn,*/
/*em,*/
/*font,*/
/*img,*/
/*ins,*/
/*kbd,*/
/*q,*/
/*s,*/
/*samp,*/
/*small,*/
/*strike,*/
/*strong,*/
/*sub,*/
/*sup,*/
/*tt,*/
/*var,*/
/*b,*/
/*u,*/
/*i,*/
/*center,*/
/*dl,*/
/*dt,*/
/*dd,*/
/*ol,*/
/*ul,*/
/*li,*/
/*fieldset,*/
/*form,*/
/*label,*/
/*button,*/
/*legend,*/
/*table,*/
/*caption,*/
/*tbody,*/
/*tfoot,*/
/*thead,*/
/*tr,*/
/*th,*/
/*td {*/
/*  margin: 0;*/
/*  padding: 0;*/
/*  border: 0;*/
/*  outline: 0;*/
/*  font-size: 100%;*/
/*  vertical-align: baseline;*/
/*  background: transparent;*/
/*}*/
/*body {*/
/*  line-height: 1;*/
/*  font-family: "Roboto", Arial, Helvetica, sans-serif;*/
/*}*/
/*ol,*/
/*ul {*/
/*  list-style: none;*/
/*}*/
/*blockquote,*/
/*q {*/
/*  quotes: none;*/
/*}*/
/*:focus {*/
/*  outline: 0;*/
/*}*/
/*ins {*/
/*  text-decoration: none;*/
/*}*/
/*del {*/
/*  text-decoration: line-through;*/
/*}*/
/*table {*/
/*  border-collapse: collapse;*/
/*  border-spacing: 0;*/
/*}*/

/*p {*/
/*  margin: 0.5em 0 1em 0;*/
/*  margin-top: 0.5em;*/
/*  line-height: 1.5em;*/
/*  color: #565656;*/
/*}*/

/*h1 {*/
/*  font-size: 23.4px;*/
/*  font-weight: bold;*/
/*  text-align: center;*/
/*  margin: 0 0 1em;*/
/*}*/

.form-item,
.form-actions {
  margin-top: 0em;
  margin-bottom: 1em;
}

.form-item .field-prefix {
  min-width: 300px;
  display: inline-block;
}

.form-item input {
  width: 100%;
  height: 40px;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 0 10px;
  font-size: 1.1rem;
  line-height: 40px;
  border: 1px solid #eee;
  -webkit-appearance: none;
  outline: none;
}

#result {
  height: auto;
  text-align: center;
  padding: 1em 10px;
  font-size: 2rem;
}

input.form-submit:hover {
  color: #fff;
  border-color: #009ceb;
  background-color: #009ceb;
}

hr {
  clear: both;
  width: 100%;
  border: none;
  border-top: 2px solid #ccc;
  margin: 1em 0 0;
  padding: 0;
  display: inline-block;
}

.layout-container {
  background-color: #1e4b6d;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}
.layout-content {
  margin-left: auto;
  margin-right: auto;
  max-width: 1050px;
}

#page-wrapper {
  background-color: inherit;
  margin: 0 auto;
}

@media (min-width: 75rem) {
  [dir="ltr"] .main-content {
    margin: 0 auto;
  }
}
body.webform-share-page-body,
[dir] body.webform-share-page-body {
  padding: 0;
  background-color: #1e4b6d;
  color: #565656;
}
body.webform-share-page-body h1.page-title {
  color: #fff;
  margin: 0 auto;
  text-align: center;
}
body.webform-share-page-body div.webform-share-submission-form {
  background-color: #fff;
}

.webform-share-page-html #content {
  max-width: 1400px;
  margin: 0 auto;
}

form[id*="webform-submission-roi-calculator"] .button {
  border-radius: 30px;
  border: 1px solid #1e4b6d;
  background-color: #1e4b6d;
}

form[id*="webform-submission-roi-calculator"] .button:hover {
  border-color: #009ceb;
  background-color: #009ceb;
}

/* ROI FORM SPECIFIC CSS */

/* Layout - roi CONTAINER - Bootstrap 5 inspired */
body.webform-share-page-body
  .webform-share-submission-form
  form.webform-submission-form {
  padding-left: 15px;
  padding-right: 15px;
}

/* Layout - roi ROW - Bootstrap 5 inspired */
.roi-calc-form-row {
  --bs-roi-gutter-x: 30px;
  --bs-roi-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-left: calc(var(--bs-roi-gutter-x) * -0.5);
  margin-right: calc(var(--bs-roi-gutter-x) * -0.5);
}

.roi-calc-form-row > * {
  flex-shrink: 0;
  margin-top: var(--bs-roi-gutter-y);
  max-width: 100%;
  padding-left: calc(var(--bs-roi-gutter-x) * 0.5);
  padding-right: calc(var(--bs-roi-gutter-x) * 0.5);
  width: 100%;
}

/* Layout - roi COLUMN - Bootstrap 5 inspired */
div[id*="edit-container-right"],
div[id*="edit-container-left"] {
  flex: 0 0 auto;
  width: 50%;
  box-sizing: border-box;
}

form[id*="webform-submission-roi-calculator"] .messages-list {
  width: 100%;
}

form[id*="webform-submission-roi-calculator"] .form-item input {
  box-shadow: 0 0.125rem 0.125rem -0.125rem rgba(31, 27, 45, 0.08),
    0 0.25rem 0.75rem rgba(31, 27, 45, 0.08);
  border: none;
}

div[id*="edit-container-left"] .form-item input,
div[id*="edit-container-right"] .form-item input {
  width: 100%;
}

input[data-drupal-selector="edit-roi-result"] {
  height: 120px;
  width: 100%;
  text-align: center;
  color: #fff;
}

label {
  font-size: 20px;
  display: inline-block;
  margin-top: 0.5625rem;
  margin-bottom: 0.5625rem;
  cursor: pointer;
}

label span.webform-element-help {
  vertical-align: 3px;
}

label.roi-calc-title-legend {
  font-weight: 600;
}

.form-item.get-in-touch-title {
  font-size: 20px;
}

form[id*="webform-submission-roi-calculator"] .form-type-range output {
  font-weight: 700;
  font-size: 14px;
  color: #0075ff;
  border-bottom: 2px solid #0075ff;
  border-top: none;
  border-left: none;
  border-right: none;
  background: #fff;
}

.form-type-range {
  position: relative;
  min-width: 300px;
}

.form-type-range input {
  margin-left: 0;
  width: 100%;
  cursor: pointer;
  padding: 0 2% 35px;
  height: 80px;
}

form[id*="webform-submission-roi-calculator"] .form-type-range .field-suffix {
  float: left;
  position: relative;
  clear: left;
  width: 100%;
  margin: -25px 0% 0;
  pointer-events: none;
  height: auto;
  right: 0;
  z-index: 1;
  font-size: 12px;
  margin: -30px 0% 0;
}

form[id*="webform-submission-roi-calculator"]
  .form-type-range
  .field-suffix::before {
  content: "";
  border-bottom: 1px solid #0075ff;
  width: 96%;
  pointer-events: none;
  display: block;
  margin: -16px 2% 0;
  position: absolute;
  z-index: 0;
  /* Start - Rotate Text */
  margin: -30px 2% 0;
  /* End - Rotate Text */
}

form[id*="webform-submission-roi-calculator"] .ticks {
  display: flex;
}
form[id*="webform-submission-roi-calculator"]
  .form-type-range
  .field-suffix
  em {
  font-style: normal;
  text-align: center;
  flex: 1;
  /* Start - Rotate Text */
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  /* End - Rotate Text */
}

input[data-drupal-selector="edit-roi-result"] {
  text-align: center;
  padding: 1em 10px;
  font-size: 2rem;
  background: white !important;
  color: black !important;
}

@media screen and (max-width: 900px) {
  div[id*="edit-container-right"],
  div[id*="edit-container-left"] {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .webform-share-page-html .page-title {
    padding: 1rem 1rem 0 1rem;
  }

  form {
    padding: 1rem;
  }

  form[id*="webform-submission-roi-calculator"] .form-actions {
    justify-content: center;
  }
}

@media screen and (max-width: 768px) {
  form[id*="webform-submission-roi-calculator"] .button {
    flex: 1;
    justify-content: center;
    margin: 0;
  }
}

body.webform-share-page-body .webform-share-page-wrapper {
  padding: 100px 0;
}

body.webform-share-page-body .webform-share-page-wrapper .region-content {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  background: rgba(255, 255, 255, 0.9);
}

body.webform-share-page-body .webform-share-submission-form {
  min-width: 300px;
  max-width: 1000px;
  margin: 0 auto;
  padding-bottom: 70px;
}

body.webform-share-page-body h1.page-title {
  display: block;
  line-height: 1.2;
  padding-top: 70px;
  margin: 0 auto 2rem auto;
}

/* webform view */

.path-webform form.webform-submission-form {
  padding: 2rem;
  background: rgba(255, 255, 255, 0.9);
}

form[id*="webform-submission-roi-calculator"] .form-item-roi-average-additional-lines-per-declaration .field-suffix em {
  text-align: center;
  -webkit-transform: rotate(0deg) !important;
  -moz-transform: rotate(0deg) !important;
  -o-transform: rotate(0deg) !important;
  transform: rotate(0deg) !important;
}
