@import "hexagon.css.less";

.itsf-logo-38 {
  display: inline-block;

  .first-hexagon {
    .hexagon(10px, #58585A);
    display: inline-block;
  }

  .second-hexagon {
    .hexagon(10px, #81C5E2);
    display: inline-block;
    margin-left: -1px;
    width: 17px;
  }

  .third-hexagon {
    .hexagon(10px, #A5C85F);
    margin-left: 10px;
    margin-top: -3px;
  }
}

.itsf-logo-25 {
  display: inline-block;

  .first-hexagon {
    .hexagon(6px, #58585A);
    display: inline-block;
  }

  .second-hexagon {
    .hexagon(6px, #81C5E2);
    display: inline-block;
    margin-left: -3px;
  }

  .third-hexagon {
    .hexagon(6px, #A5C85F);
    margin-left: 6px;
    margin-top: -4px;
  }
}

.itsf-logo-50 {
  display: inline-block;

  .first-hexagon {
    .hexagon(12px, #58585A);
    display: inline-block;
  }

  .second-hexagon {
    .hexagon(12px, #81C5E2);
    display: inline-block;
    margin-left: -1px;
  }

  .third-hexagon {
    .hexagon(12px, #A5C85F);
    margin-left: 12px;
    margin-top: -3px;
  }
}

.itsf-logo-52 {
  display: inline-block;

  .first-hexagon {
    .hexagon(14px, #58585A);
    display: inline-block;
  }

  .second-hexagon {
    .hexagon(14px, #81C5E2);
    display: inline-block;
    margin-left: -1px;
  }

  .third-hexagon {
    .hexagon(14px, #A5C85F);
    margin-left: 13px;
    margin-top: -2px;
  }
}

.itsf-logo-128 {
  display: inline-block;

  .first-hexagon {
    .hexagon(34px, #58585A);
    display: inline-block;
  }

  .second-hexagon {
    .hexagon(34px, #81C5E2);
    display: inline-block;
    margin-left: 1px;
  }

  .third-hexagon {
    .hexagon(34px, #A5C85F);
    margin-left: 32px;
    margin-top: -1px;
  }
}