/* flex box */
.d-flex {
    display: flex;
}

.f-align-end {
    align-items: end;
}

.f-justify-center {
    justify-content: center;
}

.f-align-center {
    align-items: center;
}

.f-justify-between {
    justify-content: space-between;
}

.flex-wrap {
    flex-wrap: wrap;
}

.d-f-colection-colum {
    flex-direction: column;
}

/* container */
.container-xl {
    max-width: 1200px;
    margin: auto;
    padding: 0 16px;
}

/* font */
:root {
    --bg-color: #058689;
    --bg-primary: #ffca33;
    --bg-title: #1d93e3
}

/* width */
.w-50 {
    width: 50%;
}

.w-33 {
    width: 32%;
}

.w-25 {
    width: 24%;
}

.w-82 {
    width: 82%;
}

.w-15 {
    width: 15%;
}

.w-60 {
    width: 59%;
}

.w-40 {
    width: 39%;
}

.w-100 {
    width: 100%;
}

/* margin */
.margin-auto {
    margin: auto;
}

.m-t-b-64px {
    margin-top: 32px;
}

.m-t-b-16px {
    margin: 16px 0;
}

.padding-t-b {
    padding: 32px 0;
}

.padding-16 {
    padding: 16px;
}

.padding-8 {
    padding: 8px;
}

.mb-16 {
    margin-bottom: 16px;
}

.mb-32 {
    margin-bottom: 32px;
}

path {
    fill: white !important;
}

/* position */
.postion-relative {
    position: relative;
}

.postion-absolute {
    position: absolute;
}

/* video */