body{
	background-color: #FFF;
}

.carousel .carousel-control {
	visibility: hidden;
	background-image: none;
	height: 33px;
	top: 105px;
}

.carousel:hover .carousel-control {
	visibility: visible;
}

.carousel-copy {
	background-color: #EA633D;
	color: #FFF;
	position: absolute;
	padding: 3px 10px;
	width: 100%;
	height: 42px;
	top: 0;
}

.carousel-copy p {
	font-size: 0.9em;
	margin: 0;
}

.carousel-copy .publicidad {
	width: 15px;
	background-color: #808080;
	position: absolute;
	top: 18px;
	padding: 2px;
	font-weight: bold;
	right: 0;
	text-align: center;
}

.carousel-precio {
	background-color: rgba(0,0,0,0.4);
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 35px;
	z-index: 3;
}

.carousel-precio p {
	font-size: 0.9em;
	font-weight: bold;
	color: #FFF;
	opacity: 1;
	padding-left: 7px;
	padding-top: 6px;
}

.carousel-precio p,
.carousel-precio a {
	float: left;
}

#precio-valor {
	font-size: 1.3em;
}

#comprar-boton {
	background-color: #EA633D;
	position: absolute;
	color: #FFF;
	font-size: 0.9em;
	font-weight: bold;
	margin-top: 6px;
	margin-right: 8px;
	right: 0;
	z-index: 4;
}

/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb
*/
.carousel-fade .carousel-inner .item {
	opacity:0;
	transition-property:opacity
}

.carousel-fade .carousel-inner .active {
	opacity:1
}

.carousel-fade .carousel-inner .active.left,.carousel-fade .carousel-inner .active.right {
	left:0;
	opacity:0;
	z-index:1
}

.carousel-fade .carousel-inner .next.left,.carousel-fade .carousel-inner .prev.right {
	opacity:1
}

.carousel-fade .carousel-control {
	z-index:2
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d),(-webkit-transform-3d) {
	.carousel-fade .carousel-inner > .item.next,.carousel-fade .carousel-inner > .item.active.right {
		opacity:0;
		-webkit-transform:translate3d(0,0,0);
		transform:translate3d(0,0,0)
	}

	.carousel-fade .carousel-inner > .item.prev,.carousel-fade .carousel-inner > .item.active.left {
		opacity:0;
		-webkit-transform:translate3d(0,0,0);
		transform:translate3d(0,0,0)
	}

	.carousel-fade .carousel-inner > .item.next.left,.carousel-fade .carousel-inner > .item.prev.right,.carousel-fade .carousel-inner > .item.active {
		opacity:1;
		-webkit-transform:translate3d(0,0,0);
		transform:translate3d(0,0,0)
	}
}

.carousel-caption {
	background-color: #FFF;
	padding: 0;
	width: 260px;
	height: 40px;
	top: 55px;
	left: 190px;
	overflow: hidden;
	text-shadow: none;
	-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;
}

.carousel-caption:hover {
	left: 40px;
}

.carousel-caption .descuento {
	background-color: #EA633D;
	width: 70px;
	height: 40px;
	float: left;
	font-size: 0.7em;
}

.carousel-caption .descuento span {
	font-size: 2em;
	font-weight: bold;
}

.carousel-caption .compartir {
	background-color: #F9B957;
	padding-top: 7px;
	width: 40px;
	height: 40px;
	float: left;
}

.carousel-caption .compartir i {
	cursor: pointer;
}

.carousel-caption .sociales {
	padding: 7px 15px;
	width: 50px;
	height: 40px;
	float: left;
}

.carousel-caption .sociales a:hover,
.carousel-caption .sociales a:active {
	opacity: 0.8;
}

.fb a {
	color: #39589B
}

.tw a {
	color: #50B0DF
}

.wa a {
	color: #4dc247
}

.item.active {
	cursor: pointer;
}