/*
 * KXIT Button base styles.
 *
 * Ported from the legacy my-extension/styles/style.min.css (button rules only).
 * Targets the inner element rendered by the kxit/kx-button D5 module and the
 * D4 backward-compat shortcode handler — both emit:
 *   <div class="kxit-button-layout kxit-button-style-N">…</div>
 * or, when linked:
 *   <a   class="kxit-button-layout kxit-button-style-N" href="…">…</a>
 */

.kxit-button-style-1 {
  background: #fff;
  color: #000;
  border: 1px solid #000;
}
.kxit-button-style-2 {
  background: #1b365d;
  color: #fff;
}
.kxit-button-style-3 {
  background: #fff;
  color: #000;
}

.kxit-button-style-1:after,
.kxit-button-style-3:after {
  content: " ";
  float: right;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  border: solid #000;
  border-width: 0 4px 4px 0;
  border-radius: 2px;
  padding: 5px;
  margin: 4px;
}

.kxit-button-layout:hover:after,
.kxit-button-style-2:after {
  content: " ";
  float: right;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  border: solid #fff;
  border-width: 0 4px 4px 0;
  border-radius: 2px;
  padding: 5px;
  margin: 4px;
}

.kxit-button-layout:hover {
  background: #a6093d;
  color: #fff;
  border: none;
}

@media only screen and (min-width: 981px) {
  .kxit-button-layout {
    max-width: 366px;
    width: auto;
    height: 50px;
    padding: 13px;
    text-align: left;
    display: block;
    font-family: HelveticaNeueLTPro-Bd;
    text-transform: uppercase;
    letter-spacing: 0;
  }
}

@media only screen and (max-width: 980px) {
  .kxit-button-layout {
    max-width: 314px;
    width: auto;
    height: 50px;
    padding: 13px;
    text-align: left;
    display: block;
    font-family: HelveticaNeueLTPro-Bd;
    text-transform: uppercase;
    letter-spacing: 0;
  }
}
