* {
  margin: 0;
  box-sizing: border-box; }

HTML, BODY {
  height: 100%; }

BODY {
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  color: black;
  font-size: 14px;
  height: 100%;
  width: 100%;
  line-height: 1; }

:focus {
  outline: 0; }

IMG {
  border: 0; }

.banner-body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  max-width: 240px;
  max-height: 400px; }
  .banner-body H3 {
    color: #1fabe6;
    font-size: 120%;
    margin: 0.5em; }

#slider {
  width: 100%;
  height: calc(100% - 2.4em);
  overflow: hidden;
  position: relative; }
  #slider .banner-frame {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    display: none;
    border: 1px solid #f0f0f0;
    padding: 0.3em 0.5em; }
    #slider .banner-frame.active {
      display: block; }
    #slider .banner-frame .product-image {
      display: block;
      width: 100%;
      height: calc(100% - 6.8em);
      backgound-color: white;
      background-repeat: no-repeat;
      background-position: top center;
      background-size: cover; }
    #slider .banner-frame .product-feedback {
      margin-top: 0.3em; }
      #slider .banner-frame .product-feedback SPAN {
        display: inline-block;
        vertical-align: middle; }
        #slider .banner-frame .product-feedback SPAN.star {
          width: 1em;
          height: 1em;
          background: transparent url('data:image/svg+xml;utf8,<svg fill="none" height="24" stroke="rgb(150, 150, 150)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>') center center/contain; }
          #slider .banner-frame .product-feedback SPAN.star.active {
            color: #1fabe6;
            background-image: url('data:image/svg+xml;utf8,<svg fill="rgb(31, 171, 230)" height="24" stroke="rgb(31, 171, 230)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>'); }
        #slider .banner-frame .product-feedback SPAN.feedback-cnt {
          color: #6a6a6a;
          margin-left: 1em; }
    #slider .banner-frame .product-name {
      display: block;
      height: 1.1em;
      color: black;
      text-decoration: none;
      font-size: 130%;
      font-weight: bold;
      margin: 0.3em 0;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
    #slider .banner-frame .product-options {
      font-size: 80%;
      color: #8d8d8d;
      display: block;
      overflow: hidden;
      height: 1em;
      margin-bottom: 0.3em; }
    #slider .banner-frame .product-price {
      color: #8d8d8d;
      text-align: right; }
      #slider .banner-frame .product-price SPAN {
        color: black;
        font-size: 200%; }
    #slider .banner-frame .product-orders {
      background-color: #3255a4;
      color: white;
      border-radius: 50%;
      position: absolute;
      top: 0.3em;
      left: 0.3em;
      width: 6.5em;
      height: 6.5em;
      text-align: center;
      font-size: 60%;
      padding-top: 1.6em;
      transform: rotate(-10deg); }
      #slider .banner-frame .product-orders SPAN {
        display: block;
        font-weight: bold;
        font-size: 200%; }

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