#product-list{ position: relative;} .product-item { width: 360px; padding: 7px; } .product-item a{ display:block; overflow: hidden; position: relative; font-family: 'open_sanscondensed_light';} .product-item a span.animated{ visibility:hidden; opacity:0; transition:opacity 0.5s linear; } .product-item a:hover span.animated{ visibility:visible; opacity:0.9;} .product-item a span.product-item-name{ position: absolute; top:0; left: 0; text-align: center; background: #D00355; color: #fff; width: 100%; z-index: 1; padding: 6px; font-size: 20px; } .product-item a span.product-item-price{ position: absolute; bottom:0; left: 0; text-align: right; background: rgba(0,0,0,0.6); color: #fff; width: 100%; z-index: 2; padding: 6px; font-size: 20px; } .product-item a .product-item-badge{ position: absolute; top: 0; right: 0; width: 110px; height: 110px; z-index: 2;} .product-item a:hover .product-item-badge{ opacity:0.9;} .product-item a .product-item-badge.on_sale{background: url(../images/vign-onsale.png) no-repeat;} .product-item a .product-item-badge.sold_out{background: url(../images/vign-soldout.png) no-repeat;} .product-item a .product-item-badge.xclusive{background: url(../images/vign-xclusive.png) no-repeat;} .product-item a img{ width: 100%; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .product-item a:hover img { -webkit-transform: scale(2); -moz-transform: scale(2); -o-transform: scale(2); transform: scale(2); } .image_list li:first-child img{width:100%;} .more_option{margin: 10px auto; width: 80%;} .quantity_box .bootstrap-touchspin { float: left; margin-right: 5px; width: 130px; } .modal-content{ border-radius: none;} .modal-header{ border-color:#fff; background: #D00355; color: #fff; } #miniShoppingCart{ position: relative;} .text-page{ padding: 20px; color: #fff} .text-page-wrapper h1, .text-page-wrapper h2, .text-page-wrapper h3{font-family: 'open_sanscondensed_light';} .page-content{ padding: 10px; color: #fff} .page-content *{color: #fff !important} .page-content .form-control{ color: #555 !important} .page-content .btn-default{ color: #333 !important} .page-content .alert-danger { color: #a94442 !important;} .page-content .alert-success { color: #3c763d !important;} .page-content .alert-success strong{ color: #3c763d !important;} .page-sub-title{ margin:0; padding: 4px 0 8px 60px; background-color: #1b1b1b; color:#fff; font-size: 20px;} .page-title{ margin:0; padding: 10px 0 10px 80px; background-color: #D00355; color:#fff; position:relative;} .page-title:before{ font-size: 15px; color:#fff; position:absolute; font-family: FontAwesome; top:22.5px; left:60px; content: "\f111"; } .page-footer{ padding: 20px 0; } .page-footer div{color:#fff; font-family: 'open_sanscondensed_light'; font-size: 20px;} .page-footer .page-footer-title{ background-color: #1b1b1b; padding: 4px 0 4px 60px;} .page-footer .page-footer-back-to-top { background-color: #D00355; padding: 4px 10px;} .page-footer .page-footer-back-to-top a{ color:#fff; text-decoration: none; outline: none; display: block; cursor: pointer;} .page-footer .page-footer-back-to-top a:hover{ text-decoration: none;outline: none} .faq-wrapper .panel{ background: none;} .faq-wrapper .panel-default > .panel-heading{ background: none;} .faq-wrapper a{ text-decoration: none; outline:none;} .faq-wrapper .panel-default { border-color: #898989; } .faq-wrapper .panel-heading [data-toggle="collapse"]:before { font-family: 'FontAwesome'; content: "\f0fe"; float: right; color: #fff; } .faq-wrapper .panel-heading [data-toggle="collapse"].collapsed:before { color: #D00355; } .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{ margin-right: 0;} #cart_box table{ font-size: 10px;} .btn-primary{ background-color: #D00355; border-color: #D00355; } .btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary{ background-color: #fff; border-color: #D00355; color: #D00355; } .nav-info{ background: #2d2d2d; margin-left:-10px; padding: 9px 15px; color:#e4e4e4; margin-right: 10px; } .left_position .navbar{ border: none} .sub_nav li.active a{ color:#D00355;} .product-view-list{ list-style: none; margin: 0; padding: 0} .product-view-list li{ background: #2b2b2b; display: block; margin: 0px 10px 10px 10px; position: relative;} .product-view-list li .pull-left{ padding: 20px;} .product-view-list li .product-item{ float: left;} .product-view-list li .product-list-item-name{ color: #fff; font-family: "open_sanscondensed_light"; font-size: 44px; line-height: 50px; text-transform: uppercase; } .product-view-list li .product-list-item-price{font-size:18px; color:#d00355; display:block; padding-top:24px; padding-bottom:15px; font-family: 'MyriadProItalic'; position:relative;} .product-view-list li .product-list-item-price:before{position:absolute; content:''; background-color:#FFFFFF; height:3px; width:30px; top:10px; left:0px;} .product-view-list li .product-list-item-price:after{position:absolute; content:''; background-color:#FFFFFF; height:3px; width:30px; bottom:0px; left:0px;} .product-view-list li .btn-details{position:absolute; top: 0; right: 0; width: 111px; height: 111px; background: url(../images/detailbutton.png) no-repeat;} .social_icon{} .social_icon ul{list-style:none; margin:0; padding:0;} .social_icon ul li{display:inline;} .social_icon ul li a{display:inline-block; border-radius:20px; height:30px; width:30px; border:1px solid #2d2d2d; background:#d00355; color:#fff; padding-top:4px; cursor:pointer; box-shadow: 0px 0px 5px 0px rgba(153,153,153,0.74);} .social_icon ul li a:hover{background:#2d2d2d; color:#d00355;} #homepage-slider{ margin: 0 auto; max-width: 966px; padding: 15px 0} .homeslider-container{ position: relative;} .homeslider-container .homeslider-description{ position: absolute; top: 20px; left: 20px; font-family: "MyriadProItalic"; } .homeslider-container .homeslider-description h2{ color: #fff;background-color: rgba(0, 0, 0, 0.5); margin: 0 0 10px 0; padding: 10px} .homeslider-container .homeslider-description p{ color: #fff;background-color: #d00355; margin: 0; padding: 5px 10px} .heading-slider{ color: #fff;background-color: #d00355; margin: 0; padding: 5px 10px; text-align: center; font-family: "MyriadProItalic"; font-size: 17px; margin: 0 0 15px 0} .home-blocks{ color: #fff; padding: 0 0 15px 0 } .home-img-blocks img{ width: 100% } #makeMeScrollableSales, #makeMeScrollable { width:100%; height: 240px; position: relative; margin:0 0 15px 0; } /* Replace the last selector for the type of element you have in your scroller. If you have div's use #makeMeScrollable div.scrollableArea div, if you have links use #makeMeScrollable div.scrollableArea a and so on. */ #makeMeScrollableSales .product-item, #makeMeScrollable .product-item { width: auto; position: relative; float: left; margin: 0; padding: 0 3px; /* If you don't want the images in the scroller to be selectable, try the following block of code. It's just a nice feature that prevent the images from accidentally becoming selected/inverted when the user interacts with the scroller. */ -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; } .home-img-blocks .col-xs-1, .home-img-blocks .col-xs-2, .home-img-blocks .col-xs-3, .home-img-blocks .col-xs-4, .home-img-blocks .col-xs-5, .home-img-blocks .col-xs-6, .home-img-blocks .col-xs-7, .home-img-blocks .col-xs-8, .home-img-blocks .col-xs-9, .home-img-blocks .col-xs-10, .home-img-blocks .col-xs-11, .home-img-blocks .col-xs-12{ padding: 5px;} .home-img-blocks > .row { margin-left: -3px; margin-right: -3px; } .home-blocks h2{ color:#d00355; font-size: 16px; font-family: "OpenSans-Semibold"; font-style: italic;} .home-img-blocks a img{ -webkit-transition: opacity 1s ease-in-out; -moz-transition: opacity 1s ease-in-out; -o-transition: opacity 1s ease-in-out; transition: opacity 1s ease-in-out; } .home-img-blocks a:hover img{ opacity:0.5;}