html {
 overflow-x: auto; /* allows window to scroll correctly on desktops */
}
body {
 min-width: 1200px; /* prevents the page width from being less than 1200px */
}
#content{
 background: none;
 padding: 20px 0;
}
#content > div.container{
 margin: 0 auto;
 width: 1200px !important;
}
#content > div.container:after{
 background-size: cover;
}
#homepage{
 font: 400 14px/1.4em texgyreadventor, arial, helvetica, sans-serif;
 position: relative;
}
#homepage a{
 text-decoration: none;
}
#homepage a:hover{
 text-decoration: none;
}
#homepage #hero{
 height: 300px;
 margin: 0 auto;
 overflow: hidden;
 position: relative;
 width: 1200px;
}
#homepage #hero > .carousel-control{
 opacity: .75;
 text-indent: 0;
 width: 150px;
}
#homepage #hero > .carousel-control.right{
 background: none;
}
#homepage #hero > .carousel-control.right:before{
 color: #fff;
 content: ">";
 font-family: "FontAwesome";
 font-size: 2em;
 position: absolute;
 top: 140px;
 right: 80px;
 transform: scale(1,2);
 -webkit-transform: scale(1,2);
 -moz-transform: scale(1,2);
 -ms-transform: scale(1,2);
 -o-transform: scale(1,2);
}
#homepage #hero > .carousel-control.left{
 background: none;
}
#homepage #hero > .carousel-control.left:before{
 color: #fff;
 content: "<";
 font-family: "FontAwesome";
 font-size: 2em;
 position: absolute;
 top: 140px;
 transform: scale(1,2);
 -webkit-transform: scale(1,2);
 -moz-transform: scale(1,2);
 -ms-transform: scale(1,2);
 -o-transform: scale(1,2);
}
#homepage .product-carousel{
 margin: 0 auto;
 width: 1200px;
}
#homepage .regular{
 color: grey;
 text-decoration: line-through;
 font-size: .7em;
}
#homepage .carousel{
 display: block;
 height: 365px;
 margin: 35px auto 25px;
 position: relative;
 width: 954px;
}
#homepage h2{
 color: #585555;
 font-family: texgyreadventor, arial, helvetica, sans-serif;
 font-size: 28px;
 margin: 0 auto;
 padding: 0;
 text-align: center;
 text-transform: uppercase;
 width: 100%;
}
#homepage h2:before,
#homepage h2:after{
 display: inline-block;
 height: 1px;
 content: " ";
 text-shadow: none;
 background-color: #585555;
 width: 200px;
}
#homepage h2:before{
 margin: 0 20px 8px 0;
}
#homepage h2:after{
 margin: 0 0 8px 20px;
}
#homepage h2 div{
 display: inline;
}
#homepage .carousel .spa{
 font-family: texgyreadventor, arial, helvetica, sans-serif;
 margin: 0 auto;
 text-align: center;
 text-transform: uppercase;
 width: 400px;
}
#homepage .carousel .spa:before,
#homepage .carousel .spa:after{
 border-top: 1px solid #231f20;
 content: '';
 height: 1px;
 position: absolute;
 top: 15px;
 width: 200px;
}
#homepage .carousel .spa:before{
 right: 100%;
 margin-right: -280px;
}
#homepage .carousel .spa:after{
 left: 100%;
 margin-left: -280px;
}
#homepage .carousel .carousel-inner{
 overflow: hidden;
}
#homepage .carousel ul{
 margin: 0;
 padding: 0;
 width: 954px;
}
#homepage .carousel ul li{
 display: block;
 float: left;
 height: 360px;
 width: 20%;
}
#homepage .carousel .product{
 background: #fff;
 height: 320px;
 margin: 0 auto;
 width: 175px;
}
#homepage .carousel .product figure img{
 height: auto;
 margin: 0 auto;
 width: 155px;
}
#homepage .carousel .product figcaption{
 margin: 0 auto;
 width: 160px;
}
#homepage .carousel .product figcaption .product-name{
 color: #231f20;
 font-size: 14px;
 font-weight: 400;
 height: 60px;
 overflow: hidden;
}
#homepage .carousel .product figcaption .product-name:hover{
 color: #C82754;
}
#homepage .carousel .product figcaption .product-price{
 color: #C82754;
 font-size: 20px;
 font-weight: 800;
 margin-top: 10px;
}
#homepage .cashback{
 font-size: .9em;
 color: #000;
 top: 0;
}
#homepage .cashback b{
 vertical-align: top;
}
#homepage .carousel .carousel-control{
 opacity: .75;
 width: 0;
}
#homepage .carousel .carousel-control.right{
 background: none;
}
#homepage .carousel .carousel-control.left{
 background: none;
}
#homepage .carousel .sprite-left{
 background-image: url(/site/cs/images/sprite/motives-cosmetics-sprite.png);
 background-repeat: no-repeat;
 background-position: 0 -271px;
 height: 206px;
 position: absolute;
 top: 85px;
 left: -35px;
 width: 37px;
}
#homepage .carousel .sprite-left:hover{
 background-position: -321px -271px;
}
#homepage .carousel .sprite-right{
 background-image: url(/site/cs/images/sprite/motives-cosmetics-sprite.png);
 background-repeat: no-repeat;
 background-position: -42px -271px;
 height: 206px;
 position: absolute;
 top: 85px;
 right: -35px;
 width: 37px;
}
#homepage .carousel .sprite-right:hover{
 background-position: -363px -271px;
}
#homepage #get-the-look{
 background: #000;
 height: 300px;
 margin: 25px auto;
 width: 100%;
}
#homepage #get-the-look img{
 display: block;
 height: auto;
 margin: 0 auto;
 width: 1200px;
}
#homepage .cashback-sm, #homepage .cashback-lg{
 display: inline;
}
#homepage h4{
 font-size: 18px;
}