<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <section id="header-usp-section"> <div class="usp-container"> <div class="usp-row"> <div class="carousel slide" id="fade-quote-carousel" data-ride="carousel" data-interval="3000"> <!-- Carousel items --> <div class="carousel-inner"> <div class="item"> <blockquote> <h3>10% OFF ALL ORDERS</h3> </blockquote> </div> <div class="item"> <blockquote> <h3>15% OFF ALL ORDERS OVER £200</h3> </blockquote> </div> <div class="active item"> <blockquote> <h3>FREE UK NEXT DAY DELIVERY*</h3> </blockquote> </div> </div> </div> </div> </div> </section>

#header-usp-section { width: 100% !important; float:none !important; background-color: unset; } #header-usp-section h3 { font-size: 16px !important; color: black; } #header-usp-section-mobile { width: 100% !important; float:none !important; background-color: unset; } #header-usp-section-mobile h3 { font-size: 16px !important; color: black; } /*-------------------------------*/ /* Carousel Fade Transition */ /*-------------------------------*/ #fade-quote-carousel.carousel { padding-bottom: 60px; } #fade-quote-carousel.carousel .carousel-inner .item { opacity: 0; -webkit-transition-property: opacity; -ms-transition-property: opacity; transition-property: opacity; } #fade-quote-carousel.carousel .carousel-inner .active { opacity: 1; -webkit-transition-property: opacity; -ms-transition-property: opacity; transition-property: opacity; } #fade-quote-carousel.carousel .carousel-indicators { bottom: 10px; } #fade-quote-carousel blockquote { text-align: center; border: none; }