Bootstrap Utility Example

p-4 rounded-4 shadow m-auto position-relative overflow-hidden
Css

Custom Callout

callout
Css
.callout {
width: 100%;
max-width: 850px;
}
.callout > * {
max-width: 65ch;
z-index:1;
}
.callout::after {
    content: "";
    background: "";
    position: absolute;
}

Rounded corners

rounded-4
Css

Shadow

shadow overflow-hidden
Css

rounded-corners-right

rounded-corners-right
Css
.rounded-corners-right {
border-radius: 0.0rem 0.5rem 0.5rem 0.0rem!important;
}

rounded-corners-left

rounded-corners-left
Css
.rounded-corners-left {
border-radius: 0.5rem 0.0rem 0.0rem 0.5rem !important;
}

nav-item

nav-item
Css
.nav-item {
margin-right: 2px
}

width-100-importent

width-100-importent
Css
width-100-importent{
width:100% !important;
max-width:100% !important;
}

In bold letters

duka-bold-letters
Css
.duka-bold-letters {
    font-weight: bold
}

Topline on border

topline-on-border
Css
.topline-on-border {
 border: 5px solid red;
border-width: 2px 0px 0px 0px;
border-image: radial-gradient(#506b7a, #fffbf7) 4;
}

Disabled add to cart

btn-disabled-add-to-cart
Css
.btn-disabled-add-to-cart {
    opacity: .65;
    pointer-events: none;
    background-color: whitesmoke !important;
    color: dimgray !important;
 border-color: dimgray !important;
}

icon-24

icon-24
Css
.icon-24 svg{height:1.5rem;width:1.5rem;display:block}

color-overlay

color-overlay
Css
.color-overlay:before {
  content:"";
  position: relative;
  top:0;
  left:0;
  height:100%;
  width:100%;
  background: rgba(250,246,239,0.2);
  z-index:999;
}

Margin_Top_20px

mt-20
Css
.mt-20:before {
    margin-bottom: 0 !important;
    margin-top: 20px;
}

slider-item-show5

slider-item-show5
Css
.slider-item-show5 {
    --swiffy-slider-item-count: 3;
}

js-product-related-slider

js-product-related-slider
Css

js-product-related-header

js-product-related-header
Css