/* Auxiliary Classes */

.flex { display: flex; }
.inline-flex {display: inline-flex}

.flex-1 { flex: 1; }
.flex-2 { flex: 2; }
.flex-3 { flex: 3; }
.flex-4 { flex: 4; }
.flex-5 { flex: 5; }
.flex-5 { flex: 6; }
.flex-align-start { align-items: flex-start; }
.flex-align-center { align-items: center; }
.flex-align-end { align-items: flex-end; }
.flex-align-stretch { align-items: stretch; }
.flex-justify-start { justify-content: flex-start; }
.flex-justify-center { justify-content: center; }
.flex-justify-end { justify-content: flex-end; }
.flex-space-between { justify-content: space-between; }
.flex-col { flex-direction: column; }
.flex-row { flex-direction: row; }
.flex-row-reverse { flex-direction: row-reverse; }
.flex-wrap { flex-wrap: wrap; }
.flex-shrink-0 { flex-shrink: 0;}
.flex-self-stretch { align-self: stretch; }

.grid { display: grid; }

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

.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid-2-1 { grid-template-columns: 2fr 1fr; }
.grid-2-3 { grid-template-columns: 2fr 3fr; }
.grid-3-2 { grid-template-columns: 3fr 2fr; }
.grid-40-60 { grid-template-columns: 40% 60%; }
.grid-20-80 { grid-template-columns: 20% 80%; }
.grid-auto { grid-template-columns: repeat(auto-fill, minmax(min(360px, 100%), 1fr)); }
.grid-auto-medium { grid-template-columns: repeat(auto-fill, minmax(min(330px, 100%), 1fr)); }
.grid-auto-video { grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr)); }
.grid-auto-250 { grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); }
.grid-auto-small { grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr)); }
.grid-max-content { grid-auto-rows: max-content; }
.grid-ltr { direction: ltr; }
.grid-rtl { direction: rtl; }
.grid-flow-col { grid-auto-flow: column; }

.gap-0 { gap: 0; }
.gap-5 { gap: 5px; }
.gap-10 { gap: 10px; }
.gap-15 { gap: 15px; }
.gap-16 { gap: 16px; }
.gap-20 { gap: 20px; }
.gap-25 { gap: 25px; }
.gap-30 { gap: 30px; }
.gap-40 { gap: 40px; }
.gap-50 { gap: 50px; }
.gap-60 { gap: 60px; }
.gap-70 { gap: 70px; }
.gap-80 { gap: 80px; }
.gap-90 { gap: 90px; }
.gap-100 { gap: 100px; }
.gap-120 { gap: 120px; }
.gap-160 { gap: 160px; }

.gap-inline-10 { gap: 0 10px; }
.gap-inline-30 { gap: 0 30px; }
.gap-block-10 { gap: 10px 0; }
.gap-block-15 { gap: 15px 0; }
.gap-15-30 { gap: 15px 30px; }
.gap-col-40 { column-gap: 40px; }
.gap-row-10 { row-gap: 10px;}

.m-0 { margin: 0;}
.m-10 { margin: 10px;}
.m-block-0 { margin-block: 0; }
.m-block-10 { margin-block: 10px; }
.m-block-20 { margin-block: 20px; }
.m-block-30 { margin-block: 30px; }
.m-inline-10 { margin-inline: 10px; }
.m-inline-auto { margin-inline: auto; }
.m-b-0 { margin-bottom: 0; }
.m-b-5 { margin-bottom: 5px; }
.m-b-10 { margin-bottom: 10px; }
.m-b-15 { margin-bottom: 15px; }
.m-b-16 { margin-bottom: 16px; }
.m-b-20 { margin-bottom: 20px; }
.m-b-30 { margin-bottom: 30px; }
.m-b-40 { margin-bottom: 40px; }
.m-b-50 { margin-bottom: 50px; }
.m-b-60 { margin-bottom: 60px; }
.m-b-80 { margin-bottom: 80px; }
.m-b-100 { margin-bottom: 100px; }
.m-b--180 { margin-bottom: -180px; }
.m-t-0 { margin-top: 0; }
.m-t-5 { margin-top: 5px; }
.m-t-10 { margin-top: 10px; }
.m-t-15 { margin-top: 15px; }
.m-t-20 { margin-top: 20px; }
.m-t-30 { margin-top: 30px; }
.m-t-40 { margin-top: 40px; }
.m-t-50 { margin-top: 50px; }
.m-t-60 { margin-top: 60px; }
.m-t-100 { margin-top: 100px; }
.m-t--20 { margin-top: -20px; }
.m-t--30 { margin-top: -30px; }
.m-t--50 { margin-top: -50px; }
.m-t--80 { margin-top: -80px; }

.p-0 { padding: 0; }
.p-5 { padding: 5px; }
.p-10 { padding: 10px; }
.p-15 { padding: 15px; }
.p-20 { padding: 20px; }
.p-20 { padding: 20px; }
.p-25 { padding: 25px; }
.p-30 { padding: 30px; }
.p-40 { padding: 40px; }
.p-50 { padding: 50px; }
.p-60 { padding: 60px; }
.p-b-0 { padding-bottom: 0; }
.p-b-10 { padding-bottom: 10px; }
.p-b-20 { padding-bottom: 20px; }
.p-b-50 { padding-bottom: 50px; }
.p-l-15 { padding-left: 15px; }
.p-l-20 { padding-left: 20px; }
.p-l-40 { padding-left: 40px; }
.p-l-80 { padding-left: 80px; }
.p-r-20 { padding-right: 20px; }
.p-r-30 { padding-right: 30px; }
.p-r-40 { padding-right: 40px; }
.p-r-60 { padding-right: 60px; }
.p-t-0 { padding-top: 0; }
.p-t-30 { padding-top: 30px; }
.p-t-50 { padding-top: 50px; }
.p-t-90 { padding-top: 90px; }
.p-t-100 { padding-top: 100px; }
.p-t-150 { padding-top: 150px; }
.p-y-5 { padding-block: 5px; }
.p-y-10 { padding-block: 10px; }
.p-y-20 { padding-block: 20px; }
.p-y-30 { padding-block: 30px; }
.p-y-40 { padding-block: 40px; }
.p-y-50 { padding-block: 50px; }
.p-y-60 { padding-block: 60px; }
.p-y-100 { padding-block: 100px; }
.p-y-120 { padding-block: 120px; }
.p-inline-10 { padding-inline: 10px; }
.p-inline-15 { padding-inline: 15px; }
.p-inline-20 { padding-inline: 20px; }
.p-inline-25 { padding-inline: 25px; }
.p-inline-30 { padding-inline: 30px; }
.p-inline-40 { padding-inline: 40px; }

.max-w-25 { max-width: 25%; }
.max-w-30 { max-width: 30%; }
.max-w-33 { max-width: 33%; }
.max-w-40 { max-width: 40%; }
.max-w-45 { max-width: 45%; }
.max-w-48 { max-width: 48%; }
.max-w-50 { max-width: 50%; }
.max-w-60 { max-width: 60%; }
.max-w-66 { max-width: 66%; }

.min-h-0 { min-height: 0; }
.min-w-50 { min-width: 50%; }

.w-24 { width: 24px; }
.w-30 { width: 30%; }
.w-40 { width: 40%; }
.w-50 { width: 50%; }
.w-60 { width: 60%; }
.w-100 { width: 100%; }

.h-100 { height: 100%; }
.h-auto { height: auto; }

.bg-white { background: #ffffff; }

.border-r-5 { border-radius: 5px; }
.border-r-10 { border-radius: 10px; }
.border-r-100 { border-radius: 100px; }

.relative { position: relative; }
.absolute { position: absolute; }

.list-2-col { column-count: 2; }
.list-3-col { column-count: 3; }
.list-4-col { column-count: 4; }

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

.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-upper { text-transform: uppercase; }
.text-small { font-size: 0.8125rem; }
.font-w-600 { font-weight: 600; }

.t-01 { transition: 0.1s; }
.t-02 { transition: 0.2s; }
.t-03 { transition: 0.3s; }
.t-05 { transition: 0.5s; }

.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-30 { z-index: 30; }
.z-index-100 { z-index: 100; }

.balanced { text-wrap: balance; }


/* md */
@media( max-width: 1024px ) {
    .md-flex-col { flex-direction: column; }
    .md-flex-align-center { align-items: center; }
    .md-gap-20 { gap: 20px; }
    .md-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* sm */
@media( max-width: 640px ) {
    .sm-grid-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .sm-flex-col { flex-direction: column; }
    .sm-flex-align-start { align-items: flex-start; }
    .sm-gap-30 { gap: 30px; }
}