/* -------------- CALANDA -------------- */
/* -------------- OPEN SANS -------------- */
.m-comparator {
  font-family: var(--open-sans); }
  .m-comparator h2 {
    margin-bottom: 40px; }
  .m-comparator table {
    margin-bottom: 100px;
    width: 100%; }
    .m-comparator table tbody tr th {
      font-weight: normal;
      font-family: var(--open-sans-semi-bold);
      font-size: 1rem;
      line-height: 1.375rem; }
  .m-comparator .modal-dialog {
    margin: 10% auto;
    width: 95%;
    position: relative; }
    .m-comparator .modal-dialog .modal-content {
      border-radius: 0;
      border: none; }
    .m-comparator .modal-dialog table {
      margin-bottom: 0; }
    .m-comparator .modal-dialog .footer-product {
      padding: 1.5rem 0 3.75rem;
      font-size: 14px; }
      .m-comparator .modal-dialog .footer-product span {
        font-size: 1.1875rem;
        padding-right: 0.625rem; }
  .m-comparator #productCompMobile .product {
    border-bottom: solid 1px var(--gray-100); }
    .m-comparator #productCompMobile .product .productName {
      font-size: 1.125rem;
      line-height: 1.5rem;
      cursor: url("../images/Cursor-blue.png") 25 25, auto;
      position: relative;
      margin: 0;
      padding: 16px 0; }
      .m-comparator #productCompMobile .product .productName:after {
        content: "\e90a";
        font-family: 'Dynasol-Icons' !important;
        position: absolute;
        right: 20px;
        top: 16px;
        color: var(--gray-200);
        font-size: 5px; }
    .m-comparator #productCompMobile .product .product-content {
      display: none;
      transition: all 0.2s ease-in; }
      .m-comparator #productCompMobile .product .product-content table {
        margin-bottom: 24px; }
        .m-comparator #productCompMobile .product .product-content table tbody tr {
          border: none; }
          .m-comparator #productCompMobile .product .product-content table tbody tr th {
            width: 30%; }
      .m-comparator #productCompMobile .product .product-content .product-content-img {
        max-height: 220px;
        overflow: hidden;
        margin-bottom: 24px;
        text-align: center; }
      .m-comparator #productCompMobile .product .product-content .product-content-btn {
        margin-bottom: 24px;
        text-align: center; }
    .m-comparator #productCompMobile .product.open .productName {
      color: var(--primary-blue); }
      .m-comparator #productCompMobile .product.open .productName:after {
        transform: rotate(180deg);
        color: var(--gray-500); }
    .m-comparator #productCompMobile .product.open .product-content {
      display: block; }
  .m-comparator #productCompDesktop {
    word-break: break-word; }
    .m-comparator #productCompDesktop table tbody tr th,
    .m-comparator #productCompDesktop table tbody tr td {
      width: 25%; }
    .m-comparator #productCompDesktop table tbody tr td {
      text-align: center; }
    .m-comparator #productCompDesktop table tbody tr.imgTable, .m-comparator #productCompDesktop table tbody tr.titleTable {
      border: none; }
    .m-comparator #productCompDesktop table tbody tr.titleTable {
      font-family: var(--calanda-bold);
      font-size: 1.875rem;
      line-height: 2.375rem; }
    .m-comparator #productCompDesktop table tbody tr.imgTable {
      height: 170px; }
      .m-comparator #productCompDesktop table tbody tr.imgTable td {
        padding: 0 20px; }
  .m-comparator .docSpecs span {
    color: var(--light-green); }
  .m-comparator .docData span {
    color: var(--secondary-blue); }
  @media (min-width: 768px) {
    .m-comparator h2 {
      font-family: 3rem; }
    .m-comparator .modal-dialog .docSpecs {
      padding-right: 1.125rem; }
    .m-comparator .modal-dialog .docSpecs span,
    .m-comparator .modal-dialog .docData span {
      font-size: 3rem; }
    .m-comparator .modal-dialog .footer-product {
      padding: cal-rem(30px) 0 2.875rem;
      display: flex;
      justify-content: center; }
      .m-comparator .modal-dialog .footer-product p {
        padding: 0 1.25rem; }
      .m-comparator .modal-dialog .footer-product .docSpecs span,
      .m-comparator .modal-dialog .footer-product .docData span {
        font-size: 1.1875rem; } }

#wrapper .m-comparator .modal-dialog a:hover,
#wrapper .m-comparator .modal-dialog a:focus,
#wrapper .m-comparator .modal-dialog a:active {
  text-decoration: none; }