/*----------------------------------------------------------------------------*\
  Headhesive Specific Styles
/*----------------------------------------------------------------------------*/

/**
 * Headhesive element clone
 * > `clone` class for the cloned element:
 *
 * @example
 * var options = {
 *   classes {
 *     clone: 'banner--clone';
 *   }
 * }
 */

header.banner{display: none}
.banner--clone {

  /* Required styles */
  position: fixed;
  top: 0;
  left: 0;
  display: initial!important;
  /* Additional styles */
  background: #fff none repeat scroll 0 0;
    border-bottom: 1px solid #ccc;
    box-shadow: 0 5px 5px #cccccc;

  /* Translate -100% to move off screen */
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);

  /* Animations */
  -webkit-transition: all 300ms ease-in-out;
     -moz-transition: all 300ms ease-in-out;
          transition: all 300ms ease-in-out;

   width: 100%;
    z-index: 999;
}


/**
 * Headhesive stick
 * > `stick` class for the cloned element:
 *
 * @example
 * var options = {
 *   classes {
 *     stick: 'banner--stick';
 *   }
 * }
 */
.banner--stick {

  /* Translate back to 0%; */
  -webkit-transform: translateY(0%);
      -ms-transform: translateY(0%);
          transform: translateY(0%);
}


/**
 * Headhesive unstick
 * > `unstick` class for the cloned element:
 *
 * @example
 * var options = {
 *   classes {
 *     unstick: 'banner--unstick';
 *   }
 * }
 */
.banner--unstick {
  /* Not required to use, but could be useful to have */
}
/**********personalizado****************/
div#imgbannerf .imgtopfix{
    width: 80px;
    float: left;
    margin-right: 10px;
    vertical-align: middle!important;
}
div.transportepdptop{
    width: 200px;
    float: left;
    margin-right: 10px;
    text-align: center;
}
div.transportepdptop span{
    display: block;
    font-size: 12px;
}
div.transportepdptop span.transportepdptop_title{
    font-weight: 600
}
div#imgbannerf .titletopfix{
    width:400px;
    float: left;
    font-size: 15px;
    margin: 20px 10px 0 0;
    text-transform: uppercase;
}
div#imgbannerf .pricetopfix{
    width:150px;
    float: left;
    margin-right: 10px;
    margin: 20px 0 0px;
}
div#imgbannerf .pricetopfix p {
    /*float: left;
    margin: 0 15px 0 0;*/
}
div#imgbannerf .pricetopfix .price {
    color: #e70d96;
    font-size: 24px;
}
div#imgbannerf .pricetopfix  #old_price .price {
    color: #bbb;
    font-size: 19px;
    text-decoration: line-through;
    float: right;
    margin-top: -30%;
}
div#imgbannerf .pricetopfix #reduction_percent, div#imgbannerf .pricetopfix #reduction_amount {
    background: #eee none repeat scroll 0 0;
    color: #333;
    font-size: 15px;
    padding: 6px 10px;
    width: 60px;
    float: right;
    margin-top: -15%;
}
div#imgbannerf .carttopfix{
    float: left;
    margin: 15px 0 0px;
}

/* Add responsive comportament */

/* Mobile based in ../../css/tptnResponsive.css */

@media (max-width: 767px) {
  div#imgbannerf .imgtopfix{
    width: 75px;
  }
  div#imgbannerf .titletopfix{
    width: 125px;
    font-size: 10px;
  }
  div#imgbannerf .pricetopfix{
    float:right;
    width: 120px;
    /*margin-top: -12%;*/
    margin-right: -2%;
  }
  div#imgbannerf .pricetopfix .price, div#imgbannerf .pricetopfix  #old_price .price, div#imgbannerf .pricetopfix .ivadp{
    font-size: 14px;
  }
  div#imgbannerf .pricetopfix #reduction_percent, div#imgbannerf .pricetopfix #reduction_amount {
    width: 50px;
    font-size: 12px;
  }
  div.transportepdptop{
    display: none;
  }
  div#imgbannerf .carttopfix{
    margin: 17px 0 10px;
  }
}

/*  Tablet (L) based in ../../css/tptnResponsive.css */
@media (min-width: 992px) and (max-width: 1199px) {
  div#imgbannerf .pricetopfix{
    margin: 10px 0 0px;
  }
  div#imgbannerf .carttopfix{
    float:none;
    margin-right: 14%;
    margin-left: 41%;
    margin-bottom: 1%;
  }
  div#imgbannerf .pricetopfix .price, div#imgbannerf .pricetopfix  #old_price .price{
    font-size: 18px;
  }
  div#imgbannerf .pricetopfix #reduction_percent, div#imgbannerf .pricetopfix #reduction_amount {
    width: 55px;
    font-size: 14px;
  }
}

/* Comment for view in mobile and tablet too */

/*@media (max-width: 991px) {
    header.banner{display: none!important}
}*/