.d-flex{
display: flex;
}
.d-block{
display: block;
}
.d-none{
display: none;
}
.d-grid{
display: grid;
}
.d-inline-block{
display: inline-block;
}
.justify-between{
justify-content: space-between;
}
.justify-center{
justify-content: center;
}
.justify-end{
justify-content: end;
}
.justify-start{
justify-content: start;
}
.items-center{
align-items: center;
}
.items-end{
align-items: end;
}
.items-start{
align-items: start;
}
.flex-wrap{
flex-wrap: wrap;
}
.flex-wrap-reverse{
flex-wrap: wrap-reverse;
}
.flex-nowrap{
flex-wrap: nowrap;
}
.flex-row{
flex-direction: row;
}
.flex-row-reverse{
flex-direction: row-reverse;
}
.flex-col{
flex-direction: column;
}
.flex-col-reverse{
flex-direction: column-reverse;
}
.self-start{
align-self: flex-start;
}
.self-end{
align-self: flex-end;
}
.w-100{
width: 100%;
}
.h-100{
height: 100%;
}
.gap-0{
gap: 0;
}
.gap-1{
gap: 10px;
}
.gap-2{
gap: 20px;
}
.gap-3{
gap: 30px;
}
.gap-4{
gap: 40px;
}
.gap-5{
gap: 50px;
}
.gap-6{
gap: 60px;
}
.gap-7{
gap: 70px;
}
.gap-8{
gap: 80px;
}
.gap-9{
gap: 90px;
}
.gap-10{
gap: 100px;
}
.row-gap-1{
row-gap: 10px;
}
.row-gap-2{
row-gap: 20px;
}
.row-gap-3{
row-gap: 30px;
}
.row-gap-4{
row-gap: 40px;
}
.row-gap-5{
row-gap: 50px;
}
.col-gap-1{
column-gap: 10px;
}
.col-gap-2{
column-gap: 20px;
}
.col-gap-3{
column-gap: 30px;
}
.col-gap-4{
column-gap: 40px;
}
.col-gap-5{
column-gap: 50px;
}
.mb-0{
margin-bottom: 0;
}
.mr-1{
margin-right: 10px;
}
.mr-2{
margin-right: 20px;
}
.mr-3{
margin-right: 30px;
}
.mr-4{
margin-right: 40px;
}
.mr-5{
margin-right: 50px;
}
.mb-1{
margin-bottom: 10px;
}
.mb-2{
margin-bottom: 20px;
}
.mb-3{
margin-bottom: 30px;
}
.mb-4{
margin-bottom: 40px;
}
.mb-5{
margin-bottom: 50px;
}
.mb-6{
margin-bottom: 60px;
}
.mt-1{
margin-top: 10px;
}
.mt-2{
margin-top: 20px;
}
.mt-3{
margin-top: 30px;
}
.mt-4{
margin-top: 40px;
}
.mt-5{
margin-top: 50px;
}
.mt-6{
margin-top: 60px;
}
.mt-7{
margin-top: 70px;
}
.mt-8{
margin-top: 80px;
}
.mt-9{
margin-top: 90px;
}
.p-0{
padding: 0;
}
.p-1{
padding: 10px;
}
.p-2{
padding: 20px;
}
.p-3{
padding: 30px;
}
.p-4{
padding: 40px;
}
.p-5{
padding: 50px;
}
.p-6{
padding: 60px;
}
.pt-0{
padding-top: 0;
}
.pt-1{
padding-top: 10px;
}
.pt-2{
padding-top: 20px;
}
.pt-3{
padding-top: 30px;
}
.pt-4{
padding-top: 40px;
}
.pt-5{
padding-top: 50px;
}
.pr-1{
padding-right: 10px;
}
.pr-2{
padding-right: 20px;
}
.pr-3{
padding-right: 30px;
}
.pr-4{
padding-right: 40px;
}
.pr-5{
padding-right: 50px;
}
.pb-1{
padding-bottom: 10px;
}
.pb-2{
padding-bottom: 20px;
}
.pb-3{
padding-bottom: 30px;
}
.pb-4{
padding-bottom: 40px;
}
.pb-5{
padding-bottom: 50px;
}
.pointer{
cursor: pointer;
}
.relative{
position: relative;
}
.absolute{
position: absolute;
}
.mt-auto{
margin-top: auto;
}
.fw-500{
font-weight: 500;
}
.col-1{
grid-template-columns: repeat(1, 1fr);
}
.col-2{
grid-template-columns: repeat(2, 1fr);
}
.col-3{
grid-template-columns: repeat(3, 1fr);
}
.col-4{
grid-template-columns: repeat(4, 1fr);
}
.col-5{
grid-template-columns: repeat(5, 1fr);
}
.col-6{
grid-template-columns: repeat(6, 1fr);
}
.text-center{
text-align: center;
}
.text-left{
text-align: left;
}
.text-right{
text-align: right;
}
.z-1{
z-index: 10;
}
.z-2{
z-index: 20;
}
.z-3{
z-index: 30;
}
.z-4{
z-index: 40;
}
.z-5{
z-index: 50;
}
.hidden{
overflow: hidden;
}
.overflow-auto{
overflow: auto;
}
.bold{
font-weight: 700 !important;
}
.semi-bold{
font-weight: 600 !important;
}
.extra-bold{
font-weight: 800 !important;
}
.medium{
font-weight: 500 !important;
}
.regular{
font-weight: 400 !important;
}
.uppercase{
text-transform: uppercase;
}
.no-break{
word-break: normal !important;
}
.nowrap{
white-space: nowrap;
}
.fs-12{
font-size: 12px !important;
}
.fs-13{
font-size: 13px !important;
}
.fs-14{
font-size: 14px !important;
}
.fs-15{
font-size: 15px !important;
}
.fs-16{
font-size: 16px !important;
}
.fs-17{
font-size: 17px !important;
}
.fs-18{
font-size: 18px !important;
}
.fs-19{
font-size: 19px !important;
}
.fs-20{
font-size: 20px !important;
}
.lh-15{
line-height: 150% !important;
}
.radius-1{
border-radius: 10px;
}
.radius-2{
border-radius: 20px;
}
.mx-100{
max-width: 100%;
}
@media (max-width: 1599px) {
.xxl\:d-grid {
display: grid;
}
.xxl\:d-flex {
display: flex;
}
.xxl\:d-block {
display: block;
}
.xxl\:d-none {
display: none;
}
.xxl\:col-1 {
grid-template-columns: repeat(1, 1fr);
}
.xxl\:col-2 {
grid-template-columns: repeat(2, 1fr);
}
.xxl\:col-3 {
grid-template-columns: repeat(3, 1fr);
}
.xxl\:gap-1 {
gap: 10px;
}
.xxl\:gap-2 {
gap: 20px;
}
.xxl\:gap-3 {
gap: 30px;
}
.xxl\:gap-4 {
gap: 40px;
}
.xxl\:gap-5 {
gap: 50px;
}
.xxl\:gap-6 {
gap: 60px;
}
.xxl\:gap-7 {
gap: 70px;
}
.xxl\:gap-8 {
gap: 80px;
}
.xxl\:gap-9 {
gap: 90px;
}
.xxl\:gap-10 {
gap: 100px;
}
.xxl\:flex-col{
flex-direction: column;
}
.xxl\:flex-row{
flex-direction: row;
}
.xxl\:flex-col-reverse{
flex-direction: column-reverse;
}
.xxl\:items-end{
align-items: end;
}
.xxl\:w-100{
width: 100%;
}
.xxl\:p-0{
padding: 0;
}
.xxl\:gap-1{
gap: 10px;
}
.xxl\:gap-2{
gap: 20px;
}
.xxl\:gap-3{
gap: 30px;
}
.xxl\:gap-4{
gap: 40px;
}
.xxl\:gap-5{
gap: 50px;
}
.xxl\:p-0{
padding: 0;
}
.xxl\:p-1{
padding: 10px;
}
.xxl\:p-2{
padding: 20px;
}
.xxl\:p-3{
padding: 30px;
}
.xxl\:p-4{
padding: 40px;
}
.xxl\:p-5{
padding: 50px;
}
.xxl\:pr-0{
padding-right: 0;
}
.xxl\:mt-1{
margin-top: 10px;
}
.xxl\:mt-2{
margin-top: 20px;
}
.xxl\:mt-3{
margin-top: 30px;
}
}
@media (max-width: 1199px) {
.xl\:d-flex {
display: flex;
}
.xl\:d-block {
display: block;
}
.xl\:d-grid {
display: grid;
}
.xl\:d-none {
display: none;
}
.xl\:flex-wrap{
flex-wrap: wrap;
}
.xl\:gap-0 {
gap: 0;
}
.xl\:gap-1 {
gap: 10px;
}
.xl\:gap-2 {
gap: 20px;
}
.xl\:gap-3 {
gap: 30px;
}
.xl\:gap-4 {
gap: 40px;
}
.xl\:gap-5 {
gap: 50px;
}
.xl\:gap-6 {
gap: 60px;
}
.xl\:gap-7 {
gap: 70px;
}
.xl\:gap-8 {
gap: 80px;
}
.xl\:gap-9 {
gap: 90px;
}
.xl\:gap-10 {
gap: 100px;
}
.xl\:row-gap-1 {
row-gap: 10px;
}
.xl\:row-gap-2 {
row-gap: 20px;
}
.xl\:row-gap-3 {
row-gap: 30px;
}
.xl\:col-gap-1 {
column-gap: 10px;
}
.xl\:col-gap-2 {
column-gap: 20px;
}
.xl\:col-gap-3 {
column-gap: 30px;
}
.xl\:flex-col{
flex-direction: column;
}
.xl\:self-start{
align-self: flex-start;
}
.xl\:self-end{
align-self: flex-end;
}
.xl\:col-1{
grid-template-columns: repeat(1, 1fr);
}
.xl\:col-2{
grid-template-columns: repeat(2, 1fr);
}
.xl\:col-3{
grid-template-columns: repeat(3, 1fr);
}
.xl\:col-4{
grid-template-columns: repeat(4, 1fr);
}
.xl\:col-5{
grid-template-columns: repeat(5, 1fr);
}
.xl\:flex-col-reverse{
flex-direction: column-reverse;
}
.xl\:flex-row{
flex-direction: row;
}
.xl\:flex-row-reverse{
flex-direction: row-reverse;
}
.xl\:justify-center{
justify-content: center;
}
.xl\:justify-start{
justify-content: start;
}
.xl\:justify-end{
justify-content: end;
}
.xl\:items-start{
align-items: start;
}
.xl\:w-100{
width: 100%;
}
.xl\:h-100{
height: 100%;
}
.xl\:p-0{
padding: 0;
}
.xl\:p-1{
padding: 10px;
}
.xl\:p-2{
padding: 20px;
}
.xl\:p-3{
padding: 30px;
}
.xl\:p-4{
padding: 40px;
}
.xl\:p-5{
padding: 50px;
}
.xl\:pr-0{
padding-right: 0;
}
.xl\:hidden{
overflow: hidden;
}
.xl\:mt-0{
margin-top: 0;
}
.xl\:mt-1{
margin-top: 10px;
}
.xl\:mt-2{
margin-top: 20px;
}
.xl\:mt-3{
margin-top: 30px;
}
.xl\:mt-4{
margin-top: 40px;
}
.xl\:mt-5{
margin-top: 50px;
}
.xl\:mb-0{
margin-bottom: 0;
}
.xl\:mb-1{
margin-bottom: 10px;
}
.xl\:mb-2{
margin-bottom: 20px;
}
.xl\:mb-3{
margin-bottom: 30px;
}
.xl\:mb-4{
margin-bottom: 40px;
}
.xl\:mb-5{
margin-bottom: 50px;
}
}
@media (max-width: 991.98px) {
.lg\:d-flex {
display: flex;
}
.lg\:d-block {
display: block;
}
.lg\:d-grid {
display: grid;
}
.lg\:d-none {
display: none;
}
.lg\:gap-0 {
gap: 0;
}
.lg\:gap-1 {
gap: 10px;
}
.lg\:gap-2 {
gap: 20px;
}
.lg\:gap-3 {
gap: 30px;
}
.lg\:gap-4 {
gap: 40px;
}
.lg\:gap-5 {
gap: 50px;
}
.lg\:gap-6 {
gap: 60px;
}
.lg\:gap-7 {
gap: 70px;
}
.lg\:gap-8 {
gap: 80px;
}
.lg\:gap-9 {
gap: 90px;
}
.lg\:gap-10 {
gap: 100px;
}
.lg\:flex-col{
flex-direction: column;
}
.lg\:flex-row{
flex-direction: row;
}
.lg\:flex-col-reverse{
flex-direction: column-reverse;
}
.lg\:flex-row-reverse{
flex-direction: row-reverse;
}
.lg\:items-start{
align-items: start;
}
.lg\:items-end{
align-items: end;
}
.lg\:self-end{
align-self: flex-end;
}
.lg\:w-100{
width: 100%;
}
.lg\:p-0{
padding: 0;
}
.lg\:p-1{
padding: 10px;
}
.lg\:p-2{
padding: 20px;
}
.lg\:p-3{
padding: 30px;
}
.lg\:p-4{
padding: 40px;
}
.lg\:p-5{
padding: 50px;
}
.lg\:mb-0{
margin: 0;
}
.lg\:mb-2{
margin-bottom: 20px;
}
.lg\:mb-3{
margin-bottom: 30px;
}
.lg\:mb-4{
margin-bottom: 40px;
}
.lg\:mb-5{
margin-bottom: 50px;
}
.lg\:mt-0{
margin-top: 0;
}
.lg\:mt-1{
margin-top: 10px;
}
.lg\:mt-2{
margin-top: 20px;
}
.lg\:mt-3{
margin-top: 30px;
}
.lg\:mt-4{
margin-top: 40px;
}
.lg\:col-1{
grid-template-columns: repeat(1, 1fr);
}
.lg\:col-2{
grid-template-columns: repeat(2, 1fr);
}
.lg\:col-3{
grid-template-columns: repeat(3, 1fr);
}
.lg\:col-4{
grid-template-columns: repeat(4, 1fr);
}
}
@media (max-width: 767px) {
.md\:d-flex {
display: flex;
}
.md\:d-block {
display: block;
}
.md\:d-grid {
display: grid;
}
.md\:d-none {
display: none;
}
.md\:gap-0 {
gap: 0;
}
.md\:gap-1 {
gap: 10px;
}
.md\:gap-2 {
gap: 20px;
}
.md\:gap-3 {
gap: 30px;
}
.md\:gap-4 {
gap: 40px;
}
.md\:gap-5 {
gap: 50px;
}
.md\:gap-6 {
gap: 60px;
}
.md\:gap-7 {
gap: 70px;
}
.md\:gap-8 {
gap: 80px;
}
.md\:gap-9 {
gap: 90px;
}
.md\:gap-10 {
gap: 100px;
}
.md\:flex-wrap{
flex-wrap: wrap;
}
.md\:flex-col{
flex-direction: column;
}
.md\:flex-col-reverse{
flex-direction: column-reverse;
}
.md\:flex-row-reverse{
flex-direction: row-reverse;
}
.md\:items-start{
align-items: start;
}
.md\:items-center{
align-items: center;
}
.md\:justify-center{
justify-content: center;
}
.md\:justify-end{
justify-content: end;
}
.md\:w-100{
width: 100%;
}
.md\:p-0{
padding: 0;
}
.md\:p-1{
padding: 10px;
}
.md\:p-2{
padding: 20px;
}
.md\:p-3{
padding: 30px;
}
.md\:pl-1{
padding-left: 10px;
}
.md\:pl-2{
padding-left: 20px;
}
.md\:pl-3{
padding-left: 30px;
}
.md\:pr-1{
padding-right: 10px;
}
.md\:pr-2{
padding-right: 20px;
}
.md\:pr-3{
padding-right: 30px;
}
.md\:col-1{
grid-template-columns: repeat(1, 1fr);
}
.md\:col-2{
grid-template-columns: repeat(2, 1fr);
}
.md\:col-3{
grid-template-columns: repeat(3, 1fr);
}
.md\:text-center{
text-align: center;
}
.md\:mb-0{
margin-bottom: 0;
}
.md\:mb-1{
margin-bottom: 10px;
}
.md\:mb-2{
margin-bottom: 20px;
}
.md\:mb-3{
margin-bottom: 30px;
}
.md\:mb-4{
margin-bottom: 40px;
}
.md\:mb-5{
margin-bottom: 50px;
}
.md\:mt-0{
margin-top: 0;
}
.md\:mt-1{
margin-top: 10px;
}
.md\:mt-2{
margin-top: 20px;
}
.md\:mt-3{
margin-top: 30px;
}
.md\:mt-4{
margin-top: 40px;
}
.md\:mt-5{
margin-top: 50px;
}
}
@media (max-width: 575px) {
.sm\:d-flex {
display: flex;
}
.sm\:d-grid {
display: grid;
}
.sm\:d-block {
display: block;
}
.sm\:d-none {
display: none;
}
.sm\:gap-1 {
gap: 10px;
}
.sm\:gap-2 {
gap: 20px;
}
.sm\:gap-3 {
gap: 30px;
}
.sm\:gap-4 {
gap: 40px;
}
.sm\:gap-5 {
gap: 50px;
}
.sm\:gap-6 {
gap: 60px;
}
.sm\:gap-7 {
gap: 70px;
}
.sm\:gap-8 {
gap: 80px;
}
.sm\:gap-9 {
gap: 90px;
}
.sm\:gap-10 {
gap: 100px;
}
.sm\:flex-col{
flex-direction: column;
}
.sm\:flex-wrap{
flex-wrap: wrap;
}
.sm\:flex-nowrap{
flex-wrap: nowrap;
}
.sm\:flex-col-reverse{
flex-direction: column-reverse;
}
.sm\:items-start{
align-items: start;
}
.sm\:items-center{
align-items: center;
}
.sm\:justify-center{
justify-content: center;
}
.sm\:justify-between{
justify-content: space-between;
}
.sm\:w-100{
width: 100%;
}
.sm\:p-0{
padding: 0;
}
.sm\:p-1{
padding: 10px;
}
.sm\:p-2{
padding: 20px;
}
.sm\:p-3{
padding: 30px;
}
.sm\:pr-0{
padding-right: 0;
}
.sm\:pr-1{
padding-right: 10px;
}
.sm\:pr-2{
padding-right: 20px;
}
.sm\:pt-1{
padding-top: 10px;
}
.sm\:pt-2{
padding-top: 20px;
}
.sm\:mt-6{
margin-top: 60px;
}
.sm\:mb-1{
margin-bottom: 10px;
}
.sm\:mb-2{
margin-bottom: 20px;
}
.sm\:mb-3{
margin-bottom: 30px;
}
.sm\:mb-4{
margin-bottom: 40px;
}
.sm\:mt-0{
margin-top: 0;
}
.sm\:mt-1{
margin-top: 10px;
}
.sm\:mt-2{
margin-top: 20px;
}
.sm\:mt-3{
margin-top: 30px;
}
.sm\:mt-4{
margin-top: 40px;
}
.sm\:mt-5{
margin-top: 50px;
}
.sm\:mt-6{
margin-top: 60px;
}
.sm\:mt-7{
margin-top: 70px;
}
.sm\:mr-0{
margin-right: 0;
}
.sm\:col-1{
grid-template-columns: repeat(1, 1fr);
}
.sm\:col-2{
grid-template-columns: repeat(2, 1fr);
}
.sm\:text-left{
text-align: left;
}
.sm\:text-center{
text-align: center;
}
.sm\:text-right{
text-align: right;
}
.sm\:fs-15{
font-size: 15px !important;
}
.sm\:fs-16{
font-size: 16px !important;
}
.sm\:fs-17{
font-size: 17px !important;
}
.sm\:fs-18{
font-size: 18px !important;
}
}