@charset "UTF-8";
/* CSS Document */

/*
Brakepoints

576px
Small	sm	≥576px
Medium	md	≥768px
Large	lg	≥992px
Extra large	xl	≥1200px
Extra extra large	xxl	≥1400px
*/


:root {
	--too-scale-0-base:    0;
	--too-scale-1-base:    3;
	--too-scale-2-base:    5;
	--too-scale-3-base:    8;
	--too-scale-4-base:   13;
	--too-scale-5-base:   21;
	--too-scale-6-base:   34;
	--too-scale-7-base:   55;
	--too-scale-8-base:   89;
	--too-scale-9-base:  144;
	--too-scale-10-base: 233;

	--too-scale-0:  calc(var(--too-scale-0-base) * 1px );
	--too-scale-1:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-2:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-3:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-4:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-5:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-6:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-7:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-8:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-9:  calc(var(--too-scale-4-base) * 1px );
	--too-scale-10: calc(var(--too-scale-4-base) * 1px );
}
@media (min-width: 640px) {
	:root {
		--too-scale-0:  calc(var(--too-scale-0-base) * 1px );
		--too-scale-1:  calc(var(--too-scale-1-base) * 1px );
		--too-scale-2:  calc(var(--too-scale-2-base) * 1px );
		--too-scale-3:  calc(var(--too-scale-3-base) * 1px );
		--too-scale-4:  calc(var(--too-scale-3-base) * 1px );
		--too-scale-5:  calc(var(--too-scale-3-base) * 1px );
		--too-scale-6:  calc(var(--too-scale-3-base) * 1px );
		--too-scale-7:  calc( 1400px  * 0.01 );
		--too-scale-8:  calc( 1400px  * 0.015 );
		--too-scale-9:  calc( 1400px  * 0.018 );
		--too-scale-10: calc( 1400px  * 0.02 );
	}
}

@media (min-width: 992px) {
	:root {
		--too-scale-0:  calc(var(--too-scale-0-base) * 1px );
		--too-scale-1:  calc(var(--too-scale-1-base) * 1px );
		--too-scale-2:  calc(var(--too-scale-2-base) * 1px );
		--too-scale-3:  calc(var(--too-scale-3-base) * 1px );
		--too-scale-4:  calc( 1400px  * 0.02 );
		--too-scale-5:  calc( 1400px  * 0.02 );
		--too-scale-6:  calc( 1400px  * 0.03 );
		--too-scale-7:  calc( 1400px  * 0.04 );
		--too-scale-8:  calc( 1400px  * 0.05 );
		--too-scale-9:  calc( 1400px  * 0.055 );
		--too-scale-10: calc( 1400px  * 0.06 );
	}
}


@media (min-width: 1200px) {
	:root {
		--too-scale-0:  calc(var(--too-scale-0-base) * 1px );
		--too-scale-1:  calc(var(--too-scale-1-base) * 1px );
		--too-scale-2:  calc(var(--too-scale-2-base) * 1px );
		--too-scale-3:  calc(var(--too-scale-3-base) * 1px );
		--too-scale-4:  calc( 1400px  * 0.02 );
		--too-scale-5:  calc( 1400px  * 0.03 );
		--too-scale-6:  calc( 1400px  * 0.04 );
		--too-scale-7:  calc( 1400px  * 0.05 );
		--too-scale-8:  calc( 1400px  * 0.06 );
		--too-scale-9:  calc( 1400px  * 0.09 );
		--too-scale-10: calc( 1400px  * 0.1 );
	}
}

/* caintainer */

.too-container {
	width: 100%;
	padding-left: 13px;
	padding-right: 13px;
	margin-left: auto;
	margin-right: auto;
}

@media (min-width: 576px) {
	.too-container {
	}
}

@media (min-width: 768px) {
	.too-container {
	}
}

@media (min-width: 992px) {
	.too-container {
	}
}

@media (min-width: 1200px) {
	.too-container {
	}
}

@media (min-width: 1400px) {
	.too-container {
		max-width: 1400px;
	}
}





/* grid */

.too-grid {
	display: grid;
	width: 100%;
	max-width: 100%;
	gap: 24px;
	grid-template-columns: 1fr;
}


.too-grid-fit-1 {
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}
.too-grid-fit-2 {
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.too-grid-fit-3 {
	grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}
.too-grid-fit-4 {
	grid-template-columns: repeat(auto-fit, minmax(480px, 1fr));
}
.too-grid-fit-5 {
	grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
}






.too-grid-fill-1 {
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
}
.too-grid-fill-2 {
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.too-grid-fill-3 {
	grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
}
.too-grid-fill-4 {
	grid-template-columns: repeat(auto-fill, minmax(480px, 1fr));
}
.too-grid-fill-5 {
	grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
}











/* gap*/

.too-gap-0 {
	gap: 0 !important;
}
.too-gap-1 {
	gap: var(--too-scale-1) !important;
}
.too-gap-2 {
	gap: var(--too-scale-2) !important;
}
.too-gap-3 {
	gap: var(--too-scale-3) !important;
}
.too-gap-4 {
	gap: var(--too-scale-4) !important;
}
.too-gap-5 {
	gap: var(--too-scale-5) !important;
}
.too-gap-6 {
	gap: var(--too-scale-6) !important;
}
.too-gap-7 {
	gap: var(--too-scale-7) !important;
}
.too-gap-8 {
	gap: var(--too-scale-8) !important;
}
.too-gap-9 {
	gap: var(--too-scale-9) !important;
}
.too-gap-10 {
	gap: var(--too-scale-10) !important;
}




/* gap-col*/

.too-col-gap-1 {
	column-gap:  var(--too-scale-0) !important;
}
.too-col-gap-1 {
	column-gap: var(--too-scale-1) !important;
}
.too-col-gap- {
	column-gap: var(--too-scale-2) !important;
}
.too-col-gap-3 {
	column-gap: var(--too-scale-3) !important;
}
.too-col-gap-4 {
	column-gap: var(--too-scale-4) !important;
}
.too-col-gap-5 {
	column-gap: var(--too-scale-5) !important;
}
.too-col-gap-6 {
	column-gap: var(--too-scale-6) !important;
}
.too-col-gap-7 {
	column-gap: var(--too-scale-7) !important;
}
.too-col-gap-8 {
	column-gap: var(--too-scale-8) !important;
}
.too-col-gap-9 {
	column-gap: var(--too-scale-9) !important;
}
.too-col-gap-10 {
	column-gap: var(--too-scale-10) !important;
}

/* gap-row */

.too-row-gap-1 {
	row-gap:  var(--too-scale-0) !important;
}
.too-row-gap-1 {
	row-gap: var(--too-scale-1) !important;
}
.too-row-gap- {
	row-gap: var(--too-scale-2) !important;
}
.too-row-gap-3 {
	row-gap: var(--too-scale-3) !important;
}
.too-row-gap-4 {
	row-gap: var(--too-scale-4) !important;
}
.too-row-gap-5 {
	row-gap: var(--too-scale-5) !important;
}
.too-row-gap-6 {
	row-gap: var(--too-scale-6) !important;
}
.too-row-gap-7 {
	row-gap: var(--too-scale-7) !important;
}
.too-row-gap-8 {
	row-gap: var(--too-scale-8) !important;
}
.too-row-gap-9 {
	row-gap: var(--too-scale-9) !important;
}
.too-row-gap-10 {
	row-gap: var(--too-scale-10) !important;
}