/**/ @charset "UTF-8"; /* SCSS Document */ @import url('../fontawesome-6.4.2/all.css'); /* SCSS Document */ /* LTR VARIABLES ---------------------------------------------------------------------------------------------------- */ :root { --dir: ltr; --dir-opposite: rtl; --dir-start: left; --dir-end: right; --dir-transform: 1; --fa-arrow-start: ""; --fa-arrow-end: ""; --fa-arrow-circle-start: ""; --fa-arrow-circle-end: ""; --fa-chevron-start: ""; --fa-chevron-end: ""; --fa-chevron-circle-start: ""; --fa-chevron-circle-end: ""; --fa-long-arrow-start: ""; --fa-long-arrow-end: ""; } /* SCSS Document */ /* FONTS | PROXIMA NOVA ---------------------------------------------------------------------------------------------------- */ @font-face { font-family: "Proxima Nova"; font-style: normal; font-weight: 300; src: local("proxima-nova-light"), local("proxima nova light"), url("../../../fonts/proxima-nova/Proxima-Nova-Light.woff2") format("woff2"), url("../../../fonts/proxima-nova/Proxima-Nova-Light.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Nova"; font-style: normal; font-weight: 400; src: local("proxima-nova-regular"), local("proxima nova regular"), url("../../../fonts/proxima-nova/Proxima-Nova-Regular.woff2") format("woff2"), url("../../../fonts/proxima-nova/Proxima-Nova-Regular.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Nova"; font-style: normal; font-weight: 600; src: local("proxima-nova-semibold"), local("proxima nova semibold"), url("../../../fonts/proxima-nova/Proxima-Nova-Semibold.woff2") format("woff2"), url("../../../fonts/proxima-nova/Proxima-Nova-Semibold.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Nova"; font-style: normal; font-weight: 800; src: local("proxima-nova-extrabold"), local("proxima nova extrabold"), url("../../../fonts/proxima-nova/proximanova-extrabold.woff2") format("woff2"), url("../../../fonts/proxima-nova/proximanova-extrabold.woff") format("woff"); font-display: swap; } /* FONTS | PROXIMA SOFT ---------------------------------------------------------------------------------------------------- */ @font-face { font-family: "Proxima Soft"; font-style: normal; font-weight: 300; src: local("proxima-soft-regular"), local("proxima soft regular"), url("../../../fonts/proxima-soft/proximasoft-regular.woff2") format("woff2"), url("../../../fonts/proxima-soft/proximasoft-regular.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Soft"; font-style: normal; font-weight: 400; src: local("proxima-soft-medium"), local("proxima soft medium"), url("../../../fonts/proxima-soft/proximasoft-medium.woff2") format("woff2"), url("../../../fonts/proxima-soft/proximasoft-medium.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Soft"; font-style: normal; font-weight: 600; src: local("proxima-soft-semibold"), local("proxima soft semibold"), url("../../../fonts/proxima-soft/proximasoft-semibold.woff2") format("woff2"), url("../../../fonts/proxima-soft/proximasoft-semibold.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Soft"; font-style: normal; font-weight: 700; src: local("proxima-soft-bold"), local("proxima soft bold"), url("../../../fonts/proxima-soft/proximasoft-bold.woff2") format("woff2"), url("../../../fonts/proxima-soft/proximasoft-bold.woff") format("woff"); font-display: swap; } /* FONTS | FONT AWESOME 6.4.2 ---------------------------------------------------------------------------------------------------- */ @font-face { font-family: "Font Awesome 6 Free"; font-style: normal; font-weight: 900; font-display: block; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-solid-900.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-solid-900.ttf") format("truetype"); } @font-face { font-family: "Font Awesome 5 Brands"; font-display: block; font-weight: 400; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-brands-400.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-brands-400.ttf") format("truetype"); } @font-face { font-family: "Font Awesome 5 Free"; font-display: block; font-weight: 900; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-solid-900.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-solid-900.ttf") format("truetype"); } @font-face { font-family: "Font Awesome 5 Free"; font-display: block; font-weight: 400; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-regular-400.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-regular-400.ttf") format("truetype"); } @font-face { font-family: "FontAwesome"; font-display: block; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-solid-900.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-solid-900.ttf") format("truetype"); } @font-face { font-family: "FontAwesome"; font-display: block; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-brands-400.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-brands-400.ttf") format("truetype"); } @font-face { font-family: "FontAwesome"; font-display: block; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-regular-400.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-regular-400.ttf") format("truetype"); unicode-range: U +F003, U +F006, U +F014, U +F016-F017, U +F01A-F01B, U +F01D, U +F022, U +F03E, U +F044, U +F046, U +F05C-F05D, U +F06E, U +F070, U +F087-F088, U +F08A, U +F094, U +F096-F097, U +F09D, U +F0A0, U +F0A2, U +F0A4-F0A7, U +F0C5, U +F0C7, U +F0E5-F0E6, U +F0EB, U +F0F6-F0F8, U +F10C, U +F114-F115, U +F118-F11A, U +F11C-F11D, U +F133, U +F147, U +F14E, U +F150-F152, U +F185-F186, U +F18E, U +F190-F192, U +F196, U +F1C1-F1C9, U +F1D9, U +F1DB, U +F1E3, U +F1EA, U +F1F7, U +F1F9, U +F20A, U +F247-F248, U +F24A, U +F24D, U +F255-F25B, U +F25D, U +F271-F274, U +F278, U +F27B, U +F28C, U +F28E, U +F29C, U +F2B5, U +F2B7, U +F2BA, U +F2BC, U +F2BE, U +F2C0-F2C1, U +F2C3, U +F2D0, U +F2D2, U +F2D4, U +F2DC; } @font-face { font-family: "FontAwesome"; font-display: block; src: url("../../../fonts/fontawesome-6.4.2/webfonts/fa-v4compatibility.woff2") format("woff2"), url("../../../fonts/fontawesome-6.4.2/webfonts/fa-v4compatibility.ttf") format("truetype"); unicode-range: U +F041, U +F047, U +F065-F066, U +F07D-F07E, U +F080, U +F08B, U +F08E, U +F090, U +F09A, U +F0AC, U +F0AE, U +F0B2, U +F0D0, U +F0D6, U +F0E4, U +F0EC, U +F10A-F10B, U +F123, U +F13E, U +F148-F149, U +F14C, U +F156, U +F15E, U +F160-F161, U +F163, U +F175-F178, U +F195, U +F1F8, U +F219, U +F27A; } /* SCSS Document */ /* MIXINS | CUSTOM ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* OTHER COLORS | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --pink-3: hsla(0, 100%, 81%, 0.03); --pink-5: hsla(0, 100%, 81%, 0.05); --pink-10: hsla(0, 100%, 81%, 0.10); --pink-20: hsla(0, 100%, 81%, 0.20); --pink-30: hsla(0, 100%, 81%, 0.30); --pink-40: hsla(0, 100%, 81%, 0.40); --pink-50: hsla(0, 100%, 81%, 0.50); --pink-60: hsla(0, 100%, 81%, 0.60); --pink-70: hsla(0, 100%, 81%, 0.70); --pink-80: hsla(0, 100%, 81%, 0.80); --pink-90: hsla(0, 100%, 81%, 0.90); --pink: hsla(0, 100%, 81%, 1.0); --pink-dark-10: hsla(0, 68%, 69%, 1.0); --pink-dark-20: hsla(0, 68%, 64%, 1.0); --pink-dark-30: hsla(0, 68%, 59%, 1.0); --pink-dark-40: hsla(0, 68%, 54%, 1.0); --pink-dark-50: hsla(0, 68%, 49%, 1.0); --red-3: hsla(358, 84%, 63%, 0.03); --red-5: hsla(358, 84%, 63%, 0.05); --red-10: hsla(358, 84%, 63%, 0.10); --red-20: hsla(358, 84%, 63%, 0.20); --red-30: hsla(358, 84%, 63%, 0.30); --red-40: hsla(358, 84%, 63%, 0.40); --red-50: hsla(358, 84%, 63%, 0.50); --red-60: hsla(358, 84%, 63%, 0.60); --red-70: hsla(358, 84%, 63%, 0.70); --red-80: hsla(358, 84%, 63%, 0.80); --red-90: hsla(358, 84%, 63%, 0.90); --red: hsla(358, 84%, 63%, 1.0); --red-dark-10: hsla(358, 61%, 50%, 1.0); --red-dark-20: hsla(358, 61%, 45%, 1.0); --red-dark-30: hsla(358, 61%, 40%, 1.0); --red-dark-40: hsla(358, 61%, 35%, 1.0); --red-dark-50: hsla(358, 61%, 30%, 1.0); --orange-3: hsla(14, 84%, 63%, 0.03); --orange-5: hsla(14, 84%, 63%, 0.05); --orange-10: hsla(14, 84%, 63%, 0.10); --orange-20: hsla(14, 84%, 63%, 0.20); --orange-30: hsla(14, 84%, 63%, 0.30); --orange-40: hsla(14, 84%, 63%, 0.40); --orange-50: hsla(14, 84%, 63%, 0.50); --orange-60: hsla(14, 84%, 63%, 0.60); --orange-70: hsla(14, 84%, 63%, 0.70); --orange-80: hsla(14, 84%, 63%, 0.80); --orange-90: hsla(14, 84%, 63%, 0.90); --orange: hsla(14, 84%, 63%, 1.0); --orange-dark-10: hsla(14, 67%, 52%, 1.0); --orange-dark-20: hsla(14, 67%, 47%, 1.0); --orange-dark-30: hsla(14, 67%, 42%, 1.0); --orange-dark-40: hsla(14, 67%, 37%, 1.0); --orange-dark-50: hsla(14, 67%, 32%, 1.0); --yellow-3: hsla(47, 100%, 72%, 0.03); --yellow-5: hsla(47, 100%, 72%, 0.05); --yellow-10: hsla(47, 100%, 72%, 0.10); --yellow-20: hsla(47, 100%, 72%, 0.20); --yellow-30: hsla(47, 100%, 72%, 0.30); --yellow-40: hsla(47, 100%, 72%, 0.40); --yellow-50: hsla(47, 100%, 72%, 0.50); --yellow-60: hsla(47, 100%, 72%, 0.60); --yellow-70: hsla(47, 100%, 72%, 0.70); --yellow-80: hsla(47, 100%, 72%, 0.80); --yellow-90: hsla(47, 100%, 72%, 0.90); --yellow: hsla(47, 100%, 72%, 1.0); --yellow-dark-10: hsla(47, 75%, 60%, 1.0); --yellow-dark-20: hsla(47, 75%, 55%, 1.0); --yellow-dark-30: hsla(47, 75%, 50%, 1.0); --yellow-dark-40: hsla(47, 75%, 45%, 1.0); --yellow-dark-50: hsla(47, 75%, 40%, 1.0); --lime-3: hsla(69, 100%, 41%, 0.03); --lime-5: hsla(69, 100%, 41%, 0.05); --lime-10: hsla(69, 100%, 41%, 0.10); --lime-20: hsla(69, 100%, 41%, 0.20); --lime-30: hsla(69, 100%, 41%, 0.30); --lime-40: hsla(69, 100%, 41%, 0.40); --lime-50: hsla(69, 100%, 41%, 0.50); --lime-60: hsla(69, 100%, 41%, 0.60); --lime-70: hsla(69, 100%, 41%, 0.70); --lime-80: hsla(69, 100%, 41%, 0.80); --lime-90: hsla(69, 100%, 41%, 0.90); --lime: hsla(69, 100%, 41%, 1.0); --lime-dark-10: hsla(74, 100%, 36%, 1.0); --lime-dark-20: hsla(74, 100%, 31%, 1.0); --lime-dark-30: hsla(74, 100%, 26%, 1.0); --lime-dark-40: hsla(74, 100%, 21%, 1.0); --lime-dark-50: hsla(74, 100%, 16%, 1.0); --mint-3: hsla(117, 53%, 66%, 0.03); --mint-5: hsla(117, 53%, 66%, 0.05); --mint-10: hsla(117, 53%, 66%, 0.10); --mint-20: hsla(117, 53%, 66%, 0.20); --mint-30: hsla(117, 53%, 66%, 0.30); --mint-40: hsla(117, 53%, 66%, 0.40); --mint-50: hsla(117, 53%, 66%, 0.50); --mint-60: hsla(117, 53%, 66%, 0.60); --mint-70: hsla(117, 53%, 66%, 0.70); --mint-80: hsla(117, 53%, 66%, 0.80); --mint-90: hsla(117, 53%, 66%, 0.90); --mint: hsla(117, 53%, 66%, 1.0); --mint-dark-10: hsla(117, 43%, 55%, 1.0); --mint-dark-20: hsla(117, 43%, 50%, 1.0); --mint-dark-30: hsla(117, 43%, 45%, 1.0); --mint-dark-40: hsla(117, 43%, 40%, 1.0); --mint-dark-50: hsla(117, 43%, 35%, 1.0); --green-3: hsla(157, 97%, 31%, 0.03); --green-5: hsla(157, 97%, 31%, 0.05); --green-10: hsla(157, 97%, 31%, 0.10); --green-20: hsla(157, 97%, 31%, 0.20); --green-30: hsla(157, 97%, 31%, 0.30); --green-40: hsla(157, 97%, 31%, 0.40); --green-50: hsla(157, 97%, 31%, 0.50); --green-60: hsla(157, 97%, 31%, 0.60); --green-70: hsla(157, 97%, 31%, 0.70); --green-80: hsla(157, 97%, 31%, 0.80); --green-90: hsla(157, 97%, 31%, 0.90); --green: hsla(157, 97%, 31%, 1.0); --green-dark-10: hsla(148, 100%, 25%, 1.0); --green-dark-20: hsla(148, 100%, 20%, 1.0); --green-dark-30: hsla(148, 100%, 15%, 1.0); --green-dark-40: hsla(148, 100%, 10%, 1.0); --green-dark-50: hsla(148, 100%, 5%, 1.0); --sage-3: hsla(133, 22%, 54%, 0.03); --sage-5: hsla(133, 22%, 54%, 0.05); --sage-10: hsla(133, 22%, 54%, 0.10); --sage-20: hsla(133, 22%, 54%, 0.20); --sage-30: hsla(133, 22%, 54%, 0.30); --sage-40: hsla(133, 22%, 54%, 0.40); --sage-50: hsla(133, 22%, 54%, 0.50); --sage-60: hsla(133, 22%, 54%, 0.60); --sage-70: hsla(133, 22%, 54%, 0.70); --sage-80: hsla(133, 22%, 54%, 0.80); --sage-90: hsla(133, 22%, 54%, 0.90); --sage: hsla(133, 22%, 54%, 1.0); --sage-dark-10: hsla(132, 27%, 43%, 1.0); --sage-dark-20: hsla(132, 27%, 38%, 1.0); --sage-dark-30: hsla(132, 27%, 33%, 1.0); --sage-dark-40: hsla(132, 27%, 28%, 1.0); --sage-dark-50: hsla(132, 27%, 23%, 1.0); --teal-3: hsla(172, 82%, 31%, 0.03); --teal-5: hsla(172, 82%, 31%, 0.05); --teal-10: hsla(172, 82%, 31%, 0.10); --teal-20: hsla(172, 82%, 31%, 0.20); --teal-30: hsla(172, 82%, 31%, 0.30); --teal-40: hsla(172, 82%, 31%, 0.40); --teal-50: hsla(172, 82%, 31%, 0.50); --teal-60: hsla(172, 82%, 31%, 0.60); --teal-70: hsla(172, 82%, 31%, 0.70); --teal-80: hsla(172, 82%, 31%, 0.80); --teal-90: hsla(172, 82%, 31%, 0.90); --teal: hsla(172, 82%, 31%, 1.0); --teal-dark-10: hsla(172, 82%, 26%, 1.0); --teal-dark-20: hsla(172, 82%, 21%, 1.0); --teal-dark-30: hsla(172, 82%, 16%, 1.0); --teal-dark-40: hsla(172, 82%, 11%, 1.0); --teal-dark-50: hsla(172, 82%, 6%, 1.0); --cyan-3: hsla(188, 78%, 41%, 0.03); --cyan-5: hsla(188, 78%, 41%, 0.05); --cyan-10: hsla(188, 78%, 41%, 0.10); --cyan-20: hsla(188, 78%, 41%, 0.20); --cyan-30: hsla(188, 78%, 41%, 0.30); --cyan-40: hsla(188, 78%, 41%, 0.40); --cyan-50: hsla(188, 78%, 41%, 0.50); --cyan-60: hsla(188, 78%, 41%, 0.60); --cyan-70: hsla(188, 78%, 41%, 0.70); --cyan-80: hsla(188, 78%, 41%, 0.80); --cyan-90: hsla(188, 78%, 41%, 0.90); --cyan: hsla(188, 78%, 41%, 1.0); --cyan-dark-10: hsla(188, 78%, 36%, 1.0); --cyan-dark-20: hsla(188, 78%, 31%, 1.0); --cyan-dark-30: hsla(188, 78%, 26%, 1.0); --cyan-dark-40: hsla(188, 78%, 21%, 1.0); --cyan-dark-50: hsla(188, 78%, 16%, 1.0); --blue-3: hsla(203, 94%, 40%, 0.03); --blue-5: hsla(203, 94%, 40%, 0.05); --blue-10: hsla(203, 94%, 40%, 0.10); --blue-20: hsla(203, 94%, 40%, 0.20); --blue-30: hsla(203, 94%, 40%, 0.30); --blue-40: hsla(203, 94%, 40%, 0.40); --blue-50: hsla(203, 94%, 40%, 0.50); --blue-60: hsla(203, 94%, 40%, 0.60); --blue-70: hsla(203, 94%, 40%, 0.70); --blue-80: hsla(203, 94%, 40%, 0.80); --blue-90: hsla(203, 94%, 40%, 0.90); --blue: hsla(203, 94%, 40%, 1.0); --blue-dark-10: hsla(203, 100%, 28%, 1.0); --blue-dark-20: hsla(203, 100%, 23%, 1.0); --blue-dark-30: hsla(203, 100%, 18%, 1.0); --blue-dark-40: hsla(203, 100%, 13%, 1.0); --blue-dark-50: hsla(203, 100%, 8%, 1.0); --navy-3: hsla(202, 76%, 19%, 0.03); --navy-5: hsla(202, 76%, 19%, 0.05); --navy-10: hsla(202, 76%, 19%, 0.10); --navy-20: hsla(202, 76%, 19%, 0.20); --navy-30: hsla(202, 76%, 19%, 0.30); --navy-40: hsla(202, 76%, 19%, 0.40); --navy-50: hsla(202, 76%, 19%, 0.50); --navy-60: hsla(202, 76%, 19%, 0.60); --navy-70: hsla(202, 76%, 19%, 0.70); --navy-80: hsla(202, 76%, 19%, 0.80); --navy-90: hsla(202, 76%, 19%, 0.90); --navy: hsla(202, 76%, 19%, 1.0); --navy-dark-10: hsla(202, 76%, 14%, 1.0); --navy-dark-20: hsla(202, 76%, 9%, 1.0); --navy-dark-30: hsla(202, 76%, 4%, 1.0); --navy-dark-40: hsla(202, 76%, 0%, 1.0); --navy-dark-50: hsla(202, 76%, 0%, 1.0); --slate-3: hsla(213, 29%, 56%, 0.03); --slate-5: hsla(213, 29%, 56%, 0.05); --slate-10: hsla(213, 29%, 56%, 0.10); --slate-20: hsla(213, 29%, 56%, 0.20); --slate-30: hsla(213, 29%, 56%, 0.30); --slate-40: hsla(213, 29%, 56%, 0.40); --slate-50: hsla(213, 29%, 56%, 0.50); --slate-60: hsla(213, 29%, 56%, 0.60); --slate-70: hsla(213, 29%, 56%, 0.70); --slate-80: hsla(213, 29%, 56%, 0.80); --slate-90: hsla(213, 29%, 56%, 0.90); --slate: hsla(213, 29%, 56%, 1.0); --slate-dark-10: hsla(213, 32%, 45%, 1.0); --slate-dark-20: hsla(213, 32%, 40%, 1.0); --slate-dark-30: hsla(213, 32%, 35%, 1.0); --slate-dark-40: hsla(213, 32%, 30%, 1.0); --slate-dark-50: hsla(213, 32%, 25%, 1.0); --indigo-3: hsla(256, 61%, 44%, 0.03); --indigo-5: hsla(256, 61%, 44%, 0.05); --indigo-10: hsla(256, 61%, 44%, 0.10); --indigo-20: hsla(256, 61%, 44%, 0.20); --indigo-30: hsla(256, 61%, 44%, 0.30); --indigo-40: hsla(256, 61%, 44%, 0.40); --indigo-50: hsla(256, 61%, 44%, 0.50); --indigo-60: hsla(256, 61%, 44%, 0.60); --indigo-70: hsla(256, 61%, 44%, 0.70); --indigo-80: hsla(256, 61%, 44%, 0.80); --indigo-90: hsla(256, 61%, 44%, 0.90); --indigo: hsla(256, 61%, 44%, 1.0); --indigo-dark-10: hsla(256, 75%, 35%, 1.0); --indigo-dark-20: hsla(256, 75%, 30%, 1.0); --indigo-dark-30: hsla(256, 75%, 25%, 1.0); --indigo-dark-40: hsla(256, 75%, 20%, 1.0); --indigo-dark-50: hsla(256, 75%, 15%, 1.0); --purple-3: hsla(286, 55%, 53%, 0.03); --purple-5: hsla(286, 55%, 53%, 0.05); --purple-10: hsla(286, 55%, 53%, 0.10); --purple-20: hsla(286, 55%, 53%, 0.20); --purple-30: hsla(286, 55%, 53%, 0.30); --purple-40: hsla(286, 55%, 53%, 0.40); --purple-50: hsla(286, 55%, 53%, 0.50); --purple-60: hsla(286, 55%, 53%, 0.60); --purple-70: hsla(286, 55%, 53%, 0.70); --purple-80: hsla(286, 55%, 53%, 0.80); --purple-90: hsla(286, 55%, 53%, 0.90); --purple: hsla(286, 55%, 53%, 1.0); --purple-dark-10: hsla(286, 61%, 43%, 1.0); --purple-dark-20: hsla(286, 61%, 38%, 1.0); --purple-dark-30: hsla(286, 61%, 33%, 1.0); --purple-dark-40: hsla(286, 61%, 28%, 1.0); --purple-dark-50: hsla(286, 61%, 23%, 1.0); --magenta-3: hsla(291, 64%, 42%, 0.03); --magenta-5: hsla(291, 64%, 42%, 0.05); --magenta-10: hsla(291, 64%, 42%, 0.10); --magenta-20: hsla(291, 64%, 42%, 0.20); --magenta-30: hsla(291, 64%, 42%, 0.30); --magenta-40: hsla(291, 64%, 42%, 0.40); --magenta-50: hsla(291, 64%, 42%, 0.50); --magenta-60: hsla(291, 64%, 42%, 0.60); --magenta-70: hsla(291, 64%, 42%, 0.70); --magenta-80: hsla(291, 64%, 42%, 0.80); --magenta-90: hsla(291, 64%, 42%, 0.90); --magenta: hsla(291, 64%, 42%, 1.0); --magenta-dark-10: hsla(291, 64%, 37%, 1.0); --magenta-dark-20: hsla(291, 64%, 32%, 1.0); --magenta-dark-30: hsla(291, 64%, 27%, 1.0); --magenta-dark-40: hsla(291, 64%, 22%, 1.0); --magenta-dark-50: hsla(291, 64%, 17%, 1.0); --brown-3: hsla(13, 17%, 55%, 0.03); --brown-5: hsla(13, 17%, 55%, 0.05); --brown-10: hsla(13, 17%, 55%, 0.10); --brown-20: hsla(13, 17%, 55%, 0.20); --brown-30: hsla(13, 17%, 55%, 0.30); --brown-40: hsla(13, 17%, 55%, 0.40); --brown-50: hsla(13, 17%, 55%, 0.50); --brown-60: hsla(13, 17%, 55%, 0.60); --brown-70: hsla(13, 17%, 55%, 0.70); --brown-80: hsla(13, 17%, 55%, 0.80); --brown-90: hsla(13, 17%, 55%, 0.90); --brown: hsla(13, 17%, 55%, 1.0); --brown-dark-10: hsla(14, 21%, 43%, 1.0); --brown-dark-20: hsla(14, 21%, 38%, 1.0); --brown-dark-30: hsla(14, 21%, 33%, 1.0); --brown-dark-40: hsla(14, 21%, 28%, 1.0); --brown-dark-50: hsla(14, 21%, 23%, 1.0); --gray-3: hsla(208, 7%, 46%, 0.03); --gray-5: hsla(208, 7%, 46%, 0.05); --gray-10: hsla(208, 7%, 46%, 0.10); --gray-20: hsla(208, 7%, 46%, 0.20); --gray-30: hsla(208, 7%, 46%, 0.30); --gray-40: hsla(208, 7%, 46%, 0.40); --gray-50: hsla(208, 7%, 46%, 0.50); --gray-60: hsla(208, 7%, 46%, 0.60); --gray-70: hsla(208, 7%, 46%, 0.70); --gray-80: hsla(208, 7%, 46%, 0.80); --gray-90: hsla(208, 7%, 46%, 0.90); --gray: hsla(208, 7%, 46%, 1.0); --gray-dark-10: hsla(208, 7%, 41%, 1.0); --gray-dark-20: hsla(208, 7%, 36%, 1.0); --gray-dark-30: hsla(208, 7%, 31%, 1.0); --gray-dark-40: hsla(208, 7%, 26%, 1.0); --gray-dark-50: hsla(208, 7%, 21%, 1.0); --gray-3-solid: hsla(0, 0%, 99%, 1.0); --gray-5-solid: hsla(0, 0%, 97%, 1.0); --gray-10-solid: hsla(0, 0%, 95%, 1.0); --gray-20-solid: hsla(0, 0%, 93%, 1.0); --gray-30-solid: hsla(0, 0%, 91%, 1.0); --gray-40-solid: hsla(0, 0%, 89%, 1.0); --gray-50-solid: hsla(0, 0%, 87%, 1.0); --gray-60-solid: hsla(0, 0%, 85%, 1.0); --gray-70-solid: hsla(0, 0%, 83%, 1.0); --gray-80-solid: hsla(0, 0%, 81%, 1.0); --gray-90-solid: hsla(0, 0%, 79%, 1.0); --white-3: hsla(0, 0%, 100%, 0.03); --white-5: hsla(0, 0%, 100%, 0.05); --white-10: hsla(0, 0%, 100%, 0.10); --white-20: hsla(0, 0%, 100%, 0.20); --white-30: hsla(0, 0%, 100%, 0.30); --white-40: hsla(0, 0%, 100%, 0.40); --white-50: hsla(0, 0%, 100%, 0.50); --white-60: hsla(0, 0%, 100%, 0.60); --white-70: hsla(0, 0%, 100%, 0.70); --white-80: hsla(0, 0%, 100%, 0.80); --white-90: hsla(0, 0%, 100%, 0.90); --white: hsla(0, 0%, 100%, 1.0); --black-3: hsla(0, 0%, 0%, 0.03); --black-5: hsla(0, 0%, 0%, 0.05); --black-10: hsla(0, 0%, 0%, 0.10); --black-20: hsla(0, 0%, 0%, 0.20); --black-30: hsla(0, 0%, 0%, 0.30); --black-40: hsla(0, 0%, 0%, 0.40); --black-50: hsla(0, 0%, 0%, 0.50); --black-60: hsla(0, 0%, 0%, 0.60); --black-70: hsla(0, 0%, 0%, 0.70); --black-80: hsla(0, 0%, 0%, 0.80); --black-90: hsla(0, 0%, 0%, 0.90); --black: hsla(0, 0%, 0%, 1.0); } /* OTHER COLORS | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --pink-3: hsla(0, 100%, 81%, 0.03); --pink-5: hsla(0, 100%, 81%, 0.05); --pink-10: hsla(0, 100%, 81%, 0.10); --pink-20: hsla(0, 100%, 81%, 0.20); --pink-30: hsla(0, 100%, 81%, 0.30); --pink-40: hsla(0, 100%, 81%, 0.40); --pink-50: hsla(0, 100%, 81%, 0.50); --pink-60: hsla(0, 100%, 81%, 0.60); --pink-70: hsla(0, 100%, 81%, 0.70); --pink-80: hsla(0, 100%, 81%, 0.80); --pink-90: hsla(0, 100%, 81%, 0.90); --pink: hsla(0, 100%, 81%, 1.0); --pink-dark-10: hsla(0, 66%, 87%, 1.0); --pink-dark-20: hsla(0, 66%, 93%, 1.0); --pink-dark-30: hsla(0, 66%, 97%, 1.0); --pink-dark-40: hsla(0, 66%, 100%, 1.0); --pink-dark-50: hsla(0, 66%, 100%, 1.0); --red-3: hsla(358, 84%, 63%, 0.03); --red-5: hsla(358, 84%, 63%, 0.05); --red-10: hsla(358, 84%, 63%, 0.10); --red-20: hsla(358, 84%, 63%, 0.20); --red-30: hsla(358, 84%, 63%, 0.30); --red-40: hsla(358, 84%, 63%, 0.40); --red-50: hsla(358, 84%, 63%, 0.50); --red-60: hsla(358, 84%, 63%, 0.60); --red-70: hsla(358, 84%, 63%, 0.70); --red-80: hsla(358, 84%, 63%, 0.80); --red-90: hsla(358, 84%, 63%, 0.90); --red: hsla(358, 84%, 63%, 1.0); --red-dark-10: hsla(358, 100%, 72%, 1.0); --red-dark-20: hsla(358, 100%, 77%, 1.0); --red-dark-30: hsla(358, 100%, 82%, 1.0); --red-dark-40: hsla(358, 100%, 87%, 1.0); --red-dark-50: hsla(358, 100%, 92%, 1.0); --orange-3: hsla(14, 84%, 63%, 0.03); --orange-5: hsla(14, 84%, 63%, 0.05); --orange-10: hsla(14, 84%, 63%, 0.10); --orange-20: hsla(14, 84%, 63%, 0.20); --orange-30: hsla(14, 84%, 63%, 0.30); --orange-40: hsla(14, 84%, 63%, 0.40); --orange-50: hsla(14, 84%, 63%, 0.50); --orange-60: hsla(14, 84%, 63%, 0.60); --orange-70: hsla(14, 84%, 63%, 0.70); --orange-80: hsla(14, 84%, 63%, 0.80); --orange-90: hsla(14, 84%, 63%, 0.90); --orange: hsla(14, 84%, 63%, 1.0); --orange-dark-10: hsla(14, 100%, 72%, 1.0); --orange-dark-20: hsla(14, 100%, 77%, 1.0); --orange-dark-30: hsla(14, 100%, 82%, 1.0); --orange-dark-40: hsla(14, 100%, 87%, 1.0); --orange-dark-50: hsla(14, 100%, 92%, 1.0); --yellow-3: hsla(47, 100%, 72%, 0.03); --yellow-5: hsla(47, 100%, 72%, 0.05); --yellow-10: hsla(47, 100%, 72%, 0.10); --yellow-20: hsla(47, 100%, 72%, 0.20); --yellow-30: hsla(47, 100%, 72%, 0.30); --yellow-40: hsla(47, 100%, 72%, 0.40); --yellow-50: hsla(47, 100%, 72%, 0.50); --yellow-60: hsla(47, 100%, 72%, 0.60); --yellow-70: hsla(47, 100%, 72%, 0.70); --yellow-80: hsla(47, 100%, 72%, 0.80); --yellow-90: hsla(47, 100%, 72%, 0.90); --yellow: hsla(47, 100%, 72%, 1.0); --yellow-dark-10: hsla(47, 100%, 82%, 1.0); --yellow-dark-20: hsla(47, 100%, 87%, 1.0); --yellow-dark-30: hsla(47, 100%, 92%, 1.0); --yellow-dark-40: hsla(47, 100%, 97%, 1.0); --yellow-dark-50: hsla(47, 100%, 100%, 1.0); --lime-3: hsla(69, 100%, 41%, 0.03); --lime-5: hsla(69, 100%, 41%, 0.05); --lime-10: hsla(69, 100%, 41%, 0.10); --lime-20: hsla(69, 100%, 41%, 0.20); --lime-30: hsla(69, 100%, 41%, 0.30); --lime-40: hsla(69, 100%, 41%, 0.40); --lime-50: hsla(69, 100%, 41%, 0.50); --lime-60: hsla(69, 100%, 41%, 0.60); --lime-70: hsla(69, 100%, 41%, 0.70); --lime-80: hsla(69, 100%, 41%, 0.80); --lime-90: hsla(69, 100%, 41%, 0.90); --lime: hsla(69, 100%, 41%, 1.0); --lime-dark-10: hsla(69, 100%, 60%, 1.0); --lime-dark-20: hsla(69, 100%, 65%, 1.0); --lime-dark-30: hsla(69, 100%, 70%, 1.0); --lime-dark-40: hsla(69, 100%, 75%, 1.0); --lime-dark-50: hsla(69, 100%, 80%, 1.0); --mint-3: hsla(117, 53%, 66%, 0.03); --mint-5: hsla(117, 53%, 66%, 0.05); --mint-10: hsla(117, 53%, 66%, 0.10); --mint-20: hsla(117, 53%, 66%, 0.20); --mint-30: hsla(117, 53%, 66%, 0.30); --mint-40: hsla(117, 53%, 66%, 0.40); --mint-50: hsla(117, 53%, 66%, 0.50); --mint-60: hsla(117, 53%, 66%, 0.60); --mint-70: hsla(117, 53%, 66%, 0.70); --mint-80: hsla(117, 53%, 66%, 0.80); --mint-90: hsla(117, 53%, 66%, 0.90); --mint: hsla(117, 53%, 66%, 1.0); --mint-dark-10: hsla(117, 72%, 79%, 1.0); --mint-dark-20: hsla(117, 72%, 84%, 1.0); --mint-dark-30: hsla(117, 72%, 89%, 1.0); --mint-dark-40: hsla(117, 72%, 94%, 1.0); --mint-dark-50: hsla(117, 72%, 99%, 1.0); --green-3: hsla(148, 85%, 38%, 0.03); --green-5: hsla(148, 85%, 38%, 0.05); --green-10: hsla(148, 85%, 38%, 0.10); --green-20: hsla(148, 85%, 38%, 0.20); --green-30: hsla(148, 85%, 38%, 0.30); --green-40: hsla(148, 85%, 38%, 0.40); --green-50: hsla(148, 85%, 38%, 0.50); --green-60: hsla(148, 85%, 38%, 0.60); --green-70: hsla(148, 85%, 38%, 0.70); --green-80: hsla(148, 85%, 38%, 0.80); --green-90: hsla(148, 85%, 38%, 0.90); --green: hsla(148, 85%, 38%, 1.0); --green-dark-10: hsla(157, 100%, 42%, 1.0); --green-dark-20: hsla(157, 100%, 47%, 1.0); --green-dark-30: hsla(157, 100%, 52%, 1.0); --green-dark-40: hsla(157, 100%, 57%, 1.0); --green-dark-50: hsla(157, 100%, 62%, 1.0); --sage-3: hsla(133, 22%, 54%, 0.03); --sage-5: hsla(133, 22%, 54%, 0.05); --sage-10: hsla(133, 22%, 54%, 0.10); --sage-20: hsla(133, 22%, 54%, 0.20); --sage-30: hsla(133, 22%, 54%, 0.30); --sage-40: hsla(133, 22%, 54%, 0.40); --sage-50: hsla(133, 22%, 54%, 0.50); --sage-60: hsla(133, 22%, 54%, 0.60); --sage-70: hsla(133, 22%, 54%, 0.70); --sage-80: hsla(133, 22%, 54%, 0.80); --sage-90: hsla(133, 22%, 54%, 0.90); --sage: hsla(133, 22%, 54%, 1.0); --sage-dark-10: hsla(133, 22%, 75%, 1.0); --sage-dark-20: hsla(133, 22%, 80%, 1.0); --sage-dark-30: hsla(133, 22%, 85%, 1.0); --sage-dark-40: hsla(133, 22%, 90%, 1.0); --sage-dark-50: hsla(133, 22%, 95%, 1.0); --teal-3: hsla(172, 82%, 31%, 0.03); --teal-5: hsla(172, 82%, 31%, 0.05); --teal-10: hsla(172, 82%, 31%, 0.10); --teal-20: hsla(172, 82%, 31%, 0.20); --teal-30: hsla(172, 82%, 31%, 0.30); --teal-40: hsla(172, 82%, 31%, 0.40); --teal-50: hsla(172, 82%, 31%, 0.50); --teal-60: hsla(172, 82%, 31%, 0.60); --teal-70: hsla(172, 82%, 31%, 0.70); --teal-80: hsla(172, 82%, 31%, 0.80); --teal-90: hsla(172, 82%, 31%, 0.90); --teal: hsla(172, 82%, 31%, 1.0); --teal-dark-10: hsla(172, 82%, 36%, 1.0); --teal-dark-20: hsla(172, 82%, 41%, 1.0); --teal-dark-30: hsla(172, 82%, 46%, 1.0); --teal-dark-40: hsla(172, 82%, 51%, 1.0); --teal-dark-50: hsla(172, 82%, 56%, 1.0); --cyan-3: hsla(188, 78%, 41%, 0.03); --cyan-5: hsla(188, 78%, 41%, 0.05); --cyan-10: hsla(188, 78%, 41%, 0.10); --cyan-20: hsla(188, 78%, 41%, 0.20); --cyan-30: hsla(188, 78%, 41%, 0.30); --cyan-40: hsla(188, 78%, 41%, 0.40); --cyan-50: hsla(188, 78%, 41%, 0.50); --cyan-60: hsla(188, 78%, 41%, 0.60); --cyan-70: hsla(188, 78%, 41%, 0.70); --cyan-80: hsla(188, 78%, 41%, 0.80); --cyan-90: hsla(188, 78%, 41%, 0.90); --cyan: hsla(188, 78%, 41%, 1.0); --cyan-dark-10: hsla(188, 78%, 46%, 1.0); --cyan-dark-20: hsla(188, 78%, 51%, 1.0); --cyan-dark-30: hsla(188, 78%, 56%, 1.0); --cyan-dark-40: hsla(188, 78%, 61%, 1.0); --cyan-dark-50: hsla(188, 78%, 66%, 1.0); --blue-3: hsla(216, 88%, 57%, 0.03); --blue-5: hsla(216, 88%, 57%, 0.05); --blue-10: hsla(216, 88%, 57%, 0.10); --blue-20: hsla(216, 88%, 57%, 0.20); --blue-30: hsla(216, 88%, 57%, 0.30); --blue-40: hsla(216, 88%, 57%, 0.40); --blue-50: hsla(216, 88%, 57%, 0.50); --blue-60: hsla(216, 88%, 57%, 0.60); --blue-70: hsla(216, 88%, 57%, 0.70); --blue-80: hsla(216, 88%, 57%, 0.80); --blue-90: hsla(216, 88%, 57%, 0.90); --blue: hsla(216, 88%, 57%, 1.0); --blue-dark-10: hsla(216, 89%, 65%, 1.0); --blue-dark-20: hsla(216, 88%, 77%, 1.0); --blue-dark-30: hsla(215, 83%, 84%, 1.0); --blue-dark-40: hsla(216, 89%, 89%, 1.0); --blue-dark-50: hsla(214, 89%, 96%, 1.0); --navy-3: hsla(202, 76%, 19%, 0.03); --navy-5: hsla(202, 76%, 19%, 0.05); --navy-10: hsla(202, 76%, 19%, 0.10); --navy-20: hsla(202, 76%, 19%, 0.20); --navy-30: hsla(202, 76%, 19%, 0.30); --navy-40: hsla(202, 76%, 19%, 0.40); --navy-50: hsla(202, 76%, 19%, 0.50); --navy-60: hsla(202, 76%, 19%, 0.60); --navy-70: hsla(202, 76%, 19%, 0.70); --navy-80: hsla(202, 76%, 19%, 0.80); --navy-90: hsla(202, 76%, 19%, 0.90); --navy: hsla(202, 76%, 19%, 1.0); --navy-dark-10: hsla(202, 76%, 24%, 1.0); --navy-dark-20: hsla(202, 76%, 29%, 1.0); --navy-dark-30: hsla(202, 76%, 34%, 1.0); --navy-dark-40: hsla(202, 76%, 39%, 1.0); --navy-dark-50: hsla(202, 76%, 44%, 1.0); --slate-3: hsla(213, 29%, 56%, 0.03); --slate-5: hsla(213, 29%, 56%, 0.05); --slate-10: hsla(213, 29%, 56%, 0.10); --slate-20: hsla(213, 29%, 56%, 0.20); --slate-30: hsla(213, 29%, 56%, 0.30); --slate-40: hsla(213, 29%, 56%, 0.40); --slate-50: hsla(213, 29%, 56%, 0.50); --slate-60: hsla(213, 29%, 56%, 0.60); --slate-70: hsla(213, 29%, 56%, 0.70); --slate-80: hsla(213, 29%, 56%, 0.80); --slate-90: hsla(213, 29%, 56%, 0.90); --slate: hsla(213, 29%, 56%, 1.0); --slate-dark-10: hsla(214, 46%, 75%, 1.0); --slate-dark-20: hsla(214, 46%, 80%, 1.0); --slate-dark-30: hsla(214, 46%, 85%, 1.0); --slate-dark-40: hsla(214, 46%, 90%, 1.0); --slate-dark-50: hsla(214, 46%, 95%, 1.0); --indigo-3: hsla(256, 61%, 44%, 0.03); --indigo-5: hsla(256, 61%, 44%, 0.05); --indigo-10: hsla(256, 61%, 44%, 0.10); --indigo-20: hsla(256, 61%, 44%, 0.20); --indigo-30: hsla(256, 61%, 44%, 0.30); --indigo-40: hsla(256, 61%, 44%, 0.40); --indigo-50: hsla(256, 61%, 44%, 0.50); --indigo-60: hsla(256, 61%, 44%, 0.60); --indigo-70: hsla(256, 61%, 44%, 0.70); --indigo-80: hsla(256, 61%, 44%, 0.80); --indigo-90: hsla(256, 61%, 44%, 0.90); --indigo: hsla(256, 61%, 44%, 1.0); --indigo-dark-10: hsla(256, 66%, 64%, 1.0); --indigo-dark-20: hsla(256, 66%, 69%, 1.0); --indigo-dark-30: hsla(256, 66%, 74%, 1.0); --indigo-dark-40: hsla(256, 66%, 79%, 1.0); --indigo-dark-50: hsla(256, 66%, 84%, 1.0); --purple-3: hsla(286, 55%, 53%, 0.03); --purple-5: hsla(286, 55%, 53%, 0.05); --purple-10: hsla(286, 55%, 53%, 0.10); --purple-20: hsla(286, 55%, 53%, 0.20); --purple-30: hsla(286, 55%, 53%, 0.30); --purple-40: hsla(286, 55%, 53%, 0.40); --purple-50: hsla(286, 55%, 53%, 0.50); --purple-60: hsla(286, 55%, 53%, 0.60); --purple-70: hsla(286, 55%, 53%, 0.70); --purple-80: hsla(286, 55%, 53%, 0.80); --purple-90: hsla(286, 55%, 53%, 0.90); --purple: hsla(286, 55%, 53%, 1.0); --purple-dark-10: hsla(286, 69%, 64%, 1.0); --purple-dark-20: hsla(286, 69%, 69%, 1.0); --purple-dark-30: hsla(286, 69%, 74%, 1.0); --purple-dark-40: hsla(286, 69%, 79%, 1.0); --purple-dark-50: hsla(286, 69%, 84%, 1.0); --magenta-3: hsla(291, 64%, 42%, 0.03); --magenta-5: hsla(291, 64%, 42%, 0.05); --magenta-10: hsla(291, 64%, 42%, 0.10); --magenta-20: hsla(291, 64%, 42%, 0.20); --magenta-30: hsla(291, 64%, 42%, 0.30); --magenta-40: hsla(291, 64%, 42%, 0.40); --magenta-50: hsla(291, 64%, 42%, 0.50); --magenta-60: hsla(291, 64%, 42%, 0.60); --magenta-70: hsla(291, 64%, 42%, 0.70); --magenta-80: hsla(291, 64%, 42%, 0.80); --magenta-90: hsla(291, 64%, 42%, 0.90); --magenta: hsla(291, 64%, 42%, 1.0); --magenta-dark-10: hsla(291, 64%, 47%, 1.0); --magenta-dark-20: hsla(291, 64%, 52%, 1.0); --magenta-dark-30: hsla(291, 64%, 57%, 1.0); --magenta-dark-40: hsla(291, 64%, 62%, 1.0); --magenta-dark-50: hsla(291, 64%, 67%, 1.0); --brown-3: hsla(13, 17%, 55%, 0.03); --brown-5: hsla(13, 17%, 55%, 0.05); --brown-10: hsla(13, 17%, 55%, 0.10); --brown-20: hsla(13, 17%, 55%, 0.20); --brown-30: hsla(13, 17%, 55%, 0.30); --brown-40: hsla(13, 17%, 55%, 0.40); --brown-50: hsla(13, 17%, 55%, 0.50); --brown-60: hsla(13, 17%, 55%, 0.60); --brown-70: hsla(13, 17%, 55%, 0.70); --brown-80: hsla(13, 17%, 55%, 0.80); --brown-90: hsla(13, 17%, 55%, 0.90); --brown: hsla(13, 17%, 55%, 1.0); --brown-dark-10: hsla(13, 37%, 76%, 1.0); --brown-dark-20: hsla(13, 37%, 81%, 1.0); --brown-dark-30: hsla(13, 37%, 86%, 1.0); --brown-dark-40: hsla(13, 37%, 91%, 1.0); --brown-dark-50: hsla(13, 37%, 96%, 1.0); --gray-3: hsla(208, 7%, 46%, 0.03); --gray-5: hsla(208, 7%, 46%, 0.05); --gray-10: hsla(208, 7%, 46%, 0.10); --gray-20: hsla(208, 7%, 46%, 0.20); --gray-30: hsla(208, 7%, 46%, 0.30); --gray-40: hsla(208, 7%, 46%, 0.40); --gray-50: hsla(208, 7%, 46%, 0.50); --gray-60: hsla(208, 7%, 46%, 0.60); --gray-70: hsla(208, 7%, 46%, 0.70); --gray-80: hsla(208, 7%, 46%, 0.80); --gray-90: hsla(208, 7%, 46%, 0.90); --gray: hsla(208, 7%, 46%, 1.0); --gray-dark-10: hsla(208, 7%, 51%, 1.0); --gray-dark-20: hsla(208, 7%, 56%, 1.0); --gray-dark-30: hsla(208, 7%, 61%, 1.0); --gray-dark-40: hsla(208, 7%, 66%, 1.0); --gray-dark-50: hsla(208, 7%, 71%, 1.0); --gray-3-solid: hsla(220, 20%, 11%, 1.0); --gray-5-solid: hsla(220, 20%, 13%, 1.0); --gray-10-solid: hsla(220, 20%, 15%, 1.0); --gray-20-solid: hsla(220, 20%, 17%, 1.0); --gray-30-solid: hsla(220, 20%, 19%, 1.0); --gray-40-solid: hsla(220, 20%, 21%, 1.0); --gray-50-solid: hsla(220, 20%, 23%, 1.0); --gray-60-solid: hsla(220, 20%, 25%, 1.0); --gray-70-solid: hsla(220, 20%, 27%, 1.0); --gray-80-solid: hsla(220, 20%, 29%, 1.0); --gray-90-solid: hsla(220, 20%, 31%, 1.0); --white-3: hsla(0, 0%, 100%, 0.03); --white-5: hsla(0, 0%, 100%, 0.05); --white-10: hsla(0, 0%, 100%, 0.10); --white-20: hsla(0, 0%, 100%, 0.20); --white-30: hsla(0, 0%, 100%, 0.30); --white-40: hsla(0, 0%, 100%, 0.40); --white-50: hsla(0, 0%, 100%, 0.50); --white-60: hsla(0, 0%, 100%, 0.60); --white-70: hsla(0, 0%, 100%, 0.70); --white-80: hsla(0, 0%, 100%, 0.80); --white-90: hsla(0, 0%, 100%, 0.90); --white: hsla(0, 0%, 100%, 1.0); --black-3: hsla(0, 0%, 0%, 0.03); --black-5: hsla(0, 0%, 0%, 0.05); --black-10: hsla(0, 0%, 0%, 0.10); --black-20: hsla(0, 0%, 0%, 0.20); --black-30: hsla(0, 0%, 0%, 0.30); --black-40: hsla(0, 0%, 0%, 0.40); --black-50: hsla(0, 0%, 0%, 0.50); --black-60: hsla(0, 0%, 0%, 0.60); --black-70: hsla(0, 0%, 0%, 0.70); --black-80: hsla(0, 0%, 0%, 0.80); --black-90: hsla(0, 0%, 0%, 0.90); --black: hsla(0, 0%, 0%, 1.0); } /* SCSS Document */ /* THEME COLORS | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --primary-3: hsla(0, 0%, 20%, 0.03); --primary-5: hsla(0, 0%, 20%, 0.05); --primary-10: hsla(0, 0%, 20%, 0.10); --primary-20: hsla(0, 0%, 20%, 0.20); --primary-30: hsla(0, 0%, 20%, 0.30); --primary-40: hsla(0, 0%, 20%, 0.40); --primary-50: hsla(0, 0%, 20%, 0.50); --primary-60: hsla(0, 0%, 20%, 0.60); --primary-70: hsla(0, 0%, 20%, 0.70); --primary-80: hsla(0, 0%, 20%, 0.80); --primary-90: hsla(0, 0%, 20%, 0.90); --primary: hsla(0, 0%, 20%, 1.0); --primary-dark-10: hsla(0, 0%, 15%, 1.0); --primary-dark-20: hsla(0, 0%, 10%, 1.0); --primary-dark-30: hsla(0, 0%, 5%, 1.0); --primary-dark-40: hsla(0, 0%, 0%, 1.0); --primary-dark-50: hsla(0, 0%, 0%, 1.0); --secondary-3: hsla(0, 0%, 40%, 0.03); --secondary-5: hsla(0, 0%, 40%, 0.05); --secondary-10: hsla(0, 0%, 40%, 0.10); --secondary-20: hsla(0, 0%, 40%, 0.20); --secondary-30: hsla(0, 0%, 40%, 0.30); --secondary-40: hsla(0, 0%, 40%, 0.40); --secondary-50: hsla(0, 0%, 40%, 0.50); --secondary-60: hsla(0, 0%, 40%, 0.60); --secondary-70: hsla(0, 0%, 40%, 0.70); --secondary-80: hsla(0, 0%, 40%, 0.80); --secondary-90: hsla(0, 0%, 40%, 0.90); --secondary: hsla(0, 0%, 40%, 1.0); --secondary-dark-10: hsla(0, 0%, 35%, 1.0); --secondary-dark-20: hsla(0, 0%, 30%, 1.0); --secondary-dark-30: hsla(0, 0%, 25%, 1.0); --secondary-dark-40: hsla(0, 0%, 20%, 1.0); --secondary-dark-50: hsla(0, 0%, 15%, 1.0); --tertiary-3: hsla(0, 0%, 60%, 0.03); --tertiary-5: hsla(0, 0%, 60%, 0.05); --tertiary-10: hsla(0, 0%, 60%, 0.10); --tertiary-20: hsla(0, 0%, 60%, 0.20); --tertiary-30: hsla(0, 0%, 60%, 0.30); --tertiary-40: hsla(0, 0%, 60%, 0.40); --tertiary-50: hsla(0, 0%, 60%, 0.50); --tertiary-60: hsla(0, 0%, 60%, 0.60); --tertiary-70: hsla(0, 0%, 60%, 0.70); --tertiary-80: hsla(0, 0%, 60%, 0.80); --tertiary-90: hsla(0, 0%, 60%, 0.90); --tertiary: hsla(0, 0%, 60%, 1.0); --tertiary-dark-10: hsla(0, 0%, 55%, 1.0); --tertiary-dark-20: hsla(0, 0%, 50%, 1.0); --tertiary-dark-30: hsla(0, 0%, 45%, 1.0); --tertiary-dark-40: hsla(0, 0%, 40%, 1.0); --tertiary-dark-50: hsla(0, 0%, 35%, 1.0); --info-3: hsla(216, 83%, 41%, 0.03); --info-5: hsla(216, 83%, 41%, 0.05); --info-10: hsla(216, 83%, 41%, 0.10); --info-20: hsla(216, 83%, 41%, 0.20); --info-30: hsla(216, 83%, 41%, 0.30); --info-40: hsla(216, 83%, 41%, 0.40); --info-50: hsla(216, 83%, 41%, 0.50); --info-60: hsla(216, 83%, 41%, 0.60); --info-70: hsla(216, 83%, 41%, 0.70); --info-80: hsla(216, 83%, 41%, 0.80); --info-90: hsla(216, 83%, 41%, 0.90); --info: hsla(216, 83%, 41%, 1.0); --info-dark-10: hsla(215, 89%, 32%, 1.0); --info-dark-20: hsla(214, 75%, 25%, 1.0); --info-dark-30: hsla(214, 69%, 22%, 1.0); --info-dark-40: hsla(214, 63%, 19%, 1.0); --info-dark-50: hsla(216, 51%, 16%, 1.0); --success-3: hsla(148, 96%, 27%, 0.03); --success-5: hsla(148, 96%, 27%, 0.05); --success-10: hsla(148, 96%, 27%, 0.10); --success-20: hsla(148, 96%, 27%, 0.20); --success-30: hsla(148, 96%, 27%, 0.30); --success-40: hsla(148, 96%, 27%, 0.40); --success-50: hsla(148, 96%, 27%, 0.50); --success-60: hsla(148, 96%, 27%, 0.60); --success-70: hsla(148, 96%, 27%, 0.70); --success-80: hsla(148, 96%, 27%, 0.80); --success-90: hsla(148, 96%, 27%, 0.90); --success: hsla(148, 96%, 27%, 1.0); --success-dark-10: hsla(143, 93%, 22%, 1.0); --success-dark-20: hsla(145, 82%, 18%, 1.0); --success-dark-30: hsla(145, 86%, 14%, 1.0); --success-dark-40: hsla(145, 85%, 10%, 1.0); --success-dark-50: hsla(144, 90%, 8%, 1.0); --warning-3: hsla(42, 100%, 50%, 0.03); --warning-5: hsla(42, 100%, 50%, 0.05); --warning-10: hsla(42, 100%, 50%, 0.10); --warning-20: hsla(42, 100%, 50%, 0.20); --warning-30: hsla(42, 100%, 50%, 0.30); --warning-40: hsla(42, 100%, 50%, 0.40); --warning-50: hsla(42, 100%, 50%, 0.50); --warning-60: hsla(42, 100%, 50%, 0.60); --warning-70: hsla(42, 100%, 50%, 0.70); --warning-80: hsla(42, 100%, 50%, 0.80); --warning-90: hsla(42, 100%, 50%, 0.90); --warning: hsla(42, 100%, 50%, 1.0); --warning-dark-10: hsla(37, 96%, 43%, 1.0); --warning-dark-20: hsla(33, 69%, 38%, 1.0); --warning-dark-30: hsla(33, 71%, 30%, 1.0); --warning-dark-40: hsla(33, 73%, 22%, 1.0); --warning-dark-50: hsla(34, 79%, 17%, 1.0); --danger-3: hsla(355, 85%, 46%, 0.03); --danger-5: hsla(355, 85%, 46%, 0.05); --danger-10: hsla(355, 85%, 46%, 0.10); --danger-20: hsla(355, 85%, 46%, 0.20); --danger-30: hsla(355, 85%, 46%, 0.30); --danger-40: hsla(355, 85%, 46%, 0.40); --danger-50: hsla(355, 85%, 46%, 0.50); --danger-60: hsla(355, 85%, 46%, 0.60); --danger-70: hsla(355, 85%, 46%, 0.70); --danger-80: hsla(355, 85%, 46%, 0.80); --danger-90: hsla(355, 85%, 46%, 0.90); --danger: hsla(355, 85%, 46%, 1.0); --danger-dark-10: hsla(355, 93%, 37%, 1.0); --danger-dark-20: hsla(357, 81%, 29%, 1.0); --danger-dark-30: hsla(356, 83%, 23%, 1.0); --danger-dark-40: hsla(356, 86%, 17%, 1.0); --danger-dark-50: hsla(356, 88%, 13%, 1.0); --default-3: hsla(0, 0%, 99%, 0.03); --default-5: hsla(0, 0%, 99%, 0.05); --default-10: hsla(0, 0%, 99%, 0.10); --default-20: hsla(0, 0%, 99%, 0.20); --default-30: hsla(0, 0%, 99%, 0.30); --default-40: hsla(0, 0%, 99%, 0.40); --default-50: hsla(0, 0%, 99%, 0.50); --default-60: hsla(0, 0%, 99%, 0.60); --default-70: hsla(0, 0%, 99%, 0.70); --default-80: hsla(0, 0%, 99%, 0.80); --default-90: hsla(0, 0%, 99%, 0.90); --default: hsla(0, 0%, 99%, 1.0); --default-dark-10: hsla(0, 0%, 97%, 1.0); --default-dark-20: hsla(0, 0%, 95%, 1.0); --default-dark-30: hsla(0, 0%, 93%, 1.0); --default-dark-40: hsla(0, 0%, 91%, 1.0); --default-dark-50: hsla(0, 0%, 89%, 1.0); --neutral-0: hsla(0, 0%, 100%, 1.0); --neutral-3: hsla(0, 0%, 97%, 1.0); --neutral-5: hsla(0, 0%, 95%, 1.0); --neutral-10: hsla(180, 3%, 93%, 1.0); --neutral-20: hsla(240, 1%, 86%, 1.0); --neutral-30: hsla(220, 1%, 76%, 1.0); --neutral-40: hsla(210, 2%, 64%, 1.0); --neutral-50: hsla(210, 2%, 58%, 1.0); --neutral-60: hsla(216, 2%, 46%, 1.0); --neutral-70: hsla(215, 3%, 36%, 1.0); --neutral-80: hsla(214, 5%, 28%, 1.0); --neutral-90: hsla(218, 11%, 16%, 1.0); --neutral: hsla(220, 17%, 10%, 1.0); --neutral-dark-10: hsla(0, 0%, 5%, 1.0); --neutral-dark-20: hsla(0, 0%, 0%, 1.0); --neutral-dark-30: hsla(0, 0%, 0%, 1.0); --neutral-dark-40: hsla(0, 0%, 0%, 1.0); --neutral-dark-50: hsla(0, 0%, 0%, 1.0); --dark-3: hsla(0, 0%, 0%, 0.03); --dark-5: hsla(0, 0%, 0%, 0.05); --dark-10: hsla(0, 0%, 0%, 0.10); --dark-20: hsla(0, 0%, 0%, 0.20); --dark-30: hsla(0, 0%, 0%, 0.30); --dark-40: hsla(0, 0%, 0%, 0.40); --dark-50: hsla(0, 0%, 0%, 0.50); --dark-60: hsla(0, 0%, 0%, 0.60); --dark-70: hsla(0, 0%, 0%, 0.70); --dark-80: hsla(0, 0%, 0%, 0.80); --dark-90: hsla(0, 0%, 0%, 0.90); --dark: hsla(0, 0%, 0%, 1.0); --light-3: hsla(0, 0%, 100%, 0.03); --light-5: hsla(0, 0%, 100%, 0.05); --light-10: hsla(0, 0%, 100%, 0.10); --light-20: hsla(0, 0%, 100%, 0.20); --light-30: hsla(0, 0%, 100%, 0.30); --light-40: hsla(0, 0%, 100%, 0.40); --light-50: hsla(0, 0%, 100%, 0.50); --light-60: hsla(0, 0%, 100%, 0.60); --light-70: hsla(0, 0%, 100%, 0.70); --light-80: hsla(0, 0%, 100%, 0.80); --light-90: hsla(0, 0%, 100%, 0.90); --light: hsla(0, 0%, 100%, 1.0); /* TEMPLATE */ --bg-body: hsla(0, 0%, 100%, 1.0); --bg-body-dark: hsla(0, 0%, 0%, 1.0); --bg-body-light: hsla(0, 0%, 100%, 1.0); --shadow-color: hsla(0, 0%, 0%, 0.20); --box-shadow: 0px 1px 2px hsla(0, 0%, 0%, 0.20); --overlay-color: hsla(0, 0%, 0%, 0.50); } /* THEME COLORS | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --primary-3: hsla(0, 0%, 80%, 0.03); --primary-5: hsla(0, 0%, 80%, 0.05); --primary-10: hsla(0, 0%, 80%, 0.10); --primary-20: hsla(0, 0%, 80%, 0.20); --primary-30: hsla(0, 0%, 80%, 0.30); --primary-40: hsla(0, 0%, 80%, 0.40); --primary-50: hsla(0, 0%, 80%, 0.50); --primary-60: hsla(0, 0%, 80%, 0.60); --primary-70: hsla(0, 0%, 80%, 0.70); --primary-80: hsla(0, 0%, 80%, 0.80); --primary-90: hsla(0, 0%, 80%, 0.90); --primary: hsla(0, 0%, 80%, 1.0); --primary-dark-10: hsla(0, 0%, 85%, 1.0); --primary-dark-20: hsla(0, 0%, 90%, 1.0); --primary-dark-30: hsla(0, 0%, 95%, 1.0); --primary-dark-40: hsla(0, 0%, 100%, 1.0); --primary-dark-50: hsla(0, 0%, 100%, 1.0); --secondary-3: hsla(0, 0%, 75%, 0.03); --secondary-5: hsla(0, 0%, 75%, 0.05); --secondary-10: hsla(0, 0%, 75%, 0.10); --secondary-20: hsla(0, 0%, 75%, 0.20); --secondary-30: hsla(0, 0%, 75%, 0.30); --secondary-40: hsla(0, 0%, 75%, 0.40); --secondary-50: hsla(0, 0%, 75%, 0.50); --secondary-60: hsla(0, 0%, 75%, 0.60); --secondary-70: hsla(0, 0%, 75%, 0.70); --secondary-80: hsla(0, 0%, 75%, 0.80); --secondary-90: hsla(0, 0%, 75%, 0.90); --secondary: hsla(0, 0%, 75%, 1.0); --secondary-dark-10: hsla(0, 0%, 77%, 1.0); --secondary-dark-20: hsla(0, 0%, 79%, 1.0); --secondary-dark-30: hsla(0, 0%, 81%, 1.0); --secondary-dark-40: hsla(0, 0%, 83%, 1.0); --secondary-dark-50: hsla(0, 0%, 85%, 1.0); --tertiary-3: hsla(240, 10%, 23%, 0.03); --tertiary-5: hsla(240, 10%, 23%, 0.05); --tertiary-10: hsla(240, 10%, 23%, 0.10); --tertiary-20: hsla(240, 10%, 23%, 0.20); --tertiary-30: hsla(240, 10%, 23%, 0.30); --tertiary-40: hsla(240, 10%, 23%, 0.40); --tertiary-50: hsla(240, 10%, 23%, 0.50); --tertiary-60: hsla(240, 10%, 23%, 0.60); --tertiary-70: hsla(240, 10%, 23%, 0.70); --tertiary-80: hsla(240, 10%, 23%, 0.80); --tertiary-90: hsla(240, 10%, 23%, 0.90); --tertiary: hsla(240, 10%, 23%, 1.0); --tertiary-dark-10: hsla(240, 10%, 21%, 1.0); --tertiary-dark-20: hsla(240, 10%, 19%, 1.0); --tertiary-dark-30: hsla(240, 10%, 17%, 1.0); --tertiary-dark-40: hsla(240, 10%, 15%, 1.0); --tertiary-dark-50: hsla(240, 10%, 13%, 1.0); --info-3: hsla(216, 88%, 57%, 0.03); --info-5: hsla(216, 88%, 57%, 0.05); --info-10: hsla(216, 88%, 57%, 0.10); --info-20: hsla(216, 88%, 57%, 0.20); --info-30: hsla(216, 88%, 57%, 0.30); --info-40: hsla(216, 88%, 57%, 0.40); --info-50: hsla(216, 88%, 57%, 0.50); --info-60: hsla(216, 88%, 57%, 0.60); --info-70: hsla(216, 88%, 57%, 0.70); --info-80: hsla(216, 88%, 57%, 0.80); --info-90: hsla(216, 88%, 57%, 0.90); --info: hsla(216, 88%, 57%, 1.0); --info-dark-10: hsla(216, 89%, 65%, 1.0); --info-dark-20: hsla(216, 88%, 77%, 1.0); --info-dark-30: hsla(215, 83%, 84%, 1.0); --info-dark-40: hsla(216, 89%, 89%, 1.0); --info-dark-50: hsla(214, 89%, 96%, 1.0); --success-3: hsla(148, 85%, 38%, 0.03); --success-5: hsla(148, 85%, 38%, 0.05); --success-10: hsla(148, 85%, 38%, 0.10); --success-20: hsla(148, 85%, 38%, 0.20); --success-30: hsla(148, 85%, 38%, 0.30); --success-40: hsla(148, 85%, 38%, 0.40); --success-50: hsla(148, 85%, 38%, 0.50); --success-60: hsla(148, 85%, 38%, 0.60); --success-70: hsla(148, 85%, 38%, 0.70); --success-80: hsla(148, 85%, 38%, 0.80); --success-90: hsla(148, 85%, 38%, 0.90); --success: hsla(148, 85%, 38%, 1.0); --success-dark-10: hsla(148, 75%, 52%, 1.0); --success-dark-20: hsla(148, 75%, 67%, 1.0); --success-dark-30: hsla(148, 75%, 78%, 1.0); --success-dark-40: hsla(148, 74%, 85%, 1.0); --success-dark-50: hsla(148, 76%, 95%, 1.0); --warning-3: hsla(42, 100%, 50%, 0.03); --warning-5: hsla(42, 100%, 50%, 0.05); --warning-10: hsla(42, 100%, 50%, 0.10); --warning-20: hsla(42, 100%, 50%, 0.20); --warning-30: hsla(42, 100%, 50%, 0.30); --warning-40: hsla(42, 100%, 50%, 0.40); --warning-50: hsla(42, 100%, 50%, 0.50); --warning-60: hsla(42, 100%, 50%, 0.60); --warning-70: hsla(42, 100%, 50%, 0.70); --warning-80: hsla(42, 100%, 50%, 0.80); --warning-90: hsla(42, 100%, 50%, 0.90); --warning: hsla(42, 100%, 50%, 1.0); --warning-dark-10: hsla(42, 100%, 70%, 1.0); --warning-dark-20: hsla(42, 100%, 80%, 1.0); --warning-dark-30: hsla(42, 100%, 86%, 1.0); --warning-dark-40: hsla(42, 100%, 91%, 1.0); --warning-dark-50: hsla(40, 100%, 97%, 1.0); --danger-3: hsla(355, 100%, 60%, 0.03); --danger-5: hsla(355, 100%, 60%, 0.05); --danger-10: hsla(355, 100%, 60%, 0.10); --danger-20: hsla(355, 100%, 60%, 0.20); --danger-30: hsla(355, 100%, 60%, 0.30); --danger-40: hsla(355, 100%, 60%, 0.40); --danger-50: hsla(355, 100%, 60%, 0.50); --danger-60: hsla(355, 100%, 60%, 0.60); --danger-70: hsla(355, 100%, 60%, 0.70); --danger-80: hsla(355, 100%, 60%, 0.80); --danger-90: hsla(355, 100%, 60%, 0.90); --danger: hsla(355, 100%, 60%, 1.0); --danger-dark-10: hsla(355, 100%, 67%, 1.0); --danger-dark-20: hsla(355, 100%, 78%, 1.0); --danger-dark-30: hsla(355, 100%, 85%, 1.0); --danger-dark-40: hsla(355, 100%, 90%, 1.0); --danger-dark-50: hsla(353, 100%, 97%, 1.0); --default-3: hsla(0, 0%, 1%, 0.03); --default-5: hsla(0, 0%, 1%, 0.05); --default-10: hsla(0, 0%, 1%, 0.10); --default-20: hsla(0, 0%, 1%, 0.20); --default-30: hsla(0, 0%, 1%, 0.30); --default-40: hsla(0, 0%, 1%, 0.40); --default-50: hsla(0, 0%, 1%, 0.50); --default-60: hsla(0, 0%, 1%, 0.60); --default-70: hsla(0, 0%, 1%, 0.70); --default-80: hsla(0, 0%, 1%, 0.80); --default-90: hsla(0, 0%, 1%, 0.90); --default: hsla(0, 0%, 1%, 1.0); --default-dark-10: hsla(0, 0%, 3%, 1.0); --default-dark-20: hsla(0, 0%, 5%, 1.0); --default-dark-30: hsla(0, 0%, 7%, 1.0); --default-dark-40: hsla(0, 0%, 9%, 1.0); --default-dark-50: hsla(0, 0%, 11%, 1.0); --neutral-0: hsla(220, 17%, 10%, 1.0); --neutral-3: hsla(220, 13%, 13%, 1.0); --neutral-5: hsla(217, 11%, 15%, 1.0); --neutral-10: hsla(225, 8%, 20%, 1.0); --neutral-20: hsla(223, 5%, 28%, 1.0); --neutral-30: hsla(220, 5%, 36%, 1.0); --neutral-40: hsla(220, 3%, 46%, 1.0); --neutral-50: hsla(220, 2%, 56%, 1.0); --neutral-60: hsla(220, 2%, 64%, 1.0); --neutral-70: hsla(215, 2%, 74%, 1.0); --neutral-80: hsla(210, 2%, 82%, 1.0); --neutral-90: hsla(210, 0%, 94%, 1.0); --neutral: hsla(0, 0%, 100%, 1.0); --neutral-dark-10: hsla(0, 0%, 100%, 1.0); --neutral-dark-20: hsla(0, 0%, 100%, 1.0); --neutral-dark-30: hsla(0, 0%, 100%, 1.0); --neutral-dark-40: hsla(0, 0%, 100%, 1.0); --neutral-dark-50: hsla(0, 0%, 100%, 1.0); --dark-3: hsla(0, 0%, 100%, 0.03); --dark-5: hsla(0, 0%, 100%, 0.05); --dark-10: hsla(0, 0%, 100%, 0.10); --dark-20: hsla(0, 0%, 100%, 0.20); --dark-30: hsla(0, 0%, 100%, 0.30); --dark-40: hsla(0, 0%, 100%, 0.40); --dark-50: hsla(0, 0%, 100%, 0.50); --dark-60: hsla(0, 0%, 100%, 0.60); --dark-70: hsla(0, 0%, 100%, 0.70); --dark-80: hsla(0, 0%, 100%, 0.80); --dark-90: hsla(0, 0%, 100%, 0.90); --dark: hsla(0, 0%, 100%, 1.0); --light-3: hsla(0, 0%, 0%, 0.03); --light-5: hsla(0, 0%, 0%, 0.05); --light-10: hsla(0, 0%, 0%, 0.10); --light-20: hsla(0, 0%, 0%, 0.20); --light-30: hsla(0, 0%, 0%, 0.30); --light-40: hsla(0, 0%, 0%, 0.40); --light-50: hsla(0, 0%, 0%, 0.50); --light-60: hsla(0, 0%, 0%, 0.60); --light-70: hsla(0, 0%, 0%, 0.70); --light-80: hsla(0, 0%, 0%, 0.80); --light-90: hsla(0, 0%, 0%, 0.90); --light: hsla(0, 0%, 0%, 1.0); /* TEMPLATE */ --bg-body: hsla(240, 17%, 10%, 1.0); --bg-body-dark: hsla(240, 17%, 10%, 1.0); --bg-body-light: hsla(221, 22%, 17%, 1.0); --shadow-color: hsla(0, 0%, 0%, 0.90); --box-shadow: 0px 1px 2px hsla(0, 0%, 0%, 0.90); --overlay-color: hsla(0, 0%, 0%, 0.90); } /* SCSS Document */ /* TYPOGRAPHY | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --fw-100: 100; --fw-200: 200; --fw-300: 300; --fw-400: 400; --fw-500: 500; --fw-600: 600; --fw-700: 700; --fw-800: 800; --fw-900: 900; --fs-1: 2.5rem; --fs-2: 2.25rem; --fs-3: 2.0rem; --fs-4: 1.75rem; --fs-5: 1.5rem; --fs-6: 1.25rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 2.75rem; --lh-2: 2.625rem; --lh-3: 2.5rem; --lh-4: 2.25rem; --lh-5: 2.25rem; --lh-6: 1.75rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Proxima Nova", Arial, Verdana, sans-serif; --font-color: hsla(0, 0%, 27%, 1.0); --font-color-dark: hsla(0, 0%, 0%, 1.0); --font-color-light: hsla(0, 0%, 40%, 1.0); --h1-font-style: normal; --h1-font-weight: 600; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 2.75rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h1-color: hsla(0, 0%, 0%, 1.0); --h2-font-style: normal; --h2-font-weight: 600; --h2-font-size: 2.25rem; --h2-font-size-mobile: 2.0rem; --h2-line-height: 2.625rem; --h2-line-height-mobile: 2.5rem; --h2-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h2-color: hsla(0, 0%, 0%, 1.0); --h3-font-style: normal; --h3-font-weight: 600; --h3-font-size: 2.0rem; --h3-font-size-mobile: 1.75rem; --h3-line-height: 2.5rem; --h3-line-height-mobile: 2.25rem; --h3-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h3-color: hsla(0, 0%, 0%, 1.0); --h4-font-style: normal; --h4-font-weight: 600; --h4-font-size: 1.75rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 2.25rem; --h4-line-height-mobile: 2.0rem; --h4-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h4-color: hsla(0, 0%, 0%, 1.0); --h5-font-style: normal; --h5-font-weight: 600; --h5-font-size: 1.5rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 2.0rem; --h5-line-height-mobile: 1.75rem; --h5-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h5-color: hsla(0, 0%, 0%, 1.0); --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.25rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.75rem; --h6-line-height-mobile: 1.375rem; --h6-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h6-color: hsla(0, 0%, 0%, 1.0); --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --p-color: hsla(0, 0%, 27%, 1.0); --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --li-color: hsla(0, 0%, 27%, 1.0); } /* TYPOGRAPHY | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --font-color: hsla(0, 0%, 85%, 1.0); --font-color-dark: hsla(0, 0%, 100%, 1.0); --font-color-light: hsla(0, 0%, 70%, 1.0); --h1-color: hsla(0, 0%, 100%, 1.0); --h2-color: hsla(0, 0%, 100%, 1.0); --h3-color: hsla(0, 0%, 100%, 1.0); --h4-color: hsla(0, 0%, 100%, 1.0); --h5-color: hsla(0, 0%, 100%, 1.0); --h6-color: hsla(0, 0%, 100%, 1.0); --p-color: hsla(0, 0%, 85%, 1.0); --li-color: hsla(0, 0%, 85%, 1.0); } /* SCSS Document */ /* ALERTS | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --alert-pt: 12px; --alert-pe: 20px; --alert-pb: 12px; --alert-ps: 20px; --alert-primary-color: hsla(0, 0%, 27%, 1.0); --alert-primary-bg-color: hsla(216, 83%, 41%, 0.10); --alert-primary-border-color: hsla(216, 83%, 41%, 0); --alert-primary-border-top-color: hsla(216, 83%, 41%, 0); --alert-primary-border-right-color: hsla(216, 83%, 41%, 0); --alert-primary-border-bottom-color: hsla(216, 83%, 41%, 0); --alert-primary-border-left-color: hsla(216, 83%, 41%, 0); --alert-primary-border-size: 1px; --alert-primary-border-top-size: 1px; --alert-primary-border-right-size: 1px; --alert-primary-border-bottom-size: 1px; --alert-primary-border-left-size: 1px; --alert-secondary-color: hsla(0, 0%, 27%, 1.0); --alert-secondary-bg-color: hsla(0, 0%, 95%, 1.0); --alert-secondary-border-color: hsla(0, 0%, 95%, 0); --alert-secondary-border-top-color: hsla(0, 0%, 95%, 0); --alert-secondary-border-right-color: hsla(0, 0%, 95%, 0); --alert-secondary-border-bottom-color: hsla(0, 0%, 95%, 0); --alert-secondary-border-left-color: hsla(0, 0%, 95%, 0); --alert-secondary-border-size: 1px; --alert-secondary-border-top-size: 1px; --alert-secondary-border-right-size: 1px; --alert-secondary-border-bottom-size: 1px; --alert-secondary-border-left-size: 1px; --alert-info-color: hsla(0, 0%, 27%, 1.0); --alert-info-bg-color: hsla(204, 73%, 64%, 0.10); --alert-info-border-color: hsla(204, 73%, 64%, 0); --alert-info-border-top-color: hsla(204, 73%, 64%, 0); --alert-info-border-right-color: hsla(204, 73%, 64%, 0); --alert-info-border-bottom-color: hsla(204, 73%, 64%, 0); --alert-info-border-left-color: hsla(204, 73%, 64%, 0); --alert-info-border-size: 1px; --alert-info-border-top-size: 1px; --alert-info-border-right-size: 1px; --alert-info-border-bottom-size: 1px; --alert-info-border-left-size: 1px; --alert-success-color: hsla(0, 0%, 27%, 1.0); --alert-success-bg-color: hsla(148, 100%, 30%, 0.10); --alert-success-border-color: hsla(148, 100%, 30%, 0); --alert-success-border-top-color: hsla(148, 100%, 30%, 0); --alert-success-border-right-color: hsla(148, 100%, 30%, 0); --alert-success-border-bottom-color: hsla(148, 100%, 30%, 0); --alert-success-border-left-color: hsla(148, 100%, 30%, 0); --alert-success-border-size: 1px; --alert-success-border-top-size: 1px; --alert-success-border-right-size: 1px; --alert-success-border-bottom-size: 1px; --alert-success-border-left-size: 1px; --alert-warning-color: hsla(0, 0%, 27%, 1.0); --alert-warning-bg-color: hsla(42, 100%, 48%, 0.10); --alert-warning-border-color: hsla(42, 100%, 48%, 0); --alert-warning-border-top-color: hsla(42, 100%, 48%, 0); --alert-warning-border-right-color: hsla(42, 100%, 48%, 0); --alert-warning-border-bottom-color: hsla(42, 100%, 48%, 0); --alert-warning-border-left-color: hsla(42, 100%, 48%, 0); --alert-warning-border-size: 1px; --alert-warning-border-top-size: 1px; --alert-warning-border-right-size: 1px; --alert-warning-border-bottom-size: 1px; --alert-warning-border-left-size: 1px; --alert-danger-color: hsla(0, 0%, 27%, 1.0); --alert-danger-bg-color: hsla(355, 80%, 52%, 0.10); --alert-danger-border-color: hsla(355, 80%, 52%, 0); --alert-danger-border-top-color: hsla(355, 80%, 52%, 0); --alert-danger-border-right-color: hsla(355, 80%, 52%, 0); --alert-danger-border-bottom-color: hsla(355, 80%, 52%, 0); --alert-danger-border-left-color: hsla(355, 80%, 52%, 0); --alert-danger-border-size: 1px; --alert-danger-border-top-size: 1px; --alert-danger-border-right-size: 1px; --alert-danger-border-bottom-size: 1px; --alert-danger-border-left-size: 1px; --alert-gray-color: hsla(0, 0%, 27%, 1.0); --alert-gray-bg-color: hsla(0, 0%, 98%, 1.0); --alert-gray-border-color: hsla(0, 0%, 98%, 0); --alert-gray-border-top-color: hsla(0, 0%, 98%, 0); --alert-gray-border-right-color: hsla(0, 0%, 98%, 0); --alert-gray-border-bottom-color: hsla(0, 0%, 98%, 0); --alert-gray-border-left-color: hsla(0, 0%, 98%, 0); --alert-gray-border-size: 1px; --alert-gray-border-top-size: 1px; --alert-gray-border-right-size: 1px; --alert-gray-border-bottom-size: 1px; --alert-gray-border-left-size: 1px; } /* ALERTS | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --alert-primary-color: hsla(0, 0%, 84%, 1.0); --alert-primary-bg-color: hsla(216, 88%, 57%, 0.10); --alert-primary-border-color: hsla(216, 88%, 57%, 0); --alert-primary-border-top-color: hsla(216, 88%, 57%, 0); --alert-primary-border-right-color: hsla(216, 88%, 57%, 0); --alert-primary-border-bottom-color: hsla(216, 88%, 57%, 0); --alert-primary-border-left-color: hsla(216, 88%, 57%, 0); --alert-secondary-color: hsla(0, 0%, 84%, 1.0); --alert-secondary-bg-color: hsla(225, 8%, 20%, 1.0); --alert-secondary-border-color: hsla(225, 8%, 20%, 0); --alert-secondary-border-top-color: hsla(225, 8%, 20%, 0); --alert-secondary-border-right-color: hsla(225, 8%, 20%, 0); --alert-secondary-border-bottom-color: hsla(225, 8%, 20%, 0); --alert-secondary-border-left-color: hsla(225, 8%, 20%, 0); --alert-info-color: hsla(0, 0%, 84%, 1.0); --alert-info-bg-color: hsla(204, 73%, 64%, 0.10); --alert-info-border-color: hsla(204, 73%, 64%, 0); --alert-info-border-top-color: hsla(204, 73%, 64%, 0); --alert-info-border-right-color: hsla(204, 73%, 64%, 0); --alert-info-border-bottom-color: hsla(204, 73%, 64%, 0); --alert-info-border-left-color: hsla(204, 73%, 64%, 0); --alert-success-color: hsla(0, 0%, 84%, 1.0); --alert-success-bg-color: hsla(148, 85%, 38%, 0.10); --alert-success-border-color: hsla(148, 85%, 38%, 0); --alert-success-border-top-color: hsla(148, 85%, 38%, 0); --alert-success-border-right-color: hsla(148, 85%, 38%, 0); --alert-success-border-bottom-color: hsla(148, 85%, 38%, 0); --alert-success-border-left-color: hsla(148, 85%, 38%, 0); --alert-warning-color: hsla(0, 0%, 84%, 1.0); --alert-warning-bg-color: hsla(42, 100%, 50%, 0.10); --alert-warning-border-color: hsla(42, 100%, 50%, 0); --alert-warning-border-top-color: hsla(42, 100%, 50%, 0); --alert-warning-border-right-color: hsla(42, 100%, 50%, 0); --alert-warning-border-bottom-color: hsla(42, 100%, 50%, 0); --alert-warning-border-left-color: hsla(42, 100%, 50%, 0); --alert-danger-color: hsla(0, 0%, 84%, 1.0); --alert-danger-bg-color: hsla(355, 100%, 62%, 0.20); --alert-danger-border-color: hsla(355, 100%, 62%, 0); --alert-danger-border-top-color: hsla(355, 100%, 62%, 0); --alert-danger-border-right-color: hsla(355, 100%, 62%, 0); --alert-danger-border-bottom-color: hsla(355, 100%, 62%, 0); --alert-danger-border-left-color: hsla(355, 100%, 62%, 0); --alert-gray-color: hsla(0, 0%, 84%, 1.0); --alert-gray-bg-color: hsla(225, 8%, 10%, 1.0); --alert-gray-border-color: hsla(225, 8%, 10%, 0); --alert-gray-border-top-color: hsla(225, 8%, 10%, 0); --alert-gray-border-right-color: hsla(225, 8%, 10%, 0); --alert-gray-border-bottom-color: hsla(225, 8%, 10%, 0); --alert-gray-border-left-color: hsla(225, 8%, 10%, 0); } /* SCSS Document */ /* BORDERS | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --border-color: hsla(0, 0%, 90%, 1.0); --border-radius: 0px; --border-radius-xl: 0px; } /* BORDERS | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --border-color: hsla(240, 7%, 30%, 1.0); } /* SCSS Document */ /* BRAND LOGO | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --brand-logo-display: inline-block; --brand-logo-repeat: no-repeat; --brand-logo-position: 0px 0px; --brand-logo-size: 100% auto; --brand-logo-width: 220px; --brand-logo-height: 34px; --brand-logo-image: url('../../images/common/logos/ibkr/interactive-brokers.svg'); --brand-logo-image-inverse: url('../../images/common/logos/ibkr/interactive-brokers-inverse.svg'); --brand-logo-mobile-width: 90px; --brand-logo-mobile-height: 34px; --brand-logo-mobile-image: url('../../images/common/logos/ibkr/ibkr.svg'); --brand-logo-mobile-image-inverse: url('../../images/common/logos/ibkr/ibkr-inverse.svg'); --brand-logo-zh-hans-width: 220px; --brand-logo-zh-hans-height: 40px; --brand-logo-zh-hans-image: url('../../images/common/logos/ibkr/interactive-brokers-zhhans.svg'); --brand-logo-zh-hans-image-inverse: url('../../images/common/logos/ibkr/interactive-brokers-zhhans-inverse.svg'); --brand-logo-zh-hant-width: 220px; --brand-logo-zh-hant-height: 40px; --brand-logo-zh-hant-image: url('../../images/common/logos/ibkr/interactive-brokers-zhhant.svg'); --brand-logo-zh-hant-image-inverse: url('../../images/common/logos/ibkr/interactive-brokers-zhhant-inverse.svg'); } /* BRAND LOGO | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --brand-logo-image: url('../../images/common/logos/ibkr/interactive-brokers-inverse.svg'); --brand-logo-image-inverse: url('../../images/common/logos/ibkr/interactive-brokers.svg'); --brand-logo-mobile-image: url('../../images/common/logos/ibkr/ibkr-inverse.svg'); --brand-logo-mobile-image-inverse: url('../../images/common/logos/ibkr/ibkr.svg'); --brand-logo-zh-hans-image: url('../../images/common/logos/ibkr/interactive-brokers-zhhans-inverse.svg'); --brand-logo-zh-hans-image-inverse: url('../../images/common/logos/ibkr/interactive-brokers-zhhans.svg'); --brand-logo-zh-hant-image: url('../../images/common/logos/ibkr/interactive-brokers-zhhant-inverse.svg'); --brand-logo-zh-hant-image-inverse: url('../../images/common/logos/ibkr/interactive-brokers-zhhant.svg'); } /* SCSS Document */ /* BUTTONS | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --btn-xl-pt: 16px; --btn-xl-pe: 15px; --btn-xl-pb: 16px; --btn-xl-ps: 15px; --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.375rem; --btn-xl-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-lg-pt: 12px; --btn-lg-pe: 15px; --btn-lg-pb: 12px; --btn-lg-ps: 15px; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.375rem; --btn-lg-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-pt: 10px; --btn-pe: 15px; --btn-pb: 10px; --btn-ps: 15px; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.375rem; --btn-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-sm-pt: 8px; --btn-sm-pe: 10px; --btn-sm-pb: 8px; --btn-sm-ps: 10px; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 1.0rem; --btn-sm-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-xs-pt: 5px; --btn-xs-pe: 10px; --btn-xs-pb: 5px; --btn-xs-ps: 10px; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 1.0rem; --btn-xs-font-family: "Proxima Nova", Arial, Verdana, sans-serif; /* BTN-DEFAULT */ --btn-default-border-size: 1px; --btn-default-color: hsla(0, 0%, 27%, 1.0); --btn-default-color-hover: hsla(0, 0%, 27%, 1.0); --btn-default-color-active: hsla(0, 0%, 0%, 1.0); --btn-default-color-focus: hsla(0, 0%, 0%, 1.0); --btn-default-bg-color: hsla(0, 0%, 97%, 1.0); --btn-default-bg-color-hover: hsla(0, 0%, 95%, 1.0); --btn-default-bg-color-active: hsla(0, 0%, 93%, 1.0); --btn-default-bg-color-focus: hsla(0, 0%, 93%, 1.0); --btn-default-border-color: hsla(0, 0%, 85%, 1.0); --btn-default-border-color-hover: hsla(0, 0%, 80%, 1.0); --btn-default-border-color-active: hsla(0, 0%, 60%, 1.0); --btn-default-border-color-focus: hsla(0, 0%, 60%, 1.0); /* BTN-PRIMARY */ --btn-primary-border-size: 1px; --btn-primary-color: hsla(0, 0%, 100%, 1.0); --btn-primary-color-hover: hsla(0, 0%, 100%, 1.0); --btn-primary-color-active: hsla(0, 0%, 100%, 1.0); --btn-primary-color-focus: hsla(0, 0%, 100%, 1.0); --btn-primary-bg-color: hsla(0, 0%, 20%, 1.0); --btn-primary-bg-color-hover: hsla(0, 0%, 10%, 1.0); --btn-primary-bg-color-active: hsla(0, 0%, 0%, 1.0); --btn-primary-bg-color-focus: hsla(0, 0%, 0%, 1.0); --btn-primary-border-color: hsla(0, 0%, 20%, 1.0); --btn-primary-border-color-hover: hsla(0, 0%, 10%, 1.0); --btn-primary-border-color-active: hsla(0, 0%, 0%, 1.0); --btn-primary-border-color-focus: hsla(0, 0%, 0%, 1.0); /* BTN-SECONDARY */ --btn-secondary-border-size: 1px; --btn-secondary-color: hsla(0, 0%, 100%, 1.0); --btn-secondary-color-hover: hsla(0, 0%, 100%, 1.0); --btn-secondary-color-active: hsla(0, 0%, 100%, 1.0); --btn-secondary-color-focus: hsla(0, 0%, 100%, 1.0); --btn-secondary-bg-color: hsla(0, 0%, 40%, 1.0); --btn-secondary-bg-color-hover: hsla(0, 0%, 30%, 1.0); --btn-secondary-bg-color-active: hsla(0, 0%, 20%, 1.0); --btn-secondary-bg-color-focus: hsla(0, 0%, 20%, 1.0); --btn-secondary-border-color: hsla(0, 0%, 40%, 1.0); --btn-secondary-border-color-hover: hsla(0, 0%, 30%, 1.0); --btn-secondary-border-color-active: hsla(0, 0%, 20%, 1.0); --btn-secondary-border-color-focus: hsla(0, 0%, 20%, 1.0); /* BTN-TERTIARY */ --btn-tertiary-border-size: 1px; --btn-tertiary-color: hsla(0, 0%, 100%, 1.0); --btn-tertiary-color-hover: hsla(0, 0%, 100%, 1.0); --btn-tertiary-color-active: hsla(0, 0%, 100%, 1.0); --btn-tertiary-color-focus: hsla(0, 0%, 100%, 1.0); --btn-tertiary-bg-color: hsla(0, 0%, 60%, 1.0); --btn-tertiary-bg-color-hover: hsla(0, 0%, 50%, 1.0); --btn-tertiary-bg-color-active: hsla(0, 0%, 40%, 1.0); --btn-tertiary-bg-color-focus: hsla(0, 0%, 40%, 1.0); --btn-tertiary-border-color: hsla(0, 0%, 60%, 1.0); --btn-tertiary-border-color-hover: hsla(0, 0%, 50%, 1.0); --btn-tertiary-border-color-active: hsla(0, 0%, 40%, 1.0); --btn-tertiary-border-color-focus: hsla(0, 0%, 40%, 1.0); /* BTN-ICON */ --btn-icon-color: hsla(0, 0%, 5%, 1.0); --btn-icon-color-hover: hsla(0, 0%, 3%, 1.0); --btn-icon-color-active: hsla(0, 0%, 3%, 1.0); } /* BUTTONS | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { /* BTN-DEFAULT */ --btn-default-color: hsla(0, 0%, 70%, 1.0); --btn-default-color-hover: hsla(0, 0%, 90%, 1.0); --btn-default-color-active: hsla(0, 0%, 100%, 1.0); --btn-default-color-focus: hsla(0, 0%, 100%, 1.0); --btn-default-bg-color: hsla(0, 0%, 100%, 0.05); --btn-default-bg-color-hover: hsla(0, 0%, 100%, 0.10); --btn-default-bg-color-active: hsla(0, 0%, 100%, 0.10); --btn-default-bg-color-focus: hsla(0, 0%, 100%, 0.10); --btn-default-border-color: hsla(0, 0%, 30%, 1.0); --btn-default-border-color-hover: hsla(0, 0%, 40%, 1.0); --btn-default-border-color-active: hsla(0, 0%, 50%, 1.0); --btn-default-border-color-focus: hsla(0, 0%, 50%, 1.0); /* BTN-PRIMARY */ --btn-primary-color: hsla(0, 0%, 0%, 1.0); --btn-primary-color-hover: hsla(0, 0%, 0%, 1.0); --btn-primary-color-active: hsla(0, 0%, 0%, 1.0); --btn-primary-color-focus: hsla(0, 0%, 0%, 1.0); --btn-primary-bg-color: hsla(0, 0%, 80%, 1.0); --btn-primary-bg-color-hover: hsla(0, 0%, 90%, 1.0); --btn-primary-bg-color-active: hsla(0, 0%, 100%, 1.0); --btn-primary-bg-color-focus: hsla(0, 0%, 100%, 1.0); --btn-primary-border-color: hsla(0, 0%, 80%, 1.0); --btn-primary-border-color-hover: hsla(0, 0%, 90%, 1.0); --btn-primary-border-color-active: hsla(0, 0%, 100%, 1.0); --btn-primary-border-color-focus: hsla(0, 0%, 100%, 1.0); /* BTN-SECONDARY */ --btn-secondary-color: hsla(0, 0%, 0%, 1.0); --btn-secondary-color-hover: hsla(0, 0%, 0%, 1.0); --btn-secondary-color-active: hsla(0, 0%, 0%, 1.0); --btn-secondary-color-focus: hsla(0, 0%, 0%, 1.0); --btn-secondary-bg-color: hsla(0, 0%, 60%, 1.0); --btn-secondary-bg-color-hover: hsla(0, 0%, 70%, 1.0); --btn-secondary-bg-color-active: hsla(0, 0%, 80%, 1.0); --btn-secondary-bg-color-focus: hsla(0, 0%, 80%, 1.0); --btn-secondary-border-color: hsla(0, 0%, 60%, 1.0); --btn-secondary-border-color-hover: hsla(0, 0%, 70%, 1.0); --btn-secondary-border-color-active: hsla(0, 0%, 80%, 1.0); --btn-secondary-border-color-focus: hsla(0, 0%, 80%, 1.0); /* BTN-TERTIARY */ --btn-tertiary-color: hsla(0, 0%, 0%, 1.0); --btn-tertiary-color-hover: hsla(0, 0%, 0%, 1.0); --btn-tertiary-color-active: hsla(0, 0%, 0%, 1.0); --btn-tertiary-color-focus: hsla(0, 0%, 0%, 1.0); --btn-tertiary-bg-color: hsla(0, 0%, 40%, 1.0); --btn-tertiary-bg-color-hover: hsla(0, 0%, 50%, 1.0); --btn-tertiary-bg-color-active: hsla(0, 0%, 60%, 1.0); --btn-tertiary-bg-color-focus: hsla(0, 0%, 60%, 1.0); --btn-tertiary-border-color: hsla(0, 0%, 40%, 1.0); --btn-tertiary-border-color-hover: hsla(0, 0%, 50%, 1.0); --btn-tertiary-border-color-active: hsla(0, 0%, 60%, 1.0); --btn-tertiary-border-color-focus: hsla(0, 0%, 60%, 1.0); /* BTN-ICON */ --btn-icon-color: hsla(0, 0%, 95%, 1.0); --btn-icon-color-hover: hsla(0, 0%, 90%, 1.0); --btn-icon-color-active: hsla(0, 0%, 90%, 1.0); } /* SCSS Document */ /* FORMS | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --link-color: hsla(0, 0%, 5%, 1.0); --link-color-hover: hsla(0, 0%, 3%, 1.0); --link-color-active: hsla(0, 0%, 3%, 1.0); --label-font-style: normal; --label-font-weight: 600; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --label-color: hsla(0, 0%, 0%, 1.0); --input-pt: 6px; --input-pe: 12px; --input-pb: 6px; --input-ps: 12px; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --input-color: hsla(0, 0%, 27%, 1.0); --input-color-focus: hsla(0, 0%, 0%, 1.0); --input-bg-color: hsla(0, 0%, 100%, 1.0); --input-bg-color-focus: hsla(0, 0%, 100%, 1.0); --input-border-color: hsla(0, 0%, 0%, 0.12); --input-border-color-focus: hsla(0, 0%, 5%, 1.0); --input-placeholder-color: hsla(208, 7%, 46%, 0.90); } /* FORMS | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --link-color: hsla(0, 0%, 95%, 1.0); --link-color-hover: hsla(0, 0%, 90%, 1.0); --link-color-active: hsla(0, 0%, 90%, 1.0); --label-color: hsla(0, 0%, 100%, 1.0); --input-color: hsla(0, 0%, 84%, 1.0); --input-color-focus: hsla(0, 0%, 84%, 1.0); --input-bg-color: hsla(240, 17%, 10%, 1.0); --input-bg-color-focus: hsla(240, 17%, 10%, 1.0); --input-border-color: hsla(240, 7%, 21%, 1.0); --input-border-color-focus: hsla(0, 0%, 95%, 1.0); } /* SCSS Document */ /* TABLES | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --th-pt: 5px; --th-pe: 8px; --th-pb: 5px; --th-ps: 8px; --th-font-style: normal; --th-font-weight: 400; --th-font-size: 0.8125rem; --th-line-height: 1.125rem; --th-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --th-color: hsla(208, 7%, 46%, 0.90); --th-bg-color: hsla(0, 0%, 100%, 0); --td-pt: 5px; --td-pe: 8px; --td-pb: 5px; --td-ps: 8px; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 0.875rem; --td-line-height: 1.125rem; --td-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --td-color: hsla(0, 0%, 27%, 1.0); --td-bg-color: hsla(0, 0%, 100%, 0); } /* TABLES | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --th-color: hsla(208, 7%, 46%, 0.90); --th-bg-color: hsla(0, 0%, 0%, 0); --td-color: hsla(0, 0%, 84%, 1.0); --td-bg-color: hsla(0, 0%, 0%, 0); } /* SCSS Document */ /* WEBSITE | LIGHT ---------------------------------------------------------------------------------------------------- */ :root { --nav-top-bg-color: hsla(0, 0%, 0%, 1.0); --nav-top-link-color: hsla(0, 0%, 80%, 1.0); --nav-top-link-color-hover: hsla(0, 0%, 100%, 1.0); --nav-top-link-color-active: hsla(0, 0%, 100%, 1.0); --nav-top-link-bg-color: hsla(0, 0%, 100%, 0); --nav-top-link-bg-color-hover: hsla(0, 0%, 100%, 0); --nav-top-link-bg-color-active: hsla(0, 0%, 100%, 0); --nav-top-dropdown-bg-color: hsla(0, 0%, 100%, 1.0); --nav-top-dropdown-font-color-dark: hsla(0, 0%, 0%, 1.0); --nav-top-dropdown-font-color: hsla(0, 0%, 27%, 1.0); --nav-top-dropdown-font-color-light: hsla(0, 0%, 40%, 1.0); --nav-top-dropdown-link-color: hsla(0, 0%, 27%, 1.0); --nav-top-dropdown-link-color-hover: hsla(0, 0%, 5%, 1.0); --nav-top-dropdown-link-color-active: hsla(0, 0%, 5%, 1.0); --nav-top-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --nav-top-dropdown-link-bg-color-hover: hsla(0, 0%, 95%, 1.0); --nav-top-dropdown-link-bg-color-active: hsla(0, 0%, 95%, 1.0); --nav-bottom-bg-color: hsla(0, 0%, 100%, 1.0); --nav-bottom-link-color: hsla(0, 0%, 27%, 1.0); --nav-bottom-link-color-hover: hsla(0, 0%, 5%, 1.0); --nav-bottom-link-color-active: hsla(0, 0%, 5%, 1.0); --nav-bottom-link-bg-color: hsla(0, 0%, 100%, 0); --nav-bottom-link-bg-color-hover: hsla(0, 0%, 100%, 0); --nav-bottom-link-bg-color-active: hsla(0, 0%, 100%, 0); --nav-bottom-dropdown-bg-color: hsla(0, 0%, 100%, 1.0); --nav-bottom-dropdown-font-color-dark: hsla(0, 0%, 0%, 1.0); --nav-bottom-dropdown-font-color: hsla(0, 0%, 27%, 1.0); --nav-bottom-dropdown-font-color-light: hsla(0, 0%, 40%, 1.0); --nav-bottom-dropdown-link-color: hsla(0, 0%, 27%, 1.0); --nav-bottom-dropdown-link-color-hover: hsla(0, 0%, 5%, 1.0); --nav-bottom-dropdown-link-color-active: hsla(0, 0%, 5%, 1.0); --nav-bottom-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --nav-bottom-dropdown-link-bg-color-hover: hsla(0, 0%, 95%, 1.0); --nav-bottom-dropdown-link-bg-color-active: hsla(0, 0%, 95%, 1.0); --footer-bg-color: hsla(0, 0%, 97%, 1.0); --footer-font-color-dark: hsla(0, 0%, 0%, 1.0); --footer-font-color: hsla(0, 0%, 27%, 1.0); --footer-font-color-light: hsla(0, 0%, 40%, 1.0); --footer-link-color: hsla(0, 0%, 27%, 1.0); --footer-link-color-hover: hsla(0, 0%, 5%, 1.0); --footer-link-color-active: hsla(0, 0%, 5%, 1.0); } /* WEBSITE | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { --nav-top-bg-color: hsla(0, 0%, 0%, 1.0); --nav-top-link-color: hsla(0, 0%, 80%, 1.0); --nav-top-link-color-hover: hsla(0, 0%, 100%, 1.0); --nav-top-link-color-active: hsla(0, 0%, 100%, 1.0); --nav-top-link-bg-color: hsla(0, 0%, 0%, 0); --nav-top-link-bg-color-hover: hsla(0, 0%, 0%, 0); --nav-top-link-bg-color-active: hsla(0, 0%, 0%, 0); --nav-top-dropdown-bg-color: hsla(240, 17%, 10%, 1.0); --nav-top-dropdown-font-color-dark: hsla(0, 0%, 100%, 1.0); --nav-top-dropdown-font-color: hsla(0, 0%, 80%, 1.0); --nav-top-dropdown-font-color-light: hsla(0, 0%, 60%, 1.0); --nav-top-dropdown-link-color: hsla(0, 0%, 80%, 1.0); --nav-top-dropdown-link-color-hover: hsla(0, 0%, 100%, 1.0); --nav-top-dropdown-link-color-active: hsla(0, 0%, 100%, 1.0); --nav-top-dropdown-link-bg-color: hsla(0, 0%, 0%, 0); --nav-top-dropdown-link-bg-color-hover: hsla(208, 7%, 46%, 0.10); --nav-top-dropdown-link-bg-color-active: hsla(208, 7%, 46%, 0.10); --nav-bottom-bg-color: hsla(240, 17%, 10%, 1.0); --nav-bottom-link-color: hsla(0, 0%, 80%, 1.0); --nav-bottom-link-color-hover: hsla(0, 0%, 100%, 1.0); --nav-bottom-link-color-active: hsla(0, 0%, 100%, 1.0); --nav-bottom-link-bg-color: hsla(0, 0%, 0%, 0); --nav-bottom-link-bg-color-hover: hsla(0, 0%, 0%, 0); --nav-bottom-link-bg-color-active: hsla(0, 0%, 0%, 0); --nav-bottom-dropdown-bg-color: hsla(240, 17%, 10%, 1.0); --nav-bottom-dropdown-font-color-dark: hsla(0, 0%, 100%, 1.0); --nav-bottom-dropdown-font-color: hsla(0, 0%, 80%, 1.0); --nav-bottom-dropdown-font-color-light: hsla(0, 0%, 60%, 1.0); --nav-bottom-dropdown-link-color: hsla(0, 0%, 80%, 1.0); --nav-bottom-dropdown-link-color-hover: hsla(0, 0%, 100%, 1.0); --nav-bottom-dropdown-link-color-active: hsla(0, 0%, 100%, 1.0); --nav-bottom-dropdown-link-bg-color: hsla(0, 0%, 0%, 0); --nav-bottom-dropdown-link-bg-color-hover: hsla(208, 7%, 46%, 0.10); --nav-bottom-dropdown-link-bg-color-active: hsla(208, 7%, 46%, 0.10); --footer-bg-color: hsla(208, 7%, 46%, 0.10); --footer-font-color-dark: hsla(0, 0%, 100%, 1.0); --footer-font-color: hsla(0, 0%, 80%, 1.0); --footer-font-color-light: hsla(0, 0%, 60%, 1.0); --footer-link-color: hsla(0, 0%, 80%, 1.0); --footer-link-color-hover: hsla(0, 0%, 100%, 1.0); --footer-link-color-active: hsla(0, 0%, 100%, 1.0); } /* SCSS Document */ /* LANGUAGE | AR (ARABIC) ---------------------------------------------------------------------------------------------------- */ [lang=ar] { /* TYPOGRAPHY */ --fs-1: 2.5rem; --fs-2: 2.25rem; --fs-3: 2.0rem; --fs-4: 1.75rem; --fs-5: 1.5rem; --fs-6: 1.25rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 2.75rem; --lh-2: 2.625rem; --lh-3: 2.5rem; --lh-4: 2.25rem; --lh-5: 2.25rem; --lh-6: 1.75rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h1-font-style: normal; --h1-font-weight: 400; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 2.75rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h2-font-style: normal; --h2-font-weight: 400; --h2-font-size: 2.25rem; --h2-font-size-mobile: 2.0rem; --h2-line-height: 2.625rem; --h2-line-height-mobile: 2.5rem; --h2-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h3-font-style: normal; --h3-font-weight: 400; --h3-font-size: 2.0rem; --h3-font-size-mobile: 1.75rem; --h3-line-height: 2.5rem; --h3-line-height-mobile: 2.25rem; --h3-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h4-font-style: normal; --h4-font-weight: 400; --h4-font-size: 1.75rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 2.25rem; --h4-line-height-mobile: 2.0rem; --h4-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h5-font-style: normal; --h5-font-weight: 400; --h5-font-size: 1.5rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 2.0rem; --h5-line-height-mobile: 1.75rem; --h5-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.25rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.75rem; --h6-line-height-mobile: 1.375rem; --h6-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; /* TABLES */ --th-font-style: normal; --th-font-weight: 400; --th-font-size: 0.8125rem; --th-line-height: 1.125rem; --th-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 0.875rem; --td-line-height: 1.125rem; --td-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; /* FORMS */ --label-font-style: normal; --label-font-weight: 400; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; /* BUTTONS */ --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.0rem; --btn-xl-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.0rem; --btn-lg-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.0rem; --btn-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 0.875rem; --btn-sm-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 0.75rem; --btn-xs-font-family: "Geeza Pro", "Helvetica Neue", "Helvetica", Arial, sans-serif; } /* SCSS Document */ /* LANGUAGE | HU (HUNGARIAN) ---------------------------------------------------------------------------------------------------- */ [lang=hu] { /* TYPOGRAPHY */ --fs-1: 2.5rem; --fs-2: 2.25rem; --fs-3: 2.0rem; --fs-4: 1.75rem; --fs-5: 1.5rem; --fs-6: 1.25rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 2.75rem; --lh-2: 2.625rem; --lh-3: 2.5rem; --lh-4: 2.25rem; --lh-5: 2.25rem; --lh-6: 1.75rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --h1-font-style: normal; --h1-font-weight: 400; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 2.75rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --h2-font-style: normal; --h2-font-weight: 400; --h2-font-size: 2.25rem; --h2-font-size-mobile: 2.0rem; --h2-line-height: 2.625rem; --h2-line-height-mobile: 2.5rem; --h2-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --h3-font-style: normal; --h3-font-weight: 400; --h3-font-size: 2.0rem; --h3-font-size-mobile: 1.75rem; --h3-line-height: 2.5rem; --h3-line-height-mobile: 2.25rem; --h3-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --h4-font-style: normal; --h4-font-weight: 400; --h4-font-size: 1.75rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 2.25rem; --h4-line-height-mobile: 2.0rem; --h4-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --h5-font-style: normal; --h5-font-weight: 400; --h5-font-size: 1.5rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 2.0rem; --h5-line-height-mobile: 1.75rem; --h5-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.25rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.75rem; --h6-line-height-mobile: 1.375rem; --h6-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; /* TABLES */ --th-font-style: normal; --th-font-weight: 400; --th-font-size: 0.8125rem; --th-line-height: 1.125rem; --th-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 0.875rem; --td-line-height: 1.125rem; --td-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; /* FORMS */ --label-font-style: normal; --label-font-weight: 400; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; /* BUTTONS */ --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.0rem; --btn-xl-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.0rem; --btn-lg-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.0rem; --btn-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 0.875rem; --btn-sm-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 0.75rem; --btn-xs-font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif; } /* SCSS Document */ /* LANGUAGE | JA (JAPANESE) ---------------------------------------------------------------------------------------------------- */ [lang=ja] { /* TYPOGRAPHY */ --fs-1: 2.25rem; --fs-2: 2.0rem; --fs-3: 1.75rem; --fs-4: 1.5rem; --fs-5: 1.25rem; --fs-6: 1.125rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 2.75rem; --lh-2: 2.625rem; --lh-3: 2.5rem; --lh-4: 2.25rem; --lh-5: 2.25rem; --lh-6: 1.75rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --h1-font-style: normal; --h1-font-weight: 600; --h1-font-size: 2.25rem; --h1-font-size-mobile: 2.0rem; --h1-line-height: 2.75rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --h2-font-style: normal; --h2-font-weight: 600; --h2-font-size: 2.0rem; --h2-font-size-mobile: 1.75rem; --h2-line-height: 2.625rem; --h2-line-height-mobile: 2.5rem; --h2-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --h3-font-style: normal; --h3-font-weight: 600; --h3-font-size: 1.75rem; --h3-font-size-mobile: 1.5rem; --h3-line-height: 2.5rem; --h3-line-height-mobile: 2.25rem; --h3-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --h4-font-style: normal; --h4-font-weight: 600; --h4-font-size: 1.5rem; --h4-font-size-mobile: 1.25rem; --h4-line-height: 2.25rem; --h4-line-height-mobile: 2.0rem; --h4-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --h5-font-style: normal; --h5-font-weight: 600; --h5-font-size: 1.25rem; --h5-font-size-mobile: 1.125rem; --h5-line-height: 2.0rem; --h5-line-height-mobile: 1.75rem; --h5-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.125rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.75rem; --h6-line-height-mobile: 1.375rem; --h6-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /* TABLES */ --th-font-style: normal; --th-font-weight: 400; --th-font-size: 0.8125rem; --th-line-height: 1.125rem; --th-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 0.875rem; --td-line-height: 1.125rem; --td-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /* FORMS */ --label-font-style: normal; --label-font-weight: 400; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /* BUTTONS */ --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.375rem; --btn-xl-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.375rem; --btn-lg-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.375rem; --btn-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 1.0rem; --btn-sm-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 1.0rem; --btn-xs-font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; } /* SCSS Document */ /* LANGUAGE | KO (KOREAN) ---------------------------------------------------------------------------------------------------- */ [lang=ko] { /* TYPOGRAPHY */ --fs-1: 2.5rem; --fs-2: 2.25rem; --fs-3: 2.0rem; --fs-4: 1.75rem; --fs-5: 1.5rem; --fs-6: 1.25rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 2.75rem; --lh-2: 2.625rem; --lh-3: 2.5rem; --lh-4: 2.25rem; --lh-5: 2.25rem; --lh-6: 1.75rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --h1-font-style: normal; --h1-font-weight: 600; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 2.75rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --h2-font-style: normal; --h2-font-weight: 600; --h2-font-size: 2.25rem; --h2-font-size-mobile: 2.0rem; --h2-line-height: 2.625rem; --h2-line-height-mobile: 2.5rem; --h2-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --h3-font-style: normal; --h3-font-weight: 600; --h3-font-size: 2.0rem; --h3-font-size-mobile: 1.75rem; --h3-line-height: 2.5rem; --h3-line-height-mobile: 2.25rem; --h3-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --h4-font-style: normal; --h4-font-weight: 600; --h4-font-size: 1.75rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 2.25rem; --h4-line-height-mobile: 2.0rem; --h4-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --h5-font-style: normal; --h5-font-weight: 600; --h5-font-size: 1.5rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 2.0rem; --h5-line-height-mobile: 1.75rem; --h5-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.25rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.75rem; --h6-line-height-mobile: 1.375rem; --h6-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; /* TABLES */ --th-font-style: normal; --th-font-weight: 400; --th-font-size: 0.8125rem; --th-line-height: 1.125rem; --th-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 0.875rem; --td-line-height: 1.125rem; --td-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; /* FORMS */ --label-font-style: normal; --label-font-weight: 400; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; /* BUTTONS */ --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.375rem; --btn-xl-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.375rem; --btn-lg-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.375rem; --btn-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 1.0rem; --btn-sm-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 1.0rem; --btn-xs-font-family: "Apple SD Gothic Neo", "NanumBarunGothic", "맑은 고딕", "Malgun Gothic", "굴림", "Gulim", "돋움", "Dotum", sans-serif; } /* SCSS Document */ /* LANGUAGE | RU (RUSSIAN) ---------------------------------------------------------------------------------------------------- */ [lang=ru] { /* TYPOGRAPHY */ --fs-1: 2.5rem; --fs-2: 2.25rem; --fs-3: 2.0rem; --fs-4: 1.75rem; --fs-5: 1.5rem; --fs-6: 1.25rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 2.75rem; --lh-2: 2.625rem; --lh-3: 2.5rem; --lh-4: 2.25rem; --lh-5: 2.25rem; --lh-6: 1.75rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h1-font-style: normal; --h1-font-weight: 400; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 2.75rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h2-font-style: normal; --h2-font-weight: 400; --h2-font-size: 2.25rem; --h2-font-size-mobile: 2.0rem; --h2-line-height: 2.625rem; --h2-line-height-mobile: 2.5rem; --h2-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h3-font-style: normal; --h3-font-weight: 400; --h3-font-size: 2.0rem; --h3-font-size-mobile: 1.75rem; --h3-line-height: 2.5rem; --h3-line-height-mobile: 2.25rem; --h3-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h4-font-style: normal; --h4-font-weight: 400; --h4-font-size: 1.75rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 2.25rem; --h4-line-height-mobile: 2.0rem; --h4-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h5-font-style: normal; --h5-font-weight: 400; --h5-font-size: 1.5rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 2.0rem; --h5-line-height-mobile: 1.75rem; --h5-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.25rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.75rem; --h6-line-height-mobile: 1.375rem; --h6-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; /* TABLES */ --th-font-style: normal; --th-font-weight: 400; --th-font-size: 0.8125rem; --th-line-height: 1.125rem; --th-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 0.875rem; --td-line-height: 1.125rem; --td-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; /* FORMS */ --label-font-style: normal; --label-font-weight: 400; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; /* BUTTONS */ --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.0rem; --btn-xl-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.0rem; --btn-lg-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.0rem; --btn-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 0.875rem; --btn-sm-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 0.75rem; --btn-xs-font-family: "Charcoal", "Geneva", "Helvetica Neue", "Helvetica", Arial, sans-serif; } /* SCSS Document */ /* LANGUAGE | ZH-HANS (CHINESE SIMPLIFIED) ---------------------------------------------------------------------------------------------------- */ [lang=zh-Hans] { /* TYPOGRAPHY */ --fs-1: 2.5rem; --fs-2: 2.0rem; --fs-3: 1.625rem; --fs-4: 1.5rem; --fs-5: 1.25rem; --fs-6: 1.125rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 3.0rem; --lh-2: 2.5rem; --lh-3: 2.0rem; --lh-4: 1.75rem; --lh-5: 1.625rem; --lh-6: 1.5rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h1-font-style: normal; --h1-font-weight: 600; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 3.0rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h2-font-style: normal; --h2-font-weight: 600; --h2-font-size: 2.0rem; --h2-font-size-mobile: 1.75rem; --h2-line-height: 2.5rem; --h2-line-height-mobile: 2.125rem; --h2-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h3-font-style: normal; --h3-font-weight: 600; --h3-font-size: 1.625rem; --h3-font-size-mobile: 1.625rem; --h3-line-height: 2.0rem; --h3-line-height-mobile: 2.0rem; --h3-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h4-font-style: normal; --h4-font-weight: 600; --h4-font-size: 1.5rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 1.75rem; --h4-line-height-mobile: 1.75rem; --h4-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h5-font-style: normal; --h5-font-weight: 600; --h5-font-size: 1.25rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 1.625rem; --h5-line-height-mobile: 1.625rem; --h5-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.0rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.5rem; --h6-line-height-mobile: 1.5rem; --h6-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; /* TABLES */ --th-font-style: normal; --th-font-weight: 400; --th-font-size: 1.0rem; --th-line-height: 1.375rem; --th-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 1.0rem; --td-line-height: 1.375rem; --td-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; /* FORMS */ --label-font-style: normal; --label-font-weight: 400; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; /* BUTTONS */ --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.375rem; --btn-xl-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.375rem; --btn-lg-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.375rem; --btn-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 1.0rem; --btn-sm-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 1.0rem; --btn-xs-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; } /* SCSS Document */ /* LANGUAGE | ZH-HANT (CHINESE TRADITIONAL) ---------------------------------------------------------------------------------------------------- */ [lang=zh-Hant] { /* TYPOGRAPHY */ --fs-1: 2.5rem; --fs-2: 2.0rem; --fs-3: 1.625rem; --fs-4: 1.5rem; --fs-5: 1.25rem; --fs-6: 1.125rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --lh-1: 3.0rem; --lh-2: 2.5rem; --lh-3: 2.0rem; --lh-4: 1.75rem; --lh-5: 1.625rem; --lh-6: 1.5rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h1-font-style: normal; --h1-font-weight: 600; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 3.0rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h2-font-style: normal; --h2-font-weight: 600; --h2-font-size: 2.0rem; --h2-font-size-mobile: 1.75rem; --h2-line-height: 2.5rem; --h2-line-height-mobile: 2.125rem; --h2-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h3-font-style: normal; --h3-font-weight: 600; --h3-font-size: 1.625rem; --h3-font-size-mobile: 1.625rem; --h3-line-height: 2.0rem; --h3-line-height-mobile: 2.0rem; --h3-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h4-font-style: normal; --h4-font-weight: 600; --h4-font-size: 1.5rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 1.75rem; --h4-line-height-mobile: 1.75rem; --h4-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h5-font-style: normal; --h5-font-weight: 600; --h5-font-size: 1.25rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 1.625rem; --h5-line-height-mobile: 1.625rem; --h5-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.0rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.5rem; --h6-line-height-mobile: 1.5rem; --h6-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; /* TABLES */ --th-font-style: normal; --th-font-weight: 400; --th-font-size: 1.0rem; --th-line-height: 1.375rem; --th-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 1.0rem; --td-line-height: 1.375rem; --td-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; /* FORMS */ --label-font-style: normal; --label-font-weight: 400; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; /* BUTTONS */ --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.375rem; --btn-xl-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.375rem; --btn-lg-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.375rem; --btn-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 1.0rem; --btn-sm-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 1.0rem; --btn-xs-font-family: "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", sans-serif; } /* SCSS Document */ /* HTML STYLES ---------------------------------------------------------------------------------------------------- */ html { font-size: 100%; transition: color 0.25s ease-in, background 0.25s ease-in; } body { margin: 0px; padding: 0px; height: 100%; font-style: normal; font-weight: var(--fw-400); font-size: 1rem; line-height: 1.375rem; font-family: var(--font-family); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: var(--dir-start); color: var(--font-color); direction: var(--dir-start); background-color: var(--bg-body); overflow-x: hidden; } h1, h2, h3, h4, h5, h6, p, li, sup, th, td, label, input, select, textarea { color: var(--font-color); } h1, h2, h3, h4, h5, h6 { margin: 0px 0px 8px 0px; font-weight: var(--fw-600); color: var(--font-color-dark); } h1 a.linkexternal::after, h1 a.link-external::after, h1 a.link-arrow::after, h1 a.link-arrow-up::after, h1 a.link-arrow-down::after, h1 a.link-arrow-right::after, h1 a.link-chevron::after, h1 a.link-chevron-up::after, h1 a.link-chevron-right::after, h1 a.link-chevron-down::after, h1 a.link-chevron-circle::after, h1 a.link-chevron-circle-right::after, h1 a.link-play::after, h1 a.linkexternal:link::after, h1 a.link-external:link::after, h1 a.link-arrow:link::after, h1 a.link-arrow-up:link::after, h1 a.link-arrow-down:link::after, h1 a.link-arrow-right:link::after, h1 a.link-chevron:link::after, h1 a.link-chevron-up:link::after, h1 a.link-chevron-right:link::after, h1 a.link-chevron-down:link::after, h1 a.link-chevron-circle:link::after, h1 a.link-chevron-circle-right:link::after, h1 a.link-play:link::after, h1 a.linkexternal:visited::after, h1 a.link-external:visited::after, h1 a.link-arrow:visited::after, h1 a.link-arrow-up:visited::after, h1 a.link-arrow-down:visited::after, h1 a.link-arrow-right:visited::after, h1 a.link-chevron:visited::after, h1 a.link-chevron-up:visited::after, h1 a.link-chevron-right:visited::after, h1 a.link-chevron-down:visited::after, h1 a.link-chevron-circle:visited::after, h1 a.link-chevron-circle-right:visited::after, h1 a.link-play:visited::after, h1 a.linkexternal:hover::after, h1 a.link-external:hover::after, h1 a.link-arrow:hover::after, h1 a.link-arrow-up:hover::after, h1 a.link-arrow-down:hover::after, h1 a.link-arrow-right:hover::after, h1 a.link-chevron:hover::after, h1 a.link-chevron-up:hover::after, h1 a.link-chevron-right:hover::after, h1 a.link-chevron-down:hover::after, h1 a.link-chevron-circle:hover::after, h1 a.link-chevron-circle-right:hover::after, h1 a.link-play:hover::after, h1 a.linkexternal:active::after, h1 a.link-external:active::after, h1 a.link-arrow:active::after, h1 a.link-arrow-up:active::after, h1 a.link-arrow-down:active::after, h1 a.link-arrow-right:active::after, h1 a.link-chevron:active::after, h1 a.link-chevron-up:active::after, h1 a.link-chevron-right:active::after, h1 a.link-chevron-down:active::after, h1 a.link-chevron-circle:active::after, h1 a.link-chevron-circle-right:active::after, h1 a.link-play:active::after, h1 a.linkexternal:focus::after, h1 a.link-external:focus::after, h1 a.link-arrow:focus::after, h1 a.link-arrow-up:focus::after, h1 a.link-arrow-down:focus::after, h1 a.link-arrow-right:focus::after, h1 a.link-chevron:focus::after, h1 a.link-chevron-up:focus::after, h1 a.link-chevron-right:focus::after, h1 a.link-chevron-down:focus::after, h1 a.link-chevron-circle:focus::after, h1 a.link-chevron-circle-right:focus::after, h1 a.link-play:focus::after, h2 a.linkexternal::after, h2 a.link-external::after, h2 a.link-arrow::after, h2 a.link-arrow-up::after, h2 a.link-arrow-down::after, h2 a.link-arrow-right::after, h2 a.link-chevron::after, h2 a.link-chevron-up::after, h2 a.link-chevron-right::after, h2 a.link-chevron-down::after, h2 a.link-chevron-circle::after, h2 a.link-chevron-circle-right::after, h2 a.link-play::after, h2 a.linkexternal:link::after, h2 a.link-external:link::after, h2 a.link-arrow:link::after, h2 a.link-arrow-up:link::after, h2 a.link-arrow-down:link::after, h2 a.link-arrow-right:link::after, h2 a.link-chevron:link::after, h2 a.link-chevron-up:link::after, h2 a.link-chevron-right:link::after, h2 a.link-chevron-down:link::after, h2 a.link-chevron-circle:link::after, h2 a.link-chevron-circle-right:link::after, h2 a.link-play:link::after, h2 a.linkexternal:visited::after, h2 a.link-external:visited::after, h2 a.link-arrow:visited::after, h2 a.link-arrow-up:visited::after, h2 a.link-arrow-down:visited::after, h2 a.link-arrow-right:visited::after, h2 a.link-chevron:visited::after, h2 a.link-chevron-up:visited::after, h2 a.link-chevron-right:visited::after, h2 a.link-chevron-down:visited::after, h2 a.link-chevron-circle:visited::after, h2 a.link-chevron-circle-right:visited::after, h2 a.link-play:visited::after, h2 a.linkexternal:hover::after, h2 a.link-external:hover::after, h2 a.link-arrow:hover::after, h2 a.link-arrow-up:hover::after, h2 a.link-arrow-down:hover::after, h2 a.link-arrow-right:hover::after, h2 a.link-chevron:hover::after, h2 a.link-chevron-up:hover::after, h2 a.link-chevron-right:hover::after, h2 a.link-chevron-down:hover::after, h2 a.link-chevron-circle:hover::after, h2 a.link-chevron-circle-right:hover::after, h2 a.link-play:hover::after, h2 a.linkexternal:active::after, h2 a.link-external:active::after, h2 a.link-arrow:active::after, h2 a.link-arrow-up:active::after, h2 a.link-arrow-down:active::after, h2 a.link-arrow-right:active::after, h2 a.link-chevron:active::after, h2 a.link-chevron-up:active::after, h2 a.link-chevron-right:active::after, h2 a.link-chevron-down:active::after, h2 a.link-chevron-circle:active::after, h2 a.link-chevron-circle-right:active::after, h2 a.link-play:active::after, h2 a.linkexternal:focus::after, h2 a.link-external:focus::after, h2 a.link-arrow:focus::after, h2 a.link-arrow-up:focus::after, h2 a.link-arrow-down:focus::after, h2 a.link-arrow-right:focus::after, h2 a.link-chevron:focus::after, h2 a.link-chevron-up:focus::after, h2 a.link-chevron-right:focus::after, h2 a.link-chevron-down:focus::after, h2 a.link-chevron-circle:focus::after, h2 a.link-chevron-circle-right:focus::after, h2 a.link-play:focus::after, h3 a.linkexternal::after, h3 a.link-external::after, h3 a.link-arrow::after, h3 a.link-arrow-up::after, h3 a.link-arrow-down::after, h3 a.link-arrow-right::after, h3 a.link-chevron::after, h3 a.link-chevron-up::after, h3 a.link-chevron-right::after, h3 a.link-chevron-down::after, h3 a.link-chevron-circle::after, h3 a.link-chevron-circle-right::after, h3 a.link-play::after, h3 a.linkexternal:link::after, h3 a.link-external:link::after, h3 a.link-arrow:link::after, h3 a.link-arrow-up:link::after, h3 a.link-arrow-down:link::after, h3 a.link-arrow-right:link::after, h3 a.link-chevron:link::after, h3 a.link-chevron-up:link::after, h3 a.link-chevron-right:link::after, h3 a.link-chevron-down:link::after, h3 a.link-chevron-circle:link::after, h3 a.link-chevron-circle-right:link::after, h3 a.link-play:link::after, h3 a.linkexternal:visited::after, h3 a.link-external:visited::after, h3 a.link-arrow:visited::after, h3 a.link-arrow-up:visited::after, h3 a.link-arrow-down:visited::after, h3 a.link-arrow-right:visited::after, h3 a.link-chevron:visited::after, h3 a.link-chevron-up:visited::after, h3 a.link-chevron-right:visited::after, h3 a.link-chevron-down:visited::after, h3 a.link-chevron-circle:visited::after, h3 a.link-chevron-circle-right:visited::after, h3 a.link-play:visited::after, h3 a.linkexternal:hover::after, h3 a.link-external:hover::after, h3 a.link-arrow:hover::after, h3 a.link-arrow-up:hover::after, h3 a.link-arrow-down:hover::after, h3 a.link-arrow-right:hover::after, h3 a.link-chevron:hover::after, h3 a.link-chevron-up:hover::after, h3 a.link-chevron-right:hover::after, h3 a.link-chevron-down:hover::after, h3 a.link-chevron-circle:hover::after, h3 a.link-chevron-circle-right:hover::after, h3 a.link-play:hover::after, h3 a.linkexternal:active::after, h3 a.link-external:active::after, h3 a.link-arrow:active::after, h3 a.link-arrow-up:active::after, h3 a.link-arrow-down:active::after, h3 a.link-arrow-right:active::after, h3 a.link-chevron:active::after, h3 a.link-chevron-up:active::after, h3 a.link-chevron-right:active::after, h3 a.link-chevron-down:active::after, h3 a.link-chevron-circle:active::after, h3 a.link-chevron-circle-right:active::after, h3 a.link-play:active::after, h3 a.linkexternal:focus::after, h3 a.link-external:focus::after, h3 a.link-arrow:focus::after, h3 a.link-arrow-up:focus::after, h3 a.link-arrow-down:focus::after, h3 a.link-arrow-right:focus::after, h3 a.link-chevron:focus::after, h3 a.link-chevron-up:focus::after, h3 a.link-chevron-right:focus::after, h3 a.link-chevron-down:focus::after, h3 a.link-chevron-circle:focus::after, h3 a.link-chevron-circle-right:focus::after, h3 a.link-play:focus::after, h4 a.linkexternal::after, h4 a.link-external::after, h4 a.link-arrow::after, h4 a.link-arrow-up::after, h4 a.link-arrow-down::after, h4 a.link-arrow-right::after, h4 a.link-chevron::after, h4 a.link-chevron-up::after, h4 a.link-chevron-right::after, h4 a.link-chevron-down::after, h4 a.link-chevron-circle::after, h4 a.link-chevron-circle-right::after, h4 a.link-play::after, h4 a.linkexternal:link::after, h4 a.link-external:link::after, h4 a.link-arrow:link::after, h4 a.link-arrow-up:link::after, h4 a.link-arrow-down:link::after, h4 a.link-arrow-right:link::after, h4 a.link-chevron:link::after, h4 a.link-chevron-up:link::after, h4 a.link-chevron-right:link::after, h4 a.link-chevron-down:link::after, h4 a.link-chevron-circle:link::after, h4 a.link-chevron-circle-right:link::after, h4 a.link-play:link::after, h4 a.linkexternal:visited::after, h4 a.link-external:visited::after, h4 a.link-arrow:visited::after, h4 a.link-arrow-up:visited::after, h4 a.link-arrow-down:visited::after, h4 a.link-arrow-right:visited::after, h4 a.link-chevron:visited::after, h4 a.link-chevron-up:visited::after, h4 a.link-chevron-right:visited::after, h4 a.link-chevron-down:visited::after, h4 a.link-chevron-circle:visited::after, h4 a.link-chevron-circle-right:visited::after, h4 a.link-play:visited::after, h4 a.linkexternal:hover::after, h4 a.link-external:hover::after, h4 a.link-arrow:hover::after, h4 a.link-arrow-up:hover::after, h4 a.link-arrow-down:hover::after, h4 a.link-arrow-right:hover::after, h4 a.link-chevron:hover::after, h4 a.link-chevron-up:hover::after, h4 a.link-chevron-right:hover::after, h4 a.link-chevron-down:hover::after, h4 a.link-chevron-circle:hover::after, h4 a.link-chevron-circle-right:hover::after, h4 a.link-play:hover::after, h4 a.linkexternal:active::after, h4 a.link-external:active::after, h4 a.link-arrow:active::after, h4 a.link-arrow-up:active::after, h4 a.link-arrow-down:active::after, h4 a.link-arrow-right:active::after, h4 a.link-chevron:active::after, h4 a.link-chevron-up:active::after, h4 a.link-chevron-right:active::after, h4 a.link-chevron-down:active::after, h4 a.link-chevron-circle:active::after, h4 a.link-chevron-circle-right:active::after, h4 a.link-play:active::after, h4 a.linkexternal:focus::after, h4 a.link-external:focus::after, h4 a.link-arrow:focus::after, h4 a.link-arrow-up:focus::after, h4 a.link-arrow-down:focus::after, h4 a.link-arrow-right:focus::after, h4 a.link-chevron:focus::after, h4 a.link-chevron-up:focus::after, h4 a.link-chevron-right:focus::after, h4 a.link-chevron-down:focus::after, h4 a.link-chevron-circle:focus::after, h4 a.link-chevron-circle-right:focus::after, h4 a.link-play:focus::after, h5 a.linkexternal::after, h5 a.link-external::after, h5 a.link-arrow::after, h5 a.link-arrow-up::after, h5 a.link-arrow-down::after, h5 a.link-arrow-right::after, h5 a.link-chevron::after, h5 a.link-chevron-up::after, h5 a.link-chevron-right::after, h5 a.link-chevron-down::after, h5 a.link-chevron-circle::after, h5 a.link-chevron-circle-right::after, h5 a.link-play::after, h5 a.linkexternal:link::after, h5 a.link-external:link::after, h5 a.link-arrow:link::after, h5 a.link-arrow-up:link::after, h5 a.link-arrow-down:link::after, h5 a.link-arrow-right:link::after, h5 a.link-chevron:link::after, h5 a.link-chevron-up:link::after, h5 a.link-chevron-right:link::after, h5 a.link-chevron-down:link::after, h5 a.link-chevron-circle:link::after, h5 a.link-chevron-circle-right:link::after, h5 a.link-play:link::after, h5 a.linkexternal:visited::after, h5 a.link-external:visited::after, h5 a.link-arrow:visited::after, h5 a.link-arrow-up:visited::after, h5 a.link-arrow-down:visited::after, h5 a.link-arrow-right:visited::after, h5 a.link-chevron:visited::after, h5 a.link-chevron-up:visited::after, h5 a.link-chevron-right:visited::after, h5 a.link-chevron-down:visited::after, h5 a.link-chevron-circle:visited::after, h5 a.link-chevron-circle-right:visited::after, h5 a.link-play:visited::after, h5 a.linkexternal:hover::after, h5 a.link-external:hover::after, h5 a.link-arrow:hover::after, h5 a.link-arrow-up:hover::after, h5 a.link-arrow-down:hover::after, h5 a.link-arrow-right:hover::after, h5 a.link-chevron:hover::after, h5 a.link-chevron-up:hover::after, h5 a.link-chevron-right:hover::after, h5 a.link-chevron-down:hover::after, h5 a.link-chevron-circle:hover::after, h5 a.link-chevron-circle-right:hover::after, h5 a.link-play:hover::after, h5 a.linkexternal:active::after, h5 a.link-external:active::after, h5 a.link-arrow:active::after, h5 a.link-arrow-up:active::after, h5 a.link-arrow-down:active::after, h5 a.link-arrow-right:active::after, h5 a.link-chevron:active::after, h5 a.link-chevron-up:active::after, h5 a.link-chevron-right:active::after, h5 a.link-chevron-down:active::after, h5 a.link-chevron-circle:active::after, h5 a.link-chevron-circle-right:active::after, h5 a.link-play:active::after, h5 a.linkexternal:focus::after, h5 a.link-external:focus::after, h5 a.link-arrow:focus::after, h5 a.link-arrow-up:focus::after, h5 a.link-arrow-down:focus::after, h5 a.link-arrow-right:focus::after, h5 a.link-chevron:focus::after, h5 a.link-chevron-up:focus::after, h5 a.link-chevron-right:focus::after, h5 a.link-chevron-down:focus::after, h5 a.link-chevron-circle:focus::after, h5 a.link-chevron-circle-right:focus::after, h5 a.link-play:focus::after, h6 a.linkexternal::after, h6 a.link-external::after, h6 a.link-arrow::after, h6 a.link-arrow-up::after, h6 a.link-arrow-down::after, h6 a.link-arrow-right::after, h6 a.link-chevron::after, h6 a.link-chevron-up::after, h6 a.link-chevron-right::after, h6 a.link-chevron-down::after, h6 a.link-chevron-circle::after, h6 a.link-chevron-circle-right::after, h6 a.link-play::after, h6 a.linkexternal:link::after, h6 a.link-external:link::after, h6 a.link-arrow:link::after, h6 a.link-arrow-up:link::after, h6 a.link-arrow-down:link::after, h6 a.link-arrow-right:link::after, h6 a.link-chevron:link::after, h6 a.link-chevron-up:link::after, h6 a.link-chevron-right:link::after, h6 a.link-chevron-down:link::after, h6 a.link-chevron-circle:link::after, h6 a.link-chevron-circle-right:link::after, h6 a.link-play:link::after, h6 a.linkexternal:visited::after, h6 a.link-external:visited::after, h6 a.link-arrow:visited::after, h6 a.link-arrow-up:visited::after, h6 a.link-arrow-down:visited::after, h6 a.link-arrow-right:visited::after, h6 a.link-chevron:visited::after, h6 a.link-chevron-up:visited::after, h6 a.link-chevron-right:visited::after, h6 a.link-chevron-down:visited::after, h6 a.link-chevron-circle:visited::after, h6 a.link-chevron-circle-right:visited::after, h6 a.link-play:visited::after, h6 a.linkexternal:hover::after, h6 a.link-external:hover::after, h6 a.link-arrow:hover::after, h6 a.link-arrow-up:hover::after, h6 a.link-arrow-down:hover::after, h6 a.link-arrow-right:hover::after, h6 a.link-chevron:hover::after, h6 a.link-chevron-up:hover::after, h6 a.link-chevron-right:hover::after, h6 a.link-chevron-down:hover::after, h6 a.link-chevron-circle:hover::after, h6 a.link-chevron-circle-right:hover::after, h6 a.link-play:hover::after, h6 a.linkexternal:active::after, h6 a.link-external:active::after, h6 a.link-arrow:active::after, h6 a.link-arrow-up:active::after, h6 a.link-arrow-down:active::after, h6 a.link-arrow-right:active::after, h6 a.link-chevron:active::after, h6 a.link-chevron-up:active::after, h6 a.link-chevron-right:active::after, h6 a.link-chevron-down:active::after, h6 a.link-chevron-circle:active::after, h6 a.link-chevron-circle-right:active::after, h6 a.link-play:active::after, h6 a.linkexternal:focus::after, h6 a.link-external:focus::after, h6 a.link-arrow:focus::after, h6 a.link-arrow-up:focus::after, h6 a.link-arrow-down:focus::after, h6 a.link-arrow-right:focus::after, h6 a.link-chevron:focus::after, h6 a.link-chevron-up:focus::after, h6 a.link-chevron-right:focus::after, h6 a.link-chevron-down:focus::after, h6 a.link-chevron-circle:focus::after, h6 a.link-chevron-circle-right:focus::after, h6 a.link-play:focus::after { margin-top: -2px; font-size: 65% !important; } h1 a.link-arrow-left::before, h1 a.link-chevron-left::before, h1 a.link-chevron-circle-left::before, h1 a.link-email::before, h1 a.link-arrow-left:link::before, h1 a.link-chevron-left:link::before, h1 a.link-chevron-circle-left:link::before, h1 a.link-email:link::before, h1 a.link-arrow-left:visited::before, h1 a.link-chevron-left:visited::before, h1 a.link-chevron-circle-left:visited::before, h1 a.link-email:visited::before, h1 a.link-arrow-left:hover::before, h1 a.link-chevron-left:hover::before, h1 a.link-chevron-circle-left:hover::before, h1 a.link-email:hover::before, h1 a.link-arrow-left:active::before, h1 a.link-chevron-left:active::before, h1 a.link-chevron-circle-left:active::before, h1 a.link-email:active::before, h1 a.link-arrow-left:focus::before, h1 a.link-chevron-left:focus::before, h1 a.link-chevron-circle-left:focus::before, h1 a.link-email:focus::before, h2 a.link-arrow-left::before, h2 a.link-chevron-left::before, h2 a.link-chevron-circle-left::before, h2 a.link-email::before, h2 a.link-arrow-left:link::before, h2 a.link-chevron-left:link::before, h2 a.link-chevron-circle-left:link::before, h2 a.link-email:link::before, h2 a.link-arrow-left:visited::before, h2 a.link-chevron-left:visited::before, h2 a.link-chevron-circle-left:visited::before, h2 a.link-email:visited::before, h2 a.link-arrow-left:hover::before, h2 a.link-chevron-left:hover::before, h2 a.link-chevron-circle-left:hover::before, h2 a.link-email:hover::before, h2 a.link-arrow-left:active::before, h2 a.link-chevron-left:active::before, h2 a.link-chevron-circle-left:active::before, h2 a.link-email:active::before, h2 a.link-arrow-left:focus::before, h2 a.link-chevron-left:focus::before, h2 a.link-chevron-circle-left:focus::before, h2 a.link-email:focus::before, h3 a.link-arrow-left::before, h3 a.link-chevron-left::before, h3 a.link-chevron-circle-left::before, h3 a.link-email::before, h3 a.link-arrow-left:link::before, h3 a.link-chevron-left:link::before, h3 a.link-chevron-circle-left:link::before, h3 a.link-email:link::before, h3 a.link-arrow-left:visited::before, h3 a.link-chevron-left:visited::before, h3 a.link-chevron-circle-left:visited::before, h3 a.link-email:visited::before, h3 a.link-arrow-left:hover::before, h3 a.link-chevron-left:hover::before, h3 a.link-chevron-circle-left:hover::before, h3 a.link-email:hover::before, h3 a.link-arrow-left:active::before, h3 a.link-chevron-left:active::before, h3 a.link-chevron-circle-left:active::before, h3 a.link-email:active::before, h3 a.link-arrow-left:focus::before, h3 a.link-chevron-left:focus::before, h3 a.link-chevron-circle-left:focus::before, h3 a.link-email:focus::before, h4 a.link-arrow-left::before, h4 a.link-chevron-left::before, h4 a.link-chevron-circle-left::before, h4 a.link-email::before, h4 a.link-arrow-left:link::before, h4 a.link-chevron-left:link::before, h4 a.link-chevron-circle-left:link::before, h4 a.link-email:link::before, h4 a.link-arrow-left:visited::before, h4 a.link-chevron-left:visited::before, h4 a.link-chevron-circle-left:visited::before, h4 a.link-email:visited::before, h4 a.link-arrow-left:hover::before, h4 a.link-chevron-left:hover::before, h4 a.link-chevron-circle-left:hover::before, h4 a.link-email:hover::before, h4 a.link-arrow-left:active::before, h4 a.link-chevron-left:active::before, h4 a.link-chevron-circle-left:active::before, h4 a.link-email:active::before, h4 a.link-arrow-left:focus::before, h4 a.link-chevron-left:focus::before, h4 a.link-chevron-circle-left:focus::before, h4 a.link-email:focus::before, h5 a.link-arrow-left::before, h5 a.link-chevron-left::before, h5 a.link-chevron-circle-left::before, h5 a.link-email::before, h5 a.link-arrow-left:link::before, h5 a.link-chevron-left:link::before, h5 a.link-chevron-circle-left:link::before, h5 a.link-email:link::before, h5 a.link-arrow-left:visited::before, h5 a.link-chevron-left:visited::before, h5 a.link-chevron-circle-left:visited::before, h5 a.link-email:visited::before, h5 a.link-arrow-left:hover::before, h5 a.link-chevron-left:hover::before, h5 a.link-chevron-circle-left:hover::before, h5 a.link-email:hover::before, h5 a.link-arrow-left:active::before, h5 a.link-chevron-left:active::before, h5 a.link-chevron-circle-left:active::before, h5 a.link-email:active::before, h5 a.link-arrow-left:focus::before, h5 a.link-chevron-left:focus::before, h5 a.link-chevron-circle-left:focus::before, h5 a.link-email:focus::before, h6 a.link-arrow-left::before, h6 a.link-chevron-left::before, h6 a.link-chevron-circle-left::before, h6 a.link-email::before, h6 a.link-arrow-left:link::before, h6 a.link-chevron-left:link::before, h6 a.link-chevron-circle-left:link::before, h6 a.link-email:link::before, h6 a.link-arrow-left:visited::before, h6 a.link-chevron-left:visited::before, h6 a.link-chevron-circle-left:visited::before, h6 a.link-email:visited::before, h6 a.link-arrow-left:hover::before, h6 a.link-chevron-left:hover::before, h6 a.link-chevron-circle-left:hover::before, h6 a.link-email:hover::before, h6 a.link-arrow-left:active::before, h6 a.link-chevron-left:active::before, h6 a.link-chevron-circle-left:active::before, h6 a.link-email:active::before, h6 a.link-arrow-left:focus::before, h6 a.link-chevron-left:focus::before, h6 a.link-chevron-circle-left:focus::before, h6 a.link-email:focus::before { margin-top: -2px; font-size: 65% !important; } h1 { font-style: var(--h1-font-style); font-weight: var(--h1-font-weight); font-size: var(--h1-font-size); line-height: var(--h1-line-height); font-family: var(--h1-font-family); color: var(--h1-color); } h1.text-xxl, h1 span.text-xxl { font-size: 175%; } h1.text-xl, h1 span.text-xl { font-size: 150%; } h1.text-lg, h1 span.text-lg { font-size: 125%; } h1.text-sm, h1 span.text-sm { font-size: 95%; } h1.text-xs, h1 span.text-xs { font-size: 90%; } h1.text-xxs, h1 span.text-xxs { font-size: 85%; } h2 { font-style: var(--h2-font-style); font-weight: var(--h2-font-weight); font-size: var(--h2-font-size); line-height: var(--h2-line-height); font-family: var(--h2-font-family); color: var(--h2-color); } h2.text-xxl, h2 span.text-xxl { font-size: 175%; } h2.text-xl, h2 span.text-xl { font-size: 150%; } h2.text-lg, h2 span.text-lg { font-size: 125%; } h2.text-sm, h2 span.text-sm { font-size: 95%; } h2.text-xs, h2 span.text-xs { font-size: 90%; } h2.text-xxs, h2 span.text-xxs { font-size: 85%; } h3 { font-style: var(--h3-font-style); font-weight: var(--h3-font-weight); font-size: var(--h3-font-size); line-height: var(--h3-line-height); font-family: var(--h3-font-family); color: var(--h3-color); } h3.text-xxl, h3 span.text-xxl { font-size: 175%; } h3.text-xl, h3 span.text-xl { font-size: 150%; } h3.text-lg, h3 span.text-lg { font-size: 125%; } h3.text-sm, h3 span.text-sm { font-size: 95%; } h3.text-xs, h3 span.text-xs { font-size: 90%; } h3.text-xxs, h3 span.text-xxs { font-size: 85%; } h4 { font-style: var(--h4-font-style); font-weight: var(--h4-font-weight); font-size: var(--h4-font-size); line-height: var(--h4-line-height); font-family: var(--h4-font-family); color: var(--h4-color); } h4.text-xxl, h4 span.text-xxl { font-size: 175%; } h4.text-xl, h4 span.text-xl { font-size: 150%; } h4.text-lg, h4 span.text-lg { font-size: 125%; } h4.text-sm, h4 span.text-sm { font-size: 95%; } h4.text-xs, h4 span.text-xs { font-size: 90%; } h4.text-xxs, h4 span.text-xxs { font-size: 85%; } h5 { font-style: var(--h5-font-style); font-weight: var(--h5-font-weight); font-size: var(--h5-font-size); line-height: var(--h5-line-height); font-family: var(--h5-font-family); color: var(--h5-color); } h5.text-xxl, h5 span.text-xxl { font-size: 175%; } h5.text-xl, h5 span.text-xl { font-size: 150%; } h5.text-lg, h5 span.text-lg { font-size: 125%; } h5.text-sm, h5 span.text-sm { font-size: 95%; } h5.text-xs, h5 span.text-xs { font-size: 90%; } h5.text-xxs, h5 span.text-xxs { font-size: 85%; } h6 { font-style: var(--h6-font-style); font-weight: var(--h6-font-weight); font-size: var(--h6-font-size); line-height: var(--h6-line-height); font-family: var(--h6-font-family); color: var(--h6-color); } h6.text-xxl, h6 span.text-xxl { font-size: 175%; } h6.text-xl, h6 span.text-xl { font-size: 150%; } h6.text-lg, h6 span.text-lg { font-size: 125%; } h6.text-sm, h6 span.text-sm { font-size: 95%; } h6.text-xs, h6 span.text-xs { font-size: 90%; } h6.text-xxs, h6 span.text-xxs { font-size: 85%; } h6 a.linkexternal::after, h6 a.link-external::after, h6 a.link-arrow::after, h6 a.link-arrow-up::after, h6 a.link-arrow-right::after, h6 a.link-arrow-down::after, h6 a.link-chevron::after, h6 a.link-chevron-up::after, h6 a.link-chevron-right::after, h6 a.link-chevron-down::after, h6 a.link-chevron-circle::after, h6 a.link-chevron-circle-right::after, h6 a.link-play::after, h6 a.linkexternal:link::after, h6 a.link-external:link::after, h6 a.link-arrow:link::after, h6 a.link-arrow-up:link::after, h6 a.link-arrow-right:link::after, h6 a.link-arrow-down:link::after, h6 a.link-chevron:link::after, h6 a.link-chevron-up:link::after, h6 a.link-chevron-right:link::after, h6 a.link-chevron-down:link::after, h6 a.link-chevron-circle:link::after, h6 a.link-chevron-circle-right:link::after, h6 a.link-play:link::after, h6 a.linkexternal:visited::after, h6 a.link-external:visited::after, h6 a.link-arrow:visited::after, h6 a.link-arrow-up:visited::after, h6 a.link-arrow-right:visited::after, h6 a.link-arrow-down:visited::after, h6 a.link-chevron:visited::after, h6 a.link-chevron-up:visited::after, h6 a.link-chevron-right:visited::after, h6 a.link-chevron-down:visited::after, h6 a.link-chevron-circle:visited::after, h6 a.link-chevron-circle-right:visited::after, h6 a.link-play:visited::after, h6 a.linkexternal:hover::after, h6 a.link-external:hover::after, h6 a.link-arrow:hover::after, h6 a.link-arrow-up:hover::after, h6 a.link-arrow-right:hover::after, h6 a.link-arrow-down:hover::after, h6 a.link-chevron:hover::after, h6 a.link-chevron-up:hover::after, h6 a.link-chevron-right:hover::after, h6 a.link-chevron-down:hover::after, h6 a.link-chevron-circle:hover::after, h6 a.link-chevron-circle-right:hover::after, h6 a.link-play:hover::after, h6 a.linkexternal:active::after, h6 a.link-external:active::after, h6 a.link-arrow:active::after, h6 a.link-arrow-up:active::after, h6 a.link-arrow-right:active::after, h6 a.link-arrow-down:active::after, h6 a.link-chevron:active::after, h6 a.link-chevron-up:active::after, h6 a.link-chevron-right:active::after, h6 a.link-chevron-down:active::after, h6 a.link-chevron-circle:active::after, h6 a.link-chevron-circle-right:active::after, h6 a.link-play:active::after, h6 a.linkexternal:focus::after, h6 a.link-external:focus::after, h6 a.link-arrow:focus::after, h6 a.link-arrow-up:focus::after, h6 a.link-arrow-right:focus::after, h6 a.link-arrow-down:focus::after, h6 a.link-chevron:focus::after, h6 a.link-chevron-up:focus::after, h6 a.link-chevron-right:focus::after, h6 a.link-chevron-down:focus::after, h6 a.link-chevron-circle:focus::after, h6 a.link-chevron-circle-right:focus::after, h6 a.link-play:focus::after { font-size: 85% !important; } h6 a.link-arrow-left::before, h6 a.link-chevron-left::before, h6 a.link-chevron-circle-left::before, h6 a.link-email::before, h6 a.link-arrow-left:link::before, h6 a.link-chevron-left:link::before, h6 a.link-chevron-circle-left:link::before, h6 a.link-email:link::before, h6 a.link-arrow-left:visited::before, h6 a.link-chevron-left:visited::before, h6 a.link-chevron-circle-left:visited::before, h6 a.link-email:visited::before, h6 a.link-arrow-left:hover::before, h6 a.link-chevron-left:hover::before, h6 a.link-chevron-circle-left:hover::before, h6 a.link-email:hover::before, h6 a.link-arrow-left:active::before, h6 a.link-chevron-left:active::before, h6 a.link-chevron-circle-left:active::before, h6 a.link-email:active::before, h6 a.link-arrow-left:focus::before, h6 a.link-chevron-left:focus::before, h6 a.link-chevron-circle-left:focus::before, h6 a.link-email:focus::before { font-size: 85% !important; } p { margin: 0px 0px 8px 0px; font-style: var(--p-font-style); font-weight: var(--p-font-weight); font-size: var(--p-font-size); line-height: var(--p-line-height); font-family: var(--p-font-family); color: var(--p-color); } p.text-xxl, p span.text-xxl { font-size: 175%; } p.text-xl, p span.text-xl { font-size: 150%; } p.text-lg, p span.text-lg { font-size: 125%; } p.text-sm, p span.text-sm { font-size: 95%; } p.text-xs, p span.text-xs { font-size: 90%; } p.text-xxs, p span.text-xxs { font-size: 85%; } ul, ol { margin: 10px 0px; padding: 0px; } ul li, ol li { margin: 0px 0px 10px 0px; margin-left: 30px; padding: 0px; padding-left: 10px; font-style: var(--li-font-style); font-weight: var(--li-font-weight); font-size: var(--li-font-size); line-height: var(--li-line-height); font-family: var(--li-font-family); color: var(--li-color); } ul li.text-xxl, ul li span.text-xxl, ol li.text-xxl, ol li span.text-xxl { font-size: 175%; } ul li.text-xl, ul li span.text-xl, ol li.text-xl, ol li span.text-xl { font-size: 150%; } ul li.text-lg, ul li span.text-lg, ol li.text-lg, ol li span.text-lg { font-size: 125%; } ul li.text-sm, ul li span.text-sm, ol li.text-sm, ol li span.text-sm { font-size: 95%; } ul li.text-xs, ul li span.text-xs, ol li.text-xs, ol li span.text-xs { font-size: 90%; } ul li.text-xxs, ul li span.text-xxs, ol li.text-xxs, ol li span.text-xxs { font-size: 85%; } th { padding: var(--th-pt) var(--th-pe) var(--th-pb) var(--th-ps); font-style: var(--th-font-style); font-weight: var(--th-font-weight); font-size: var(--th-font-size); line-height: var(--th-line-height); font-family: var(--th-font-family); color: var(--th-color); background-color: var(--th-bg-color); } th.text-xxl, th span.text-xxl { font-size: 175%; } th.text-xl, th span.text-xl { font-size: 150%; } th.text-lg, th span.text-lg { font-size: 125%; } th.text-sm, th span.text-sm { font-size: 95%; } th.text-xs, th span.text-xs { font-size: 90%; } th.text-xxs, th span.text-xxs { font-size: 85%; } td { padding: var(--td-pt) var(--td-pe) var(--td-pb) var(--td-ps); font-style: var(--td-font-style); font-weight: var(--td-font-weight); font-size: var(--td-font-size); line-height: var(--td-line-height); font-family: var(--td-font-family); color: var(--td-color); background-color: var(--td-bg-color); } td.text-xxl, td span.text-xxl { font-size: 175%; } td.text-xl, td span.text-xl { font-size: 150%; } td.text-lg, td span.text-lg { font-size: 125%; } td.text-sm, td span.text-sm { font-size: 95%; } td.text-xs, td span.text-xs { font-size: 90%; } td.text-xxs, td span.text-xxs { font-size: 85%; } sup { top: 0px; margin-left: 0px; font-weight: var(--fw-400); font-size: 0.625rem; color: inherit; vertical-align: super; } a, a:link, a:visited, a:hover, a:active, a:focus { color: var(--link-color); text-decoration: dotted; cursor: pointer; -webkit-user-drag: none; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } a > svg, a:link > svg, a:visited > svg, a:hover > svg, a:active > svg, a:focus > svg { color: initial !important; } #resultList h3.title a:visited { color: var(--link-color-hover); } a:hover { color: var(--link-color-hover); } #resultList h3.title a:hover { color: var(--link-color-hover); } #pagination a:hover { color: var(--btn-default-color-hover) !important; background-color: var(--btn-default-bg-color-hover) !important; border-color: var(--btn-default-border-color-hover) !important; } a:active { color: var(--link-color-active); } #pagination a:active { color: var(--btn-default-color-active) !important; background-color: var(--btn-default-bg-color-active) !important; border-color: var(--btn-default-border-color-active) !important; } a:focus, button:focus, .btn:focus, .btn:not(:disabled):not(.disabled):active:focus { box-shadow: none; outline: none; /* @include focus; */ } button, button:link, button:visited, button:hover, button:active, button:focus { -webkit-user-drag: none; } label { font-style: var(--label-font-style); font-weight: var(--label-font-weight); font-size: var(--label-font-size); line-height: var(--label-line-height); font-family: var(--label-font-family); color: var(--label-color); } label.text-xxl, label span.text-xxl { font-size: 175%; } label.text-xl, label span.text-xl { font-size: 150%; } label.text-lg, label span.text-lg { font-size: 125%; } label.text-sm, label span.text-sm { font-size: 95%; } label.text-xs, label span.text-xs { font-size: 90%; } label.text-xxs, label span.text-xxs { font-size: 85%; } select { margin: 0px; padding: var(--input-pt) var(--input-pe) var(--input-pb) var(--input-ps); width: auto; height: auto; font-style: var(--input-font-style); font-weight: var(--input-font-weight); font-size: var(--input-font-size); line-height: var(--input-line-height); font-family: var(--input-font-family); color: var(--input-color); background-color: var(--input-bg-color); border: 1px solid var(--input-border-color); border-radius: var(--border-radius); } select:hover { color: var(--input-color-focus); background-color: var(--input-bg-color-focus); border-color: var(--input-border-color-focus); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } select:focus { color: var(--input-color-focus) !important; background-color: var(--input-bg-color-focus) !important; border-color: var(--input-border-color-focus) !important; outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } input { margin: 0px; padding: var(--input-pt) var(--input-pe) var(--input-pb) var(--input-ps); width: auto; height: auto; font-style: var(--input-font-style); font-weight: var(--input-font-weight); font-size: var(--input-font-size); line-height: var(--input-line-height); font-family: var(--input-font-family); color: var(--input-color); background-color: var(--input-bg-color); border: 1px solid var(--input-border-color); border-radius: var(--border-radius); } input::-webkit-input-placeholder { color: var(--gray-90); opacity: 1; } input::-moz-placeholder { color: var(--gray-90); opacity: 1; } input:-ms-input-placeholder { color: var(--gray-90); opacity: 1; } input::-ms-input-placeholder { color: var(--gray-90); opacity: 1; } input::placeholder { color: var(--gray-90); opacity: 1; } input:hover { color: var(--input-color-focus); background-color: var(--input-bg-color-focus); border-color: var(--input-border-color-focus); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } input:focus { color: var(--input-color-focus) !important; background-color: var(--input-bg-color-focus) !important; border-color: var(--input-border-color-focus) !important; outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } input[type=radio], input[type=checkbox] { padding: 0px; } textarea { margin: 0px; padding: var(--input-pt) var(--input-pe) var(--input-pb) var(--input-ps); width: auto; min-height: 50px; height: auto; font-style: var(--input-font-style); font-weight: var(--input-font-weight); font-size: var(--input-font-size); line-height: var(--input-line-height); font-family: var(--input-font-family); color: var(--input-color); background-color: var(--input-bg-color); border: 1px solid var(--input-border-color); border-radius: var(--border-radius); } textarea::-webkit-input-placeholder { color: var(--gray-90); opacity: 1; } textarea::-moz-placeholder { color: var(--gray-90); opacity: 1; } textarea:-ms-input-placeholder { color: var(--gray-90); opacity: 1; } textarea::-ms-input-placeholder { color: var(--gray-90); opacity: 1; } textarea::placeholder { color: var(--gray-90); opacity: 1; } textarea:hover { color: var(--input-color-focus); background-color: var(--input-bg-color-focus); border-color: var(--input-border-color-focus); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } textarea:focus { color: var(--input-color-focus) !important; background-color: var(--input-bg-color-focus) !important; border-color: var(--input-border-color-focus) !important; outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } img { max-width: 100%; height: auto; vertical-align: initial; } hr { margin: 20px 0px; border: 0px; border-top: 1px solid var(--border-color); opacity: 1; } strong { font-weight: var(--fw-600); } section { position: relative; margin: 0px; padding: 30px 0px; } section::before, section::after { position: absolute; content: ""; pointer-events: none; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ @media (max-width: 575.98px) { /* HTML STYLES ---------------------------------------------------------------------------------------------------- */ h1 { font-size: var(--h1-font-size-mobile); line-height: var(--h1-line-height-mobile); } h2 { font-size: var(--h2-font-size-mobile); line-height: var(--h2-line-height-mobile); } h3 { font-size: var(--h3-font-size-mobile); line-height: var(--h3-line-height-mobile); } h4 { font-size: var(--h4-font-size-mobile); line-height: var(--h4-line-height-mobile); } h5 { font-size: var(--h5-font-size-mobile); line-height: var(--h5-line-height-mobile); } h6 { font-size: var(--h6-font-size-mobile); line-height: var(--h6-line-height-mobile); } } /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ @media (min-width: 576px) and (max-width: 767.98px) { /* HTML STYLES ---------------------------------------------------------------------------------------------------- */ h1 { font-size: var(--h1-font-size-mobile); line-height: var(--h1-line-height-mobile); } h2 { font-size: var(--h2-font-size-mobile); line-height: var(--h2-line-height-mobile); } h3 { font-size: var(--h3-font-size-mobile); line-height: var(--h3-line-height-mobile); } h4 { font-size: var(--h4-font-size-mobile); line-height: var(--h4-line-height-mobile); } h5 { font-size: var(--h5-font-size-mobile); line-height: var(--h5-line-height-mobile); } h6 { font-size: var(--h6-font-size-mobile); line-height: var(--h6-line-height-mobile); } } /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* CUSTOM | ANCHOR LINK ---------------------------------------------------------------------------------------------------- */ a.link-generic, a.link-generic:link, a.link-generic:visited, a.link-generic:hover, a.link-generic:active, a.link-generic:focus { text-decoration: dotted; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; cursor: pointer; } a.linkexternal, a.link-external, a.link-arrow, a.link-arrow-up, a.link-arrow-right, a.link-arrow-down, a.link-chevron, a.link-chevron-up, a.link-chevron-right, a.link-chevron-down, a.link-chevron-circle, a.link-chevron-circle-right, a.link-play, a.linkexternal:link, a.link-external:link, a.link-arrow:link, a.link-arrow-up:link, a.link-arrow-right:link, a.link-arrow-down:link, a.link-chevron:link, a.link-chevron-up:link, a.link-chevron-right:link, a.link-chevron-down:link, a.link-chevron-circle:link, a.link-chevron-circle-right:link, a.link-play:link, a.linkexternal:visited, a.link-external:visited, a.link-arrow:visited, a.link-arrow-up:visited, a.link-arrow-right:visited, a.link-arrow-down:visited, a.link-chevron:visited, a.link-chevron-up:visited, a.link-chevron-right:visited, a.link-chevron-down:visited, a.link-chevron-circle:visited, a.link-chevron-circle-right:visited, a.link-play:visited, a.linkexternal:hover, a.link-external:hover, a.link-arrow:hover, a.link-arrow-up:hover, a.link-arrow-right:hover, a.link-arrow-down:hover, a.link-chevron:hover, a.link-chevron-up:hover, a.link-chevron-right:hover, a.link-chevron-down:hover, a.link-chevron-circle:hover, a.link-chevron-circle-right:hover, a.link-play:hover, a.linkexternal:active, a.link-external:active, a.link-arrow:active, a.link-arrow-up:active, a.link-arrow-right:active, a.link-arrow-down:active, a.link-chevron:active, a.link-chevron-up:active, a.link-chevron-right:active, a.link-chevron-down:active, a.link-chevron-circle:active, a.link-chevron-circle-right:active, a.link-play:active, a.linkexternal:focus, a.link-external:focus, a.link-arrow:focus, a.link-arrow-up:focus, a.link-arrow-right:focus, a.link-arrow-down:focus, a.link-chevron:focus, a.link-chevron-up:focus, a.link-chevron-right:focus, a.link-chevron-down:focus, a.link-chevron-circle:focus, a.link-chevron-circle-right:focus, a.link-play:focus { padding-right: 12px; } a.linkexternal::after, a.link-external::after, a.link-arrow::after, a.link-arrow-up::after, a.link-arrow-right::after, a.link-arrow-down::after, a.link-chevron::after, a.link-chevron-up::after, a.link-chevron-right::after, a.link-chevron-down::after, a.link-chevron-circle::after, a.link-chevron-circle-right::after, a.link-play::after, a.linkexternal:link::after, a.link-external:link::after, a.link-arrow:link::after, a.link-arrow-up:link::after, a.link-arrow-right:link::after, a.link-arrow-down:link::after, a.link-chevron:link::after, a.link-chevron-up:link::after, a.link-chevron-right:link::after, a.link-chevron-down:link::after, a.link-chevron-circle:link::after, a.link-chevron-circle-right:link::after, a.link-play:link::after, a.linkexternal:visited::after, a.link-external:visited::after, a.link-arrow:visited::after, a.link-arrow-up:visited::after, a.link-arrow-right:visited::after, a.link-arrow-down:visited::after, a.link-chevron:visited::after, a.link-chevron-up:visited::after, a.link-chevron-right:visited::after, a.link-chevron-down:visited::after, a.link-chevron-circle:visited::after, a.link-chevron-circle-right:visited::after, a.link-play:visited::after, a.linkexternal:hover::after, a.link-external:hover::after, a.link-arrow:hover::after, a.link-arrow-up:hover::after, a.link-arrow-right:hover::after, a.link-arrow-down:hover::after, a.link-chevron:hover::after, a.link-chevron-up:hover::after, a.link-chevron-right:hover::after, a.link-chevron-down:hover::after, a.link-chevron-circle:hover::after, a.link-chevron-circle-right:hover::after, a.link-play:hover::after, a.linkexternal:active::after, a.link-external:active::after, a.link-arrow:active::after, a.link-arrow-up:active::after, a.link-arrow-right:active::after, a.link-arrow-down:active::after, a.link-chevron:active::after, a.link-chevron-up:active::after, a.link-chevron-right:active::after, a.link-chevron-down:active::after, a.link-chevron-circle:active::after, a.link-chevron-circle-right:active::after, a.link-play:active::after, a.linkexternal:focus::after, a.link-external:focus::after, a.link-arrow:focus::after, a.link-arrow-up:focus::after, a.link-arrow-right:focus::after, a.link-arrow-down:focus::after, a.link-chevron:focus::after, a.link-chevron-up:focus::after, a.link-chevron-right:focus::after, a.link-chevron-down:focus::after, a.link-chevron-circle:focus::after, a.link-chevron-circle-right:focus::after, a.link-play:focus::after { position: relative; right: -8px; font-size: 90%; white-space: nowrap; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } a.link-arrow-left, a.link-chevron-left, a.link-chevron-circle-left, a.link-email, a.link-arrow-left:link, a.link-chevron-left:link, a.link-chevron-circle-left:link, a.link-email:link, a.link-arrow-left:visited, a.link-chevron-left:visited, a.link-chevron-circle-left:visited, a.link-email:visited, a.link-arrow-left:hover, a.link-chevron-left:hover, a.link-chevron-circle-left:hover, a.link-email:hover, a.link-arrow-left:active, a.link-chevron-left:active, a.link-chevron-circle-left:active, a.link-email:active, a.link-arrow-left:focus, a.link-chevron-left:focus, a.link-chevron-circle-left:focus, a.link-email:focus { padding-left: 12px; } a.link-arrow-left::before, a.link-chevron-left::before, a.link-chevron-circle-left::before, a.link-email::before, a.link-arrow-left:link::before, a.link-chevron-left:link::before, a.link-chevron-circle-left:link::before, a.link-email:link::before, a.link-arrow-left:visited::before, a.link-chevron-left:visited::before, a.link-chevron-circle-left:visited::before, a.link-email:visited::before, a.link-arrow-left:hover::before, a.link-chevron-left:hover::before, a.link-chevron-circle-left:hover::before, a.link-email:hover::before, a.link-arrow-left:active::before, a.link-chevron-left:active::before, a.link-chevron-circle-left:active::before, a.link-email:active::before, a.link-arrow-left:focus::before, a.link-chevron-left:focus::before, a.link-chevron-circle-left:focus::before, a.link-email:focus::before { position: relative; left: -8px; font-size: 90%; white-space: nowrap; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } a.link-arrow-up::after, a.link-chevron-up::after, a.link-arrow-up:link::after, a.link-chevron-up:link::after, a.link-arrow-up:visited::after, a.link-chevron-up:visited::after, a.link-arrow-up:hover::after, a.link-chevron-up:hover::after, a.link-arrow-up:active::after, a.link-chevron-up:active::after, a.link-arrow-up:focus::after, a.link-chevron-up:focus::after { top: -2px; } a.link-arrow-down::after, a.link-chevron-down::after, a.link-arrow-down:link::after, a.link-chevron-down:link::after, a.link-arrow-down:visited::after, a.link-chevron-down:visited::after, a.link-arrow-down:hover::after, a.link-chevron-down:hover::after, a.link-arrow-down:active::after, a.link-chevron-down:active::after, a.link-arrow-down:focus::after, a.link-chevron-down:focus::after { top: 2px; } a.link-arrow::after, a.link-arrow:link::after, a.link-arrow:visited::after, a.link-arrow:hover::after, a.link-arrow:active::after, a.link-arrow:focus::after { content: var(--fa-arrow-start); } a.link-arrow-up::after, a.link-arrow-up:link::after, a.link-arrow-up:visited::after, a.link-arrow-up:hover::after, a.link-arrow-up:active::after, a.link-arrow-up:focus::after { content: "\f062"; } a.link-arrow-right::after, a.link-arrow-right:link::after, a.link-arrow-right:visited::after, a.link-arrow-right:hover::after, a.link-arrow-right:active::after, a.link-arrow-right:focus::after { content: var(--fa-arrow-start); } a.link-arrow-down::after, a.link-arrow-down:link::after, a.link-arrow-down:visited::after, a.link-arrow-down:hover::after, a.link-arrow-down:active::after, a.link-arrow-down:focus::after { content: "\f063"; } a.link-arrow-left::before, a.link-arrow-left:link::before, a.link-arrow-left:visited::before, a.link-arrow-left:hover::before, a.link-arrow-left:active::before, a.link-arrow-left:focus::before { content: var(--fa-arrow-end); } a.link-chevron::after, a.link-chevron:link::after, a.link-chevron:visited::after, a.link-chevron:hover::after, a.link-chevron:active::after, a.link-chevron:focus::after { content: var(--fa-chevron-start); } a.link-chevron-up::after, a.link-chevron-up:link::after, a.link-chevron-up:visited::after, a.link-chevron-up:hover::after, a.link-chevron-up:active::after, a.link-chevron-up:focus::after { content: "\f077"; } a.link-chevron-right::after, a.link-chevron-right:link::after, a.link-chevron-right:visited::after, a.link-chevron-right:hover::after, a.link-chevron-right:active::after, a.link-chevron-right:focus::after { content: var(--fa-chevron-start); } a.link-chevron-down::after, a.link-chevron-down:link::after, a.link-chevron-down:visited::after, a.link-chevron-down:hover::after, a.link-chevron-down:active::after, a.link-chevron-down:focus::after { content: "\f078"; } a.link-chevron-left::before, a.link-chevron-left:link::before, a.link-chevron-left:visited::before, a.link-chevron-left:hover::before, a.link-chevron-left:active::before, a.link-chevron-left:focus::before { content: var(--fa-chevron-end); } a.link-chevron-circle::after, a.link-chevron-circle:link::after, a.link-chevron-circle:visited::after, a.link-chevron-circle:hover::after, a.link-chevron-circle:active::after, a.link-chevron-circle:focus::after { content: var(--fa-chevron-circle-start); } a.link-chevron-circle-right::after, a.link-chevron-circle-right:link::after, a.link-chevron-circle-right:visited::after, a.link-chevron-circle-right:hover::after, a.link-chevron-circle-right:active::after, a.link-chevron-circle-right:focus::after { content: var(--fa-chevron-circle-start); } a.link-chevron-circle-left::before, a.link-chevron-circle-left:link::before, a.link-chevron-circle-left:visited::before, a.link-chevron-circle-left:hover::before, a.link-chevron-circle-left:active::before, a.link-chevron-circle-left:focus::before { content: var(--fa-chevron-circle-end); } a.link-email::before, a.link-email:link::before, a.link-email:visited::before, a.link-email:hover::before, a.link-email:active::before, a.link-email:focus::before { content: "\f0e0"; } a.link-play::after, a.link-play:link::after, a.link-play:visited::after, a.link-play:hover::after, a.link-play:active::after, a.link-play:focus::after { content: "\f144"; } a.link-external::after, a.linkexternal::after, a.link-external:link::after, a.linkexternal:link::after, a.link-external:visited::after, a.linkexternal:visited::after, a.link-external:hover::after, a.linkexternal:hover::after, a.link-external:active::after, a.linkexternal:active::after, a.link-external:focus::after, a.linkexternal:focus::after { content: "\f35d"; } a.link-arrow:hover::after, a.link-arrow-right:hover::after, a.link-chevron:hover::after, a.link-chevron-up:hover::after, a.link-chevron-right:hover::after, a.link-chevron-down:hover::after, a.link-chevron-circle:hover::after, a.link-chevron-circle-right:hover::after { right: -16px; } a.link-arrow-left:hover::before, a.link-chevron-left:hover::before, a.link-chevron-circle-left:hover::before { left: -16px; } a.link-arrow-up:hover::after, a.link-chevron-up:hover::after { top: -8px; right: -8px; } a.link-arrow-down:hover::after, a.link-chevron-down:hover::after { top: 8px; right: -8px; } a.link-generic:focus, a.linkexternal:focus, a.link-external:focus, a.link-arrow:focus, a.link-arrow-up:focus, a.link-arrow-right:focus, a.link-arrow-down:focus, a.link-chevron:focus, a.link-chevron-up:focus, a.link-chevron-right:focus, a.link-chevron-down:focus, a.link-chevron-circle:focus, a.link-chevron-circle-right:focus, a.link-play:focus, a.link-arrow-left:focus, a.link-chevron-left:focus, a.link-chevron-circle-left:focus, a.link-email:focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } [dir=rtl] a.link-external::after, [dir=rtl] a.linkexternal::after, [dir=rtl] a.link-external:link::after, [dir=rtl] a.linkexternal:link::after, [dir=rtl] a.link-external:visited::after, [dir=rtl] a.linkexternal:visited::after, [dir=rtl] a.link-external:hover::after, [dir=rtl] a.linkexternal:hover::after, [dir=rtl] a.link-external:active::after, [dir=rtl] a.linkexternal:active::after, [dir=rtl] a.link-external:focus::after, [dir=rtl] a.linkexternal:focus::after { transform: scaleX(-1); } [dir=rtl] a.link-external:hover::after, [dir=rtl] a.link-arrow:hover::after, [dir=rtl] a.link-arrow-right:hover::after, [dir=rtl] a.link-chevron:hover::after, [dir=rtl] a.link-chevron-up:hover::after, [dir=rtl] a.link-chevron-right:hover::after, [dir=rtl] a.link-chevron-down:hover::after, [dir=rtl] a.link-chevron-circle:hover::after, [dir=rtl] a.link-chevron-circle-right:hover::after, [dir=rtl] a.link-play:hover::after { translate: -4px 0px; } [dir=rtl] a.link-arrow-left:hover::before, [dir=rtl] a.link-chevron-left:hover::before, [dir=rtl] a.link-chevron-circle-left:hover::before, [dir=rtl] a.link-email:hover::before { translate: 4px 0px; } /* CUSTOM | BORDER ---------------------------------------------------------------------------------------------------- */ .border-none, .no-border, .border-0, .b-0 { border: none !important; } .border-top-none, .no-border-top, .border-top-0, .bt-0 { border-top: none !important; } .border-right-none, .no-border-right, .border-right-0, .br-0, .border-end-0, .be-0 { border-right: none !important; } .border-bottom-none, .no-border-bottom, .border-bottom-0, .bb-0 { border-bottom: none !important; } .border-left-none, .no-border-left, .border-left-0, .bl-0, .border-start-0, .bs-0 { border-left: none !important; } .border-all, .b-solid, .b-1 { border: 1px solid var(--border-color); } .border-top, .bt-solid, .bt-1 { border-top: 1px solid var(--border-color); } .border-right, .br-solid, .be-solid, .br-1, .be-1 { border-right: 1px solid var(--border-color); } .border-bottom, .bb-solid, .bb-1 { border-bottom: 1px solid var(--border-color); } .border-left, .bl-solid, .bs-solid, .bl-1, .bs-1 { border-left: 1px solid var(--border-color); } .border-dashed, .b-dashed, .b-da-1 { border: 1px dashed var(--border-color); } .border-top-dashed, .bt-dashed, .bt-da-1 { border-top: 1px dashed var(--border-color); } .border-right-dashed, .br-dashed, .be-dashed, .br-da-1, .be-da-1 { border-right: 1px dashed var(--border-color); } .border-bottom-dashed, .bb-dashed, .bb-da-1 { border-bottom: 1px dashed var(--border-color); } .border-left-dashed, .bl-dashed, .bs-dashed, .bl-da-1, .bs-da-1 { border-left: 1px dashed var(--border-color); } .border-dotted, .b-dotted, .b-do-1 { border: 1px dotted var(--border-color); } .border-top-dotted, .bt-dotted, .bt-do-1 { border-top: 1px dotted var(--border-color); } .border-right-dotted, .br-dotted, .be-dotted, .br-do-1, .be-do-1 { border-right: 1px dotted var(--border-color); } .border-bottom-dotted, .bb-dotted, .bb-do-1 { border-bottom: 1px dotted var(--border-color); } .border-left-dotted, .bl-dotted, .bs-dotted, .bl-do-1, .bs-do-1 { border-left: 1px dotted var(--border-color); } [data-theme=light] .b-1-d-dark { border: 1px solid transparent; } [data-theme=light] .bt-1-d-dark { border-top: 1px solid transparent; } [data-theme=light] .be-1-d-dark { border-right: 1px solid transparent; } [data-theme=light] .bb-1-d-dark { border-bottom: 1px solid transparent; } [data-theme=light] .bs-1-d-dark { border-left: 1px solid transparent; } [data-theme=dark] .b-1-d-dark { border: 1px solid var(--border-color); } [data-theme=dark] .bt-1-d-dark { border-top: 1px solid var(--border-color); } [data-theme=dark] .be-1-d-dark { border-right: 1px solid var(--border-color); } [data-theme=dark] .bb-1-d-dark { border-bottom: 1px solid var(--border-color); } [data-theme=dark] .bs-1-d-dark { border-left: 1px solid var(--border-color); } /* CUSTOM | BORDER RADIUS ---------------------------------------------------------------------------------------------------- */ .br-0 { border-radius: 0px; } .br-1 { border-radius: 1px; } .br-2 { border-radius: 2px; } .br-3 { border-radius: 3px; } .br-4 { border-radius: 4px; } .br-5 { border-radius: 5px; } .br-6 { border-radius: 6px; } .br-7 { border-radius: 7px; } .br-8 { border-radius: 8px; } .br-9 { border-radius: 9px; } .br-10 { border-radius: 10px; } .br-11 { border-radius: 11px; } .br-12 { border-radius: 12px; } .br-13 { border-radius: 13px; } .br-14 { border-radius: 14px; } .br-15 { border-radius: 15px; } .br-16 { border-radius: 16px; } .br-17 { border-radius: 17px; } .br-18 { border-radius: 18px; } .br-19 { border-radius: 19px; } .br-20 { border-radius: 20px; } .rounded-xl, .rounded-4 { border-radius: 15px; } /* CUSTOM | BOX SHADOW ---------------------------------------------------------------------------------------------------- */ .box-shadow { box-shadow: var(--box-shadow); } /* CUSTOM | CLEAR ---------------------------------------------------------------------------------------------------- */ .clearfix, .clear, .cf { clear: both; } input::-ms-clear { display: none; } /* CUSTOM | CURSORS ---------------------------------------------------------------------------------------------------- */ .cursor-alias { cursor: alias; } .cursor-all-scroll { cursor: all-scroll; } .cursor-auto { cursor: auto; } .cursor-cell { cursor: cell; } .cursor-col-resize { cursor: col-resize; } .cursor-context-menu { cursor: context-menu; } .cursor-copy { cursor: copy; } .cursor-crosshair { cursor: crosshair; } .cursor-default { cursor: default; } .cursor-e-resize { cursor: e-resize; } .cursor-ew-resize { cursor: ew-resize; } .cursor-grab { cursor: grab; } .cursor-grabbing { cursor: grabbing; } .cursor-help { cursor: help; } .cursor-move { cursor: move; } .cursor-n-resize { cursor: n-resize; } .cursor-ne-resize { cursor: ne-resize; } .cursor-nesw-resize { cursor: nesw-resize; } .cursor-ns-resize { cursor: ns-resize; } .cursor-nw-resize { cursor: nw-resize; } .cursor-nwse-resize { cursor: nwse-resize; } .cursor-no-drop { cursor: no-drop; } .cursor-none { cursor: none; } .cursor-not-allowed { cursor: not-allowed; } .cursor-pointer { cursor: pointer; } .cursor-progress { cursor: progress; } .cursor-row-resize { cursor: row-resize; } .cursor-s-resize { cursor: s-resize; } .cursor-se-resize { cursor: se-resize; } .cursor-sw-resize { cursor: sw-resize; } .cursor-text { cursor: text; } .cursor-w-resize { cursor: w-resize; } .cursor-wait { cursor: wait; } .cursor-zoom-in { cursor: zoom-in; } .cursor-zoom-out { cursor: zoom-out; } .no-click { pointer-events: none; } /* CUSTOM | DIRECTION ---------------------------------------------------------------------------------------------------- */ .dir-ltr { direction: ltr !important; } .dir-rtl { direction: rtl !important; } .dir-inherit { direction: inherit !important; } .dir-initial { direction: initial !important; } .dir-revert { direction: revert !important; } .dir-revert-layer { direction: revert-layer !important; } .dir-unset { direction: unset !important; } /* CUSTOM | DISABLED ---------------------------------------------------------------------------------------------------- */ .disabled { opacity: 0.5 !important; cursor: not-allowed !important; pointer-events: none !important; } /* CUSTOM | DROP SHADOW ---------------------------------------------------------------------------------------------------- */ .drop-shadow-xs { filter: drop-shadow(0px 3px 3px hsla(0, 0%, 0%, 0.1)); } .drop-shadow-sm { filter: drop-shadow(0px 3px 7px hsla(0, 0%, 0%, 0.15)); } .drop-shadow { filter: drop-shadow(0px 6px 10px hsla(0, 0%, 0%, 0.2)); } .drop-shadow-lg { filter: drop-shadow(0px 10px 20px hsla(0, 0%, 0%, 0.25)); } .drop-shadow-xl { filter: drop-shadow(0px 20px 30px hsla(0, 0%, 0%, 0.35)); } /* CUSTOM | FA BULLET LISTS ---------------------------------------------------------------------------------------------------- */ .fa-ol { list-style-type: none; margin-left: 5px; } .fa-ol li { position: relative; margin-bottom: 24px; padding-left: 4px; } .fa-ol li .fa-li.fa-num { position: absolute; left: -32px; padding: 4px 1px 3px 1px; width: 21px; font-weight: var(--fw-600); font-size: 0.875rem; line-height: 0.875rem; text-align: center; background-color: var(--gray-10); border-radius: 20px; } .fa-ul { margin-left: 0px; margin-right: 0px; } .fa-ul > li { position: relative; margin-bottom: 16px; } .fa-ul > li .fa-li { position: absolute; left: -2em; width: 2em; text-align: center; line-height: inherit; } /* CUSTOM | FADEINUP ---------------------------------------------------------------------------------------------------- */ @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } /* CUSTOM | FLOAT ---------------------------------------------------------------------------------------------------- */ .float-left, .float-start { float: var(--dir-start); } .float-right, .float-end { float: var(--dir-end); } /* CUSTOM | IMAGE ---------------------------------------------------------------------------------------------------- */ /* BACKGROUND IMAGE COVER */ .background-img-cover { background-size: cover; background-position: center center; } /* IMAGE CENTER */ .img-center { display: block; margin-left: auto; margin-right: auto; } /* IMAGE LOGO */ .img-logo { width: 100%; max-width: 150px; height: auto; } /* IMAGE HOVER */ a.img-hover > img, a.img-hover:link > img, a.img-hover:visited > img, a.img-hover:hover > img, a.img-hover:active > img, a.img-hover:focus > img { padding: 6px; border: 4px solid var(--white); } a.img-hover:hover > img { border: 4px solid var(--primary); cursor: pointer; } /* CUSTOM | LIST ---------------------------------------------------------------------------------------------------- */ ul.circle { list-style-type: circle; } ul.disc { list-style-type: disc; } ul.square { list-style-type: square; } ul.none, ul.no-list-style { list-style-type: none; } ol.armenian { list-style-type: armenian; } ol.cjk-ideographic { list-style-type: cjk-ideographic; } ol.decimal { list-style-type: decimal; } ol.decimal-leading-zero { list-style-type: decimal-leading-zero; } ol.georgian { list-style-type: georgian; } ol.hebrew { list-style-type: hebrew; } ol.hiragana { list-style-type: hiragana; } ol.hiragana-iroha { list-style-type: hiragana-iroha; } ol.katakana { list-style-type: katakana; } ol.katakana-iroha { list-style-type: katakana-iroha; } ol.lower-alpha { list-style-type: lower-alpha; } ol.lower-greek { list-style-type: lower-greek; } ol.lower-latin { list-style-type: lower-latin; } ol.lower-roman { list-style-type: lower-roman; } ol.upper-alpha { list-style-type: upper-alpha; } ol.upper-greek { list-style-type: upper-greek; } ol.upper-latin { list-style-type: upper-latin; } ol.upper-roman { list-style-type: upper-roman; } ol.none, ol.no-list-style { list-style-type: none; } ul.paralist, ol.paralist { margin: 10px 0px; margin-left: 15px; padding: 0px; } ul.paralist li, ol.paralist li { margin: 0px 0px 20px 0px; padding: 0px; padding-left: 5px; } ul.paralist li ul, ul.paralist li ol, ol.paralist li ul, ol.paralist li ol { margin: 10px 0px; margin-left: 15px; padding: 0px; } ul.checklist, ul.check-list, ul.checklist-circle, ul.check-list-circle, ol.checklist, ol.check-list, ol.checklist-circle, ol.check-list-circle { margin: 0px; padding: 0px; list-style-type: none; } ul.checklist li, ul.check-list li, ul.checklist-circle li, ul.check-list-circle li, ol.checklist li, ol.check-list li, ol.checklist-circle li, ol.check-list-circle li { position: relative; margin: 0px 0px 25px 0px; padding: 0px; padding-left: 30px; } ul.checklist li::before, ul.check-list li::before, ul.checklist-circle li::before, ul.check-list-circle li::before, ol.checklist li::before, ol.check-list li::before, ol.checklist-circle li::before, ol.check-list-circle li::before { display: block; position: absolute; top: 2px; left: 0px; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: "\f00c"; color: var(--primary); } ul.checklist li ul, ul.checklist li ol, ul.check-list li ul, ul.check-list li ol, ul.checklist-circle li ul, ul.checklist-circle li ol, ul.check-list-circle li ul, ul.check-list-circle li ol, ol.checklist li ul, ol.checklist li ol, ol.check-list li ul, ol.check-list li ol, ol.checklist-circle li ul, ol.checklist-circle li ol, ol.check-list-circle li ul, ol.check-list-circle li ol { margin: 10px 0px 0px 0px; margin-left: 20px; padding: 0px; } ul.checklist li ul li, ul.checklist li ol li, ul.check-list li ul li, ul.check-list li ol li, ul.checklist-circle li ul li, ul.checklist-circle li ol li, ul.check-list-circle li ul li, ul.check-list-circle li ol li, ol.checklist li ul li, ol.checklist li ol li, ol.check-list li ul li, ol.check-list li ol li, ol.checklist-circle li ul li, ol.checklist-circle li ol li, ol.check-list-circle li ul li, ol.check-list-circle li ol li { padding: 0px; padding-left: 10px; } ul.checklist li ul li::before, ul.checklist li ol li::before, ul.check-list li ul li::before, ul.check-list li ol li::before, ul.checklist-circle li ul li::before, ul.checklist-circle li ol li::before, ul.check-list-circle li ul li::before, ul.check-list-circle li ol li::before, ol.checklist li ul li::before, ol.checklist li ol li::before, ol.check-list li ul li::before, ol.check-list li ol li::before, ol.checklist-circle li ul li::before, ol.checklist-circle li ol li::before, ol.check-list-circle li ul li::before, ol.check-list-circle li ol li::before { position: relative; content: ""; } ul.checklist-circle li::before, ul.check-list-circle li::before, ol.checklist-circle li::before, ol.check-list-circle li::before { display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: "\f058"; } /* CUSTOM | MARGIN ---------------------------------------------------------------------------------------------------- */ .no-margin, .margin-none, .m-0 { margin: 0px !important; } .margin-5, .m-5 { margin: 5px !important; } .margin-10, .m-10 { margin: 10px !important; } .margin-15, .m-15 { margin: 15px !important; } .margin-20, .m-20 { margin: 20px !important; } .margin-30, .m-30 { margin: 30px !important; } .margin-40, .m-40 { margin: 40px !important; } .margin-50, .m-50 { margin: 50px !important; } .margin-60, .m-60 { margin: 60px !important; } .margin-70, .m-70 { margin: 70px !important; } .margin-80, .m-80 { margin: 80px !important; } .margin-90, .m-90 { margin: 90px !important; } .margin-100, .m-100 { margin: 100px !important; } .margin-top-0, .margin-top-none, .no-margin-top, .mt-0 { margin-top: 0px !important; } .margin-top-5, .mt-5 { margin-top: 5px !important; } .margin-top-10, .mt-10 { margin-top: 10px !important; } .margin-top-15, .mt-15 { margin-top: 15px !important; } .margin-top-20, .mt-20 { margin-top: 20px !important; } .margin-top-30, .mt-30 { margin-top: 30px !important; } .margin-top-40, .mt-40 { margin-top: 40px !important; } .margin-top-50, .mt-50 { margin-top: 50px !important; } .margin-top-60, .mt-60 { margin-top: 60px !important; } .margin-top-70, .mt-70 { margin-top: 70px !important; } .margin-top-80, .mt-80 { margin-top: 80px !important; } .margin-top-90, .mt-90 { margin-top: 90px !important; } .margin-top-100, .mt-100 { margin-top: 100px !important; } .margin-right-0, .margin-right-none, .no-margin-right, .mr-0, .me-0 { margin-right: 0px !important; } .margin-right-5, .mr-5, .me-5 { margin-right: 5px !important; } .margin-right-10, .mr-10, .me-10 { margin-right: 10px !important; } .margin-right-15, .mr-15, .me-15 { margin-right: 15px !important; } .margin-right-20, .mr-20, .me-20 { margin-right: 20px !important; } .margin-right-30, .mr-30, .me-30 { margin-right: 30px !important; } .margin-right-40, .mr-40, .me-40 { margin-right: 40px !important; } .margin-right-50, .mr-50, .me-50 { margin-right: 50px !important; } .margin-right-60, .mr-60, .me-60 { margin-right: 60px !important; } .margin-right-70, .mr-70, .me-70 { margin-right: 70px !important; } .margin-right-80, .mr-80, .me-80 { margin-right: 80px !important; } .margin-right-90, .mr-90, .me-90 { margin-right: 90px !important; } .margin-right-100, .mr-100, .me-100 { margin-right: 100px !important; } .margin-bottom-0, .margin-bottom-none, .no-margin-bottom, .mb-0 { margin-bottom: 0px !important; } .margin-bottom-5, .mb-5 { margin-bottom: 5px !important; } .margin-bottom-10, .mb-10 { margin-bottom: 10px !important; } .margin-bottom-15, .mb-15 { margin-bottom: 15px !important; } .margin-bottom-20, .mb-20 { margin-bottom: 20px !important; } .margin-bottom-30, .mb-30 { margin-bottom: 30px !important; } .margin-bottom-40, .mb-40 { margin-bottom: 40px !important; } .margin-bottom-50, .mb-50 { margin-bottom: 50px !important; } .margin-bottom-60, .mb-60 { margin-bottom: 60px !important; } .margin-bottom-70, .mb-70 { margin-bottom: 70px !important; } .margin-bottom-80, .mb-80 { margin-bottom: 80px !important; } .margin-bottom-90, .mb-90 { margin-bottom: 90px !important; } .margin-bottom-100, .mb-100 { margin-bottom: 100px !important; } .margin-left-0, .margin-left-none, .no-margin-left, .ml-0, .ms-0 { margin-left: 0px !important; } .margin-left-5, .ml-5, .ms-5 { margin-left: 5px !important; } .margin-left-10, .ml-10, .ms-10 { margin-left: 10px !important; } .margin-left-15, .ml-15, .ms-15 { margin-left: 15px !important; } .margin-left-20, .ml-20, .ms-20 { margin-left: 20px !important; } .margin-left-30, .ml-30, .ms-30 { margin-left: 30px !important; } .margin-left-40, .ml-40, .ms-40 { margin-left: 40px !important; } .margin-left-50, .ml-50, .ms-50 { margin-left: 50px !important; } .margin-left-60, .ml-60, .ms-60 { margin-left: 60px !important; } .margin-left-70, .ml-70, .ms-70 { margin-left: 70px !important; } .margin-left-80, .ml-80, .ms-80 { margin-left: 80px !important; } .margin-left-90, .ml-90, .ms-90 { margin-left: 90px !important; } .margin-left-100, .ml-100, .ms-100 { margin-left: 100px !important; } .margin-auto, .m-auto { margin-left: auto !important; margin-right: auto !important; } .margin-right-auto, .mr-auto, .me-auto { margin-right: auto !important; margin-left: initial !important; } .margin-left-auto, .ml-auto, .ms-auto { margin-left: auto !important; margin-right: initial !important; } /* CUSTOM | OVERFLOW ---------------------------------------------------------------------------------------------------- */ .overflow-auto { overflow: auto !important; } .overflow-hidden { overflow: hidden !important; } .overflow-initial { overflow: initial !important; } .overflow-scroll { overflow: scroll !important; } .overflow-visible { overflow: visible !important; } .overflow-x-auto { overflow-x: auto !important; } .overflow-x-hidden { overflow-x: hidden !important; } .overflow-x-initial { overflow-x: initial !important; } .overflow-x-scroll { overflow-x: scroll !important; } .overflow-x-visible { overflow-x: visible !important; } .overflow-y-auto { overflow-y: auto !important; } .overflow-y-hidden { overflow-y: hidden !important; } .overflow-y-initial { overflow-y: initial !important; } .overflow-y-scroll { overflow-y: scroll !important; } .overflow-y-visible { overflow-y: visible !important; } /* CUSTOM | PADDING ---------------------------------------------------------------------------------------------------- */ .no-padding, .padding-none, .p-0 { padding: 0px !important; } .padding-5, .p-5 { padding: 5px !important; } .padding-10, .p-10 { padding: 10px !important; } .padding-15, .p-15 { padding: 15px !important; } .padding-20, .p-20 { padding: 20px !important; } .padding-30, .p-30 { padding: 30px !important; } .padding-40, .p-40 { padding: 40px !important; } .padding-50, .p-50 { padding: 50px !important; } .padding-60, .p-60 { padding: 60px !important; } .padding-70, .p-70 { padding: 70px !important; } .padding-80, .p-80 { padding: 80px !important; } .padding-90, .p-90 { padding: 90px !important; } .padding-100, .p-100 { padding: 100px !important; } .padding-top-0, .padding-top-none, .no-padding-top, .pt-0 { padding-top: 0px !important; } .padding-top-5, .pt-5 { padding-top: 5px !important; } .padding-top-10, .pt-10 { padding-top: 10px !important; } .padding-top-15, .pt-15 { padding-top: 15px !important; } .padding-top-20, .pt-20 { padding-top: 20px !important; } .padding-top-30, .pt-30 { padding-top: 30px !important; } .padding-top-40, .pt-40 { padding-top: 40px !important; } .padding-top-50, .pt-50 { padding-top: 50px !important; } .padding-top-60, .pt-60 { padding-top: 60px !important; } .padding-top-70, .pt-70 { padding-top: 70px !important; } .padding-top-80, .pt-80 { padding-top: 80px !important; } .padding-top-90, .pt-90 { padding-top: 90px !important; } .padding-top-100, .pt-100 { padding-top: 100px !important; } .padding-right-0, .padding-right-none, .no-padding-right, .pr-0, .pe-0 { padding-right: 0px !important; } .padding-right-5, .pr-5, .pe-5 { padding-right: 5px !important; } .padding-right-10, .pr-10, .pe-10 { padding-right: 10px !important; } .padding-right-15, .pr-15, .pe-15 { padding-right: 15px !important; } .padding-right-20, .pr-20, .pe-20 { padding-right: 20px !important; } .padding-right-30, .pr-30, .pe-30 { padding-right: 30px !important; } .padding-right-40, .pr-40, .pe-40 { padding-right: 40px !important; } .padding-right-50, .pr-50, .pe-50 { padding-right: 50px !important; } .padding-right-60, .pr-60, .pe-60 { padding-right: 60px !important; } .padding-right-70, .pr-70, .pe-70 { padding-right: 70px !important; } .padding-right-80, .pr-80, .pe-80 { padding-right: 80px !important; } .padding-right-90, .pr-90, .pe-90 { padding-right: 90px !important; } .padding-right-100, .pr-100, .pe-100 { padding-right: 100px !important; } .padding-bottom-0, .padding-bottom-none, .no-padding-bottom, .pb-0 { padding-bottom: 0px !important; } .padding-bottom-5, .pb-5 { padding-bottom: 5px !important; } .padding-bottom-10, .pb-10 { padding-bottom: 10px !important; } .padding-bottom-15, .pb-15 { padding-bottom: 15px !important; } .padding-bottom-20, .pb-20 { padding-bottom: 20px !important; } .padding-bottom-30, .pb-30 { padding-bottom: 30px !important; } .padding-bottom-40, .pb-40 { padding-bottom: 40px !important; } .padding-bottom-50, .pb-50 { padding-bottom: 50px !important; } .padding-bottom-60, .pb-60 { padding-bottom: 60px !important; } .padding-bottom-70, .pb-70 { padding-bottom: 70px !important; } .padding-bottom-80, .pb-80 { padding-bottom: 80px !important; } .padding-bottom-90, .pb-90 { padding-bottom: 90px !important; } .padding-bottom-100, .pb-100 { padding-bottom: 100px !important; } .padding-left-0, .padding-left-none, .no-padding-left, .pl-0, .ps-0 { padding-left: 0px !important; } .padding-left-5, .pl-5, .ps-5 { padding-left: 5px !important; } .padding-left-10, .pl-10, .ps-10 { padding-left: 10px !important; } .padding-left-15, .pl-15, .ps-15 { padding-left: 15px !important; } .padding-left-20, .pl-20, .ps-20 { padding-left: 20px !important; } .padding-left-30, .pl-30, .ps-30 { padding-left: 30px !important; } .padding-left-40, .pl-40, .ps-40 { padding-left: 40px !important; } .padding-left-50, .pl-50, .ps-50 { padding-left: 50px !important; } .padding-left-60, .pl-60, .ps-60 { padding-left: 60px !important; } .padding-left-70, .pl-70, .ps-70 { padding-left: 70px !important; } .padding-left-80, .pl-80, .ps-80 { padding-left: 80px !important; } .padding-left-90, .pl-90, .ps-90 { padding-left: 90px !important; } .padding-left-100, .pl-100, .ps-100 { padding-left: 100px !important; } /* CUSTOM | SIZING ---------------------------------------------------------------------------------------------------- */ .width-auto, .w-auto { width: auto; } .width-100, .w-100, .w-100p { width: 100%; } .height-auto, .h-auto { height: auto; } /* CUSTOM | SPACE ---------------------------------------------------------------------------------------------------- */ .space-10, .space_10, .s-10 { padding: 5px 0px; } .space-20, .space_20, .s-20 { padding: 10px 0px; } .space-30, .space_30, .s-30 { padding: 15px 0px; } .space-40, .space_40, .s-40 { padding: 20px 0px; } .space-50, .space_50, .s-50 { padding: 25px 0px; } .space-60, .space_60, .s-60 { padding: 30px 0px; } .space-70, .space_70, .s-70 { padding: 35px 0px; } .space-80, .space_80, .s-80 { padding: 40px 0px; } .space-90, .space_90, .s-90 { padding: 45px 0px; } .space-100, .space_100, .s-100 { padding: 50px 0px; } /* CUSTOM | STOCK SYMBOL ---------------------------------------------------------------------------------------------------- */ span.symbol { margin: 0px 5px; padding: 4px 10px; min-width: 60px; max-width: 80px; height: auto; font-weight: 600; font-size: 0.75rem; text-align: center; color: var(--font-color); background-color: var(--slate-5); border: 1px solid var(--slate-20); vertical-align: middle; overflow: hidden; box-sizing: border-box; } span.symbol-description { display: block; position: relative; margin: 0px; padding: 5px 0px; padding-left: 85px; text-align: var(--dir-start); } span.symbol-description span.symbol { position: absolute; top: 0px; left: -5px; } span.symbol-description span.desc { margin: 0px; } /* CUSTOM | TEXT ---------------------------------------------------------------------------------------------------- */ .bullet-point { padding-left: 4px; padding-right: 4px; font-size: 0.75rem; } .ff-proxima-nova { font-style: normal; font-weight: var(--fw-400); font-family: "Proxima Nova", sans-serif !important; } .ff-proxima-nova-light { font-style: normal; font-weight: var(--fw-300); font-family: "Proxima Nova", sans-serif !important; } .ff-proxima-nova-regular { font-style: normal; font-weight: var(--fw-400); font-family: "Proxima Nova", sans-serif !important; } .ff-proxima-nova-bold { font-style: normal; font-weight: var(--fw-600); font-family: "Proxima Nova", sans-serif !important; } .ff-proxima-nova-extra-bold { font-style: normal; font-weight: var(--fw-800); font-family: "Proxima Nova", sans-serif !important; } .ff-proxima-soft-regular { font-style: normal; font-weight: var(--fw-300); font-family: "Proxima Soft", sans-serif !important; } .ff-proxima-soft-medium { font-style: normal; font-weight: var(--fw-400); font-family: "Proxima Soft", sans-serif !important; } .ff-proxima-soft-semibold { font-style: normal; font-weight: var(--fw-600); font-family: "Proxima Soft", sans-serif !important; } .ff-proxima-soft-bold { font-style: normal; font-weight: var(--fw-700); font-family: "Proxima Soft", sans-serif !important; } .fs-1, .table > tbody tr.fs-1 th, .table > tbody tr.fs-1 td { font-size: var(--fs-1) !important; line-height: var(--lh-1) !important; } .fs-2, .table > tbody tr.fs-2 th, .table > tbody tr.fs-2 td { font-size: var(--fs-2) !important; line-height: var(--lh-2) !important; } .fs-3, .table > tbody tr.fs-3 th, .table > tbody tr.fs-3 td { font-size: var(--fs-3) !important; line-height: var(--lh-3) !important; } .fs-4, .table > tbody tr.fs-4 th, .table > tbody tr.fs-4 td { font-size: var(--fs-4) !important; line-height: var(--lh-4) !important; } .fs-5, .table > tbody tr.fs-5 th, .table > tbody tr.fs-5 td { font-size: var(--fs-5) !important; line-height: var(--lh-5) !important; } .fs-6, .table > tbody tr.fs-6 th, .table > tbody tr.fs-6 td { font-size: var(--fs-6) !important; line-height: var(--lh-6) !important; } .fs-7, .table > tbody tr.fs-7 th, .table > tbody tr.fs-7 td { font-size: var(--fs-7) !important; line-height: var(--lh-7) !important; } .fs-8, .table > tbody tr.fs-8 th, .table > tbody tr.fs-8 td { font-size: var(--fs-8) !important; line-height: var(--lh-8) !important; } .fs-9, .table > tbody tr.fs-9 th, .table > tbody tr.fs-9 td { font-size: var(--fs-9) !important; line-height: var(--lh-9) !important; } .fw-100, .table > tbody tr.fw-100 th, .table > tbody tr.fw-100 td { font-weight: var(--fw-100) !important; } .fw-200, .table > tbody tr.fw-200 th, .table > tbody tr.fw-200 td { font-weight: var(--fw-200) !important; } .fw-300, .table > tbody tr.fw-300 th, .table > tbody tr.fw-300 td { font-weight: var(--fw-300) !important; } .fw-400, .table > tbody tr.fw-400 th, .table > tbody tr.fw-400 td { font-weight: var(--fw-400) !important; } .fw-500, .table > tbody tr.fw-500 th, .table > tbody tr.fw-500 td { font-weight: var(--fw-500) !important; } .fw-600, .table > tbody tr.fw-600 th, .table > tbody tr.fw-600 td { font-weight: var(--fw-600) !important; } .fw-700, .table > tbody tr.fw-700 th, .table > tbody tr.fw-700 td { font-weight: var(--fw-700) !important; } .fw-800, .table > tbody tr.fw-800 th, .table > tbody tr.fw-800 td { font-weight: var(--fw-800) !important; } .fw-900, .table > tbody tr.fw-900 th, .table > tbody tr.fw-900 td { font-weight: var(--fw-900) !important; } .lh-1, .table > tbody tr.lh-1 th, .table > tbody tr.lh-1 td { line-height: var(--lh-1) !important; } .lh-2, .table > tbody tr.lh-2 th, .table > tbody tr.lh-2 td { line-height: var(--lh-2) !important; } .lh-3, .table > tbody tr.lh-3 th, .table > tbody tr.lh-3 td { line-height: var(--lh-3) !important; } .lh-4, .table > tbody tr.lh-4 th, .table > tbody tr.lh-4 td { line-height: var(--lh-4) !important; } .lh-5, .table > tbody tr.lh-5 th, .table > tbody tr.lh-5 td { line-height: var(--lh-5) !important; } .lh-6, .table > tbody tr.lh-6 th, .table > tbody tr.lh-6 td { line-height: var(--lh-6) !important; } .lh-7, .table > tbody tr.lh-7 th, .table > tbody tr.lh-7 td { line-height: var(--lh-7) !important; } .lh-8, .table > tbody tr.lh-8 th, .table > tbody tr.lh-8 td { line-height: var(--lh-8) !important; } .lh-9, .table > tbody tr.lh-9 th, .table > tbody tr.lh-9 td { line-height: var(--lh-9) !important; } .fs-italic, .text-italic, .table > tbody tr.fs-italic th, .table > tbody tr.fs-italic td, .table > tbody tr.text-italic th, .table > tbody tr.text-italic td { font-style: italic !important; } .fs-normal, .text-normal, .table > tbody tr.fs-normal th, .table > tbody tr.fs-normal td, .table > tbody tr.text-normal th, .table > tbody tr.text-normal td { font-style: normal !important; } .fs-oblique, .text-oblique, .table > tbody tr.fs-oblique th, .table > tbody tr.fs-oblique td, .table > tbody tr.text-oblique th, .table > tbody tr.text-oblique td { font-style: oblique !important; } .fw-bold, .text-bold, .table > tbody tr.fw-bold th, .table > tbody tr.fw-bold td, .table > tbody tr.text-bold th, .table > tbody tr.text-bold td { font-weight: var(--fw-600) !important; } .fw-light, .table > tbody tr.fw-light th, .table > tbody tr.fw-light td { font-weight: var(--fw-300) !important; } .fw-normal, .text-normal, .table > tbody tr.fw-normal th, .table > tbody tr.fw-normal td, .table > tbody tr.text-normal th, .table > tbody tr.text-normal td { font-weight: var(--fw-400) !important; } .num, .text-price { direction: ltr !important; font-weight: var(--fw-600) !important; font-feature-settings: "tnum" 1 !important; font-variant-numeric: tabular-nums !important; letter-spacing: 0.001rem !important; } .text-price { font-size: 1.125rem; } .pipe, .slash, .dot, .dash, .en-dash, .em-dash { margin-left: 10px; margin-right: 10px; color: var(--gray-70); } .priority-high { color: var(--red); } .priority-med { color: var(--orange); } .priority-low { color: var(--yellow-dark-10); } .required::after { position: absolute; margin: -4px 0px 0px 0px; margin-left: 5px; color: var(--danger); content: "*"; } .subtitle { display: flex; justify-content: flex-start; align-items: center; align-content: center; margin: 10px 0px; padding: 0px 0px 5px 0px; color: var(--dark-70); border-bottom: 1px solid var(--dark-30); } .subtitle span.text-link { margin: 0px; margin-left: auto; padding: 0px; } .subtitle span.text-link a { font-size: 1rem; } .subtitle .icheckbox_square-blue { margin-right: 10px; } .subtitle + .form-bordered, .subtitle + .form-dashed { margin: -10px 0px 0px 0px; border-top: none; } .subtitle + .table-responsive { margin-top: -10px; } .sup { position: relative; top: 0px; margin-left: 0px; font-weight: var(--fw-400); font-size: 0.625rem; line-height: 0rem; color: inherit; vertical-align: super; } .text-disabled { color: var(--gray-90); text-decoration: line-through; } .text-selected { color: var(--primary); } .text-center, .ta-center { text-align: center !important; } .text-justify, .ta-justify { text-align: justify !important; } .text-left, .text-start, .ta-start { text-align: var(--dir-start) !important; } .text-right, .text-end, .ta-end { text-align: var(--dir-end) !important; } .text-uc, .tt-uppercase { text-transform: uppercase; } .text-uc::-webkit-input-placeholder, .tt-uppercase::-webkit-input-placeholder { text-transform: none; } .text-uc:-moz-placeholder, .tt-uppercase:-moz-placeholder { text-transform: none; } .text-uc::-moz-placeholder, .tt-uppercase::-moz-placeholder { text-transform: none; } .text-uc:-ms-input-placeholder, .tt-uppercase:-ms-input-placeholder { text-transform: none; } .text-uc::placeholder, .tt-uppercase::placeholder { text-transform: none; } .text-lc, .tt-lowercase { text-transform: lowercase; } .text-lc::-webkit-input-placeholder, .tt-lowercase::-webkit-input-placeholder { text-transform: none; } .text-lc:-moz-placeholder, .tt-lowercase:-moz-placeholder { text-transform: none; } .text-lc::-moz-placeholder, .tt-lowercase::-moz-placeholder { text-transform: none; } .text-lc:-ms-input-placeholder, .tt-lowercase:-ms-input-placeholder { text-transform: none; } .text-lc::placeholder, .tt-lowercase::placeholder { text-transform: none; } .text-truncate-50 { display: block; max-width: 50px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .text-truncate-100 { display: block; max-width: 100px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .text-truncate-150 { display: block; max-width: 150px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .text-truncate-200 { display: block; max-width: 200px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .text-truncate-250 { display: block; max-width: 250px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .tw-balance { text-wrap: balance; } .tw-inherit { text-wrap: inherit; } .tw-initial { text-wrap: initial; } .tw-nowrap { text-wrap: nowrap; } .tw-pretty { text-wrap: pretty; } .tw-revert { text-wrap: revert; } .tw-revert-layer { text-wrap: revert-layer; } .tw-stable { text-wrap: stable; } .tw-unset { text-wrap: unset; } .tw-wrap { text-wrap: wrap; } .white-space-inherit, .ws-inherit { white-space: inherit; } .white-space-normal, .ws-normal { white-space: normal; } .white-space-nowrap, .ws-nowrap { white-space: nowrap; } .white-space-pre, .ws-pre { white-space: pre; } .white-space-pre-line, .ws-pre-line { white-space: pre-line; } .white-space-pre-wrap, .ws-pre-wrap { white-space: pre-wrap; } .word-break-all, .word-break-break-all, .wb-break-all { word-break: break-all; } .word-break-keep-all, .wb-keep-all { word-break: keep-all; } .word-break-normal, .wb-normal { word-break: normal; } /* CUSTOM | WEBKIT-TOUCH-CALLOUT ---------------------------------------------------------------------------------------------------- */ .wk-tc-default { -webkit-touch-callout: default !important; } .wk-tc-none { -webkit-touch-callout: none !important; } /* CUSTOM | WEBKIT-USER-DRAG ---------------------------------------------------------------------------------------------------- */ .wk-user-drag-none { -webkit-user-drag: none !important; } /* CUSTOM | SHOW/HIDE ON LIGHT/DARK MODES ---------------------------------------------------------------------------------------------------- */ [data-theme=light] .d-dark-block, [data-theme=light] .d-dark-flex, [data-theme=light] .d-dark-inline, [data-theme=light] .d-dark-inline-block, [data-theme=light] .d-dark-inline-flex { display: none; } [data-theme=light] .d-light-none { display: none; } [data-theme=light] .d-light-block { display: block; } [data-theme=light] .d-light-flex { display: flex; } [data-theme=light] .d-light-inline { display: inline; } [data-theme=light] .d-light-inline-block { display: inline-block; } [data-theme=light] .d-light-inline-flex { display: inline-flex; } [data-theme=dark] .d-light-block, [data-theme=dark] .d-light-flex, [data-theme=dark] .d-light-inline, [data-theme=dark] .d-light-inline-block, [data-theme=dark] .d-light-inline-flex { display: none; } [data-theme=dark] .d-dark-none { display: none; } [data-theme=dark] .d-dark-block { display: block; } [data-theme=dark] .d-dark-flex { display: flex; } [data-theme=dark] .d-dark-inline { display: inline; } [data-theme=dark] .d-dark-inline-block { display: inline-block; } [data-theme=dark] .d-dark-inline-flex { display: inline-flex; } /* CUSTOM | SHOW/HIDE ON LTR/RTL MODES ---------------------------------------------------------------------------------------------------- */ [dir=ltr] .d-rtl-block, [dir=ltr] .d-rtl-flex, [dir=ltr] .d-rtl-inline, [dir=ltr] .d-rtl-inline-block, [dir=ltr] .d-rtl-inline-flex { display: none; } [dir=ltr] .d-ltr-none { display: none; } [dir=ltr] .d-ltr-block { display: block; } [dir=ltr] .d-ltr-flex { display: flex; } [dir=ltr] .d-ltr-inline { display: inline; } [dir=ltr] .d-ltr-inline-block { display: inline-block; } [dir=ltr] .d-ltr-inline-flex { display: inline-flex; } [dir=rtl] .d-ltr-block, [dir=rtl] .d-ltr-flex, [dir=rtl] .d-ltr-inline, [dir=rtl] .d-ltr-inline-block, [dir=rtl] .d-ltr-inline-flex { display: none; } [dir=rtl] .d-rtl-none { display: none; } [dir=rtl] .d-rtl-block { display: block; } [dir=rtl] .d-rtl-flex { display: flex; } [dir=rtl] .d-rtl-inline { display: inline; } [dir=rtl] .d-rtl-inline-block { display: inline-block; } [dir=rtl] .d-rtl-inline-flex { display: inline-flex; } /* CUSTOM | IMAGE FLIP ON RTL MODE ---------------------------------------------------------------------------------------------------- */ [dir=rtl] .img-flip-rtl { transform: scaleX(-1); -webkit-transform: scaleX(-1); } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ @media (max-width: 575.98px) { /* CUSTOM | TEXT ---------------------------------------------------------------------------------------------------- */ .text-center-xs { text-align: center; } .text-left-xs, .text-start-xs { text-align: var(--dir-start); } .text-right-xs, .text-end-xs { text-align: var(--dir-end); } } /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ @media (min-width: 576px) and (max-width: 767.98px) { /* CUSTOM | TEXT ---------------------------------------------------------------------------------------------------- */ .text-center-sm { text-align: center; } .text-left-sm, .text-start-sm { text-align: var(--dir-start); } .text-right-sm, .text-end-sm { text-align: var(--dir-end); } } /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ @media (min-width: 768px) and (max-width: 991.98px) { /* CUSTOM | TEXT ---------------------------------------------------------------------------------------------------- */ .text-center-md { text-align: center; } .text-left-md, .text-start-md { text-align: var(--dir-start); } .text-right-md, .text-end-md { text-align: var(--dir-end); } } /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ @media (min-width: 992px) and (max-width: 1199.98px) { /* CUSTOM | TEXT ---------------------------------------------------------------------------------------------------- */ .text-center-lg { text-align: center; } .text-left-lg, .text-start-lg { text-align: var(--dir-start); } .text-right-lg, .text-end-lg { text-align: var(--dir-end); } } /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ @media (min-width: 1200px) { /* CUSTOM | TEXT ---------------------------------------------------------------------------------------------------- */ .text-center-xl { text-align: center; } .text-left-xl, .text-start-xl { text-align: var(--dir-start); } .text-right-xl, .text-end-xl { text-align: var(--dir-end); } } /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ @media (min-width: 576px) { /* BOOTSTRAP OVERRIDES | TEXT ---------------------------------------------------------------------------------------------------- */ .text-sm-center { text-align: center !important; } .text-sm-start { text-align: var(--dir-start) !important; } .text-sm-end { text-align: var(--dir-end) !important; } } /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ @media (min-width: 768px) { /* BOOTSTRAP OVERRIDES | TEXT ---------------------------------------------------------------------------------------------------- */ .text-md-center { text-align: center !important; } .text-md-start { text-align: var(--dir-start) !important; } .text-md-end { text-align: var(--dir-end) !important; } } /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ @media (min-width: 992px) { /* BOOTSTRAP OVERRIDES | TEXT ---------------------------------------------------------------------------------------------------- */ .text-lg-center { text-align: center !important; } .text-lg-start { text-align: var(--dir-start) !important; } .text-lg-end { text-align: var(--dir-end) !important; } } /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ @media (min-width: 1200px) { /* BOOTSTRAP OVERRIDES | TEXT ---------------------------------------------------------------------------------------------------- */ .text-xl-center { text-align: center !important; } .text-xl-start { text-align: var(--dir-start) !important; } .text-xl-end { text-align: var(--dir-end) !important; } } /* MEDIA QUERY | EXTRA EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ @media (min-width: 1400px) { /* BOOTSTRAP OVERRIDES | TEXT ---------------------------------------------------------------------------------------------------- */ .text-xxl-center { text-align: center !important; } .text-xxl-start { text-align: var(--dir-start) !important; } .text-xxl-end { text-align: var(--dir-end) !important; } } /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON ---------------------------------------------------------------------------------------------------- */ a.btn, button.btn { display: inline-flex; justify-content: center; align-content: center; align-items: center; margin: 2px 0px; padding: var(--btn-pt) var(--btn-pe) var(--btn-pb) var(--btn-ps); font-style: var(--btn-font-style); font-weight: var(--btn-font-weight); font-size: var(--btn-font-size); line-height: var(--btn-line-height); font-family: var(--btn-font-family); text-decoration: none !important; white-space: normal; word-break: normal; border-style: solid; border-radius: var(--border-radius); user-select: auto; } a.btn:hover, button.btn:hover { cursor: pointer; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } a.btn i, a.btn svg, button.btn i, button.btn svg { margin: 0px 6px; } a.btn.btn-xs, button.btn.btn-xs { padding: var(--btn-xs-pt) var(--btn-xs-pe) var(--btn-xs-pb) var(--btn-xs-ps); font-style: var(--btn-xs-font-style); font-weight: var(--btn-xs-font-weight); font-size: var(--btn-xs-font-size); line-height: var(--btn-xs-line-height); font-family: var(--btn-xs-font-family); border-radius: var(--border-radius); } a.btn.btn-sm, button.btn.btn-sm { padding: var(--btn-sm-pt) var(--btn-sm-pe) var(--btn-sm-pb) var(--btn-sm-ps); font-style: var(--btn-sm-font-style); font-weight: var(--btn-sm-font-weight); font-size: var(--btn-sm-font-size); line-height: var(--btn-sm-line-height); font-family: var(--btn-sm-font-family); border-radius: var(--border-radius); } a.btn.btn-lg, button.btn.btn-lg { padding: var(--btn-lg-pt) var(--btn-lg-pe) var(--btn-lg-pb) var(--btn-lg-ps); font-style: var(--btn-lg-font-style); font-weight: var(--btn-lg-font-weight); font-size: var(--btn-lg-font-size); line-height: var(--btn-lg-line-height); font-family: var(--btn-lg-font-family); border-radius: var(--border-radius); } a.btn.btn-xl, button.btn.btn-xl { padding: var(--btn-xl-pt) var(--btn-xl-pe) var(--btn-xl-pb) var(--btn-xl-ps); font-style: var(--btn-xl-font-style); font-weight: var(--btn-xl-font-weight); font-size: var(--btn-xl-font-size); line-height: var(--btn-xl-line-height); font-family: var(--btn-xl-font-family); border-radius: var(--border-radius); } a.btn.btn-round, button.btn.btn-round { border-radius: 40px; } a.btn.w-auto, button.btn.w-auto { width: auto !important; } a.btn.w-25, button.btn.w-25 { width: 25%; } a.btn.w-50, button.btn.w-50 { width: 50%; } a.btn.w-75, button.btn.w-75 { width: 75%; } a.btn.w-100, button.btn.w-100 { width: 100% !important; } a.btn:focus, button.btn:focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } a.btn + a.btn, button.btn + button.btn, am-button + am-button { margin: 0px; margin-left: 10px; } .btn-default, .btn-primary, .btn-secondary, .btn-tertiary, .btn-info, .btn-success, .btn-warning, .btn-danger, .btn-black { text-decoration: none !important; box-shadow: none !important; } .btn-default.active:not(:disabled):not(.disabled), .btn-default:not(:disabled):not(.disabled):active, .btn-primary.active:not(:disabled):not(.disabled), .btn-primary:not(:disabled):not(.disabled):active, .btn-secondary.active:not(:disabled):not(.disabled), .btn-secondary:not(:disabled):not(.disabled):active, .btn-tertiary.active:not(:disabled):not(.disabled), .btn-tertiary:not(:disabled):not(.disabled):active, .btn-info.active:not(:disabled):not(.disabled), .btn-info:not(:disabled):not(.disabled):active, .btn-success.active:not(:disabled):not(.disabled), .btn-success:not(:disabled):not(.disabled):active, .btn-warning.active:not(:disabled):not(.disabled), .btn-warning:not(:disabled):not(.disabled):active, .btn-danger.active:not(:disabled):not(.disabled), .btn-danger:not(:disabled):not(.disabled):active, .btn-black.active:not(:disabled):not(.disabled), .btn-black:not(:disabled):not(.disabled):active { box-shadow: none !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ @media (max-width: 575.98px) { /* BOOTSTRAP OVERRIDES | BUTTON ---------------------------------------------------------------------------------------------------- */ a.btn + a.btn, button.btn + button.btn, am-button + am-button { margin: 5px 0px 0px 0px; } a.btn.w-auto + a.btn.w-auto, button.btn.w-auto + button.btn.w-auto { margin: 0px; margin-left: 5px; } .btn { width: 100%; box-sizing: border-box; } .btn.no-resize { width: auto; } .btn + span + .btn { margin: 10px 0px 0px 0px; } .btn-lg, .btn-group-lg > .btn { padding: 10px 16px; font-size: 1rem; line-height: 1.2; overflow: hidden; } .btn-sm, .btn-group-sm > .btn, .btn-xs, .btn-group-xs > .btn { padding: 10px 16px; font-size: 0.75rem; overflow: hidden; } } /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON CLOSE ---------------------------------------------------------------------------------------------------- */ a.btn-close, a.btn-close:link, a.btn-close:visited, a.btn-close:hover, a.btn-close:active, a.btn-close:focus, button.btn-close, p.btn-close { padding: initial; width: initial; height: initial; background: none; border: none; border-radius: var(--border-radius); opacity: initial; box-sizing: content-box; } a.btn-close:focus { box-shadow: none; outline: 0; opacity: 1; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-BLACK ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-black, .btn-black:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--black) !important; border-color: var(--black) !important; } .btn-black:hover, .btn-black:not([href]):not([tabindex]):hover { color: var(--white) !important; background-color: var(--black) !important; border-color: var(--black) !important; } .btn-black.active:not(:disabled):not(.disabled), .btn-black:not(:disabled):not(.disabled):active, .btn-black .show > .btn-black.dropdown-toggle, .btn-black.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-black:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-black:not([href]):not([tabindex]) .show > .btn-black.dropdown-toggle { color: var(--white) !important; background-color: var(--gray-90) !important; border-color: var(--gray-90) !important; } .btn-black.disabled, .btn-black.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--black) !important; border-color: var(--black) !important; } .btn-black.active.disabled, .btn-black.active.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--gray-90) !important; border-color: var(--gray-90) !important; } .btn-black:focus, .btn-black:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-black i, .btn-black svg, .btn-black:not([href]):not([tabindex]) i, .btn-black:not([href]):not([tabindex]) svg { color: var(--white) !important; } /* OUTLINE */ .btn-outline.btn-black, .btn-outline.btn-black:not([href]):not([tabindex]) { color: var(--black) !important; background-color: transparent !important; border-color: var(--black) !important; } .btn-outline.btn-black:hover, .btn-outline.btn-black:not([href]):not([tabindex]):hover { color: var(--black) !important; background-color: transparent !important; border-color: var(--black) !important; } .btn-outline.btn-black.active:not(:disabled):not(.disabled), .btn-outline.btn-black:not(:disabled):not(.disabled):active, .btn-outline.btn-black .show > .btn-black.dropdown-toggle, .btn-outline.btn-black.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-black:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-black:not([href]):not([tabindex]) .show > .btn-black.dropdown-toggle { color: var(--gray-90) !important; background-color: transparent !important; border-color: var(--gray-90) !important; } .btn-outline.btn-black.disabled, .btn-outline.btn-black.disabled:not([href]):not([tabindex]) { color: var(--black) !important; background-color: transparent !important; border-color: var(--black) !important; } .btn-outline.btn-black.active.disabled, .btn-outline.btn-black.active.disabled:not([href]):not([tabindex]) { color: var(--gray-90) !important; background-color: transparent !important; border-color: var(--gray-90) !important; } .btn-outline.btn-black:focus, .btn-outline.btn-black:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-black i, .btn-outline.btn-black svg, .btn-outline.btn-black:not([href]):not([tabindex]) i, .btn-outline.btn-black:not([href]):not([tabindex]) svg { color: var(--black) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-DANGER ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-danger, .btn-danger:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--danger) !important; border-color: var(--danger) !important; } .btn-danger:hover, .btn-danger:not([href]):not([tabindex]):hover { color: var(--white) !important; background-color: var(--danger-dark-20) !important; border-color: var(--danger-dark-20) !important; } .btn-danger.active:not(:disabled):not(.disabled), .btn-danger:not(:disabled):not(.disabled):active, .btn-danger .show > .btn-danger.dropdown-toggle, .btn-danger.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-danger:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-danger:not([href]):not([tabindex]) .show > .btn-danger.dropdown-toggle { color: var(--white) !important; background-color: var(--danger-dark-20) !important; border-color: var(--danger-dark-20) !important; } .btn-danger.disabled, .btn-danger.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--danger) !important; border-color: var(--danger) !important; } .btn-danger.active.disabled, .btn-danger.active.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--danger-dark-20) !important; border-color: var(--danger-dark-20) !important; } .btn-danger:focus, .btn-danger:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-danger i, .btn-danger svg, .btn-danger:not([href]):not([tabindex]) i, .btn-danger:not([href]):not([tabindex]) svg { color: var(--white) !important; } /* OUTLINE */ .btn-outline.btn-danger, .btn-outline.btn-danger:not([href]):not([tabindex]) { color: var(--danger) !important; background-color: transparent !important; border-color: var(--danger) !important; } .btn-outline.btn-danger:hover, .btn-outline.btn-danger:not([href]):not([tabindex]):hover { color: var(--danger-dark-20) !important; background-color: transparent !important; border-color: var(--danger-dark-20) !important; } .btn-outline.btn-danger.active:not(:disabled):not(.disabled), .btn-outline.btn-danger:not(:disabled):not(.disabled):active, .btn-outline.btn-danger .show > .btn-danger.dropdown-toggle, .btn-outline.btn-danger.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-danger:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-danger:not([href]):not([tabindex]) .show > .btn-danger.dropdown-toggle { color: var(--danger-dark-20) !important; background-color: transparent !important; border-color: var(--danger-dark-20) !important; } .btn-outline.btn-danger.disabled, .btn-outline.btn-danger.disabled:not([href]):not([tabindex]) { color: var(--danger) !important; background-color: transparent !important; border-color: var(--danger) !important; } .btn-outline.btn-danger.active.disabled, .btn-outline.btn-danger.active.disabled:not([href]):not([tabindex]) { color: var(--danger-dark-20) !important; background-color: transparent !important; border-color: var(--danger-dark-20) !important; } .btn-outline.btn-danger:focus, .btn-outline.btn-danger:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-danger i, .btn-outline.btn-danger svg, .btn-outline.btn-danger:not([href]):not([tabindex]) i, .btn-outline.btn-danger:not([href]):not([tabindex]) svg { color: var(--danger) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-DEFAULT ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-default, .btn-default:not([href]):not([tabindex]) { color: var(--btn-default-color) !important; background-color: var(--btn-default-bg-color) !important; border-color: var(--btn-default-border-color) !important; border-width: var(--btn-default-border-size) !important; } .btn-default:hover, .btn-default:not([href]):not([tabindex]):hover { color: var(--btn-default-color-hover) !important; background-color: var(--btn-default-bg-color-hover) !important; border-color: var(--btn-default-border-color-hover) !important; } .btn-default.active:not(:disabled):not(.disabled), .btn-default:not(:disabled):not(.disabled):active, .btn-default .show > .btn-default.dropdown-toggle, .btn-default.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-default:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-default:not([href]):not([tabindex]) .show > .btn-default.dropdown-toggle { color: var(--btn-default-color-active) !important; background-color: var(--btn-default-bg-color-active) !important; border-color: var(--btn-default-border-color-active) !important; } .btn-default.disabled, .btn-default.disabled:not([href]):not([tabindex]) { color: var(--btn-default-color) !important; background-color: var(--btn-default-bg-color) !important; border-color: var(--btn-default-border-color) !important; } .btn-default.active.disabled, .btn-default.active.disabled:not([href]):not([tabindex]) { color: var(--btn-default-color-active) !important; background-color: var(--btn-default-bg-color-active) !important; border-color: var(--btn-default-border-color-active) !important; } .btn-default:focus, .btn-default:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-default i, .btn-default svg, .btn-default:not([href]):not([tabindex]) i, .btn-default:not([href]):not([tabindex]) svg { color: var(--btn-default-color) !important; } /* OUTLINE */ .btn-outline.btn-default, .btn-outline.btn-default:not([href]):not([tabindex]) { color: var(--btn-default-color) !important; background-color: transparent !important; border-color: var(--btn-default-border-color) !important; } .btn-outline.btn-default:hover, .btn-outline.btn-default:not([href]):not([tabindex]):hover { color: var(--btn-default-color-hover) !important; background-color: transparent !important; border-color: var(--btn-default-border-color-hover) !important; } .btn-outline.btn-default.active:not(:disabled):not(.disabled), .btn-outline.btn-default:not(:disabled):not(.disabled):active, .btn-outline.btn-default .show > .btn-default.dropdown-toggle, .btn-outline.btn-default.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-default:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-default:not([href]):not([tabindex]) .show > .btn-default.dropdown-toggle { color: var(--btn-default-color-active) !important; background-color: transparent !important; border-color: var(--btn-default-border-color-active) !important; } .btn-outline.btn-default.disabled, .btn-outline.btn-default.disabled:not([href]):not([tabindex]) { color: var(--btn-default-color) !important; background-color: transparent !important; border-color: var(--btn-default-border-color) !important; } .btn-outline.btn-default.active.disabled, .btn-outline.btn-default.active.disabled:not([href]):not([tabindex]) { color: var(--btn-default-color-active) !important; background-color: transparent !important; border-color: var(--btn-default-border-color-active) !important; } .btn-outline.btn-default:focus, .btn-outline.btn-default:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-default i, .btn-outline.btn-default svg, .btn-outline.btn-default:not([href]):not([tabindex]) i, .btn-outline.btn-default:not([href]):not([tabindex]) svg { color: var(--btn-default-color) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-INFO ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-info, .btn-info:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--info) !important; border-color: var(--info) !important; } .btn-info:hover, .btn-info:not([href]):not([tabindex]):hover { color: var(--white) !important; background-color: var(--info-dark-20) !important; border-color: var(--info-dark-20) !important; } .btn-info.active:not(:disabled):not(.disabled), .btn-info:not(:disabled):not(.disabled):active, .btn-info .show > .btn-info.dropdown-toggle, .btn-info.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-info:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-info:not([href]):not([tabindex]) .show > .btn-info.dropdown-toggle { color: var(--white) !important; background-color: var(--info-dark-20) !important; border-color: var(--info-dark-20) !important; } .btn-info.disabled, .btn-info.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--info) !important; border-color: var(--info) !important; } .btn-info.active.disabled, .btn-info.active.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--info-dark-20) !important; border-color: var(--info-dark-20) !important; } .btn-info:focus, .btn-info:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-info i, .btn-info svg, .btn-info:not([href]):not([tabindex]) i, .btn-info:not([href]):not([tabindex]) svg { color: var(--white) !important; } /* OUTLINE */ .btn-outline.btn-info, .btn-outline.btn-info:not([href]):not([tabindex]) { color: var(--info) !important; background-color: transparent !important; border-color: var(--info) !important; } .btn-outline.btn-info:hover, .btn-outline.btn-info:not([href]):not([tabindex]):hover { color: var(--info-dark-20) !important; background-color: transparent !important; border-color: var(--info-dark-20) !important; } .btn-outline.btn-info.active:not(:disabled):not(.disabled), .btn-outline.btn-info:not(:disabled):not(.disabled):active, .btn-outline.btn-info .show > .btn-info.dropdown-toggle, .btn-outline.btn-info.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-info:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-info:not([href]):not([tabindex]) .show > .btn-info.dropdown-toggle { color: var(--info-dark-20) !important; background-color: transparent !important; border-color: var(--info-dark-20) !important; } .btn-outline.btn-info.disabled, .btn-outline.btn-info.disabled:not([href]):not([tabindex]) { color: var(--info) !important; background-color: transparent !important; border-color: var(--info) !important; } .btn-outline.btn-info.active.disabled, .btn-outline.btn-info.active.disabled:not([href]):not([tabindex]) { color: var(--info-dark-20) !important; background-color: transparent !important; border-color: var(--info-dark-20) !important; } .btn-outline.btn-info:focus, .btn-outline.btn-info:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-info i, .btn-outline.btn-info svg, .btn-outline.btn-info:not([href]):not([tabindex]) i, .btn-outline.btn-info:not([href]):not([tabindex]) svg { color: var(--info) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-PRIMARY ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-primary, .btn-primary:not([href]):not([tabindex]) { color: var(--btn-primary-color) !important; background-color: var(--btn-primary-bg-color) !important; border-color: var(--btn-primary-border-color) !important; border-width: var(--btn-primary-border-size) !important; } .btn-primary:hover, .btn-primary:not([href]):not([tabindex]):hover { color: var(--btn-primary-color-hover) !important; background-color: var(--btn-primary-bg-color-hover) !important; border-color: var(--btn-primary-border-color-hover) !important; } .btn-primary.active:not(:disabled):not(.disabled), .btn-primary:not(:disabled):not(.disabled):active, .btn-primary .show > .btn-primary.dropdown-toggle, .btn-primary.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-primary:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-primary:not([href]):not([tabindex]) .show > .btn-primary.dropdown-toggle { color: var(--btn-primary-color-active) !important; background-color: var(--btn-primary-bg-color-active) !important; border-color: var(--btn-primary-border-color-active) !important; } .btn-primary.disabled, .btn-primary.disabled:not([href]):not([tabindex]) { color: var(--btn-primary-color) !important; background-color: var(--btn-primary-bg-color) !important; border-color: var(--btn-primary-border-color) !important; } .btn-primary.active.disabled, .btn-primary.active.disabled:not([href]):not([tabindex]) { color: var(--btn-primary-color-active) !important; background-color: var(--btn-primary-bg-color-active) !important; border-color: var(--btn-primary-border-color-active) !important; } .btn-primary:focus, .btn-primary:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-primary i, .btn-primary svg, .btn-primary:not([href]):not([tabindex]) i, .btn-primary:not([href]):not([tabindex]) svg { color: var(--btn-primary-color) !important; } /* OUTLINE */ .btn-outline.btn-primary, .btn-outline.btn-primary:not([href]):not([tabindex]) { color: var(--btn-primary-border-color) !important; background-color: transparent !important; border-color: var(--btn-primary-border-color) !important; } .btn-outline.btn-primary:hover, .btn-outline.btn-primary:not([href]):not([tabindex]):hover { color: var(--btn-primary-border-color-hover) !important; background-color: transparent !important; border-color: var(--btn-primary-border-color-hover) !important; } .btn-outline.btn-primary.active:not(:disabled):not(.disabled), .btn-outline.btn-primary:not(:disabled):not(.disabled):active, .btn-outline.btn-primary .show > .btn-primary.dropdown-toggle, .btn-outline.btn-primary.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-primary:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-primary:not([href]):not([tabindex]) .show > .btn-primary.dropdown-toggle { color: var(--btn-primary-border-color-active) !important; background-color: transparent !important; border-color: var(--btn-primary-border-color-active) !important; } .btn-outline.btn-primary.disabled, .btn-outline.btn-primary.disabled:not([href]):not([tabindex]) { color: var(--btn-primary-border-color) !important; background-color: transparent !important; border-color: var(--btn-primary-border-color) !important; } .btn-outline.btn-primary.active.disabled, .btn-outline.btn-primary.active.disabled:not([href]):not([tabindex]) { color: var(--btn-primary-border-color-active) !important; background-color: transparent !important; border-color: var(--btn-primary-border-color-active) !important; } .btn-outline.btn-primary:focus, .btn-outline.btn-primary:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-primary i, .btn-outline.btn-primary svg, .btn-outline.btn-primary:not([href]):not([tabindex]) i, .btn-outline.btn-primary:not([href]):not([tabindex]) svg { color: var(--btn-primary-border-color) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-SECONDARY ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-secondary, .btn-secondary:not([href]):not([tabindex]) { color: var(--btn-secondary-color) !important; background-color: var(--btn-secondary-bg-color) !important; border-color: var(--btn-secondary-border-color) !important; border-width: var(--btn-secondary-border-size) !important; } .btn-secondary:hover, .btn-secondary:not([href]):not([tabindex]):hover { color: var(--btn-secondary-color-hover) !important; background-color: var(--btn-secondary-bg-color-hover) !important; border-color: var(--btn-secondary-border-color-hover) !important; } .btn-secondary.active:not(:disabled):not(.disabled), .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary .show > .btn-secondary.dropdown-toggle, .btn-secondary.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-secondary:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-secondary:not([href]):not([tabindex]) .show > .btn-secondary.dropdown-toggle { color: var(--btn-secondary-color-active) !important; background-color: var(--btn-secondary-bg-color-active) !important; border-color: var(--btn-secondary-border-color-active) !important; } .btn-secondary.disabled, .btn-secondary.disabled:not([href]):not([tabindex]) { color: var(--btn-secondary-color) !important; background-color: var(--btn-secondary-bg-color) !important; border-color: var(--btn-secondary-border-color) !important; } .btn-secondary.active.disabled, .btn-secondary.active.disabled:not([href]):not([tabindex]) { color: var(--btn-secondary-color-active) !important; background-color: var(--btn-secondary-bg-color-active) !important; border-color: var(--btn-secondary-border-color-active) !important; } .btn-secondary:focus, .btn-secondary:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-secondary i, .btn-secondary svg, .btn-secondary:not([href]):not([tabindex]) i, .btn-secondary:not([href]):not([tabindex]) svg { color: var(--btn-secondary-color) !important; } /* OUTLINE */ .btn-outline.btn-secondary, .btn-outline.btn-secondary:not([href]):not([tabindex]) { color: var(--btn-secondary-border-color) !important; background-color: transparent !important; border-color: var(--btn-secondary-border-color) !important; } .btn-outline.btn-secondary:hover, .btn-outline.btn-secondary:not([href]):not([tabindex]):hover { color: var(--btn-secondary-border-color-hover) !important; background-color: transparent !important; border-color: var(--btn-secondary-border-color-hover) !important; } .btn-outline.btn-secondary.active:not(:disabled):not(.disabled), .btn-outline.btn-secondary:not(:disabled):not(.disabled):active, .btn-outline.btn-secondary .show > .btn-secondary.dropdown-toggle, .btn-outline.btn-secondary.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-secondary:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-secondary:not([href]):not([tabindex]) .show > .btn-secondary.dropdown-toggle { color: var(--btn-secondary-border-color-active) !important; background-color: transparent !important; border-color: var(--btn-secondary-border-color-active) !important; } .btn-outline.btn-secondary.disabled, .btn-outline.btn-secondary.disabled:not([href]):not([tabindex]) { color: var(--btn-secondary-border-color) !important; background-color: transparent !important; border-color: var(--btn-secondary-border-color) !important; } .btn-outline.btn-secondary.active.disabled, .btn-outline.btn-secondary.active.disabled:not([href]):not([tabindex]) { color: var(--btn-secondary-border-color-active) !important; background-color: transparent !important; border-color: var(--btn-secondary-border-color-active) !important; } .btn-outline.btn-secondary:focus, .btn-outline.btn-secondary:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-secondary i, .btn-outline.btn-secondary svg, .btn-outline.btn-secondary:not([href]):not([tabindex]) i, .btn-outline.btn-secondary:not([href]):not([tabindex]) svg { color: var(--btn-secondary-border-color) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-SUCCESS ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-success, .btn-success:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--success) !important; border-color: var(--success) !important; } .btn-success:hover, .btn-success:not([href]):not([tabindex]):hover { color: var(--white) !important; background-color: var(--success-dark-20) !important; border-color: var(--success-dark-20) !important; } .btn-success.active:not(:disabled):not(.disabled), .btn-success:not(:disabled):not(.disabled):active, .btn-success .show > .btn-success.dropdown-toggle, .btn-success.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-success:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-success:not([href]):not([tabindex]) .show > .btn-success.dropdown-toggle { color: var(--white) !important; background-color: var(--success-dark-20) !important; border-color: var(--success-dark-20) !important; } .btn-success.disabled, .btn-success.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--success) !important; border-color: var(--success) !important; } .btn-success.active.disabled, .btn-success.active.disabled:not([href]):not([tabindex]) { color: var(--white) !important; background-color: var(--success-dark-20) !important; border-color: var(--success-dark-20) !important; } .btn-success:focus, .btn-success:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-success i, .btn-success svg, .btn-success:not([href]):not([tabindex]) i, .btn-success:not([href]):not([tabindex]) svg { color: var(--white) !important; } /* OUTLINE */ .btn-outline.btn-success, .btn-outline.btn-success:not([href]):not([tabindex]) { color: var(--success) !important; background-color: transparent !important; border-color: var(--success) !important; } .btn-outline.btn-success:hover, .btn-outline.btn-success:not([href]):not([tabindex]):hover { color: var(--success-dark-20) !important; background-color: transparent !important; border-color: var(--success-dark-20) !important; } .btn-outline.btn-success.active:not(:disabled):not(.disabled), .btn-outline.btn-success:not(:disabled):not(.disabled):active, .btn-outline.btn-success .show > .btn-success.dropdown-toggle, .btn-outline.btn-success.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-success:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-success:not([href]):not([tabindex]) .show > .btn-success.dropdown-toggle { color: var(--success-dark-20) !important; background-color: transparent !important; border-color: var(--success-dark-20) !important; } .btn-outline.btn-success.disabled, .btn-outline.btn-success.disabled:not([href]):not([tabindex]) { color: var(--success) !important; background-color: transparent !important; border-color: var(--success) !important; } .btn-outline.btn-success.active.disabled, .btn-outline.btn-success.active.disabled:not([href]):not([tabindex]) { color: var(--success-dark-20) !important; background-color: transparent !important; border-color: var(--success-dark-20) !important; } .btn-outline.btn-success:focus, .btn-outline.btn-success:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-success i, .btn-outline.btn-success svg, .btn-outline.btn-success:not([href]):not([tabindex]) i, .btn-outline.btn-success:not([href]):not([tabindex]) svg { color: var(--success) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-TERTIARY ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-tertiary, .btn-tertiary:not([href]):not([tabindex]) { color: var(--btn-tertiary-color) !important; background-color: var(--btn-tertiary-bg-color) !important; border-color: var(--btn-tertiary-border-color) !important; border-width: var(--btn-tertiary-border-size) !important; } .btn-tertiary:hover, .btn-tertiary:not([href]):not([tabindex]):hover { color: var(--btn-tertiary-color-hover) !important; background-color: var(--btn-tertiary-bg-color-hover) !important; border-color: var(--btn-tertiary-border-color-hover) !important; } .btn-tertiary.active:not(:disabled):not(.disabled), .btn-tertiary:not(:disabled):not(.disabled):active, .btn-tertiary .show > .btn-tertiary.dropdown-toggle, .btn-tertiary.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-tertiary:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-tertiary:not([href]):not([tabindex]) .show > .btn-tertiary.dropdown-toggle { color: var(--btn-tertiary-color-active) !important; background-color: var(--btn-tertiary-bg-color-active) !important; border-color: var(--btn-tertiary-border-color-active) !important; } .btn-tertiary.disabled, .btn-tertiary.disabled:not([href]):not([tabindex]) { color: var(--btn-tertiary-color) !important; background-color: var(--btn-tertiary-bg-color) !important; border-color: var(--btn-tertiary-border-color) !important; } .btn-tertiary.active.disabled, .btn-tertiary.active.disabled:not([href]):not([tabindex]) { color: var(--btn-tertiary-color-active) !important; background-color: var(--btn-tertiary-bg-color-active) !important; border-color: var(--btn-tertiary-border-color-active) !important; } .btn-tertiary:focus, .btn-tertiary:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-tertiary i, .btn-tertiary svg, .btn-tertiary:not([href]):not([tabindex]) i, .btn-tertiary:not([href]):not([tabindex]) svg { color: var(--btn-tertiary-color) !important; } /* OUTLINE */ .btn-outline.btn-tertiary, .btn-outline.btn-tertiary:not([href]):not([tabindex]) { color: var(--btn-tertiary-border-color) !important; background-color: transparent !important; border-color: var(--btn-tertiary-border-color) !important; } .btn-outline.btn-tertiary:hover, .btn-outline.btn-tertiary:not([href]):not([tabindex]):hover { color: var(--btn-tertiary-border-color-hover) !important; background-color: transparent !important; border-color: var(--btn-tertiary-border-color-hover) !important; } .btn-outline.btn-tertiary.active:not(:disabled):not(.disabled), .btn-outline.btn-tertiary:not(:disabled):not(.disabled):active, .btn-outline.btn-tertiary .show > .btn-tertiary.dropdown-toggle, .btn-outline.btn-tertiary.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-tertiary:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-tertiary:not([href]):not([tabindex]) .show > .btn-tertiary.dropdown-toggle { color: var(--btn-tertiary-border-color-active) !important; background-color: transparent !important; border-color: var(--btn-tertiary-border-color-active) !important; } .btn-outline.btn-tertiary.disabled, .btn-outline.btn-tertiary.disabled:not([href]):not([tabindex]) { color: var(--btn-tertiary-border-color) !important; background-color: transparent !important; border-color: var(--btn-tertiary-border-color) !important; } .btn-outline.btn-tertiary.active.disabled, .btn-outline.btn-tertiary.active.disabled:not([href]):not([tabindex]) { color: var(--btn-tertiary-border-color-active) !important; background-color: transparent !important; border-color: var(--btn-tertiary-border-color-active) !important; } .btn-outline.btn-tertiary:focus, .btn-outline.btn-tertiary:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-tertiary i, .btn-outline.btn-tertiary svg, .btn-outline.btn-tertiary:not([href]):not([tabindex]) i, .btn-outline.btn-tertiary:not([href]):not([tabindex]) svg { color: var(--btn-tertiary-border-color) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | BUTTON-WARNING ---------------------------------------------------------------------------------------------------- */ /* SOLID */ .btn-warning, .btn-warning:not([href]):not([tabindex]) { color: var(--font-color-dark) !important; background-color: var(--warning) !important; border-color: var(--warning) !important; } .btn-warning:hover, .btn-warning:not([href]):not([tabindex]):hover { color: var(--font-color-dark) !important; background-color: var(--warning-dark-20) !important; border-color: var(--warning-dark-20) !important; } .btn-warning.active:not(:disabled):not(.disabled), .btn-warning:not(:disabled):not(.disabled):active, .btn-warning .show > .btn-warning.dropdown-toggle, .btn-warning.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-warning:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-warning:not([href]):not([tabindex]) .show > .btn-warning.dropdown-toggle { color: var(--font-color-dark) !important; background-color: var(--warning-dark-20) !important; border-color: var(--warning-dark-20) !important; } .btn-warning.disabled, .btn-warning.disabled:not([href]):not([tabindex]) { color: var(--font-color-dark) !important; background-color: var(--warning) !important; border-color: var(--warning) !important; } .btn-warning.active.disabled, .btn-warning.active.disabled:not([href]):not([tabindex]) { color: var(--font-color-dark) !important; background-color: var(--warning-dark-20) !important; border-color: var(--warning-dark-20) !important; } .btn-warning:focus, .btn-warning:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-warning i, .btn-warning svg, .btn-warning:not([href]):not([tabindex]) i, .btn-warning:not([href]):not([tabindex]) svg { color: var(--font-color-dark) !important; } /* OUTLINE */ .btn-outline.btn-warning, .btn-outline.btn-warning:not([href]):not([tabindex]) { color: var(--warning) !important; background-color: transparent !important; border-color: var(--warning) !important; } .btn-outline.btn-warning:hover, .btn-outline.btn-warning:not([href]):not([tabindex]):hover { color: var(--warning-dark-20) !important; background-color: transparent !important; border-color: var(--warning-dark-20) !important; } .btn-outline.btn-warning.active:not(:disabled):not(.disabled), .btn-outline.btn-warning:not(:disabled):not(.disabled):active, .btn-outline.btn-warning .show > .btn-warning.dropdown-toggle, .btn-outline.btn-warning.active:not([href]):not([tabindex]):not(:disabled):not(.disabled), .btn-outline.btn-warning:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, .btn-outline.btn-warning:not([href]):not([tabindex]) .show > .btn-warning.dropdown-toggle { color: var(--warning-dark-20) !important; background-color: transparent !important; border-color: var(--warning-dark-20) !important; } .btn-outline.btn-warning.disabled, .btn-outline.btn-warning.disabled:not([href]):not([tabindex]) { color: var(--warning) !important; background-color: transparent !important; border-color: var(--warning) !important; } .btn-outline.btn-warning.active.disabled, .btn-outline.btn-warning.active.disabled:not([href]):not([tabindex]) { color: var(--warning-dark-20) !important; background-color: transparent !important; border-color: var(--warning-dark-20) !important; } .btn-outline.btn-warning:focus, .btn-outline.btn-warning:not([href]):not([tabindex]):focus { outline: 1px solid var(--primary) !important; box-shadow: var(--box-shadow) !important; border-radius: var(--border-radius) !important; } .btn-outline.btn-warning i, .btn-outline.btn-warning svg, .btn-outline.btn-warning:not([href]):not([tabindex]) i, .btn-outline.btn-warning:not([href]):not([tabindex]) svg { color: var(--warning) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | TABLE ---------------------------------------------------------------------------------------------------- */ .table { margin-bottom: 0px; border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); background-color: transparent; /* TABLE-BORDERED */ /* TABLE-HOVER */ /* TABLE-LAYOUT-FIXED */ /* TABLE-STRIPED */ } .table > :not(caption) > * > * { background-color: transparent; border-bottom-width: 0px; box-shadow: none; } .table > thead tr th { padding: var(--th-pt) var(--th-pe) var(--th-pb) var(--th-ps); max-width: 100%; font-style: var(--th-font-style); font-weight: var(--th-font-weight); font-size: var(--th-font-size); line-height: var(--th-line-height); font-family: var(--th-font-family); color: var(--th-color); background-color: var(--th-bg-color); border-top: 1px solid var(--border-color); border-bottom: 2px solid var(--border-color); } .table > thead tr th[align=left] { text-align: var(--dir-start) !important; } .table > thead tr th[align=right] { text-align: var(--dir-end) !important; } .table > thead tr th[align=center] { text-align: center; } .table > tbody tr td, .table > tfoot tr td { padding: var(--td-pt) var(--td-pe) var(--td-pb) var(--td-ps); max-width: 100%; font-style: var(--td-font-style); font-weight: var(--td-font-weight); font-size: var(--td-font-size); line-height: var(--td-line-height); font-family: var(--td-font-family); color: var(--td-color); background-color: var(--td-bg-color); border-top: 1px solid var(--border-color); } .table > tbody tr td i.fa-chevron-right, .table > tbody tr td i.fa-chevron-left, .table > tbody tr td svg.fa-chevron-right, .table > tbody tr td svg.fa-chevron-left, .table > tfoot tr td i.fa-chevron-right, .table > tfoot tr td i.fa-chevron-left, .table > tfoot tr td svg.fa-chevron-right, .table > tfoot tr td svg.fa-chevron-left { color: var(--dark-10); } .table > tbody tr td span.form-icon, .table > tfoot tr td span.form-icon { display: flex; flex-direction: row; align-items: center; } .table > tbody tr td span.form-icon i, .table > tbody tr td span.form-icon svg, .table > tfoot tr td span.form-icon i, .table > tfoot tr td span.form-icon svg { margin: 0px; } .table > tbody tr td span.form-icon img, .table > tfoot tr td span.form-icon img { margin: 0px; max-width: 20px; } .table > tbody tr td span.form-icon span, .table > tfoot tr td span.form-icon span { margin: 0px; margin-left: 10px; } .table > tbody tr td[align=left], .table > tfoot tr td[align=left] { text-align: var(--dir-start) !important; } .table > tbody tr td[align=right], .table > tfoot tr td[align=right] { text-align: var(--dir-end) !important; } .table > tbody tr td[align=center], .table > tfoot tr td[align=center] { text-align: center; } .table > tbody tr td[valign=top], .table > tfoot tr td[valign=top] { vertical-align: top; } .table > tbody tr td[valign=middle], .table > tfoot tr td[valign=middle] { vertical-align: middle; } .table > tbody tr td[valign=bottom], .table > tfoot tr td[valign=bottom] { vertical-align: bottom; } .table > tbody + tbody, .table > tfoot + tbody { border-top: none !important; } .table > thead colgroup col.default, .table > tbody colgroup col.default, .table > tfoot colgroup col.default { background-color: var(--gray-10); } .table > thead colgroup col.danger, .table > tbody colgroup col.danger, .table > tfoot colgroup col.danger { background-color: var(--red-10); } .table > thead colgroup col.error, .table > tbody colgroup col.error, .table > tfoot colgroup col.error { background-color: var(--red-10); } .table > thead colgroup col.info, .table > tbody colgroup col.info, .table > tfoot colgroup col.info { background-color: var(--blue-10); } .table > thead colgroup col.success, .table > tbody colgroup col.success, .table > tfoot colgroup col.success { background-color: var(--green-10); } .table > thead colgroup col.warning, .table > tbody colgroup col.warning, .table > tfoot colgroup col.warning { background-color: var(--yellow-10); } .table > thead colgroup col.gray, .table > tbody colgroup col.gray, .table > tfoot colgroup col.gray { background-color: var(--gray-40); } .table > thead colgroup col.gray-light, .table > tbody colgroup col.gray-light, .table > tfoot colgroup col.gray-light { background-color: var(--gray-10); } .table > thead colgroup col.gray-dark, .table > tbody colgroup col.gray-dark, .table > tfoot colgroup col.gray-dark { background-color: var(--gray-70); } .table > thead > tr.active th, .table > thead > tr.active td, .table > tbody > tr.active th, .table > tbody > tr.active td, .table > tfoot > tr.active th, .table > tfoot > tr.active td { font-weight: var(--fw-600) !important; color: var(--td-color) !important; background-color: var(--primary-5) !important; } .table > thead > tr.average th, .table > thead > tr.average td, .table > tbody > tr.average th, .table > tbody > tr.average td, .table > tfoot > tr.average th, .table > tfoot > tr.average td { font-weight: var(--fw-600) !important; color: var(--td-color) !important; background-color: var(--gray-5) !important; } .table > thead > tr.blank th::before, .table > thead > tr.blank th::after, .table > thead > tr.blank td::before, .table > thead > tr.blank td::after, .table > tbody > tr.blank th::before, .table > tbody > tr.blank th::after, .table > tbody > tr.blank td::before, .table > tbody > tr.blank td::after, .table > tfoot > tr.blank th::before, .table > tfoot > tr.blank th::after, .table > tfoot > tr.blank td::before, .table > tfoot > tr.blank td::after { display: none !important; height: auto !important; content: "" !important; } .table > thead > tr.danger th, .table > thead > tr.danger td, .table > tbody > tr.danger th, .table > tbody > tr.danger td, .table > tfoot > tr.danger th, .table > tfoot > tr.danger td { color: var(--td-color) !important; background-color: var(--danger-20) !important; } .table > thead > tr.disclosure th, .table > thead > tr.disclosure td, .table > tbody > tr.disclosure th, .table > tbody > tr.disclosure td, .table > tfoot > tr.disclosure th, .table > tfoot > tr.disclosure td { font-weight: var(--fw-400) !important; color: var(--td-color) !important; background-color: transparent !important; } .table > thead > tr.grandtotal th, .table > thead > tr.grandtotal td, .table > tbody > tr.grandtotal th, .table > tbody > tr.grandtotal td, .table > tfoot > tr.grandtotal th, .table > tfoot > tr.grandtotal td { font-weight: var(--fw-600) !important; color: var(--td-color) !important; background-color: var(--success-20) !important; } .table > thead > tr.header th, .table > thead > tr.header td, .table > tbody > tr.header th, .table > tbody > tr.header td, .table > tfoot > tr.header th, .table > tfoot > tr.header td { font-weight: var(--fw-600) !important; color: var(--font-color-dark) !important; background-color: var(--slate-20) !important; } .table > thead > tr.hover:hover th, .table > thead > tr.hover:hover td, .table > tbody > tr.hover:hover th, .table > tbody > tr.hover:hover td, .table > tfoot > tr.hover:hover th, .table > tfoot > tr.hover:hover td { color: var(--font-color-dark) !important; background-color: var(--primary-5) !important; cursor: pointer !important; } .table > thead > tr.indent th:first-child, .table > thead > tr.indent-1x th:first-child, .table > thead > tr.indent td:first-child, .table > thead > tr.indent-1x td:first-child, .table > tbody > tr.indent th:first-child, .table > tbody > tr.indent-1x th:first-child, .table > tbody > tr.indent td:first-child, .table > tbody > tr.indent-1x td:first-child, .table > tfoot > tr.indent th:first-child, .table > tfoot > tr.indent-1x th:first-child, .table > tfoot > tr.indent td:first-child, .table > tfoot > tr.indent-1x td:first-child { padding-left: 10px !important; } .table > thead > tr.indent-2x th:first-child, .table > thead > tr.indent-2x td:first-child, .table > tbody > tr.indent-2x th:first-child, .table > tbody > tr.indent-2x td:first-child, .table > tfoot > tr.indent-2x th:first-child, .table > tfoot > tr.indent-2x td:first-child { padding-left: 20px !important; } .table > thead > tr.indent-3x th:first-child, .table > thead > tr.indent-3x td:first-child, .table > tbody > tr.indent-3x th:first-child, .table > tbody > tr.indent-3x td:first-child, .table > tfoot > tr.indent-3x th:first-child, .table > tfoot > tr.indent-3x td:first-child { padding-left: 30px !important; } .table > thead > tr.indent-4x th:first-child, .table > thead > tr.indent-4x td:first-child, .table > tbody > tr.indent-4x th:first-child, .table > tbody > tr.indent-4x td:first-child, .table > tfoot > tr.indent-4x th:first-child, .table > tfoot > tr.indent-4x td:first-child { padding-left: 40px !important; } .table > thead > tr.indent-5x th:first-child, .table > thead > tr.indent-5x td:first-child, .table > tbody > tr.indent-5x th:first-child, .table > tbody > tr.indent-5x td:first-child, .table > tfoot > tr.indent-5x th:first-child, .table > tfoot > tr.indent-5x td:first-child { padding-left: 50px !important; } .table > thead > tr.load-more th, .table > thead > tr.load-more td, .table > tbody > tr.load-more th, .table > tbody > tr.load-more td, .table > tfoot > tr.load-more th, .table > tfoot > tr.load-more td { padding: 0px; text-align: center; } .table > thead > tr.load-more th a, .table > thead > tr.load-more th a:link, .table > thead > tr.load-more th a:visited, .table > thead > tr.load-more th a:hover, .table > thead > tr.load-more th a:active, .table > thead > tr.load-more th a:focus, .table > thead > tr.load-more td a, .table > thead > tr.load-more td a:link, .table > thead > tr.load-more td a:visited, .table > thead > tr.load-more td a:hover, .table > thead > tr.load-more td a:active, .table > thead > tr.load-more td a:focus, .table > tbody > tr.load-more th a, .table > tbody > tr.load-more th a:link, .table > tbody > tr.load-more th a:visited, .table > tbody > tr.load-more th a:hover, .table > tbody > tr.load-more th a:active, .table > tbody > tr.load-more th a:focus, .table > tbody > tr.load-more td a, .table > tbody > tr.load-more td a:link, .table > tbody > tr.load-more td a:visited, .table > tbody > tr.load-more td a:hover, .table > tbody > tr.load-more td a:active, .table > tbody > tr.load-more td a:focus, .table > tfoot > tr.load-more th a, .table > tfoot > tr.load-more th a:link, .table > tfoot > tr.load-more th a:visited, .table > tfoot > tr.load-more th a:hover, .table > tfoot > tr.load-more th a:active, .table > tfoot > tr.load-more th a:focus, .table > tfoot > tr.load-more td a, .table > tfoot > tr.load-more td a:link, .table > tfoot > tr.load-more td a:visited, .table > tfoot > tr.load-more td a:hover, .table > tfoot > tr.load-more td a:active, .table > tfoot > tr.load-more td a:focus { display: block; margin: 0px; padding: 5px 8px; width: 100%; height: auto; font-weight: var(--fw-600); font-size: 0.875rem; line-height: 1.125rem; text-align: center; color: var(--link-color) !important; background-color: var(--primary-5) !important; border-radius: 0px; } .table > thead > tr.load-more th a.btn-load-more, .table > thead > tr.load-more th a.btn-load-more:link, .table > thead > tr.load-more th a.btn-load-more:visited, .table > thead > tr.load-more th a.btn-load-more:hover, .table > thead > tr.load-more th a.btn-load-more:active, .table > thead > tr.load-more th a.btn-load-more:focus, .table > thead > tr.load-more td a.btn-load-more, .table > thead > tr.load-more td a.btn-load-more:link, .table > thead > tr.load-more td a.btn-load-more:visited, .table > thead > tr.load-more td a.btn-load-more:hover, .table > thead > tr.load-more td a.btn-load-more:active, .table > thead > tr.load-more td a.btn-load-more:focus, .table > tbody > tr.load-more th a.btn-load-more, .table > tbody > tr.load-more th a.btn-load-more:link, .table > tbody > tr.load-more th a.btn-load-more:visited, .table > tbody > tr.load-more th a.btn-load-more:hover, .table > tbody > tr.load-more th a.btn-load-more:active, .table > tbody > tr.load-more th a.btn-load-more:focus, .table > tbody > tr.load-more td a.btn-load-more, .table > tbody > tr.load-more td a.btn-load-more:link, .table > tbody > tr.load-more td a.btn-load-more:visited, .table > tbody > tr.load-more td a.btn-load-more:hover, .table > tbody > tr.load-more td a.btn-load-more:active, .table > tbody > tr.load-more td a.btn-load-more:focus, .table > tfoot > tr.load-more th a.btn-load-more, .table > tfoot > tr.load-more th a.btn-load-more:link, .table > tfoot > tr.load-more th a.btn-load-more:visited, .table > tfoot > tr.load-more th a.btn-load-more:hover, .table > tfoot > tr.load-more th a.btn-load-more:active, .table > tfoot > tr.load-more th a.btn-load-more:focus, .table > tfoot > tr.load-more td a.btn-load-more, .table > tfoot > tr.load-more td a.btn-load-more:link, .table > tfoot > tr.load-more td a.btn-load-more:visited, .table > tfoot > tr.load-more td a.btn-load-more:hover, .table > tfoot > tr.load-more td a.btn-load-more:active, .table > tfoot > tr.load-more td a.btn-load-more:focus { color: var(--link-color) !important; background-color: var(--primary-5) !important; border-color: transparent !important; border-radius: 0px; } .table > thead > tr.load-more th a:hover, .table > thead > tr.load-more td a:hover, .table > tbody > tr.load-more th a:hover, .table > tbody > tr.load-more td a:hover, .table > tfoot > tr.load-more th a:hover, .table > tfoot > tr.load-more td a:hover { color: var(--link-color-hover) !important; background-color: var(--primary-10) !important; } .table > thead > tr.load-more th a.btn-load-more:hover, .table > thead > tr.load-more td a.btn-load-more:hover, .table > tbody > tr.load-more th a.btn-load-more:hover, .table > tbody > tr.load-more td a.btn-load-more:hover, .table > tfoot > tr.load-more th a.btn-load-more:hover, .table > tfoot > tr.load-more td a.btn-load-more:hover { color: var(--link-color-hover) !important; background-color: var(--primary-10) !important; border-color: transparent !important; } .table > thead > tr.no-details th, .table > thead > tr.no-details td, .table > tbody > tr.no-details th, .table > tbody > tr.no-details td, .table > tfoot > tr.no-details th, .table > tfoot > tr.no-details td { background-color: transparent !important; cursor: text !important; } .table > thead > tr.row-summary th, .table > thead > tr.row-summary td, .table > tbody > tr.row-summary th, .table > tbody > tr.row-summary td, .table > tfoot > tr.row-summary th, .table > tfoot > tr.row-summary td { background-color: var(--yellow-10) !important; cursor: pointer !important; } .table > thead > tr.row-summary th span, .table > thead > tr.row-summary td span, .table > tbody > tr.row-summary th span, .table > tbody > tr.row-summary td span, .table > tfoot > tr.row-summary th span, .table > tfoot > tr.row-summary td span { margin-right: 10px; } .table > thead > tr.tr-accordion td:first-child, .table > tbody > tr.tr-accordion td:first-child, .table > tfoot > tr.tr-accordion td:first-child { white-space: nowrap; } .table > thead > tr.tr-accordion td:first-child::before, .table > tbody > tr.tr-accordion td:first-child::before, .table > tfoot > tr.tr-accordion td:first-child::before { margin-right: 5px; width: 20px; height: auto; text-align: center; color: var(--gray-50); display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: "\f078"; } .table > thead > tr.tr-accordion.collapsed td:first-child::before, .table > tbody > tr.tr-accordion.collapsed td:first-child::before, .table > tfoot > tr.tr-accordion.collapsed td:first-child::before { display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: var(--fa-chevron-start); } .table > thead > tr.subheader th, .table > thead > tr.subheader td, .table > tbody > tr.subheader th, .table > tbody > tr.subheader td, .table > tfoot > tr.subheader th, .table > tfoot > tr.subheader td { font-weight: var(--fw-600) !important; color: var(--font-color-dark) !important; background-color: var(--slate-10) !important; } .table > thead > tr.subsubheader th, .table > thead > tr.subsubheader td, .table > tbody > tr.subsubheader th, .table > tbody > tr.subsubheader td, .table > tfoot > tr.subsubheader th, .table > tfoot > tr.subsubheader td { font-weight: var(--fw-600) !important; color: var(--font-color-dark) !important; background-color: var(--slate-5) !important; } .table > thead > tr.subsubtotal th, .table > thead > tr.subsubtotal td, .table > tbody > tr.subsubtotal th, .table > tbody > tr.subsubtotal td, .table > tfoot > tr.subsubtotal th, .table > tfoot > tr.subsubtotal td { font-weight: var(--fw-600) !important; color: var(--td-color) !important; background-color: var(--gray-5) !important; } .table > thead > tr.subtotal th, .table > thead > tr.subtotal td, .table > tbody > tr.subtotal th, .table > tbody > tr.subtotal td, .table > tfoot > tr.subtotal th, .table > tfoot > tr.subtotal td { font-weight: var(--fw-600) !important; color: var(--td-color) !important; background-color: var(--gray-10) !important; } .table > thead > tr.success th, .table > thead > tr.success td, .table > tbody > tr.success th, .table > tbody > tr.success td, .table > tfoot > tr.success th, .table > tfoot > tr.success td { color: var(--td-color) !important; background-color: var(--success-20) !important; } .table > thead > tr.total th, .table > thead > tr.total td, .table > tbody > tr.total th, .table > tbody > tr.total td, .table > tfoot > tr.total th, .table > tfoot > tr.total td { font-weight: var(--fw-600) !important; color: var(--td-color) !important; background-color: var(--gray-20) !important; } .table > thead > tr.valign-bottom th, .table > thead > tr.valign-bottom td, .table > tbody > tr.valign-bottom th, .table > tbody > tr.valign-bottom td, .table > tfoot > tr.valign-bottom th, .table > tfoot > tr.valign-bottom td { vertical-align: bottom; } .table > thead > tr.valign-middle th, .table > thead > tr.valign-middle td, .table > tbody > tr.valign-middle th, .table > tbody > tr.valign-middle td, .table > tfoot > tr.valign-middle th, .table > tfoot > tr.valign-middle td { vertical-align: middle; } .table > thead > tr.valign-top th, .table > thead > tr.valign-top td, .table > tbody > tr.valign-top th, .table > tbody > tr.valign-top td, .table > tfoot > tr.valign-top th, .table > tfoot > tr.valign-top td { vertical-align: top; } .table > thead > tr.warning th, .table > thead > tr.warning td, .table > tbody > tr.warning th, .table > tbody > tr.warning td, .table > tfoot > tr.warning th, .table > tfoot > tr.warning td { color: var(--td-color) !important; background-color: var(--warning-20) !important; } .table > thead > tr > th.disclosure, .table > thead > tr > td.disclosure, .table > tbody > tr > th.disclosure, .table > tbody > tr > td.disclosure, .table > tfoot > tr > th.disclosure, .table > tfoot > tr > td.disclosure { font-weight: var(--fw-400) !important; color: var(--font-color-dark) !important; background-color: transparent !important; } .table > thead > tr > th.grandtotal, .table > thead > tr > td.grandtotal, .table > tbody > tr > th.grandtotal, .table > tbody > tr > td.grandtotal, .table > tfoot > tr > th.grandtotal, .table > tfoot > tr > td.grandtotal { font-weight: var(--fw-600) !important; color: var(--font-color-dark) !important; background-color: var(--success-20) !important; } .table > thead > tr > th.header-asset, .table > thead > tr > td.header-asset, .table > tbody > tr > th.header-asset, .table > tbody > tr > td.header-asset, .table > tfoot > tr > th.header-asset, .table > tfoot > tr > td.header-asset { font-weight: var(--fw-600); color: var(--font-color-dark); background-color: var(--slate-10); } .table > thead > tr > th.header-category, .table > thead > tr > td.header-category, .table > tbody > tr > th.header-category, .table > tbody > tr > td.header-category, .table > tfoot > tr > th.header-category, .table > tfoot > tr > td.header-category { font-weight: var(--fw-600); color: var(--font-color-dark); background-color: var(--slate-20); } .table > thead > tr > th.header-currency, .table > thead > tr > td.header-currency, .table > tbody > tr > th.header-currency, .table > tbody > tr > td.header-currency, .table > tfoot > tr > th.header-currency, .table > tfoot > tr > td.header-currency { font-weight: var(--fw-600); color: var(--font-color-dark); background-color: var(--slate-5); } .table > thead > tr > th.icon-check, .table > thead > tr > td.icon-check, .table > tbody > tr > th.icon-check, .table > tbody > tr > td.icon-check, .table > tfoot > tr > th.icon-check, .table > tfoot > tr > td.icon-check { border-left: none; text-align: center; vertical-align: middle; width: 38px; } .table > thead > tr > th.icon-check img, .table > thead > tr > td.icon-check img, .table > tbody > tr > th.icon-check img, .table > tbody > tr > td.icon-check img, .table > tfoot > tr > th.icon-check img, .table > tfoot > tr > td.icon-check img { height: 14px; max-width: 14px; } .table > thead > tr > th.subtotal, .table > thead > tr > td.subtotal, .table > tbody > tr > th.subtotal, .table > tbody > tr > td.subtotal, .table > tfoot > tr > th.subtotal, .table > tfoot > tr > td.subtotal { font-weight: var(--fw-600) !important; color: var(--font-color-dark) !important; background-color: var(--gray-10) !important; } .table > thead > tr > th.total, .table > thead > tr > td.total, .table > tbody > tr > th.total, .table > tbody > tr > td.total, .table > tfoot > tr > th.total, .table > tfoot > tr > td.total { font-weight: var(--fw-600) !important; color: var(--font-color-dark) !important; background-color: var(--gray-20) !important; } .table > thead > tr > th.twr, .table > thead > tr > td.twr, .table > tbody > tr > th.twr, .table > tbody > tr > td.twr, .table > tfoot > tr > th.twr, .table > tfoot > tr > td.twr { font-weight: var(--fw-600); color: var(--font-color-dark); background-color: var(--success-10); border: 1px solid var(--success-40); } .table.table-bordered { border: 1px solid var(--border-color); } .table.table-bordered th { border-color: var(--border-color); } .table.table-bordered td { border-color: var(--border-color); } .table.table-hover tbody tr.active:hover > td, .table.table-hover tbody tr.active:hover > th, .table.table-hover tbody tr:hover > .active, .table.table-hover tbody tr > td.active:hover, .table.table-hover tbody tr > th.active:hover { background-color: var(--primary-5); } .table.table-hover tbody tr.disabled:hover > td, .table.table-hover tbody tr.disabled:hover > th, .table.table-hover tbody tr:hover > .disabled, .table.table-hover tbody tr > td.disabled:hover, .table.table-hover tbody tr > th.disabled:hover { color: var(--gray-90); background-color: var(--gray-40); } .table.table-hover tbody tr:hover { background-color: transparent; } .table.table-hover tbody tr:hover td { --bs-table-accent-bg: transparent; background-color: var(--gray-5); cursor: pointer; } .table.table-hover tbody tr.blank > td { background-color: transparent; cursor: default !important; } .table.table-hover tbody tr.no-hover > td:first-child::before { display: none; content: ""; } .table.table-hover tbody tr.no-hover > td:last-child::after { display: none; content: ""; } .table.table-hover tbody tr.no-hover:hover { color: inherit; background-color: inherit; cursor: default; } .table.table-hover tbody tr.no-hover:hover > td { background-color: inherit; cursor: default; } .table.table-layout-fixed { table-layout: fixed; } .table.table-striped > tbody > tr:nth-of-type(odd) > *, .table.table-striped > tbody > tr:nth-of-type(odd) { color: var(--td-color); --bs-table-accent-bg: transparent; background-color: var(--gray-5-solid); } .table.table-striped > tbody > tr:nth-of-type(even) { background-color: transparent; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ @media (max-width: 575.98px) { /* BOOTSTRAP OVERRIDES | TABLE ---------------------------------------------------------------------------------------------------- */ .table > thead > tr > th, .table > thead > tr > td, .table > tbody > tr > th, .table > tbody > tr > td, .table > tfoot > tr > th, .table > tfoot > tr > td { white-space: normal; } } /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ @media (min-width: 576px) and (max-width: 767.98px) { /* BOOTSTRAP OVERRIDES | TABLE ---------------------------------------------------------------------------------------------------- */ .table > thead > tr > th, .table > thead > tr > td, .table > tbody > tr > th, .table > tbody > tr > td, .table > tfoot > tr > th, .table > tfoot > tr > td { white-space: normal; } } /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* BOOTSTRAP OVERRIDES | TABLE ---------------------------------------------------------------------------------------------------- */ table, .table, .TableStyle-Base_PatternedRows { margin-bottom: 0px; border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); background-color: transparent; /* TABLE-BORDERED */ /* TABLE-STRIPED */ } table > :not(caption) > * > *, .table > :not(caption) > * > *, .TableStyle-Base_PatternedRows > :not(caption) > * > * { background-color: transparent; border-bottom-width: 0px; box-shadow: none; } table.table-bordered, .table.table-bordered, .TableStyle-Base_PatternedRows.table-bordered { border: 1px solid var(--border-color); } table.table-bordered th, .table.table-bordered th, .TableStyle-Base_PatternedRows.table-bordered th { border: 1px solid var(--border-color); } table.table-bordered td, .table.table-bordered td, .TableStyle-Base_PatternedRows.table-bordered td { border: 1px solid var(--border-color); } table.table-striped > tbody > tr:nth-of-type(odd) > *, table.table-striped > tbody > tr:nth-of-type(odd), .table.table-striped > tbody > tr:nth-of-type(odd) > *, .table.table-striped > tbody > tr:nth-of-type(odd), .TableStyle-Base_PatternedRows.table-striped > tbody > tr:nth-of-type(odd) > *, .TableStyle-Base_PatternedRows.table-striped > tbody > tr:nth-of-type(odd) { color: var(--td-color); --bs-table-accent-bg: transparent; background-color: var(--gray-5); } table.table-striped > tbody > tr:nth-of-type(even), .table.table-striped > tbody > tr:nth-of-type(even), .TableStyle-Base_PatternedRows.table-striped > tbody > tr:nth-of-type(even) { background-color: transparent; } table > thead colgroup col.default, table > tbody colgroup col.default, table > tfoot colgroup col.default, .table > thead colgroup col.default, .table > tbody colgroup col.default, .table > tfoot colgroup col.default, .TableStyle-Base_PatternedRows > thead colgroup col.default, .TableStyle-Base_PatternedRows > tbody colgroup col.default, .TableStyle-Base_PatternedRows > tfoot colgroup col.default { background-color: var(--gray-10); } table > thead colgroup col.danger, table > tbody colgroup col.danger, table > tfoot colgroup col.danger, .table > thead colgroup col.danger, .table > tbody colgroup col.danger, .table > tfoot colgroup col.danger, .TableStyle-Base_PatternedRows > thead colgroup col.danger, .TableStyle-Base_PatternedRows > tbody colgroup col.danger, .TableStyle-Base_PatternedRows > tfoot colgroup col.danger { background-color: var(--red-10); } table > thead colgroup col.error, table > tbody colgroup col.error, table > tfoot colgroup col.error, .table > thead colgroup col.error, .table > tbody colgroup col.error, .table > tfoot colgroup col.error, .TableStyle-Base_PatternedRows > thead colgroup col.error, .TableStyle-Base_PatternedRows > tbody colgroup col.error, .TableStyle-Base_PatternedRows > tfoot colgroup col.error { background-color: var(--red-10); } table > thead colgroup col.info, table > tbody colgroup col.info, table > tfoot colgroup col.info, .table > thead colgroup col.info, .table > tbody colgroup col.info, .table > tfoot colgroup col.info, .TableStyle-Base_PatternedRows > thead colgroup col.info, .TableStyle-Base_PatternedRows > tbody colgroup col.info, .TableStyle-Base_PatternedRows > tfoot colgroup col.info { background-color: var(--blue-10); } table > thead colgroup col.success, table > tbody colgroup col.success, table > tfoot colgroup col.success, .table > thead colgroup col.success, .table > tbody colgroup col.success, .table > tfoot colgroup col.success, .TableStyle-Base_PatternedRows > thead colgroup col.success, .TableStyle-Base_PatternedRows > tbody colgroup col.success, .TableStyle-Base_PatternedRows > tfoot colgroup col.success { background-color: var(--green-10); } table > thead colgroup col.warning, table > tbody colgroup col.warning, table > tfoot colgroup col.warning, .table > thead colgroup col.warning, .table > tbody colgroup col.warning, .table > tfoot colgroup col.warning, .TableStyle-Base_PatternedRows > thead colgroup col.warning, .TableStyle-Base_PatternedRows > tbody colgroup col.warning, .TableStyle-Base_PatternedRows > tfoot colgroup col.warning { background-color: var(--yellow-10); } table > thead colgroup col.gray, table > tbody colgroup col.gray, table > tfoot colgroup col.gray, .table > thead colgroup col.gray, .table > tbody colgroup col.gray, .table > tfoot colgroup col.gray, .TableStyle-Base_PatternedRows > thead colgroup col.gray, .TableStyle-Base_PatternedRows > tbody colgroup col.gray, .TableStyle-Base_PatternedRows > tfoot colgroup col.gray { background-color: var(--gray-40); } table > thead colgroup col.gray-light, table > tbody colgroup col.gray-light, table > tfoot colgroup col.gray-light, .table > thead colgroup col.gray-light, .table > tbody colgroup col.gray-light, .table > tfoot colgroup col.gray-light, .TableStyle-Base_PatternedRows > thead colgroup col.gray-light, .TableStyle-Base_PatternedRows > tbody colgroup col.gray-light, .TableStyle-Base_PatternedRows > tfoot colgroup col.gray-light { background-color: var(--gray-10); } table > thead colgroup col.gray-dark, table > tbody colgroup col.gray-dark, table > tfoot colgroup col.gray-dark, .table > thead colgroup col.gray-dark, .table > tbody colgroup col.gray-dark, .table > tfoot colgroup col.gray-dark, .TableStyle-Base_PatternedRows > thead colgroup col.gray-dark, .TableStyle-Base_PatternedRows > tbody colgroup col.gray-dark, .TableStyle-Base_PatternedRows > tfoot colgroup col.gray-dark { background-color: var(--gray-70); } table > thead tr th, .table > thead tr th, .TableStyle-Base_PatternedRows > thead tr th { padding: var(--th-pt) var(--th-pe) var(--th-pb) var(--th-ps); font-style: var(--th-font-style); font-weight: var(--th-font-weight); font-size: var(--th-font-size); line-height: var(--th-line-height); font-family: var(--th-font-family); color: var(--th-color); background-color: var(--th-bg-color); border-top: 1px solid var(--border-color); border-bottom: 2px solid var(--border-color); } table > thead tr th.bs-1, .table > thead tr th.bs-1, .TableStyle-Base_PatternedRows > thead tr th.bs-1 { border-left: 1px solid var(--border-color); } table > thead tr th.be-1, .table > thead tr th.be-1, .TableStyle-Base_PatternedRows > thead tr th.be-1 { border-right: 1px solid var(--border-color); } table > thead tr th[align=left], .table > thead tr th[align=left], .TableStyle-Base_PatternedRows > thead tr th[align=left] { text-align: var(--dir-start) !important; } table > thead tr th[align=right], .table > thead tr th[align=right], .TableStyle-Base_PatternedRows > thead tr th[align=right] { text-align: var(--dir-end) !important; } table > thead tr th[align=center], .table > thead tr th[align=center], .TableStyle-Base_PatternedRows > thead tr th[align=center] { text-align: center; } table > tbody + tbody, .table > tbody + tbody, .TableStyle-Base_PatternedRows > tbody + tbody { border-top: none; } table > tbody tr td, .table > tbody tr td, .TableStyle-Base_PatternedRows > tbody tr td { padding: var(--td-pt) var(--td-pe) var(--td-pb) var(--td-ps); font-style: var(--td-font-style); font-weight: var(--td-font-weight); font-size: var(--td-font-size); line-height: var(--td-line-height); font-family: var(--td-font-family); color: var(--td-color); background-color: var(--td-bg-color); border-top: 1px solid var(--border-color); } table > tbody tr td.bs-1, .table > tbody tr td.bs-1, .TableStyle-Base_PatternedRows > tbody tr td.bs-1 { border-left: 1px solid var(--border-color); } table > tbody tr td.be-1, .table > tbody tr td.be-1, .TableStyle-Base_PatternedRows > tbody tr td.be-1 { border-right: 1px solid var(--border-color); } table > tbody tr td p, .table > tbody tr td p, .TableStyle-Base_PatternedRows > tbody tr td p { font-style: var(--td-font-style); font-weight: var(--td-font-weight); font-size: var(--td-font-size); line-height: var(--td-line-height); font-family: var(--td-font-family); color: var(--td-color); } table > tbody tr td ul li, table > tbody tr td ol li, .table > tbody tr td ul li, .table > tbody tr td ol li, .TableStyle-Base_PatternedRows > tbody tr td ul li, .TableStyle-Base_PatternedRows > tbody tr td ol li { font-style: var(--td-font-style); font-weight: var(--td-font-weight); font-size: var(--td-font-size); line-height: var(--td-line-height); font-family: var(--td-font-family); color: var(--td-color); } table > tbody tr td[align=left], .table > tbody tr td[align=left], .TableStyle-Base_PatternedRows > tbody tr td[align=left] { text-align: var(--dir-start) !important; } table > tbody tr td[align=right], .table > tbody tr td[align=right], .TableStyle-Base_PatternedRows > tbody tr td[align=right] { text-align: var(--dir-end) !important; } table > tbody tr td[align=center], .table > tbody tr td[align=center], .TableStyle-Base_PatternedRows > tbody tr td[align=center] { text-align: center; } table > tbody tr td[valign=top], .table > tbody tr td[valign=top], .TableStyle-Base_PatternedRows > tbody tr td[valign=top] { vertical-align: top; } table > tbody tr td[valign=middle], .table > tbody tr td[valign=middle], .TableStyle-Base_PatternedRows > tbody tr td[valign=middle] { vertical-align: middle; } table > tbody tr td[valign=bottom], .table > tbody tr td[valign=bottom], .TableStyle-Base_PatternedRows > tbody tr td[valign=bottom] { vertical-align: bottom; } table > tbody tr.valign-top td, .table > tbody tr.valign-top td, .TableStyle-Base_PatternedRows > tbody tr.valign-top td { vertical-align: top; } table > tbody tr.valign-middle td, .table > tbody tr.valign-middle td, .TableStyle-Base_PatternedRows > tbody tr.valign-middle td { vertical-align: middle; } table > tbody tr.valign-bottom td, .table > tbody tr.valign-bottom td, .TableStyle-Base_PatternedRows > tbody tr.valign-bottom td { vertical-align: bottom; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* MADCAP FLARE OVERRIDES | BREADCRUMBS ---------------------------------------------------------------------------------------------------- */ .breadcrumbs { margin: 0px 0px 10px 0px; padding: 0px 0px 10px 0px; font-family: var(--font-family); font-size: 0.8125rem; line-height: 1.125rem; color: var(--font-color-light); border-bottom: 1px solid var(--border-color) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* MADCAP FLARE OVERRIDES | MENU ---------------------------------------------------------------------------------------------------- */ ul.menu a, ul.menu a:link, ul.menu a:visited, ul.menu a:hover, ul.menu a:active, ul.menu a:focus { color: var(--nav-bottom-dropdown-link-color); background-color: var(--nav-bottom-dropdown-link-bg-color); border-bottom: 1px solid var(--border-color); } ul.menu a:hover, ul.menu a:link:hover, ul.menu a:visited:hover, ul.menu a:hover:hover, ul.menu a:active:hover, ul.menu a:focus:hover { color: var(--nav-bottom-dropdown-link-color-hover); background-color: var(--nav-bottom-dropdown-link-bg-color-hover); } ul.menu a.selected, ul.menu a.selected:link, ul.menu a.selected:visited, ul.menu a.selected:hover, ul.menu a.selected:active, ul.menu a.selected:focus { font-weight: var(--fw-600) !important; color: var(--nav-bottom-dropdown-link-color-active); background-color: var(--nav-bottom-dropdown-link-bg-color-active); } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* MADCAP FLARE OVERRIDES | OFF-CANVAS ---------------------------------------------------------------------------------------------------- */ .off-canvas { background-color: var(--gray-5-solid); background: var(--gray-5-solid); box-shadow: var(--box-shadow); } .off-canvas ul { background-color: var(--gray-5-solid); } .off-canvas ul ul { background-color: var(--gray-5-solid); } .off-canvas ul.off-canvas-list li.is-drilldown-submenu-parent > a:after { margin-left: 0px; } .is-drilldown-submenu { background-color: var(--gray-5-solid); } .is-drilldown-submenu-parent > a::after { margin: 0px; margin-left: 8px !important; font-size: 0.8125rem !important; line-height: 0.8125rem !important; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: var(--fa-chevron-start); color: var(--gray-50); } .js-off-canvas-exit { box-shadow: var(--box-shadow); } .js-drilldown-back > a { color: var(--gray-80); } .js-drilldown-back > a::before { margin: 0px; margin-right: 8px !important; font-size: 0.8125rem !important; line-height: 0.8125rem !important; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: var(--fa-chevron-end); color: var(--gray-50); } .js-drilldown-back > a::after { display: none; margin: 0px; content: ""; } /* MEDIA QUERY | MADCAP FLARE ---------------------------------------------------------------------------------------------------- */ @media only screen and (max-width: 1279px) { /* MADCAP FLARE OVERRIDES | OFF-CANVAS ---------------------------------------------------------------------------------------------------- */ .off-canvas { background-color: var(--gray-5-solid); background: var(--gray-5-solid); box-shadow: var(--box-shadow); } ul.off-canvas-list li a, ul.off-canvas-list li a:link, ul.off-canvas-list li a:visited, ul.off-canvas-list li a:hover, ul.off-canvas-list li a:active, ul.off-canvas-list li a:focus { padding: 9px 30px; font-family: var(--font-family); font-weight: var(--fw-400); font-size: 1rem; line-height: 1.375rem; text-align: var(--dir-start); text-decoration: none; color: var(--nav-bottom-dropdown-link-color); background-color: var(--nav-bottom-dropdown-link-bg-color); border-bottom: 1px solid var(--border-color); } ul.off-canvas-list li a:hover, ul.off-canvas-list li a:link:hover, ul.off-canvas-list li a:visited:hover, ul.off-canvas-list li a:hover:hover, ul.off-canvas-list li a:active:hover, ul.off-canvas-list li a:focus:hover { color: var(--nav-bottom-dropdown-link-color-hover); background-color: var(--nav-bottom-dropdown-link-bg-color-hover); } ul.off-canvas-list li a.selected, ul.off-canvas-list li a.selected:link, ul.off-canvas-list li a.selected:visited, ul.off-canvas-list li a.selected:hover, ul.off-canvas-list li a.selected:active, ul.off-canvas-list li a.selected:focus { font-weight: var(--fw-600); color: var(--nav-bottom-dropdown-link-color-active); background-color: var(--nav-bottom-dropdown-link-bg-color-active); } } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* MADCAP FLARE OVERRIDES | SEARCH-RESULTS ---------------------------------------------------------------------------------------------------- */ h1#results-heading { font-style: var(--h1-font-style); font-weight: var(--h1-font-weight); font-size: var(--h4-font-size); line-height: var(--h4-line-height); color: var(--h1-color); } #resultList h3.title { line-height: var(--h3-line-height); } #resultList h3.title a, #resultList h3.title a:link, #resultList h3.title a:visited, #resultList h3.title a:hover, #resultList h3.title a:active, #resultList h3.title a:focus { text-decoration: none; color: var(--link-color); } #resultList .description { font-size: var(--p-font-size); line-height: var(--p-line-height); } #resultList .url cite { font-style: normal; font-size: var(--fs-8); line-height: var(--lh-8); color: var(--link-color); } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* MADCAP FLARE OVERRIDES | SIDENAV-WRAPPER ---------------------------------------------------------------------------------------------------- */ .sidenav-wrapper { background-color: var(--gray-5); box-shadow: var(--box-shadow); } .sidenav-container { margin: 0px 0px 20px 0px; padding: 0px; border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); } ul.sidenav li a, ul.sidenav li a:link, ul.sidenav li a:visited, ul.sidenav li a:hover, ul.sidenav li a:active, ul.sidenav li a:focus { padding: 9px 30px; font-family: var(--font-family); font-weight: var(--fw-400); font-size: 1rem; line-height: 1.375rem; text-align: var(--dir-start); text-decoration: none; color: var(--nav-bottom-dropdown-link-color); background-color: var(--nav-bottom-dropdown-link-bg-color); border-bottom: 1px solid var(--border-color); } ul.sidenav li a:hover, ul.sidenav li a:link:hover, ul.sidenav li a:visited:hover, ul.sidenav li a:hover:hover, ul.sidenav li a:active:hover, ul.sidenav li a:focus:hover { color: var(--nav-bottom-dropdown-link-color-hover); background-color: var(--nav-bottom-dropdown-link-bg-color-hover); } ul.sidenav li a.selected, ul.sidenav li a.selected:link, ul.sidenav li a.selected:visited, ul.sidenav li a.selected:hover, ul.sidenav li a.selected:active, ul.sidenav li a.selected:focus { font-weight: var(--fw-600); color: var(--nav-bottom-dropdown-link-color-active); background-color: var(--nav-bottom-dropdown-link-bg-color-active); } ul.sidenav li:last-child a, ul.sidenav li:last-child a:link, ul.sidenav li:last-child a:visited, ul.sidenav li:last-child a:hover, ul.sidenav li:last-child a:active, ul.sidenav li:last-child a:focus { border-bottom: none; } ul.sidenav li.is-accordion-submenu-parent > a span.submenu-toggle { border-top-color: var(--border-color); } ul.sidenav ul > li > a, ul.sidenav ul > li > a:link, ul.sidenav ul > li > a:visited, ul.sidenav ul > li > a:hover, ul.sidenav ul > li > a:active, ul.sidenav ul > li > a:focus { margin: 0px; padding: 9px 30px; padding-left: 45px; border-bottom: none; } ul.sidenav ul > li > a:hover, ul.sidenav ul > li > a:link:hover, ul.sidenav ul > li > a:visited:hover, ul.sidenav ul > li > a:hover:hover, ul.sidenav ul > li > a:active:hover, ul.sidenav ul > li > a:focus:hover { color: var(--nav-bottom-dropdown-link-color-hover); background-color: var(--nav-bottom-dropdown-link-bg-color-hover); } ul.sidenav ul > li > a.selected, ul.sidenav ul > li > a.selected:link, ul.sidenav ul > li > a.selected:visited, ul.sidenav ul > li > a.selected:hover, ul.sidenav ul > li > a.selected:active, ul.sidenav ul > li > a.selected:focus { font-weight: var(--fw-600); color: var(--nav-bottom-dropdown-link-color-active); background-color: var(--nav-bottom-dropdown-link-bg-color-active); } ul.sidenav ul ul > li > a, ul.sidenav ul ul > li > a:link, ul.sidenav ul ul > li > a:visited, ul.sidenav ul ul > li > a:hover, ul.sidenav ul ul > li > a:active, ul.sidenav ul ul > li > a:focus { margin: 0px; padding: 9px 30px; padding-left: 60px; } ul.sidenav ul ul > li > a:hover, ul.sidenav ul ul > li > a:link:hover, ul.sidenav ul ul > li > a:visited:hover, ul.sidenav ul ul > li > a:hover:hover, ul.sidenav ul ul > li > a:active:hover, ul.sidenav ul ul > li > a:focus:hover { color: var(--nav-bottom-dropdown-link-color-hover); background-color: var(--nav-bottom-dropdown-link-bg-color-hover); } ul.sidenav ul ul > li > a.selected, ul.sidenav ul ul > li > a.selected:link, ul.sidenav ul ul > li > a.selected:visited, ul.sidenav ul ul > li > a.selected:hover, ul.sidenav ul ul > li > a.selected:active, ul.sidenav ul ul > li > a.selected:focus { font-weight: var(--fw-600); color: var(--nav-bottom-dropdown-link-color-active); background-color: var(--nav-bottom-dropdown-link-bg-color-active); } ul.sidenav ul ul ul > li > a, ul.sidenav ul ul ul > li > a:link, ul.sidenav ul ul ul > li > a:visited, ul.sidenav ul ul ul > li > a:hover, ul.sidenav ul ul ul > li > a:active, ul.sidenav ul ul ul > li > a:focus { margin: 0px; padding: 9px 30px; padding-left: 75px; } ul.sidenav ul ul ul > li > a:hover, ul.sidenav ul ul ul > li > a:link:hover, ul.sidenav ul ul ul > li > a:visited:hover, ul.sidenav ul ul ul > li > a:hover:hover, ul.sidenav ul ul ul > li > a:active:hover, ul.sidenav ul ul ul > li > a:focus:hover { color: var(--nav-bottom-dropdown-link-color-hover); background-color: var(--nav-bottom-dropdown-link-bg-color-hover); } ul.sidenav ul ul ul > li > a.selected, ul.sidenav ul ul ul > li > a.selected:link, ul.sidenav ul ul ul > li > a.selected:visited, ul.sidenav ul ul ul > li > a.selected:hover, ul.sidenav ul ul ul > li > a.selected:active, ul.sidenav ul ul ul > li > a.selected:focus { font-weight: var(--fw-600); color: var(--nav-bottom-dropdown-link-color-active); background-color: var(--nav-bottom-dropdown-link-bg-color-active); } ul.sidenav ul ul ul ul > li > a, ul.sidenav ul ul ul ul > li > a:link, ul.sidenav ul ul ul ul > li > a:visited, ul.sidenav ul ul ul ul > li > a:hover, ul.sidenav ul ul ul ul > li > a:active, ul.sidenav ul ul ul ul > li > a:focus { margin: 0px; padding: 9px 30px; padding-left: 90px; } ul.sidenav ul ul ul ul > li > a:hover, ul.sidenav ul ul ul ul > li > a:link:hover, ul.sidenav ul ul ul ul > li > a:visited:hover, ul.sidenav ul ul ul ul > li > a:hover:hover, ul.sidenav ul ul ul ul > li > a:active:hover, ul.sidenav ul ul ul ul > li > a:focus:hover { color: var(--nav-bottom-dropdown-link-color-hover); background-color: var(--nav-bottom-dropdown-link-bg-color-hover); } ul.sidenav ul ul ul ul > li > a.selected, ul.sidenav ul ul ul ul > li > a.selected:link, ul.sidenav ul ul ul ul > li > a.selected:visited, ul.sidenav ul ul ul ul > li > a.selected:hover, ul.sidenav ul ul ul ul > li > a.selected:active, ul.sidenav ul ul ul ul > li > a.selected:focus { font-weight: var(--fw-600); color: var(--nav-bottom-dropdown-link-color-active); background-color: var(--nav-bottom-dropdown-link-bg-color-active); } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* MADCAP FLARE OVERRIDES | TITLE-BAR ---------------------------------------------------------------------------------------------------- */ nav.title-bar { background-color: var(--nav-bottom-bg-color); box-shadow: var(--box-shadow); } .title-bar-layout .logo-wrapper { min-height: 43px; } .title-bar-layout a.logo { display: var(--brand-logo-display); width: var(--brand-logo-width); height: var(--brand-logo-height); background: rgba(0, 0, 0, 0) var(--brand-logo-image) var(--brand-logo-repeat) var(--brand-logo-position); background-size: var(--brand-logo-size); } .nav-search { float: var(--dir-end); } .search, .search-bar { color: var(--font-color); } .search-bar .search-field { position: relative; top: 0px; left: 0px; margin: 0px; padding: var(--input-pt) var(--input-pe) var(--input-pb) var(--input-ps); height: 34px; font-style: var(--input-font-style); font-weight: var(--input-font-weight); font-size: var(--input-font-size); line-height: var(--input-line-height); font-family: var(--input-font-family); color: var(--input-color); background-color: var(--input-bg-color); border: 1px solid var(--input-border-color); border-radius: var(--border-radius); box-shadow: none; } .search-bar .search-field:focus { color: var(--input-color-focus); background-color: var(--input-bg-color-focus); border-color: var(--input-border-color-focus); outline: none; box-shadow: var(--box-shadow); } .search-bar .search-submit-wrapper { left: auto; right: 0px; } .search-bar.search-bar-container .search-submit { width: 40px; height: 34px; background: none; } .search-bar.search-bar-container .search-submit::after { margin: 7px 0px 0px 0px; margin-left: 3px; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: "\f002"; color: var(--font-color-light); } .search-bar.search-bar-container .search-submit:hover { background: none; } .search-bar.search-bar-container .search-submit:hover::after { color: var(--font-color-dark); } /* MEDIA QUERY | MADCAP FLARE ---------------------------------------------------------------------------------------------------- */ @media only screen and (max-width: 1279px) { /* MADCAP FLARE OVERRIDES | TITLE-BAR ---------------------------------------------------------------------------------------------------- */ .title-bar .menu-icon span { display: block; margin: 0px; padding: 10px; width: 48px; height: 48px; text-align: center; background: none; } .title-bar .menu-icon span::after { font-size: 1.5rem !important; line-height: 1.5rem !important; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; font: var(--fa-font-solid); /* variable store in /fontaweomse-6.2.0/all.min.css sheet */ content: "\f0c9"; color: var(--font-color-dark); } } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* PAGINATION ---------------------------------------------------------------------------------------------------- */ #pagination { margin: 20px 0px; height: auto; line-height: initial; } #pagination a, #pagination a:link, #pagination a:visited, #pagination a:hover, #pagination a:active, #pagination a:focus { margin: 0px 2px; padding: 8px; min-width: 34px; height: auto; font-style: var(--btn-xs-font-style); font-weight: var(--btn-xs-font-weight); font-size: var(--btn-xs-font-size); line-height: var(--btn-xs-line-height); font-family: var(--btn-xs-font-family); color: var(--btn-default-color) !important; background-color: var(--btn-default-bg-color) !important; border: 1px solid var(--btn-default-border-color) !important; border-radius: var(--border-radius); cursor: pointer; } #pagination a#selected, #pagination a#selected:link, #pagination a#selected:visited, #pagination a#selected:hover, #pagination a#selected:active, #pagination a#selected:focus { font-weight: var(--fw-bold); color: var(--btn-default-color-active) !important; background-color: var(--btn-default-bg-color-active) !important; border-color: var(--btn-default-border-color-active) !important; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* TO TOP ---------------------------------------------------------------------------------------------------- */ #toTop { display: none; position: fixed; bottom: 16px; right: 15px; z-index: 600; margin: 0px; padding: 0px; width: 36px; height: 36px; text-decoration: none; text-indent: -999px; background: url('https://www.interactivebrokers.com/images/web/template/arrow-scroll-up.png') no-repeat 0px 0px; border: none; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; overflow: hidden; outline: none; opacity: 0.5; } #toTop:hover { opacity: 1; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* CONTENTS ---------------------------------------------------------------------------------------------------- */ #contents { margin: 40px auto; padding: 40px; max-width: 1400px; height: auto; border: 1px solid var(--border-color); } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* FOOTER ---------------------------------------------------------------------------------------------------- */ footer { position: relative; margin: 0px -15px; padding: 50px 0px; background-color: var(--bg-body); border-top: 1px solid var(--border-color); } footer .container, footer .container-fluid { margin: 0px auto; max-width: 1400px; /* FOOTER ENTITIES */ } footer .container .row, footer .container-fluid .row { margin: 0px; } footer .container .row .col, footer .container-fluid .row .col { padding: 0px 15px; } footer .container p, footer .container li, footer .container sup, footer .container th, footer .container td, footer .container label, footer .container input, footer .container select, footer .container textarea, footer .container-fluid p, footer .container-fluid li, footer .container-fluid sup, footer .container-fluid th, footer .container-fluid td, footer .container-fluid label, footer .container-fluid input, footer .container-fluid select, footer .container-fluid textarea { font-weight: var(--fw-400); font-size: 0.8125rem; line-height: 1.25rem; color: var(--footer-font-color); } footer .container sup, footer .container-fluid sup { font-size: 0.625rem; line-height: 1.125rem; } footer .container a, footer .container a:link, footer .container a:hover, footer .container a:visited, footer .container a:active, footer .container a:focus, footer .container-fluid a, footer .container-fluid a:link, footer .container-fluid a:hover, footer .container-fluid a:visited, footer .container-fluid a:active, footer .container-fluid a:focus { text-decoration: underline; color: var(--footer-link-color); } footer .container a i, footer .container a svg, footer .container a:link i, footer .container a:link svg, footer .container a:hover i, footer .container a:hover svg, footer .container a:visited i, footer .container a:visited svg, footer .container a:active i, footer .container a:active svg, footer .container a:focus i, footer .container a:focus svg, footer .container-fluid a i, footer .container-fluid a svg, footer .container-fluid a:link i, footer .container-fluid a:link svg, footer .container-fluid a:hover i, footer .container-fluid a:hover svg, footer .container-fluid a:visited i, footer .container-fluid a:visited svg, footer .container-fluid a:active i, footer .container-fluid a:active svg, footer .container-fluid a:focus i, footer .container-fluid a:focus svg { color: var(--footer-link-color); } footer .container a:hover, footer .container-fluid a:hover { text-decoration: none; color: var(--footer-link-color-hover); } footer .container a:hover i, footer .container a:hover svg, footer .container-fluid a:hover i, footer .container-fluid a:hover svg { color: var(--footer-link-color-hover); } footer .container a:active, footer .container-fluid a:active { text-decoration: none; color: var(--footer-link-color-active); } footer .container a:active i, footer .container a:active svg, footer .container-fluid a:active i, footer .container-fluid a:active svg { color: var(--footer-link-color-active); } footer .container .footer-site-links, footer .container .footer-disclosure-links, footer .container-fluid .footer-site-links, footer .container-fluid .footer-disclosure-links { margin: 40px 0px 0px 0px; border-top: 1px solid var(--border-color); } footer .container .footer-site-links p, footer .container .footer-disclosure-links p, footer .container-fluid .footer-site-links p, footer .container-fluid .footer-disclosure-links p { margin: 20px 0px 5px 0px; font-weight: var(--fw-600); } footer .container .footer-site-links ul, footer .container .footer-site-links ol, footer .container .footer-disclosure-links ul, footer .container .footer-disclosure-links ol, footer .container-fluid .footer-site-links ul, footer .container-fluid .footer-site-links ol, footer .container-fluid .footer-disclosure-links ul, footer .container-fluid .footer-disclosure-links ol { margin: 0px; padding: 0px; list-style: none; } footer .container .footer-site-links ul li, footer .container .footer-site-links ol li, footer .container .footer-disclosure-links ul li, footer .container .footer-disclosure-links ol li, footer .container-fluid .footer-site-links ul li, footer .container-fluid .footer-site-links ol li, footer .container-fluid .footer-disclosure-links ul li, footer .container-fluid .footer-disclosure-links ol li { margin: 0px; padding: 0px; line-height: 1.125rem; } footer .container .footer-site-links a, footer .container .footer-site-links a:link, footer .container .footer-site-links a:hover, footer .container .footer-site-links a:visited, footer .container .footer-site-links a:active, footer .container .footer-site-links a:focus, footer .container .footer-disclosure-links a, footer .container .footer-disclosure-links a:link, footer .container .footer-disclosure-links a:hover, footer .container .footer-disclosure-links a:visited, footer .container .footer-disclosure-links a:active, footer .container .footer-disclosure-links a:focus, footer .container-fluid .footer-site-links a, footer .container-fluid .footer-site-links a:link, footer .container-fluid .footer-site-links a:hover, footer .container-fluid .footer-site-links a:visited, footer .container-fluid .footer-site-links a:active, footer .container-fluid .footer-site-links a:focus, footer .container-fluid .footer-disclosure-links a, footer .container-fluid .footer-disclosure-links a:link, footer .container-fluid .footer-disclosure-links a:hover, footer .container-fluid .footer-disclosure-links a:visited, footer .container-fluid .footer-disclosure-links a:active, footer .container-fluid .footer-disclosure-links a:focus { display: inline-block; padding: 3px 0px; text-decoration: none; } footer .container .footer-site-links a i, footer .container .footer-site-links a svg, footer .container .footer-site-links a:link i, footer .container .footer-site-links a:link svg, footer .container .footer-site-links a:hover i, footer .container .footer-site-links a:hover svg, footer .container .footer-site-links a:visited i, footer .container .footer-site-links a:visited svg, footer .container .footer-site-links a:active i, footer .container .footer-site-links a:active svg, footer .container .footer-site-links a:focus i, footer .container .footer-site-links a:focus svg, footer .container .footer-disclosure-links a i, footer .container .footer-disclosure-links a svg, footer .container .footer-disclosure-links a:link i, footer .container .footer-disclosure-links a:link svg, footer .container .footer-disclosure-links a:hover i, footer .container .footer-disclosure-links a:hover svg, footer .container .footer-disclosure-links a:visited i, footer .container .footer-disclosure-links a:visited svg, footer .container .footer-disclosure-links a:active i, footer .container .footer-disclosure-links a:active svg, footer .container .footer-disclosure-links a:focus i, footer .container .footer-disclosure-links a:focus svg, footer .container-fluid .footer-site-links a i, footer .container-fluid .footer-site-links a svg, footer .container-fluid .footer-site-links a:link i, footer .container-fluid .footer-site-links a:link svg, footer .container-fluid .footer-site-links a:hover i, footer .container-fluid .footer-site-links a:hover svg, footer .container-fluid .footer-site-links a:visited i, footer .container-fluid .footer-site-links a:visited svg, footer .container-fluid .footer-site-links a:active i, footer .container-fluid .footer-site-links a:active svg, footer .container-fluid .footer-site-links a:focus i, footer .container-fluid .footer-site-links a:focus svg, footer .container-fluid .footer-disclosure-links a i, footer .container-fluid .footer-disclosure-links a svg, footer .container-fluid .footer-disclosure-links a:link i, footer .container-fluid .footer-disclosure-links a:link svg, footer .container-fluid .footer-disclosure-links a:hover i, footer .container-fluid .footer-disclosure-links a:hover svg, footer .container-fluid .footer-disclosure-links a:visited i, footer .container-fluid .footer-disclosure-links a:visited svg, footer .container-fluid .footer-disclosure-links a:active i, footer .container-fluid .footer-disclosure-links a:active svg, footer .container-fluid .footer-disclosure-links a:focus i, footer .container-fluid .footer-disclosure-links a:focus svg { margin: 0px; margin-right: 5px; width: 15px; } footer .container .footer-site-links a img, footer .container .footer-site-links a:link img, footer .container .footer-site-links a:hover img, footer .container .footer-site-links a:visited img, footer .container .footer-site-links a:active img, footer .container .footer-site-links a:focus img, footer .container-fluid .footer-site-links a img, footer .container-fluid .footer-site-links a:link img, footer .container-fluid .footer-site-links a:hover img, footer .container-fluid .footer-site-links a:visited img, footer .container-fluid .footer-site-links a:active img, footer .container-fluid .footer-site-links a:focus img { margin: 0px; margin-right: 5px; max-width: 28px; } footer .container .footer-disclosure-links, footer .container-fluid .footer-disclosure-links { margin: 40px 0px 0px 0px; padding: 10px 0px; border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); } footer .container .footer-disclosure-links ul, footer .container-fluid .footer-disclosure-links ul { text-align: center; } footer .container .footer-disclosure-links ul li, footer .container-fluid .footer-disclosure-links ul li { display: inline-block; margin: 0px; padding: 0px; } footer .container .footer-disclosure-links ul li::after, footer .container-fluid .footer-disclosure-links ul li::after { margin: 0px 6px; margin-left: 10px; content: "|"; } footer .container .footer-disclosure-links ul li:last-child::after, footer .container-fluid .footer-disclosure-links ul li:last-child::after { content: ""; } footer .container .footer-disclosure-links ul li a, footer .container .footer-disclosure-links ul li a:link, footer .container .footer-disclosure-links ul li a:hover, footer .container .footer-disclosure-links ul li a:visited, footer .container .footer-disclosure-links ul li a:active, footer .container .footer-disclosure-links ul li a:focus, footer .container-fluid .footer-disclosure-links ul li a, footer .container-fluid .footer-disclosure-links ul li a:link, footer .container-fluid .footer-disclosure-links ul li a:hover, footer .container-fluid .footer-disclosure-links ul li a:visited, footer .container-fluid .footer-disclosure-links ul li a:active, footer .container-fluid .footer-disclosure-links ul li a:focus { text-decoration: none; } footer .container .footer-entities, footer .container-fluid .footer-entities { margin: 0px; padding: 20px 0px; } footer .container .footer-entities .footer-entity, footer .container-fluid .footer-entities .footer-entity { text-align: center; } footer .container .footer-entities .footer-entity p, footer .container-fluid .footer-entities .footer-entity p { text-align: center; } footer .container .footer-entities .footer-entity p a, footer .container .footer-entities .footer-entity p a:link, footer .container .footer-entities .footer-entity p a:hover, footer .container .footer-entities .footer-entity p a:visited, footer .container .footer-entities .footer-entity p a:active, footer .container .footer-entities .footer-entity p a:focus, footer .container-fluid .footer-entities .footer-entity p a, footer .container-fluid .footer-entities .footer-entity p a:link, footer .container-fluid .footer-entities .footer-entity p a:hover, footer .container-fluid .footer-entities .footer-entity p a:visited, footer .container-fluid .footer-entities .footer-entity p a:active, footer .container-fluid .footer-entities .footer-entity p a:focus { text-decoration: underline; } footer .container .footer-entities .footer-entity p.entity-name, footer .container-fluid .footer-entities .footer-entity p.entity-name { margin: 30px 0px 5px 0px; font-weight: var(--fw-600); font-size: 0.875rem; text-align: center; } footer .container .footer-entities .footer-entity p.entity-name a, footer .container .footer-entities .footer-entity p.entity-name a:link, footer .container .footer-entities .footer-entity p.entity-name a:hover, footer .container .footer-entities .footer-entity p.entity-name a:visited, footer .container .footer-entities .footer-entity p.entity-name a:active, footer .container .footer-entities .footer-entity p.entity-name a:focus, footer .container-fluid .footer-entities .footer-entity p.entity-name a, footer .container-fluid .footer-entities .footer-entity p.entity-name a:link, footer .container-fluid .footer-entities .footer-entity p.entity-name a:hover, footer .container-fluid .footer-entities .footer-entity p.entity-name a:visited, footer .container-fluid .footer-entities .footer-entity p.entity-name a:active, footer .container-fluid .footer-entities .footer-entity p.entity-name a:focus { font-weight: var(--fw-600); text-decoration: none; } footer .container .footer-entities .footer-entity p.footer-entities-link, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link { margin: 40px 0px 0px 0px; } footer .container .footer-entities .footer-entity p.footer-entities-link a, footer .container .footer-entities .footer-entity p.footer-entities-link a:link, footer .container .footer-entities .footer-entity p.footer-entities-link a:hover, footer .container .footer-entities .footer-entity p.footer-entities-link a:visited, footer .container .footer-entities .footer-entity p.footer-entities-link a:active, footer .container .footer-entities .footer-entity p.footer-entities-link a:focus, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a:link, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a:hover, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a:visited, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a:active, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a:focus { font-weight: var(--fw-600); font-size: 0.875rem; text-decoration: none; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } footer .container .footer-entities .footer-entity p.footer-entities-link a.collapsed:hover, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a.collapsed:hover { color: var(--footer-link-color-hover); } footer .container .footer-entities .footer-entity p.footer-entities-link a.collapsed:active, footer .container-fluid .footer-entities .footer-entity p.footer-entities-link a.collapsed:active { color: var(--footer-link-color-active); } footer .container .footer-entities .footer-entities-list, footer .container-fluid .footer-entities .footer-entities-list { margin: 20px 0px 0px 0px; padding: 0px; border-top: 1px solid var(--border-color); } footer .container .footer-entities .footer-entities-list .row, footer .container-fluid .footer-entities .footer-entities-list .row { display: flex; flex-wrap: wrap; } footer .container .footer-entities .footer-entities-list .row > div, footer .container-fluid .footer-entities .footer-entities-list .row > div { flex: 0 0 auto; padding: 16px; width: 50%; box-sizing: border-box; } footer .container .footer-entities .footer-entities-list p, footer .container-fluid .footer-entities .footer-entities-list p { text-align: var(--dir-start); } footer .container .footer-entities .footer-entities-list p a, footer .container .footer-entities .footer-entities-list p a:link, footer .container .footer-entities .footer-entities-list p a:hover, footer .container .footer-entities .footer-entities-list p a:visited, footer .container .footer-entities .footer-entities-list p a:active, footer .container .footer-entities .footer-entities-list p a:focus, footer .container-fluid .footer-entities .footer-entities-list p a, footer .container-fluid .footer-entities .footer-entities-list p a:link, footer .container-fluid .footer-entities .footer-entities-list p a:hover, footer .container-fluid .footer-entities .footer-entities-list p a:visited, footer .container-fluid .footer-entities .footer-entities-list p a:active, footer .container-fluid .footer-entities .footer-entities-list p a:focus { text-decoration: underline; } footer .container .footer-entities .footer-entities-list p.entity-name, footer .container-fluid .footer-entities .footer-entities-list p.entity-name { margin: 30px 0px 5px 0px; font-weight: var(--fw-600); font-size: 0.875rem; text-align: var(--dir-start); } footer .container .footer-entities .footer-entities-list p.entity-name a, footer .container .footer-entities .footer-entities-list p.entity-name a:link, footer .container .footer-entities .footer-entities-list p.entity-name a:hover, footer .container .footer-entities .footer-entities-list p.entity-name a:visited, footer .container .footer-entities .footer-entities-list p.entity-name a:active, footer .container .footer-entities .footer-entities-list p.entity-name a:focus, footer .container-fluid .footer-entities .footer-entities-list p.entity-name a, footer .container-fluid .footer-entities .footer-entities-list p.entity-name a:link, footer .container-fluid .footer-entities .footer-entities-list p.entity-name a:hover, footer .container-fluid .footer-entities .footer-entities-list p.entity-name a:visited, footer .container-fluid .footer-entities .footer-entities-list p.entity-name a:active, footer .container-fluid .footer-entities .footer-entities-list p.entity-name a:focus { text-decoration: none; } /* MEDIA QUERY | EXTRA SMALL ---------------------------------------------------------------------------------------------------- */ @media (max-width: 575.98px) { /* FOOTER ---------------------------------------------------------------------------------------------------- */ footer .container, footer .container-fluid { /* FOOTER ENTITIES */ } footer .container .footer-disclosure-links ul, footer .container-fluid .footer-disclosure-links ul { text-align: var(--dir-start); } footer .container .footer-disclosure-links ul li, footer .container-fluid .footer-disclosure-links ul li { display: block; } footer .container .footer-disclosure-links ul li::after, footer .container-fluid .footer-disclosure-links ul li::after { margin: 0px; content: ""; } footer .container .footer-entities .footer-entity h6, footer .container-fluid .footer-entities .footer-entity h6 { text-align: var(--dir-start); } footer .container .footer-entities .footer-entity p, footer .container-fluid .footer-entities .footer-entity p { text-align: var(--dir-start); } } /* MEDIA QUERY | SMALL ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | MEDIUM ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | LARGE ---------------------------------------------------------------------------------------------------- */ /* MEDIA QUERY | EXTRA LARGE ---------------------------------------------------------------------------------------------------- */ /* SCSS Document */ /* THEME-ROOT.CSS OVERRIDES | FONTS ---------------------------------------------------------------------------------------------------- */ @font-face { font-family: "Proxima Nova"; font-style: normal; font-weight: 300; src: local("proxima-nova-light"), local("proxima nova light"), url("/fonts/whitebranding/default/Proxima-Nova-Light.woff2") format("woff2"), url("/fonts/whitebranding/default/Proxima-Nova-Light.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Nova"; font-style: normal; font-weight: 400; src: local("proxima-nova-regular"), local("proxima nova regular"), url("/fonts/whitebranding/default/Proxima-Nova-Regular.woff2") format("woff2"), url("/fonts/whitebranding/default/Proxima-Nova-Regular.woff") format("woff"); font-display: swap; } @font-face { font-family: "Proxima Nova"; font-style: normal; font-weight: 600; src: local("proxima-nova-semibold"), local("proxima nova semibold"), url("/fonts/whitebranding/default/Proxima-Nova-Semibold.woff2") format("woff2"), url("/fonts/whitebranding/default/Proxima-Nova-Semibold.woff") format("woff"); font-display: swap; } /* THEME-ROOT.CSS OVERRIDES | VARIABLES ---------------------------------------------------------------------------------------------------- */ :root { /* COLORS */ --primary-3: hsla(163, 72%, 47%, 0.03); --primary-5: hsla(163, 72%, 47%, 0.05); --primary-10: hsla(163, 72%, 47%, 0.10); --primary-20: hsla(163, 72%, 47%, 0.20); --primary-30: hsla(163, 72%, 47%, 0.30); --primary-40: hsla(163, 72%, 47%, 0.40); --primary-50: hsla(163, 72%, 47%, 0.50); --primary-60: hsla(163, 72%, 47%, 0.60); --primary-70: hsla(163, 72%, 47%, 0.70); --primary-80: hsla(163, 72%, 47%, 0.80); --primary-90: hsla(163, 72%, 47%, 0.90); --primary: hsla(163, 72%, 47%, 1.0); --primary-dark-10: hsla(174, 42%, 42%, 1.0); --primary-dark-20: hsla(174, 42%, 37%, 1.0); --primary-dark-30: hsla(174, 42%, 32%, 1.0); --primary-dark-40: hsla(174, 42%, 27%, 1.0); --primary-dark-50: hsla(174, 42%, 22%, 1.0); --secondary-3: hsla(0, 0%, 58%, 0.03); --secondary-5: hsla(0, 0%, 58%, 0.05); --secondary-10: hsla(0, 0%, 58%, 0.10); --secondary-20: hsla(0, 0%, 58%, 0.20); --secondary-30: hsla(0, 0%, 58%, 0.30); --secondary-40: hsla(0, 0%, 58%, 0.40); --secondary-50: hsla(0, 0%, 58%, 0.50); --secondary-60: hsla(0, 0%, 58%, 0.60); --secondary-70: hsla(0, 0%, 58%, 0.70); --secondary-80: hsla(0, 0%, 58%, 0.80); --secondary-90: hsla(0, 0%, 58%, 0.90); --secondary: hsla(0, 0%, 58%, 1.0); --secondary-dark-10: hsla(0, 0%, 53%, 1.0); --secondary-dark-20: hsla(0, 0%, 48%, 1.0); --secondary-dark-30: hsla(0, 0%, 43%, 1.0); --secondary-dark-40: hsla(0, 0%, 38%, 1.0); --secondary-dark-50: hsla(0, 0%, 33%, 1.0); --tertiary-3: hsla(0, 0%, 0%, 0.03); --tertiary-5: hsla(0, 0%, 0%, 0.05); --tertiary-10: hsla(0, 0%, 0%, 0.10); --tertiary-20: hsla(0, 0%, 0%, 0.20); --tertiary-30: hsla(0, 0%, 0%, 0.30); --tertiary-40: hsla(0, 0%, 0%, 0.40); --tertiary-50: hsla(0, 0%, 0%, 0.50); --tertiary-60: hsla(0, 0%, 0%, 0.60); --tertiary-70: hsla(0, 0%, 0%, 0.70); --tertiary-80: hsla(0, 0%, 0%, 0.80); --tertiary-90: hsla(0, 0%, 0%, 0.90); --tertiary: hsla(0, 0%, 0%, 1.0); --tertiary-dark-10: hsla(0, 0%, 0%, 1.0); --tertiary-dark-20: hsla(0, 0%, 0%, 1.0); --tertiary-dark-30: hsla(0, 0%, 0%, 1.0); --tertiary-dark-40: hsla(0, 0%, 0%, 1.0); --tertiary-dark-50: hsla(0, 0%, 0%, 1.0); --info-3: hsla(216, 83%, 41%, 0.03); --info-5: hsla(216, 83%, 41%, 0.05); --info-10: hsla(216, 83%, 41%, 0.10); --info-20: hsla(216, 83%, 41%, 0.20); --info-30: hsla(216, 83%, 41%, 0.30); --info-40: hsla(216, 83%, 41%, 0.40); --info-50: hsla(216, 83%, 41%, 0.50); --info-60: hsla(216, 83%, 41%, 0.60); --info-70: hsla(216, 83%, 41%, 0.70); --info-80: hsla(216, 83%, 41%, 0.80); --info-90: hsla(216, 83%, 41%, 0.90); --info: hsla(216, 83%, 41%, 1.0); --info-dark-10: hsla(215, 89%, 32%, 1.0); --info-dark-20: hsla(214, 75%, 25%, 1.0); --info-dark-30: hsla(214, 69%, 22%, 1.0); --info-dark-40: hsla(214, 63%, 19%, 1.0); --info-dark-50: hsla(216, 51%, 16%, 1.0); --success-3: hsla(148, 96%, 27%, 0.03); --success-5: hsla(148, 96%, 27%, 0.05); --success-10: hsla(148, 96%, 27%, 0.10); --success-20: hsla(148, 96%, 27%, 0.20); --success-30: hsla(148, 96%, 27%, 0.30); --success-40: hsla(148, 96%, 27%, 0.40); --success-50: hsla(148, 96%, 27%, 0.50); --success-60: hsla(148, 96%, 27%, 0.60); --success-70: hsla(148, 96%, 27%, 0.70); --success-80: hsla(148, 96%, 27%, 0.80); --success-90: hsla(148, 96%, 27%, 0.90); --success: hsla(148, 96%, 27%, 1.0); --success-dark-10: hsla(143, 93%, 22%, 1.0); --success-dark-20: hsla(145, 82%, 18%, 1.0); --success-dark-30: hsla(145, 86%, 14%, 1.0); --success-dark-40: hsla(145, 85%, 10%, 1.0); --success-dark-50: hsla(144, 90%, 8%, 1.0); --warning-3: hsla(42, 100%, 50%, 0.03); --warning-5: hsla(42, 100%, 50%, 0.05); --warning-10: hsla(42, 100%, 50%, 0.10); --warning-20: hsla(42, 100%, 50%, 0.20); --warning-30: hsla(42, 100%, 50%, 0.30); --warning-40: hsla(42, 100%, 50%, 0.40); --warning-50: hsla(42, 100%, 50%, 0.50); --warning-60: hsla(42, 100%, 50%, 0.60); --warning-70: hsla(42, 100%, 50%, 0.70); --warning-80: hsla(42, 100%, 50%, 0.80); --warning-90: hsla(42, 100%, 50%, 0.90); --warning: hsla(42, 100%, 50%, 1.0); --warning-dark-10: hsla(37, 96%, 43%, 1.0); --warning-dark-20: hsla(33, 69%, 38%, 1.0); --warning-dark-30: hsla(33, 71%, 30%, 1.0); --warning-dark-40: hsla(33, 73%, 22%, 1.0); --warning-dark-50: hsla(34, 79%, 17%, 1.0); --danger-3: hsla(355, 85%, 46%, 0.03); --danger-5: hsla(355, 85%, 46%, 0.05); --danger-10: hsla(355, 85%, 46%, 0.10); --danger-20: hsla(355, 85%, 46%, 0.20); --danger-30: hsla(355, 85%, 46%, 0.30); --danger-40: hsla(355, 85%, 46%, 0.40); --danger-50: hsla(355, 85%, 46%, 0.50); --danger-60: hsla(355, 85%, 46%, 0.60); --danger-70: hsla(355, 85%, 46%, 0.70); --danger-80: hsla(355, 85%, 46%, 0.80); --danger-90: hsla(355, 85%, 46%, 0.90); --danger: hsla(355, 85%, 46%, 1.0); --danger-dark-10: hsla(355, 93%, 37%, 1.0); --danger-dark-20: hsla(357, 81%, 29%, 1.0); --danger-dark-30: hsla(356, 83%, 23%, 1.0); --danger-dark-40: hsla(356, 86%, 17%, 1.0); --danger-dark-50: hsla(356, 88%, 13%, 1.0); --default-3: hsla(0, 0%, 99%, 0.03); --default-5: hsla(0, 0%, 99%, 0.05); --default-10: hsla(0, 0%, 99%, 0.10); --default-20: hsla(0, 0%, 99%, 0.20); --default-30: hsla(0, 0%, 99%, 0.30); --default-40: hsla(0, 0%, 99%, 0.40); --default-50: hsla(0, 0%, 99%, 0.50); --default-60: hsla(0, 0%, 99%, 0.60); --default-70: hsla(0, 0%, 99%, 0.70); --default-80: hsla(0, 0%, 99%, 0.80); --default-90: hsla(0, 0%, 99%, 0.90); --default: hsla(0, 0%, 99%, 1.0); --default-dark-10: hsla(0, 0%, 97%, 1.0); --default-dark-20: hsla(0, 0%, 95%, 1.0); --default-dark-30: hsla(0, 0%, 93%, 1.0); --default-dark-40: hsla(0, 0%, 91%, 1.0); --default-dark-50: hsla(0, 0%, 89%, 1.0); --neutral-0: hsla(0, 0%, 100%, 1.0); --neutral-3: hsla(0, 0%, 97%, 1.0); --neutral-5: hsla(0, 0%, 95%, 1.0); --neutral-10: hsla(180, 3%, 93%, 1.0); --neutral-20: hsla(240, 1%, 86%, 1.0); --neutral-30: hsla(220, 1%, 76%, 1.0); --neutral-40: hsla(210, 2%, 64%, 1.0); --neutral-50: hsla(210, 2%, 58%, 1.0); --neutral-60: hsla(216, 2%, 46%, 1.0); --neutral-70: hsla(215, 3%, 36%, 1.0); --neutral-80: hsla(214, 5%, 28%, 1.0); --neutral-90: hsla(218, 11%, 16%, 1.0); --neutral: hsla(220, 17%, 10%, 1.0); --neutral-dark-10: hsla(0, 0%, 5%, 1.0); --neutral-dark-20: hsla(0, 0%, 0%, 1.0); --neutral-dark-30: hsla(0, 0%, 0%, 1.0); --neutral-dark-40: hsla(0, 0%, 0%, 1.0); --neutral-dark-50: hsla(0, 0%, 0%, 1.0); --dark-3: hsla(0, 0%, 0%, 0.03); --dark-5: hsla(0, 0%, 0%, 0.05); --dark-10: hsla(0, 0%, 0%, 0.10); --dark-20: hsla(0, 0%, 0%, 0.20); --dark-30: hsla(0, 0%, 0%, 0.30); --dark-40: hsla(0, 0%, 0%, 0.40); --dark-50: hsla(0, 0%, 0%, 0.50); --dark-60: hsla(0, 0%, 0%, 0.60); --dark-70: hsla(0, 0%, 0%, 0.70); --dark-80: hsla(0, 0%, 0%, 0.80); --dark-90: hsla(0, 0%, 0%, 0.90); --dark: hsla(0, 0%, 0%, 1.0); --light-3: hsla(0, 0%, 100%, 0.03); --light-5: hsla(0, 0%, 100%, 0.05); --light-10: hsla(0, 0%, 100%, 0.10); --light-20: hsla(0, 0%, 100%, 0.20); --light-30: hsla(0, 0%, 100%, 0.30); --light-40: hsla(0, 0%, 100%, 0.40); --light-50: hsla(0, 0%, 100%, 0.50); --light-60: hsla(0, 0%, 100%, 0.60); --light-70: hsla(0, 0%, 100%, 0.70); --light-80: hsla(0, 0%, 100%, 0.80); --light-90: hsla(0, 0%, 100%, 0.90); --light: hsla(0, 0%, 100%, 1.0); /* COMMON */ --bg-body: hsla(0, 0%, 100%, 1.0); --bg-body-dark: hsla(0, 0%, 0%, 1.0); --bg-body-light: hsla(0, 0%, 100%, 1.0); --shadow-color: hsla(0, 0%, 0%, 0.20); --box-shadow: 0px 1px 2px hsla(0, 0%, 0%, 0.20); --overlay-color: hsla(0, 0%, 0%, 0.50); /* BORDERS */ --border-color: hsla(0, 0%, 90%, 1.0); --border-radius: 5px; --border-radius-xl: 10px; /* BRAND LOGO */ --brand-logo-width: 206px; --brand-logo-height: 32px; --brand-logo-image: url('../../images/common/logos/handysolutions/handysolutions.svg'); --brand-logo-image-inverse: url('../../images/common/logos/handysolutions/handysolutions-inverse.svg'); --brand-logo-mobile-width: 40px; --brand-logo-mobile-height: 40px; --brand-logo-mobile-image: url('../../images/common/logos/handysolutions/handysolutions-symbol.svg'); --brand-logo-mobile-image-inverse: url('../../images/common/logos/handysolutions/handysolutions-symbol.svg'); /* FONTS */ --fs-1: 2.5rem; --fs-2: 2.25rem; --fs-3: 2.0rem; --fs-4: 1.75rem; --fs-5: 1.5rem; --fs-6: 1.25rem; --fs-7: 1.0rem; --fs-8: 0.875rem; --fs-9: 0.75rem; --fw-100: 100; --fw-200: 200; --fw-300: 300; --fw-400: 400; --fw-500: 500; --fw-600: 600; --fw-700: 700; --fw-800: 800; --fw-900: 900; --lh-1: 2.75rem; --lh-2: 2.625rem; --lh-3: 2.5rem; --lh-4: 2.25rem; --lh-5: 2.25rem; --lh-6: 1.75rem; --lh-7: 1.375rem; --lh-8: 1.125rem; --lh-9: 1.0rem; --font-family: "Proxima Nova", Arial, Verdana, sans-serif; --font-color: hsla(0, 0%, 27%, 1.0); --font-color-dark: hsla(0, 0%, 0%, 1.0); --font-color-light: hsla(0, 0%, 40%, 1.0); --h1-font-style: normal; --h1-font-weight: 600; --h1-font-size: 2.5rem; --h1-font-size-mobile: 2.25rem; --h1-line-height: 2.75rem; --h1-line-height-mobile: 2.625rem; --h1-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h1-color: hsla(0, 0%, 0%, 1.0); --h2-font-style: normal; --h2-font-weight: 600; --h2-font-size: 2.25rem; --h2-font-size-mobile: 2.0rem; --h2-line-height: 2.625rem; --h2-line-height-mobile: 2.5rem; --h2-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h2-color: hsla(0, 0%, 0%, 1.0); --h3-font-style: normal; --h3-font-weight: 600; --h3-font-size: 2.0rem; --h3-font-size-mobile: 1.75rem; --h3-line-height: 2.5rem; --h3-line-height-mobile: 2.25rem; --h3-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h3-color: hsla(0, 0%, 0%, 1.0); --h4-font-style: normal; --h4-font-weight: 600; --h4-font-size: 1.75rem; --h4-font-size-mobile: 1.5rem; --h4-line-height: 2.25rem; --h4-line-height-mobile: 2.0rem; --h4-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h4-color: hsla(0, 0%, 0%, 1.0); --h5-font-style: normal; --h5-font-weight: 600; --h5-font-size: 1.5rem; --h5-font-size-mobile: 1.25rem; --h5-line-height: 2.0rem; --h5-line-height-mobile: 1.75rem; --h5-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h5-color: hsla(0, 0%, 0%, 1.0); --h6-font-style: normal; --h6-font-weight: 600; --h6-font-size: 1.25rem; --h6-font-size-mobile: 1.0rem; --h6-line-height: 1.75rem; --h6-line-height-mobile: 1.375rem; --h6-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --h6-color: hsla(0, 0%, 0%, 1.0); --p-font-style: normal; --p-font-weight: 400; --p-font-size: 1.0rem; --p-line-height: 1.5rem; --p-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --p-color: hsla(0, 0%, 27%, 1.0); --li-font-style: normal; --li-font-weight: 400; --li-font-size: 1.0rem; --li-line-height: 1.375rem; --li-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --li-color: hsla(0, 0%, 27%, 1.0); /* TABLES */ --th-pt: 5px; --th-pe: 8px; --th-pb: 5px; --th-ps: 8px; --th-font-style: normal; --th-font-weight: 400; --th-font-size: 0.8125rem; --th-line-height: 1.125rem; --th-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --th-color: hsla(208, 7%, 46%, 1.0); --th-bg-color: hsla(0, 0%, 100%, 1.0); --td-pt: 5px; --td-pe: 8px; --td-pb: 5px; --td-ps: 8px; --td-font-style: normal; --td-font-weight: 400; --td-font-size: 0.875rem; --td-line-height: 1.125rem; --td-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --td-color: hsla(0, 0%, 27%, 1.0); --td-bg-color: hsla(0, 0%, 100%, 1.0); /* FORMS */ --link-color: hsla(198, 88%, 34%, 1.0); --link-color-hover: hsla(198, 88%, 29%, 1.0); --link-color-active: hsla(198, 88%, 29%, 1.0); --label-font-style: normal; --label-font-weight: 600; --label-font-size: 1.0rem; --label-line-height: 1.375rem; --label-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --label-color: hsla(0, 0%, 0%, 1.0); --input-pt: 6px; --input-pe: 12px; --input-pb: 6px; --input-ps: 12px; --input-font-style: normal; --input-font-weight: 400; --input-font-size: 1.0rem; --input-line-height: 1.375rem; --input-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --input-color: hsla(0, 0%, 27%, 1.0); --input-color-focus: hsla(0, 0%, 0%, 1.0); --input-bg-color: hsla(0, 0%, 100%, 1.0); --input-bg-color-focus: hsla(0, 0%, 100%, 1.0); --input-border-color: hsla(0, 0%, 0%, 0.12); --input-border-color-focus: hsla(198, 88%, 34%, 1.0); /* BUTTONS */ --btn-icon-color: hsla(198, 88%, 34%, 1.0); --btn-icon-color-hover: hsla(198, 88%, 29%, 1.0); --btn-icon-color-active: hsla(198, 88%, 29%, 1.0); --btn-xl-pt: 16px; --btn-xl-pe: 15px; --btn-xl-pb: 16px; --btn-xl-ps: 15px; --btn-xl-font-style: normal; --btn-xl-font-weight: 600; --btn-xl-font-size: 1.0rem; --btn-xl-line-height: 1.375rem; --btn-xl-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-lg-pt: 12px; --btn-lg-pe: 15px; --btn-lg-pb: 12px; --btn-lg-ps: 15px; --btn-lg-font-style: normal; --btn-lg-font-weight: 600; --btn-lg-font-size: 1.0rem; --btn-lg-line-height: 1.375rem; --btn-lg-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-pt: 10px; --btn-pe: 15px; --btn-pb: 10px; --btn-ps: 15px; --btn-font-style: normal; --btn-font-weight: 600; --btn-font-size: 1.0rem; --btn-line-height: 1.375rem; --btn-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-sm-pt: 8px; --btn-sm-pe: 10px; --btn-sm-pb: 8px; --btn-sm-ps: 10px; --btn-sm-font-style: normal; --btn-sm-font-weight: 600; --btn-sm-font-size: 0.875rem; --btn-sm-line-height: 1.0rem; --btn-sm-font-family: "Proxima Nova", Arial, Verdana, sans-serif; --btn-xs-pt: 5px; --btn-xs-pe: 10px; --btn-xs-pb: 5px; --btn-xs-ps: 10px; --btn-xs-font-style: normal; --btn-xs-font-weight: 600; --btn-xs-font-size: 0.75rem; --btn-xs-line-height: 1.0rem; --btn-xs-font-family: "Proxima Nova", Arial, Verdana, sans-serif; /* BTN-DEFAULT */ --btn-default-border-size: 1px; --btn-default-color: hsla(0, 0%, 40%, 1.0); --btn-default-color-hover: hsla(0, 0%, 0%, 1.0); --btn-default-color-active: hsla(0, 0%, 0%, 1.0); --btn-default-color-focus: hsla(0, 0%, 0%, 1.0); --btn-default-bg-color: hsla(0, 0%, 99%, 1.0); --btn-default-bg-color-hover: hsla(0, 0%, 99%, 1.0); --btn-default-bg-color-active: hsla(0, 0%, 99%, 1.0); --btn-default-bg-color-focus: hsla(0, 0%, 99%, 1.0); --btn-default-border-color: hsla(0, 0%, 0%, 0.12); --btn-default-border-color-hover: hsla(208, 7%, 46%, 1.0); --btn-default-border-color-active: hsla(208, 7%, 46%, 1.0); --btn-default-border-color-focus: hsla(208, 7%, 46%, 1.0); /* BTN-PRIMARY */ --btn-primary-border-size: 1px; --btn-primary-color: hsla(0, 0%, 100%, 1.0); --btn-primary-color-hover: hsla(0, 0%, 100%, 1.0); --btn-primary-color-active: hsla(0, 0%, 100%, 1.0); --btn-primary-color-focus: hsla(0, 0%, 100%, 1.0); --btn-primary-bg-color: hsla(163, 72%, 47%, 1.0); --btn-primary-bg-color-hover: hsla(174, 42%, 37%, 1.0); --btn-primary-bg-color-active: hsla(174, 42%, 37%, 1.0); --btn-primary-bg-color-focus: hsla(174, 42%, 37%, 1.0); --btn-primary-border-color: hsla(163, 72%, 47%, 1.0); --btn-primary-border-color-hover: hsla(174, 42%, 37%, 1.0); --btn-primary-border-color-active: hsla(174, 42%, 37%, 1.0); --btn-primary-border-color-focus: hsla(174, 42%, 37%, 1.0); /* BTN-SECONDARY */ --btn-secondary-border-size: 1px; --btn-secondary-color: hsla(163, 72%, 47%, 1.0); --btn-secondary-color-hover: hsla(174, 42%, 37%, 1.0); --btn-secondary-color-active: hsla(174, 42%, 37%, 1.0); --btn-secondary-color-focus: hsla(174, 42%, 37%, 1.0); --btn-secondary-bg-color: hsla(0, 0%, 100%, 0); --btn-secondary-bg-color-hover: hsla(0, 0%, 100%, 0); --btn-secondary-bg-color-active: hsla(0, 0%, 100%, 0); --btn-secondary-bg-color-focus: hsla(0, 0%, 100%, 0); --btn-secondary-border-color: hsla(163, 72%, 47%, 1.0); --btn-secondary-border-color-hover: hsla(174, 42%, 37%, 1.0); --btn-secondary-border-color-active: hsla(174, 42%, 37%, 1.0); --btn-secondary-border-color-focus: hsla(174, 42%, 37%, 1.0); /* BTN-TERTIARY */ --btn-tertiary-border-size: 1px; --btn-tertiary-color: hsla(0, 0%, 100%, 1.0); --btn-tertiary-color-hover: hsla(0, 0%, 100%, 1.0); --btn-tertiary-color-active: hsla(0, 0%, 100%, 1.0); --btn-tertiary-color-focus: hsla(0, 0%, 100%, 1.0); --btn-tertiary-bg-color: hsla(0, 0%, 20%, 1.0); --btn-tertiary-bg-color-hover: hsla(0, 0%, 0%, 1.0); --btn-tertiary-bg-color-active: hsla(0, 0%, 0%, 1.0); --btn-tertiary-bg-color-focus: hsla(0, 0%, 0%, 1.0); --btn-tertiary-border-color: hsla(0, 0%, 20%, 1.0); --btn-tertiary-border-color-hover: hsla(0, 0%, 0%, 1.0); --btn-tertiary-border-color-active: hsla(0, 0%, 0%, 1.0); --btn-tertiary-border-color-focus: hsla(0, 0%, 0%, 1.0); /* ALERTS */ --alert-pt: 12px; --alert-pe: 20px; --alert-pb: 12px; --alert-ps: 20px; --alert-primary-color: hsla(0, 0%, 27%, 1.0); --alert-primary-bg-color: hsla(163, 72%, 47%, 0.20); --alert-primary-border-color: hsla(163, 72%, 47%, 0.20); --alert-primary-border-size: 1px; --alert-secondary-color: hsla(0, 0%, 27%, 1.0); --alert-secondary-bg-color: hsla(208, 7%, 46%, 0.05); --alert-secondary-border-color: hsla(208, 7%, 46%, 0.20); --alert-secondary-border-size: 1px; --alert-info-color: hsla(0, 0%, 27%, 1.0); --alert-info-bg-color: hsla(204, 73%, 64%, 0.20); --alert-info-border-color: hsla(204, 73%, 64%, 0.20); --alert-info-border-size: 1px; --alert-success-color: hsla(0, 0%, 27%, 1.0); --alert-success-bg-color: hsla(148, 100%, 30%, 0.20); --alert-success-border-color: hsla(148, 100%, 30%, 0.20); --alert-success-border-size: 1px; --alert-warning-color: hsla(0, 0%, 27%, 1.0); --alert-warning-bg-color: hsla(42, 100%, 48%, 0.20); --alert-warning-border-color: hsla(42, 100%, 48%, 0.20); --alert-warning-border-size: 1px; --alert-danger-color: hsla(355, 80%, 52%, 1.0); --alert-danger-bg-color: hsla(355, 80%, 52%, 0.20); --alert-danger-border-color: hsla(355, 80%, 52%, 0.20); --alert-danger-border-size: 1px; /* ACCOUNT MANAGEMENT */ --am-nav-top-bg-color: hsla(0, 0%, 0%, 1.0); --am-nav-top-font-color: hsla(0, 0%, 100%, 0.80); --am-nav-top-font-color-hover: hsla(0, 0%, 100%, 1.0); --am-nav-top-font-color-active: hsla(0, 0%, 100%, 1.0); --am-nav-top-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-top-link-bg-color-hover: hsla(0, 0%, 100%, 0); --am-nav-top-link-bg-color-active: hsla(0, 0%, 100%, 0); --am-nav-top-dropdown-bg-color: hsla(0, 0%, 100%, 1.0); --am-nav-top-dropdown-font-color: hsla(0, 0%, 27%, 1.0); --am-nav-top-dropdown-font-color-hover: hsla(0, 0%, 0%, 1.0); --am-nav-top-dropdown-font-color-active: hsla(0, 0%, 0%, 1.0); --am-nav-top-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-top-dropdown-link-bg-color-hover: hsla(215, 89%, 40%, 0.05); --am-nav-top-dropdown-link-bg-color-active: hsla(215, 89%, 40%, 0.05); --am-nav-bottom-bg-color: hsla(0, 0%, 100%, 1.0); --am-nav-bottom-font-color: hsla(0, 0%, 27%, 1.0); --am-nav-bottom-font-color-hover: hsla(0, 0%, 0%, 1.0); --am-nav-bottom-font-color-active: hsla(0, 0%, 0%, 1.0); --am-nav-bottom-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-bottom-link-bg-color-hover: hsla(0, 0%, 100%, 0); --am-nav-bottom-link-bg-color-active: hsla(0, 0%, 100%, 0); --am-nav-bottom-dropdown-bg-color: hsla(0, 0%, 100%, 1.0); --am-nav-bottom-dropdown-font-color: hsla(0, 0%, 27%, 1.0); --am-nav-bottom-dropdown-font-color-hover: hsla(0, 0%, 0%, 1.0); --am-nav-bottom-dropdown-font-color-active: hsla(0, 0%, 0%, 1.0); --am-nav-bottom-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-bottom-dropdown-link-bg-color-hover: hsla(215, 89%, 40%, 0.05); --am-nav-bottom-dropdown-link-bg-color-active: hsla(215, 89%, 40%, 0.05); --am-footer-bg-color: hsla(0, 0%, 97%, 1.0); --am-footer-font-color: hsla(0, 0%, 27%, 1.0); --am-footer-font-color-dark: hsla(0, 0%, 0%, 1.0); --am-footer-font-color-light: hsla(0, 0%, 40%, 1.0); --am-footer-link-color: hsla(0, 0%, 27%, 1.0); --am-footer-link-color-hover: hsla(215, 89%, 40%, 1.0); --am-footer-link-color-active: hsla(215, 89%, 40%, 1.0); --am-login-bg-color: hsla(208, 7%, 46%, 0.10); --am-panel-bg-color: hsla(0, 0%, 100%, 1.0); --am-panel-heading-bg-color: hsla(0, 0%, 100%, 1.0); --am-panel-body-bg-color: hsla(0, 0%, 100%, 1.0); /* REGISTRATION */ --reg-brand-logo-image: var(--brand-logo-image); --reg-brand-logo-mobile-image: var(--brand-logo-mobile-image); --reg-nav-top-bg-color: hsla(0, 0%, 100%, 1.0); --reg-nav-top-font-color: hsla(0, 0%, 27%, 1.0); --reg-nav-top-font-color-hover: hsla(0, 0%, 0%, 1.0); --reg-nav-top-dropdown-font-color: hsla(0, 0%, 27%, 1.0); --reg-nav-top-dropdown-font-color-hover: hsla(0, 0%, 0%, 1.0); --reg-app-progress-bg-color: hsla(163, 72%, 47%, 1.0); --reg-app-progress-font-color: hsla(0, 0%, 100%, 0.80); --reg-app-progress-font-color-active: hsla(0, 0%, 100%, 1.0); --reg-footer-bg-color: hsla(0, 0%, 97%, 1.0); --reg-footer-font-color: hsla(0, 0%, 27%, 1.0); --reg-start-left-bg-color: hsla(163, 72%, 47%, 1.0); --reg-start-left-font-color: hsla(0, 0%, 100%, 1.0); --reg-start-right-bg-color: hsla(0, 0%, 100%, 1.0); --reg-start-right-font-color: hsla(0, 0%, 27%, 1.0); /* WEBSITE */ --nav-top-bg-color: hsla(0, 0%, 0%, 1.0); --nav-top-link-color: hsla(0, 0%, 100%, 0.80); --nav-top-link-color-hover: hsla(0, 0%, 100%, 1.0); --nav-top-link-color-active: hsla(0, 0%, 100%, 1.0); --nav-top-link-bg-color: hsla(0, 0%, 100%, 0); --nav-top-link-bg-color-hover: hsla(0, 0%, 100%, 0); --nav-top-link-bg-color-active: hsla(0, 0%, 100%, 0); --nav-top-dropdown-bg-color: hsla(0, 0%, 100%, 1.0); --nav-top-dropdown-font-color-dark: hsla(0, 0%, 0%, 1.0); --nav-top-dropdown-font-color: hsla(0, 0%, 0%, 0.80); --nav-top-dropdown-font-color-light: hsla(0, 0%, 0%, 0.60); --nav-top-dropdown-link-color: hsla(0, 0%, 0%, 0.80); --nav-top-dropdown-link-color-hover: hsla(163, 72%, 47%, 1.0); --nav-top-dropdown-link-color-active: hsla(163, 72%, 47%, 1.0); --nav-top-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --nav-top-dropdown-link-bg-color-hover: hsla(208, 7%, 46%, 0.05); --nav-top-dropdown-link-bg-color-active: hsla(208, 7%, 46%, 0.05); --nav-bottom-bg-color: hsla(0, 0%, 100%, 1.0); --nav-bottom-link-color: hsla(0, 0%, 0%, 0.80); --nav-bottom-link-color-hover: hsla(163, 72%, 47%, 1.0); --nav-bottom-link-color-active: hsla(163, 72%, 47%, 1.0); --nav-bottom-link-bg-color: hsla(0, 0%, 100%, 0); --nav-bottom-link-bg-color-hover: hsla(0, 0%, 100%, 0); --nav-bottom-link-bg-color-active: hsla(0, 0%, 100%, 0); --nav-bottom-dropdown-bg-color: hsla(0, 0%, 100%, 1.0); --nav-bottom-dropdown-font-color-dark: hsla(0, 0%, 0%, 1.0); --nav-bottom-dropdown-font-color: hsla(0, 0%, 0%, 0.80); --nav-bottom-dropdown-font-color-light: hsla(0, 0%, 0%, 0.60); --nav-bottom-dropdown-link-color: hsla(0, 0%, 0%, 0.80); --nav-bottom-dropdown-link-color-hover: hsla(163, 72%, 47%, 1.0); --nav-bottom-dropdown-link-color-active: hsla(163, 72%, 47%, 1.0); --nav-bottom-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --nav-bottom-dropdown-link-bg-color-hover: hsla(208, 7%, 46%, 0.05); --nav-bottom-dropdown-link-bg-color-active: hsla(208, 7%, 46%, 0.05); --footer-bg-color: hsla(0, 0%, 97%, 1.0); --footer-font-color-dark: hsla(0, 0%, 0%, 1.0); --footer-font-color: hsla(0, 0%, 0%, 0.80); --footer-font-color-light: hsla(0, 0%, 0%, 0.60); --footer-link-color: hsla(0, 0%, 0%, 0.80); --footer-link-color-hover: hsla(163, 72%, 47%, 1.0); --footer-link-color-active: hsla(163, 72%, 47%, 1.0); } /* THEME | DARK ---------------------------------------------------------------------------------------------------- */ [data-theme=dark] { /* COLORS */ --primary-3: hsla(163, 72%, 47%, 0.03); --primary-5: hsla(163, 72%, 47%, 0.05); --primary-10: hsla(163, 72%, 47%, 0.10); --primary-20: hsla(163, 72%, 47%, 0.20); --primary-30: hsla(163, 72%, 47%, 0.30); --primary-40: hsla(163, 72%, 47%, 0.40); --primary-50: hsla(163, 72%, 47%, 0.50); --primary-60: hsla(163, 72%, 47%, 0.60); --primary-70: hsla(163, 72%, 47%, 0.70); --primary-80: hsla(163, 72%, 47%, 0.80); --primary-90: hsla(163, 72%, 47%, 0.90); --primary: hsla(163, 72%, 47%, 1.0); --primary-dark-10: hsla(174, 42%, 52%, 1.0); --primary-dark-20: hsla(174, 42%, 57%, 1.0); --primary-dark-30: hsla(174, 42%, 62%, 1.0); --primary-dark-40: hsla(174, 42%, 67%, 1.0); --primary-dark-50: hsla(174, 42%, 72%, 1.0); --secondary-3: hsla(0, 0%, 75%, 0.03); --secondary-5: hsla(0, 0%, 75%, 0.05); --secondary-10: hsla(0, 0%, 75%, 0.10); --secondary-20: hsla(0, 0%, 75%, 0.20); --secondary-30: hsla(0, 0%, 75%, 0.30); --secondary-40: hsla(0, 0%, 75%, 0.40); --secondary-50: hsla(0, 0%, 75%, 0.50); --secondary-60: hsla(0, 0%, 75%, 0.60); --secondary-70: hsla(0, 0%, 75%, 0.70); --secondary-80: hsla(0, 0%, 75%, 0.80); --secondary-90: hsla(0, 0%, 75%, 0.90); --secondary: hsla(0, 0%, 75%, 1.0); --secondary-dark-10: hsla(0, 0%, 77%, 1.0); --secondary-dark-20: hsla(0, 0%, 79%, 1.0); --secondary-dark-30: hsla(0, 0%, 81%, 1.0); --secondary-dark-40: hsla(0, 0%, 83%, 1.0); --secondary-dark-50: hsla(0, 0%, 85%, 1.0); --tertiary-3: hsla(240, 10%, 23%, 0.03); --tertiary-5: hsla(240, 10%, 23%, 0.05); --tertiary-10: hsla(240, 10%, 23%, 0.10); --tertiary-20: hsla(240, 10%, 23%, 0.20); --tertiary-30: hsla(240, 10%, 23%, 0.30); --tertiary-40: hsla(240, 10%, 23%, 0.40); --tertiary-50: hsla(240, 10%, 23%, 0.50); --tertiary-60: hsla(240, 10%, 23%, 0.60); --tertiary-70: hsla(240, 10%, 23%, 0.70); --tertiary-80: hsla(240, 10%, 23%, 0.80); --tertiary-90: hsla(240, 10%, 23%, 0.90); --tertiary: hsla(240, 10%, 23%, 1.0); --tertiary-dark-10: hsla(240, 10%, 21%, 1.0); --tertiary-dark-20: hsla(240, 10%, 19%, 1.0); --tertiary-dark-30: hsla(240, 10%, 17%, 1.0); --tertiary-dark-40: hsla(240, 10%, 15%, 1.0); --tertiary-dark-50: hsla(240, 10%, 13%, 1.0); --info-3: hsla(216, 88%, 57%, 0.03); --info-5: hsla(216, 88%, 57%, 0.05); --info-10: hsla(216, 88%, 57%, 0.10); --info-20: hsla(216, 88%, 57%, 0.20); --info-30: hsla(216, 88%, 57%, 0.30); --info-40: hsla(216, 88%, 57%, 0.40); --info-50: hsla(216, 88%, 57%, 0.50); --info-60: hsla(216, 88%, 57%, 0.60); --info-70: hsla(216, 88%, 57%, 0.70); --info-80: hsla(216, 88%, 57%, 0.80); --info-90: hsla(216, 88%, 57%, 0.90); --info: hsla(216, 88%, 57%, 1.0); --info-dark-10: hsla(216, 89%, 65%, 1.0); --info-dark-20: hsla(216, 88%, 77%, 1.0); --info-dark-30: hsla(215, 83%, 84%, 1.0); --info-dark-40: hsla(216, 89%, 89%, 1.0); --info-dark-50: hsla(214, 89%, 96%, 1.0); --success-3: hsla(148, 85%, 38%, 0.03); --success-5: hsla(148, 85%, 38%, 0.05); --success-10: hsla(148, 85%, 38%, 0.10); --success-20: hsla(148, 85%, 38%, 0.20); --success-30: hsla(148, 85%, 38%, 0.30); --success-40: hsla(148, 85%, 38%, 0.40); --success-50: hsla(148, 85%, 38%, 0.50); --success-60: hsla(148, 85%, 38%, 0.60); --success-70: hsla(148, 85%, 38%, 0.70); --success-80: hsla(148, 85%, 38%, 0.80); --success-90: hsla(148, 85%, 38%, 0.90); --success: hsla(148, 85%, 38%, 1.0); --success-dark-10: hsla(148, 75%, 52%, 1.0); --success-dark-20: hsla(148, 75%, 67%, 1.0); --success-dark-30: hsla(148, 75%, 78%, 1.0); --success-dark-40: hsla(148, 74%, 85%, 1.0); --success-dark-50: hsla(148, 76%, 95%, 1.0); --warning-3: hsla(42, 100%, 50%, 0.03); --warning-5: hsla(42, 100%, 50%, 0.05); --warning-10: hsla(42, 100%, 50%, 0.10); --warning-20: hsla(42, 100%, 50%, 0.20); --warning-30: hsla(42, 100%, 50%, 0.30); --warning-40: hsla(42, 100%, 50%, 0.40); --warning-50: hsla(42, 100%, 50%, 0.50); --warning-60: hsla(42, 100%, 50%, 0.60); --warning-70: hsla(42, 100%, 50%, 0.70); --warning-80: hsla(42, 100%, 50%, 0.80); --warning-90: hsla(42, 100%, 50%, 0.90); --warning: hsla(42, 100%, 50%, 1.0); --warning-dark-10: hsla(42, 100%, 70%, 1.0); --warning-dark-20: hsla(42, 100%, 80%, 1.0); --warning-dark-30: hsla(42, 100%, 86%, 1.0); --warning-dark-40: hsla(42, 100%, 91%, 1.0); --warning-dark-50: hsla(40, 100%, 97%, 1.0); --danger-3: hsla(355, 100%, 60%, 0.03); --danger-5: hsla(355, 100%, 60%, 0.05); --danger-10: hsla(355, 100%, 60%, 0.10); --danger-20: hsla(355, 100%, 60%, 0.20); --danger-30: hsla(355, 100%, 60%, 0.30); --danger-40: hsla(355, 100%, 60%, 0.40); --danger-50: hsla(355, 100%, 60%, 0.50); --danger-60: hsla(355, 100%, 60%, 0.60); --danger-70: hsla(355, 100%, 60%, 0.70); --danger-80: hsla(355, 100%, 60%, 0.80); --danger-90: hsla(355, 100%, 60%, 0.90); --danger: hsla(355, 100%, 60%, 1.0); --danger-dark-10: hsla(355, 100%, 67%, 1.0); --danger-dark-20: hsla(355, 100%, 78%, 1.0); --danger-dark-30: hsla(355, 100%, 85%, 1.0); --danger-dark-40: hsla(355, 100%, 90%, 1.0); --danger-dark-50: hsla(353, 100%, 97%, 1.0); --default-3: hsla(0, 0%, 1%, 0.03); --default-5: hsla(0, 0%, 1%, 0.05); --default-10: hsla(0, 0%, 1%, 0.10); --default-20: hsla(0, 0%, 1%, 0.20); --default-30: hsla(0, 0%, 1%, 0.30); --default-40: hsla(0, 0%, 1%, 0.40); --default-50: hsla(0, 0%, 1%, 0.50); --default-60: hsla(0, 0%, 1%, 0.60); --default-70: hsla(0, 0%, 1%, 0.70); --default-80: hsla(0, 0%, 1%, 0.80); --default-90: hsla(0, 0%, 1%, 0.90); --default: hsla(0, 0%, 1%, 1.0); --default-dark-10: hsla(0, 0%, 3%, 1.0); --default-dark-20: hsla(0, 0%, 5%, 1.0); --default-dark-30: hsla(0, 0%, 7%, 1.0); --default-dark-40: hsla(0, 0%, 9%, 1.0); --default-dark-50: hsla(0, 0%, 11%, 1.0); --neutral-0: hsla(220, 17%, 10%, 1.0); --neutral-3: hsla(220, 13%, 13%, 1.0); --neutral-5: hsla(217, 11%, 15%, 1.0); --neutral-10: hsla(225, 8%, 20%, 1.0); --neutral-20: hsla(223, 5%, 28%, 1.0); --neutral-30: hsla(220, 5%, 36%, 1.0); --neutral-40: hsla(220, 3%, 46%, 1.0); --neutral-50: hsla(220, 2%, 56%, 1.0); --neutral-60: hsla(220, 2%, 64%, 1.0); --neutral-70: hsla(215, 2%, 74%, 1.0); --neutral-80: hsla(210, 2%, 82%, 1.0); --neutral-90: hsla(210, 0%, 94%, 1.0); --neutral: hsla(0, 0%, 100%, 1.0); --neutral-dark-10: hsla(0, 0%, 100%, 1.0); --neutral-dark-20: hsla(0, 0%, 100%, 1.0); --neutral-dark-30: hsla(0, 0%, 100%, 1.0); --neutral-dark-40: hsla(0, 0%, 100%, 1.0); --neutral-dark-50: hsla(0, 0%, 100%, 1.0); --dark-3: hsla(0, 0%, 100%, 0.03); --dark-5: hsla(0, 0%, 100%, 0.05); --dark-10: hsla(0, 0%, 100%, 0.10); --dark-20: hsla(0, 0%, 100%, 0.20); --dark-30: hsla(0, 0%, 100%, 0.30); --dark-40: hsla(0, 0%, 100%, 0.40); --dark-50: hsla(0, 0%, 100%, 0.50); --dark-60: hsla(0, 0%, 100%, 0.60); --dark-70: hsla(0, 0%, 100%, 0.70); --dark-80: hsla(0, 0%, 100%, 0.80); --dark-90: hsla(0, 0%, 100%, 0.90); --dark: hsla(0, 0%, 100%, 1.0); --light-3: hsla(0, 0%, 0%, 0.03); --light-5: hsla(0, 0%, 0%, 0.05); --light-10: hsla(0, 0%, 0%, 0.10); --light-20: hsla(0, 0%, 0%, 0.20); --light-30: hsla(0, 0%, 0%, 0.30); --light-40: hsla(0, 0%, 0%, 0.40); --light-50: hsla(0, 0%, 0%, 0.50); --light-60: hsla(0, 0%, 0%, 0.60); --light-70: hsla(0, 0%, 0%, 0.70); --light-80: hsla(0, 0%, 0%, 0.80); --light-90: hsla(0, 0%, 0%, 0.90); --light: hsla(0, 0%, 0%, 1.0); /* COMMON */ --bg-body: hsla(240, 17%, 10%, 1.0); --bg-body-dark: hsla(240, 17%, 10%, 1.0); --bg-body-light: hsla(221, 22%, 17%, 1.0); --shadow-color: hsla(0, 0%, 0%, 0.90); --box-shadow: 0px 1px 2px hsla(0, 0%, 0%, 0.90); --overlay-color: hsla(0, 0%, 0%, 0.90); /* BORDERS */ --border-color: hsla(240, 7%, 30%, 1.0); /* BRAND LOGO */ --brand-logo-image: url('../../images/common/logos/handysolutions/handysolutions-inverse.svg'); --brand-logo-image-inverse: url('../../images/common/logos/handysolutions/handysolutions.svg'); --brand-logo-mobile-image: url('../../images/common/logos/handysolutions/handysolutions-symbol.svg'); --brand-logo-mobile-image-inverse: url('../../images/common/logos/handysolutions/handysolutions-symbol.svg'); /* FONTS */ --font-color: hsla(0, 0%, 84%, 1.0); --font-color-dark: hsla(0, 0%, 100%, 1.0); --font-color-light: hsla(0, 0%, 72%, 1.0); --h1-color: hsla(0, 0%, 100%, 1.0); --h2-color: hsla(0, 0%, 100%, 1.0); --h3-color: hsla(0, 0%, 100%, 1.0); --h4-color: hsla(0, 0%, 100%, 1.0); --h5-color: hsla(0, 0%, 100%, 1.0); --h6-color: hsla(0, 0%, 100%, 1.0); --p-color: hsla(0, 0%, 84%, 1.0); --li-color: hsla(0, 0%, 84%, 1.0); /* TABLES */ --th-color: hsla(208, 7%, 46%, 1.0); --th-bg-color: hsla(0, 0%, 100%, 0); --td-color: hsla(0, 0%, 84%, 1.0); --td-bg-color: hsla(0, 0%, 100%, 0); /* FORMS */ --link-color: hsla(198, 88%, 34%, 1.0); --link-color-hover: hsla(198, 88%, 39%, 1.0); --link-color-active: hsla(198, 88%, 39%, 1.0); --label-color: hsla(0, 0%, 100%, 1.0); --input-color: hsla(0, 0%, 84%, 1.0); --input-color-focus: hsla(0, 0%, 84%, 1.0); --input-bg-color: hsla(240, 17%, 10%, 1.0); --input-bg-color-focus: hsla(240, 17%, 10%, 1.0); --input-border-color: hsla(240, 7%, 21%, 1.0); --input-border-color-focus: hsla(198, 88%, 34%, 1.0); /* BUTTONS */ --btn-icon-color: hsla(198, 88%, 34%, 1.0); --btn-icon-color-hover: hsla(198, 88%, 39%, 1.0); --btn-icon-color-active: hsla(198, 88%, 39%, 1.0); /* BTN-DEFAULT */ --btn-default-color: hsla(0, 0%, 72%, 1.0); --btn-default-color-hover: hsla(0, 0%, 100%, 1.0); --btn-default-color-active: hsla(0, 0%, 100%, 1.0); --btn-default-color-focus: hsla(0, 0%, 100%, 1.0); --btn-default-bg-color: hsla(240, 17%, 10%, 1.0); --btn-default-bg-color-hover: hsla(240, 17%, 10%, 1.0); --btn-default-bg-color-active: hsla(240, 17%, 10%, 1.0); --btn-default-bg-color-focus: hsla(240, 17%, 10%, 1.0); --btn-default-border-color: hsla(240, 7%, 21%, 1.0); --btn-default-border-color-hover: hsla(208, 7%, 46%, 1.0); --btn-default-border-color-active: hsla(208, 7%, 46%, 1.0); --btn-default-border-color-focus: hsla(208, 7%, 46%, 1.0); /* BTN-PRIMARY */ --btn-primary-color: hsla(0, 0%, 0%, 1.0); --btn-primary-color-hover: hsla(0, 0%, 0%, 1.0); --btn-primary-color-active: hsla(0, 0%, 0%, 1.0); --btn-primary-color-focus: hsla(0, 0%, 0%, 1.0); --btn-primary-bg-color: hsla(163, 72%, 47%, 1.0); --btn-primary-bg-color-hover: hsla(174, 42%, 57%, 1.0); --btn-primary-bg-color-active: hsla(174, 42%, 57%, 1.0); --btn-primary-bg-color-focus: hsla(174, 42%, 57%, 1.0); --btn-primary-border-color: hsla(163, 72%, 47%, 1.0); --btn-primary-border-color-hover: hsla(174, 42%, 57%, 1.0); --btn-primary-border-color-active: hsla(174, 42%, 57%, 1.0); --btn-primary-border-color-focus: hsla(174, 42%, 57%, 1.0); /* BTN-SECONDARY */ --btn-secondary-color: hsla(163, 72%, 47%, 1.0); --btn-secondary-color-hover: hsla(174, 42%, 57%, 1.0); --btn-secondary-color-active: hsla(174, 42%, 57%, 1.0); --btn-secondary-color-focus: hsla(174, 42%, 57%, 1.0); --btn-secondary-bg-color: hsla(0, 0%, 100%, 0); --btn-secondary-bg-color-hover: hsla(0, 0%, 100%, 0); --btn-secondary-bg-color-active: hsla(0, 0%, 100%, 0); --btn-secondary-bg-color-focus: hsla(0, 0%, 100%, 0); --btn-secondary-border-color: hsla(163, 72%, 47%, 1.0); --btn-secondary-border-color-hover: hsla(174, 42%, 57%, 1.0); --btn-secondary-border-color-active: hsla(174, 42%, 57%, 1.0); --btn-secondary-border-color-focus: hsla(174, 42%, 57%, 1.0); /* BTN-TERTIARY */ --btn-tertiary-color: hsla(0, 0%, 0%, 1.0); --btn-tertiary-color-hover: hsla(0, 0%, 0%, 1.0); --btn-tertiary-color-active: hsla(0, 0%, 0%, 1.0); --btn-tertiary-color-focus: hsla(0, 0%, 0%, 1.0); --btn-tertiary-bg-color: hsla(0, 0%, 90%, 1.0); --btn-tertiary-bg-color-hover: hsla(0, 0%, 100%, 1.0); --btn-tertiary-bg-color-active: hsla(0, 0%, 100%, 1.0); --btn-tertiary-bg-color-focus: hsla(0, 0%, 100%, 1.0); --btn-tertiary-border-color: hsla(0, 0%, 90%, 1.0); --btn-tertiary-border-color-hover: hsla(0, 0%, 100%, 1.0); --btn-tertiary-border-color-active: hsla(0, 0%, 100%, 1.0); --btn-tertiary-border-color-focus: hsla(0, 0%, 100%, 1.0); /* ALERTS */ --alert-primary-color: hsla(0, 0%, 84%, 1.0); --alert-primary-bg-color: hsla(163, 72%, 47%, 0.20); --alert-primary-border-color: hsla(163, 72%, 47%, 0.20); --alert-secondary-color: hsla(0, 0%, 84%, 1.0); --alert-secondary-bg-color: hsla(208, 7%, 46%, 0.05); --alert-secondary-border-color: hsla(208, 7%, 46%, 0.20); --alert-info-color: hsla(0, 0%, 84%, 1.0); --alert-info-bg-color: hsla(204, 73%, 64%, 0.20); --alert-info-border-color: hsla(204, 73%, 64%, 0.20); --alert-success-color: hsla(0, 0%, 84%, 1.0); --alert-success-bg-color: hsla(148, 85%, 38%, 0.20); --alert-success-border-color: hsla(148, 85%, 38%, 0.20); --alert-warning-color: hsla(0, 0%, 84%, 1.0); --alert-warning-bg-color: hsla(42, 100%, 50%, 0.20); --alert-warning-border-color: hsla(42, 100%, 50%, 0.20); --alert-danger-color: hsla(355, 100%, 62%, 1.0); --alert-danger-bg-color: hsla(355, 100%, 62%, 0.20); --alert-danger-border-color: hsla(355, 100%, 62%, 0.20); /* ACCOUNT MANAGEMENT */ --am-nav-top-bg-color: hsla(221, 22%, 17%, 1.0); --am-nav-top-font-color: hsla(0, 0%, 100%, 0.80); --am-nav-top-font-color-hover: hsla(0, 0%, 100%, 1.0); --am-nav-top-font-color-active: hsla(0, 0%, 100%, 1.0); --am-nav-top-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-top-link-bg-color-hover: hsla(0, 0%, 100%, 0); --am-nav-top-link-bg-color-active: hsla(0, 0%, 100%, 0); --am-nav-top-dropdown-bg-color: hsla(240, 17%, 10%, 1.0); --am-nav-top-dropdown-font-color: hsla(0, 0%, 84%, 1.0); --am-nav-top-dropdown-font-color-hover: hsla(0, 0%, 100%, 1.0); --am-nav-top-dropdown-font-color-active: hsla(0, 0%, 100%, 1.0); --am-nav-top-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-top-dropdown-link-bg-color-hover: hsla(212, 100%, 60%, 0.05); --am-nav-top-dropdown-link-bg-color-active: hsla(212, 100%, 60%, 0.05); --am-nav-bottom-bg-color: hsla(240, 17%, 10%, 1.0); --am-nav-bottom-font-color: hsla(0, 0%, 84%, 1.0); --am-nav-bottom-font-color-hover: hsla(0, 0%, 100%, 1.0); --am-nav-bottom-font-color-active: hsla(0, 0%, 100%, 1.0); --am-nav-bottom-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-bottom-link-bg-color-hover: hsla(0, 0%, 100%, 0); --am-nav-bottom-link-bg-color-active: hsla(0, 0%, 100%, 0); --am-nav-bottom-dropdown-bg-color: hsla(240, 17%, 10%, 1.0); --am-nav-bottom-dropdown-font-color: hsla(0, 0%, 84%, 1.0); --am-nav-bottom-dropdown-font-color-hover: hsla(0, 0%, 100%, 1.0); --am-nav-bottom-dropdown-font-color-active: hsla(0, 0%, 100%, 1.0); --am-nav-bottom-dropdown-link-bg-color: hsla(0, 0%, 100%, 0); --am-nav-bottom-dropdown-link-bg-color-hover: hsla(212, 100%, 60%, 0.05); --am-nav-bottom-dropdown-link-bg-color-active: hsla(212, 100%, 60%, 0.05); --am-footer-bg-color: hsla(240, 17%, 6%, 1.0); --am-footer-font-color: hsla(0, 0%, 84%, 1.0); --am-footer-font-color-dark: hsla(0, 0%, 100%, 1.0); --am-footer-font-color-light: hsla(0, 0%, 72%, 1.0); --am-footer-link-color: hsla(0, 0%, 84%, 1.0); --am-footer-link-color-hover: hsla(198, 88%, 34%, 1.0); --am-footer-link-color-active: hsla(198, 88%, 34%, 1.0); --am-login-bg-color: hsla(240, 17%, 10%, 1.0); --am-panel-bg-color: hsla(240, 17%, 10%, 1.0); --am-panel-heading-bg-color: hsla(240, 17%, 10%, 1.0); --am-panel-body-bg-color: hsla(240, 17%, 10%, 1.0); /* REGISTRATION */ --reg-brand-logo-image: var(--brand-logo-image); --reg-brand-logo-mobile-image: var(--brand-logo-mobile-image); --reg-nav-top-bg-color: hsla(221, 22%, 17%, 1.0); --reg-nav-top-font-color: hsla(0, 0%, 100%, 0.80); --reg-nav-top-font-color-hover: hsla(0, 0%, 100%, 1.0); --reg-nav-top-dropdown-font-color: hsla(0, 0%, 84%, 1.0); --reg-nav-top-dropdown-font-color-hover: hsla(0, 0%, 100%, 1.0); --reg-app-progress-bg-color: hsla(163, 72%, 47%, 1.0); --reg-app-progress-font-color: hsla(0, 0%, 100%, 0.80); --reg-app-progress-font-color-active: hsla(0, 0%, 100%, 1.0); --reg-footer-bg-color: hsla(240, 17%, 6%, 1.0); --reg-footer-font-color: hsla(0, 0%, 84%, 1.0); --reg-start-left-bg-color: hsla(163, 72%, 47%, 1.0); --reg-start-left-font-color: hsla(0, 0%, 100%, 1.0); --reg-start-right-bg-color: hsla(240, 17%, 10%, 1.0); --reg-start-right-font-color: hsla(0, 0%, 84%, 1.0); /* WEBSITE */ --nav-top-bg-color: hsla(0, 0%, 0%, 1.0); --nav-top-link-color: hsla(0, 0%, 100%, 0.80); --nav-top-link-color-hover: hsla(0, 0%, 100%, 1.0); --nav-top-link-color-active: hsla(0, 0%, 100%, 1.0); --nav-top-link-bg-color: hsla(0, 0%, 0%, 0); --nav-top-link-bg-color-hover: hsla(0, 0%, 0%, 0); --nav-top-link-bg-color-active: hsla(0, 0%, 0%, 0); --nav-top-dropdown-bg-color: hsla(240, 17%, 10%, 1.0); --nav-top-dropdown-font-color-dark: hsla(0, 0%, 100%, 1.0); --nav-top-dropdown-font-color: hsla(0, 0%, 100%, 0.80); --nav-top-dropdown-font-color-light: hsla(0, 0%, 100%, 0.60); --nav-top-dropdown-link-color: hsla(0, 0%, 100%, 0.80); --nav-top-dropdown-link-color-hover: hsla(163, 72%, 47%, 1.0); --nav-top-dropdown-link-color-active: hsla(163, 72%, 47%, 1.0); --nav-top-dropdown-link-bg-color: hsla(0, 0%, 0%, 0); --nav-top-dropdown-link-bg-color-hover: hsla(208, 7%, 46%, 0.05); --nav-top-dropdown-link-bg-color-active: hsla(208, 7%, 46%, 0.05); --nav-bottom-bg-color: hsla(240, 17%, 10%, 1.0); --nav-bottom-link-color: hsla(0, 0%, 100%, 0.80); --nav-bottom-link-color-hover: hsla(163, 72%, 47%, 1.0); --nav-bottom-link-color-active: hsla(163, 72%, 47%, 1.0); --nav-bottom-link-bg-color: hsla(0, 0%, 0%, 0); --nav-bottom-link-bg-color-hover: hsla(0, 0%, 0%, 0); --nav-bottom-link-bg-color-active: hsla(0, 0%, 0%, 0); --nav-bottom-dropdown-bg-color: hsla(240, 17%, 10%, 1.0); --nav-bottom-dropdown-font-color-dark: hsla(0, 0%, 100%, 1.0); --nav-bottom-dropdown-font-color: hsla(0, 0%, 100%, 0.80); --nav-bottom-dropdown-font-color-light: hsla(0, 0%, 100%, 0.60); --nav-bottom-dropdown-link-color: hsla(0, 0%, 100%, 0.80); --nav-bottom-dropdown-link-color-hover: hsla(163, 72%, 47%, 1.0); --nav-bottom-dropdown-link-color-active: hsla(163, 72%, 47%, 1.0); --nav-bottom-dropdown-link-bg-color: hsla(0, 0%, 0%, 0); --nav-bottom-dropdown-link-bg-color-hover: hsla(208, 7%, 46%, 0.05); --nav-bottom-dropdown-link-bg-color-active: hsla(208, 7%, 46%, 0.05); --footer-bg-color: hsla(240, 17%, 6%, 1.0); --footer-font-color-dark: hsla(0, 0%, 100%, 1.0); --footer-font-color: hsla(0, 0%, 100%, 0.80); --footer-font-color-light: hsla(0, 0%, 100%, 0.60); --footer-link-color: hsla(0, 0%, 100%, 0.60); --footer-link-color-hover: hsla(163, 72%, 47%, 1.0); --footer-link-color-active: hsla(163, 72%, 47%, 1.0); } /*# sourceMappingURL=website-wb-default.css.map */