@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900|Rubik:300,400,500,700,900'); * { margin: 0; padding: 0; -webkit-font-smoothing: antialiased; -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px; text-shadow: rgba(0, 0, 0, .01) 0 0 1px } body { font-family: 'Rubik', sans-serif; font-size: 14px; font-weight: 400; background: #eee; color: #000000 } div { display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } ul { list-style: none; margin-bottom: 0px } p { font-family: 'Rubik', sans-serif; font-size: 14px; line-height: 1.7; font-weight: 400; color: #828282; -webkit-font-smoothing: antialiased; -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px; text-shadow: rgba(0, 0, 0, .01) 0 0 1px } p a { display: inline; position: relative; color: inherit; border-bottom: solid 1px #ffa07f; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease } a, a:hover, a:visited, a:active, a:link { text-decoration: none; -webkit-font-smoothing: antialiased; -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px; text-shadow: rgba(0, 0, 0, .01) 0 0 1px } p a:active { position: relative; color: #FF6347 } p a:hover { color: #FFFFFF; background: #ffa07f } p a:hover::after { opacity: 0.2 } ::selection {} p::selection {} h1 { font-size: 48px } h2 { font-size: 36px } h3 { font-size: 24px } h4 { font-size: 18px } h5 { font-size: 14px } h1, h2, h3, h4, h5, h6 { font-family: 'Rubik', sans-serif; font-weight: 500; -webkit-font-smoothing: antialiased; -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px; text-shadow: rgba(0, 0, 0, .01) 0 0 1px } h1::selection, h2::selection, h3::selection, h4::selection, h5::selection, h6::selection {} .form-control { color: #db5246 } section { display: block; position: relative; box-sizing: border-box } .clear { clear: both } .clearfix::before, .clearfix::after { content: ""; display: table } .clearfix::after { clear: both } .clearfix { zoom: 1 } .float_left { float: left } .float_right { float: right } .bbb_background { background-color: #E0E0E0 !important } .trans_200 { -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease } .trans_300 { -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease } .trans_400 { -webkit-transition: all 400ms ease; -moz-transition: all 400ms ease; -ms-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease } .trans_500 { -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease } .fill_height { height: 100% } .super_container { width: 100%; overflow: hidden } .prlx_parent { overflow: hidden } .prlx { height: 130% !important } .nopadding { padding: 0px !important } .button { display: inline-block; background: #0e8ce4; border-radius: 5px; height: 48px; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease } .button a { display: block; font-size: 18px; font-weight: 400; line-height: 48px; color: #FFFFFF; padding-left: 35px; padding-right: 35px } .button:hover { opacity: 0.8 } .trends { padding-top: 80px; padding-bottom: 80px } .bbb_overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(203, 225, 238, 0.3) } .bbb_background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center } .bbb_container { top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); padding-right: 40px } .bbb_title { padding-right: 50px } .bbb_text { margin-top: 17px } .bbb_text p:last-child { margin-bottom: 0px } .bbb_slider_nav { margin-top: 27px } .bbb_nav { display: inline-block; width: 36px; height: 36px; box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1); border-radius: 50%; text-align: center; cursor: pointer; margin-right: 16px; background-color: #2d8ce4 } .bbb_nav:last-child { margin-right: 0px } .bbb_nav i { line-height: 36px; color: #fff; font-size: 18px; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease } .bbb_nav:hover i { color: #474747 } .bbb_item { background: #FFFFFF; border-radius: 1px; padding: 25px } .bbb_image { width: 100%; height: 212px } .bbb_image img { width: auto !important; max-width: 100% !important } .bbb_category a { font-size: 12px; color: rgba(0, 0, 0, 0.5) } .bbb_category a:hover { color: #0e8ce4 } .bbb_content { margin-top: 24px } .bbb_name { float: left } .bbb_name a { font-size: 16px; color: #000000 } .bbb_name a:hover { color: #0e8ce4 } .bbb_price { font-size: 16px; font-weight: 500; float: right } .bbb_fav { position: absolute; top: 18px; right: 18px; width: 36px; height: 36px; background: #FFFFFF; box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1); border-radius: 50%; visibility: hidden; opacity: 0; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; cursor: pointer } .bbb_fav.active { visibility: visible; opacity: 1 } .bbb_fav:hover { box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.3) } .bbb_item:hover .bbb_fav { visibility: visible; opacity: 1; top: 18px } .bbb_fav i { display: block; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); color: #cccccc; line-height: 36px; pointer-events: none; z-index: 0; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease } .bbb_fav.active i { color: red } .bbb_item:hover .bbb_fav { visibility: visible; opacity: 1 } .bbb_marks { position: absolute; left: 18px; top: 18px } .bbb_mark { display: none; width: 36px; height: 36px; font-size: 10px; font-weight: 500; color: #FFFFFF; border-radius: 50%; line-height: 36px; text-align: center } .bbb_discount { background: #df3b3b } .bbb_item.discount .bbb_discount, .bbb_item.is_new .bbb_new { display: block } .bbb_new { background: #0e8ce4 } @media only screen and (max-width: 991px) { .bbb_slider_container { margin-top: 15px } }

$(document).ready(function() { if($('.bbb_slider').length) { var trendsSlider = $('.bbb_slider'); trendsSlider.owlCarousel( { loop:false, margin:30, nav:false, dots:false, autoplayHoverPause:true, autoplay:false, responsive: { 0:{items:1}, 575:{items:2}, 991:{items:3} } }); trendsSlider.on('click', '.bbb_fav', function (ev) { $(ev.target).toggleClass('active'); }); if($('.bbb_prev').length) { var prev = $('.bbb_prev'); prev.on('click', function() { trendsSlider.trigger('prev.owl.carousel'); }); } if($('.bbb_next').length) { var next = $('.bbb_next'); next.on('click', function() { trendsSlider.trigger('next.owl.carousel'); }); } } });