
/**
*  Tailwind css
*/


/********************************************************************************/
/**             Border Radius                                                   */
/********************************************************************************/
.rounded-full {
	border-radius: 9999px;
}
.rounded-lg {
	border-radius: 12px;
}
.rounded-md {
	border-radius: 8px;
}
.rounded-sm {
	border-radius: 4px;
}
.rounded-none {
	border-radius: 0;
}


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

.text-14px {
    font-size: 14px !important;
}
.text-16px {
    font-size: 16px !important;
}



/********************************************************************************/
/**             Text Color Gray                                                 */
/********************************************************************************/
.text-gray-100 {
    color: #f7fafc;
}
.text-gray-200 {
    color: #edf2f7;
}
.text-gray-300 {
    color: #e2e8f0;
}
.text-gray-400 {
    color: #cbd5e0;
}
.text-gray-500 {
    color: #a0aec0;
}
.text-gray-600 {
    color: #718096;
}
.text-gray-700 {
    color: #4a5568;
}
.text-gray-800 {
    color: #2d3748;
}
.text-gray-900 {
    color: #1a202c;
}
.text-gray-custom-1 {
    color: #374151;
}



/********************************************************************************/
/**             Text Color White                                                */
/********************************************************************************/

.text-white {
    color: #fff;
}

/********************************************************************************/
/**             Text Color BLACK                                                */
/********************************************************************************/
.text-black {
    color: #000;
}
.text-black-important {
    color: #000 !important;
}


/********************************************************************************/
/**             Text Color Red                                                  */
/********************************************************************************/
.text-red-100 {
    color: #fff5f5;
}
.text-red-200 {
    color: #fed7d7;
}
.text-red-300 {
    color: #feb2b2;
}
.text-red-400 {
    color: #fc8181;
}
.text-red-500 {
    color: #f56565;
}
.text-red-600 {
    color: #e53e3e;
}
.text-red-700 {
    color: #c53030;
}
.text-red-800 {
    color: #9b2c2c;
}
.text-red-900 {
    color: #742a2a;
}


/********************************************************************************/
/**             Text Color Orange                                               */
/********************************************************************************/

.text-orange-100 {
    color: #fffaf0;
}
.text-orange-200 {
    color: #feebc8;
}
.text-orange-300 {
    color: #fbd38d;
}
.text-orange-400 {
    color: #f6ad55;
}
.text-orange-500 {
    color: #ed8936;
}
.text-orange-600 {
    color: #dd6b20;
}
.text-orange-700 {
    color: #c05621;
}
.text-orange-800 {
    color: #9c4221;
}
.text-orange-900 {
    color: #7b341e;
}



/********************************************************************************/
/**             Text Color Yellow                                               */
/********************************************************************************/


.text-yellow-100 {
    color: #fffff0;
}
.text-yellow-200 {
    color: #fefcbf;
}
.text-yellow-300 {
    color: #faf089;
}
.text-yellow-400 {
    color: #f6e05e;
}
.text-yellow-500 {
    color: #ecc94b;
}
.text-yellow-600 {
    color: #d69e2e;
}
.text-yellow-700 {
    color: #b7791f;
}
.text-yellow-800 {
    color: #975a16;
}
.text-yellow-900 {
    color: #744210;
}


/********************************************************************************/
/**             Text Color Green                                                */
/********************************************************************************/

.text-green-100 {
    color: #f0fff4;
}
.text-green-200 {
    color: #c6f6d5;
}
.text-green-300 {
    color: #9ae6b4;
}
.text-green-400 {
    color: #68d391;
}
.text-green-500 {
    color: #48bb78;
}
.text-green-600 {
    color: #38a169;
}
.text-green-700 {
    color: #2f855a;
}
.text-green-800 {
    color: #276749;
}
.text-green-900 {
    color: #22543d;
}




/********************************************************************************/
/**             FONTS                                                           */
/********************************************************************************/
.font-bold {
    font-weight: 700;
}
.font-semibold {
    font-weight: 600;
}
.font-normal {
    font-weight: 400;
}
.font-light {
    font-weight: 300;
}
.font-thin {
    font-weight: 100;
}
.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.text-justify {
    text-align: justify;
}
.text-xs {
    font-size: 0.75rem;
}
.text-sm {
    font-size: 0.875rem;
}
.text-base {
    font-size: 1rem;
}
.text-lg {
    font-size: 1.125rem;
}
.text-xl {
    font-size: 1.25rem;
}
.text-2xl {
    font-size: 1.5rem;
}
.text-3xl {
    font-size: 1.875rem;
}
.text-4xl {
    font-size: 2.25rem;
}
.text-5xl {
    font-size: 3rem;
}

/********************************************************************************/
/**             WIDTHS                                                          */
/********************************************************************************/


.w-full {
    width: 100%;
}
.w-1-2 {
    width: 50%;
}
.w-1-3 {
    width: 33.333333%;
}
.w-2-3 {
    width: 66.666667%;
}
.w-1-4 {
    width: 25%;
}
.w-2-4 {
    width: 50%;
}
.w-3-4 {
    width: 75%;
}
.w-1-5 {
    width: 20%;
}
.w-2-5 {
    width: 40%;
}
.w-3-5 {
    width: 60%;
}
.w-4-5 {
    width: 80%;
}
.w-1-6 {
    width: 16.666667%;
}
.w-2-6 {
    width: 33.333333%;
}
.w-3-6 {
    width: 50%;
}
.w-4-6 {
    width: 66.666667%;
}
.w-5-6 {
    width: 83.333333%;
}
.w-1-12 {
    width: 8.333333%;
}
.w-2-12 {
    width: 16.666667%;
}
.w-3-12 {
    width: 25%;
}   


.w-40px {
    width: 40px !important;
}
.w-50px {
    width: 50px !important;
}
.w-80px {
    width: 80px !important; 
}
.w-95px {
    width: 95px !important; 
}
.w-100px {
    width: 100px !important; 
}
.w-150px {
    width: 150px !important; 
}
.w-168px {
    width: 168px !important; 
}

/********************************************************************************/
/**             FLEX                                                            */
/********************************************************************************/

.flex {
    display: flex;
}
.flex-row {
    flex-direction: row;
}
.flex-col {
    flex-direction: column;
}
.justify-start {
    justify-content: flex-start;
}
.justify-end {
    justify-content: flex-end;
}
.justify-center {
    justify-content: center;
}
.justify-between {
    justify-content: space-between;
}
.justify-around {
    justify-content: space-around;
}
.items-start {
    align-items: flex-start;
}
.items-end {
    align-items: flex-end;
}
.items-center {
    align-items: center;
}
.items-baseline {
    align-items: baseline;
}
.items-stretch {
    align-items: stretch;
}
.flex-wrap {
    flex-wrap: wrap;
}
.flex-no-wrap {
    flex-wrap: nowrap;
}
.flex-wrap-reverse {
    flex-wrap: wrap-reverse;
}
.flex-grow {
    flex-grow: 1;
}
.flex-shrink {
    flex-shrink: 1;
}
.flex-no-shrink {
    flex-shrink: 0;
}
.flex-auto {
    flex: 1 1 auto;
}
.flex-initial {
    flex: 0 1 auto;
}
.flex-none {
    flex: none;
}



/********************************************************************************/
/**             Margins                                                         */
/********************************************************************************/
.ml-auto {
    margin-left: auto;
}
.mr-auto {
    margin-right: auto;
}
.mt-auto {
    margin-top: auto;
}
.mb-auto {
    margin-bottom: auto;
}
.m-auto {
    margin: auto;
}
.mx-auto {
    margin-left: auto;
    margin-right: auto;
}
.max-w-screen-sm {
    max-width: 640px;
}
.max-w-screen-md {
    max-width: 768px;
}
.max-w-screen-lg {
    max-width: 1024px;
}
.max-w-screen-xl {
    max-width: 1280px;
}
.max-w-screen-2xl {
    max-width: 1536px;
}
.mx-0 {
    margin-left: 0;
    margin-right: 0;
}
.mx-1 {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}
.mx-2 {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}
.mx-3 {
    margin-left: 0.75rem;
    margin-right: 0.75rem;
}
.mx-4 {
    margin-left: 1rem;
    margin-right: 1rem;
}
.mx-5 {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
}
.mx-6 {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}
.mx-7 {
    margin-left: 1.75rem;
    margin-right: 1.75rem;
}
.mx-8 {
    margin-left: 2rem;
    margin-right: 2rem;
}
.mx-9 {
    margin-left: 2.25rem;
    margin-right: 2.25rem;
}   
.mx-10 {
    margin-left: 2.5rem;
    margin-right: 2.5rem;
}
.mx-11 {
    margin-left: 2.75rem;
    margin-right: 2.75rem;
}
.mx-12 {
    margin-left: 3rem;
    margin-right: 3rem;
}
.mx-16 {
    margin-left: 4rem;
    margin-right: 4rem;
}
.mx-20 {
    margin-left: 5rem;
    margin-right: 5rem;
}



.max-w-none {
    max-width: none !important;
}
.mt-auto {
    margin-top: auto;
}
.mb-auto {
    margin-bottom: auto;
}
.mt-0 {
    margin-top: 0;
}
.mb-0 {
    margin-bottom: 0;
}

.mt-0 {
    margin-top: 0;
}
.mt-1 {
    margin-top: 0.25rem;
}
.mt-2 {
    margin-top: 0.5rem;
}
.mt-3 {
    margin-top: 0.75rem;
}
.mt-4 {
    margin-top: 1rem;
}
.mt-5 {
    margin-top: 1.25rem;
}
.mt-6 {
    margin-top: 1.5rem;
}
.mt-7 {
    margin-top: 1.75rem;
}
.mt-8 {
    margin-top: 2rem;
}
.mt-9 {
    margin-top: 2.25rem;
}
.mt-10 {
    margin-top: 2.5rem;
}
.mt-11 {
    margin-top: 2.75rem;
}
.mt-12 {
    margin-top: 3rem;
}
.mt-16 {
    margin-top: 4rem;
}
.mt-20 {
    margin-top: 5rem;
}
.mt-24 {
    margin-top: 6rem;
}
.mt-124 {
    margin-top: 124px;
}
.mt-5px {
    margin-top: 5px;
}
.mt-10px {
    margin-top: 10px;
}
.mt-15px {
    margin-top: 15px;
}
.-mt-20px {
    margin-top: -20px;
}
.-mt-50px {
    margin-top: -50px;
}
.-mt-60px {
    margin-top: -60px;
}


.mb-0 {
    margin-bottom: 0;
}
.mb-1 {
    margin-bottom: 0.25rem;
}
.mb-2 {
    margin-bottom: 0.5rem;
}
.mb-3 {
    margin-bottom: 0.75rem;
}
.mb-4 {
    margin-bottom: 1rem;
}
.mb-5 {
    margin-bottom: 1.25rem;
}
.mb-6 {
    margin-bottom: 1.5rem;
}
.mb-7 {
    margin-bottom: 1.75rem;
}
.mb-8 {
    margin-bottom: 2rem;
}
.mb-9 {
    margin-bottom: 2.25rem;
}
.mb-10 {
    margin-bottom: 2.5rem;
}
.mb-11 {
    margin-bottom: 2.75rem;
}
.mb-12 {
    margin-bottom: 3rem;
}
.mb-16 {
    margin-bottom: 4rem;
}   

.mb-10px {
    margin-bottom: 10px;
}
.mb-80px {
    margin-bottom: 80px;
}

/********************************************************************************/
/**             Order                                                           */
/********************************************************************************/

.order-first {
    order: -9999;
}
.order-last {
    order: 9999;
}
.order-none {
    order: 0;
}
.order-1 {
    order: 1;
}
.order-2 {
    order: 2;
}
.order-3 {
    order: 3;
}
.order-4 {
    order: 4;
}
.order-5 {
    order: 5;
}
.order-6 {
    order: 6;
}
.order-7 {
    order: 7;
}
.order-8 {
    order: 8;
}
.order-9 {
    order: 9;
}
.order-10 {
    order: 10;
}





/********************************************************************************/
/**             Paddings                                                        */
/********************************************************************************/

.p-0 {
    padding: 0;
}
.p-1 {
    padding: 0.25rem;
}
.p-2 {
    padding: 0.5rem;
}
.p-3 {
    padding: 0.75rem;
}
.p-4 {
    padding: 1rem;
}
.p-5 {
    padding: 1.25rem;
}
.p-6 {
    padding: 1.5rem;
}
.p-7 {
    padding: 1.75rem;
}
.p-8 {
    padding: 2rem;
}
.p-9 {
    padding: 2.25rem;
}
.p-10 {
    padding: 2.5rem;
}
.p-11 {
    padding: 2.75rem;
}
.p-12 {
    padding: 3rem;
}
.p-16 {
    padding: 4rem;
}
.p-20 {
    padding: 5rem;
}
.p-24 {
    padding: 6rem;
}
.p-32 {
    padding: 8rem;
}
.p-40 {
    padding: 10rem;
}
.p-48 {
    padding: 12rem;
}
.p-56 {
    padding: 14rem;
}
.p-64 {
    padding: 16rem;
}
.p-10px {
    padding: 10px !important;
}

.px-0 {
    padding-left: 0;
    padding-right: 0;
}
.px-1 {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}
.px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.px-3 {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}
.px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
}
.px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}
.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}   
.px-7 {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
}
.px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
}
.px-9 {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}
.px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}
.px-11 {
    padding-left: 2.75rem;
    padding-right: 2.75rem;
}
.px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
}
.px-16 {
    padding-left: 4rem;
    padding-right: 4rem;
}
.px-20 {
    padding-left: 5rem;
    padding-right: 5rem;
}
.px-24 {
    padding-left: 6rem;
    padding-right: 6rem;
}
.px-32 {
    padding-left: 8rem;
    padding-right: 8rem;
}
.px-40 {
    padding-left: 10rem;
    padding-right: 10rem;
}
.px-48 {
    padding-left: 12rem;
    padding-right: 12rem;
}
.px-56 {
    padding-left: 14rem;
    padding-right: 14rem;
}
.px-64 {
    padding-left: 16rem;
    padding-right: 16rem;
}
.py-0 {
    padding-top: 0;
    padding-bottom: 0;
}
.py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}
.py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.py-3 {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}
.py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}
.py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}
.py-7 {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}
.py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.py-9 {
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
}
.py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}
.py-11 {
    padding-top: 2.75rem;
    padding-bottom: 2.75rem;
}
.py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
}
.py-20 {
    padding-top: 5rem;
    padding-bottom: 5rem;
}
.py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem;
}
.py-32 {
    padding-top: 8rem;
    padding-bottom: 8rem;
}
.py-40 {
    padding-top: 10rem;
    padding-bottom: 10rem;
}
.py-48 {
    padding-top: 12rem;
    padding-bottom: 12rem;
}
.py-56 {
    padding-top: 14rem;
    padding-bottom: 14rem;
}
.py-64 {
    padding-top: 16rem;
    padding-bottom: 16rem;
}
.pt-0 {
    padding-top: 0;
}
.pt-1 {
    padding-top: 0.25rem;
}
.pt-2 {
    padding-top: 0.5rem;
}
.pt-3 {
    padding-top: 0.75rem;
}
.pt-4 {
    padding-top: 1rem;
}
.pt-5 {
    padding-top: 1.25rem;
}
.pt-6 {
    padding-top: 1.5rem;
}
.pt-7 {
    padding-top: 1.75rem;
}
.pt-8 {
    padding-top: 2rem;
}
.pt-9 {
    padding-top: 2.25rem;
}
.pt-10 {
    padding-top: 2.5rem;
}
.pt-11 {
    padding-top: 2.75rem;
}
.pt-12 {
    padding-top: 3rem;
}
.pt-16 {
    padding-top: 4rem;
}
.pt-20 {
    padding-top: 5rem;
}
.pt-24 {
    padding-top: 6rem;
}
.pt-32 {
    padding-top: 8rem;
}
.pt-40 {
    padding-top: 10rem;
}
.pt-48 {
    padding-top: 12rem;
}
.pt-56 {
    padding-top: 14rem;
}
.pt-64 {
    padding-top: 16rem;
}
.pt-6px {
    padding-top: 6px !important;
}

.pl-0 {
    padding-left: 0;
}
.pl-1 {
    padding-left: 0.25rem;
}
.pl-2 {
    padding-left: 0.5rem;
}
.pl-3 {
    padding-left: 0.75rem;
}
.pl-4 {
    padding-left: 1rem;
}
.pl-5 {
    padding-left: 1.25rem;
}
.pl-6 {
    padding-left: 1.5rem;
}
.pl-7 {
    padding-left: 1.75rem;
}
.pl-8 {
    padding-left: 2rem;
}
.pl-9 {
    padding-left: 2.25rem;
}
.pl-10 {
    padding-left: 2.5rem;
}
.pl-11 {
    padding-left: 2.75rem;
}
.pl-12 {
    padding-left: 3rem;
}
.pl-16 {
    padding-left: 4rem;
}
.pl-20 {
    padding-left: 5rem;
}

.pr-0 {
    padding-right: 0;
}
.pr-1 {
    padding-right: 0.25rem;
}
.pr-2 {
    padding-right: 0.5rem;
}
.pr-3 {
    padding-right: 0.75rem;
}
.pr-4 {
    padding-right: 1rem;
}
.pr-5 {
    padding-right: 1.25rem;
}
.pr-6 {
    padding-right: 1.5rem;
}
.pr-7 {
    padding-right: 1.75rem;
}
.pr-8 {
    padding-right: 2rem;
}
.pr-9 {
    padding-right: 2.25rem;
}
.pr-10 {
    padding-right: 2.5rem;
}
.pr-11 {
    padding-right: 2.75rem;
}
.pr-12 {
    padding-right: 3rem;
}
.pr-16 {
    padding-right: 4rem;
}

.bg-white {
    background: #fff;
}

/********************************************************************************/
/**             Background Color Green                                          */
/********************************************************************************/

.bg-green-100 {
    background-color: #f0fff4;
}
.bg-green-200 {
    background-color: #c6f6d5;
}
.bg-green-300 {
    background-color: #9ae6b4;
}
.bg-green-400 {
    background-color: #68d391;
}
.bg-green-500 {
    background-color: #48bb78;
}
.bg-green-600 {
    background-color: #38a169;
}
.bg-green-700 {
    background-color: #2f855a;
}
.bg-green-800 {
    background-color: #276749;
}
.bg-green-900 {
    background-color: #22543d;
}


/********************************************************************************/
/**             Background Color Red                                            */
/********************************************************************************/

.bg-red-100 {
    background-color: #fff5f5;
}
.bg-red-200 {
    background-color: #fed7d7;
}
.bg-red-300 {
    background-color: #feb2b2;
}
.bg-red-400 {
    background-color: #fc8181;
}
.bg-red-500 {
    background-color: #f56565;
}
.bg-red-600 {
    background-color: #e53e3e;
}
.bg-red-700 {
    background-color: #c53030;
}
.bg-red-800 {
    background-color: #9b2c2c;
}
.bg-red-900 {
    background-color: #742a2a;
}


/********************************************************************************/
/**             Background Color Yellow                                         */
/********************************************************************************/

.bg-yellow-100 {
    background-color: #fffff0;
}
.bg-yellow-200 {
    background-color: #fefcbf;
}
.bg-yellow-300 {
    background-color: #faf089;
}
.bg-yellow-400 {
    background-color: #f6e05e;
}
.bg-yellow-500 {
    background-color: #ecc94b;
}
.bg-yellow-600 {
    background-color: #d69e2e;
}
.bg-yellow-700 {
    background-color: #b7791f;
}
.bg-yellow-800 {
    background-color: #975a16;
}
.bg-yellow-900 {
    background-color: #744210;
}

/********************************************************************************/
/**             Background Color Gray                                           */
/********************************************************************************/


.bg-gray-100 {
    background-color: #f7fafc;
}
.bg-gray-200 {
    background-color: #edf2f7;
}
.bg-gray-300 {
    background-color: #e2e8f0;
}
.bg-gray-400 {
    background-color: #cbd5e0;
}
.bg-gray-500 {
    background-color: #a0aec0;
}
.bg-gray-600 {
    background-color: #718096;
}
.bg-gray-700 {
    background-color: #4a5568;
}
.bg-gray-800 {
    background-color: #2d3748;
}
.bg-gray-900 {
    background-color: #1a202c;
}
.bg-gray-custom-1 {
    background-color: #ededed;
}


/********************************************************************************/
/**             Background Color Blue                                           */
/********************************************************************************/

.bg-blue-100 {
    background-color: #ebf8ff;
}
.bg-blue-200 {
    background-color: #bee3f8;
}
.bg-blue-300 {
    background-color: #90cdf4;
}
.bg-blue-400 {
    background-color: #63b3ed;
}
.bg-blue-500 {
    background-color: #4299e1;
}
.bg-blue-600 {
    background-color: #3182ce;
}
.bg-blue-700 {
    background-color: #2b6cb0;
}
.bg-blue-800 {
    background-color: #2c5282;
}
.bg-blue-900 {
    background-color: #2a4365;
}
.bg-blue-custom {
    background-color: #0966ff;
}



/********************************************************************************/
/**             Font Weight                                                     */
/********************************************************************************/


.fw-0 {
    font-weight: 0;
}
.fw-100 {
    font-weight: 100;
}
.fw-200 {
    font-weight: 200;
}
.fw-300 {
    font-weight: 300;
}
.fw-400 {
    font-weight: 400;
}
.fw-500 {
    font-weight: 500;
}
.fw-600 {
    font-weight: 600;
}
.fw-700 {
    font-weight: 700;
}
.fw-800 {
    font-weight: 800;
}
.fw-900 {
    font-weight: 900;
}



/********************************************************************************/
/**             Overflows                                                       */
/********************************************************************************/

.overflow-auto {
    overflow: auto;
}
.overflow-hidden {
    overflow: hidden;
}
.overflow-visible {
    overflow: visible;
}
.overflow-scroll {
    overflow: scroll;
}
.overflow-x-auto {
    overflow-x: auto;
}
.overflow-x-hidden {
    overflow-x: hidden;
}
.overflow-x-visible {
    overflow-x: visible;
}
.overflow-x-scroll {
    overflow-x: scroll;
}
.overflow-y-auto {
    overflow-y: auto;
}
.overflow-y-hidden {
    overflow-y: hidden;
}
.overflow-y-visible {
    overflow-y: visible;
}
.overflow-y-scroll {
    overflow-y: scroll;
}


/********************************************************************************/
/**             GAPS                                                            */
/********************************************************************************/

.gap-0 {
    gap: 0;
}
    .gap-1 {
        gap: 0.25rem;
}
.gap-2 {
    gap: 0.5rem;
}
.gap-3 {
    gap: 0.75rem;
}
.gap-4 {
    gap: 1rem;
}
.gap-5 {
    gap: 1.25rem;
}
.gap-6 {
    gap: 1.5rem;
}
.gap-7 {
    gap: 1.75rem;
}
.gap-8 {
    gap: 2rem;
}
.gap-9 {
    gap: 2.25rem;
}
.gap-10 {
    gap: 2.5rem;
}
.gap-11 {
    gap: 2.75rem;
}
.gap-12 {
    gap: 3rem;
}
.gap-16 {
    gap: 4rem;
}
.gap-20 {
    gap: 5rem;
}
.gap-24 {
    gap: 6rem;
}
.gap-32 {
    gap: 8rem;
}



/********************************************************************************/
/**             Positions                                                       */
/********************************************************************************/
.absolute {
    position: absolute;
}

.mlr-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}
.mlr-15px {
    margin-left: 15px !important;
    margin-right: 15px !important;
}
.mlr--10px {
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.h-50px {
    height: 50px;
}

.v-align-middle {
    vertical-align: middle !important;
}
.v-align-top {
    vertical-align: top !important;
}
.v-align-bottom {
    vertical-align: bottom !important;
}



.cursor-pointer {
    cursor: pointer;
}


.border-0 {
    border: 0;
}





/* GRIDS */

.grid {
    display: grid;
}

.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }

.grid-cols-none { grid-template-columns: none; }


@media (min-width: 768px) {
    .md\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .md\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .md\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .md\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
    .md\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
    .md\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
    .md\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
    .md\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
    .md\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .md\:grid-cols-none { grid-template-columns: none; }
}

@media (min-width: 1024px) {
    .lg\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .lg\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .lg\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
    .lg\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
    .lg\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
    .lg\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
    .lg\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
    .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .lg\:grid-cols-none { grid-template-columns: none; }
}
@media (min-width: 1280px) {
    .xl\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .xl\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .xl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .xl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .xl\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
    .xl\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
    .xl\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
    .xl\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
    .xl\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
    .xl\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .xl\:grid-cols-none { grid-template-columns: none; }
}
@media (min-width: 1536px) {
    .\32xl\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .\32xl\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .\32xl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .\32xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .\32xl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .\32xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .\32xl\:grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
    .\32xl\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
    .\32xl\:grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
    .\32xl\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
    .\32xl\:grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
    .\32xl\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .\32xl\:grid-cols-none { grid-template-columns: none; }
}

.col-span-1 { grid-column: span 1 / span 1; }
.col-span-2 { grid-column: span 2 / span 2; }
.col-span-3 { grid-column: span 3 / span 3; }
.col-span-4 { grid-column: span 4 / span 4; }
.col-span-5 { grid-column: span 5 / span 5; }
.col-span-6 { grid-column: span 6 / span 6; }
.col-span-7 { grid-column: span 7 / span 7; }
.col-span-8 { grid-column: span 8 / span 8; }
.col-span-9 { grid-column: span 9 / span 9; }
.col-span-10 { grid-column: span 10 / span 10; }
.col-span-11 { grid-column: span 11 / span 11; }
.col-span-12 { grid-column: span 12 / span 12; }
.col-span-full { grid-column: 1 / -1; }

@media (min-width: 640px) {
    .sm\:col-span-1 { grid-column: span 1 / span 1; }
    .sm\:col-span-2 { grid-column: span 2 / span 2; }
    .sm\:col-span-3 { grid-column: span 3 / span 3; }
    .sm\:col-span-4 { grid-column: span 4 / span 4; }
    .sm\:col-span-5 { grid-column: span 5 / span 5; }
    .sm\:col-span-6 { grid-column: span 6 / span 6; }
    .sm\:col-span-7 { grid-column: span 7 / span 7; }
    .sm\:col-span-8 { grid-column: span 8 / span 8; }
    .sm\:col-span-9 { grid-column: span 9 / span 9; }
    .sm\:col-span-10 { grid-column: span 10 / span 10; }
    .sm\:col-span-11 { grid-column: span 11 / span 11; }
    .sm\:col-span-12 { grid-column: span 12 / span 12; }
    .sm\:col-span-full { grid-column: 1 / -1; }
}

@media (min-width: 768px) {
    .md\:col-span-1 { grid-column: span 1 / span 1; }
    .md\:col-span-2 { grid-column: span 2 / span 2; }
    .md\:col-span-3 { grid-column: span 3 / span 3; }
    .md\:col-span-4 { grid-column: span 4 / span 4; }
    .md\:col-span-5 { grid-column: span 5 / span 5; }
    .md\:col-span-6 { grid-column: span 6 / span 6; }
    .md\:col-span-7 { grid-column: span 7 / span 7; }
    .md\:col-span-8 { grid-column: span 8 / span 8; }
    .md\:col-span-9 { grid-column: span 9 / span 9; }
    .md\:col-span-10 { grid-column: span 10 / span 10; }
    .md\:col-span-11 { grid-column: span 11 / span 11; }
    .md\:col-span-12 { grid-column: span 12 / span 12; }
    .md\:col-span-full { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
    .lg\:col-span-1 { grid-column: span 1 / span 1; }
    .lg\:col-span-2 { grid-column: span 2 / span 2; }
    .lg\:col-span-3 { grid-column: span 3 / span 3; }
    .lg\:col-span-4 { grid-column: span 4 / span 4; }
    .lg\:col-span-5 { grid-column: span 5 / span 5; }
    .lg\:col-span-6 { grid-column: span 6 / span 6; }
    .lg\:col-span-7 { grid-column: span 7 / span 7; }
    .lg\:col-span-8 { grid-column: span 8 / span 8; }
    .lg\:col-span-9 { grid-column: span 9 / span 9; }
    .lg\:col-span-10 { grid-column: span 10 / span 10; }
    .lg\:col-span-11 { grid-column: span 11 / span 11; }
    .lg\:col-span-12 { grid-column: span 12 / span 12; }
    .lg\:col-span-full { grid-column: 1 / -1; }
}
@media (min-width: 1280px) {
    .xl\:col-span-1 { grid-column: span 1 / span 1; }
    .xl\:col-span-2 { grid-column: span 2 / span 2; }
    .xl\:col-span-3 { grid-column: span 3 / span 3; }
    .xl\:col-span-4 { grid-column: span 4 / span 4; }
    .xl\:col-span-5 { grid-column: span 5 / span 5; }
    .xl\:col-span-6 { grid-column: span 6 / span 6; }
    .xl\:col-span-7 { grid-column: span 7 / span 7; }
    .xl\:col-span-8 { grid-column: span 8 / span 8; }
    .xl\:col-span-9 { grid-column: span 9 / span 9; }
    .xl\:col-span-10 { grid-column: span 10 / span 10; }
    .xl\:col-span-11 { grid-column: span 11 / span 11; }
    .xl\:col-span-12 { grid-column: span 12 / span 12; }
    .xl\:col-span-full { grid-column: 1 / -1; }
}
@media (min-width: 1536px) {
    .\32xl\:col-span-1 { grid-column: span 1 / span 1; }
    .\32xl\:col-span-2 { grid-column: span 2 / span 2; }
    .\32xl\:col-span-3 { grid-column: span 3 / span 3; }
    .\32xl\:col-span-4 { grid-column: span 4 / span 4; }
    .\32xl\:col-span-5 { grid-column: span 5 / span 5; }
    .\32xl\:col-span-6 { grid-column: span 6 / span 6; }
    .\32xl\:col-span-7 { grid-column: span 7 / span 7; }
    .\32xl\:col-span-8 { grid-column: span 8 / span 8; }
    .\32xl\:col-span-9 { grid-column: span 9 / span 9; }
    .\32xl\:col-span-10 { grid-column: span 10 / span 10; }
    .\32xl\:col-span-11 { grid-column: span 11 / span 11; }
    .\32xl\:col-span-12 { grid-column: span 12 / span 12; }
    .\32xl\:col-span-full { grid-column: 1 / -1; }
}

   

