Add FontAwesome less

Add FontAwesome less

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/maat8/mille-etangs.git/'


Increased the size differene between different titles.

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/hobarrera/www.git/'


fix(client): invalid slash in font path

fix(client): invalid slash in font path

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/camunda/camunda-bpm-workbench.git/'


Fix menu toggler box shadow

Fix menu toggler box shadow

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/iluzyanin/german-traffic.git/'


fix expandable button on mobile

fix expandable button on mobile

@mega-header-height: 46px;

// custom styles for the MEGA expandables
.mega-expand {
    //margin: 0;
    background: #fff;

    .expandable-header {
        .webfont-regular();
        padding: 40px 0 20px 0;
    }

    .expandable-mainhead {
      background: @gray-10;
      border-bottom: 1px solid @gray-50;
      padding: 4px 0;
      cursor: pointer;
      cursor: hand;
    }

    // vertically center the icons in the expandable header
    .lt-icon:before,
    .lt-icon-structure {
      top: 20%;
    }

    .lt-icon-structure:before {
      line-height: 1.4em;
      color: @gray-10;
    }

    .expandable-subhead {
      background: #fff;
      padding-top: 20px;
    }

    .expandable-heading {
      .webfont-regular();
      font-size: 1.625em;
      margin: 0;
      line-height: @mega-header-height;
      position: relative;
      margin-left: 1.4em; // accomodate for absolute positioned icons
    }

    .list-heading {
      .webfont-demi();
      font-size: 1em;
    }

    &:hover,
    &:active {
        background: #fff;
    }

    .expandable-hidden {
      display: none;
    }

    .expandable-content {
      border-top: 1px solid  @gray-20;
      padding-top: 40px;
    }

    .expandable-text {
      margin-right: 6px;
    }
}

@media (max-width: 600px) {

  .mega-expand {
    .expandable-heading {
      margin-left: 0;
      font-size: 1.375em;
    }
  }

  // hide icons in expandable headers on mobile
  .expandable-title {
    .lt-icon:before,
    .lt-icon-structure {
      display: none;
    }
  }
}

/* expandable header layout */
.expandable-title {
  .grid_column(8);
}

.expandable-link {
  .grid_column(4);
  text-align: right;
  height: @mega-header-height;
  line-height: @mega-header-height;
}

@media (min-width: 600px) {
  .expandable-link {
    padding-right: 1.4em; // accomodate for the abosolute positioned + sign
  }
}

.expandable-text {
  font-size: 1.142857143em; //overwrite cf expandable style
}

.expandable-button {
  position: relative;
}

.expandable-button:after {
  .cf-icon;
  display: block;
  position: absolute;
  top: 18%;
  right: -1em;
  padding-left: 1em;
  width: 1em;
  content: "\e109";
  border-bottom: none;
}

@media (max-width: 600px) {
  .expandable-button:after {
    right: 0;
    left: -1.4em;
  }
}

.open .expandable-button:after {
  content: "\e111";
}

.expandable-subsection {
  border-top: 1px solid  @gray-20;
  padding: 1.375em 0;

  .expandable-section-content {
    font-size: .875em;
  }
}

.expandable-subsection-title {
  border-top: 1px solid  @gray-20;
  padding-top: 20px;
  margin-bottom: 10px;
}

// internal collapse link

.expand-close {
  .webfont-regular();
  display: block;
  width: 100%;
  text-align: right;
  margin-top: 10px;
}

.expand-close-link:link,
.expand-close-link:visited {
  color: @pacific;
  border-bottom: 1px dotted @pacific;
}

.expand-close-link:hover,
.expand-close-link:active,
.expand-close-link:focus {
  border-bottom: 1px solid @pacific-50;
  color: @pacific-50;
}

.expand-close-link {
  display: inline-block;
  position: relative;
  margin-right: 1.25em;
}

.expand-close-link:after {
  .cf-icon;
  display: block;
  position: absolute;
  top: 18%;
  right: -1em;
  padding-left: .25em;
  width: 1em;
  content: "\e111";
  border-bottom: none;
}

// hide the learn more/collapse link below 1100px
@media (max-width: 1100px) {
  .mega-expand {
    .expandable-text {
      .visuallyhidden;
    }

    .expandable-link {
      line-height: 2em;
    }
  }

  .expandable-title {
    .grid_column(10);
  }

  .expandable-link {
    .grid_column(2);
  }
}

@media (max-width: 720px) {
  .expandable-subhead {
    .sub-demi {
      color: @gray;
    }
  }
}

@mega-header-height: 46px;

// custom styles for the MEGA expandables
.mega-expand {
    //margin: 0;
    background: #fff;

    .expandable-header {
        .webfont-regular();
        padding: 40px 0 20px 0;
    }

    .expandable-mainhead {
      background: @gray-10;
      border-bottom: 1px solid @gray-50;
      padding: 4px 0;
      cursor: pointer;
      cursor: hand;
    }

    // vertically center the icons in the expandable header
    .lt-icon:before,
    .lt-icon-structure {
      top: 20%;
    }

    .lt-icon-structure:before {
      line-height: 1.4em;
      color: @gray-10;
    }

    .expandable-subhead {
      background: #fff;
      padding-top: 20px;
    }

    .expandable-heading {
      .webfont-regular();
      font-size: 1.625em;
      margin: 0;
      line-height: @mega-header-height;
      position: relative;
      margin-left: 1.4em; // accomodate for absolute positioned icons
    }

    .list-heading {
      .webfont-demi();
      font-size: 1em;
    }

    &:hover,
    &:active {
        background: #fff;
    }

    .expandable-hidden {
      display: none;
    }

    .expandable-content {
      border-top: 1px solid  @gray-20;
      padding-top: 40px;
    }

    .expandable-text {
      margin-right: 6px;
    }
}

@media (max-width: 600px) {

  .mega-expand {
    .expandable-heading {
      margin-left: 0;
      font-size: 1.375em;
    }
  }

  // hide icons in expandable headers on mobile
  .expandable-title {
    .lt-icon:before,
    .lt-icon-structure {
      display: none;
    }
  }
}

/* expandable header layout */
.expandable-title {
  .grid_column(9);
}

.expandable-link {
  .grid_column(3);
  text-align: right;
  padding-right: 1.4em; // accomodate for the abosolute positioned + sign
  height: @mega-header-height;
  line-height: @mega-header-height;
}

.expandable-text {
  font-size: 1.142857143em; //overwrite cf expandable style
}

.expandable-button {
  position: relative;
}

.expandable-button:after {
  .cf-icon;
  display: block;
  position: absolute;
  top: 18%;
  right: -1em;
  padding-left: .25em;
  width: 1em;
  content: "\e109";
  border-bottom: none;
}

.open .expandable-button:after {
  content: "\e111";
}

.expandable-subsection {
  border-top: 1px solid  @gray-20;
  padding: 1.375em 0;

  .expandable-section-content {
    font-size: .875em;
  }
}

.expandable-subsection-title {
  border-top: 1px solid  @gray-20;
  padding-top: 20px;
  margin-bottom: 10px;
}

// internal collapse link

.expand-close {
  .webfont-regular();
  display: block;
  width: 100%;
  text-align: right;
  margin-top: 10px;
}

.expand-close-link:link,
.expand-close-link:visited {
  color: @pacific;
  border-bottom: 1px dotted @pacific;
}

.expand-close-link:hover,
.expand-close-link:active,
.expand-close-link:focus {
  border-bottom: 1px solid @pacific-50;
  color: @pacific-50;
}

.expand-close-link {
  display: inline-block;
  position: relative;
  margin-right: 1.25em;
}

.expand-close-link:after {
  .cf-icon;
  display: block;
  position: absolute;
  top: 18%;
  right: -1em;
  padding-left: .25em;
  width: 1em;
  content: "\e111";
  border-bottom: none;
}

// hide the learn more/collapse link below 1100px
@media (max-width: 1100px) {
  .mega-expand {
    .expandable-text {
      .visuallyhidden;
    }

    .expandable-link {
      line-height: 2em;
    }
  }

  .expandable-title {
    .grid_column(10);
  }

  .expandable-link {
    .grid_column(2);
  }
}

@media (max-width: 720px) {
  .expandable-subhead {
    .sub-demi {
      color: @gray;
    }
  }
}