/**
 * Global variable definitions
 *
 * @category  design
 * @package   spxus_default
 */
/**
 * Breakpoint mixin
 *
 * @category  design
 * @package   spxus_default
 */
/*
// ----------------------------------------------
// Usage example:
// For IE set $mq-support to false.
// Set the fixed value.
// Then use mixins to test whether styles should be applied.
// ----------------------------------------------

$mq-support: false;
$mq-fixed-value: 1024;

// Renders at fixed value
@include bp (min-width, 300px) {
    div { color:#000; }
}

// Doesn't render without MQ support
@include bp (min-width, 1200px) {
    div { color:#FFF; }
}

// Doesn't render without MQ support
@include bp (max-width, 300px) {
	div { color:#444; }
}

// Renders at fixed value
@include bp (max-width, 1200px) {
    div { color:#888; }
}

// ----------------------------------------------
*/
/**
 * Clearfix Mixin
 *
 * @category	design
 * @package		spxus_default
 */
/**
 * Image Replacement Mixin/Placeholder
 *
 * @category	design
 * @package		spxus_default
 */
/**
 * Toggle Content Mixins
 *
 * @category	design
 * @package		spxus_default
 */
/* -------------------------------------------- *
 * Tabs
 */
/* -------------------------------------------- *
 * Accordion
 */
.sidebar {
  position: relative; }

/**
 * typography mixins
 *
 * @category  design
 * @package   spxus_default
 */
/**
 * Visibility mixins & placeholders
 *
 * @category  design
 * @package   spxus_default
 */
/**
 * psuedo element icon mixin
 *
 * @category  design
 * @package   spxus_default
 */
/**
 * Cross out an entire element with a big "X" of specified color & width
 * Based on: http://stackoverflow.com/a/32218519/1583214
 *
 * @author    Scott Buchanan <sbuchanan@ebay.com>
 * @category  design
 * @package   spxus_default
 */
.silhouette-links.mobile .silhouette-link.bodysuits .icon, .silhouette-links.mobile .silhouette-link.bras .icon, .silhouette-links.mobile .silhouette-link.camis .icon, .silhouette-links.mobile .silhouette-link.gift-cards .icon, .silhouette-links.mobile .silhouette-link.hosiery .icon, .silhouette-links.mobile .silhouette-link.jeans .icon, .silhouette-links.mobile .silhouette-link.leggings .icon, .silhouette-links.mobile .silhouette-link.panties .icon, .silhouette-links.mobile .silhouette-link.sale .icon, .silhouette-links.mobile .silhouette-link.shorts .icon, .silhouette-links.mobile .silhouette-link.slips .icon {
  background: url("../../default/images/build/sprites.png") no-repeat; }

.silhouette-links.mobile .silhouette-link.bodysuits .icon, .silhouette-links.mobile .silhouette-link.bras .icon, .silhouette-links.mobile .silhouette-link.camis .icon, .silhouette-links.mobile .silhouette-link.gift-cards .icon, .silhouette-links.mobile .silhouette-link.hosiery .icon, .silhouette-links.mobile .silhouette-link.jeans .icon, .silhouette-links.mobile .silhouette-link.leggings .icon, .silhouette-links.mobile .silhouette-link.panties .icon, .silhouette-links.mobile .silhouette-link.sale .icon, .silhouette-links.mobile .silhouette-link.shorts .icon, .silhouette-links.mobile .silhouette-link.slips .icon {
  background: url("../../../default/images/home/build/sprites.png") no-repeat; }

.silhouette-links.mobile .silhouette-link.bodysuits .icon {
  width: 64px;
  height: 141px;
  background-position: 0 0; }

.silhouette-links.mobile .silhouette-link.bras .icon {
  width: 104px;
  height: 76px;
  background-position: 0 -141px; }

.silhouette-links.mobile .silhouette-link.camis .icon {
  width: 68px;
  height: 123px;
  background-position: 0 -217px; }

.silhouette-links.mobile .silhouette-link.gift-cards .icon {
  width: 119px;
  height: 77px;
  background-position: 0 -340px; }

.silhouette-links.mobile .silhouette-link.hosiery .icon {
  width: 69px;
  height: 179px;
  background-position: 0 -417px; }

.silhouette-links.mobile .silhouette-link.jeans .icon {
  width: 53px;
  height: 163px;
  background-position: 0 -596px; }

.silhouette-links.mobile .silhouette-link.leggings .icon {
  width: 65px;
  height: 160px;
  background-position: 0 -759px; }

.silhouette-links.mobile .silhouette-link.panties .icon {
  width: 97px;
  height: 64px;
  background-position: 0 -919px; }

.silhouette-links.mobile .silhouette-link.sale .icon {
  width: 120px;
  height: 125px;
  background-position: 0 -983px; }

.silhouette-links.mobile .silhouette-link.shorts .icon {
  width: 78px;
  height: 102px;
  background-position: 0 -1108px; }

.silhouette-links.mobile .silhouette-link.slips .icon {
  width: 59px;
  height: 157px;
  background-position: 0 -1210px; }

.accent--italic {
  font-size: 0.9375em;
  letter-spacing: 0.01em;
  line-height: 15px;
  font-style: italic;
  text-transform: none;
  font-weight: bold; }

.accent--underline {
  color: #cb121a;
  text-decoration: underline;
  font-size: 1.125em;
  line-height: 1.0em;
  letter-spacing: 0.04em;
  text-transform: none;
  font-family: BrandonGrotesque, Arial, Helvetica, sans-serif;
  font-style: italic;
  font-weight: bold; }
  .accent--underline.white {
    color: white; }
  .accent--underline + .bold {
    padding-top: 10px; }

.accent--small {
  font-size: 11px;
  font-style: italic;
  font-family: BrandonGrotesque, Arial, Helvetica, sans-serif; }

.bold {
  text-transform: uppercase;
  font-size: 1.75em;
  line-height: 1.0em;
  font-family: BrandonGrotesque, Arial, Helvetica, sans-serif;
  font-weight: bold; }
  .bold.white {
    color: white; }

.btn-cta {
  background-color: #CB121A;
  color: #FFF;
  display: inline-block;
  font-size: 0.75em;
  text-transform: uppercase;
  letter-spacing: .13em;
  line-height: 23px;
  padding: 0 11px;
  font-family: BrandonGrotesque, Arial, Helvetica, sans-serif;
  font-weight: bold; }

.warmWeatherBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/hero.jpg") no-repeat;
  background-size: cover; }
  .warmWeatherBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 75%; }
  .warmWeatherBlock > .content {
    position: absolute;
    text-align: center;
    top: 17.06827%;
    left: 3.76506%; }
  .warmWeatherBlock .content {
    width: 55%; }
    .warmWeatherBlock .content img {
      max-width: 100%;
      height: auto;
      margin-bottom: 36px; }
    @media only screen and (min-width: 767px) {
      .warmWeatherBlock .content .btn-cta {
        font-size: 1.25em;
        height: 2em;
        line-height: 2em; } }

.camiYouNeedBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/bucket-1.jpg") no-repeat;
  background-size: cover; }
  .camiYouNeedBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 84.96503%; }
  .camiYouNeedBlock > .content {
    position: absolute;
    text-align: center;
    top: 35.80247%;
    left: 9.79021%; }

.stayPutStraplessBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/bucket-2.jpg") no-repeat;
  background-size: cover; }
  .stayPutStraplessBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 84.96503%; }
  .stayPutStraplessBlock > .content {
    position: absolute;
    text-align: center;
    top: 39.50617%;
    left: 41.95804%; }

.powerCapriBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/bucket-3.jpg") no-repeat;
  background-size: cover; }
  .powerCapriBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 84.3949%; }
  .powerCapriBlock > .content {
    position: absolute;
    text-align: center;
    top: 32.45283%;
    left: 7.96178%; }

.destinationIdoBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/bucket-4.jpg") no-repeat;
  background-size: cover; }
  .destinationIdoBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 84.3949%; }
  .destinationIdoBlock > .content {
    position: absolute;
    text-align: center;
    top: 33.58491%;
    left: 9.87261%; }

.forDateNightBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/bucket-5.jpg") no-repeat;
  background-size: cover; }
  .forDateNightBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 92.65734%; }
  .forDateNightBlock > .content {
    position: absolute;
    text-align: center;
    top: 21.50943%;
    left: 6.99301%; }

.bestOfTheBestBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/blog-1.jpg") no-repeat;
  background-size: cover; }
  .bestOfTheBestBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 68.88412%; }
  .bestOfTheBestBlock > .content {
    position: absolute;
    text-align: center;
    top: 0%;
    left: 0%; }
  .bestOfTheBestBlock .content {
    width: 100%;
    height: 100%; }
    .bestOfTheBestBlock .content .border {
      position: absolute;
      left: 21px;
      right: 21px;
      bottom: 21px;
      top: 21px;
      border: solid 2px #cb121a;
      padding: 10%; }
      .bestOfTheBestBlock .content .border img {
        display: inline-block; }
  .bestOfTheBestBlock h3 {
    text-align: center; }

.row .col .asSeenInBlock {
  position: relative;
  display: block;
  background: url("../../images/home/assets/blog-2.jpg") no-repeat;
  background-size: cover; }
  .row .col .asSeenInBlock:before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 68.8172%; }
  .row .col .asSeenInBlock > .content {
    position: absolute;
    text-align: center;
    top: 35%;
    left: 3.87097%; }

.desktop {
  display: none; }

.mobile {
  display: block; }

.row .col {
  overflow: hidden;
  margin-bottom: 20px; }
  .row .col h3:not(.hideText) .bold {
    font-size: 1.5em; }
  .row .col > a:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #fff;
    z-index: 100;
    opacity: 0;
    zoom: 1;
    filter: alpha(opacity=0);
    transition: opacity .5s ease 0s; }
  .row .col > a:hover:after {
    opacity: .3;
    zoom: 1;
    filter: alpha(opacity=30); }
.row .camiYouNeedBlock {
  margin-bottom: 20px; }

@media only screen and (min-width: 600px) {
  .desktop {
    display: block; }

  .mobile {
    display: none; }

  .destinationIdoBlock .content {
    margin-top: -14%; }

  .row {
    clear: both;
    overflow: hidden;
    margin-bottom: 27px; }
    .row .col {
      float: left;
      position: relative; }
    .row.first-row .col {
      float: right;
      width: 29.79167%; }
      .row.first-row .col a {
        margin-bottom: 10px; }
      .row.first-row .col:first-child {
        width: 69.16667%;
        margin-left: 0px;
        float: left; }
    .row.second-row .col {
      width: 29.79167%;
      margin-left: 2.39583%; }
      .row.second-row .col:first-child {
        width: 32.70833%;
        margin-left: 0px; }
        .row.second-row .col:first-child + * {
          width: 32.70833%; }
    .row.third-row .col {
      float: right;
      width: 48.4375%; }
      .row.third-row .col a {
        margin-bottom: 10px; }
      .row.third-row .col:first-child {
        width: 48.4375%;
        margin-left: 0px;
        float: left; }
    .row.fourth-row .col {
      float: right;
      width: 29.09461%; }
      .row.fourth-row .col a {
        margin-bottom: 10px; }
      .row.fourth-row .col:first-child {
        width: 68.56562%;
        margin-left: 0px;
        float: left; } }
@media only screen and (min-width: 768px) {
  .destinationIdoBlock .content {
    margin-top: initial; } }
@media screen and (min-width: 600px) and (max-width: 1008px) {
  .row .col {
    font-size: 0.9em; }
    .row .col h3:not(.hideText) {
      font-size: 1.0em; } }
@media only screen and (min-width: 1008px) {
  .row .col .asSeenInBlock h3:not(.hideText) .bold {
    font-size: 2.0em; } }
.silhouette-links.desktop {
  border: solid black;
  border-width: 2px 0;
  margin-bottom: 30px;
  vertical-align: top;
  height: 130px; }
  .silhouette-links.desktop > * {
    vertical-align: top; }
  .silhouette-links.desktop .silhouette-label {
    display: inline-block;
    margin-top: 50px;
    text-transform: uppercase;
    font-family: BrandonGrotesque, Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    text-align: center; }
  .silhouette-links.desktop .silhouette-link {
    background: transparent url(../../images/home/shaping-silhouettes.png) no-repeat 0 0;
    display: inline-block;
    vertical-align: middle;
    height: 130px;
    width: 124px;
    font-size: 0px;
    margin-left: -42px;
    -ms-transform: scale(0.6);
        transform: scale(0.6); }
    .silhouette-links.desktop .silhouette-link.panties {
      background-position: -2px 0;
      margin-left: -12px; }
      html.no-touch .silhouette-links.desktop .silhouette-link.panties:hover {
        background-position: -2px -130px; }
    .silhouette-links.desktop .silhouette-link.shorts {
      background-position: -166px 0; }
      html.no-touch .silhouette-links.desktop .silhouette-link.shorts:hover {
        background-position: -166px -130px; }
    .silhouette-links.desktop .silhouette-link.camis {
      background-position: -328px 0; }
      html.no-touch .silhouette-links.desktop .silhouette-link.camis:hover {
        background-position: -328px -130px; }
    .silhouette-links.desktop .silhouette-link.slips {
      background-position: -492px 0; }
      html.no-touch .silhouette-links.desktop .silhouette-link.slips:hover {
        background-position: -492px -130px; }
    .silhouette-links.desktop .silhouette-link.bodysuits {
      background-position: -657px 0; }
      html.no-touch .silhouette-links.desktop .silhouette-link.bodysuits:hover {
        background-position: -657px -130px; }

@media only screen and (min-width: 768px) {
  .silhouette-links.desktop .silhouette-label {
    font-size: 18px;
    margin-top: 40px; }
  .silhouette-links.desktop .silhouette-link {
    margin-left: -10px;
    -ms-transform: scale(1);
        transform: scale(1); } }
@media only screen and (min-width: 1008px) {
  .silhouette-links.desktop .silhouette-link {
    margin-left: 48px; }
    .silhouette-links.desktop .silhouette-link.panties {
      margin-left: 0px; } }
.silhouette-links.mobile {
  text-align: left;
  font-size: 28px;
  font-family: BrandonGrotesque, Arial, Helvetica, sans-serif; }
  .silhouette-links.mobile a {
    color: #58595b; }
  .silhouette-links.mobile .silhouette-link {
    width: 31.25%;
    display: inline-block;
    text-align: center;
    -ms-transform: scale(0.75);
        transform: scale(0.75); }
    .silhouette-links.mobile .silhouette-link .icon {
      display: block;
      margin: 1.0em auto; }

.std .slick-slider ul {
  text-align: center; }
  .std .slick-slider ul li {
    list-style: none;
    position: relative;
    display: inline;
    margin-left: 0; }
    .std .slick-slider ul li button {
      font-size: 0;
      line-height: 0;
      width: 20px;
      height: 20px;
      padding: 5px;
      cursor: pointer;
      color: transparent;
      border: 0;
      outline: none;
      background: transparent; }
      .std .slick-slider ul li button:before {
        font-size: 36px;
        content: '\2022';
        color: black;
        -webkit-font-smoothing: antialiased; }
    .std .slick-slider ul li.slick-active button:before {
      color: #cb121a; }

.col .olapic .olapic-slider-wrapper {
  width: auto;
  margin: 0 32px; }
.col .olapic .olapic-nav-prev {
  left: 0px; }
.col .olapic .olapic-nav-next {
  right: 0px;
  left: initial; }

.spankTheDayTitle {
  background: transparent url("../../images/spanx_the_day.gif") center no-repeat;
  font-size: 0;
  background-size: 100%;
  display: inline-block;
  height: 30px;
  margin: 0 auto 15px;
  width: 202.5px; }

.center {
  text-align: center; }

.line-through {
  text-align: center;
  margin-bottom: 20px;
  position: relative;
  font-family: BrandonGrotesque, Arial, Helvetica, sans-serif; }
  .line-through > span {
    background: white;
    padding: 0 20px;
    z-index: 10;
    font-size: 1.5em;
    font-weight: bold; }
    .line-through > span .italic {
      font-style: italic;
      font-size: 1.125em;
      font-weight: normal;
      text-transform: initial; }
  @media (max-width: 599px) {
    .line-through > span {
      display: inline-block;
      width: 60%; } }
  .line-through:after {
    background: #000;
    content: "";
    position: absolute;
    height: 2px;
    width: 100%;
    left: 0;
    line-height: 0px;
    top: 50%;
    margin-top: -1px;
    z-index: -1; }

/*# sourceMappingURL=home.css.map */