Helper Classes

Width, Height, Position
.w-auto { width: auto!important; }
.w-25 { width: 25%!important; }
.w-50 { width: 50%!important; }
.w-75 { width: 75%!important; }
.w-100 { width: 100%!important; }
.h-100 { height: 100%!important; }
.p-relative { position: relative!important; }
.p-absolute { position: absolute!important; }
.p-static { position: static!important; }
Display

.d-none { display: none!important; }
.d-block { display: block!important; }
.d-inline-block { display: inline-block!important; }
.d-flex { display: flex!important; }
.d-inline-flex { display: inline-flex!important; }
.justify-content-center { justify-content: center!important; }
.justify-content-start { justify-content: flex-start!important; }
.justify-content-end { justify-content: flex-end!important; }
.justify-content-between { justify-content: space-between!important; }
.align-items-start { align-items: flex-start!important; }
.align-items-center { align-items: center!important; }
.align-items-end { align-items: flex-end!important; }
.align-self-start { align-self: flex-start!important; }
.align-self-center { align-self: center!important; }
.align-self-end { align-self: flex-end!important; }
.flex-column { flex-direction: column!important; }
.flex-wrap { flex-wrap: wrap!important; }
.flex-1 { flex: 1!important; }
.overflow-hidden { overflow: hidden!important; }
.vertical-top { vertical-align: top!important; }
.vertical-middle { vertical-align: middle!important; }
.vertical-bottom { vertical-align: bottom!important; }
@media (min-width: 576px) {
    .d-sm-none { display:none!important; }
    .d-sm-block { display: block!important; }
    .d-sm-flex { display: flex!important; }
}
@media (min-width: 768px) {
    .w-md-50 { width:50%!important; }
    .float-md-left { float: left!important; }
    .float-md-right { float: right!important; }
    .d-md-none { display: none!important; }
    .d-md-block { display: block!important; }
    .d-md-flex { display: flex!important; }
}
@media (min-width: 992px) {
    .d-lg-none { display:none!important; }
    .d-lg-block { display: block!important; }
    .d-lg-flex { display: flex!important; }
}
@media (min-width: 1200px) {
    .d-xl-none { display:none!important; }
    .d-xl-block { display: block!important; }
    .d-xl-flex { display: flex!important; }
}
@media (max-width: 576px) {
    .d-none-sm-max { display:none!important; }
}
@media (min-width: 1200px) {
    .hide-on-xl { display:none!important; }
}
@media (max-width: 1199px) and (min-width:992px) {
    .hide-on-lg { display:none!important; }
}
@media (max-width: 991px) and (min-width:768px) {
    .hide-on-md { display:none!important; }
}
@media (max-width: 767px) and (min-width:576px) {
    .hide-on-sm { display:none!important; }
}
@media (max-width: 575px) {
    .hide-on-xs { display:none!important; }
}
Font Weight, Transform, Type, Align
.font-weight-bold { font-weight: 700!important; }
.font-weight-semi-bold { font-weight: 600!important; }
.font-weight-normal { font-weight: 400!important; }
.text-uppercase { text-transform: uppercase!important; }
.text-capitalize { text-transform: capitalize!important; }
.text-normal { text-transform: none!important; }
.font-italic { font-style: italic!important; }
.font-normal { font-stretch: normal!important; }
.text-left { text-align: left!important; }
.text-center { text-align: center!important; }
.text-right { text-align: right!important; }
Text Color
.text-white { color: #fff!important; }
.text-light { color: var(--alpha-light-color,var(--alpha-light-color,#ccc))!important; }
.text-grey { color: #999!important; }
.text-body { color: var(--alpha-body-color)!important; }
.text-primary { color: var(--alpha-primary-color,#2879FE)!important; }
.text-secondary { color: var(--alpha-secondary-color,#ff9742)!important; }
.text-success { color: #799b5a!important; }
.text-info { color: #369!important; }
.text-warning { color: #ffa800!important; }
.text-danger { color: #a94442!important; }
.text-dark { color: var(--alpha-dark-color,#333)!important; }
.text-black { color: #000!important; }
Letter Spacing , Line Height
.ls-s { letter-spacing: -0.01em!important; }
.ls-m { letter-spacing: -0.025em!important; }
.ls-l { letter-spacing: -0.05em!important; }
.ls-normal { letter-spacing: 0!important; }
.lh-1 { line-height: 1!important; }
Background Color
.bg-white { background-color: #fff!important; }
.bg-dark { background-color: var(--alpha-dark-color,#333)!important; }
.bg-grey { background-color: #999!important; }
.bg-light { background-color: var(--alpha-light-color,var(--alpha-light-color,#ccc))!important; }
.bg-black { background-color: #000!important; }
.bg-primary { background-color: var(--alpha-primary-color,#2879FE)!important; }
.bg-secondary { background-color: var(--alpha-secondary-color,#d26e4b)!important; }
Border
.border-no { border: none!important; }
.br-3 { border-radius: 3px!important; }
.br-5 { border-radius: 5px!important; }


By browsing this website, you agree to our privacy policy.
I Agree