/* =============================================================================
! FONT FAMILY
============================================================================= */

.poppins {
    font-family: "Poppins", sans-serif;
}

.open-sans {
    font-family: "Open Sans", sans-serif;
}

/* =============================================================================

! FONT WEIGHT

============================================================================= */

.lighter {
    font-weight: lighter;
}

.normal {
    font-weight: normal;
}

.semi-bold {
    font-weight: 600;
}

.bold {
    font-weight: bold;
}

/* =============================================================================

! FONT STYLE

============================================================================= */

.italic {
    font-style: italic;
}

.oblique {
    font-style: oblique;
}

/* =============================================================================

! FONT SIZE

============================================================================= */

.font12px {
    font-size: 12px;
}

.font14px {
    font-size: 14px;
}

.font16px {
    font-size: 16px;
}

.font18px {
    font-size: 18px;
}

.font24px {
    font-size: 24px;
}

.font30px {
    font-size: 30px;
}

.font36px {
    font-size: 36px;
}

.font42px {
    font-size: 42px;
}

.font48px {
    font-size: 48px;
}

/* =============================================================================

! LETTER SPACING

============================================================================= */

.letter-spacing1-4px {
    letter-spacing: 1.4px;
}

.letter-spacing1-8px {
    letter-spacing: 1.8px;
}

/* =============================================================================

! TEXT TRANSFORM

============================================================================= */

.transform-none {
    text-transform: none;
}

.capitalize {
    text-transform: capitalize;
}

.uppercase {
    text-transform: uppercase;
}

.lowercase {
    text-transform: lowercase;
}

/* =============================================================================

! TEXT DECORATION

============================================================================= */

.overline {
    text-decoration: overline;
}

.line-through {
    text-decoration: line-through;
}

.underline {
    text-decoration: underline;
}

.over-and-under {
    text-decoration: underline overline;
}

/* =============================================================================

! TEXT ALIGN

============================================================================= */

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.center {
    text-align: center;
}

/* =============================================================================

! BORDER

============================================================================= */

.border-none {
    border: none;
}

.border-radius10px {
    border-radius: 10px;
}

.border-radius20px {
    border-radius: 20px;
}

.border-radius99px {
    border-radius: 99px;
}

/* =============================================================================

! COLOR

============================================================================= */

.color-black {
    color: #000;
}

.color-white {
    color: #fff;
}

.color-vivid-gamboge {
    color: #ff6f00;
}

.color-vivid-gamboge:hover {
    color: #ff8c00;
}

/* =============================================================================

! BACKGROUND COLOR

============================================================================= */

.bg-white {
    background-color: #fff;
}

.bg-black {
    background-color: #000;
}

.bg-vivid-gamboge {
    background-color: #ff6f00;
}

/* =============================================================================

! TRANSFORM

============================================================================= */

.scale01:hover {
    transform: scale(1.01);
}