Cart(3)
$380X01
$150X01
$145X01
SUBTOTAL:
Specification Style
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
<div class="specification-area"> <div class="specification-owl"> <div class="items"> <div class="col-md-4 col-sm-4"> <div class="single-specification spcei-mrbtm"> <h3>Pure Cotton</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification"> <h3>New Design</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification"> <h3>Light Weight Stretch</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> </div> <div class="col-md-4 col-sm-4"> <div class="spcei-img"> <img src="img/product/sp-1.png" alt="" /> </div> </div> <div class="col-md-4 col-sm-4"> <div class="single-specification right spcei-mrbtm mt-xs-speci"> <h3>Various Color </h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification right"> <h3>Size Available</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification right"> <h3>Machine Wash</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> </div> </div> <div class="items"> <div class="col-md-4 col-sm-4"> <div class="single-specification spcei-mrbtm"> <h3>Pure Cotton</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification"> <h3>New Design</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification"> <h3>Light Weight Stretch</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> </div> <div class="col-md-4 col-sm-4"> <div class="spcei-img"> <img src="img/product/sp-2.png" alt="" /> </div> </div> <div class="col-md-4 col-sm-4"> <div class="single-specification right spcei-mrbtm"> <h3>Various Color </h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification right"> <h3>Size Available</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> <div class="single-specification right"> <h3>Machine Wash</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor</p> </div> </div> </div> </div> </div>
.specification-area{ position:relative; display:block; overflow:hidden; } .single-specification { margin-bottom: 75px; text-align: right; padding-left: 10%; } .single-specification > h3 { color: #282828; display: inline-block; font-family: montserrat; font-size: 18px; margin: 0; overflow: hidden; padding-right: 30px; position: relative; } .single-specification > p { margin: 0; padding-right: 32px; font-family: open sans; color: #656565; } .single-specification > h3::after { background: #ff4381 none repeat scroll 0 0; border-radius: 100%; content: ""; height: 12px; position: absolute; right: 2px; top: 4px; width: 12px; } .single-specification > h3::before { border: 1px solid #ff4381; border-radius: 100%; content: ""; height: 16px; position: absolute; right: 0; top: 2px; width: 16px; } .single-specification.right { text-align: left; } .single-specification.right > h3 { padding-left: 30px; } .single-specification.right > p { padding-left: 30px; } .single-specification.right > h3::after { background: #ff4381 none repeat scroll 0 0; border-radius: 100%; content: ""; height: 12px; position: absolute; left: 2px; top: 4px; width: 12px; } .single-specification.right > h3::before { border: 1px solid #ff4381; border-radius: 100%; content: ""; height: 16px; position: absolute; left: 0; top: 2px; width: 16px; } .spcei-img { text-align: center; } .spcei-mrbtm{ margin-top:80px; } .single-specification.right{ padding-right: 8%; padding-left:0; } .specification-area .owl-theme .owl-controls { left: 0; margin-top: 0; position: absolute; text-align: center; top: 45%; width: 100%; } .specification-area .owl-theme .owl-controls .owl-buttons div { background: #D7D7D7; border-radius: 30px; color: #fff; display: inline-block; font-size: 25px; height: 30px; line-height: 28px; margin: 0; opacity: 0.5; padding: 0; text-align: center; width: 30px; } .specification-area .owl-theme .owl-controls .owl-buttons div::before { border: 1px solid #d7d7d7; border-radius: 100%; content: ""; height: 38px; left: -4px; margin: 0; padding: 0; position: absolute; top: -4px; width: 38px; } .specification-area .owl-theme .owl-next { position: absolute; right: 0; text-align: right; } .specification-area .owl-theme .owl-prev { left: 0; position: absolute; text-align: left; } .specification-area .owl-theme .owl-controls .owl-buttons div:hover{ color: #FF4381; }
$(".specification-owl").owlCarousel({ autoPlay: false, slideSpeed:2000, pagination:false, navigation:true, items : 1, transitionStyle : "backSlide", /* [This code for animation ] */ navigationText:["<i class='fa fa-angle-left'></i>","<i class='fa fa-angle-right'></i>"], itemsDesktop : [1199,1], itemsDesktopSmall : [980,1], itemsTablet: [768,1], itemsMobile : [479,1], });
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor psum dolor sit ame
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor inciidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam