/*** Override Bootstrap colors */
/* stylelint-disable-next-line scss/no-global-function-names */
/* stylelint-disable-next-line selector-class-pattern */
.experience-layouts-comparisonComponent {
  margin: 80px auto;
  max-width: 1109px;
}
.experience-layouts-comparisonComponent .header-title {
  font-family: custom-heading-font, andrade-pro-fallback, sans-serif;
  font-style: italic;
  font-size: 90px;
  padding-left: 34px;
  letter-spacing: -6.74px;
  line-height: 80px;
}
.experience-layouts-comparisonComponent .header-section {
  padding-top: 55px;
  padding-bottom: 20px;
}

.header-right-section {
  justify-content: space-between;
}
.header-right-section picture {
  display: block;
  height: 82%;
  width: 93%;
  margin: auto;
}
.header-right-section picture img {
  display: flex;
  margin: auto;
  max-height: 100%;
}

.text-msg {
  font-family: custom-heading-font, andrade-pro-fallback, sans-serif;
  font-style: italic;
  font-size: 32px;
  letter-spacing: -0.5px;
  line-height: 32px;
  margin-top: 15px;
}

.comparison-component-wrapper {
  justify-content: flex-end;
}

.row-right-section {
  align-items: center;
}

.color-box {
  height: 18px;
  width: 18px;
  border-radius: 50%;
  margin: auto;
  display: inline-block;
}

.text-box {
  font-family: custom-heading-font, andrade-pro-fallback, sans-serif;
  font-size: 25px;
  letter-spacing: -0.39px;
  font-style: italic;
}

.comp-feature-text {
  font-family: custom-heading-font, andrade-pro-fallback, sans-serif;
  font-size: 25px;
  letter-spacing: -0.39px;
  font-style: italic;
}

/* stylelint-disable-next-line selector-class-pattern */
.experience-assets-compareRow .row-data {
  padding-top: 26px;
  padding-bottom: 26px;
}

@media only screen and (max-width: 768px) {
  .header-right-section picture {
    width: 101px;
    height: 107px;
  }
  .text-msg {
    font-size: 20px;
    letter-spacing: -0.31px;
    line-height: 26px;
  }
  .comp-feature-text {
    font-size: 20px;
  }
}
@media only screen and (max-width: 554px) {
  /* stylelint-disable-next-line selector-class-pattern */
  .experience-layouts-comparisonComponent .header-title {
    padding-left: 22px;
    margin-bottom: 65px;
    flex: 100%;
    max-width: 100%;
  }
  .header-right-section picture {
    width: 73px;
    height: 78px;
  }
}
.benefit-table {
  background-color: #e3f0f8;
}
.benefit-table th {
  width: 14.6%;
  min-width: 82px;
}
@media (max-width: 400px) {
  .benefit-table th {
    min-width: 65px;
  }
}
.benefit-table th:first-child {
  width: 36%;
  text-align: left;
  font-weight: 400;
  min-width: auto;
}
.benefit-table .table-header th {
  padding-top: 55px;
  padding-bottom: 20px;
  font-weight: 400;
}
.benefit-table .header-width {
  max-width: 360px;
}
.benefit-table th,
.benefit-table td {
  padding: 1.5rem 0;
}
.benefit-table .text-msg {
  font-weight: 400;
}
.benefit-table .header-title {
  padding-left: 0;
}
@media (min-width: 555px) {
  .benefit-table th .pl-4 {
    padding-left: 34px !important;
  }
}