/*
SCSS variables are information about icon's compiled state, stored under its original file name

.icon-home {
  width: $icon-home-width;
}

The large array-like variables contain all information about a single icon
$icon-home: x y offset_x offset_y width height total_width total_height image_path;

At the bottom of this section, we provide information about the spritesheet itself
$spritesheet: width height image $spritesheet-sprites;
*/
.promo-bar__wrapper {
  width: 100%;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto; }

@media (max-width: 1064px) {
  .promo-bar__wrapper {
    padding-left: 40px;
    padding-right: 40px; } }

.promo-bar {
  width: 100%;
  margin-bottom: 60px; }

.promo-bar__wrapper {
  width: 100%;
  display: table;
  height: 135px;
  background-color: #434954; }
  .promo-bar__wrapper::after {
    clear: both;
    content: "";
    display: table; }

.promo-bar__left, .promo-bar__right {
  display: table-cell;
  height: 135px;
  vertical-align: middle; }
  @media (max-width: 767px) {
    .promo-bar__left, .promo-bar__right {
      display: block;
      height: auto; } }

.promo-bar__left {
  width: 65%;
  padding-left: 165px;
  position: relative; }
  .promo-bar__left:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 125px;
    height: 135px;
    background: url("/sites/ridedesigns.com/themes/ridedesigns/images/ribbon.png") center no-repeat;
    border-right: 1px dashed #93989E; }
  @media (max-width: 767px) {
    .promo-bar__left {
      width: 100%;
      padding-left: 0;
      display: block;
      height: auto; }
      .promo-bar__left:before {
        width: 100%;
        position: relative;
        border: 0; } }

.promo-bar__right {
  width: 35%;
  position: relative;
  padding: 0 40px;
  border-left: 1px solid #FFF; }
  .promo-bar__right:before, .promo-bar__right:after {
    content: '';
    display: block;
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: #FFF;
    left: -6px; }
  .promo-bar__right:before {
    top: -6px; }
  .promo-bar__right:after {
    bottom: -6px; }
  @media (max-width: 767px) {
    .promo-bar__right {
      width: 100%;
      display: block;
      border: 0;
      padding: 0;
      margin-top: 50px;
      margin-bottom: 50px; }
      .promo-bar__right:before, .promo-bar__right:after {
        display: none; } }

.promo-bar__link {
  display: block;
  color: #FFF;
  margin-bottom: 10px;
  vertical-align: middle; }
  .promo-bar__link:last-child {
    margin-bottom: 0; }
  .promo-bar__link:after {
    content: '';
    display: inline-block;
    width: 26px;
    height: 8px;
    vertical-align: middle;
    background-image: url("/sites/ridedesigns.com/themes/ridedesigns/images/sprite.png");
    background-size: 158px 132px;
    background-position: -98px -76px;
    margin-left: 20px; }