@charset "utf-8";

/*========================

layout_parts.css

========================*/

/*---------------------------------------------
color
---------------------------------------------*/
:root {

/*--- color ---*/
--main:#2b463b;
--sub:#a98d2f;
--second:#0E4D86;
--accent:#FEE506;
--beige:#f8f5ef;

--work:#4B9B2E;
--learn:#034581;
--experience:#EB8A21;

--white:#FFFFFF;
--link:#3399cc;

--gray_f7:#f7f7f7;
--gray_f2:#f2f2f2;
--gray_ee:#EEEEEE;
--gray_eb:#EBEBEB;
--gray_dd:#DDDDDD;
--gray_cc:#CCCCCC;
--gray_9f:#9F9F9F;
--gray_99:#999999;
--gray_70:#707070;
--gray_66:#666666;
--gray_51:#515151;
--gray_33:#333333;
--gray_1a:#1a1a1a;

--black:#000000;

--blue:#0879D1;
--yellow:#FEE506;
--green:#56c120;
--orange:#FF6600;
--red:#ea1c0f;

--theme-a:#ecf3cd;
--theme-b:#d6e690;
--theme-c:#b6d339;
--theme-d:#e8dec9;
--theme-e:#bfe0ea;
--theme-f:#d1c8c0;

--color-white: #ffffff;
--color-black: #000000;


--color-main-50:  #eef3f1;
--color-main-100: #dde7e3;
--color-main-200: #bbd0c7;
--color-main-300: #99b8ab;
--color-main-400: #6f9485;
--color-main-500: #2b463b;
--color-main-600: #233a31;
--color-main-700: #1b2e27;
--color-main-800: #14221d;
--color-main-900: #0c1613;
--color-main-950: #060b09;

--color-sub-50:  #faf6e8;
--color-sub-100: #f4edd1;
--color-sub-200: #e9dba3;
--color-sub-300: #dec875;
--color-sub-400: #c9ac4e;
--color-sub-500: #a98d2f;
--color-sub-600: #8c7426;
--color-sub-700: #6f5c1e;
--color-sub-800: #524315;
--color-sub-900: #352b0d;
--color-sub-950: #1a1506;

--color-second-50:  #e7eff6;
--color-second-100: #cfdfed;
--color-second-200: #9fbfdb;
--color-second-300: #6f9fc9;
--color-second-400: #3f7fb7;
--color-second-500: #0e4d86;
--color-second-600: #0b3f6e;
--color-second-700: #083156;
--color-second-800: #06233d;
--color-second-900: #031526;
--color-second-950: #010a13;

--color-beige-50:  #fdfcf9;
--color-beige-100: #f8f5ef;
--color-beige-200: #f1ebe0;
--color-beige-300: #e6dcc9;
--color-beige-400: #d6c7aa;
--color-beige-500: #c4b089;
--color-beige-600: #a08f6f;
--color-beige-700: #7c6e55;
--color-beige-800: #584e3c;
--color-beige-900: #342f24;
--color-beige-950: #1a1712;

--color-gray-f7: #f7f7f7;
--color-gray-f2: #f2f2f2;
--color-gray-ee: #eeeeee;
--color-gray-eb: #ebebeb;
--color-gray-dd: #dddddd;
--color-gray-cc: #cccccc;
--color-gray-9f: #9f9f9f;
--color-gray-99: #999999;
--color-gray-66: #666666;
--color-gray-33: #333333;
--color-gray-1a:#1a1a1a;

--color-gray-50: #F9FAFB;
--color-gray-100: #F3F4F6;
--color-gray-200: #E5E7EB;
--color-gray-300: #D1D5DC;
--color-gray-400: #99A1AF;
--color-gray-500: #6A7282;
--color-gray-600: #4A5565;
--color-gray-700: #364153;
--color-gray-800: #1E2939;
--color-gray-900: #101828;
--color-gray-950: #030712;

--color-red-50: #FEF2F2;
--color-red-100: #FFE2E2;
--color-red-200: #FFC9C9;
--color-red-300: #FFA2A2;
--color-red-400: #FF6467;
--color-red-500: #FB2C36;
--color-red-600: #E7000B;
--color-red-700: #C10007;
--color-red-800: #9F0712;
--color-red-900: #82181A;
--color-red-950: #460809;

--color-orange-50: #FFF7ED;
--color-orange-100: #FFEDD4;
--color-orange-200: #FFD6A7;
--color-orange-300: #FFB86A;
--color-orange-400: #FF8904;
--color-orange-500: #FF6900;
--color-orange-600: #F54900;
--color-orange-700: #CA3500;
--color-orange-800: #9F2D00;
--color-orange-900: #7E2A0C;
--color-orange-950: #441306;

--color-amber-50: #FFFBEB;
--color-amber-100: #FEF3C6;
--color-amber-200: #FEE685;
--color-amber-300: #FFD230;
--color-amber-400: #FFB900;
--color-amber-500: #FE9A00;
--color-amber-600: #E17100;
--color-amber-700: #BB4D00;
--color-amber-800: #973C00;
--color-amber-900: #7B3306;
--color-amber-950: #461901;

--color-yellow-50: #FEFCE8;
--color-yellow-100: #FEF9C2;
--color-yellow-200: #FFF085;
--color-yellow-300: #FFDF20;
--color-yellow-400: #FDC700;
--color-yellow-500: #F0B100;
--color-yellow-600: #D08700;
--color-yellow-700: #A65F00;
--color-yellow-800: #894B00;
--color-yellow-900: #733E0A;
--color-yellow-950: #432004;

--color-lime-50: #F7FEE7;
--color-lime-100: #ECFCCA;
--color-lime-200: #D8F999;
--color-lime-300: #BBF451;
--color-lime-400: #9AE600;
--color-lime-500: #7CCF00;
--color-lime-600: #5EA500;
--color-lime-700: #497D00;
--color-lime-800: #3C6300;
--color-lime-900: #35530E;
--color-lime-950: #192E03;

--color-green-50: #F0FDF4;
--color-green-100: #DCFCE7;
--color-green-200: #B9F8CF;
--color-green-300: #7BF1A8;
--color-green-400: #05DF72;
--color-green-500: #00C950;
--color-green-600: #00A63E;
--color-green-700: #008236;
--color-green-800: #016630;
--color-green-900: #0D542B;
--color-green-950: #032E15;

--color-emerald-50: #ECFDF5;
--color-emerald-100: #D0FAE5;
--color-emerald-200: #A4F4CF;
--color-emerald-300: #5EE9B5;
--color-emerald-400: #00D492;
--color-emerald-500: #00BC7D;
--color-emerald-600: #009966;
--color-emerald-700: #007A55;
--color-emerald-800: #006045;
--color-emerald-900: #004F3B;
--color-emerald-950: #002C22;

--color-teal-50: #F0FDFA;
--color-teal-100: #CBFBF1;
--color-teal-200: #96F7E4;
--color-teal-300: #46ECD5;
--color-teal-400: #00D5BE;
--color-teal-500: #00BBA7;
--color-teal-600: #009689;
--color-teal-700: #00786F;
--color-teal-800: #005F5A;
--color-teal-900: #0B4F4A;
--color-teal-950: #022F2E;

--color-cyan-50: #ECFEFF;
--color-cyan-100: #CEFAFE;
--color-cyan-200: #A2F4FD;
--color-cyan-300: #53EAFD;
--color-cyan-400: #00D3F2;
--color-cyan-500: #00B8DB;
--color-cyan-600: #0092B8;
--color-cyan-700: #007595;
--color-cyan-800: #005F78;
--color-cyan-900: #104E64;
--color-cyan-950: #053345;

--color-sky-50: #F0F9FF;
--color-sky-100: #DFF2FE;
--color-sky-200: #B8E6FE;
--color-sky-300: #74D4FF;
--color-sky-400: #00BCFF;
--color-sky-500: #00A6F4;
--color-sky-600: #0084D1;
--color-sky-700: #0069A8;
--color-sky-800: #00598A;
--color-sky-900: #024A70;
--color-sky-950: #052F4A;

--color-blue-50: #EFF6FF;
--color-blue-100: #DBEAFE;
--color-blue-200: #BEDBFF;
--color-blue-300: #8EC5FF;
--color-blue-400: #51A2FF;
--color-blue-500: #2B7FFF;
--color-blue-600: #155DFC;
--color-blue-700: #1447E6;
--color-blue-800: #193CB8;
--color-blue-900: #1C398E;
--color-blue-950: #162456;

--color-indigo-50: #EEF2FF;
--color-indigo-100: #E0E7FF;
--color-indigo-200: #C6D2FF;
--color-indigo-300: #A3B3FF;
--color-indigo-400: #7C86FF;
--color-indigo-500: #615FFF;
--color-indigo-600: #4F39F6;
--color-indigo-700: #432DD7;
--color-indigo-800: #372AAC;
--color-indigo-900: #312C85;
--color-indigo-950: #1E1A4D;

--color-violet-50: #F5F3FF;
--color-violet-100: #EDE9FE;
--color-violet-200: #DDD6FF;
--color-violet-300: #C4B4FF;
--color-violet-400: #A684FF;
--color-violet-500: #8E51FF;
--color-violet-600: #7F22FE;
--color-violet-700: #7008E7;
--color-violet-800: #5D0EC0;
--color-violet-900: #4D179A;
--color-violet-950: #2F0D68;

--color-purple-50: #FAF5FF;
--color-purple-100: #F3E8FF;
--color-purple-200: #E9D4FF;
--color-purple-300: #DAB2FF;
--color-purple-400: #C27AFF;
--color-purple-500: #AD46FF;
--color-purple-600: #9810FA;
--color-purple-700: #8200DB;
--color-purple-800: #6E11B0;
--color-purple-900: #59168B;
--color-purple-950: #3C0366;

--color-fuchsia-50: #FDF4FF;
--color-fuchsia-100: #FAE8FF;
--color-fuchsia-200: #F6CFFF;
--color-fuchsia-300: #F4A8FF;
--color-fuchsia-400: #ED6AFF;
--color-fuchsia-500: #E12AFB;
--color-fuchsia-600: #C800DE;
--color-fuchsia-700: #A800B7;
--color-fuchsia-800: #8A0194;
--color-fuchsia-900: #721378;
--color-fuchsia-950: #4B004F;

--color-pink-50: #FDF2F8;
--color-pink-100: #FCE7F3;
--color-pink-200: #FCCEE8;
--color-pink-300: #FDA5D5;
--color-pink-400: #FB64B6;
--color-pink-500: #F6339A;
--color-pink-600: #E60076;
--color-pink-700: #C6005C;
--color-pink-800: #A3004C;
--color-pink-900: #861043;
--color-pink-950: #510424;

--color-rose-50: #FFF1F2;
--color-rose-100: #FFE4E6;
--color-rose-200: #FFCCD3;
--color-rose-300: #FFA1AD;
--color-rose-400: #FF637E;
--color-rose-500: #FF2056;
--color-rose-600: #EC003F;
--color-rose-700: #C70036;
--color-rose-800: #A50036;
--color-rose-900: #8B0836;
--color-rose-950: #4D0218;

--color-slate-50: #F8FAFC;
--color-slate-100: #F1F5F9;
--color-slate-200: #E2E8F0;
--color-slate-300: #CAD5E2;
--color-slate-400: #90A1B9;
--color-slate-500: #62748E;
--color-slate-600: #45556C;
--color-slate-700: #314158;
--color-slate-800: #1D293D;
--color-slate-900: #0F172B;
--color-slate-950: #020618;

--color-zinc-50: #FAFAFA;
--color-zinc-100: #F4F4F5;
--color-zinc-200: #E4E4E7;
--color-zinc-300: #D4D4D8;
--color-zinc-400: #9F9FA9;
--color-zinc-500: #71717B;
--color-zinc-600: #52525C;
--color-zinc-700: #3F3F46;
--color-zinc-800: #27272A;
--color-zinc-900: #18181B;
--color-zinc-950: #09090B;

--color-neutral-50: #FAFAFA;
--color-neutral-100: #F5F5F5;
--color-neutral-200: #E5E5E5;
--color-neutral-300: #D4D4D4;
--color-neutral-400: #A1A1A1;
--color-neutral-500: #737373;
--color-neutral-600: #525252;
--color-neutral-700: #404040;
--color-neutral-800: #262626;
--color-neutral-900: #171717;
--color-neutral-950: #0A0A0A;

--color-stone-50: #FAFAF9;
--color-stone-100: #F5F5F4;
--color-stone-200: #E7E5E4;
--color-stone-300: #D6D3D1;
--color-stone-400: #A6A09B;
--color-stone-500: #79716B;
--color-stone-600: #57534D;
--color-stone-700: #44403B;
--color-stone-800: #292524;
--color-stone-900: #1C1917;
--color-stone-950: #0C0A09;

--color-mauve-50: #FAFAFA;
--color-mauve-100: #F3F1F3;
--color-mauve-200: #E7E4E7;
--color-mauve-300: #D7D0D7;
--color-mauve-400: #A89EA9;
--color-mauve-500: #79697B;
--color-mauve-600: #594C5B;
--color-mauve-700: #463947;
--color-mauve-800: #2A212C;
--color-mauve-900: #1D161E;
--color-mauve-950: #0C090C;

--color-olive-50: #FBFBF9;
--color-olive-100: #F4F4F0;
--color-olive-200: #E8E8E3;
--color-olive-300: #D8D8D0;
--color-olive-400: #ABAB9C;
--color-olive-500: #7C7C67;
--color-olive-600: #5B5B4B;
--color-olive-700: #474739;
--color-olive-800: #2B2B22;
--color-olive-900: #1D1D16;
--color-olive-950: #0C0C09;

--color-mist-50: #F9FBFB;
--color-mist-100: #F1F3F3;
--color-mist-200: #E3E7E8;
--color-mist-300: #D0D6D8;
--color-mist-400: #9CA8AB;
--color-mist-500: #67787C;
--color-mist-600: #4B585B;
--color-mist-700: #394447;
--color-mist-800: #22292B;
--color-mist-900: #161B1D;
--color-mist-950: #090B0C;

--color-taupe-50: #FBFAF9;
--color-taupe-100: #F3F1F1;
--color-taupe-200: #E8E4E3;
--color-taupe-300: #D8D2D0;
--color-taupe-400: #ABA09C;
--color-taupe-500: #7C6D67;
--color-taupe-600: #5B4F4B;
--color-taupe-700: #473C39;
--color-taupe-800: #2B2422;
--color-taupe-900: #1D1816;
--color-taupe-950: #0C0A09;
}

/*--- text-color ---*/
.text-white { color:var(--white); }
.text-main { color:var(--main); }

.text-work { color:var(--work); }
.text-learn { color:var(--learn); }
.text-experience { color:var(--experience); }

/*--- text colors ---*/

/* main */
.text-main-50 { color: var(--color-main-50); }
.text-main-100 { color: var(--color-main-100); }
.text-main-200 { color: var(--color-main-200); }
.text-main-300 { color: var(--color-main-300); }
.text-main-400 { color: var(--color-main-400); }
.text-main-500 { color: var(--color-main-500); }
.text-main-600 { color: var(--color-main-600); }
.text-main-700 { color: var(--color-main-700); }
.text-main-800 { color: var(--color-main-800); }
.text-main-900 { color: var(--color-main-900); }
.text-main-950 { color: var(--color-main-950); }

/* sub */
.text-sub-50 { color: var(--color-sub-50); }
.text-sub-100 { color: var(--color-sub-100); }
.text-sub-200 { color: var(--color-sub-200); }
.text-sub-300 { color: var(--color-sub-300); }
.text-sub-400 { color: var(--color-sub-400); }
.text-sub-500 { color: var(--color-sub-500); }
.text-sub-600 { color: var(--color-sub-600); }
.text-sub-700 { color: var(--color-sub-700); }
.text-sub-800 { color: var(--color-sub-800); }
.text-sub-900 { color: var(--color-sub-900); }
.text-sub-950 { color: var(--color-sub-950); }

/* second */
.text-second-50 { color: var(--color-second-50); }
.text-second-100 { color: var(--color-second-100); }
.text-second-200 { color: var(--color-second-200); }
.text-second-300 { color: var(--color-second-300); }
.text-second-400 { color: var(--color-second-400); }
.text-second-500 { color: var(--color-second-500); }
.text-second-600 { color: var(--color-second-600); }
.text-second-700 { color: var(--color-second-700); }
.text-second-800 { color: var(--color-second-800); }
.text-second-900 { color: var(--color-second-900); }
.text-second-950 { color: var(--color-second-950); }

/* gray */
.text-gray-50 { color: var(--color-gray-50); }
.text-gray-100 { color: var(--color-gray-100); }
.text-gray-200 { color: var(--color-gray-200); }
.text-gray-300 { color: var(--color-gray-300); }
.text-gray-400 { color: var(--color-gray-400); }
.text-gray-500 { color: var(--color-gray-500); }
.text-gray-600 { color: var(--color-gray-600); }
.text-gray-700 { color: var(--color-gray-700); }
.text-gray-800 { color: var(--color-gray-800); }
.text-gray-900 { color: var(--color-gray-900); }
.text-gray-950 { color: var(--color-gray-950); }

/* red */
.text-red-50 { color: var(--color-red-50); }
.text-red-100 { color: var(--color-red-100); }
.text-red-200 { color: var(--color-red-200); }
.text-red-300 { color: var(--color-red-300); }
.text-red-400 { color: var(--color-red-400); }
.text-red-500 { color: var(--color-red-500); }
.text-red-600 { color: var(--color-red-600); }
.text-red-700 { color: var(--color-red-700); }
.text-red-800 { color: var(--color-red-800); }
.text-red-900 { color: var(--color-red-900); }
.text-red-950 { color: var(--color-red-950); }

/* orange */
.text-orange-50 { color: var(--color-orange-50); }
.text-orange-100 { color: var(--color-orange-100); }
.text-orange-200 { color: var(--color-orange-200); }
.text-orange-300 { color: var(--color-orange-300); }
.text-orange-400 { color: var(--color-orange-400); }
.text-orange-500 { color: var(--color-orange-500); }
.text-orange-600 { color: var(--color-orange-600); }
.text-orange-700 { color: var(--color-orange-700); }
.text-orange-800 { color: var(--color-orange-800); }
.text-orange-900 { color: var(--color-orange-900); }
.text-orange-950 { color: var(--color-orange-950); }

/* amber */
.text-amber-50 { color: var(--color-amber-50); }
.text-amber-100 { color: var(--color-amber-100); }
.text-amber-200 { color: var(--color-amber-200); }
.text-amber-300 { color: var(--color-amber-300); }
.text-amber-400 { color: var(--color-amber-400); }
.text-amber-500 { color: var(--color-amber-500); }
.text-amber-600 { color: var(--color-amber-600); }
.text-amber-700 { color: var(--color-amber-700); }
.text-amber-800 { color: var(--color-amber-800); }
.text-amber-900 { color: var(--color-amber-900); }
.text-amber-950 { color: var(--color-amber-950); }

/* yellow */
.text-yellow-50 { color: var(--color-yellow-50); }
.text-yellow-100 { color: var(--color-yellow-100); }
.text-yellow-200 { color: var(--color-yellow-200); }
.text-yellow-300 { color: var(--color-yellow-300); }
.text-yellow-400 { color: var(--color-yellow-400); }
.text-yellow-500 { color: var(--color-yellow-500); }
.text-yellow-600 { color: var(--color-yellow-600); }
.text-yellow-700 { color: var(--color-yellow-700); }
.text-yellow-800 { color: var(--color-yellow-800); }
.text-yellow-900 { color: var(--color-yellow-900); }
.text-yellow-950 { color: var(--color-yellow-950); }

/* lime */
.text-lime-50 { color: var(--color-lime-50); }
.text-lime-100 { color: var(--color-lime-100); }
.text-lime-200 { color: var(--color-lime-200); }
.text-lime-300 { color: var(--color-lime-300); }
.text-lime-400 { color: var(--color-lime-400); }
.text-lime-500 { color: var(--color-lime-500); }
.text-lime-600 { color: var(--color-lime-600); }
.text-lime-700 { color: var(--color-lime-700); }
.text-lime-800 { color: var(--color-lime-800); }
.text-lime-900 { color: var(--color-lime-900); }
.text-lime-950 { color: var(--color-lime-950); }

/* green */
.text-green-50 { color: var(--color-green-50); }
.text-green-100 { color: var(--color-green-100); }
.text-green-200 { color: var(--color-green-200); }
.text-green-300 { color: var(--color-green-300); }
.text-green-400 { color: var(--color-green-400); }
.text-green-500 { color: var(--color-green-500); }
.text-green-600 { color: var(--color-green-600); }
.text-green-700 { color: var(--color-green-700); }
.text-green-800 { color: var(--color-green-800); }
.text-green-900 { color: var(--color-green-900); }
.text-green-950 { color: var(--color-green-950); }

/* emerald */
.text-emerald-50 { color: var(--color-emerald-50); }
.text-emerald-100 { color: var(--color-emerald-100); }
.text-emerald-200 { color: var(--color-emerald-200); }
.text-emerald-300 { color: var(--color-emerald-300); }
.text-emerald-400 { color: var(--color-emerald-400); }
.text-emerald-500 { color: var(--color-emerald-500); }
.text-emerald-600 { color: var(--color-emerald-600); }
.text-emerald-700 { color: var(--color-emerald-700); }
.text-emerald-800 { color: var(--color-emerald-800); }
.text-emerald-900 { color: var(--color-emerald-900); }
.text-emerald-950 { color: var(--color-emerald-950); }

/* teal */
.text-teal-50 { color: var(--color-teal-50); }
.text-teal-100 { color: var(--color-teal-100); }
.text-teal-200 { color: var(--color-teal-200); }
.text-teal-300 { color: var(--color-teal-300); }
.text-teal-400 { color: var(--color-teal-400); }
.text-teal-500 { color: var(--color-teal-500); }
.text-teal-600 { color: var(--color-teal-600); }
.text-teal-700 { color: var(--color-teal-700); }
.text-teal-800 { color: var(--color-teal-800); }
.text-teal-900 { color: var(--color-teal-900); }
.text-teal-950 { color: var(--color-teal-950); }

/* cyan */
.text-cyan-50 { color: var(--color-cyan-50); }
.text-cyan-100 { color: var(--color-cyan-100); }
.text-cyan-200 { color: var(--color-cyan-200); }
.text-cyan-300 { color: var(--color-cyan-300); }
.text-cyan-400 { color: var(--color-cyan-400); }
.text-cyan-500 { color: var(--color-cyan-500); }
.text-cyan-600 { color: var(--color-cyan-600); }
.text-cyan-700 { color: var(--color-cyan-700); }
.text-cyan-800 { color: var(--color-cyan-800); }
.text-cyan-900 { color: var(--color-cyan-900); }
.text-cyan-950 { color: var(--color-cyan-950); }

/* sky */
.text-sky-50 { color: var(--color-sky-50); }
.text-sky-100 { color: var(--color-sky-100); }
.text-sky-200 { color: var(--color-sky-200); }
.text-sky-300 { color: var(--color-sky-300); }
.text-sky-400 { color: var(--color-sky-400); }
.text-sky-500 { color: var(--color-sky-500); }
.text-sky-600 { color: var(--color-sky-600); }
.text-sky-700 { color: var(--color-sky-700); }
.text-sky-800 { color: var(--color-sky-800); }
.text-sky-900 { color: var(--color-sky-900); }
.text-sky-950 { color: var(--color-sky-950); }

/* blue */
.text-blue-50 { color: var(--color-blue-50); }
.text-blue-100 { color: var(--color-blue-100); }
.text-blue-200 { color: var(--color-blue-200); }
.text-blue-300 { color: var(--color-blue-300); }
.text-blue-400 { color: var(--color-blue-400); }
.text-blue-500 { color: var(--color-blue-500); }
.text-blue-600 { color: var(--color-blue-600); }
.text-blue-700 { color: var(--color-blue-700); }
.text-blue-800 { color: var(--color-blue-800); }
.text-blue-900 { color: var(--color-blue-900); }
.text-blue-950 { color: var(--color-blue-950); }

/* indigo */
.text-indigo-50 { color: var(--color-indigo-50); }
.text-indigo-100 { color: var(--color-indigo-100); }
.text-indigo-200 { color: var(--color-indigo-200); }
.text-indigo-300 { color: var(--color-indigo-300); }
.text-indigo-400 { color: var(--color-indigo-400); }
.text-indigo-500 { color: var(--color-indigo-500); }
.text-indigo-600 { color: var(--color-indigo-600); }
.text-indigo-700 { color: var(--color-indigo-700); }
.text-indigo-800 { color: var(--color-indigo-800); }
.text-indigo-900 { color: var(--color-indigo-900); }
.text-indigo-950 { color: var(--color-indigo-950); }

/* violet */
.text-violet-50 { color: var(--color-violet-50); }
.text-violet-100 { color: var(--color-violet-100); }
.text-violet-200 { color: var(--color-violet-200); }
.text-violet-300 { color: var(--color-violet-300); }
.text-violet-400 { color: var(--color-violet-400); }
.text-violet-500 { color: var(--color-violet-500); }
.text-violet-600 { color: var(--color-violet-600); }
.text-violet-700 { color: var(--color-violet-700); }
.text-violet-800 { color: var(--color-violet-800); }
.text-violet-900 { color: var(--color-violet-900); }
.text-violet-950 { color: var(--color-violet-950); }

/* purple */
.text-purple-50 { color: var(--color-purple-50); }
.text-purple-100 { color: var(--color-purple-100); }
.text-purple-200 { color: var(--color-purple-200); }
.text-purple-300 { color: var(--color-purple-300); }
.text-purple-400 { color: var(--color-purple-400); }
.text-purple-500 { color: var(--color-purple-500); }
.text-purple-600 { color: var(--color-purple-600); }
.text-purple-700 { color: var(--color-purple-700); }
.text-purple-800 { color: var(--color-purple-800); }
.text-purple-900 { color: var(--color-purple-900); }
.text-purple-950 { color: var(--color-purple-950); }

/* fuchsia */
.text-fuchsia-50 { color: var(--color-fuchsia-50); }
.text-fuchsia-100 { color: var(--color-fuchsia-100); }
.text-fuchsia-200 { color: var(--color-fuchsia-200); }
.text-fuchsia-300 { color: var(--color-fuchsia-300); }
.text-fuchsia-400 { color: var(--color-fuchsia-400); }
.text-fuchsia-500 { color: var(--color-fuchsia-500); }
.text-fuchsia-600 { color: var(--color-fuchsia-600); }
.text-fuchsia-700 { color: var(--color-fuchsia-700); }
.text-fuchsia-800 { color: var(--color-fuchsia-800); }
.text-fuchsia-900 { color: var(--color-fuchsia-900); }
.text-fuchsia-950 { color: var(--color-fuchsia-950); }

/* pink */
.text-pink-50 { color: var(--color-pink-50); }
.text-pink-100 { color: var(--color-pink-100); }
.text-pink-200 { color: var(--color-pink-200); }
.text-pink-300 { color: var(--color-pink-300); }
.text-pink-400 { color: var(--color-pink-400); }
.text-pink-500 { color: var(--color-pink-500); }
.text-pink-600 { color: var(--color-pink-600); }
.text-pink-700 { color: var(--color-pink-700); }
.text-pink-800 { color: var(--color-pink-800); }
.text-pink-900 { color: var(--color-pink-900); }
.text-pink-950 { color: var(--color-pink-950); }

/* rose */
.text-rose-50 { color: var(--color-rose-50); }
.text-rose-100 { color: var(--color-rose-100); }
.text-rose-200 { color: var(--color-rose-200); }
.text-rose-300 { color: var(--color-rose-300); }
.text-rose-400 { color: var(--color-rose-400); }
.text-rose-500 { color: var(--color-rose-500); }
.text-rose-600 { color: var(--color-rose-600); }
.text-rose-700 { color: var(--color-rose-700); }
.text-rose-800 { color: var(--color-rose-800); }
.text-rose-900 { color: var(--color-rose-900); }
.text-rose-950 { color: var(--color-rose-950); }

/* slate */
.text-slate-50 { color: var(--color-slate-50); }
.text-slate-100 { color: var(--color-slate-100); }
.text-slate-200 { color: var(--color-slate-200); }
.text-slate-300 { color: var(--color-slate-300); }
.text-slate-400 { color: var(--color-slate-400); }
.text-slate-500 { color: var(--color-slate-500); }
.text-slate-600 { color: var(--color-slate-600); }
.text-slate-700 { color: var(--color-slate-700); }
.text-slate-800 { color: var(--color-slate-800); }
.text-slate-900 { color: var(--color-slate-900); }
.text-slate-950 { color: var(--color-slate-950); }

/* gray */
.text-gray-50 { color: var(--color-gray-50); }
.text-gray-100 { color: var(--color-gray-100); }
.text-gray-200 { color: var(--color-gray-200); }
.text-gray-300 { color: var(--color-gray-300); }
.text-gray-400 { color: var(--color-gray-400); }
.text-gray-500 { color: var(--color-gray-500); }
.text-gray-600 { color: var(--color-gray-600); }
.text-gray-700 { color: var(--color-gray-700); }
.text-gray-800 { color: var(--color-gray-800); }
.text-gray-900 { color: var(--color-gray-900); }
.text-gray-950 { color: var(--color-gray-950); }

/* zinc */
.text-zinc-50 { color: var(--color-zinc-50); }
.text-zinc-100 { color: var(--color-zinc-100); }
.text-zinc-200 { color: var(--color-zinc-200); }
.text-zinc-300 { color: var(--color-zinc-300); }
.text-zinc-400 { color: var(--color-zinc-400); }
.text-zinc-500 { color: var(--color-zinc-500); }
.text-zinc-600 { color: var(--color-zinc-600); }
.text-zinc-700 { color: var(--color-zinc-700); }
.text-zinc-800 { color: var(--color-zinc-800); }
.text-zinc-900 { color: var(--color-zinc-900); }
.text-zinc-950 { color: var(--color-zinc-950); }

/* neutral */
.text-neutral-50 { color: var(--color-neutral-50); }
.text-neutral-100 { color: var(--color-neutral-100); }
.text-neutral-200 { color: var(--color-neutral-200); }
.text-neutral-300 { color: var(--color-neutral-300); }
.text-neutral-400 { color: var(--color-neutral-400); }
.text-neutral-500 { color: var(--color-neutral-500); }
.text-neutral-600 { color: var(--color-neutral-600); }
.text-neutral-700 { color: var(--color-neutral-700); }
.text-neutral-800 { color: var(--color-neutral-800); }
.text-neutral-900 { color: var(--color-neutral-900); }
.text-neutral-950 { color: var(--color-neutral-950); }

/* stone */
.text-stone-50 { color: var(--color-stone-50); }
.text-stone-100 { color: var(--color-stone-100); }
.text-stone-200 { color: var(--color-stone-200); }
.text-stone-300 { color: var(--color-stone-300); }
.text-stone-400 { color: var(--color-stone-400); }
.text-stone-500 { color: var(--color-stone-500); }
.text-stone-600 { color: var(--color-stone-600); }
.text-stone-700 { color: var(--color-stone-700); }
.text-stone-800 { color: var(--color-stone-800); }
.text-stone-900 { color: var(--color-stone-900); }
.text-stone-950 { color: var(--color-stone-950); }

/* mauve */
.text-mauve-50 { color: var(--color-mauve-50); }
.text-mauve-100 { color: var(--color-mauve-100); }
.text-mauve-200 { color: var(--color-mauve-200); }
.text-mauve-300 { color: var(--color-mauve-300); }
.text-mauve-400 { color: var(--color-mauve-400); }
.text-mauve-500 { color: var(--color-mauve-500); }
.text-mauve-600 { color: var(--color-mauve-600); }
.text-mauve-700 { color: var(--color-mauve-700); }
.text-mauve-800 { color: var(--color-mauve-800); }
.text-mauve-900 { color: var(--color-mauve-900); }
.text-mauve-950 { color: var(--color-mauve-950); }

/* olive */
.text-olive-50 { color: var(--color-olive-50); }
.text-olive-100 { color: var(--color-olive-100); }
.text-olive-200 { color: var(--color-olive-200); }
.text-olive-300 { color: var(--color-olive-300); }
.text-olive-400 { color: var(--color-olive-400); }
.text-olive-500 { color: var(--color-olive-500); }
.text-olive-600 { color: var(--color-olive-600); }
.text-olive-700 { color: var(--color-olive-700); }
.text-olive-800 { color: var(--color-olive-800); }
.text-olive-900 { color: var(--color-olive-900); }
.text-olive-950 { color: var(--color-olive-950); }

/* mist */
.text-mist-50 { color: var(--color-mist-50); }
.text-mist-100 { color: var(--color-mist-100); }
.text-mist-200 { color: var(--color-mist-200); }
.text-mist-300 { color: var(--color-mist-300); }
.text-mist-400 { color: var(--color-mist-400); }
.text-mist-500 { color: var(--color-mist-500); }
.text-mist-600 { color: var(--color-mist-600); }
.text-mist-700 { color: var(--color-mist-700); }
.text-mist-800 { color: var(--color-mist-800); }
.text-mist-900 { color: var(--color-mist-900); }
.text-mist-950 { color: var(--color-mist-950); }

/* taupe */
.text-taupe-50 { color: var(--color-taupe-50); }
.text-taupe-100 { color: var(--color-taupe-100); }
.text-taupe-200 { color: var(--color-taupe-200); }
.text-taupe-300 { color: var(--color-taupe-300); }
.text-taupe-400 { color: var(--color-taupe-400); }
.text-taupe-500 { color: var(--color-taupe-500); }
.text-taupe-600 { color: var(--color-taupe-600); }
.text-taupe-700 { color: var(--color-taupe-700); }
.text-taupe-800 { color: var(--color-taupe-800); }
.text-taupe-900 { color: var(--color-taupe-900); }
.text-taupe-950 { color: var(--color-taupe-950); }


/*--- background-color ---*/
.bg-main { background-color:var(--main); }
.bg-sub { background-color:var(--sub); }
.bg-second { background-color:var(--second); }

.bg-white { background-color:var(--white); }

.bg-gray_f7 { background-color:var(--gray_f7); }
.bg-gray_f2 { background-color:var(--gray_f2); }
.bg-gray_ee { background-color:var(--gray_ee); }

.bg-work { background-color:var(--work); }
.bg-learn { background-color:var(--learn); }
.bg-experience { background-color:var(--experience); }

.bg-beige { background-color:var(--beige); }

/* main */
.bg-main-50 { background-color: var(--color-main-50); }
.bg-main-100 { background-color: var(--color-main-100); }
.bg-main-200 { background-color: var(--color-main-200); }
.bg-main-300 { background-color: var(--color-main-300); }
.bg-main-400 { background-color: var(--color-main-400); }
.bg-main-500 { background-color: var(--color-main-500); }
.bg-main-600 { background-color: var(--color-main-600); }
.bg-main-700 { background-color: var(--color-main-700); }
.bg-main-800 { background-color: var(--color-main-800); }
.bg-main-900 { background-color: var(--color-main-900); }
.bg-main-950 { background-color: var(--color-main-950); }

/* sub */
.bg-sub-50 { background-color: var(--color-sub-50); }
.bg-sub-100 { background-color: var(--color-sub-100); }
.bg-sub-200 { background-color: var(--color-sub-200); }
.bg-sub-300 { background-color: var(--color-sub-300); }
.bg-sub-400 { background-color: var(--color-sub-400); }
.bg-sub-500 { background-color: var(--color-sub-500); }
.bg-sub-600 { background-color: var(--color-sub-600); }
.bg-sub-700 { background-color: var(--color-sub-700); }
.bg-sub-800 { background-color: var(--color-sub-800); }
.bg-sub-900 { background-color: var(--color-sub-900); }
.bg-sub-950 { background-color: var(--color-sub-950); }

/* second */
.bg-second-50 { background-color: var(--color-second-50); }
.bg-second-100 { background-color: var(--color-second-100); }
.bg-second-200 { background-color: var(--color-second-200); }
.bg-second-300 { background-color: var(--color-second-300); }
.bg-second-400 { background-color: var(--color-second-400); }
.bg-second-500 { background-color: var(--color-second-500); }
.bg-second-600 { background-color: var(--color-second-600); }
.bg-second-700 { background-color: var(--color-second-700); }
.bg-second-800 { background-color: var(--color-second-800); }
.bg-second-900 { background-color: var(--color-second-900); }
.bg-second-950 { background-color: var(--color-second-950); }

/* beige */
.bg-beige-50 { background-color: var(--color-beige-50); }
.bg-beige-100 { background-color: var(--color-beige-100); }
.bg-beige-200 { background-color: var(--color-beige-200); }
.bg-beige-300 { background-color: var(--color-beige-300); }
.bg-beige-400 { background-color: var(--color-beige-400); }
.bg-beige-500 { background-color: var(--color-beige-500); }
.bg-beige-600 { background-color: var(--color-beige-600); }
.bg-beige-700 { background-color: var(--color-beige-700); }
.bg-beige-800 { background-color: var(--color-beige-800); }
.bg-beige-900 { background-color: var(--color-beige-900); }
.bg-beige-950 { background-color: var(--color-beige-950); }

/* gray */
.bg-gray-50 { background-color: var(--color-gray-50); }
.bg-gray-100 { background-color: var(--color-gray-100); }
.bg-gray-200 { background-color: var(--color-gray-200); }
.bg-gray-300 { background-color: var(--color-gray-300); }
.bg-gray-400 { background-color: var(--color-gray-400); }
.bg-gray-500 { background-color: var(--color-gray-500); }
.bg-gray-600 { background-color: var(--color-gray-600); }
.bg-gray-700 { background-color: var(--color-gray-700); }
.bg-gray-800 { background-color: var(--color-gray-800); }
.bg-gray-900 { background-color: var(--color-gray-900); }
.bg-gray-950 { background-color: var(--color-gray-950); }

/* red */
.bg-red-50 { background-color: var(--color-red-50); }
.bg-red-100 { background-color: var(--color-red-100); }
.bg-red-200 { background-color: var(--color-red-200); }
.bg-red-300 { background-color: var(--color-red-300); }
.bg-red-400 { background-color: var(--color-red-400); }
.bg-red-500 { background-color: var(--color-red-500); }
.bg-red-600 { background-color: var(--color-red-600); }
.bg-red-700 { background-color: var(--color-red-700); }
.bg-red-800 { background-color: var(--color-red-800); }
.bg-red-900 { background-color: var(--color-red-900); }
.bg-red-950 { background-color: var(--color-red-950); }

/* orange */
.bg-orange-50 { background-color: var(--color-orange-50); }
.bg-orange-100 { background-color: var(--color-orange-100); }
.bg-orange-200 { background-color: var(--color-orange-200); }
.bg-orange-300 { background-color: var(--color-orange-300); }
.bg-orange-400 { background-color: var(--color-orange-400); }
.bg-orange-500 { background-color: var(--color-orange-500); }
.bg-orange-600 { background-color: var(--color-orange-600); }
.bg-orange-700 { background-color: var(--color-orange-700); }
.bg-orange-800 { background-color: var(--color-orange-800); }
.bg-orange-900 { background-color: var(--color-orange-900); }
.bg-orange-950 { background-color: var(--color-orange-950); }

/* amber */
.bg-amber-50 { background-color: var(--color-amber-50); }
.bg-amber-100 { background-color: var(--color-amber-100); }
.bg-amber-200 { background-color: var(--color-amber-200); }
.bg-amber-300 { background-color: var(--color-amber-300); }
.bg-amber-400 { background-color: var(--color-amber-400); }
.bg-amber-500 { background-color: var(--color-amber-500); }
.bg-amber-600 { background-color: var(--color-amber-600); }
.bg-amber-700 { background-color: var(--color-amber-700); }
.bg-amber-800 { background-color: var(--color-amber-800); }
.bg-amber-900 { background-color: var(--color-amber-900); }
.bg-amber-950 { background-color: var(--color-amber-950); }

/* yellow */
.bg-yellow-50 { background-color: var(--color-yellow-50); }
.bg-yellow-100 { background-color: var(--color-yellow-100); }
.bg-yellow-200 { background-color: var(--color-yellow-200); }
.bg-yellow-300 { background-color: var(--color-yellow-300); }
.bg-yellow-400 { background-color: var(--color-yellow-400); }
.bg-yellow-500 { background-color: var(--color-yellow-500); }
.bg-yellow-600 { background-color: var(--color-yellow-600); }
.bg-yellow-700 { background-color: var(--color-yellow-700); }
.bg-yellow-800 { background-color: var(--color-yellow-800); }
.bg-yellow-900 { background-color: var(--color-yellow-900); }
.bg-yellow-950 { background-color: var(--color-yellow-950); }

/* lime */
.bg-lime-50 { background-color: var(--color-lime-50); }
.bg-lime-100 { background-color: var(--color-lime-100); }
.bg-lime-200 { background-color: var(--color-lime-200); }
.bg-lime-300 { background-color: var(--color-lime-300); }
.bg-lime-400 { background-color: var(--color-lime-400); }
.bg-lime-500 { background-color: var(--color-lime-500); }
.bg-lime-600 { background-color: var(--color-lime-600); }
.bg-lime-700 { background-color: var(--color-lime-700); }
.bg-lime-800 { background-color: var(--color-lime-800); }
.bg-lime-900 { background-color: var(--color-lime-900); }
.bg-lime-950 { background-color: var(--color-lime-950); }

/* green */
.bg-green-50 { background-color: var(--color-green-50); }
.bg-green-100 { background-color: var(--color-green-100); }
.bg-green-200 { background-color: var(--color-green-200); }
.bg-green-300 { background-color: var(--color-green-300); }
.bg-green-400 { background-color: var(--color-green-400); }
.bg-green-500 { background-color: var(--color-green-500); }
.bg-green-600 { background-color: var(--color-green-600); }
.bg-green-700 { background-color: var(--color-green-700); }
.bg-green-800 { background-color: var(--color-green-800); }
.bg-green-900 { background-color: var(--color-green-900); }
.bg-green-950 { background-color: var(--color-green-950); }

/* emerald */
.bg-emerald-50 { background-color: var(--color-emerald-50); }
.bg-emerald-100 { background-color: var(--color-emerald-100); }
.bg-emerald-200 { background-color: var(--color-emerald-200); }
.bg-emerald-300 { background-color: var(--color-emerald-300); }
.bg-emerald-400 { background-color: var(--color-emerald-400); }
.bg-emerald-500 { background-color: var(--color-emerald-500); }
.bg-emerald-600 { background-color: var(--color-emerald-600); }
.bg-emerald-700 { background-color: var(--color-emerald-700); }
.bg-emerald-800 { background-color: var(--color-emerald-800); }
.bg-emerald-900 { background-color: var(--color-emerald-900); }
.bg-emerald-950 { background-color: var(--color-emerald-950); }

/* teal */
.bg-teal-50 { background-color: var(--color-teal-50); }
.bg-teal-100 { background-color: var(--color-teal-100); }
.bg-teal-200 { background-color: var(--color-teal-200); }
.bg-teal-300 { background-color: var(--color-teal-300); }
.bg-teal-400 { background-color: var(--color-teal-400); }
.bg-teal-500 { background-color: var(--color-teal-500); }
.bg-teal-600 { background-color: var(--color-teal-600); }
.bg-teal-700 { background-color: var(--color-teal-700); }
.bg-teal-800 { background-color: var(--color-teal-800); }
.bg-teal-900 { background-color: var(--color-teal-900); }
.bg-teal-950 { background-color: var(--color-teal-950); }

/* cyan */
.bg-cyan-50 { background-color: var(--color-cyan-50); }
.bg-cyan-100 { background-color: var(--color-cyan-100); }
.bg-cyan-200 { background-color: var(--color-cyan-200); }
.bg-cyan-300 { background-color: var(--color-cyan-300); }
.bg-cyan-400 { background-color: var(--color-cyan-400); }
.bg-cyan-500 { background-color: var(--color-cyan-500); }
.bg-cyan-600 { background-color: var(--color-cyan-600); }
.bg-cyan-700 { background-color: var(--color-cyan-700); }
.bg-cyan-800 { background-color: var(--color-cyan-800); }
.bg-cyan-900 { background-color: var(--color-cyan-900); }
.bg-cyan-950 { background-color: var(--color-cyan-950); }

/* sky */
.bg-sky-50 { background-color: var(--color-sky-50); }
.bg-sky-100 { background-color: var(--color-sky-100); }
.bg-sky-200 { background-color: var(--color-sky-200); }
.bg-sky-300 { background-color: var(--color-sky-300); }
.bg-sky-400 { background-color: var(--color-sky-400); }
.bg-sky-500 { background-color: var(--color-sky-500); }
.bg-sky-600 { background-color: var(--color-sky-600); }
.bg-sky-700 { background-color: var(--color-sky-700); }
.bg-sky-800 { background-color: var(--color-sky-800); }
.bg-sky-900 { background-color: var(--color-sky-900); }
.bg-sky-950 { background-color: var(--color-sky-950); }

/* blue */
.bg-blue-50 { background-color: var(--color-blue-50); }
.bg-blue-100 { background-color: var(--color-blue-100); }
.bg-blue-200 { background-color: var(--color-blue-200); }
.bg-blue-300 { background-color: var(--color-blue-300); }
.bg-blue-400 { background-color: var(--color-blue-400); }
.bg-blue-500 { background-color: var(--color-blue-500); }
.bg-blue-600 { background-color: var(--color-blue-600); }
.bg-blue-700 { background-color: var(--color-blue-700); }
.bg-blue-800 { background-color: var(--color-blue-800); }
.bg-blue-900 { background-color: var(--color-blue-900); }
.bg-blue-950 { background-color: var(--color-blue-950); }

/* indigo */
.bg-indigo-50 { background-color: var(--color-indigo-50); }
.bg-indigo-100 { background-color: var(--color-indigo-100); }
.bg-indigo-200 { background-color: var(--color-indigo-200); }
.bg-indigo-300 { background-color: var(--color-indigo-300); }
.bg-indigo-400 { background-color: var(--color-indigo-400); }
.bg-indigo-500 { background-color: var(--color-indigo-500); }
.bg-indigo-600 { background-color: var(--color-indigo-600); }
.bg-indigo-700 { background-color: var(--color-indigo-700); }
.bg-indigo-800 { background-color: var(--color-indigo-800); }
.bg-indigo-900 { background-color: var(--color-indigo-900); }
.bg-indigo-950 { background-color: var(--color-indigo-950); }

/* violet */
.bg-violet-50 { background-color: var(--color-violet-50); }
.bg-violet-100 { background-color: var(--color-violet-100); }
.bg-violet-200 { background-color: var(--color-violet-200); }
.bg-violet-300 { background-color: var(--color-violet-300); }
.bg-violet-400 { background-color: var(--color-violet-400); }
.bg-violet-500 { background-color: var(--color-violet-500); }
.bg-violet-600 { background-color: var(--color-violet-600); }
.bg-violet-700 { background-color: var(--color-violet-700); }
.bg-violet-800 { background-color: var(--color-violet-800); }
.bg-violet-900 { background-color: var(--color-violet-900); }
.bg-violet-950 { background-color: var(--color-violet-950); }

/* purple */
.bg-purple-50 { background-color: var(--color-purple-50); }
.bg-purple-100 { background-color: var(--color-purple-100); }
.bg-purple-200 { background-color: var(--color-purple-200); }
.bg-purple-300 { background-color: var(--color-purple-300); }
.bg-purple-400 { background-color: var(--color-purple-400); }
.bg-purple-500 { background-color: var(--color-purple-500); }
.bg-purple-600 { background-color: var(--color-purple-600); }
.bg-purple-700 { background-color: var(--color-purple-700); }
.bg-purple-800 { background-color: var(--color-purple-800); }
.bg-purple-900 { background-color: var(--color-purple-900); }
.bg-purple-950 { background-color: var(--color-purple-950); }

/* fuchsia */
.bg-fuchsia-50 { background-color: var(--color-fuchsia-50); }
.bg-fuchsia-100 { background-color: var(--color-fuchsia-100); }
.bg-fuchsia-200 { background-color: var(--color-fuchsia-200); }
.bg-fuchsia-300 { background-color: var(--color-fuchsia-300); }
.bg-fuchsia-400 { background-color: var(--color-fuchsia-400); }
.bg-fuchsia-500 { background-color: var(--color-fuchsia-500); }
.bg-fuchsia-600 { background-color: var(--color-fuchsia-600); }
.bg-fuchsia-700 { background-color: var(--color-fuchsia-700); }
.bg-fuchsia-800 { background-color: var(--color-fuchsia-800); }
.bg-fuchsia-900 { background-color: var(--color-fuchsia-900); }
.bg-fuchsia-950 { background-color: var(--color-fuchsia-950); }

/* pink */
.bg-pink-50 { background-color: var(--color-pink-50); }
.bg-pink-100 { background-color: var(--color-pink-100); }
.bg-pink-200 { background-color: var(--color-pink-200); }
.bg-pink-300 { background-color: var(--color-pink-300); }
.bg-pink-400 { background-color: var(--color-pink-400); }
.bg-pink-500 { background-color: var(--color-pink-500); }
.bg-pink-600 { background-color: var(--color-pink-600); }
.bg-pink-700 { background-color: var(--color-pink-700); }
.bg-pink-800 { background-color: var(--color-pink-800); }
.bg-pink-900 { background-color: var(--color-pink-900); }
.bg-pink-950 { background-color: var(--color-pink-950); }

/* rose */
.bg-rose-50 { background-color: var(--color-rose-50); }
.bg-rose-100 { background-color: var(--color-rose-100); }
.bg-rose-200 { background-color: var(--color-rose-200); }
.bg-rose-300 { background-color: var(--color-rose-300); }
.bg-rose-400 { background-color: var(--color-rose-400); }
.bg-rose-500 { background-color: var(--color-rose-500); }
.bg-rose-600 { background-color: var(--color-rose-600); }
.bg-rose-700 { background-color: var(--color-rose-700); }
.bg-rose-800 { background-color: var(--color-rose-800); }
.bg-rose-900 { background-color: var(--color-rose-900); }
.bg-rose-950 { background-color: var(--color-rose-950); }

/* slate */
.bg-slate-50 { background-color: var(--color-slate-50); }
.bg-slate-100 { background-color: var(--color-slate-100); }
.bg-slate-200 { background-color: var(--color-slate-200); }
.bg-slate-300 { background-color: var(--color-slate-300); }
.bg-slate-400 { background-color: var(--color-slate-400); }
.bg-slate-500 { background-color: var(--color-slate-500); }
.bg-slate-600 { background-color: var(--color-slate-600); }
.bg-slate-700 { background-color: var(--color-slate-700); }
.bg-slate-800 { background-color: var(--color-slate-800); }
.bg-slate-900 { background-color: var(--color-slate-900); }
.bg-slate-950 { background-color: var(--color-slate-950); }

/* gray */
.bg-gray-50 { background-color: var(--color-gray-50); }
.bg-gray-100 { background-color: var(--color-gray-100); }
.bg-gray-200 { background-color: var(--color-gray-200); }
.bg-gray-300 { background-color: var(--color-gray-300); }
.bg-gray-400 { background-color: var(--color-gray-400); }
.bg-gray-500 { background-color: var(--color-gray-500); }
.bg-gray-600 { background-color: var(--color-gray-600); }
.bg-gray-700 { background-color: var(--color-gray-700); }
.bg-gray-800 { background-color: var(--color-gray-800); }
.bg-gray-900 { background-color: var(--color-gray-900); }
.bg-gray-950 { background-color: var(--color-gray-950); }

/* zinc */
.bg-zinc-50 { background-color: var(--color-zinc-50); }
.bg-zinc-100 { background-color: var(--color-zinc-100); }
.bg-zinc-200 { background-color: var(--color-zinc-200); }
.bg-zinc-300 { background-color: var(--color-zinc-300); }
.bg-zinc-400 { background-color: var(--color-zinc-400); }
.bg-zinc-500 { background-color: var(--color-zinc-500); }
.bg-zinc-600 { background-color: var(--color-zinc-600); }
.bg-zinc-700 { background-color: var(--color-zinc-700); }
.bg-zinc-800 { background-color: var(--color-zinc-800); }
.bg-zinc-900 { background-color: var(--color-zinc-900); }
.bg-zinc-950 { background-color: var(--color-zinc-950); }

/* neutral */
.bg-neutral-50 { background-color: var(--color-neutral-50); }
.bg-neutral-100 { background-color: var(--color-neutral-100); }
.bg-neutral-200 { background-color: var(--color-neutral-200); }
.bg-neutral-300 { background-color: var(--color-neutral-300); }
.bg-neutral-400 { background-color: var(--color-neutral-400); }
.bg-neutral-500 { background-color: var(--color-neutral-500); }
.bg-neutral-600 { background-color: var(--color-neutral-600); }
.bg-neutral-700 { background-color: var(--color-neutral-700); }
.bg-neutral-800 { background-color: var(--color-neutral-800); }
.bg-neutral-900 { background-color: var(--color-neutral-900); }
.bg-neutral-950 { background-color: var(--color-neutral-950); }

/* stone */
.bg-stone-50 { background-color: var(--color-stone-50); }
.bg-stone-100 { background-color: var(--color-stone-100); }
.bg-stone-200 { background-color: var(--color-stone-200); }
.bg-stone-300 { background-color: var(--color-stone-300); }
.bg-stone-400 { background-color: var(--color-stone-400); }
.bg-stone-500 { background-color: var(--color-stone-500); }
.bg-stone-600 { background-color: var(--color-stone-600); }
.bg-stone-700 { background-color: var(--color-stone-700); }
.bg-stone-800 { background-color: var(--color-stone-800); }
.bg-stone-900 { background-color: var(--color-stone-900); }
.bg-stone-950 { background-color: var(--color-stone-950); }

/* mauve */
.bg-mauve-50 { background-color: var(--color-mauve-50); }
.bg-mauve-100 { background-color: var(--color-mauve-100); }
.bg-mauve-200 { background-color: var(--color-mauve-200); }
.bg-mauve-300 { background-color: var(--color-mauve-300); }
.bg-mauve-400 { background-color: var(--color-mauve-400); }
.bg-mauve-500 { background-color: var(--color-mauve-500); }
.bg-mauve-600 { background-color: var(--color-mauve-600); }
.bg-mauve-700 { background-color: var(--color-mauve-700); }
.bg-mauve-800 { background-color: var(--color-mauve-800); }
.bg-mauve-900 { background-color: var(--color-mauve-900); }
.bg-mauve-950 { background-color: var(--color-mauve-950); }

/* olive */
.bg-olive-50 { background-color: var(--color-olive-50); }
.bg-olive-100 { background-color: var(--color-olive-100); }
.bg-olive-200 { background-color: var(--color-olive-200); }
.bg-olive-300 { background-color: var(--color-olive-300); }
.bg-olive-400 { background-color: var(--color-olive-400); }
.bg-olive-500 { background-color: var(--color-olive-500); }
.bg-olive-600 { background-color: var(--color-olive-600); }
.bg-olive-700 { background-color: var(--color-olive-700); }
.bg-olive-800 { background-color: var(--color-olive-800); }
.bg-olive-900 { background-color: var(--color-olive-900); }
.bg-olive-950 { background-color: var(--color-olive-950); }

/* mist */
.bg-mist-50 { background-color: var(--color-mist-50); }
.bg-mist-100 { background-color: var(--color-mist-100); }
.bg-mist-200 { background-color: var(--color-mist-200); }
.bg-mist-300 { background-color: var(--color-mist-300); }
.bg-mist-400 { background-color: var(--color-mist-400); }
.bg-mist-500 { background-color: var(--color-mist-500); }
.bg-mist-600 { background-color: var(--color-mist-600); }
.bg-mist-700 { background-color: var(--color-mist-700); }
.bg-mist-800 { background-color: var(--color-mist-800); }
.bg-mist-900 { background-color: var(--color-mist-900); }
.bg-mist-950 { background-color: var(--color-mist-950); }

/* taupe */
.bg-taupe-50 { background-color: var(--color-taupe-50); }
.bg-taupe-100 { background-color: var(--color-taupe-100); }
.bg-taupe-200 { background-color: var(--color-taupe-200); }
.bg-taupe-300 { background-color: var(--color-taupe-300); }
.bg-taupe-400 { background-color: var(--color-taupe-400); }
.bg-taupe-500 { background-color: var(--color-taupe-500); }
.bg-taupe-600 { background-color: var(--color-taupe-600); }
.bg-taupe-700 { background-color: var(--color-taupe-700); }
.bg-taupe-800 { background-color: var(--color-taupe-800); }
.bg-taupe-900 { background-color: var(--color-taupe-900); }
.bg-taupe-950 { background-color: var(--color-taupe-950); }


.bg-grad { background: linear-gradient(45deg,rgba(215, 231, 248, 1) 0%, rgba(39, 127, 175, 1) 50%, rgba(4, 69, 155, 1) 100%); }
.bg-grad.op10 { background: linear-gradient(45deg,rgba(215, 231, 248, 0.1) 0%, rgba(39, 127, 175, 0.1) 50%, rgba(4, 69, 155, 0.1) 100%); }


.ripples {
 position:absolute;
 left:0;
 top:0;
 height:100%;
 width:100%;
 overflow:hidden;
}

.ripples div {
 position: absolute;
 left: 0;
 top: 0;
 width: 0;
 height: 0;
 /*border: solid 2px var(--color-blue-100);*/
 background-color:var(--color-green-100);
 border-radius: 50%;
 opacity: 0;
 animation: ripples_anim 8s linear infinite;
}

@keyframes ripples_anim {
  0% {
  opacity: 1;
 }
 50% {  
  transform: translate(-100px,-100px);
  width: 200px;
  height: 200px;
  opacity: 0;
 }
}

.ripples div:nth-of-type(1) {
 left: 25%;
 top: 30%;
 animation-delay: 2s;
 background-color:var(--theme-a);
}

.ripples div:nth-of-type(2) {
 left: 10%;
 top: 60%;
 animation-delay: 4.5s;
 background-color:var(--theme-a);
}

.ripples div:nth-of-type(3) {
 left: 40%;
 top: 50%;
 animation-delay: 3.5s;
 background-color:var(--theme-a);
}

.ripples div:nth-of-type(4) {
 left: 40%;
 top: 30%;
 animation-delay: 2.5s;
}

.ripples div:nth-of-type(5) {
 left: 50%;
 top: 40%;
 animation-delay: 4.1s;
}

.ripples div:nth-of-type(6) {
 left: 60%;
 top: 40%;
 animation-delay: 3.2s;
}

.ripples div:nth-of-type(7) {
 left: 70%;
 top: 80%;
 animation-delay: 4.1s;
}

.ripples div:nth-of-type(8) {
 left: 80%;
 top: 70%;
 animation-delay: 1.2s;
}

.ripples div:nth-of-type(9) {
 left: 90%;
 top: 50%;
 animation-delay: 1.7s;
}

.ripples div:nth-of-type(10) {
 left: 100%;
 top: 20%;
 animation-delay: 4.5s;
}

/*--- border-color ---*/
.border_main { border-color:var(--main); }
.border_sub { border-color:var(--sub); }
.border_second { border-color:var(--second); }

.border-work { border-color:var(--work); }
.border-learn { border-color:var(--learn); }
.border-experience { border-color:var(--experience); }

.border_white { border-color:var(--white); }
.border-gray-f7 { border-color:var(--gray_f7); }
.border-gray-f2 { border-color:var(--gray_f2); }
.border-gray-ee { border-color:var(--gray_ee); }
.border-gray-eb { border-color:var(--gray_eb); }
.border-gray-dd { border-color:var(--gray_dd); }
.border-gray-cc { border-color:var(--gray_cc); }
.border-gray-99 { border-color:var(--gray_99); }
.border-gray-66 { border-color:var(--gray_66); }
.border-gray-33 { border-color:var(--gray_33); }
.border-gray-1a { border-color:var(--gray_1a); }

/* main */
.border-main-50 { border-color: var(--color-main-50); }
.border-main-100 { border-color: var(--color-main-100); }
.border-main-200 { border-color: var(--color-main-200); }
.border-main-300 { border-color: var(--color-main-300); }
.border-main-400 { border-color: var(--color-main-400); }
.border-main-500 { border-color: var(--color-main-500); }
.border-main-600 { border-color: var(--color-main-600); }
.border-main-700 { border-color: var(--color-main-700); }
.border-main-800 { border-color: var(--color-main-800); }
.border-main-900 { border-color: var(--color-main-900); }
.border-main-950 { border-color: var(--color-main-950); }

/* sub */
.border-sub-50 { border-color: var(--color-sub-50); }
.border-sub-100 { border-color: var(--color-sub-100); }
.border-sub-200 { border-color: var(--color-sub-200); }
.border-sub-300 { border-color: var(--color-sub-300); }
.border-sub-400 { border-color: var(--color-sub-400); }
.border-sub-500 { border-color: var(--color-sub-500); }
.border-sub-600 { border-color: var(--color-sub-600); }
.border-sub-700 { border-color: var(--color-sub-700); }
.border-sub-800 { border-color: var(--color-sub-800); }
.border-sub-900 { border-color: var(--color-sub-900); }
.border-sub-950 { border-color: var(--color-sub-950); }

/* second */
.border-second-50 { border-color: var(--color-second-50); }
.border-second-100 { border-color: var(--color-second-100); }
.border-second-200 { border-color: var(--color-second-200); }
.border-second-300 { border-color: var(--color-second-300); }
.border-second-400 { border-color: var(--color-second-400); }
.border-second-500 { border-color: var(--color-second-500); }
.border-second-600 { border-color: var(--color-second-600); }
.border-second-700 { border-color: var(--color-second-700); }
.border-second-800 { border-color: var(--color-second-800); }
.border-second-900 { border-color: var(--color-second-900); }
.border-second-950 { border-color: var(--color-second-950); }

/* red */
.border-red-50 { border-color: var(--color-red-50); }
.border-red-100 { border-color: var(--color-red-100); }
.border-red-200 { border-color: var(--color-red-200); }
.border-red-300 { border-color: var(--color-red-300); }
.border-red-400 { border-color: var(--color-red-400); }
.border-red-500 { border-color: var(--color-red-500); }
.border-red-600 { border-color: var(--color-red-600); }
.border-red-700 { border-color: var(--color-red-700); }
.border-red-800 { border-color: var(--color-red-800); }
.border-red-900 { border-color: var(--color-red-900); }
.border-red-950 { border-color: var(--color-red-950); }

/* orange */
.border-orange-50 { border-color: var(--color-orange-50); }
.border-orange-100 { border-color: var(--color-orange-100); }
.border-orange-200 { border-color: var(--color-orange-200); }
.border-orange-300 { border-color: var(--color-orange-300); }
.border-orange-400 { border-color: var(--color-orange-400); }
.border-orange-500 { border-color: var(--color-orange-500); }
.border-orange-600 { border-color: var(--color-orange-600); }
.border-orange-700 { border-color: var(--color-orange-700); }
.border-orange-800 { border-color: var(--color-orange-800); }
.border-orange-900 { border-color: var(--color-orange-900); }
.border-orange-950 { border-color: var(--color-orange-950); }

/* amber */
.border-amber-50 { border-color: var(--color-amber-50); }
.border-amber-100 { border-color: var(--color-amber-100); }
.border-amber-200 { border-color: var(--color-amber-200); }
.border-amber-300 { border-color: var(--color-amber-300); }
.border-amber-400 { border-color: var(--color-amber-400); }
.border-amber-500 { border-color: var(--color-amber-500); }
.border-amber-600 { border-color: var(--color-amber-600); }
.border-amber-700 { border-color: var(--color-amber-700); }
.border-amber-800 { border-color: var(--color-amber-800); }
.border-amber-900 { border-color: var(--color-amber-900); }
.border-amber-950 { border-color: var(--color-amber-950); }

/* yellow */
.border-yellow-50 { border-color: var(--color-yellow-50); }
.border-yellow-100 { border-color: var(--color-yellow-100); }
.border-yellow-200 { border-color: var(--color-yellow-200); }
.border-yellow-300 { border-color: var(--color-yellow-300); }
.border-yellow-400 { border-color: var(--color-yellow-400); }
.border-yellow-500 { border-color: var(--color-yellow-500); }
.border-yellow-600 { border-color: var(--color-yellow-600); }
.border-yellow-700 { border-color: var(--color-yellow-700); }
.border-yellow-800 { border-color: var(--color-yellow-800); }
.border-yellow-900 { border-color: var(--color-yellow-900); }
.border-yellow-950 { border-color: var(--color-yellow-950); }

/* lime */
.border-lime-50 { border-color: var(--color-lime-50); }
.border-lime-100 { border-color: var(--color-lime-100); }
.border-lime-200 { border-color: var(--color-lime-200); }
.border-lime-300 { border-color: var(--color-lime-300); }
.border-lime-400 { border-color: var(--color-lime-400); }
.border-lime-500 { border-color: var(--color-lime-500); }
.border-lime-600 { border-color: var(--color-lime-600); }
.border-lime-700 { border-color: var(--color-lime-700); }
.border-lime-800 { border-color: var(--color-lime-800); }
.border-lime-900 { border-color: var(--color-lime-900); }
.border-lime-950 { border-color: var(--color-lime-950); }

/* green */
.border-green-50 { border-color: var(--color-green-50); }
.border-green-100 { border-color: var(--color-green-100); }
.border-green-200 { border-color: var(--color-green-200); }
.border-green-300 { border-color: var(--color-green-300); }
.border-green-400 { border-color: var(--color-green-400); }
.border-green-500 { border-color: var(--color-green-500); }
.border-green-600 { border-color: var(--color-green-600); }
.border-green-700 { border-color: var(--color-green-700); }
.border-green-800 { border-color: var(--color-green-800); }
.border-green-900 { border-color: var(--color-green-900); }
.border-green-950 { border-color: var(--color-green-950); }

/* emerald */
.border-emerald-50 { border-color: var(--color-emerald-50); }
.border-emerald-100 { border-color: var(--color-emerald-100); }
.border-emerald-200 { border-color: var(--color-emerald-200); }
.border-emerald-300 { border-color: var(--color-emerald-300); }
.border-emerald-400 { border-color: var(--color-emerald-400); }
.border-emerald-500 { border-color: var(--color-emerald-500); }
.border-emerald-600 { border-color: var(--color-emerald-600); }
.border-emerald-700 { border-color: var(--color-emerald-700); }
.border-emerald-800 { border-color: var(--color-emerald-800); }
.border-emerald-900 { border-color: var(--color-emerald-900); }
.border-emerald-950 { border-color: var(--color-emerald-950); }

/* teal */
.border-teal-50 { border-color: var(--color-teal-50); }
.border-teal-100 { border-color: var(--color-teal-100); }
.border-teal-200 { border-color: var(--color-teal-200); }
.border-teal-300 { border-color: var(--color-teal-300); }
.border-teal-400 { border-color: var(--color-teal-400); }
.border-teal-500 { border-color: var(--color-teal-500); }
.border-teal-600 { border-color: var(--color-teal-600); }
.border-teal-700 { border-color: var(--color-teal-700); }
.border-teal-800 { border-color: var(--color-teal-800); }
.border-teal-900 { border-color: var(--color-teal-900); }
.border-teal-950 { border-color: var(--color-teal-950); }

/* cyan */
.border-cyan-50 { border-color: var(--color-cyan-50); }
.border-cyan-100 { border-color: var(--color-cyan-100); }
.border-cyan-200 { border-color: var(--color-cyan-200); }
.border-cyan-300 { border-color: var(--color-cyan-300); }
.border-cyan-400 { border-color: var(--color-cyan-400); }
.border-cyan-500 { border-color: var(--color-cyan-500); }
.border-cyan-600 { border-color: var(--color-cyan-600); }
.border-cyan-700 { border-color: var(--color-cyan-700); }
.border-cyan-800 { border-color: var(--color-cyan-800); }
.border-cyan-900 { border-color: var(--color-cyan-900); }
.border-cyan-950 { border-color: var(--color-cyan-950); }

/* sky */
.border-sky-50 { border-color: var(--color-sky-50); }
.border-sky-100 { border-color: var(--color-sky-100); }
.border-sky-200 { border-color: var(--color-sky-200); }
.border-sky-300 { border-color: var(--color-sky-300); }
.border-sky-400 { border-color: var(--color-sky-400); }
.border-sky-500 { border-color: var(--color-sky-500); }
.border-sky-600 { border-color: var(--color-sky-600); }
.border-sky-700 { border-color: var(--color-sky-700); }
.border-sky-800 { border-color: var(--color-sky-800); }
.border-sky-900 { border-color: var(--color-sky-900); }
.border-sky-950 { border-color: var(--color-sky-950); }

/* blue */
.border-blue-50 { border-color: var(--color-blue-50); }
.border-blue-100 { border-color: var(--color-blue-100); }
.border-blue-200 { border-color: var(--color-blue-200); }
.border-blue-300 { border-color: var(--color-blue-300); }
.border-blue-400 { border-color: var(--color-blue-400); }
.border-blue-500 { border-color: var(--color-blue-500); }
.border-blue-600 { border-color: var(--color-blue-600); }
.border-blue-700 { border-color: var(--color-blue-700); }
.border-blue-800 { border-color: var(--color-blue-800); }
.border-blue-900 { border-color: var(--color-blue-900); }
.border-blue-950 { border-color: var(--color-blue-950); }

/* indigo */
.border-indigo-50 { border-color: var(--color-indigo-50); }
.border-indigo-100 { border-color: var(--color-indigo-100); }
.border-indigo-200 { border-color: var(--color-indigo-200); }
.border-indigo-300 { border-color: var(--color-indigo-300); }
.border-indigo-400 { border-color: var(--color-indigo-400); }
.border-indigo-500 { border-color: var(--color-indigo-500); }
.border-indigo-600 { border-color: var(--color-indigo-600); }
.border-indigo-700 { border-color: var(--color-indigo-700); }
.border-indigo-800 { border-color: var(--color-indigo-800); }
.border-indigo-900 { border-color: var(--color-indigo-900); }
.border-indigo-950 { border-color: var(--color-indigo-950); }

/* violet */
.border-violet-50 { border-color: var(--color-violet-50); }
.border-violet-100 { border-color: var(--color-violet-100); }
.border-violet-200 { border-color: var(--color-violet-200); }
.border-violet-300 { border-color: var(--color-violet-300); }
.border-violet-400 { border-color: var(--color-violet-400); }
.border-violet-500 { border-color: var(--color-violet-500); }
.border-violet-600 { border-color: var(--color-violet-600); }
.border-violet-700 { border-color: var(--color-violet-700); }
.border-violet-800 { border-color: var(--color-violet-800); }
.border-violet-900 { border-color: var(--color-violet-900); }
.border-violet-950 { border-color: var(--color-violet-950); }

/* purple */
.border-purple-50 { border-color: var(--color-purple-50); }
.border-purple-100 { border-color: var(--color-purple-100); }
.border-purple-200 { border-color: var(--color-purple-200); }
.border-purple-300 { border-color: var(--color-purple-300); }
.border-purple-400 { border-color: var(--color-purple-400); }
.border-purple-500 { border-color: var(--color-purple-500); }
.border-purple-600 { border-color: var(--color-purple-600); }
.border-purple-700 { border-color: var(--color-purple-700); }
.border-purple-800 { border-color: var(--color-purple-800); }
.border-purple-900 { border-color: var(--color-purple-900); }
.border-purple-950 { border-color: var(--color-purple-950); }

/* fuchsia */
.border-fuchsia-50 { border-color: var(--color-fuchsia-50); }
.border-fuchsia-100 { border-color: var(--color-fuchsia-100); }
.border-fuchsia-200 { border-color: var(--color-fuchsia-200); }
.border-fuchsia-300 { border-color: var(--color-fuchsia-300); }
.border-fuchsia-400 { border-color: var(--color-fuchsia-400); }
.border-fuchsia-500 { border-color: var(--color-fuchsia-500); }
.border-fuchsia-600 { border-color: var(--color-fuchsia-600); }
.border-fuchsia-700 { border-color: var(--color-fuchsia-700); }
.border-fuchsia-800 { border-color: var(--color-fuchsia-800); }
.border-fuchsia-900 { border-color: var(--color-fuchsia-900); }
.border-fuchsia-950 { border-color: var(--color-fuchsia-950); }

/* pink */
.border-pink-50 { border-color: var(--color-pink-50); }
.border-pink-100 { border-color: var(--color-pink-100); }
.border-pink-200 { border-color: var(--color-pink-200); }
.border-pink-300 { border-color: var(--color-pink-300); }
.border-pink-400 { border-color: var(--color-pink-400); }
.border-pink-500 { border-color: var(--color-pink-500); }
.border-pink-600 { border-color: var(--color-pink-600); }
.border-pink-700 { border-color: var(--color-pink-700); }
.border-pink-800 { border-color: var(--color-pink-800); }
.border-pink-900 { border-color: var(--color-pink-900); }
.border-pink-950 { border-color: var(--color-pink-950); }

/* rose */
.border-rose-50 { border-color: var(--color-rose-50); }
.border-rose-100 { border-color: var(--color-rose-100); }
.border-rose-200 { border-color: var(--color-rose-200); }
.border-rose-300 { border-color: var(--color-rose-300); }
.border-rose-400 { border-color: var(--color-rose-400); }
.border-rose-500 { border-color: var(--color-rose-500); }
.border-rose-600 { border-color: var(--color-rose-600); }
.border-rose-700 { border-color: var(--color-rose-700); }
.border-rose-800 { border-color: var(--color-rose-800); }
.border-rose-900 { border-color: var(--color-rose-900); }
.border-rose-950 { border-color: var(--color-rose-950); }

/* slate */
.border-slate-50 { border-color: var(--color-slate-50); }
.border-slate-100 { border-color: var(--color-slate-100); }
.border-slate-200 { border-color: var(--color-slate-200); }
.border-slate-300 { border-color: var(--color-slate-300); }
.border-slate-400 { border-color: var(--color-slate-400); }
.border-slate-500 { border-color: var(--color-slate-500); }
.border-slate-600 { border-color: var(--color-slate-600); }
.border-slate-700 { border-color: var(--color-slate-700); }
.border-slate-800 { border-color: var(--color-slate-800); }
.border-slate-900 { border-color: var(--color-slate-900); }
.border-slate-950 { border-color: var(--color-slate-950); }

/* gray */
.border-gray-50 { border-color: var(--color-gray-50); }
.border-gray-100 { border-color: var(--color-gray-100); }
.border-gray-200 { border-color: var(--color-gray-200); }
.border-gray-300 { border-color: var(--color-gray-300); }
.border-gray-400 { border-color: var(--color-gray-400); }
.border-gray-500 { border-color: var(--color-gray-500); }
.border-gray-600 { border-color: var(--color-gray-600); }
.border-gray-700 { border-color: var(--color-gray-700); }
.border-gray-800 { border-color: var(--color-gray-800); }
.border-gray-900 { border-color: var(--color-gray-900); }
.border-gray-950 { border-color: var(--color-gray-950); }

/* zinc */
.border-zinc-50 { border-color: var(--color-zinc-50); }
.border-zinc-100 { border-color: var(--color-zinc-100); }
.border-zinc-200 { border-color: var(--color-zinc-200); }
.border-zinc-300 { border-color: var(--color-zinc-300); }
.border-zinc-400 { border-color: var(--color-zinc-400); }
.border-zinc-500 { border-color: var(--color-zinc-500); }
.border-zinc-600 { border-color: var(--color-zinc-600); }
.border-zinc-700 { border-color: var(--color-zinc-700); }
.border-zinc-800 { border-color: var(--color-zinc-800); }
.border-zinc-900 { border-color: var(--color-zinc-900); }
.border-zinc-950 { border-color: var(--color-zinc-950); }

/* neutral */
.border-neutral-50 { border-color: var(--color-neutral-50); }
.border-neutral-100 { border-color: var(--color-neutral-100); }
.border-neutral-200 { border-color: var(--color-neutral-200); }
.border-neutral-300 { border-color: var(--color-neutral-300); }
.border-neutral-400 { border-color: var(--color-neutral-400); }
.border-neutral-500 { border-color: var(--color-neutral-500); }
.border-neutral-600 { border-color: var(--color-neutral-600); }
.border-neutral-700 { border-color: var(--color-neutral-700); }
.border-neutral-800 { border-color: var(--color-neutral-800); }
.border-neutral-900 { border-color: var(--color-neutral-900); }
.border-neutral-950 { border-color: var(--color-neutral-950); }

/* stone */
.border-stone-50 { border-color: var(--color-stone-50); }
.border-stone-100 { border-color: var(--color-stone-100); }
.border-stone-200 { border-color: var(--color-stone-200); }
.border-stone-300 { border-color: var(--color-stone-300); }
.border-stone-400 { border-color: var(--color-stone-400); }
.border-stone-500 { border-color: var(--color-stone-500); }
.border-stone-600 { border-color: var(--color-stone-600); }
.border-stone-700 { border-color: var(--color-stone-700); }
.border-stone-800 { border-color: var(--color-stone-800); }
.border-stone-900 { border-color: var(--color-stone-900); }
.border-stone-950 { border-color: var(--color-stone-950); }

/* mauve */
.border-mauve-50 { border-color: var(--color-mauve-50); }
.border-mauve-100 { border-color: var(--color-mauve-100); }
.border-mauve-200 { border-color: var(--color-mauve-200); }
.border-mauve-300 { border-color: var(--color-mauve-300); }
.border-mauve-400 { border-color: var(--color-mauve-400); }
.border-mauve-500 { border-color: var(--color-mauve-500); }
.border-mauve-600 { border-color: var(--color-mauve-600); }
.border-mauve-700 { border-color: var(--color-mauve-700); }
.border-mauve-800 { border-color: var(--color-mauve-800); }
.border-mauve-900 { border-color: var(--color-mauve-900); }
.border-mauve-950 { border-color: var(--color-mauve-950); }

/* olive */
.border-olive-50 { border-color: var(--color-olive-50); }
.border-olive-100 { border-color: var(--color-olive-100); }
.border-olive-200 { border-color: var(--color-olive-200); }
.border-olive-300 { border-color: var(--color-olive-300); }
.border-olive-400 { border-color: var(--color-olive-400); }
.border-olive-500 { border-color: var(--color-olive-500); }
.border-olive-600 { border-color: var(--color-olive-600); }
.border-olive-700 { border-color: var(--color-olive-700); }
.border-olive-800 { border-color: var(--color-olive-800); }
.border-olive-900 { border-color: var(--color-olive-900); }
.border-olive-950 { border-color: var(--color-olive-950); }

/* mist */
.border-mist-50 { border-color: var(--color-mist-50); }
.border-mist-100 { border-color: var(--color-mist-100); }
.border-mist-200 { border-color: var(--color-mist-200); }
.border-mist-300 { border-color: var(--color-mist-300); }
.border-mist-400 { border-color: var(--color-mist-400); }
.border-mist-500 { border-color: var(--color-mist-500); }
.border-mist-600 { border-color: var(--color-mist-600); }
.border-mist-700 { border-color: var(--color-mist-700); }
.border-mist-800 { border-color: var(--color-mist-800); }
.border-mist-900 { border-color: var(--color-mist-900); }
.border-mist-950 { border-color: var(--color-mist-950); }

/* taupe */
.border-taupe-50 { border-color: var(--color-taupe-50); }
.border-taupe-100 { border-color: var(--color-taupe-100); }
.border-taupe-200 { border-color: var(--color-taupe-200); }
.border-taupe-300 { border-color: var(--color-taupe-300); }
.border-taupe-400 { border-color: var(--color-taupe-400); }
.border-taupe-500 { border-color: var(--color-taupe-500); }
.border-taupe-600 { border-color: var(--color-taupe-600); }
.border-taupe-700 { border-color: var(--color-taupe-700); }
.border-taupe-800 { border-color: var(--color-taupe-800); }
.border-taupe-900 { border-color: var(--color-taupe-900); }
.border-taupe-950 { border-color: var(--color-taupe-950); }

/*---------------------------------------------
layout
---------------------------------------------*/
/*--- aspect-ratio ---*/
.aspect-square { aspect-ratio: 1 / 1; }
.aspect-auto { aspect-ratio: auto; }
.aspect-video { aspect-ratio: 16 / 9; }
.aspect-4-3 { aspect-ratio: 4 / 3; }

/*--- visibility ---*/
.visible { visibility: visible; }
.invisible { visibility: hidden; }
.collapse { visibility: collapse; }

/*--- display ---*/
.inline { display: inline; }
.block { display: block; }
.inline-block { display: inline-block; }
.flow-root { display: flow-root; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.grid { display: grid; }
.inline-grid { display: inline-grid; }
.contents { display: contents; }
.table { display: table; }
.inline-table { display: inline-table; }
.table-caption{ display: table-caption; }
.table-cell{ display: table-cell; }
.table-column { display: table-column; }
.table-column-group{ display: table-column-group; }
.table-footer-group { display: table-footer-group; }
.table-header-group { display: table-header-group; }
.table-row-group { display: table-row-group; }
.table-row { display: table-row; }
.list-item { display: list-item; }
.hidden { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; }
.not-sr-only { position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip-path: none; white-space: normal; }

/*--- float ---*/
.float-right { float: right; }
.float-left { float: left; }
.float-start { float: inline-start; }
.float-end { float: inline-end; }
.float-none { float: none; }

/*--- object-fit ---*/
.object-contain { object-fit: contain; }
.object-cover { object-fit: cover; }
.object-fill { object-fit: fill; }
.object-none { object-fit: none; }
.object-scale-down { object-fit: scale-down; }

/*--- object-position ---*/
.object-top-left { object-position: top left; }
.object-top { object-position: top; }
.object-top-right { object-position: top right; }
.object-left { object-position: left; }
.object-center { object-position: center; }
.object-right { object-position: right; }
.object-bottom-left { object-position: bottom left; }
.object-bottom { object-position: bottom; }
.object-bottom-right { object-position: bottom right; }

.object-center-10 { object-position: center 10%; }
.object-center-20 { object-position: center 20%; }
.object-center-30 { object-position: center 30%; }
.object-center-40 { object-position: center 40%; }
.object-center-50 { object-position: center 50%; }
.object-center-60 { object-position: center 60%; }
.object-center-70 { object-position: center 70%; }
.object-center-80 { object-position: center 80%; }
.object-center-90 { object-position: center 90%; }

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

/*--- position ---*/
.static { position: static; }
.fixed { position: fixed; }
.absolute { position: absolute; }
.relative { position: relative; }
.sticky { position: sticky; }

/*--- visibility ---*/
.visible { visibility: visible; }
.invisible { visibility: hidden; }
.collapse { visibility: collapse; }

/*--- z-index ---*/
.z-1 { z-index: 1; }
.z-2 { z-index: 2; }
.z-3 { z-index: 3; }
.z-4 { z-index: 4; }
.z-5 { z-index: 5; }
.z-6 { z-index: 6; }
.z-7 { z-index: 7; }
.z-8 { z-index: 8; }
.z-9 { z-index: 9; }
.z-10 { z-index: 10; }
.z-11 { z-index: 11; }
.z-12 { z-index: 12; }
.z-13 { z-index: 13; }
.z-14 { z-index: 14; }
.z-15 { z-index: 15; }
.z-16 { z-index: 16; }
.z-17 { z-index: 17; }
.z-18 { z-index: 18; }
.z-19 { z-index: 19; }
.z-20 { z-index: 20; }
.z-21 { z-index: 21; }
.z-22 { z-index: 22; }
.z-23 { z-index: 23; }
.z-24 { z-index: 24; }
.z-25 { z-index: 25; }
.z-26 { z-index: 26; }
.z-27 { z-index: 27; }
.z-28 { z-index: 28; }
.z-29 { z-index: 29; }
.z-30 { z-index: 30; }
.z-31 { z-index: 31; }
.z-32 { z-index: 32; }
.z-33 { z-index: 33; }
.z-34 { z-index: 34; }
.z-35 { z-index: 35; }
.z-36 { z-index: 36; }
.z-37 { z-index: 37; }
.z-38 { z-index: 38; }
.z-39 { z-index: 39; }
.z-40 { z-index: 40; }
.z-41 { z-index: 41; }
.z-42 { z-index: 42; }
.z-43 { z-index: 43; }
.z-44 { z-index: 44; }
.z-45 { z-index: 45; }
.z-46 { z-index: 46; }
.z-47 { z-index: 47; }
.z-48 { z-index: 48; }
.z-49 { z-index: 49; }
.z-50 { z-index: 50; }
.z-51 { z-index: 51; }
.z-52 { z-index: 52; }
.z-53 { z-index: 53; }
.z-54 { z-index: 54; }
.z-55 { z-index: 55; }
.z-56 { z-index: 56; }
.z-57 { z-index: 57; }
.z-58 { z-index: 58; }
.z-59 { z-index: 59; }
.z-60 { z-index: 60; }
.z-61 { z-index: 61; }
.z-62 { z-index: 62; }
.z-63 { z-index: 63; }
.z-64 { z-index: 64; }
.z-65 { z-index: 65; }
.z-66 { z-index: 66; }
.z-67 { z-index: 67; }
.z-68 { z-index: 68; }
.z-69 { z-index: 69; }
.z-70 { z-index: 70; }
.z-71 { z-index: 71; }
.z-72 { z-index: 72; }
.z-73 { z-index: 73; }
.z-74 { z-index: 74; }
.z-75 { z-index: 75; }
.z-76 { z-index: 76; }
.z-77 { z-index: 77; }
.z-78 { z-index: 78; }
.z-79 { z-index: 79; }
.z-80 { z-index: 80; }
.z-81 { z-index: 81; }
.z-82 { z-index: 82; }
.z-83 { z-index: 83; }
.z-84 { z-index: 84; }
.z-85 { z-index: 85; }
.z-86 { z-index: 86; }
.z-87 { z-index: 87; }
.z-88 { z-index: 88; }
.z-89 { z-index: 89; }
.z-90 { z-index: 90; }
.z-91 { z-index: 91; }
.z-92 { z-index: 92; }
.z-93 { z-index: 93; }
.z-94 { z-index: 94; }
.z-95 { z-index: 95; }
.z-96 { z-index: 96; }
.z-97 { z-index: 97; }
.z-98 { z-index: 98; }
.z-99 { z-index: 99; }
.z-100 { z-index: 100; }
z-auto { z-index: auto; }


/*---------------------------------------------
flexbox
---------------------------------------------*/
/*--- flex ---*/
.flex-auto { flex: auto; }
.flex-initial { flex: 0 auto; }
.flex-none { flex: none; }

/*--- flex-basis ---*/
.basis-full { flex-basis:100%; }
.basis-auto { flex-basis:auto; }

.basis-3xs { flex-basis: 256px; }
.basis-2xs { flex-basis: 288px; }
.basis-xs { flex-basis:320px; }
.basis-sm { flex-basis:384px; }
.basis-md { flex-basis:448px; }
.basis-lg { flex-basis: 512px; }
.basis-xl { flex-basis:576px; }
.basis-2xl { flex-basis: 672px; }
.basis-3xl { flex-basis: 768px; }
.basis-4xl { flex-basis: 896px; }
.basis-5xl { flex-basis: 1024px; }
.basis-6xl { flex-basis: 1152px; }
.basis-7xl { flex-basis: 1280px; }

/*-- flex-grow --*/
.grow { flex-grow: 1; }
.grow-0 { flex-grow: 0; }

/*--- flex-shrink ---*/
.shrink { flex-shrink: 1; }
.shrink-0 { flex-shrink: 0; }

/*--- flex-basis ---*/
.basis-full { flex-basis: 100%; }
.basis-auto { flex-basis: auto; }
.basis-3xs { flex-basis: var(--container-3xs); } /* 16rem (256px) */
.basis-2xs { flex-basis: var(--container-2xs); } /* 18rem (288px) */
.basis-xs { flex-basis: var(--container-xs); } /* 20rem (320px) */
.basis-sm { flex-basis: var(--container-sm); } /* 24rem (384px) */
.basis-md { flex-basis: var(--container-md); } /* 28rem (448px) */
.basis-lg { flex-basis: var(--container-lg); } /* 32rem (512px) */
.basis-xl { flex-basis: var(--container-xl); } /* 36rem (576px) */
.basis-2xl { flex-basis: var(--container-2xl); } /* 42rem (672px) */
.basis-3xl { flex-basis: var(--container-3xl); } /* 48rem (768px) */
.basis-4xl { flex-basis: var(--container-4xl); } /* 56rem (896px) */
.basis-5xl { flex-basis: var(--container-5xl); } /* 64rem (1024px) */
.basis-6xl { flex-basis: var(--container-6xl); } /* 72rem (1152px) */
.basis-7xl { flex-basis: var(--container-7xl); } /* 80rem (1280px) */

/*--- flex-direction ---*/
.flex-row { flex-direction: row; }
.flex-row-reverse { flex-direction: row-reverse; }
.flex-col { flex-direction: column; }
.flex-col-reverse { flex-direction: column-reverse; }

/*--- flex-wrap ---*/
.flex-nowrap { flex-wrap: nowrap; }
.flex-wrap { flex-wrap: wrap; }
.flex-wrap-reverse { flex-wrap: wrap-reverse; }

/*--- align-items ---*/
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.items-end-safe { align-items: safe flex-end; }
.items-center { align-items: center; }
.items-center-safe { align-items: safe center; }
.items-baseline { align-items: baseline; }
.items-baseline-last { align-items: last baseline; }
.items-stretch { align-items: stretch; }

/*--- align-content ---*/
.content-normal { align-content: normal; }
.content-center { align-content: center; }
.content-start { align-content: flex-start; }
.content-end { align-content: flex-end; }
.content-between { align-content: space-between; }
.content-around { align-content: space-around; }
.content-evenly { align-content: space-evenly; }
.content-baseline { align-content: baseline; }
.content-stretch { align-content: stretch; }

/*--- justify-content ---*/	
.justify-start { justify-content: flex-start; }
.justify-end { justify-content: flex-end; }
.justify-end-safe { justify-content: safe flex-end; }
.justify-center { justify-content: center; }
.justify-center-safe { justify-content: safe center; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }
.justify-evenly { justify-content: space-evenly; }
.justify-stretch { justify-content: stretch; }
.justify-baseline { justify-content: baseline; }
.justify-normal { justify-content: normal; }

/*--- justify-items ---*/	
.justify-items-start { justify-items: start; }
.justify-items-end { justify-items: end; }
.justify-items-end-safe { justify-items: safe end; }
.justify-items-center { justify-items: center; }
.justify-items-center-safe { justify-items: safe center; }
.justify-items-stretch { justify-items: stretch; }
.justify-items-normal { justify-items: normal; }

/*--- gap ---*/
.gap-x-0 { column-gap:0px; }
.gap-x-1 { column-gap:1px; }
.gap-x-2 { column-gap:2px; }
.gap-x-3 { column-gap:3px; }
.gap-x-4 { column-gap:4px; }
.gap-x-5 { column-gap:5px; }
.gap-x-6 { column-gap:6px; }
.gap-x-7 { column-gap:7px; }
.gap-x-8 { column-gap:8px; }
.gap-x-9 { column-gap:9px; }
.gap-x-10 { column-gap:10px; }
.gap-x-11 { column-gap:11px; }
.gap-x-12 { column-gap:12px; }
.gap-x-13 { column-gap:13px; }
.gap-x-14 { column-gap:14px; }
.gap-x-15 { column-gap:15px; }
.gap-x-16 { column-gap:16px; }
.gap-x-17 { column-gap:17px; }
.gap-x-18 { column-gap:18px; }
.gap-x-19 { column-gap:19px; }
.gap-x-20 { column-gap:20px; }
.gap-x-21 { column-gap:21px; }
.gap-x-22 { column-gap:22px; }
.gap-x-23 { column-gap:23px; }
.gap-x-24 { column-gap:24px; }
.gap-x-25 { column-gap:25px; }
.gap-x-26 { column-gap:26px; }
.gap-x-27 { column-gap:27px; }
.gap-x-28 { column-gap:28px; }
.gap-x-29 { column-gap:29px; }
.gap-x-30 { column-gap:30px; }
.gap-x-31 { column-gap:31px; }
.gap-x-32 { column-gap:32px; }
.gap-x-33 { column-gap:33px; }
.gap-x-34 { column-gap:34px; }
.gap-x-35 { column-gap:35px; }
.gap-x-36 { column-gap:36px; }
.gap-x-37 { column-gap:37px; }
.gap-x-38 { column-gap:38px; }
.gap-x-39 { column-gap:39px; }
.gap-x-40 { column-gap:40px; }
.gap-x-41 { column-gap:41px; }
.gap-x-42 { column-gap:42px; }
.gap-x-43 { column-gap:43px; }
.gap-x-44 { column-gap:44px; }
.gap-x-45 { column-gap:45px; }
.gap-x-46 { column-gap:46px; }
.gap-x-47 { column-gap:47px; }
.gap-x-48 { column-gap:48px; }
.gap-x-49 { column-gap:49px; }
.gap-x-50 { column-gap:50px; }
.gap-x-51 { column-gap:51px; }
.gap-x-52 { column-gap:52px; }
.gap-x-53 { column-gap:53px; }
.gap-x-54 { column-gap:54px; }
.gap-x-55 { column-gap:55px; }
.gap-x-56 { column-gap:56px; }
.gap-x-57 { column-gap:57px; }
.gap-x-58 { column-gap:58px; }
.gap-x-59 { column-gap:59px; }
.gap-x-60 { column-gap:60px; }
.gap-x-61 { column-gap:61px; }
.gap-x-62 { column-gap:62px; }
.gap-x-63 { column-gap:63px; }
.gap-x-64 { column-gap:64px; }
.gap-x-65 { column-gap:65px; }
.gap-x-66 { column-gap:66px; }
.gap-x-67 { column-gap:67px; }
.gap-x-68 { column-gap:68px; }
.gap-x-69 { column-gap:69px; }
.gap-x-70 { column-gap:70px; }
.gap-x-71 { column-gap:71px; }
.gap-x-72 { column-gap:72px; }
.gap-x-73 { column-gap:73px; }
.gap-x-74 { column-gap:74px; }
.gap-x-75 { column-gap:75px; }
.gap-x-76 { column-gap:76px; }
.gap-x-77 { column-gap:77px; }
.gap-x-78 { column-gap:78px; }
.gap-x-79 { column-gap:79px; }
.gap-x-80 { column-gap:80px; }
.gap-x-81 { column-gap:81px; }
.gap-x-82 { column-gap:82px; }
.gap-x-83 { column-gap:83px; }
.gap-x-84 { column-gap:84px; }
.gap-x-85 { column-gap:85px; }
.gap-x-86 { column-gap:86px; }
.gap-x-87 { column-gap:87px; }
.gap-x-88 { column-gap:88px; }
.gap-x-89 { column-gap:89px; }
.gap-x-90 { column-gap:90px; }
.gap-x-91 { column-gap:91px; }
.gap-x-92 { column-gap:92px; }
.gap-x-93 { column-gap:93px; }
.gap-x-94 { column-gap:94px; }
.gap-x-95 { column-gap:95px; }
.gap-x-96 { column-gap:96px; }
.gap-x-97 { column-gap:97px; }
.gap-x-98 { column-gap:98px; }
.gap-x-99 { column-gap:99px; }
.gap-x-100 { column-gap:100px; }

.gap-y-0 { row-gap:0px; }
.gap-y-1 { row-gap:1px; }
.gap-y-2 { row-gap:2px; }
.gap-y-3 { row-gap:3px; }
.gap-y-4 { row-gap:4px; }
.gap-y-5 { row-gap:5px; }
.gap-y-6 { row-gap:6px; }
.gap-y-7 { row-gap:7px; }
.gap-y-8 { row-gap:8px; }
.gap-y-9 { row-gap:9px; }
.gap-y-10 { row-gap:10px; }
.gap-y-11 { row-gap:11px; }
.gap-y-12 { row-gap:12px; }
.gap-y-13 { row-gap:13px; }
.gap-y-14 { row-gap:14px; }
.gap-y-15 { row-gap:15px; }
.gap-y-16 { row-gap:16px; }
.gap-y-17 { row-gap:17px; }
.gap-y-18 { row-gap:18px; }
.gap-y-19 { row-gap:19px; }
.gap-y-20 { row-gap:20px; }
.gap-y-21 { row-gap:21px; }
.gap-y-22 { row-gap:22px; }
.gap-y-23 { row-gap:23px; }
.gap-y-24 { row-gap:24px; }
.gap-y-25 { row-gap:25px; }
.gap-y-26 { row-gap:26px; }
.gap-y-27 { row-gap:27px; }
.gap-y-28 { row-gap:28px; }
.gap-y-29 { row-gap:29px; }
.gap-y-30 { row-gap:30px; }
.gap-y-31 { row-gap:31px; }
.gap-y-32 { row-gap:32px; }
.gap-y-33 { row-gap:33px; }
.gap-y-34 { row-gap:34px; }
.gap-y-35 { row-gap:35px; }
.gap-y-36 { row-gap:36px; }
.gap-y-37 { row-gap:37px; }
.gap-y-38 { row-gap:38px; }
.gap-y-39 { row-gap:39px; }
.gap-y-40 { row-gap:40px; }
.gap-y-41 { row-gap:41px; }
.gap-y-42 { row-gap:42px; }
.gap-y-43 { row-gap:43px; }
.gap-y-44 { row-gap:44px; }
.gap-y-45 { row-gap:45px; }
.gap-y-46 { row-gap:46px; }
.gap-y-47 { row-gap:47px; }
.gap-y-48 { row-gap:48px; }
.gap-y-49 { row-gap:49px; }
.gap-y-50 { row-gap:50px; }
.gap-y-51 { row-gap:51px; }
.gap-y-52 { row-gap:52px; }
.gap-y-53 { row-gap:53px; }
.gap-y-54 { row-gap:54px; }
.gap-y-55 { row-gap:55px; }
.gap-y-56 { row-gap:56px; }
.gap-y-57 { row-gap:57px; }
.gap-y-58 { row-gap:58px; }
.gap-y-59 { row-gap:59px; }
.gap-y-60 { row-gap:60px; }
.gap-y-61 { row-gap:61px; }
.gap-y-62 { row-gap:62px; }
.gap-y-63 { row-gap:63px; }
.gap-y-64 { row-gap:64px; }
.gap-y-65 { row-gap:65px; }
.gap-y-66 { row-gap:66px; }
.gap-y-67 { row-gap:67px; }
.gap-y-68 { row-gap:68px; }
.gap-y-69 { row-gap:69px; }
.gap-y-70 { row-gap:70px; }
.gap-y-71 { row-gap:71px; }
.gap-y-72 { row-gap:72px; }
.gap-y-73 { row-gap:73px; }
.gap-y-74 { row-gap:74px; }
.gap-y-75 { row-gap:75px; }
.gap-y-76 { row-gap:76px; }
.gap-y-77 { row-gap:77px; }
.gap-y-78 { row-gap:78px; }
.gap-y-79 { row-gap:79px; }
.gap-y-80 { row-gap:80px; }
.gap-y-81 { row-gap:81px; }
.gap-y-82 { row-gap:82px; }
.gap-y-83 { row-gap:83px; }
.gap-y-84 { row-gap:84px; }
.gap-y-85 { row-gap:85px; }
.gap-y-86 { row-gap:86px; }
.gap-y-87 { row-gap:87px; }
.gap-y-88 { row-gap:88px; }
.gap-y-89 { row-gap:89px; }
.gap-y-90 { row-gap:90px; }
.gap-y-91 { row-gap:91px; }
.gap-y-92 { row-gap:92px; }
.gap-y-93 { row-gap:93px; }
.gap-y-94 { row-gap:94px; }
.gap-y-95 { row-gap:95px; }
.gap-y-96 { row-gap:96px; }
.gap-y-97 { row-gap:97px; }
.gap-y-98 { row-gap:98px; }
.gap-y-99 { row-gap:99px; }
.gap-y-100 { row-gap:100px; }

/*---------------------------------------------
spacing
---------------------------------------------*/
/*--- padding ---*/
.p1 { padding:1px; }
.p2 { padding:2px; }
.p3 { padding:3px; }
.p4 { padding:4px; }
.p5 { padding:5px; }
.p6 { padding:6px; }
.p7 { padding:7px; }
.p8 { padding:8px; }
.p9 { padding:9px; }
.p10 { padding:10px; }
.p11 { padding:11px; }
.p12 { padding:12px; }
.p13 { padding:13px; }
.p14 { padding:14px; }
.p15 { padding:15px; }
.p16 { padding:16px; }
.p17 { padding:17px; }
.p18 { padding:18px; }
.p19 { padding:19px; }
.p20 { padding:20px; }
.p21 { padding:21px; }
.p22 { padding:22px; }
.p23 { padding:23px; }
.p24 { padding:24px; }
.p25 { padding:25px; }
.p26 { padding:26px; }
.p27 { padding:27px; }
.p28 { padding:28px; }
.p29 { padding:29px; }
.p30 { padding:30px; }
.p31 { padding:31px; }
.p32 { padding:32px; }
.p33 { padding:33px; }
.p34 { padding:34px; }
.p35 { padding:35px; }
.p36 { padding:36px; }
.p37 { padding:37px; }
.p38 { padding:38px; }
.p39 { padding:39px; }
.p40 { padding:40px; }
.p41 { padding:41px; }
.p42 { padding:42px; }
.p43 { padding:43px; }
.p44 { padding:44px; }
.p45 { padding:45px; }
.p46 { padding:46px; }
.p47 { padding:47px; }
.p48 { padding:48px; }
.p49 { padding:49px; }
.p50 { padding:50px; }
.p51 { padding:51px; }
.p52 { padding:52px; }
.p53 { padding:53px; }
.p54 { padding:54px; }
.p55 { padding:55px; }
.p56 { padding:56px; }
.p57 { padding:57px; }
.p58 { padding:58px; }
.p59 { padding:59px; }
.p60 { padding:60px; }
.p61 { padding:61px; }
.p62 { padding:62px; }
.p63 { padding:63px; }
.p64 { padding:64px; }
.p65 { padding:65px; }
.p66 { padding:66px; }
.p67 { padding:67px; }
.p68 { padding:68px; }
.p69 { padding:69px; }
.p70 { padding:70px; }
.p71 { padding:71px; }
.p72 { padding:72px; }
.p73 { padding:73px; }
.p74 { padding:74px; }
.p75 { padding:75px; }
.p76 { padding:76px; }
.p77 { padding:77px; }
.p78 { padding:78px; }
.p79 { padding:79px; }
.p80 { padding:80px; }
.p81 { padding:81px; }
.p82 { padding:82px; }
.p83 { padding:83px; }
.p84 { padding:84px; }
.p85 { padding:85px; }
.p86 { padding:86px; }
.p87 { padding:87px; }
.p88 { padding:88px; }
.p89 { padding:89px; }
.p90 { padding:90px; }
.p91 { padding:91px; }
.p92 { padding:92px; }
.p93 { padding:93px; }
.p94 { padding:94px; }
.p95 { padding:95px; }
.p96 { padding:96px; }
.p97 { padding:97px; }
.p98 { padding:98px; }
.p99 { padding:99px; }
.p100 { padding:100px; }

.px1 { padding-left:1px; padding-right:1px; }
.px2 { padding-left:2px; padding-right:2px; }
.px3 { padding-left:3px; padding-right:3px; }
.px4 { padding-left:4px; padding-right:4px; }
.px5 { padding-left:5px; padding-right:5px; }
.px6 { padding-left:6px; padding-right:6px; }
.px7 { padding-left:7px; padding-right:7px; }
.px8 { padding-left:8px; padding-right:8px; }
.px9 { padding-left:9px; padding-right:9px; }
.px10 { padding-left:10px; padding-right:10px; }
.px11 { padding-left:11px; padding-right:11px; }
.px12 { padding-left:12px; padding-right:12px; }
.px13 { padding-left:13px; padding-right:13px; }
.px14 { padding-left:14px; padding-right:14px; }
.px15 { padding-left:15px; padding-right:15px; }
.px16 { padding-left:16px; padding-right:16px; }
.px17 { padding-left:17px; padding-right:17px; }
.px18 { padding-left:18px; padding-right:18px; }
.px19 { padding-left:19px; padding-right:19px; }
.px20 { padding-left:20px; padding-right:20px; }
.px21 { padding-left:21px; padding-right:21px; }
.px22 { padding-left:22px; padding-right:22px; }
.px23 { padding-left:23px; padding-right:23px; }
.px24 { padding-left:24px; padding-right:24px; }
.px25 { padding-left:25px; padding-right:25px; }
.px26 { padding-left:26px; padding-right:26px; }
.px27 { padding-left:27px; padding-right:27px; }
.px28 { padding-left:28px; padding-right:28px; }
.px29 { padding-left:29px; padding-right:29px; }
.px30 { padding-left:30px; padding-right:30px; }
.px31 { padding-left:31px; padding-right:31px; }
.px32 { padding-left:32px; padding-right:32px; }
.px33 { padding-left:33px; padding-right:33px; }
.px34 { padding-left:34px; padding-right:34px; }
.px35 { padding-left:35px; padding-right:35px; }
.px36 { padding-left:36px; padding-right:36px; }
.px37 { padding-left:37px; padding-right:37px; }
.px38 { padding-left:38px; padding-right:38px; }
.px39 { padding-left:39px; padding-right:39px; }
.px40 { padding-left:40px; padding-right:40px; }
.px41 { padding-left:41px; padding-right:41px; }
.px42 { padding-left:42px; padding-right:42px; }
.px43 { padding-left:43px; padding-right:43px; }
.px44 { padding-left:44px; padding-right:44px; }
.px45 { padding-left:45px; padding-right:45px; }
.px46 { padding-left:46px; padding-right:46px; }
.px47 { padding-left:47px; padding-right:47px; }
.px48 { padding-left:48px; padding-right:48px; }
.px49 { padding-left:49px; padding-right:49px; }
.px50 { padding-left:50px; padding-right:50px; }
.px51 { padding-left:51px; padding-right:51px; }
.px52 { padding-left:52px; padding-right:52px; }
.px53 { padding-left:53px; padding-right:53px; }
.px54 { padding-left:54px; padding-right:54px; }
.px55 { padding-left:55px; padding-right:55px; }
.px56 { padding-left:56px; padding-right:56px; }
.px57 { padding-left:57px; padding-right:57px; }
.px58 { padding-left:58px; padding-right:58px; }
.px59 { padding-left:59px; padding-right:59px; }
.px60 { padding-left:60px; padding-right:60px; }
.px61 { padding-left:61px; padding-right:61px; }
.px62 { padding-left:62px; padding-right:62px; }
.px63 { padding-left:63px; padding-right:63px; }
.px64 { padding-left:64px; padding-right:64px; }
.px65 { padding-left:65px; padding-right:65px; }
.px66 { padding-left:66px; padding-right:66px; }
.px67 { padding-left:67px; padding-right:67px; }
.px68 { padding-left:68px; padding-right:68px; }
.px69 { padding-left:69px; padding-right:69px; }
.px70 { padding-left:70px; padding-right:70px; }
.px71 { padding-left:71px; padding-right:71px; }
.px72 { padding-left:72px; padding-right:72px; }
.px73 { padding-left:73px; padding-right:73px; }
.px74 { padding-left:74px; padding-right:74px; }
.px75 { padding-left:75px; padding-right:75px; }
.px76 { padding-left:76px; padding-right:76px; }
.px77 { padding-left:77px; padding-right:77px; }
.px78 { padding-left:78px; padding-right:78px; }
.px79 { padding-left:79px; padding-right:79px; }
.px80 { padding-left:80px; padding-right:80px; }
.px81 { padding-left:81px; padding-right:81px; }
.px82 { padding-left:82px; padding-right:82px; }
.px83 { padding-left:83px; padding-right:83px; }
.px84 { padding-left:84px; padding-right:84px; }
.px85 { padding-left:85px; padding-right:85px; }
.px86 { padding-left:86px; padding-right:86px; }
.px87 { padding-left:87px; padding-right:87px; }
.px88 { padding-left:88px; padding-right:88px; }
.px89 { padding-left:89px; padding-right:89px; }
.px90 { padding-left:90px; padding-right:90px; }
.px91 { padding-left:91px; padding-right:91px; }
.px92 { padding-left:92px; padding-right:92px; }
.px93 { padding-left:93px; padding-right:93px; }
.px94 { padding-left:94px; padding-right:94px; }
.px95 { padding-left:95px; padding-right:95px; }
.px96 { padding-left:96px; padding-right:96px; }
.px97 { padding-left:97px; padding-right:97px; }
.px98 { padding-left:98px; padding-right:98px; }
.px99 { padding-left:99px; padding-right:99px; }
.px100 { padding-left:100px; padding-right:100px; }

.py1 { padding-top:1px; padding-bottom:1px; }
.py2 { padding-top:2px; padding-bottom:2px; }
.py3 { padding-top:3px; padding-bottom:3px; }
.py4 { padding-top:4px; padding-bottom:4px; }
.py5 { padding-top:5px; padding-bottom:5px; }
.py6 { padding-top:6px; padding-bottom:6px; }
.py7 { padding-top:7px; padding-bottom:7px; }
.py8 { padding-top:8px; padding-bottom:8px; }
.py9 { padding-top:9px; padding-bottom:9px; }
.py10 { padding-top:10px; padding-bottom:10px; }
.py11 { padding-top:11px; padding-bottom:11px; }
.py12 { padding-top:12px; padding-bottom:12px; }
.py13 { padding-top:13px; padding-bottom:13px; }
.py14 { padding-top:14px; padding-bottom:14px; }
.py15 { padding-top:15px; padding-bottom:15px; }
.py16 { padding-top:16px; padding-bottom:16px; }
.py17 { padding-top:17px; padding-bottom:17px; }
.py18 { padding-top:18px; padding-bottom:18px; }
.py19 { padding-top:19px; padding-bottom:19px; }
.py20 { padding-top:20px; padding-bottom:20px; }
.py21 { padding-top:21px; padding-bottom:21px; }
.py22 { padding-top:22px; padding-bottom:22px; }
.py23 { padding-top:23px; padding-bottom:23px; }
.py24 { padding-top:24px; padding-bottom:24px; }
.py25 { padding-top:25px; padding-bottom:25px; }
.py26 { padding-top:26px; padding-bottom:26px; }
.py27 { padding-top:27px; padding-bottom:27px; }
.py28 { padding-top:28px; padding-bottom:28px; }
.py29 { padding-top:29px; padding-bottom:29px; }
.py30 { padding-top:30px; padding-bottom:30px; }
.py31 { padding-top:31px; padding-bottom:31px; }
.py32 { padding-top:32px; padding-bottom:32px; }
.py33 { padding-top:33px; padding-bottom:33px; }
.py34 { padding-top:34px; padding-bottom:34px; }
.py35 { padding-top:35px; padding-bottom:35px; }
.py36 { padding-top:36px; padding-bottom:36px; }
.py37 { padding-top:37px; padding-bottom:37px; }
.py38 { padding-top:38px; padding-bottom:38px; }
.py39 { padding-top:39px; padding-bottom:39px; }
.py40 { padding-top:40px; padding-bottom:40px; }
.py41 { padding-top:41px; padding-bottom:41px; }
.py42 { padding-top:42px; padding-bottom:42px; }
.py43 { padding-top:43px; padding-bottom:43px; }
.py44 { padding-top:44px; padding-bottom:44px; }
.py45 { padding-top:45px; padding-bottom:45px; }
.py46 { padding-top:46px; padding-bottom:46px; }
.py47 { padding-top:47px; padding-bottom:47px; }
.py48 { padding-top:48px; padding-bottom:48px; }
.py49 { padding-top:49px; padding-bottom:49px; }
.py50 { padding-top:50px; padding-bottom:50px; }
.py51 { padding-top:51px; padding-bottom:51px; }
.py52 { padding-top:52px; padding-bottom:52px; }
.py53 { padding-top:53px; padding-bottom:53px; }
.py54 { padding-top:54px; padding-bottom:54px; }
.py55 { padding-top:55px; padding-bottom:55px; }
.py56 { padding-top:56px; padding-bottom:56px; }
.py57 { padding-top:57px; padding-bottom:57px; }
.py58 { padding-top:58px; padding-bottom:58px; }
.py59 { padding-top:59px; padding-bottom:59px; }
.py60 { padding-top:60px; padding-bottom:60px; }
.py61 { padding-top:61px; padding-bottom:61px; }
.py62 { padding-top:62px; padding-bottom:62px; }
.py63 { padding-top:63px; padding-bottom:63px; }
.py64 { padding-top:64px; padding-bottom:64px; }
.py65 { padding-top:65px; padding-bottom:65px; }
.py66 { padding-top:66px; padding-bottom:66px; }
.py67 { padding-top:67px; padding-bottom:67px; }
.py68 { padding-top:68px; padding-bottom:68px; }
.py69 { padding-top:69px; padding-bottom:69px; }
.py70 { padding-top:70px; padding-bottom:70px; }
.py71 { padding-top:71px; padding-bottom:71px; }
.py72 { padding-top:72px; padding-bottom:72px; }
.py73 { padding-top:73px; padding-bottom:73px; }
.py74 { padding-top:74px; padding-bottom:74px; }
.py75 { padding-top:75px; padding-bottom:75px; }
.py76 { padding-top:76px; padding-bottom:76px; }
.py77 { padding-top:77px; padding-bottom:77px; }
.py78 { padding-top:78px; padding-bottom:78px; }
.py79 { padding-top:79px; padding-bottom:79px; }
.py80 { padding-top:80px; padding-bottom:80px; }
.py81 { padding-top:81px; padding-bottom:81px; }
.py82 { padding-top:82px; padding-bottom:82px; }
.py83 { padding-top:83px; padding-bottom:83px; }
.py84 { padding-top:84px; padding-bottom:84px; }
.py85 { padding-top:85px; padding-bottom:85px; }
.py86 { padding-top:86px; padding-bottom:86px; }
.py87 { padding-top:87px; padding-bottom:87px; }
.py88 { padding-top:88px; padding-bottom:88px; }
.py89 { padding-top:89px; padding-bottom:89px; }
.py90 { padding-top:90px; padding-bottom:90px; }
.py91 { padding-top:91px; padding-bottom:91px; }
.py92 { padding-top:92px; padding-bottom:92px; }
.py93 { padding-top:93px; padding-bottom:93px; }
.py94 { padding-top:94px; padding-bottom:94px; }
.py95 { padding-top:95px; padding-bottom:95px; }
.py96 { padding-top:96px; padding-bottom:96px; }
.py97 { padding-top:97px; padding-bottom:97px; }
.py98 { padding-top:98px; padding-bottom:98px; }
.py99 { padding-top:99px; padding-bottom:99px; }
.py100 { padding-top:100px; padding-bottom:100px; }

.pt1 { padding-top:1px; }
.pt2 { padding-top:2px; }
.pt3 { padding-top:3px; }
.pt4 { padding-top:4px; }
.pt5 { padding-top:5px; }
.pt6 { padding-top:6px; }
.pt7 { padding-top:7px; }
.pt8 { padding-top:8px; }
.pt9 { padding-top:9px; }
.pt10 { padding-top:10px; }
.pt11 { padding-top:11px; }
.pt12 { padding-top:12px; }
.pt13 { padding-top:13px; }
.pt14 { padding-top:14px; }
.pt15 { padding-top:15px; }
.pt16 { padding-top:16px; }
.pt17 { padding-top:17px; }
.pt18 { padding-top:18px; }
.pt19 { padding-top:19px; }
.pt20 { padding-top:20px; }
.pt21 { padding-top:21px; }
.pt22 { padding-top:22px; }
.pt23 { padding-top:23px; }
.pt24 { padding-top:24px; }
.pt25 { padding-top:25px; }
.pt26 { padding-top:26px; }
.pt27 { padding-top:27px; }
.pt28 { padding-top:28px; }
.pt29 { padding-top:29px; }
.pt30 { padding-top:30px; }
.pt31 { padding-top:31px; }
.pt32 { padding-top:32px; }
.pt33 { padding-top:33px; }
.pt34 { padding-top:34px; }
.pt35 { padding-top:35px; }
.pt36 { padding-top:36px; }
.pt37 { padding-top:37px; }
.pt38 { padding-top:38px; }
.pt39 { padding-top:39px; }
.pt40 { padding-top:40px; }
.pt41 { padding-top:41px; }
.pt42 { padding-top:42px; }
.pt43 { padding-top:43px; }
.pt44 { padding-top:44px; }
.pt45 { padding-top:45px; }
.pt46 { padding-top:46px; }
.pt47 { padding-top:47px; }
.pt48 { padding-top:48px; }
.pt49 { padding-top:49px; }
.pt50 { padding-top:50px; }
.pt51 { padding-top:51px; }
.pt52 { padding-top:52px; }
.pt53 { padding-top:53px; }
.pt54 { padding-top:54px; }
.pt55 { padding-top:55px; }
.pt56 { padding-top:56px; }
.pt57 { padding-top:57px; }
.pt58 { padding-top:58px; }
.pt59 { padding-top:59px; }
.pt60 { padding-top:60px; }
.pt61 { padding-top:61px; }
.pt62 { padding-top:62px; }
.pt63 { padding-top:63px; }
.pt64 { padding-top:64px; }
.pt65 { padding-top:65px; }
.pt66 { padding-top:66px; }
.pt67 { padding-top:67px; }
.pt68 { padding-top:68px; }
.pt69 { padding-top:69px; }
.pt70 { padding-top:70px; }
.pt71 { padding-top:71px; }
.pt72 { padding-top:72px; }
.pt73 { padding-top:73px; }
.pt74 { padding-top:74px; }
.pt75 { padding-top:75px; }
.pt76 { padding-top:76px; }
.pt77 { padding-top:77px; }
.pt78 { padding-top:78px; }
.pt79 { padding-top:79px; }
.pt80 { padding-top:80px; }
.pt81 { padding-top:81px; }
.pt82 { padding-top:82px; }
.pt83 { padding-top:83px; }
.pt84 { padding-top:84px; }
.pt85 { padding-top:85px; }
.pt86 { padding-top:86px; }
.pt87 { padding-top:87px; }
.pt88 { padding-top:88px; }
.pt89 { padding-top:89px; }
.pt90 { padding-top:90px; }
.pt91 { padding-top:91px; }
.pt92 { padding-top:92px; }
.pt93 { padding-top:93px; }
.pt94 { padding-top:94px; }
.pt95 { padding-top:95px; }
.pt96 { padding-top:96px; }
.pt97 { padding-top:97px; }
.pt98 { padding-top:98px; }
.pt99 { padding-top:99px; }
.pt100 { padding-top:100px; }

.pr1 { padding-right:1px; }
.pr2 { padding-right:2px; }
.pr3 { padding-right:3px; }
.pr4 { padding-right:4px; }
.pr5 { padding-right:5px; }
.pr6 { padding-right:6px; }
.pr7 { padding-right:7px; }
.pr8 { padding-right:8px; }
.pr9 { padding-right:9px; }
.pr10 { padding-right:10px; }
.pr11 { padding-right:11px; }
.pr12 { padding-right:12px; }
.pr13 { padding-right:13px; }
.pr14 { padding-right:14px; }
.pr15 { padding-right:15px; }
.pr16 { padding-right:16px; }
.pr17 { padding-right:17px; }
.pr18 { padding-right:18px; }
.pr19 { padding-right:19px; }
.pr20 { padding-right:20px; }
.pr21 { padding-right:21px; }
.pr22 { padding-right:22px; }
.pr23 { padding-right:23px; }
.pr24 { padding-right:24px; }
.pr25 { padding-right:25px; }
.pr26 { padding-right:26px; }
.pr27 { padding-right:27px; }
.pr28 { padding-right:28px; }
.pr29 { padding-right:29px; }
.pr30 { padding-right:30px; }
.pr31 { padding-right:31px; }
.pr32 { padding-right:32px; }
.pr33 { padding-right:33px; }
.pr34 { padding-right:34px; }
.pr35 { padding-right:35px; }
.pr36 { padding-right:36px; }
.pr37 { padding-right:37px; }
.pr38 { padding-right:38px; }
.pr39 { padding-right:39px; }
.pr40 { padding-right:40px; }
.pr41 { padding-right:41px; }
.pr42 { padding-right:42px; }
.pr43 { padding-right:43px; }
.pr44 { padding-right:44px; }
.pr45 { padding-right:45px; }
.pr46 { padding-right:46px; }
.pr47 { padding-right:47px; }
.pr48 { padding-right:48px; }
.pr49 { padding-right:49px; }
.pr50 { padding-right:50px; }
.pr51 { padding-right:51px; }
.pr52 { padding-right:52px; }
.pr53 { padding-right:53px; }
.pr54 { padding-right:54px; }
.pr55 { padding-right:55px; }
.pr56 { padding-right:56px; }
.pr57 { padding-right:57px; }
.pr58 { padding-right:58px; }
.pr59 { padding-right:59px; }
.pr60 { padding-right:60px; }
.pr61 { padding-right:61px; }
.pr62 { padding-right:62px; }
.pr63 { padding-right:63px; }
.pr64 { padding-right:64px; }
.pr65 { padding-right:65px; }
.pr66 { padding-right:66px; }
.pr67 { padding-right:67px; }
.pr68 { padding-right:68px; }
.pr69 { padding-right:69px; }
.pr70 { padding-right:70px; }
.pr71 { padding-right:71px; }
.pr72 { padding-right:72px; }
.pr73 { padding-right:73px; }
.pr74 { padding-right:74px; }
.pr75 { padding-right:75px; }
.pr76 { padding-right:76px; }
.pr77 { padding-right:77px; }
.pr78 { padding-right:78px; }
.pr79 { padding-right:79px; }
.pr80 { padding-right:80px; }
.pr81 { padding-right:81px; }
.pr82 { padding-right:82px; }
.pr83 { padding-right:83px; }
.pr84 { padding-right:84px; }
.pr85 { padding-right:85px; }
.pr86 { padding-right:86px; }
.pr87 { padding-right:87px; }
.pr88 { padding-right:88px; }
.pr89 { padding-right:89px; }
.pr90 { padding-right:90px; }
.pr91 { padding-right:91px; }
.pr92 { padding-right:92px; }
.pr93 { padding-right:93px; }
.pr94 { padding-right:94px; }
.pr95 { padding-right:95px; }
.pr96 { padding-right:96px; }
.pr97 { padding-right:97px; }
.pr98 { padding-right:98px; }
.pr99 { padding-right:99px; }
.pr100 { padding-right:100px; }

.pb1 { padding-bottom:1px; }
.pb2 { padding-bottom:2px; }
.pb3 { padding-bottom:3px; }
.pb4 { padding-bottom:4px; }
.pb5 { padding-bottom:5px; }
.pb6 { padding-bottom:6px; }
.pb7 { padding-bottom:7px; }
.pb8 { padding-bottom:8px; }
.pb9 { padding-bottom:9px; }
.pb10 { padding-bottom:10px; }
.pb11 { padding-bottom:11px; }
.pb12 { padding-bottom:12px; }
.pb13 { padding-bottom:13px; }
.pb14 { padding-bottom:14px; }
.pb15 { padding-bottom:15px; }
.pb16 { padding-bottom:16px; }
.pb17 { padding-bottom:17px; }
.pb18 { padding-bottom:18px; }
.pb19 { padding-bottom:19px; }
.pb20 { padding-bottom:20px; }
.pb21 { padding-bottom:21px; }
.pb22 { padding-bottom:22px; }
.pb23 { padding-bottom:23px; }
.pb24 { padding-bottom:24px; }
.pb25 { padding-bottom:25px; }
.pb26 { padding-bottom:26px; }
.pb27 { padding-bottom:27px; }
.pb28 { padding-bottom:28px; }
.pb29 { padding-bottom:29px; }
.pb30 { padding-bottom:30px; }
.pb31 { padding-bottom:31px; }
.pb32 { padding-bottom:32px; }
.pb33 { padding-bottom:33px; }
.pb34 { padding-bottom:34px; }
.pb35 { padding-bottom:35px; }
.pb36 { padding-bottom:36px; }
.pb37 { padding-bottom:37px; }
.pb38 { padding-bottom:38px; }
.pb39 { padding-bottom:39px; }
.pb40 { padding-bottom:40px; }
.pb41 { padding-bottom:41px; }
.pb42 { padding-bottom:42px; }
.pb43 { padding-bottom:43px; }
.pb44 { padding-bottom:44px; }
.pb45 { padding-bottom:45px; }
.pb46 { padding-bottom:46px; }
.pb47 { padding-bottom:47px; }
.pb48 { padding-bottom:48px; }
.pb49 { padding-bottom:49px; }
.pb50 { padding-bottom:50px; }
.pb51 { padding-bottom:51px; }
.pb52 { padding-bottom:52px; }
.pb53 { padding-bottom:53px; }
.pb54 { padding-bottom:54px; }
.pb55 { padding-bottom:55px; }
.pb56 { padding-bottom:56px; }
.pb57 { padding-bottom:57px; }
.pb58 { padding-bottom:58px; }
.pb59 { padding-bottom:59px; }
.pb60 { padding-bottom:60px; }
.pb61 { padding-bottom:61px; }
.pb62 { padding-bottom:62px; }
.pb63 { padding-bottom:63px; }
.pb64 { padding-bottom:64px; }
.pb65 { padding-bottom:65px; }
.pb66 { padding-bottom:66px; }
.pb67 { padding-bottom:67px; }
.pb68 { padding-bottom:68px; }
.pb69 { padding-bottom:69px; }
.pb70 { padding-bottom:70px; }
.pb71 { padding-bottom:71px; }
.pb72 { padding-bottom:72px; }
.pb73 { padding-bottom:73px; }
.pb74 { padding-bottom:74px; }
.pb75 { padding-bottom:75px; }
.pb76 { padding-bottom:76px; }
.pb77 { padding-bottom:77px; }
.pb78 { padding-bottom:78px; }
.pb79 { padding-bottom:79px; }
.pb80 { padding-bottom:80px; }
.pb81 { padding-bottom:81px; }
.pb82 { padding-bottom:82px; }
.pb83 { padding-bottom:83px; }
.pb84 { padding-bottom:84px; }
.pb85 { padding-bottom:85px; }
.pb86 { padding-bottom:86px; }
.pb87 { padding-bottom:87px; }
.pb88 { padding-bottom:88px; }
.pb89 { padding-bottom:89px; }
.pb90 { padding-bottom:90px; }
.pb91 { padding-bottom:91px; }
.pb92 { padding-bottom:92px; }
.pb93 { padding-bottom:93px; }
.pb94 { padding-bottom:94px; }
.pb95 { padding-bottom:95px; }
.pb96 { padding-bottom:96px; }
.pb97 { padding-bottom:97px; }
.pb98 { padding-bottom:98px; }
.pb99 { padding-bottom:99px; }
.pb100 { padding-bottom:100px; }

.pl1 { padding-left:1px; }
.pl2 { padding-left:2px; }
.pl3 { padding-left:3px; }
.pl4 { padding-left:4px; }
.pl5 { padding-left:5px; }
.pl6 { padding-left:6px; }
.pl7 { padding-left:7px; }
.pl8 { padding-left:8px; }
.pl9 { padding-left:9px; }
.pl10 { padding-left:10px; }
.pl11 { padding-left:11px; }
.pl12 { padding-left:12px; }
.pl13 { padding-left:13px; }
.pl14 { padding-left:14px; }
.pl15 { padding-left:15px; }
.pl16 { padding-left:16px; }
.pl17 { padding-left:17px; }
.pl18 { padding-left:18px; }
.pl19 { padding-left:19px; }
.pl20 { padding-left:20px; }
.pl21 { padding-left:21px; }
.pl22 { padding-left:22px; }
.pl23 { padding-left:23px; }
.pl24 { padding-left:24px; }
.pl25 { padding-left:25px; }
.pl26 { padding-left:26px; }
.pl27 { padding-left:27px; }
.pl28 { padding-left:28px; }
.pl29 { padding-left:29px; }
.pl30 { padding-left:30px; }
.pl31 { padding-left:31px; }
.pl32 { padding-left:32px; }
.pl33 { padding-left:33px; }
.pl34 { padding-left:34px; }
.pl35 { padding-left:35px; }
.pl36 { padding-left:36px; }
.pl37 { padding-left:37px; }
.pl38 { padding-left:38px; }
.pl39 { padding-left:39px; }
.pl40 { padding-left:40px; }
.pl41 { padding-left:41px; }
.pl42 { padding-left:42px; }
.pl43 { padding-left:43px; }
.pl44 { padding-left:44px; }
.pl45 { padding-left:45px; }
.pl46 { padding-left:46px; }
.pl47 { padding-left:47px; }
.pl48 { padding-left:48px; }
.pl49 { padding-left:49px; }
.pl50 { padding-left:50px; }
.pl51 { padding-left:51px; }
.pl52 { padding-left:52px; }
.pl53 { padding-left:53px; }
.pl54 { padding-left:54px; }
.pl55 { padding-left:55px; }
.pl56 { padding-left:56px; }
.pl57 { padding-left:57px; }
.pl58 { padding-left:58px; }
.pl59 { padding-left:59px; }
.pl60 { padding-left:60px; }
.pl61 { padding-left:61px; }
.pl62 { padding-left:62px; }
.pl63 { padding-left:63px; }
.pl64 { padding-left:64px; }
.pl65 { padding-left:65px; }
.pl66 { padding-left:66px; }
.pl67 { padding-left:67px; }
.pl68 { padding-left:68px; }
.pl69 { padding-left:69px; }
.pl70 { padding-left:70px; }
.pl71 { padding-left:71px; }
.pl72 { padding-left:72px; }
.pl73 { padding-left:73px; }
.pl74 { padding-left:74px; }
.pl75 { padding-left:75px; }
.pl76 { padding-left:76px; }
.pl77 { padding-left:77px; }
.pl78 { padding-left:78px; }
.pl79 { padding-left:79px; }
.pl80 { padding-left:80px; }
.pl81 { padding-left:81px; }
.pl82 { padding-left:82px; }
.pl83 { padding-left:83px; }
.pl84 { padding-left:84px; }
.pl85 { padding-left:85px; }
.pl86 { padding-left:86px; }
.pl87 { padding-left:87px; }
.pl88 { padding-left:88px; }
.pl89 { padding-left:89px; }
.pl90 { padding-left:90px; }
.pl91 { padding-left:91px; }
.pl92 { padding-left:92px; }
.pl93 { padding-left:93px; }
.pl94 { padding-left:94px; }
.pl95 { padding-left:95px; }
.pl96 { padding-left:96px; }
.pl97 { padding-left:97px; }
.pl98 { padding-left:98px; }
.pl99 { padding-left:99px; }
.pl100 { padding-left:100px; }

/*--- margin ---*/
.m1 { margin:1px; }
.m2 { margin:2px; }
.m3 { margin:3px; }
.m4 { margin:4px; }
.m5 { margin:5px; }
.m6 { margin:6px; }
.m7 { margin:7px; }
.m8 { margin:8px; }
.m9 { margin:9px; }
.m10 { margin:10px; }
.m11 { margin:11px; }
.m12 { margin:12px; }
.m13 { margin:13px; }
.m14 { margin:14px; }
.m15 { margin:15px; }
.m16 { margin:16px; }
.m17 { margin:17px; }
.m18 { margin:18px; }
.m19 { margin:19px; }
.m20 { margin:20px; }
.m21 { margin:21px; }
.m22 { margin:22px; }
.m23 { margin:23px; }
.m24 { margin:24px; }
.m25 { margin:25px; }
.m26 { margin:26px; }
.m27 { margin:27px; }
.m28 { margin:28px; }
.m29 { margin:29px; }
.m30 { margin:30px; }
.m31 { margin:31px; }
.m32 { margin:32px; }
.m33 { margin:33px; }
.m34 { margin:34px; }
.m35 { margin:35px; }
.m36 { margin:36px; }
.m37 { margin:37px; }
.m38 { margin:38px; }
.m39 { margin:39px; }
.m40 { margin:40px; }
.m41 { margin:41px; }
.m42 { margin:42px; }
.m43 { margin:43px; }
.m44 { margin:44px; }
.m45 { margin:45px; }
.m46 { margin:46px; }
.m47 { margin:47px; }
.m48 { margin:48px; }
.m49 { margin:49px; }
.m50 { margin:50px; }
.m51 { margin:51px; }
.m52 { margin:52px; }
.m53 { margin:53px; }
.m54 { margin:54px; }
.m55 { margin:55px; }
.m56 { margin:56px; }
.m57 { margin:57px; }
.m58 { margin:58px; }
.m59 { margin:59px; }
.m60 { margin:60px; }
.m61 { margin:61px; }
.m62 { margin:62px; }
.m63 { margin:63px; }
.m64 { margin:64px; }
.m65 { margin:65px; }
.m66 { margin:66px; }
.m67 { margin:67px; }
.m68 { margin:68px; }
.m69 { margin:69px; }
.m70 { margin:70px; }
.m71 { margin:71px; }
.m72 { margin:72px; }
.m73 { margin:73px; }
.m74 { margin:74px; }
.m75 { margin:75px; }
.m76 { margin:76px; }
.m77 { margin:77px; }
.m78 { margin:78px; }
.m79 { margin:79px; }
.m80 { margin:80px; }
.m81 { margin:81px; }
.m82 { margin:82px; }
.m83 { margin:83px; }
.m84 { margin:84px; }
.m85 { margin:85px; }
.m86 { margin:86px; }
.m87 { margin:87px; }
.m88 { margin:88px; }
.m89 { margin:89px; }
.m90 { margin:90px; }
.m91 { margin:91px; }
.m92 { margin:92px; }
.m93 { margin:93px; }
.m94 { margin:94px; }
.m95 { margin:95px; }
.m96 { margin:96px; }
.m97 { margin:97px; }
.m98 { margin:98px; }
.m99 { margin:99px; }
.m100 { margin:100px; }

.mx1 { margin-left:1px; margin-right:1px; }
.mx2 { margin-left:2px; margin-right:2px; }
.mx3 { margin-left:3px; margin-right:3px; }
.mx4 { margin-left:4px; margin-right:4px; }
.mx5 { margin-left:5px; margin-right:5px; }
.mx6 { margin-left:6px; margin-right:6px; }
.mx7 { margin-left:7px; margin-right:7px; }
.mx8 { margin-left:8px; margin-right:8px; }
.mx9 { margin-left:9px; margin-right:9px; }
.mx10 { margin-left:10px; margin-right:10px; }
.mx11 { margin-left:11px; margin-right:11px; }
.mx12 { margin-left:12px; margin-right:12px; }
.mx13 { margin-left:13px; margin-right:13px; }
.mx14 { margin-left:14px; margin-right:14px; }
.mx15 { margin-left:15px; margin-right:15px; }
.mx16 { margin-left:16px; margin-right:16px; }
.mx17 { margin-left:17px; margin-right:17px; }
.mx18 { margin-left:18px; margin-right:18px; }
.mx19 { margin-left:19px; margin-right:19px; }
.mx20 { margin-left:20px; margin-right:20px; }
.mx21 { margin-left:21px; margin-right:21px; }
.mx22 { margin-left:22px; margin-right:22px; }
.mx23 { margin-left:23px; margin-right:23px; }
.mx24 { margin-left:24px; margin-right:24px; }
.mx25 { margin-left:25px; margin-right:25px; }
.mx26 { margin-left:26px; margin-right:26px; }
.mx27 { margin-left:27px; margin-right:27px; }
.mx28 { margin-left:28px; margin-right:28px; }
.mx29 { margin-left:29px; margin-right:29px; }
.mx30 { margin-left:30px; margin-right:30px; }
.mx31 { margin-left:31px; margin-right:31px; }
.mx32 { margin-left:32px; margin-right:32px; }
.mx33 { margin-left:33px; margin-right:33px; }
.mx34 { margin-left:34px; margin-right:34px; }
.mx35 { margin-left:35px; margin-right:35px; }
.mx36 { margin-left:36px; margin-right:36px; }
.mx37 { margin-left:37px; margin-right:37px; }
.mx38 { margin-left:38px; margin-right:38px; }
.mx39 { margin-left:39px; margin-right:39px; }
.mx40 { margin-left:40px; margin-right:40px; }
.mx41 { margin-left:41px; margin-right:41px; }
.mx42 { margin-left:42px; margin-right:42px; }
.mx43 { margin-left:43px; margin-right:43px; }
.mx44 { margin-left:44px; margin-right:44px; }
.mx45 { margin-left:45px; margin-right:45px; }
.mx46 { margin-left:46px; margin-right:46px; }
.mx47 { margin-left:47px; margin-right:47px; }
.mx48 { margin-left:48px; margin-right:48px; }
.mx49 { margin-left:49px; margin-right:49px; }
.mx50 { margin-left:50px; margin-right:50px; }
.mx51 { margin-left:51px; margin-right:51px; }
.mx52 { margin-left:52px; margin-right:52px; }
.mx53 { margin-left:53px; margin-right:53px; }
.mx54 { margin-left:54px; margin-right:54px; }
.mx55 { margin-left:55px; margin-right:55px; }
.mx56 { margin-left:56px; margin-right:56px; }
.mx57 { margin-left:57px; margin-right:57px; }
.mx58 { margin-left:58px; margin-right:58px; }
.mx59 { margin-left:59px; margin-right:59px; }
.mx60 { margin-left:60px; margin-right:60px; }
.mx61 { margin-left:61px; margin-right:61px; }
.mx62 { margin-left:62px; margin-right:62px; }
.mx63 { margin-left:63px; margin-right:63px; }
.mx64 { margin-left:64px; margin-right:64px; }
.mx65 { margin-left:65px; margin-right:65px; }
.mx66 { margin-left:66px; margin-right:66px; }
.mx67 { margin-left:67px; margin-right:67px; }
.mx68 { margin-left:68px; margin-right:68px; }
.mx69 { margin-left:69px; margin-right:69px; }
.mx70 { margin-left:70px; margin-right:70px; }
.mx71 { margin-left:71px; margin-right:71px; }
.mx72 { margin-left:72px; margin-right:72px; }
.mx73 { margin-left:73px; margin-right:73px; }
.mx74 { margin-left:74px; margin-right:74px; }
.mx75 { margin-left:75px; margin-right:75px; }
.mx76 { margin-left:76px; margin-right:76px; }
.mx77 { margin-left:77px; margin-right:77px; }
.mx78 { margin-left:78px; margin-right:78px; }
.mx79 { margin-left:79px; margin-right:79px; }
.mx80 { margin-left:80px; margin-right:80px; }
.mx81 { margin-left:81px; margin-right:81px; }
.mx82 { margin-left:82px; margin-right:82px; }
.mx83 { margin-left:83px; margin-right:83px; }
.mx84 { margin-left:84px; margin-right:84px; }
.mx85 { margin-left:85px; margin-right:85px; }
.mx86 { margin-left:86px; margin-right:86px; }
.mx87 { margin-left:87px; margin-right:87px; }
.mx88 { margin-left:88px; margin-right:88px; }
.mx89 { margin-left:89px; margin-right:89px; }
.mx90 { margin-left:90px; margin-right:90px; }
.mx91 { margin-left:91px; margin-right:91px; }
.mx92 { margin-left:92px; margin-right:92px; }
.mx93 { margin-left:93px; margin-right:93px; }
.mx94 { margin-left:94px; margin-right:94px; }
.mx95 { margin-left:95px; margin-right:95px; }
.mx96 { margin-left:96px; margin-right:96px; }
.mx97 { margin-left:97px; margin-right:97px; }
.mx98 { margin-left:98px; margin-right:98px; }
.mx99 { margin-left:99px; margin-right:99px; }
.mx100 { margin-left:100px; margin-right:100px; }

.my1 { margin-top:1px; margin-bottom:1px; }
.my2 { margin-top:2px; margin-bottom:2px; }
.my3 { margin-top:3px; margin-bottom:3px; }
.my4 { margin-top:4px; margin-bottom:4px; }
.my5 { margin-top:5px; margin-bottom:5px; }
.my6 { margin-top:6px; margin-bottom:6px; }
.my7 { margin-top:7px; margin-bottom:7px; }
.my8 { margin-top:8px; margin-bottom:8px; }
.my9 { margin-top:9px; margin-bottom:9px; }
.my10 { margin-top:10px; margin-bottom:10px; }
.my11 { margin-top:11px; margin-bottom:11px; }
.my12 { margin-top:12px; margin-bottom:12px; }
.my13 { margin-top:13px; margin-bottom:13px; }
.my14 { margin-top:14px; margin-bottom:14px; }
.my15 { margin-top:15px; margin-bottom:15px; }
.my16 { margin-top:16px; margin-bottom:16px; }
.my17 { margin-top:17px; margin-bottom:17px; }
.my18 { margin-top:18px; margin-bottom:18px; }
.my19 { margin-top:19px; margin-bottom:19px; }
.my20 { margin-top:20px; margin-bottom:20px; }
.my21 { margin-top:21px; margin-bottom:21px; }
.my22 { margin-top:22px; margin-bottom:22px; }
.my23 { margin-top:23px; margin-bottom:23px; }
.my24 { margin-top:24px; margin-bottom:24px; }
.my25 { margin-top:25px; margin-bottom:25px; }
.my26 { margin-top:26px; margin-bottom:26px; }
.my27 { margin-top:27px; margin-bottom:27px; }
.my28 { margin-top:28px; margin-bottom:28px; }
.my29 { margin-top:29px; margin-bottom:29px; }
.my30 { margin-top:30px; margin-bottom:30px; }
.my31 { margin-top:31px; margin-bottom:31px; }
.my32 { margin-top:32px; margin-bottom:32px; }
.my33 { margin-top:33px; margin-bottom:33px; }
.my34 { margin-top:34px; margin-bottom:34px; }
.my35 { margin-top:35px; margin-bottom:35px; }
.my36 { margin-top:36px; margin-bottom:36px; }
.my37 { margin-top:37px; margin-bottom:37px; }
.my38 { margin-top:38px; margin-bottom:38px; }
.my39 { margin-top:39px; margin-bottom:39px; }
.my40 { margin-top:40px; margin-bottom:40px; }
.my41 { margin-top:41px; margin-bottom:41px; }
.my42 { margin-top:42px; margin-bottom:42px; }
.my43 { margin-top:43px; margin-bottom:43px; }
.my44 { margin-top:44px; margin-bottom:44px; }
.my45 { margin-top:45px; margin-bottom:45px; }
.my46 { margin-top:46px; margin-bottom:46px; }
.my47 { margin-top:47px; margin-bottom:47px; }
.my48 { margin-top:48px; margin-bottom:48px; }
.my49 { margin-top:49px; margin-bottom:49px; }
.my50 { margin-top:50px; margin-bottom:50px; }
.my51 { margin-top:51px; margin-bottom:51px; }
.my52 { margin-top:52px; margin-bottom:52px; }
.my53 { margin-top:53px; margin-bottom:53px; }
.my54 { margin-top:54px; margin-bottom:54px; }
.my55 { margin-top:55px; margin-bottom:55px; }
.my56 { margin-top:56px; margin-bottom:56px; }
.my57 { margin-top:57px; margin-bottom:57px; }
.my58 { margin-top:58px; margin-bottom:58px; }
.my59 { margin-top:59px; margin-bottom:59px; }
.my60 { margin-top:60px; margin-bottom:60px; }
.my61 { margin-top:61px; margin-bottom:61px; }
.my62 { margin-top:62px; margin-bottom:62px; }
.my63 { margin-top:63px; margin-bottom:63px; }
.my64 { margin-top:64px; margin-bottom:64px; }
.my65 { margin-top:65px; margin-bottom:65px; }
.my66 { margin-top:66px; margin-bottom:66px; }
.my67 { margin-top:67px; margin-bottom:67px; }
.my68 { margin-top:68px; margin-bottom:68px; }
.my69 { margin-top:69px; margin-bottom:69px; }
.my70 { margin-top:70px; margin-bottom:70px; }
.my71 { margin-top:71px; margin-bottom:71px; }
.my72 { margin-top:72px; margin-bottom:72px; }
.my73 { margin-top:73px; margin-bottom:73px; }
.my74 { margin-top:74px; margin-bottom:74px; }
.my75 { margin-top:75px; margin-bottom:75px; }
.my76 { margin-top:76px; margin-bottom:76px; }
.my77 { margin-top:77px; margin-bottom:77px; }
.my78 { margin-top:78px; margin-bottom:78px; }
.my79 { margin-top:79px; margin-bottom:79px; }
.my80 { margin-top:80px; margin-bottom:80px; }
.my81 { margin-top:81px; margin-bottom:81px; }
.my82 { margin-top:82px; margin-bottom:82px; }
.my83 { margin-top:83px; margin-bottom:83px; }
.my84 { margin-top:84px; margin-bottom:84px; }
.my85 { margin-top:85px; margin-bottom:85px; }
.my86 { margin-top:86px; margin-bottom:86px; }
.my87 { margin-top:87px; margin-bottom:87px; }
.my88 { margin-top:88px; margin-bottom:88px; }
.my89 { margin-top:89px; margin-bottom:89px; }
.my90 { margin-top:90px; margin-bottom:90px; }
.my91 { margin-top:91px; margin-bottom:91px; }
.my92 { margin-top:92px; margin-bottom:92px; }
.my93 { margin-top:93px; margin-bottom:93px; }
.my94 { margin-top:94px; margin-bottom:94px; }
.my95 { margin-top:95px; margin-bottom:95px; }
.my96 { margin-top:96px; margin-bottom:96px; }
.my97 { margin-top:97px; margin-bottom:97px; }
.my98 { margin-top:98px; margin-bottom:98px; }
.my99 { margin-top:99px; margin-bottom:99px; }
.my100 { margin-top:100px; margin-bottom:100px; }

.mt1 { margin-top:1px; }
.mt2 { margin-top:2px; }
.mt3 { margin-top:3px; }
.mt4 { margin-top:4px; }
.mt5 { margin-top:5px; }
.mt6 { margin-top:6px; }
.mt7 { margin-top:7px; }
.mt8 { margin-top:8px; }
.mt9 { margin-top:9px; }
.mt10 { margin-top:10px; }
.mt11 { margin-top:11px; }
.mt12 { margin-top:12px; }
.mt13 { margin-top:13px; }
.mt14 { margin-top:14px; }
.mt15 { margin-top:15px; }
.mt16 { margin-top:16px; }
.mt17 { margin-top:17px; }
.mt18 { margin-top:18px; }
.mt19 { margin-top:19px; }
.mt20 { margin-top:20px; }
.mt21 { margin-top:21px; }
.mt22 { margin-top:22px; }
.mt23 { margin-top:23px; }
.mt24 { margin-top:24px; }
.mt25 { margin-top:25px; }
.mt26 { margin-top:26px; }
.mt27 { margin-top:27px; }
.mt28 { margin-top:28px; }
.mt29 { margin-top:29px; }
.mt30 { margin-top:30px; }
.mt31 { margin-top:31px; }
.mt32 { margin-top:32px; }
.mt33 { margin-top:33px; }
.mt34 { margin-top:34px; }
.mt35 { margin-top:35px; }
.mt36 { margin-top:36px; }
.mt37 { margin-top:37px; }
.mt38 { margin-top:38px; }
.mt39 { margin-top:39px; }
.mt40 { margin-top:40px; }
.mt41 { margin-top:41px; }
.mt42 { margin-top:42px; }
.mt43 { margin-top:43px; }
.mt44 { margin-top:44px; }
.mt45 { margin-top:45px; }
.mt46 { margin-top:46px; }
.mt47 { margin-top:47px; }
.mt48 { margin-top:48px; }
.mt49 { margin-top:49px; }
.mt50 { margin-top:50px; }
.mt51 { margin-top:51px; }
.mt52 { margin-top:52px; }
.mt53 { margin-top:53px; }
.mt54 { margin-top:54px; }
.mt55 { margin-top:55px; }
.mt56 { margin-top:56px; }
.mt57 { margin-top:57px; }
.mt58 { margin-top:58px; }
.mt59 { margin-top:59px; }
.mt60 { margin-top:60px; }
.mt61 { margin-top:61px; }
.mt62 { margin-top:62px; }
.mt63 { margin-top:63px; }
.mt64 { margin-top:64px; }
.mt65 { margin-top:65px; }
.mt66 { margin-top:66px; }
.mt67 { margin-top:67px; }
.mt68 { margin-top:68px; }
.mt69 { margin-top:69px; }
.mt70 { margin-top:70px; }
.mt71 { margin-top:71px; }
.mt72 { margin-top:72px; }
.mt73 { margin-top:73px; }
.mt74 { margin-top:74px; }
.mt75 { margin-top:75px; }
.mt76 { margin-top:76px; }
.mt77 { margin-top:77px; }
.mt78 { margin-top:78px; }
.mt79 { margin-top:79px; }
.mt80 { margin-top:80px; }
.mt81 { margin-top:81px; }
.mt82 { margin-top:82px; }
.mt83 { margin-top:83px; }
.mt84 { margin-top:84px; }
.mt85 { margin-top:85px; }
.mt86 { margin-top:86px; }
.mt87 { margin-top:87px; }
.mt88 { margin-top:88px; }
.mt89 { margin-top:89px; }
.mt90 { margin-top:90px; }
.mt91 { margin-top:91px; }
.mt92 { margin-top:92px; }
.mt93 { margin-top:93px; }
.mt94 { margin-top:94px; }
.mt95 { margin-top:95px; }
.mt96 { margin-top:96px; }
.mt97 { margin-top:97px; }
.mt98 { margin-top:98px; }
.mt99 { margin-top:99px; }
.mt100 { margin-top:100px; }

.mr1 { margin-right:1px; }
.mr2 { margin-right:2px; }
.mr3 { margin-right:3px; }
.mr4 { margin-right:4px; }
.mr5 { margin-right:5px; }
.mr6 { margin-right:6px; }
.mr7 { margin-right:7px; }
.mr8 { margin-right:8px; }
.mr9 { margin-right:9px; }
.mr10 { margin-right:10px; }
.mr11 { margin-right:11px; }
.mr12 { margin-right:12px; }
.mr13 { margin-right:13px; }
.mr14 { margin-right:14px; }
.mr15 { margin-right:15px; }
.mr16 { margin-right:16px; }
.mr17 { margin-right:17px; }
.mr18 { margin-right:18px; }
.mr19 { margin-right:19px; }
.mr20 { margin-right:20px; }
.mr21 { margin-right:21px; }
.mr22 { margin-right:22px; }
.mr23 { margin-right:23px; }
.mr24 { margin-right:24px; }
.mr25 { margin-right:25px; }
.mr26 { margin-right:26px; }
.mr27 { margin-right:27px; }
.mr28 { margin-right:28px; }
.mr29 { margin-right:29px; }
.mr30 { margin-right:30px; }
.mr31 { margin-right:31px; }
.mr32 { margin-right:32px; }
.mr33 { margin-right:33px; }
.mr34 { margin-right:34px; }
.mr35 { margin-right:35px; }
.mr36 { margin-right:36px; }
.mr37 { margin-right:37px; }
.mr38 { margin-right:38px; }
.mr39 { margin-right:39px; }
.mr40 { margin-right:40px; }
.mr41 { margin-right:41px; }
.mr42 { margin-right:42px; }
.mr43 { margin-right:43px; }
.mr44 { margin-right:44px; }
.mr45 { margin-right:45px; }
.mr46 { margin-right:46px; }
.mr47 { margin-right:47px; }
.mr48 { margin-right:48px; }
.mr49 { margin-right:49px; }
.mr50 { margin-right:50px; }
.mr51 { margin-right:51px; }
.mr52 { margin-right:52px; }
.mr53 { margin-right:53px; }
.mr54 { margin-right:54px; }
.mr55 { margin-right:55px; }
.mr56 { margin-right:56px; }
.mr57 { margin-right:57px; }
.mr58 { margin-right:58px; }
.mr59 { margin-right:59px; }
.mr60 { margin-right:60px; }
.mr61 { margin-right:61px; }
.mr62 { margin-right:62px; }
.mr63 { margin-right:63px; }
.mr64 { margin-right:64px; }
.mr65 { margin-right:65px; }
.mr66 { margin-right:66px; }
.mr67 { margin-right:67px; }
.mr68 { margin-right:68px; }
.mr69 { margin-right:69px; }
.mr70 { margin-right:70px; }
.mr71 { margin-right:71px; }
.mr72 { margin-right:72px; }
.mr73 { margin-right:73px; }
.mr74 { margin-right:74px; }
.mr75 { margin-right:75px; }
.mr76 { margin-right:76px; }
.mr77 { margin-right:77px; }
.mr78 { margin-right:78px; }
.mr79 { margin-right:79px; }
.mr80 { margin-right:80px; }
.mr81 { margin-right:81px; }
.mr82 { margin-right:82px; }
.mr83 { margin-right:83px; }
.mr84 { margin-right:84px; }
.mr85 { margin-right:85px; }
.mr86 { margin-right:86px; }
.mr87 { margin-right:87px; }
.mr88 { margin-right:88px; }
.mr89 { margin-right:89px; }
.mr90 { margin-right:90px; }
.mr91 { margin-right:91px; }
.mr92 { margin-right:92px; }
.mr93 { margin-right:93px; }
.mr94 { margin-right:94px; }
.mr95 { margin-right:95px; }
.mr96 { margin-right:96px; }
.mr97 { margin-right:97px; }
.mr98 { margin-right:98px; }
.mr99 { margin-right:99px; }
.mr100 { margin-right:100px; }

.mb1 { margin-bottom:1px; }
.mb2 { margin-bottom:2px; }
.mb3 { margin-bottom:3px; }
.mb4 { margin-bottom:4px; }
.mb5 { margin-bottom:5px; }
.mb6 { margin-bottom:6px; }
.mb7 { margin-bottom:7px; }
.mb8 { margin-bottom:8px; }
.mb9 { margin-bottom:9px; }
.mb10 { margin-bottom:10px; }
.mb11 { margin-bottom:11px; }
.mb12 { margin-bottom:12px; }
.mb13 { margin-bottom:13px; }
.mb14 { margin-bottom:14px; }
.mb15 { margin-bottom:15px; }
.mb16 { margin-bottom:16px; }
.mb17 { margin-bottom:17px; }
.mb18 { margin-bottom:18px; }
.mb19 { margin-bottom:19px; }
.mb20 { margin-bottom:20px; }
.mb21 { margin-bottom:21px; }
.mb22 { margin-bottom:22px; }
.mb23 { margin-bottom:23px; }
.mb24 { margin-bottom:24px; }
.mb25 { margin-bottom:25px; }
.mb26 { margin-bottom:26px; }
.mb27 { margin-bottom:27px; }
.mb28 { margin-bottom:28px; }
.mb29 { margin-bottom:29px; }
.mb30 { margin-bottom:30px; }
.mb31 { margin-bottom:31px; }
.mb32 { margin-bottom:32px; }
.mb33 { margin-bottom:33px; }
.mb34 { margin-bottom:34px; }
.mb35 { margin-bottom:35px; }
.mb36 { margin-bottom:36px; }
.mb37 { margin-bottom:37px; }
.mb38 { margin-bottom:38px; }
.mb39 { margin-bottom:39px; }
.mb40 { margin-bottom:40px; }
.mb41 { margin-bottom:41px; }
.mb42 { margin-bottom:42px; }
.mb43 { margin-bottom:43px; }
.mb44 { margin-bottom:44px; }
.mb45 { margin-bottom:45px; }
.mb46 { margin-bottom:46px; }
.mb47 { margin-bottom:47px; }
.mb48 { margin-bottom:48px; }
.mb49 { margin-bottom:49px; }
.mb50 { margin-bottom:50px; }
.mb51 { margin-bottom:51px; }
.mb52 { margin-bottom:52px; }
.mb53 { margin-bottom:53px; }
.mb54 { margin-bottom:54px; }
.mb55 { margin-bottom:55px; }
.mb56 { margin-bottom:56px; }
.mb57 { margin-bottom:57px; }
.mb58 { margin-bottom:58px; }
.mb59 { margin-bottom:59px; }
.mb60 { margin-bottom:60px; }
.mb61 { margin-bottom:61px; }
.mb62 { margin-bottom:62px; }
.mb63 { margin-bottom:63px; }
.mb64 { margin-bottom:64px; }
.mb65 { margin-bottom:65px; }
.mb66 { margin-bottom:66px; }
.mb67 { margin-bottom:67px; }
.mb68 { margin-bottom:68px; }
.mb69 { margin-bottom:69px; }
.mb70 { margin-bottom:70px; }
.mb71 { margin-bottom:71px; }
.mb72 { margin-bottom:72px; }
.mb73 { margin-bottom:73px; }
.mb74 { margin-bottom:74px; }
.mb75 { margin-bottom:75px; }
.mb76 { margin-bottom:76px; }
.mb77 { margin-bottom:77px; }
.mb78 { margin-bottom:78px; }
.mb79 { margin-bottom:79px; }
.mb80 { margin-bottom:80px; }
.mb81 { margin-bottom:81px; }
.mb82 { margin-bottom:82px; }
.mb83 { margin-bottom:83px; }
.mb84 { margin-bottom:84px; }
.mb85 { margin-bottom:85px; }
.mb86 { margin-bottom:86px; }
.mb87 { margin-bottom:87px; }
.mb88 { margin-bottom:88px; }
.mb89 { margin-bottom:89px; }
.mb90 { margin-bottom:90px; }
.mb91 { margin-bottom:91px; }
.mb92 { margin-bottom:92px; }
.mb93 { margin-bottom:93px; }
.mb94 { margin-bottom:94px; }
.mb95 { margin-bottom:95px; }
.mb96 { margin-bottom:96px; }
.mb97 { margin-bottom:97px; }
.mb98 { margin-bottom:98px; }
.mb99 { margin-bottom:99px; }
.mb100 { margin-bottom:100px; }

.ml1 { margin-left:1px; }
.ml2 { margin-left:2px; }
.ml3 { margin-left:3px; }
.ml4 { margin-left:4px; }
.ml5 { margin-left:5px; }
.ml6 { margin-left:6px; }
.ml7 { margin-left:7px; }
.ml8 { margin-left:8px; }
.ml9 { margin-left:9px; }
.ml10 { margin-left:10px; }
.ml11 { margin-left:11px; }
.ml12 { margin-left:12px; }
.ml13 { margin-left:13px; }
.ml14 { margin-left:14px; }
.ml15 { margin-left:15px; }
.ml16 { margin-left:16px; }
.ml17 { margin-left:17px; }
.ml18 { margin-left:18px; }
.ml19 { margin-left:19px; }
.ml20 { margin-left:20px; }
.ml21 { margin-left:21px; }
.ml22 { margin-left:22px; }
.ml23 { margin-left:23px; }
.ml24 { margin-left:24px; }
.ml25 { margin-left:25px; }
.ml26 { margin-left:26px; }
.ml27 { margin-left:27px; }
.ml28 { margin-left:28px; }
.ml29 { margin-left:29px; }
.ml30 { margin-left:30px; }
.ml31 { margin-left:31px; }
.ml32 { margin-left:32px; }
.ml33 { margin-left:33px; }
.ml34 { margin-left:34px; }
.ml35 { margin-left:35px; }
.ml36 { margin-left:36px; }
.ml37 { margin-left:37px; }
.ml38 { margin-left:38px; }
.ml39 { margin-left:39px; }
.ml40 { margin-left:40px; }
.ml41 { margin-left:41px; }
.ml42 { margin-left:42px; }
.ml43 { margin-left:43px; }
.ml44 { margin-left:44px; }
.ml45 { margin-left:45px; }
.ml46 { margin-left:46px; }
.ml47 { margin-left:47px; }
.ml48 { margin-left:48px; }
.ml49 { margin-left:49px; }
.ml50 { margin-left:50px; }
.ml51 { margin-left:51px; }
.ml52 { margin-left:52px; }
.ml53 { margin-left:53px; }
.ml54 { margin-left:54px; }
.ml55 { margin-left:55px; }
.ml56 { margin-left:56px; }
.ml57 { margin-left:57px; }
.ml58 { margin-left:58px; }
.ml59 { margin-left:59px; }
.ml60 { margin-left:60px; }
.ml61 { margin-left:61px; }
.ml62 { margin-left:62px; }
.ml63 { margin-left:63px; }
.ml64 { margin-left:64px; }
.ml65 { margin-left:65px; }
.ml66 { margin-left:66px; }
.ml67 { margin-left:67px; }
.ml68 { margin-left:68px; }
.ml69 { margin-left:69px; }
.ml70 { margin-left:70px; }
.ml71 { margin-left:71px; }
.ml72 { margin-left:72px; }
.ml73 { margin-left:73px; }
.ml74 { margin-left:74px; }
.ml75 { margin-left:75px; }
.ml76 { margin-left:76px; }
.ml77 { margin-left:77px; }
.ml78 { margin-left:78px; }
.ml79 { margin-left:79px; }
.ml80 { margin-left:80px; }
.ml81 { margin-left:81px; }
.ml82 { margin-left:82px; }
.ml83 { margin-left:83px; }
.ml84 { margin-left:84px; }
.ml85 { margin-left:85px; }
.ml86 { margin-left:86px; }
.ml87 { margin-left:87px; }
.ml88 { margin-left:88px; }
.ml89 { margin-left:89px; }
.ml90 { margin-left:90px; }
.ml91 { margin-left:91px; }
.ml92 { margin-left:92px; }
.ml93 { margin-left:93px; }
.ml94 { margin-left:94px; }
.ml95 { margin-left:95px; }
.ml96 { margin-left:96px; }
.ml97 { margin-left:97px; }
.ml98 { margin-left:98px; }
.ml99 { margin-left:99px; }
.ml100 { margin-left:100px; }

/*---------------------------------------------
sizing
---------------------------------------------*/
/*--- width ---*/
.w-auto { width: auto; }
.w-px { width: 1px; }
.w-full { width: 100%; }
.w-screen { width: 100vh; }
.w-dvh { width: 100dvh; }
.w-dvw { width: 100dvw; }
.w-lvh { width: 100lvh; }
.w-lvw { width: 100lvw; }
.w-svh { width: 100svh; }
.w-svw { width: 100svw; }
.w-min { width: min-content; }
.w-max { width: max-content; }
.w-fit { width: fit-content; }
.w-lh { width: 1lh; }


.w-1 { width: 1%; }
.w-2 { width: 2%; }
.w-3 { width: 3%; }
.w-4 { width: 4%; }
.w-5 { width: 5%; }
.w-6 { width: 6%; }
.w-7 { width: 7%; }
.w-8 { width: 8%; }
.w-9 { width: 9%; }
.w-10 { width: 10%; }
.w-11 { width: 11%; }
.w-12 { width: 12%; }
.w-13 { width: 13%; }
.w-14 { width: 14%; }
.w-15 { width: 15%; }
.w-16 { width: 16%; }
.w-17 { width: 17%; }
.w-18 { width: 18%; }
.w-19 { width: 19%; }
.w-20 { width: 20%; }
.w-21 { width: 21%; }
.w-22 { width: 22%; }
.w-23 { width: 23%; }
.w-24 { width: 24%; }
.w-25 { width: 25%; }
.w-26 { width: 26%; }
.w-27 { width: 27%; }
.w-28 { width: 28%; }
.w-29 { width: 29%; }
.w-30 { width: 30%; }
.w-31 { width: 31%; }
.w-32 { width: 32%; }
.w-33 { width: 33%; }
.w-34 { width: 34%; }
.w-35 { width: 35%; }
.w-36 { width: 36%; }
.w-37 { width: 37%; }
.w-38 { width: 38%; }
.w-39 { width: 39%; }
.w-40 { width: 40%; }
.w-41 { width: 41%; }
.w-42 { width: 42%; }
.w-43 { width: 43%; }
.w-44 { width: 44%; }
.w-45 { width: 45%; }
.w-46 { width: 46%; }
.w-47 { width: 47%; }
.w-48 { width: 48%; }
.w-49 { width: 49%; }
.w-50 { width: 50%; }
.w-51 { width: 51%; }
.w-52 { width: 52%; }
.w-53 { width: 53%; }
.w-54 { width: 54%; }
.w-55 { width: 55%; }
.w-56 { width: 56%; }
.w-57 { width: 57%; }
.w-58 { width: 58%; }
.w-59 { width: 59%; }
.w-60 { width: 60%; }
.w-61 { width: 61%; }
.w-62 { width: 62%; }
.w-63 { width: 63%; }
.w-64 { width: 64%; }
.w-65 { width: 65%; }
.w-66 { width: 66%; }
.w-67 { width: 67%; }
.w-68 { width: 68%; }
.w-69 { width: 69%; }
.w-70 { width: 70%; }
.w-71 { width: 71%; }
.w-72 { width: 72%; }
.w-73 { width: 73%; }
.w-74 { width: 74%; }
.w-75 { width: 75%; }
.w-76 { width: 76%; }
.w-77 { width: 77%; }
.w-78 { width: 78%; }
.w-79 { width: 79%; }
.w-80 { width: 80%; }
.w-81 { width: 81%; }
.w-82 { width: 82%; }
.w-83 { width: 83%; }
.w-84 { width: 84%; }
.w-85 { width: 85%; }
.w-86 { width: 86%; }
.w-87 { width: 87%; }
.w-88 { width: 88%; }
.w-89 { width: 89%; }
.w-90 { width: 90%; }
.w-91 { width: 91%; }
.w-92 { width: 92%; }
.w-93 { width: 93%; }
.w-94 { width: 94%; }
.w-95 { width: 95%; }
.w-96 { width: 96%; }
.w-97 { width: 97%; }
.w-98 { width: 98%; }
.w-99 { width: 99%; }

/*--- width (vw) ---*/
.w-vw-1 { width: 1vw; }
.w-vw-2 { width: 2vw; }
.w-vw-3 { width: 3vw; }
.w-vw-4 { width: 4vw; }
.w-vw-5 { width: 5vw; }
.w-vw-6 { width: 6vw; }
.w-vw-7 { width: 7vw; }
.w-vw-8 { width: 8vw; }
.w-vw-9 { width: 9vw; }
.w-vw-10 { width: 10vw; }
.w-vw-11 { width: 11vw; }
.w-vw-12 { width: 12vw; }
.w-vw-13 { width: 13vw; }
.w-vw-14 { width: 14vw; }
.w-vw-15 { width: 15vw; }
.w-vw-16 { width: 16vw; }
.w-vw-17 { width: 17vw; }
.w-vw-18 { width: 18vw; }
.w-vw-19 { width: 19vw; }
.w-vw-20 { width: 20vw; }
.w-vw-21 { width: 21vw; }
.w-vw-22 { width: 22vw; }
.w-vw-23 { width: 23vw; }
.w-vw-24 { width: 24vw; }
.w-vw-25 { width: 25vw; }
.w-vw-26 { width: 26vw; }
.w-vw-27 { width: 27vw; }
.w-vw-28 { width: 28vw; }
.w-vw-29 { width: 29vw; }
.w-vw-30 { width: 30vw; }
.w-vw-31 { width: 31vw; }
.w-vw-32 { width: 32vw; }
.w-vw-33 { width: 33vw; }
.w-vw-34 { width: 34vw; }
.w-vw-35 { width: 35vw; }
.w-vw-36 { width: 36vw; }
.w-vw-37 { width: 37vw; }
.w-vw-38 { width: 38vw; }
.w-vw-39 { width: 39vw; }
.w-vw-40 { width: 40vw; }
.w-vw-41 { width: 41vw; }
.w-vw-42 { width: 42vw; }
.w-vw-43 { width: 43vw; }
.w-vw-44 { width: 44vw; }
.w-vw-45 { width: 45vw; }
.w-vw-46 { width: 46vw; }
.w-vw-47 { width: 47vw; }
.w-vw-48 { width: 48vw; }
.w-vw-49 { width: 49vw; }
.w-vw-50 { width: 50vw; }
.w-vw-51 { width: 51vw; }
.w-vw-52 { width: 52vw; }
.w-vw-53 { width: 53vw; }
.w-vw-54 { width: 54vw; }
.w-vw-55 { width: 55vw; }
.w-vw-56 { width: 56vw; }
.w-vw-57 { width: 57vw; }
.w-vw-58 { width: 58vw; }
.w-vw-59 { width: 59vw; }
.w-vw-60 { width: 60vw; }
.w-vw-61 { width: 61vw; }
.w-vw-62 { width: 62vw; }
.w-vw-63 { width: 63vw; }
.w-vw-64 { width: 64vw; }
.w-vw-65 { width: 65vw; }
.w-vw-66 { width: 66vw; }
.w-vw-67 { width: 67vw; }
.w-vw-68 { width: 68vw; }
.w-vw-69 { width: 69vw; }
.w-vw-70 { width: 70vw; }
.w-vw-71 { width: 71vw; }
.w-vw-72 { width: 72vw; }
.w-vw-73 { width: 73vw; }
.w-vw-74 { width: 74vw; }
.w-vw-75 { width: 75vw; }
.w-vw-76 { width: 76vw; }
.w-vw-77 { width: 77vw; }
.w-vw-78 { width: 78vw; }
.w-vw-79 { width: 79vw; }
.w-vw-80 { width: 80vw; }
.w-vw-81 { width: 81vw; }
.w-vw-82 { width: 82vw; }
.w-vw-83 { width: 83vw; }
.w-vw-84 { width: 84vw; }
.w-vw-85 { width: 85vw; }
.w-vw-86 { width: 86vw; }
.w-vw-87 { width: 87vw; }
.w-vw-88 { width: 88vw; }
.w-vw-89 { width: 89vw; }
.w-vw-90 { width: 90vw; }
.w-vw-91 { width: 91vw; }
.w-vw-92 { width: 92vw; }
.w-vw-93 { width: 93vw; }
.w-vw-94 { width: 94vw; }
.w-vw-95 { width: 95vw; }
.w-vw-96 { width: 96vw; }
.w-vw-97 { width: 97vw; }
.w-vw-98 { width: 98vw; }
.w-vw-99 { width: 99vw; }

/*--- min-width ---*/
.min-w-5xs { min-width: 128px; }
.min-w-4xs { min-width: 192px; }
.min-w-3xs { min-width: 256px; }
.min-w-2xs { min-width: 288px; }
.min-w-xs { min-width: 320px; }
.min-w-sm { min-width: 384px; }
.min-w-md { min-width: 448px; }
.min-w-lg { min-width: 512px; }
.min-w-xl { min-width: 576px; }
.min-w-2xl { min-width: 672px; }
.min-w-3xl { min-width: 768px; }
.min-w-4xl { min-width: 896px; }
.min-w-5xl { min-width: 1024px; }
.min-w-6xl { min-width: 1152px; }
.min-w-7xl { min-width: 1280px; }
.min-w-auto { min-width: auto; }
.min-w-px { min-width: 1px; }
.min-w-full { min-width: 100%; }
.min-w-screen { min-width: 100vw; }
.min-w-dvw { min-width: 100dvw; }
.min-w-dvh { min-width: 100dvh; }
.min-w-lvw { min-width: 100lvw; }
.min-w-lvh { min-width: 100lvh; }
.min-w-svw { min-width: 100svw; }
.min-w-svh { min-width: 100svh; }
.min-w-min { min-width: min-content; }
.min-w-max { min-width: max-content; }
.min-w-fit { min-width: fit-content; }

/*--- max-width ---*/
.max-w-5xs { max-width: 144px; }
.max-w-4xs { max-width: 192px; }
.max-w-3xs { max-width: 256px; }
.max-w-2xs { max-width: 288px; }
.max-w-xs { max-width: 320px; }
.max-w-sm { max-width: 384px; }
.max-w-md { max-width: 448px; }
.max-w-lg { max-width: 512px; }
.max-w-xl { max-width: 576px; }
.max-w-2xl { max-width: 672px; }
.max-w-3xl { max-width: 768px; }
.max-w-4xl { max-width: 896px; }
.max-w-5xl { max-width: 1024px; }
.max-w-6xl { max-width: 1152px; }
.max-w-7xl { max-width: 1280px; }
.max-w-auto { max-width: auto; }
.max-w-px { max-width: 1px; }
.max-w-full { max-width: 100%; }
.max-w-screen { max-width: 100vw; }
.max-w-dvw { max-width: 100dvw; }
.max-w-dvh { max-width: 100dvh; }
.max-w-lvw { max-width: 100lvw; }
.max-w-lvh { max-width: 100lvh; }
.max-w-svw { max-width: 100svw; }
.max-w-svh { max-width: 100svh; }
.max-w-max { max-width: max-content; }
.max-w-max { max-width: max-content; }
.max-w-fit { max-width: fit-content; }

.max-w-100px { max-width: 100px; }

/*--- height ---*/
.h-auto { height: auto; }
.h-px { height: 1px; }
.h-full { height: 100%; }
.h-screen { height: 100vh; }
.h-dvh { height: 100dvh; }
.h-dvw { height: 100dvw; }
.h-lvh { height: 100lvh; }
.h-lvw { height: 100lvw; }
.h-svh { height: 100svh; }
.h-svw { height: 100svw; }
.h-min { height: min-content; }
.h-max { height: max-content; }
.h-fit { height: fit-content; }
.h-lh { height: 1lh; }

.h-1 { height: 1%; }
.h-2 { height: 2%; }
.h-3 { height: 3%; }
.h-4 { height: 4%; }
.h-5 { height: 5%; }
.h-6 { height: 6%; }
.h-7 { height: 7%; }
.h-8 { height: 8%; }
.h-9 { height: 9%; }
.h-10 { height: 10%; }
.h-11 { height: 11%; }
.h-12 { height: 12%; }
.h-13 { height: 13%; }
.h-14 { height: 14%; }
.h-15 { height: 15%; }
.h-16 { height: 16%; }
.h-17 { height: 17%; }
.h-18 { height: 18%; }
.h-19 { height: 19%; }
.h-20 { height: 20%; }
.h-21 { height: 21%; }
.h-22 { height: 22%; }
.h-23 { height: 23%; }
.h-24 { height: 24%; }
.h-25 { height: 25%; }
.h-26 { height: 26%; }
.h-27 { height: 27%; }
.h-28 { height: 28%; }
.h-29 { height: 29%; }
.h-30 { height: 30%; }
.h-31 { height: 31%; }
.h-32 { height: 32%; }
.h-33 { height: 33%; }
.h-34 { height: 34%; }
.h-35 { height: 35%; }
.h-36 { height: 36%; }
.h-37 { height: 37%; }
.h-38 { height: 38%; }
.h-39 { height: 39%; }
.h-40 { height: 40%; }
.h-41 { height: 41%; }
.h-42 { height: 42%; }
.h-43 { height: 43%; }
.h-44 { height: 44%; }
.h-45 { height: 45%; }
.h-46 { height: 46%; }
.h-47 { height: 47%; }
.h-48 { height: 48%; }
.h-49 { height: 49%; }
.h-50 { height: 50%; }
.h-51 { height: 51%; }
.h-52 { height: 52%; }
.h-53 { height: 53%; }
.h-54 { height: 54%; }
.h-55 { height: 55%; }
.h-56 { height: 56%; }
.h-57 { height: 57%; }
.h-58 { height: 58%; }
.h-59 { height: 59%; }
.h-60 { height: 60%; }
.h-61 { height: 61%; }
.h-62 { height: 62%; }
.h-63 { height: 63%; }
.h-64 { height: 64%; }
.h-65 { height: 65%; }
.h-66 { height: 66%; }
.h-67 { height: 67%; }
.h-68 { height: 68%; }
.h-69 { height: 69%; }
.h-70 { height: 70%; }
.h-71 { height: 71%; }
.h-72 { height: 72%; }
.h-73 { height: 73%; }
.h-74 { height: 74%; }
.h-75 { height: 75%; }
.h-76 { height: 76%; }
.h-77 { height: 77%; }
.h-78 { height: 78%; }
.h-79 { height: 79%; }
.h-80 { height: 80%; }
.h-81 { height: 81%; }
.h-82 { height: 82%; }
.h-83 { height: 83%; }
.h-84 { height: 84%; }
.h-85 { height: 85%; }
.h-86 { height: 86%; }
.h-87 { height: 87%; }
.h-88 { height: 88%; }
.h-89 { height: 89%; }
.h-90 { height: 90%; }
.h-91 { height: 91%; }
.h-92 { height: 92%; }
.h-93 { height: 93%; }
.h-94 { height: 94%; }
.h-95 { height: 95%; }
.h-96 { height: 96%; }
.h-97 { height: 97%; }
.h-98 { height: 98%; }
.h-99 { height: 99%; }

/*--- height (vh) ---*/
.h-vh-1 { height: 1vh; }
.h-vh-2 { height: 2vh; }
.h-vh-3 { height: 3vh; }
.h-vh-4 { height: 4vh; }
.h-vh-5 { height: 5vh; }
.h-vh-6 { height: 6vh; }
.h-vh-7 { height: 7vh; }
.h-vh-8 { height: 8vh; }
.h-vh-9 { height: 9vh; }
.h-vh-10 { height: 10vh; }
.h-vh-11 { height: 11vh; }
.h-vh-12 { height: 12vh; }
.h-vh-13 { height: 13vh; }
.h-vh-14 { height: 14vh; }
.h-vh-15 { height: 15vh; }
.h-vh-16 { height: 16vh; }
.h-vh-17 { height: 17vh; }
.h-vh-18 { height: 18vh; }
.h-vh-19 { height: 19vh; }
.h-vh-20 { height: 20vh; }
.h-vh-21 { height: 21vh; }
.h-vh-22 { height: 22vh; }
.h-vh-23 { height: 23vh; }
.h-vh-24 { height: 24vh; }
.h-vh-25 { height: 25vh; }
.h-vh-26 { height: 26vh; }
.h-vh-27 { height: 27vh; }
.h-vh-28 { height: 28vh; }
.h-vh-29 { height: 29vh; }
.h-vh-30 { height: 30vh; }
.h-vh-31 { height: 31vh; }
.h-vh-32 { height: 32vh; }
.h-vh-33 { height: 33vh; }
.h-vh-34 { height: 34vh; }
.h-vh-35 { height: 35vh; }
.h-vh-36 { height: 36vh; }
.h-vh-37 { height: 37vh; }
.h-vh-38 { height: 38vh; }
.h-vh-39 { height: 39vh; }
.h-vh-40 { height: 40vh; }
.h-vh-41 { height: 41vh; }
.h-vh-42 { height: 42vh; }
.h-vh-43 { height: 43vh; }
.h-vh-44 { height: 44vh; }
.h-vh-45 { height: 45vh; }
.h-vh-46 { height: 46vh; }
.h-vh-47 { height: 47vh; }
.h-vh-48 { height: 48vh; }
.h-vh-49 { height: 49vh; }
.h-vh-50 { height: 50vh; }
.h-vh-51 { height: 51vh; }
.h-vh-52 { height: 52vh; }
.h-vh-53 { height: 53vh; }
.h-vh-54 { height: 54vh; }
.h-vh-55 { height: 55vh; }
.h-vh-56 { height: 56vh; }
.h-vh-57 { height: 57vh; }
.h-vh-58 { height: 58vh; }
.h-vh-59 { height: 59vh; }
.h-vh-60 { height: 60vh; }
.h-vh-61 { height: 61vh; }
.h-vh-62 { height: 62vh; }
.h-vh-63 { height: 63vh; }
.h-vh-64 { height: 64vh; }
.h-vh-65 { height: 65vh; }
.h-vh-66 { height: 66vh; }
.h-vh-67 { height: 67vh; }
.h-vh-68 { height: 68vh; }
.h-vh-69 { height: 69vh; }
.h-vh-70 { height: 70vh; }
.h-vh-71 { height: 71vh; }
.h-vh-72 { height: 72vh; }
.h-vh-73 { height: 73vh; }
.h-vh-74 { height: 74vh; }
.h-vh-75 { height: 75vh; }
.h-vh-76 { height: 76vh; }
.h-vh-77 { height: 77vh; }
.h-vh-78 { height: 78vh; }
.h-vh-79 { height: 79vh; }
.h-vh-80 { height: 80vh; }
.h-vh-81 { height: 81vh; }
.h-vh-82 { height: 82vh; }
.h-vh-83 { height: 83vh; }
.h-vh-84 { height: 84vh; }
.h-vh-85 { height: 85vh; }
.h-vh-86 { height: 86vh; }
.h-vh-87 { height: 87vh; }
.h-vh-88 { height: 88vh; }
.h-vh-89 { height: 89vh; }
.h-vh-90 { height: 90vh; }
.h-vh-91 { height: 91vh; }
.h-vh-92 { height: 92vh; }
.h-vh-93 { height: 93vh; }
.h-vh-94 { height: 94vh; }
.h-vh-95 { height: 95vh; }
.h-vh-96 { height: 96vh; }
.h-vh-97 { height: 97vh; }
.h-vh-98 { height: 98vh; }
.h-vh-99 { height: 99vh; }

/*--- min-height ---*/
.min-h-px { min-height: 1px; }
.min-h-full { min-height: 100%; }
.min-h-screen { min-height: 100vh; }
.min-h-dvh { min-height: 100dvh; }
.min-h-dvw { min-height: 100dvw; }
.min-h-lvh { min-height: 100lvh; }
.min-h-lvw { min-height: 100lvw; }
.min-h-svw { min-height: 100svw; }
.min-h-svh { min-height: 100svh; }
.min-h-auto { min-height: auto; }
.min-h-min { min-height: min-content; }
.min-h-max { min-height: max-content; }
.min-h-fit { min-height: fit-content; }
.min-h-lh { min-height: 1lh; }

/*---------------------------------------------
typograhy
---------------------------------------------*/
/*--- font-size ---*/
.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; }
.text-6xl { font-size:3.75rem; }
.text-7xl { font-size:4.5rem; }
.text-8xl { font-size:6rem; }
.text-9xl { font-size:8rem; }

.text-1rem { font-size:1rem; }
.text-2rem { font-size:2rem; }
.text-3rem { font-size:3rem; }
.text-4rem { font-size:4rem; }
.text-5rem { font-size:5rem; }
.text-6rem { font-size:6rem; }
.text-7rem { font-size:7rem; }
.text-8rem { font-size:8rem; }
.text-9rem { font-size:9rem; }
.text-10rem { font-size:10rem; }
.text-11rem { font-size:11rem; }
.text-12rem { font-size:12rem; }
.text-13rem { font-size:13rem; }
.text-14rem { font-size:14rem; }
.text-15rem { font-size:15rem; }
.text-16rem { font-size:16rem; }
.text-17rem { font-size:17rem; }
.text-18rem { font-size:18rem; }
.text-19rem { font-size:19rem; }
.text-20rem { font-size:20rem; }


@media (max-width: 768px){
 .text-xs  { font-size: 0.8rem; }
 .text-sm  { font-size: 0.9rem; }
 .text-base { font-size: 1.0rem; }
 .text-lg  { font-size: 1.1rem; }
 .text-xl  { font-size: 1.2rem; }
 .text-2xl { font-size: 1.4rem; }
 .text-3xl { font-size: 1.6rem; }
 .text-4xl { font-size: 1.8rem; }
 .text-5xl { font-size: 2.2rem; }
 .text-6xl { font-size: 2.4rem; }
 .text-7xl { font-size: 2.8rem; }
 .text-8xl { font-size: 3.2rem; }
 .text-9xl { font-size: 3.6rem; }
}

/*--- font-style---*/
.italic { font-style: italic; }
.not-italic { font-style: normal; }

/*--- font-weight ---*/
.font-thin { font-weight: 100; }
.font-extralight { font-weight: 200; }
.font-light { font-weight: 300; }
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.font-extrabold { font-weight: 800; }
.font-black { font-weight: 900; }

/*--- letter-spacing ---*/
.tracking-tighter { letter-spacing:-0.05em; }
.tracking-tight { letter-spacing:-0.025em; }
.tracking-normal { letter-spacing: 0em; }
.tracking-wide { letter-spacing:0.025em; }
.tracking-wider { letter-spacing:0.05em; }
.tracking-widest { letter-spacing: 0.1em; }

/*--- line-height ---*/
.leading-none { line-height:1; }
.leading-11 { line-height:1.1; }
.leading-12 { line-height:1.2; }
.leading-13 { line-height:1.3; }
.leading-14 { line-height:1.4; }
.leading-15 { line-height:1.5; }
.leading-16 { line-height:1.6; }
.leading-17 { line-height:1.7; }
.leading-18 { line-height:1.8; }
.leading-19 { line-height:1.9; }
.leading-20 { line-height:2.0; }

/*--- text-align ---*/
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-justify { text-align: justify; }
.text-start { text-align: start; }
.text-end { text-align: end; }

/*--- text-overflow ---*/
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-ellipsis { text-overflow: ellipsis; }
.text-clip { text-overflow: clip; }

/*--- white-space ---*/
.whitespace-normal { white-space: normal; }
.whitespace-nowrap { white-space: nowrap; }
.whitespace-pre { white-space: pre; }
.whitespace-pre-line { white-space: pre-line; }
.whitespace-pre-wrap { white-space: pre-wrap; }
.whitespace-break-spaces { white-space: break-spaces; }

/*--- word-break ---*/
.break-normal { word-break: normal; }
.break-all { word-break: break-all; }
.break-keep { word-break: keep-all; }



.mincho { font-family:var(--mincho); }
.hina-mincho { font-family:var(--hina-mincho); }
.en { font-family:var(--en); }

/*---------------------------------------------
backgrounds
---------------------------------------------*/
/*--- background-color ---*/
.bg-transparent  { background-color: transparent; }

/*--- background-attachment ---*/
.bg-fixed { background-attachment: fixed; }
.bg-local { background-attachment: local; }
.bg-scroll { background-attachment: scroll; }

/*--- background-position ---*/
.bg-top-left { background-position: top left; }
.bg-top { background-position: top; }
.bg-top-right { background-position: top right; }
.bg-left { background-position: left; }
.bg-center { background-position: center; }
.bg-right { background-position: right; }
.bg-bottom-left { background-position: bottom left; }
.bg-bottom { background-position: bottom; }
.bg-bottom-right { background-position: bottom right; }

/*--- background-repeat ---*/
.bg-repeat { background-repeat: repeat; }
.bg-repeat-x { background-repeat: repeat-x; }
.bg-repeat-y { background-repeat: repeat-y; }
.bg-repeat-space { background-repeat: space; }
.bg-repeat-round { background-repeat: round; }
.bg-no-repeat { background-repeat: no-repeat; }

/*--- background-size ---*/
.bg-auto { background-size: auto; }
.bg-cover { background-size: cover; }
.bg-contain { background-size: contain; }

/*---------------------------------------------
border
---------------------------------------------*/
/*--- border-radius ---*/
.rounded-xs { border-radius:2px; }
.rounded-sm { border-radius:4px; }
.rounded-md { border-radius:6px; }
.rounded-lg { border-radius:8px; }
.rounded-xl { border-radius:12px; }
.rounded-2xl { border-radius:16px; }
.rounded-3xl { border-radius:24px; }
.rounded-4xl { border-radius:32px; }
.rounded-none { border-radius: 0; }

/*--- border-width ---*/
.border-1 { border-width:1px; }
.border-2 { border-width:2px; }
.border-3 { border-width:3px; }
.border-4 { border-width:4px; }
.border-5 { border-width:5px; }
.border-6 { border-width:6px; }
.border-7 { border-width:7px; }
.border-8 { border-width:8px; }
.border-9 { border-width:9px; }
.border-10 { border-width:10px; }

.border-t-1 { border-top-width:1px; }
.border-t-2 { border-top-width:2px; }
.border-r-3 { border-top-width:3px; }
.border-t-4 { border-top-width:4px; }
.border-t-5 { border-top-width:5px; }
.border-t-6 { border-top-width:6px; }
.border-t-7 { border-top-width:7px; }
.border-t-8 { border-top-width:8px; }
.border-t-9 { border-top-width:9px; }
.border-t-10 { border-top-width:10px; }

.border-b-1 { border-bottom-width:1px; }
.border-b-2 { border-bottom-width:2px; }
.border-r-3 { border-bottom-width:3px; }
.border-b-4 { border-bottom-width:4px; }
.border-b-5 { border-bottom-width:5px; }
.border-b-6 { border-bottom-width:6px; }
.border-b-7 { border-bottom-width:7px; }
.border-b-8 { border-bottom-width:8px; }
.border-b-9 { border-bottom-width:9px; }
.border-b-10 { border-bottom-width:10px; }

/*--- border-style ---*/
.border-solid { border-style: solid; }
.border-dashed { border-style: dashed; }
.border-dotted { border-style: dotted; }
.border-double { border-style: double; }
.border-hidden { border-style: hidden; }
.border-none { border-style: none; }

/*---------------------------------------------
outline
---------------------------------------------*/
outline-0 { outline:none; }

/*---------------------------------------------
effects
---------------------------------------------*/
/*--- box-shadow ---*/
.shadow-2xs { box-shadow: 0 1px rgb(0 0 0 / 0.05); }
.shadow-xs { box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); }
.shadow-sm { box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); }
.shadow-md { box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); }
.shadow-lg { box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); }
.shadow-xl { box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); }
.shadow-2xl { box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); }
.shadow-none { box-shadow: 0 0 #0000; }

/*--- opacity ---*/
.opacity-0 { opacity:0; }
.opacity-01 { opacity:0.1; }
.opacity-02 { opacity:0.2; }
.opacity-03 { opacity:0.3; }
.opacity-04 { opacity:0.4; }
.opacity-05 { opacity:0.5; }
.opacity-06 { opacity:0.6; }
.opacity-07 { opacity:0.7; }
.opacity-08 { opacity:0.8; }
.opacity-09 { opacity:0.9; }
.opacity-1 { opacity:1; }

/*---------------------------------------------
tables
---------------------------------------------*/
/*--- border-collapse ---*/
.border-collapse { border-collapse: collapse; }
.border-separate { border-collapse: separate; }

/*--- border-spacing ---*/
.border-spacing-none { border-spacing:0; }

/*--- table-layout ---*/
.table-auto { table-layout: auto; }
.table-fixed { table-layout: fixed; }