/* 
 * Import Compass
 */
/* ==========================================================================
   Badge List
   ---
   Core Button Component used in APEX 5 Builder
   ========================================================================== */
/* line 18, ../../scss/core/BadgeList.scss */
.a-BadgeList {
  padding: 0;
  margin: 0;
  list-style: none;
  overflow: hidden;
}

/* line 24, ../../scss/core/BadgeList.scss */
.a-BadgeList-item {
  display: block;
  position: relative;
  padding: 16px 16px 32px 16px;
}
/* line 28, ../../scss/core/BadgeList.scss */
.a-BadgeList-item:hover .a-BadgeList-value {
  background-color: #F8F8F8;
}

/* line 32, ../../scss/core/BadgeList.scss */
.a-BadgeList-label {
  display: block;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 1px;
  right: 1px;
  font-size: 12px;
  line-height: 1.333;
  padding: 0 0 12px 0;
  background-image: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 15%);
}

/* line 44, ../../scss/core/BadgeList.scss */
.a-Side .a-BadgeList-label {
  background-image: linear-gradient(rgba(244, 244, 244, 0) 0%, rgba(244, 244, 244, 0.75) 15%);
}

/* line 47, ../../scss/core/BadgeList.scss */
.a-BadgeList-value {
  display: block;
  text-align: center;
  border: 1px solid;
  border-radius: 100%;
  margin: 0 auto;
  font-weight: 200;
  transition: background-color .2s;
}
/* line 55, ../../scss/core/BadgeList.scss */
.a-BadgeList-value a {
  display: block;
  line-height: 62px;
  border-radius: 100%;
  text-decoration: none;
  box-shadow: 0 0 0 1px #F0F0F0 inset;
  transition: box-shadow .1s, color .1s, background-color .3s;
}
/* line 63, ../../scss/core/BadgeList.scss */
.a-BadgeList-value a:hover {
  text-decoration: none;
}

/* line 68, ../../scss/core/BadgeList.scss */
.a-BadgeList-value > a {
  margin-top: -1px;
  margin-left: -1px;
}

/* ==========================================================================
   BadgeList Sizes
   ========================================================================== */
/* 
 * Mixin
 */
/* 
 * Default Size
 */
/* line 90, ../../scss/core/BadgeList.scss */
.a-BadgeList-value,
.a-BadgeList-value > a {
  width: 48px;
  height: 48px;
  line-height: 48px;
  font-size: 16px;
}

/* 
 * Multiple Sizes
 */
/* line 112, ../../scss/core/BadgeList.scss */
.a-BadgeList--small .a-BadgeList-value,
.a-BadgeList--small .a-BadgeList-value > a {
  width: 32px;
  height: 32px;
  line-height: 32px;
  font-size: 12px;
}

/* line 112, ../../scss/core/BadgeList.scss */
.a-BadgeList--medium .a-BadgeList-value,
.a-BadgeList--medium .a-BadgeList-value > a {
  width: 48px;
  height: 48px;
  line-height: 48px;
  font-size: 16px;
}

/* line 112, ../../scss/core/BadgeList.scss */
.a-BadgeList--large .a-BadgeList-value,
.a-BadgeList--large .a-BadgeList-value > a {
  width: 64px;
  height: 64px;
  line-height: 64px;
  font-size: 24px;
}

/* line 112, ../../scss/core/BadgeList.scss */
.a-BadgeList--xlarge .a-BadgeList-value,
.a-BadgeList--xlarge .a-BadgeList-value > a {
  width: 96px;
  height: 96px;
  line-height: 96px;
  font-size: 30px;
}

/* line 112, ../../scss/core/BadgeList.scss */
.a-BadgeList--xxlarge .a-BadgeList-value,
.a-BadgeList--xxlarge .a-BadgeList-value > a {
  width: 128px;
  height: 128px;
  line-height: 128px;
  font-size: 36px;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media only screen and (max-width: 1280px) {
  /* line 131, ../../scss/core/BadgeList.scss */
  .a-BadgeList--responsive.a-BadgeList--xxlarge .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--xxlarge .a-BadgeList-value > a, .a-BadgeList--responsive.a-BadgeList--xlarge .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--xlarge .a-BadgeList-value > a {
    width: 64px;
    height: 64px;
    line-height: 64px;
    font-size: 24px;
  }
}
@media only screen and (max-width: 1024px) {
  /* line 141, ../../scss/core/BadgeList.scss */
  .a-BadgeList--responsive.a-BadgeList--xxlarge .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--xxlarge .a-BadgeList-value > a, .a-BadgeList--responsive.a-BadgeList--xlarge .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--xlarge .a-BadgeList-value > a, .a-BadgeList--responsive.a-BadgeList--large .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--large .a-BadgeList-value > a {
    width: 48px;
    height: 48px;
    line-height: 48px;
    font-size: 16px;
  }
}
@media only screen and (max-width: 800px) {
  /* line 152, ../../scss/core/BadgeList.scss */
  .a-BadgeList--responsive.a-BadgeList--xxlarge .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--xxlarge .a-BadgeList-value > a, .a-BadgeList--responsive.a-BadgeList--xlarge .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--xlarge .a-BadgeList-value > a, .a-BadgeList--responsive.a-BadgeList--large .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--large .a-BadgeList-value > a, .a-BadgeList--responsive.a-BadgeList--medium .a-BadgeList-value,
  .a-BadgeList--responsive.a-BadgeList--medium .a-BadgeList-value > a {
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: 12px;
  }
}

/* ==========================================================================
   Layout Modifiers
   ========================================================================== */
/* line 167, ../../scss/core/BadgeList.scss */
.a-BadgeList--float .a-BadgeList-item:after,
.a-BadgeList--flex .a-BadgeList-item:after,
.a-BadgeList--cols .a-BadgeList-item:after,
.a-BadgeList--fixed .a-BadgeList-item:after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  right: -1px;
  background: #F8F8F8;
}
/* line 176, ../../scss/core/BadgeList.scss */
.a-BadgeList--float .a-BadgeList-item:before,
.a-BadgeList--flex .a-BadgeList-item:before,
.a-BadgeList--cols .a-BadgeList-item:before,
.a-BadgeList--fixed .a-BadgeList-item:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  bottom: -1px;
  background: #F8F8F8;
}

/* line 187, ../../scss/core/BadgeList.scss */
.a-BadgeList--bottomBorder {
  border-bottom: 1px solid #F8F8F8;
}

/* ==========================================================================
   Floated
   ========================================================================== */
/* line 195, ../../scss/core/BadgeList.scss */
.a-BadgeList--float .a-BadgeList-item {
  float: left;
}

/* ==========================================================================
   Stacked
   ========================================================================== */
/* line 204, ../../scss/core/BadgeList.scss */
.a-BadgeList--stacked .a-BadgeList-item:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  bottom: -1px;
  background: #F8F8F8;
}

/* ==========================================================================
   Flexed
   ========================================================================== */
/* line 218, ../../scss/core/BadgeList.scss */
.a-BadgeList--flex {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-align-content: stretch;
      -ms-flex-line-pack: stretch;
          align-content: stretch;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}
/* line 223, ../../scss/core/BadgeList.scss */
.a-BadgeList--flex .a-BadgeList-item {
  -webkit-flex: 1, 0, auto;
      -ms-flex: 1, 0, auto;
          flex: 1, 0, auto;
}

@supports not ((-webkit-flex-wrap: wrap) or (-ms-flex-wrap: wrap) or (flex-wrap: wrap)) {
  /* line 230, ../../scss/core/BadgeList.scss */
  .a-BadgeList.a-BadgeList--flex {
    display: inline;
  }

  /* line 233, ../../scss/core/BadgeList.scss */
  .a-BadgeList--flex .a-BadgeList-item {
    display: block;
  }
}
/* ==========================================================================
   Columns
   ========================================================================== */
/* line 243, ../../scss/core/BadgeList.scss */
.a-BadgeList--cols .a-BadgeList-item {
  float: left;
  width: 50%;
}

/* line 249, ../../scss/core/BadgeList.scss */
.a-BadgeList--3col .a-BadgeList-item {
  width: 33.33%;
}

/* line 254, ../../scss/core/BadgeList.scss */
.a-BadgeList--4col .a-BadgeList-item {
  width: 25%;
}

/* line 260, ../../scss/core/BadgeList.scss */
.a-BadgeList--5col .a-BadgeList-item {
  width: 20%;
}

/* ==========================================================================
   Fluid
   ========================================================================== */
/* line 268, ../../scss/core/BadgeList.scss */
.a-BadgeList--fixed {
  display: table;
  table-layout: fixed;
  width: 100%;
}
/* line 272, ../../scss/core/BadgeList.scss */
.a-BadgeList--fixed .a-BadgeList-item {
  display: table-cell;
}

/* ==========================================================================
   Positioned on Side of Page
   ========================================================================== */
/* line 282, ../../scss/core/BadgeList.scss */
.a-Side .a-BadgeList .a-BadgeList-item:after,
.a-Side .a-BadgeList .a-BadgeList-item:before {
  background-color: #E0E0E0;
}
/* line 287, ../../scss/core/BadgeList.scss */
.a-Side .a-BadgeList--bottomBorder {
  border-bottom-color: #E0E0E0;
}
