.banner-area{ .banner-head{ line-height: 0 !important; } .banner-heading{ display: inline-block; background: #ff3d00; padding: 20px 30px; position: relative; overflow:hidden; padding-right: 70px; line-height: 0 !important; &:before{ transform: rotate(-30deg); width: 50px; background: #fff; left: inherit; margin-right: -20px; bottom: -30px; top: -30px; z-index: 9; } h3{ margin: 0; color: #fff; z-index: 999; position: relative; } } .banner-content-area{ float: left; .banner-content{ padding: 30px; .product-details{ margin: 0 0 50px; h1{ font-family: $title-font; font-weight: 500; color: #fff; margin: 0 0 10px; } p{ color: #cfcfcf; font-size: 16px; margin: 0; } } .product-price{ margin: 0 0 50px; del{ color: #8f8f8f; font-weight: 500; font-size: 24px; font-family: $title-font; display: block; margin: 0 0 10px; } strong{ font-weight: 500; font-family: $title-font; font-size: 40px; color: #fff; display: block; } } .counter{ .count-list{ li{ display: inline-block; border: 1px solid #fff; width: 80px; height: 75px; text-align: center; padding: 10px 0; span{ color: #fff; font-size: 24px; font-weight: 700; } p{ color: #ff3d00; margin: 0; font-weight: 700; } } } } } .banner-img{ margin-bottom: -30px; display: block; img{ width: 100%; } } } } .banner-two-area{ background-repeat: no-repeat !important; background-position: center center !important; background-size: cover !important; .banner-con{ padding: 100px 0; h1{ font-size: 60px; color: #fff; font-family:$secont-font; margin: 0 0 10px; span{ color: #ff0000; } } h4{ color: #c4c4c4; font-size: 20px; font-family: $secont-font; font-weight: 300; letter-spacing: 1px; } a{ } } .price-icon{ span{ display: block; background: #fff; width: 100px; height: 100px; border-radius: 50%; padding: 35px 0; text-align: center; font-size: 36px; color: #000; font-weight: 900; position: absolute; top: 50px; left: 70px; } } }