From 5d48ee17c139415767bb596e2ab0aa65e0a3038d Mon Sep 17 00:00:00 2001 From: Justice Date: Sun, 21 Apr 2019 00:38:44 +0100 Subject: [PATCH 001/151] integrated tailwind and antdesign --- next.config.js | 3 + package.json | 97 +- pages/index.js | 6 + postcss.config.js | 4 + src/index.css | 28431 +++++++++++++++++++++++++++++++++++++++++ src/styles/index.css | 5 + tailwind.config.js | 980 ++ 7 files changed, 29482 insertions(+), 44 deletions(-) create mode 100644 next.config.js create mode 100644 postcss.config.js create mode 100644 src/index.css create mode 100644 src/styles/index.css create mode 100644 tailwind.config.js diff --git a/next.config.js b/next.config.js new file mode 100644 index 0000000..c576301 --- /dev/null +++ b/next.config.js @@ -0,0 +1,3 @@ +const withCSS = require('@zeit/next-css'); + +module.exports = withCSS(); diff --git a/package.json b/package.json index bcf782f..203b60a 100644 --- a/package.json +++ b/package.json @@ -1,46 +1,55 @@ { - "name": "project-template", - "version": "1.0.0", - "description": "Template for starting a project", - "main": "index.js", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 0", - "lint": "eslint pages" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/enyeInc/project-template.git" - }, - "author": "Uche Nnadi", - "license": "ISC", - "bugs": { - "url": "https://github.com/enyeInc/project-template/issues" - }, - "homepage": "https://github.com/enyeInc/project-template#readme", - "devDependencies": { - "babel-eslint": "^10.0.1", - "chai": "^4.2.0", - "enzyme": "^3.9.0", - "eslint": "^5.8.0", - "eslint-config-airbnb": "^17.1.0", - "eslint-config-standard": "^12.0.0", - "eslint-plugin-import": "^2.14.0", - "eslint-plugin-jsx-a11y": "^6.2.1", - "eslint-plugin-node": "^7.0.1", - "eslint-plugin-promise": "^4.0.1", - "eslint-plugin-react": "^7.11.1", - "eslint-plugin-standard": "^4.0.0", - "jest": "^24.7.1", - "mocha": "^6.1.2", - "sinon": "^7.3.1" - }, - "dependencies": { - "dotenv": "^7.0.0", - "express": "^4.16.4", - "next": "^8.0.4", - "react": "^16.8.6", - "react-dom": "^16.8.6", - "redux": "^4.0.1", - "redux-saga": "^1.0.2" - } + "name": "HelpMe", + "version": "1.0.0", + "description": "An App That connects depressed people to each other for comfort", + "main": "index.js", + "scripts": { + "build:css": "postcss src/styles/index.css -o src/index.css", + "watch:css": "postcss src/styles/index.css -o src/index.css -w", + "lint": "eslint pages", + "dev": "npm run build:css && next", + "build": "npm run build:css && next build", + "start": "npm run build:css && next start" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/team-helpme/helpme.git" + }, + "author": "Uche Nnadi, Justice Otuya, Marshall Akpan, Daniel Damilare", + "license": "ISC", + "bugs": { + "url": "https://github.com/team-helpme/helpme/issues" + }, + "homepage": "https://github.com/team-helpme/helpme#readme", + "devDependencies": { + "autoprefixer": "^9.5.1", + "babel-eslint": "^10.0.1", + "chai": "^4.2.0", + "enzyme": "^3.9.0", + "eslint": "^5.8.0", + "eslint-config-airbnb": "^17.1.0", + "eslint-config-standard": "^12.0.0", + "eslint-plugin-import": "^2.14.0", + "eslint-plugin-jsx-a11y": "^6.2.1", + "eslint-plugin-node": "^7.0.1", + "eslint-plugin-promise": "^4.0.1", + "eslint-plugin-react": "^7.11.1", + "eslint-plugin-standard": "^4.0.0", + "jest": "^24.7.1", + "mocha": "^6.1.2", + "postcss-cli": "^6.1.2", + "sinon": "^7.3.1", + "tailwindcss": "^0.7.4" + }, + "dependencies": { + "@zeit/next-css": "^1.0.1", + "antd": "^3.16.3", + "dotenv": "^7.0.0", + "express": "^4.16.4", + "next": "^8.0.4", + "react": "^16.8.6", + "react-dom": "^16.8.6", + "redux": "^4.0.1", + "redux-saga": "^1.0.2" + } } diff --git a/pages/index.js b/pages/index.js index e69de29..f6c4678 100644 --- a/pages/index.js +++ b/pages/index.js @@ -0,0 +1,6 @@ +// import React from 'react'; +// import '../src/index.css'; + +// const test = () =>
Today is my cay
; + +// export default test; diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 0000000..a81a9fb --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,4 @@ +const tailwindcss = require('tailwindcss'); +module.exports = { + plugins: [tailwindcss('./tailwind.config.js'), require('autoprefixer')] +}; diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..aaa8109 --- /dev/null +++ b/src/index.css @@ -0,0 +1,28431 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in iOS. + */ + +html { + line-height: 1.15; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/* Sections + ========================================================================== */ + +/** + * Remove the margin in all browsers. + */ + +body { + margin: 0; +} + +/** + * Render the `main` element consistently in IE. + */ + +main { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ + +h1 { + font-size: 2em; + margin: .67em 0; +} + +/* Grouping content + ========================================================================== */ + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ + +/** + * Remove the gray background on active links in IE 10. + */ + +a { + background-color: transparent; +} + +/** + * 1. Remove the bottom border in Chrome 57- + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; /* 2 */ +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** + * Add the correct font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Remove the border on images inside links in IE 10. + */ + +img { + border-style: none; +} + +/* Forms + ========================================================================== */ + +/** + * 1. Change the font styles in all browsers. + * 2. Remove the margin in Firefox and Safari. + */ + +button, +input, +optgroup, +select, +textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + +button, +input { + /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + +button, +select { + /* 1 */ + text-transform: none; +} + +/** + * Correct the inability to style clickable types in iOS and Safari. + */ + +button, +[type="button"], +[type="reset"], +[type="submit"] { + -webkit-appearance: button; +} + +/** + * Remove the inner border and padding in Firefox. + */ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ + +fieldset { + padding: .35em .75em .625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** + * Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + +progress { + vertical-align: baseline; +} + +/** + * Remove the default vertical scrollbar in IE 10+. + */ + +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10. + * 2. Remove the padding in IE 10. + */ + +[type="checkbox"], +[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** + * Remove the inner padding in Chrome and Safari on macOS. + */ + +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ + +/* + * Add the correct display in Edge, IE 10+, and Firefox. + */ + +details { + display: block; +} + +/* + * Add the correct display in all browsers. + */ + +summary { + display: list-item; +} + +/* Misc + ========================================================================== */ + +/** + * Add the correct display in IE 10+. + */ + +template { + display: none; +} + +/** + * Add the correct display in IE 10. + */ + +[hidden] { + display: none; +} + +/** + * Manually forked from SUIT CSS Base: https://github.com/suitcss/base + * A thin layer on top of normalize.css that provides a starting point more + * suitable for web applications. + */ + +/** + * 1. Prevent padding and border from affecting element width + * https://goo.gl/pYtbK7 + * 2. Change the default font family in all browsers (opinionated) + */ + +html { + box-sizing: border-box; /* 1 */ + font-family: sans-serif; /* 2 */ +} + +*, +*::before, +*::after { + box-sizing: inherit; +} + +/** + * Removes the default spacing and border for appropriate elements. + */ + +blockquote, +dl, +dd, +h1, +h2, +h3, +h4, +h5, +h6, +figure, +p, +pre { + margin: 0; +} + +button { + background: transparent; + padding: 0; +} + +/** + * Work around a Firefox/IE bug where the transparent `button` background + * results in a loss of the default `button` focus styles. + */ + +button:focus { + outline: 1px dotted; + outline: 5px auto -webkit-focus-ring-color; +} + +fieldset { + margin: 0; + padding: 0; +} + +ol, +ul { + margin: 0; +} + +/** + * Tailwind custom reset styles + */ + +/** + * Allow adding a border to an element by just adding a border-width. + * + * By default, the way the browser specifies that an element should have no + * border is by setting it's border-style to `none` in the user-agent + * stylesheet. + * + * In order to easily add borders to elements by just setting the `border-width` + * property, we change the default border-style for all elements to `solid`, and + * use border-width to hide them instead. This way our `border` utilities only + * need to set the `border-width` property instead of the entire `border` + * shorthand, making our border utilities much more straightforward to compose. + * + * https://github.com/tailwindcss/tailwindcss/pull/116 + */ + +*, +*::before, +*::after { + border-width: 0; + border-style: solid; + border-color: #dae1e7; +} + +/** + * Undo the `border-style: none` reset that Normalize applies to images so that + * our `border-{width}` utilities have the expected effect. + * + * The Normalize reset is unnecessary for us since we default the border-width + * to 0 on all elements. + * + * https://github.com/tailwindcss/tailwindcss/issues/362 + */ + +img { + border-style: solid; +} + +textarea { + resize: vertical; +} + +img { + max-width: 100%; + height: auto; +} + +input::-webkit-input-placeholder, +textarea::-webkit-input-placeholder { + color: inherit; + opacity: .5; +} + +input::-moz-placeholder, +textarea::-moz-placeholder { + color: inherit; + opacity: .5; +} + +input:-ms-input-placeholder, +textarea:-ms-input-placeholder { + color: inherit; + opacity: .5; +} + +input::-ms-input-placeholder, +textarea::-ms-input-placeholder { + color: inherit; + opacity: .5; +} + +input::placeholder, +textarea::placeholder { + color: inherit; + opacity: .5; +} + +button, +[role="button"] { + cursor: pointer; +} + +table { + border-collapse: collapse; +} + +.container { + width: 100%; +} + +@media (min-width: 576px) { + .container { + max-width: 576px; + } +} + +@media (min-width: 768px) { + .container { + max-width: 768px; + } +} + +@media (min-width: 992px) { + .container { + max-width: 992px; + } +} + +@media (min-width: 1200px) { + .container { + max-width: 1200px; + } +} + +.list-reset { + list-style: none; + padding: 0; +} + +.appearance-none { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; +} + +.bg-fixed { + background-attachment: fixed; +} + +.bg-local { + background-attachment: local; +} + +.bg-scroll { + background-attachment: scroll; +} + +.bg-transparent { + background-color: transparent; +} + +.bg-black { + background-color: #22292f; +} + +.bg-grey-darkest { + background-color: #3d4852; +} + +.bg-grey-darker { + background-color: #606f7b; +} + +.bg-grey-dark { + background-color: #8795a1; +} + +.bg-grey { + background-color: #b8c2cc; +} + +.bg-grey-light { + background-color: #dae1e7; +} + +.bg-grey-lighter { + background-color: #f1f5f8; +} + +.bg-grey-lightest { + background-color: #f8fafc; +} + +.bg-white { + background-color: #fff; +} + +.bg-red-darkest { + background-color: #3b0d0c; +} + +.bg-red-darker { + background-color: #621b18; +} + +.bg-red-dark { + background-color: #cc1f1a; +} + +.bg-red { + background-color: #e3342f; +} + +.bg-red-light { + background-color: #ef5753; +} + +.bg-red-lighter { + background-color: #f9acaa; +} + +.bg-red-lightest { + background-color: #fcebea; +} + +.bg-orange-darkest { + background-color: #462a16; +} + +.bg-orange-darker { + background-color: #613b1f; +} + +.bg-orange-dark { + background-color: #de751f; +} + +.bg-orange { + background-color: #f6993f; +} + +.bg-orange-light { + background-color: #faad63; +} + +.bg-orange-lighter { + background-color: #fcd9b6; +} + +.bg-orange-lightest { + background-color: #fff5eb; +} + +.bg-yellow-darkest { + background-color: #453411; +} + +.bg-yellow-darker { + background-color: #684f1d; +} + +.bg-yellow-dark { + background-color: #f2d024; +} + +.bg-yellow { + background-color: #ffed4a; +} + +.bg-yellow-light { + background-color: #fff382; +} + +.bg-yellow-lighter { + background-color: #fff9c2; +} + +.bg-yellow-lightest { + background-color: #fcfbeb; +} + +.bg-green-darkest { + background-color: #0f2f21; +} + +.bg-green-darker { + background-color: #1a4731; +} + +.bg-green-dark { + background-color: #1f9d55; +} + +.bg-green { + background-color: #38c172; +} + +.bg-green-light { + background-color: #51d88a; +} + +.bg-green-lighter { + background-color: #a2f5bf; +} + +.bg-green-lightest { + background-color: #e3fcec; +} + +.bg-teal-darkest { + background-color: #0d3331; +} + +.bg-teal-darker { + background-color: #20504f; +} + +.bg-teal-dark { + background-color: #38a89d; +} + +.bg-teal { + background-color: #4dc0b5; +} + +.bg-teal-light { + background-color: #64d5ca; +} + +.bg-teal-lighter { + background-color: #a0f0ed; +} + +.bg-teal-lightest { + background-color: #e8fffe; +} + +.bg-blue-darkest { + background-color: #12283a; +} + +.bg-blue-darker { + background-color: #1c3d5a; +} + +.bg-blue-dark { + background-color: #2779bd; +} + +.bg-blue { + background-color: #3490dc; +} + +.bg-blue-light { + background-color: #6cb2eb; +} + +.bg-blue-lighter { + background-color: #bcdefa; +} + +.bg-blue-lightest { + background-color: #eff8ff; +} + +.bg-indigo-darkest { + background-color: #191e38; +} + +.bg-indigo-darker { + background-color: #2f365f; +} + +.bg-indigo-dark { + background-color: #5661b3; +} + +.bg-indigo { + background-color: #6574cd; +} + +.bg-indigo-light { + background-color: #7886d7; +} + +.bg-indigo-lighter { + background-color: #b2b7ff; +} + +.bg-indigo-lightest { + background-color: #e6e8ff; +} + +.bg-purple-darkest { + background-color: #21183c; +} + +.bg-purple-darker { + background-color: #382b5f; +} + +.bg-purple-dark { + background-color: #794acf; +} + +.bg-purple { + background-color: #9561e2; +} + +.bg-purple-light { + background-color: #a779e9; +} + +.bg-purple-lighter { + background-color: #d6bbfc; +} + +.bg-purple-lightest { + background-color: #f3ebff; +} + +.bg-pink-darkest { + background-color: #451225; +} + +.bg-pink-darker { + background-color: #6f213f; +} + +.bg-pink-dark { + background-color: #eb5286; +} + +.bg-pink { + background-color: #f66d9b; +} + +.bg-pink-light { + background-color: #fa7ea8; +} + +.bg-pink-lighter { + background-color: #ffbbca; +} + +.bg-pink-lightest { + background-color: #ffebef; +} + +.hover\:bg-transparent:hover { + background-color: transparent; +} + +.hover\:bg-black:hover { + background-color: #22292f; +} + +.hover\:bg-grey-darkest:hover { + background-color: #3d4852; +} + +.hover\:bg-grey-darker:hover { + background-color: #606f7b; +} + +.hover\:bg-grey-dark:hover { + background-color: #8795a1; +} + +.hover\:bg-grey:hover { + background-color: #b8c2cc; +} + +.hover\:bg-grey-light:hover { + background-color: #dae1e7; +} + +.hover\:bg-grey-lighter:hover { + background-color: #f1f5f8; +} + +.hover\:bg-grey-lightest:hover { + background-color: #f8fafc; +} + +.hover\:bg-white:hover { + background-color: #fff; +} + +.hover\:bg-red-darkest:hover { + background-color: #3b0d0c; +} + +.hover\:bg-red-darker:hover { + background-color: #621b18; +} + +.hover\:bg-red-dark:hover { + background-color: #cc1f1a; +} + +.hover\:bg-red:hover { + background-color: #e3342f; +} + +.hover\:bg-red-light:hover { + background-color: #ef5753; +} + +.hover\:bg-red-lighter:hover { + background-color: #f9acaa; +} + +.hover\:bg-red-lightest:hover { + background-color: #fcebea; +} + +.hover\:bg-orange-darkest:hover { + background-color: #462a16; +} + +.hover\:bg-orange-darker:hover { + background-color: #613b1f; +} + +.hover\:bg-orange-dark:hover { + background-color: #de751f; +} + +.hover\:bg-orange:hover { + background-color: #f6993f; +} + +.hover\:bg-orange-light:hover { + background-color: #faad63; +} + +.hover\:bg-orange-lighter:hover { + background-color: #fcd9b6; +} + +.hover\:bg-orange-lightest:hover { + background-color: #fff5eb; +} + +.hover\:bg-yellow-darkest:hover { + background-color: #453411; +} + +.hover\:bg-yellow-darker:hover { + background-color: #684f1d; +} + +.hover\:bg-yellow-dark:hover { + background-color: #f2d024; +} + +.hover\:bg-yellow:hover { + background-color: #ffed4a; +} + +.hover\:bg-yellow-light:hover { + background-color: #fff382; +} + +.hover\:bg-yellow-lighter:hover { + background-color: #fff9c2; +} + +.hover\:bg-yellow-lightest:hover { + background-color: #fcfbeb; +} + +.hover\:bg-green-darkest:hover { + background-color: #0f2f21; +} + +.hover\:bg-green-darker:hover { + background-color: #1a4731; +} + +.hover\:bg-green-dark:hover { + background-color: #1f9d55; +} + +.hover\:bg-green:hover { + background-color: #38c172; +} + +.hover\:bg-green-light:hover { + background-color: #51d88a; +} + +.hover\:bg-green-lighter:hover { + background-color: #a2f5bf; +} + +.hover\:bg-green-lightest:hover { + background-color: #e3fcec; +} + +.hover\:bg-teal-darkest:hover { + background-color: #0d3331; +} + +.hover\:bg-teal-darker:hover { + background-color: #20504f; +} + +.hover\:bg-teal-dark:hover { + background-color: #38a89d; +} + +.hover\:bg-teal:hover { + background-color: #4dc0b5; +} + +.hover\:bg-teal-light:hover { + background-color: #64d5ca; +} + +.hover\:bg-teal-lighter:hover { + background-color: #a0f0ed; +} + +.hover\:bg-teal-lightest:hover { + background-color: #e8fffe; +} + +.hover\:bg-blue-darkest:hover { + background-color: #12283a; +} + +.hover\:bg-blue-darker:hover { + background-color: #1c3d5a; +} + +.hover\:bg-blue-dark:hover { + background-color: #2779bd; +} + +.hover\:bg-blue:hover { + background-color: #3490dc; +} + +.hover\:bg-blue-light:hover { + background-color: #6cb2eb; +} + +.hover\:bg-blue-lighter:hover { + background-color: #bcdefa; +} + +.hover\:bg-blue-lightest:hover { + background-color: #eff8ff; +} + +.hover\:bg-indigo-darkest:hover { + background-color: #191e38; +} + +.hover\:bg-indigo-darker:hover { + background-color: #2f365f; +} + +.hover\:bg-indigo-dark:hover { + background-color: #5661b3; +} + +.hover\:bg-indigo:hover { + background-color: #6574cd; +} + +.hover\:bg-indigo-light:hover { + background-color: #7886d7; +} + +.hover\:bg-indigo-lighter:hover { + background-color: #b2b7ff; +} + +.hover\:bg-indigo-lightest:hover { + background-color: #e6e8ff; +} + +.hover\:bg-purple-darkest:hover { + background-color: #21183c; +} + +.hover\:bg-purple-darker:hover { + background-color: #382b5f; +} + +.hover\:bg-purple-dark:hover { + background-color: #794acf; +} + +.hover\:bg-purple:hover { + background-color: #9561e2; +} + +.hover\:bg-purple-light:hover { + background-color: #a779e9; +} + +.hover\:bg-purple-lighter:hover { + background-color: #d6bbfc; +} + +.hover\:bg-purple-lightest:hover { + background-color: #f3ebff; +} + +.hover\:bg-pink-darkest:hover { + background-color: #451225; +} + +.hover\:bg-pink-darker:hover { + background-color: #6f213f; +} + +.hover\:bg-pink-dark:hover { + background-color: #eb5286; +} + +.hover\:bg-pink:hover { + background-color: #f66d9b; +} + +.hover\:bg-pink-light:hover { + background-color: #fa7ea8; +} + +.hover\:bg-pink-lighter:hover { + background-color: #ffbbca; +} + +.hover\:bg-pink-lightest:hover { + background-color: #ffebef; +} + +.focus\:bg-transparent:focus { + background-color: transparent; +} + +.focus\:bg-black:focus { + background-color: #22292f; +} + +.focus\:bg-grey-darkest:focus { + background-color: #3d4852; +} + +.focus\:bg-grey-darker:focus { + background-color: #606f7b; +} + +.focus\:bg-grey-dark:focus { + background-color: #8795a1; +} + +.focus\:bg-grey:focus { + background-color: #b8c2cc; +} + +.focus\:bg-grey-light:focus { + background-color: #dae1e7; +} + +.focus\:bg-grey-lighter:focus { + background-color: #f1f5f8; +} + +.focus\:bg-grey-lightest:focus { + background-color: #f8fafc; +} + +.focus\:bg-white:focus { + background-color: #fff; +} + +.focus\:bg-red-darkest:focus { + background-color: #3b0d0c; +} + +.focus\:bg-red-darker:focus { + background-color: #621b18; +} + +.focus\:bg-red-dark:focus { + background-color: #cc1f1a; +} + +.focus\:bg-red:focus { + background-color: #e3342f; +} + +.focus\:bg-red-light:focus { + background-color: #ef5753; +} + +.focus\:bg-red-lighter:focus { + background-color: #f9acaa; +} + +.focus\:bg-red-lightest:focus { + background-color: #fcebea; +} + +.focus\:bg-orange-darkest:focus { + background-color: #462a16; +} + +.focus\:bg-orange-darker:focus { + background-color: #613b1f; +} + +.focus\:bg-orange-dark:focus { + background-color: #de751f; +} + +.focus\:bg-orange:focus { + background-color: #f6993f; +} + +.focus\:bg-orange-light:focus { + background-color: #faad63; +} + +.focus\:bg-orange-lighter:focus { + background-color: #fcd9b6; +} + +.focus\:bg-orange-lightest:focus { + background-color: #fff5eb; +} + +.focus\:bg-yellow-darkest:focus { + background-color: #453411; +} + +.focus\:bg-yellow-darker:focus { + background-color: #684f1d; +} + +.focus\:bg-yellow-dark:focus { + background-color: #f2d024; +} + +.focus\:bg-yellow:focus { + background-color: #ffed4a; +} + +.focus\:bg-yellow-light:focus { + background-color: #fff382; +} + +.focus\:bg-yellow-lighter:focus { + background-color: #fff9c2; +} + +.focus\:bg-yellow-lightest:focus { + background-color: #fcfbeb; +} + +.focus\:bg-green-darkest:focus { + background-color: #0f2f21; +} + +.focus\:bg-green-darker:focus { + background-color: #1a4731; +} + +.focus\:bg-green-dark:focus { + background-color: #1f9d55; +} + +.focus\:bg-green:focus { + background-color: #38c172; +} + +.focus\:bg-green-light:focus { + background-color: #51d88a; +} + +.focus\:bg-green-lighter:focus { + background-color: #a2f5bf; +} + +.focus\:bg-green-lightest:focus { + background-color: #e3fcec; +} + +.focus\:bg-teal-darkest:focus { + background-color: #0d3331; +} + +.focus\:bg-teal-darker:focus { + background-color: #20504f; +} + +.focus\:bg-teal-dark:focus { + background-color: #38a89d; +} + +.focus\:bg-teal:focus { + background-color: #4dc0b5; +} + +.focus\:bg-teal-light:focus { + background-color: #64d5ca; +} + +.focus\:bg-teal-lighter:focus { + background-color: #a0f0ed; +} + +.focus\:bg-teal-lightest:focus { + background-color: #e8fffe; +} + +.focus\:bg-blue-darkest:focus { + background-color: #12283a; +} + +.focus\:bg-blue-darker:focus { + background-color: #1c3d5a; +} + +.focus\:bg-blue-dark:focus { + background-color: #2779bd; +} + +.focus\:bg-blue:focus { + background-color: #3490dc; +} + +.focus\:bg-blue-light:focus { + background-color: #6cb2eb; +} + +.focus\:bg-blue-lighter:focus { + background-color: #bcdefa; +} + +.focus\:bg-blue-lightest:focus { + background-color: #eff8ff; +} + +.focus\:bg-indigo-darkest:focus { + background-color: #191e38; +} + +.focus\:bg-indigo-darker:focus { + background-color: #2f365f; +} + +.focus\:bg-indigo-dark:focus { + background-color: #5661b3; +} + +.focus\:bg-indigo:focus { + background-color: #6574cd; +} + +.focus\:bg-indigo-light:focus { + background-color: #7886d7; +} + +.focus\:bg-indigo-lighter:focus { + background-color: #b2b7ff; +} + +.focus\:bg-indigo-lightest:focus { + background-color: #e6e8ff; +} + +.focus\:bg-purple-darkest:focus { + background-color: #21183c; +} + +.focus\:bg-purple-darker:focus { + background-color: #382b5f; +} + +.focus\:bg-purple-dark:focus { + background-color: #794acf; +} + +.focus\:bg-purple:focus { + background-color: #9561e2; +} + +.focus\:bg-purple-light:focus { + background-color: #a779e9; +} + +.focus\:bg-purple-lighter:focus { + background-color: #d6bbfc; +} + +.focus\:bg-purple-lightest:focus { + background-color: #f3ebff; +} + +.focus\:bg-pink-darkest:focus { + background-color: #451225; +} + +.focus\:bg-pink-darker:focus { + background-color: #6f213f; +} + +.focus\:bg-pink-dark:focus { + background-color: #eb5286; +} + +.focus\:bg-pink:focus { + background-color: #f66d9b; +} + +.focus\:bg-pink-light:focus { + background-color: #fa7ea8; +} + +.focus\:bg-pink-lighter:focus { + background-color: #ffbbca; +} + +.focus\:bg-pink-lightest:focus { + background-color: #ffebef; +} + +.bg-bottom { + background-position: bottom; +} + +.bg-center { + background-position: center; +} + +.bg-left { + background-position: left; +} + +.bg-left-bottom { + background-position: left bottom; +} + +.bg-left-top { + background-position: left top; +} + +.bg-right { + background-position: right; +} + +.bg-right-bottom { + background-position: right bottom; +} + +.bg-right-top { + background-position: right top; +} + +.bg-top { + background-position: top; +} + +.bg-repeat { + background-repeat: repeat; +} + +.bg-no-repeat { + background-repeat: no-repeat; +} + +.bg-repeat-x { + background-repeat: repeat-x; +} + +.bg-repeat-y { + background-repeat: repeat-y; +} + +.bg-auto { + background-size: auto; +} + +.bg-cover { + background-size: cover; +} + +.bg-contain { + background-size: contain; +} + +.border-collapse { + border-collapse: collapse; +} + +.border-separate { + border-collapse: separate; +} + +.border-transparent { + border-color: transparent; +} + +.border-black { + border-color: #22292f; +} + +.border-grey-darkest { + border-color: #3d4852; +} + +.border-grey-darker { + border-color: #606f7b; +} + +.border-grey-dark { + border-color: #8795a1; +} + +.border-grey { + border-color: #b8c2cc; +} + +.border-grey-light { + border-color: #dae1e7; +} + +.border-grey-lighter { + border-color: #f1f5f8; +} + +.border-grey-lightest { + border-color: #f8fafc; +} + +.border-white { + border-color: #fff; +} + +.border-red-darkest { + border-color: #3b0d0c; +} + +.border-red-darker { + border-color: #621b18; +} + +.border-red-dark { + border-color: #cc1f1a; +} + +.border-red { + border-color: #e3342f; +} + +.border-red-light { + border-color: #ef5753; +} + +.border-red-lighter { + border-color: #f9acaa; +} + +.border-red-lightest { + border-color: #fcebea; +} + +.border-orange-darkest { + border-color: #462a16; +} + +.border-orange-darker { + border-color: #613b1f; +} + +.border-orange-dark { + border-color: #de751f; +} + +.border-orange { + border-color: #f6993f; +} + +.border-orange-light { + border-color: #faad63; +} + +.border-orange-lighter { + border-color: #fcd9b6; +} + +.border-orange-lightest { + border-color: #fff5eb; +} + +.border-yellow-darkest { + border-color: #453411; +} + +.border-yellow-darker { + border-color: #684f1d; +} + +.border-yellow-dark { + border-color: #f2d024; +} + +.border-yellow { + border-color: #ffed4a; +} + +.border-yellow-light { + border-color: #fff382; +} + +.border-yellow-lighter { + border-color: #fff9c2; +} + +.border-yellow-lightest { + border-color: #fcfbeb; +} + +.border-green-darkest { + border-color: #0f2f21; +} + +.border-green-darker { + border-color: #1a4731; +} + +.border-green-dark { + border-color: #1f9d55; +} + +.border-green { + border-color: #38c172; +} + +.border-green-light { + border-color: #51d88a; +} + +.border-green-lighter { + border-color: #a2f5bf; +} + +.border-green-lightest { + border-color: #e3fcec; +} + +.border-teal-darkest { + border-color: #0d3331; +} + +.border-teal-darker { + border-color: #20504f; +} + +.border-teal-dark { + border-color: #38a89d; +} + +.border-teal { + border-color: #4dc0b5; +} + +.border-teal-light { + border-color: #64d5ca; +} + +.border-teal-lighter { + border-color: #a0f0ed; +} + +.border-teal-lightest { + border-color: #e8fffe; +} + +.border-blue-darkest { + border-color: #12283a; +} + +.border-blue-darker { + border-color: #1c3d5a; +} + +.border-blue-dark { + border-color: #2779bd; +} + +.border-blue { + border-color: #3490dc; +} + +.border-blue-light { + border-color: #6cb2eb; +} + +.border-blue-lighter { + border-color: #bcdefa; +} + +.border-blue-lightest { + border-color: #eff8ff; +} + +.border-indigo-darkest { + border-color: #191e38; +} + +.border-indigo-darker { + border-color: #2f365f; +} + +.border-indigo-dark { + border-color: #5661b3; +} + +.border-indigo { + border-color: #6574cd; +} + +.border-indigo-light { + border-color: #7886d7; +} + +.border-indigo-lighter { + border-color: #b2b7ff; +} + +.border-indigo-lightest { + border-color: #e6e8ff; +} + +.border-purple-darkest { + border-color: #21183c; +} + +.border-purple-darker { + border-color: #382b5f; +} + +.border-purple-dark { + border-color: #794acf; +} + +.border-purple { + border-color: #9561e2; +} + +.border-purple-light { + border-color: #a779e9; +} + +.border-purple-lighter { + border-color: #d6bbfc; +} + +.border-purple-lightest { + border-color: #f3ebff; +} + +.border-pink-darkest { + border-color: #451225; +} + +.border-pink-darker { + border-color: #6f213f; +} + +.border-pink-dark { + border-color: #eb5286; +} + +.border-pink { + border-color: #f66d9b; +} + +.border-pink-light { + border-color: #fa7ea8; +} + +.border-pink-lighter { + border-color: #ffbbca; +} + +.border-pink-lightest { + border-color: #ffebef; +} + +.hover\:border-transparent:hover { + border-color: transparent; +} + +.hover\:border-black:hover { + border-color: #22292f; +} + +.hover\:border-grey-darkest:hover { + border-color: #3d4852; +} + +.hover\:border-grey-darker:hover { + border-color: #606f7b; +} + +.hover\:border-grey-dark:hover { + border-color: #8795a1; +} + +.hover\:border-grey:hover { + border-color: #b8c2cc; +} + +.hover\:border-grey-light:hover { + border-color: #dae1e7; +} + +.hover\:border-grey-lighter:hover { + border-color: #f1f5f8; +} + +.hover\:border-grey-lightest:hover { + border-color: #f8fafc; +} + +.hover\:border-white:hover { + border-color: #fff; +} + +.hover\:border-red-darkest:hover { + border-color: #3b0d0c; +} + +.hover\:border-red-darker:hover { + border-color: #621b18; +} + +.hover\:border-red-dark:hover { + border-color: #cc1f1a; +} + +.hover\:border-red:hover { + border-color: #e3342f; +} + +.hover\:border-red-light:hover { + border-color: #ef5753; +} + +.hover\:border-red-lighter:hover { + border-color: #f9acaa; +} + +.hover\:border-red-lightest:hover { + border-color: #fcebea; +} + +.hover\:border-orange-darkest:hover { + border-color: #462a16; +} + +.hover\:border-orange-darker:hover { + border-color: #613b1f; +} + +.hover\:border-orange-dark:hover { + border-color: #de751f; +} + +.hover\:border-orange:hover { + border-color: #f6993f; +} + +.hover\:border-orange-light:hover { + border-color: #faad63; +} + +.hover\:border-orange-lighter:hover { + border-color: #fcd9b6; +} + +.hover\:border-orange-lightest:hover { + border-color: #fff5eb; +} + +.hover\:border-yellow-darkest:hover { + border-color: #453411; +} + +.hover\:border-yellow-darker:hover { + border-color: #684f1d; +} + +.hover\:border-yellow-dark:hover { + border-color: #f2d024; +} + +.hover\:border-yellow:hover { + border-color: #ffed4a; +} + +.hover\:border-yellow-light:hover { + border-color: #fff382; +} + +.hover\:border-yellow-lighter:hover { + border-color: #fff9c2; +} + +.hover\:border-yellow-lightest:hover { + border-color: #fcfbeb; +} + +.hover\:border-green-darkest:hover { + border-color: #0f2f21; +} + +.hover\:border-green-darker:hover { + border-color: #1a4731; +} + +.hover\:border-green-dark:hover { + border-color: #1f9d55; +} + +.hover\:border-green:hover { + border-color: #38c172; +} + +.hover\:border-green-light:hover { + border-color: #51d88a; +} + +.hover\:border-green-lighter:hover { + border-color: #a2f5bf; +} + +.hover\:border-green-lightest:hover { + border-color: #e3fcec; +} + +.hover\:border-teal-darkest:hover { + border-color: #0d3331; +} + +.hover\:border-teal-darker:hover { + border-color: #20504f; +} + +.hover\:border-teal-dark:hover { + border-color: #38a89d; +} + +.hover\:border-teal:hover { + border-color: #4dc0b5; +} + +.hover\:border-teal-light:hover { + border-color: #64d5ca; +} + +.hover\:border-teal-lighter:hover { + border-color: #a0f0ed; +} + +.hover\:border-teal-lightest:hover { + border-color: #e8fffe; +} + +.hover\:border-blue-darkest:hover { + border-color: #12283a; +} + +.hover\:border-blue-darker:hover { + border-color: #1c3d5a; +} + +.hover\:border-blue-dark:hover { + border-color: #2779bd; +} + +.hover\:border-blue:hover { + border-color: #3490dc; +} + +.hover\:border-blue-light:hover { + border-color: #6cb2eb; +} + +.hover\:border-blue-lighter:hover { + border-color: #bcdefa; +} + +.hover\:border-blue-lightest:hover { + border-color: #eff8ff; +} + +.hover\:border-indigo-darkest:hover { + border-color: #191e38; +} + +.hover\:border-indigo-darker:hover { + border-color: #2f365f; +} + +.hover\:border-indigo-dark:hover { + border-color: #5661b3; +} + +.hover\:border-indigo:hover { + border-color: #6574cd; +} + +.hover\:border-indigo-light:hover { + border-color: #7886d7; +} + +.hover\:border-indigo-lighter:hover { + border-color: #b2b7ff; +} + +.hover\:border-indigo-lightest:hover { + border-color: #e6e8ff; +} + +.hover\:border-purple-darkest:hover { + border-color: #21183c; +} + +.hover\:border-purple-darker:hover { + border-color: #382b5f; +} + +.hover\:border-purple-dark:hover { + border-color: #794acf; +} + +.hover\:border-purple:hover { + border-color: #9561e2; +} + +.hover\:border-purple-light:hover { + border-color: #a779e9; +} + +.hover\:border-purple-lighter:hover { + border-color: #d6bbfc; +} + +.hover\:border-purple-lightest:hover { + border-color: #f3ebff; +} + +.hover\:border-pink-darkest:hover { + border-color: #451225; +} + +.hover\:border-pink-darker:hover { + border-color: #6f213f; +} + +.hover\:border-pink-dark:hover { + border-color: #eb5286; +} + +.hover\:border-pink:hover { + border-color: #f66d9b; +} + +.hover\:border-pink-light:hover { + border-color: #fa7ea8; +} + +.hover\:border-pink-lighter:hover { + border-color: #ffbbca; +} + +.hover\:border-pink-lightest:hover { + border-color: #ffebef; +} + +.focus\:border-transparent:focus { + border-color: transparent; +} + +.focus\:border-black:focus { + border-color: #22292f; +} + +.focus\:border-grey-darkest:focus { + border-color: #3d4852; +} + +.focus\:border-grey-darker:focus { + border-color: #606f7b; +} + +.focus\:border-grey-dark:focus { + border-color: #8795a1; +} + +.focus\:border-grey:focus { + border-color: #b8c2cc; +} + +.focus\:border-grey-light:focus { + border-color: #dae1e7; +} + +.focus\:border-grey-lighter:focus { + border-color: #f1f5f8; +} + +.focus\:border-grey-lightest:focus { + border-color: #f8fafc; +} + +.focus\:border-white:focus { + border-color: #fff; +} + +.focus\:border-red-darkest:focus { + border-color: #3b0d0c; +} + +.focus\:border-red-darker:focus { + border-color: #621b18; +} + +.focus\:border-red-dark:focus { + border-color: #cc1f1a; +} + +.focus\:border-red:focus { + border-color: #e3342f; +} + +.focus\:border-red-light:focus { + border-color: #ef5753; +} + +.focus\:border-red-lighter:focus { + border-color: #f9acaa; +} + +.focus\:border-red-lightest:focus { + border-color: #fcebea; +} + +.focus\:border-orange-darkest:focus { + border-color: #462a16; +} + +.focus\:border-orange-darker:focus { + border-color: #613b1f; +} + +.focus\:border-orange-dark:focus { + border-color: #de751f; +} + +.focus\:border-orange:focus { + border-color: #f6993f; +} + +.focus\:border-orange-light:focus { + border-color: #faad63; +} + +.focus\:border-orange-lighter:focus { + border-color: #fcd9b6; +} + +.focus\:border-orange-lightest:focus { + border-color: #fff5eb; +} + +.focus\:border-yellow-darkest:focus { + border-color: #453411; +} + +.focus\:border-yellow-darker:focus { + border-color: #684f1d; +} + +.focus\:border-yellow-dark:focus { + border-color: #f2d024; +} + +.focus\:border-yellow:focus { + border-color: #ffed4a; +} + +.focus\:border-yellow-light:focus { + border-color: #fff382; +} + +.focus\:border-yellow-lighter:focus { + border-color: #fff9c2; +} + +.focus\:border-yellow-lightest:focus { + border-color: #fcfbeb; +} + +.focus\:border-green-darkest:focus { + border-color: #0f2f21; +} + +.focus\:border-green-darker:focus { + border-color: #1a4731; +} + +.focus\:border-green-dark:focus { + border-color: #1f9d55; +} + +.focus\:border-green:focus { + border-color: #38c172; +} + +.focus\:border-green-light:focus { + border-color: #51d88a; +} + +.focus\:border-green-lighter:focus { + border-color: #a2f5bf; +} + +.focus\:border-green-lightest:focus { + border-color: #e3fcec; +} + +.focus\:border-teal-darkest:focus { + border-color: #0d3331; +} + +.focus\:border-teal-darker:focus { + border-color: #20504f; +} + +.focus\:border-teal-dark:focus { + border-color: #38a89d; +} + +.focus\:border-teal:focus { + border-color: #4dc0b5; +} + +.focus\:border-teal-light:focus { + border-color: #64d5ca; +} + +.focus\:border-teal-lighter:focus { + border-color: #a0f0ed; +} + +.focus\:border-teal-lightest:focus { + border-color: #e8fffe; +} + +.focus\:border-blue-darkest:focus { + border-color: #12283a; +} + +.focus\:border-blue-darker:focus { + border-color: #1c3d5a; +} + +.focus\:border-blue-dark:focus { + border-color: #2779bd; +} + +.focus\:border-blue:focus { + border-color: #3490dc; +} + +.focus\:border-blue-light:focus { + border-color: #6cb2eb; +} + +.focus\:border-blue-lighter:focus { + border-color: #bcdefa; +} + +.focus\:border-blue-lightest:focus { + border-color: #eff8ff; +} + +.focus\:border-indigo-darkest:focus { + border-color: #191e38; +} + +.focus\:border-indigo-darker:focus { + border-color: #2f365f; +} + +.focus\:border-indigo-dark:focus { + border-color: #5661b3; +} + +.focus\:border-indigo:focus { + border-color: #6574cd; +} + +.focus\:border-indigo-light:focus { + border-color: #7886d7; +} + +.focus\:border-indigo-lighter:focus { + border-color: #b2b7ff; +} + +.focus\:border-indigo-lightest:focus { + border-color: #e6e8ff; +} + +.focus\:border-purple-darkest:focus { + border-color: #21183c; +} + +.focus\:border-purple-darker:focus { + border-color: #382b5f; +} + +.focus\:border-purple-dark:focus { + border-color: #794acf; +} + +.focus\:border-purple:focus { + border-color: #9561e2; +} + +.focus\:border-purple-light:focus { + border-color: #a779e9; +} + +.focus\:border-purple-lighter:focus { + border-color: #d6bbfc; +} + +.focus\:border-purple-lightest:focus { + border-color: #f3ebff; +} + +.focus\:border-pink-darkest:focus { + border-color: #451225; +} + +.focus\:border-pink-darker:focus { + border-color: #6f213f; +} + +.focus\:border-pink-dark:focus { + border-color: #eb5286; +} + +.focus\:border-pink:focus { + border-color: #f66d9b; +} + +.focus\:border-pink-light:focus { + border-color: #fa7ea8; +} + +.focus\:border-pink-lighter:focus { + border-color: #ffbbca; +} + +.focus\:border-pink-lightest:focus { + border-color: #ffebef; +} + +.rounded-none { + border-radius: 0; +} + +.rounded-sm { + border-radius: .125rem; +} + +.rounded { + border-radius: .25rem; +} + +.rounded-lg { + border-radius: .5rem; +} + +.rounded-full { + border-radius: 9999px; +} + +.rounded-t-none { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.rounded-r-none { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.rounded-b-none { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} + +.rounded-l-none { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +.rounded-t-sm { + border-top-left-radius: .125rem; + border-top-right-radius: .125rem; +} + +.rounded-r-sm { + border-top-right-radius: .125rem; + border-bottom-right-radius: .125rem; +} + +.rounded-b-sm { + border-bottom-right-radius: .125rem; + border-bottom-left-radius: .125rem; +} + +.rounded-l-sm { + border-top-left-radius: .125rem; + border-bottom-left-radius: .125rem; +} + +.rounded-t { + border-top-left-radius: .25rem; + border-top-right-radius: .25rem; +} + +.rounded-r { + border-top-right-radius: .25rem; + border-bottom-right-radius: .25rem; +} + +.rounded-b { + border-bottom-right-radius: .25rem; + border-bottom-left-radius: .25rem; +} + +.rounded-l { + border-top-left-radius: .25rem; + border-bottom-left-radius: .25rem; +} + +.rounded-t-lg { + border-top-left-radius: .5rem; + border-top-right-radius: .5rem; +} + +.rounded-r-lg { + border-top-right-radius: .5rem; + border-bottom-right-radius: .5rem; +} + +.rounded-b-lg { + border-bottom-right-radius: .5rem; + border-bottom-left-radius: .5rem; +} + +.rounded-l-lg { + border-top-left-radius: .5rem; + border-bottom-left-radius: .5rem; +} + +.rounded-t-full { + border-top-left-radius: 9999px; + border-top-right-radius: 9999px; +} + +.rounded-r-full { + border-top-right-radius: 9999px; + border-bottom-right-radius: 9999px; +} + +.rounded-b-full { + border-bottom-right-radius: 9999px; + border-bottom-left-radius: 9999px; +} + +.rounded-l-full { + border-top-left-radius: 9999px; + border-bottom-left-radius: 9999px; +} + +.rounded-tl-none { + border-top-left-radius: 0; +} + +.rounded-tr-none { + border-top-right-radius: 0; +} + +.rounded-br-none { + border-bottom-right-radius: 0; +} + +.rounded-bl-none { + border-bottom-left-radius: 0; +} + +.rounded-tl-sm { + border-top-left-radius: .125rem; +} + +.rounded-tr-sm { + border-top-right-radius: .125rem; +} + +.rounded-br-sm { + border-bottom-right-radius: .125rem; +} + +.rounded-bl-sm { + border-bottom-left-radius: .125rem; +} + +.rounded-tl { + border-top-left-radius: .25rem; +} + +.rounded-tr { + border-top-right-radius: .25rem; +} + +.rounded-br { + border-bottom-right-radius: .25rem; +} + +.rounded-bl { + border-bottom-left-radius: .25rem; +} + +.rounded-tl-lg { + border-top-left-radius: .5rem; +} + +.rounded-tr-lg { + border-top-right-radius: .5rem; +} + +.rounded-br-lg { + border-bottom-right-radius: .5rem; +} + +.rounded-bl-lg { + border-bottom-left-radius: .5rem; +} + +.rounded-tl-full { + border-top-left-radius: 9999px; +} + +.rounded-tr-full { + border-top-right-radius: 9999px; +} + +.rounded-br-full { + border-bottom-right-radius: 9999px; +} + +.rounded-bl-full { + border-bottom-left-radius: 9999px; +} + +.border-solid { + border-style: solid; +} + +.border-dashed { + border-style: dashed; +} + +.border-dotted { + border-style: dotted; +} + +.border-none { + border-style: none; +} + +.border-0 { + border-width: 0; +} + +.border-2 { + border-width: 2px; +} + +.border-4 { + border-width: 4px; +} + +.border-8 { + border-width: 8px; +} + +.border { + border-width: 1px; +} + +.border-t-0 { + border-top-width: 0; +} + +.border-r-0 { + border-right-width: 0; +} + +.border-b-0 { + border-bottom-width: 0; +} + +.border-l-0 { + border-left-width: 0; +} + +.border-t-2 { + border-top-width: 2px; +} + +.border-r-2 { + border-right-width: 2px; +} + +.border-b-2 { + border-bottom-width: 2px; +} + +.border-l-2 { + border-left-width: 2px; +} + +.border-t-4 { + border-top-width: 4px; +} + +.border-r-4 { + border-right-width: 4px; +} + +.border-b-4 { + border-bottom-width: 4px; +} + +.border-l-4 { + border-left-width: 4px; +} + +.border-t-8 { + border-top-width: 8px; +} + +.border-r-8 { + border-right-width: 8px; +} + +.border-b-8 { + border-bottom-width: 8px; +} + +.border-l-8 { + border-left-width: 8px; +} + +.border-t { + border-top-width: 1px; +} + +.border-r { + border-right-width: 1px; +} + +.border-b { + border-bottom-width: 1px; +} + +.border-l { + border-left-width: 1px; +} + +.cursor-auto { + cursor: auto; +} + +.cursor-default { + cursor: default; +} + +.cursor-pointer { + cursor: pointer; +} + +.cursor-wait { + cursor: wait; +} + +.cursor-move { + cursor: move; +} + +.cursor-not-allowed { + cursor: not-allowed; +} + +.block { + display: block; +} + +.inline-block { + display: inline-block; +} + +.inline { + display: inline; +} + +.table { + display: table; +} + +.table-row { + display: table-row; +} + +.table-cell { + display: table-cell; +} + +.hidden { + display: none; +} + +.flex { + display: flex; +} + +.inline-flex { + display: inline-flex; +} + +.flex-row { + flex-direction: row; +} + +.flex-row-reverse { + flex-direction: row-reverse; +} + +.flex-col { + flex-direction: column; +} + +.flex-col-reverse { + flex-direction: column-reverse; +} + +.flex-wrap { + flex-wrap: wrap; +} + +.flex-wrap-reverse { + flex-wrap: wrap-reverse; +} + +.flex-no-wrap { + flex-wrap: nowrap; +} + +.items-start { + align-items: flex-start; +} + +.items-end { + align-items: flex-end; +} + +.items-center { + align-items: center; +} + +.items-baseline { + align-items: baseline; +} + +.items-stretch { + align-items: stretch; +} + +.self-auto { + align-self: auto; +} + +.self-start { + align-self: flex-start; +} + +.self-end { + align-self: flex-end; +} + +.self-center { + align-self: center; +} + +.self-stretch { + align-self: stretch; +} + +.justify-start { + justify-content: flex-start; +} + +.justify-end { + justify-content: flex-end; +} + +.justify-center { + justify-content: center; +} + +.justify-between { + justify-content: space-between; +} + +.justify-around { + justify-content: space-around; +} + +.content-center { + align-content: center; +} + +.content-start { + align-content: flex-start; +} + +.content-end { + align-content: flex-end; +} + +.content-between { + align-content: space-between; +} + +.content-around { + align-content: space-around; +} + +.flex-1 { + flex: 1 1 0%; +} + +.flex-auto { + flex: 1 1 auto; +} + +.flex-initial { + flex: 0 1 auto; +} + +.flex-none { + flex: none; +} + +.flex-grow { + flex-grow: 1; +} + +.flex-shrink { + flex-shrink: 1; +} + +.flex-no-grow { + flex-grow: 0; +} + +.flex-no-shrink { + flex-shrink: 0; +} + +.float-right { + float: right; +} + +.float-left { + float: left; +} + +.float-none { + float: none; +} + +.clearfix:after { + content: ""; + display: table; + clear: both; +} + +.font-sans { + font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; +} + +.font-serif { + font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; +} + +.font-mono { + font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; +} + +.font-hairline { + font-weight: 100; +} + +.font-thin { + font-weight: 200; +} + +.font-light { + font-weight: 300; +} + +.font-normal { + font-weight: 400; +} + +.font-medium { + font-weight: 500; +} + +.font-semibold { + font-weight: 600; +} + +.font-bold { + font-weight: 700; +} + +.font-extrabold { + font-weight: 800; +} + +.font-black { + font-weight: 900; +} + +.hover\:font-hairline:hover { + font-weight: 100; +} + +.hover\:font-thin:hover { + font-weight: 200; +} + +.hover\:font-light:hover { + font-weight: 300; +} + +.hover\:font-normal:hover { + font-weight: 400; +} + +.hover\:font-medium:hover { + font-weight: 500; +} + +.hover\:font-semibold:hover { + font-weight: 600; +} + +.hover\:font-bold:hover { + font-weight: 700; +} + +.hover\:font-extrabold:hover { + font-weight: 800; +} + +.hover\:font-black:hover { + font-weight: 900; +} + +.focus\:font-hairline:focus { + font-weight: 100; +} + +.focus\:font-thin:focus { + font-weight: 200; +} + +.focus\:font-light:focus { + font-weight: 300; +} + +.focus\:font-normal:focus { + font-weight: 400; +} + +.focus\:font-medium:focus { + font-weight: 500; +} + +.focus\:font-semibold:focus { + font-weight: 600; +} + +.focus\:font-bold:focus { + font-weight: 700; +} + +.focus\:font-extrabold:focus { + font-weight: 800; +} + +.focus\:font-black:focus { + font-weight: 900; +} + +.h-1 { + height: .25rem; +} + +.h-2 { + height: .5rem; +} + +.h-3 { + height: .75rem; +} + +.h-4 { + height: 1rem; +} + +.h-5 { + height: 1.25rem; +} + +.h-6 { + height: 1.5rem; +} + +.h-8 { + height: 2rem; +} + +.h-10 { + height: 2.5rem; +} + +.h-12 { + height: 3rem; +} + +.h-16 { + height: 4rem; +} + +.h-24 { + height: 6rem; +} + +.h-32 { + height: 8rem; +} + +.h-48 { + height: 12rem; +} + +.h-64 { + height: 16rem; +} + +.h-auto { + height: auto; +} + +.h-px { + height: 1px; +} + +.h-full { + height: 100%; +} + +.h-screen { + height: 100vh; +} + +.leading-none { + line-height: 1; +} + +.leading-tight { + line-height: 1.25; +} + +.leading-normal { + line-height: 1.5; +} + +.leading-loose { + line-height: 2; +} + +.m-0 { + margin: 0; +} + +.m-1 { + margin: .25rem; +} + +.m-2 { + margin: .5rem; +} + +.m-3 { + margin: .75rem; +} + +.m-4 { + margin: 1rem; +} + +.m-5 { + margin: 1.25rem; +} + +.m-6 { + margin: 1.5rem; +} + +.m-8 { + margin: 2rem; +} + +.m-10 { + margin: 2.5rem; +} + +.m-12 { + margin: 3rem; +} + +.m-16 { + margin: 4rem; +} + +.m-20 { + margin: 5rem; +} + +.m-24 { + margin: 6rem; +} + +.m-32 { + margin: 8rem; +} + +.m-auto { + margin: auto; +} + +.m-px { + margin: 1px; +} + +.my-0 { + margin-top: 0; + margin-bottom: 0; +} + +.mx-0 { + margin-left: 0; + margin-right: 0; +} + +.my-1 { + margin-top: .25rem; + margin-bottom: .25rem; +} + +.mx-1 { + margin-left: .25rem; + margin-right: .25rem; +} + +.my-2 { + margin-top: .5rem; + margin-bottom: .5rem; +} + +.mx-2 { + margin-left: .5rem; + margin-right: .5rem; +} + +.my-3 { + margin-top: .75rem; + margin-bottom: .75rem; +} + +.mx-3 { + margin-left: .75rem; + margin-right: .75rem; +} + +.my-4 { + margin-top: 1rem; + margin-bottom: 1rem; +} + +.mx-4 { + margin-left: 1rem; + margin-right: 1rem; +} + +.my-5 { + margin-top: 1.25rem; + margin-bottom: 1.25rem; +} + +.mx-5 { + margin-left: 1.25rem; + margin-right: 1.25rem; +} + +.my-6 { + margin-top: 1.5rem; + margin-bottom: 1.5rem; +} + +.mx-6 { + margin-left: 1.5rem; + margin-right: 1.5rem; +} + +.my-8 { + margin-top: 2rem; + margin-bottom: 2rem; +} + +.mx-8 { + margin-left: 2rem; + margin-right: 2rem; +} + +.my-10 { + margin-top: 2.5rem; + margin-bottom: 2.5rem; +} + +.mx-10 { + margin-left: 2.5rem; + margin-right: 2.5rem; +} + +.my-12 { + margin-top: 3rem; + margin-bottom: 3rem; +} + +.mx-12 { + margin-left: 3rem; + margin-right: 3rem; +} + +.my-16 { + margin-top: 4rem; + margin-bottom: 4rem; +} + +.mx-16 { + margin-left: 4rem; + margin-right: 4rem; +} + +.my-20 { + margin-top: 5rem; + margin-bottom: 5rem; +} + +.mx-20 { + margin-left: 5rem; + margin-right: 5rem; +} + +.my-24 { + margin-top: 6rem; + margin-bottom: 6rem; +} + +.mx-24 { + margin-left: 6rem; + margin-right: 6rem; +} + +.my-32 { + margin-top: 8rem; + margin-bottom: 8rem; +} + +.mx-32 { + margin-left: 8rem; + margin-right: 8rem; +} + +.my-auto { + margin-top: auto; + margin-bottom: auto; +} + +.mx-auto { + margin-left: auto; + margin-right: auto; +} + +.my-px { + margin-top: 1px; + margin-bottom: 1px; +} + +.mx-px { + margin-left: 1px; + margin-right: 1px; +} + +.mt-0 { + margin-top: 0; +} + +.mr-0 { + margin-right: 0; +} + +.mb-0 { + margin-bottom: 0; +} + +.ml-0 { + margin-left: 0; +} + +.mt-1 { + margin-top: .25rem; +} + +.mr-1 { + margin-right: .25rem; +} + +.mb-1 { + margin-bottom: .25rem; +} + +.ml-1 { + margin-left: .25rem; +} + +.mt-2 { + margin-top: .5rem; +} + +.mr-2 { + margin-right: .5rem; +} + +.mb-2 { + margin-bottom: .5rem; +} + +.ml-2 { + margin-left: .5rem; +} + +.mt-3 { + margin-top: .75rem; +} + +.mr-3 { + margin-right: .75rem; +} + +.mb-3 { + margin-bottom: .75rem; +} + +.ml-3 { + margin-left: .75rem; +} + +.mt-4 { + margin-top: 1rem; +} + +.mr-4 { + margin-right: 1rem; +} + +.mb-4 { + margin-bottom: 1rem; +} + +.ml-4 { + margin-left: 1rem; +} + +.mt-5 { + margin-top: 1.25rem; +} + +.mr-5 { + margin-right: 1.25rem; +} + +.mb-5 { + margin-bottom: 1.25rem; +} + +.ml-5 { + margin-left: 1.25rem; +} + +.mt-6 { + margin-top: 1.5rem; +} + +.mr-6 { + margin-right: 1.5rem; +} + +.mb-6 { + margin-bottom: 1.5rem; +} + +.ml-6 { + margin-left: 1.5rem; +} + +.mt-8 { + margin-top: 2rem; +} + +.mr-8 { + margin-right: 2rem; +} + +.mb-8 { + margin-bottom: 2rem; +} + +.ml-8 { + margin-left: 2rem; +} + +.mt-10 { + margin-top: 2.5rem; +} + +.mr-10 { + margin-right: 2.5rem; +} + +.mb-10 { + margin-bottom: 2.5rem; +} + +.ml-10 { + margin-left: 2.5rem; +} + +.mt-12 { + margin-top: 3rem; +} + +.mr-12 { + margin-right: 3rem; +} + +.mb-12 { + margin-bottom: 3rem; +} + +.ml-12 { + margin-left: 3rem; +} + +.mt-16 { + margin-top: 4rem; +} + +.mr-16 { + margin-right: 4rem; +} + +.mb-16 { + margin-bottom: 4rem; +} + +.ml-16 { + margin-left: 4rem; +} + +.mt-20 { + margin-top: 5rem; +} + +.mr-20 { + margin-right: 5rem; +} + +.mb-20 { + margin-bottom: 5rem; +} + +.ml-20 { + margin-left: 5rem; +} + +.mt-24 { + margin-top: 6rem; +} + +.mr-24 { + margin-right: 6rem; +} + +.mb-24 { + margin-bottom: 6rem; +} + +.ml-24 { + margin-left: 6rem; +} + +.mt-32 { + margin-top: 8rem; +} + +.mr-32 { + margin-right: 8rem; +} + +.mb-32 { + margin-bottom: 8rem; +} + +.ml-32 { + margin-left: 8rem; +} + +.mt-auto { + margin-top: auto; +} + +.mr-auto { + margin-right: auto; +} + +.mb-auto { + margin-bottom: auto; +} + +.ml-auto { + margin-left: auto; +} + +.mt-px { + margin-top: 1px; +} + +.mr-px { + margin-right: 1px; +} + +.mb-px { + margin-bottom: 1px; +} + +.ml-px { + margin-left: 1px; +} + +.max-h-full { + max-height: 100%; +} + +.max-h-screen { + max-height: 100vh; +} + +.max-w-xs { + max-width: 20rem; +} + +.max-w-sm { + max-width: 30rem; +} + +.max-w-md { + max-width: 40rem; +} + +.max-w-lg { + max-width: 50rem; +} + +.max-w-xl { + max-width: 60rem; +} + +.max-w-2xl { + max-width: 70rem; +} + +.max-w-3xl { + max-width: 80rem; +} + +.max-w-4xl { + max-width: 90rem; +} + +.max-w-5xl { + max-width: 100rem; +} + +.max-w-full { + max-width: 100%; +} + +.min-h-0 { + min-height: 0; +} + +.min-h-full { + min-height: 100%; +} + +.min-h-screen { + min-height: 100vh; +} + +.min-w-0 { + min-width: 0; +} + +.min-w-full { + min-width: 100%; +} + +.-m-0 { + margin: 0; +} + +.-m-1 { + margin: -0.25rem; +} + +.-m-2 { + margin: -0.5rem; +} + +.-m-3 { + margin: -0.75rem; +} + +.-m-4 { + margin: -1rem; +} + +.-m-5 { + margin: -1.25rem; +} + +.-m-6 { + margin: -1.5rem; +} + +.-m-8 { + margin: -2rem; +} + +.-m-10 { + margin: -2.5rem; +} + +.-m-12 { + margin: -3rem; +} + +.-m-16 { + margin: -4rem; +} + +.-m-20 { + margin: -5rem; +} + +.-m-24 { + margin: -6rem; +} + +.-m-32 { + margin: -8rem; +} + +.-m-px { + margin: -1px; +} + +.-my-0 { + margin-top: 0; + margin-bottom: 0; +} + +.-mx-0 { + margin-left: 0; + margin-right: 0; +} + +.-my-1 { + margin-top: -0.25rem; + margin-bottom: -0.25rem; +} + +.-mx-1 { + margin-left: -0.25rem; + margin-right: -0.25rem; +} + +.-my-2 { + margin-top: -0.5rem; + margin-bottom: -0.5rem; +} + +.-mx-2 { + margin-left: -0.5rem; + margin-right: -0.5rem; +} + +.-my-3 { + margin-top: -0.75rem; + margin-bottom: -0.75rem; +} + +.-mx-3 { + margin-left: -0.75rem; + margin-right: -0.75rem; +} + +.-my-4 { + margin-top: -1rem; + margin-bottom: -1rem; +} + +.-mx-4 { + margin-left: -1rem; + margin-right: -1rem; +} + +.-my-5 { + margin-top: -1.25rem; + margin-bottom: -1.25rem; +} + +.-mx-5 { + margin-left: -1.25rem; + margin-right: -1.25rem; +} + +.-my-6 { + margin-top: -1.5rem; + margin-bottom: -1.5rem; +} + +.-mx-6 { + margin-left: -1.5rem; + margin-right: -1.5rem; +} + +.-my-8 { + margin-top: -2rem; + margin-bottom: -2rem; +} + +.-mx-8 { + margin-left: -2rem; + margin-right: -2rem; +} + +.-my-10 { + margin-top: -2.5rem; + margin-bottom: -2.5rem; +} + +.-mx-10 { + margin-left: -2.5rem; + margin-right: -2.5rem; +} + +.-my-12 { + margin-top: -3rem; + margin-bottom: -3rem; +} + +.-mx-12 { + margin-left: -3rem; + margin-right: -3rem; +} + +.-my-16 { + margin-top: -4rem; + margin-bottom: -4rem; +} + +.-mx-16 { + margin-left: -4rem; + margin-right: -4rem; +} + +.-my-20 { + margin-top: -5rem; + margin-bottom: -5rem; +} + +.-mx-20 { + margin-left: -5rem; + margin-right: -5rem; +} + +.-my-24 { + margin-top: -6rem; + margin-bottom: -6rem; +} + +.-mx-24 { + margin-left: -6rem; + margin-right: -6rem; +} + +.-my-32 { + margin-top: -8rem; + margin-bottom: -8rem; +} + +.-mx-32 { + margin-left: -8rem; + margin-right: -8rem; +} + +.-my-px { + margin-top: -1px; + margin-bottom: -1px; +} + +.-mx-px { + margin-left: -1px; + margin-right: -1px; +} + +.-mt-0 { + margin-top: 0; +} + +.-mr-0 { + margin-right: 0; +} + +.-mb-0 { + margin-bottom: 0; +} + +.-ml-0 { + margin-left: 0; +} + +.-mt-1 { + margin-top: -0.25rem; +} + +.-mr-1 { + margin-right: -0.25rem; +} + +.-mb-1 { + margin-bottom: -0.25rem; +} + +.-ml-1 { + margin-left: -0.25rem; +} + +.-mt-2 { + margin-top: -0.5rem; +} + +.-mr-2 { + margin-right: -0.5rem; +} + +.-mb-2 { + margin-bottom: -0.5rem; +} + +.-ml-2 { + margin-left: -0.5rem; +} + +.-mt-3 { + margin-top: -0.75rem; +} + +.-mr-3 { + margin-right: -0.75rem; +} + +.-mb-3 { + margin-bottom: -0.75rem; +} + +.-ml-3 { + margin-left: -0.75rem; +} + +.-mt-4 { + margin-top: -1rem; +} + +.-mr-4 { + margin-right: -1rem; +} + +.-mb-4 { + margin-bottom: -1rem; +} + +.-ml-4 { + margin-left: -1rem; +} + +.-mt-5 { + margin-top: -1.25rem; +} + +.-mr-5 { + margin-right: -1.25rem; +} + +.-mb-5 { + margin-bottom: -1.25rem; +} + +.-ml-5 { + margin-left: -1.25rem; +} + +.-mt-6 { + margin-top: -1.5rem; +} + +.-mr-6 { + margin-right: -1.5rem; +} + +.-mb-6 { + margin-bottom: -1.5rem; +} + +.-ml-6 { + margin-left: -1.5rem; +} + +.-mt-8 { + margin-top: -2rem; +} + +.-mr-8 { + margin-right: -2rem; +} + +.-mb-8 { + margin-bottom: -2rem; +} + +.-ml-8 { + margin-left: -2rem; +} + +.-mt-10 { + margin-top: -2.5rem; +} + +.-mr-10 { + margin-right: -2.5rem; +} + +.-mb-10 { + margin-bottom: -2.5rem; +} + +.-ml-10 { + margin-left: -2.5rem; +} + +.-mt-12 { + margin-top: -3rem; +} + +.-mr-12 { + margin-right: -3rem; +} + +.-mb-12 { + margin-bottom: -3rem; +} + +.-ml-12 { + margin-left: -3rem; +} + +.-mt-16 { + margin-top: -4rem; +} + +.-mr-16 { + margin-right: -4rem; +} + +.-mb-16 { + margin-bottom: -4rem; +} + +.-ml-16 { + margin-left: -4rem; +} + +.-mt-20 { + margin-top: -5rem; +} + +.-mr-20 { + margin-right: -5rem; +} + +.-mb-20 { + margin-bottom: -5rem; +} + +.-ml-20 { + margin-left: -5rem; +} + +.-mt-24 { + margin-top: -6rem; +} + +.-mr-24 { + margin-right: -6rem; +} + +.-mb-24 { + margin-bottom: -6rem; +} + +.-ml-24 { + margin-left: -6rem; +} + +.-mt-32 { + margin-top: -8rem; +} + +.-mr-32 { + margin-right: -8rem; +} + +.-mb-32 { + margin-bottom: -8rem; +} + +.-ml-32 { + margin-left: -8rem; +} + +.-mt-px { + margin-top: -1px; +} + +.-mr-px { + margin-right: -1px; +} + +.-mb-px { + margin-bottom: -1px; +} + +.-ml-px { + margin-left: -1px; +} + +.opacity-0 { + opacity: 0; +} + +.opacity-25 { + opacity: .25; +} + +.opacity-50 { + opacity: .5; +} + +.opacity-75 { + opacity: .75; +} + +.opacity-100 { + opacity: 1; +} + +.outline-none { + outline: 0; +} + +.focus\:outline-none:focus { + outline: 0; +} + +.overflow-auto { + overflow: auto; +} + +.overflow-hidden { + overflow: hidden; +} + +.overflow-visible { + overflow: visible; +} + +.overflow-scroll { + overflow: scroll; +} + +.overflow-x-auto { + overflow-x: auto; +} + +.overflow-y-auto { + overflow-y: auto; +} + +.overflow-x-hidden { + overflow-x: hidden; +} + +.overflow-y-hidden { + overflow-y: hidden; +} + +.overflow-x-visible { + overflow-x: visible; +} + +.overflow-y-visible { + overflow-y: visible; +} + +.overflow-x-scroll { + overflow-x: scroll; +} + +.overflow-y-scroll { + overflow-y: scroll; +} + +.scrolling-touch { + -webkit-overflow-scrolling: touch; +} + +.scrolling-auto { + -webkit-overflow-scrolling: auto; +} + +.p-0 { + padding: 0; +} + +.p-1 { + padding: .25rem; +} + +.p-2 { + padding: .5rem; +} + +.p-3 { + padding: .75rem; +} + +.p-4 { + padding: 1rem; +} + +.p-5 { + padding: 1.25rem; +} + +.p-6 { + padding: 1.5rem; +} + +.p-8 { + padding: 2rem; +} + +.p-10 { + padding: 2.5rem; +} + +.p-12 { + padding: 3rem; +} + +.p-16 { + padding: 4rem; +} + +.p-20 { + padding: 5rem; +} + +.p-24 { + padding: 6rem; +} + +.p-32 { + padding: 8rem; +} + +.p-px { + padding: 1px; +} + +.py-0 { + padding-top: 0; + padding-bottom: 0; +} + +.px-0 { + padding-left: 0; + padding-right: 0; +} + +.py-1 { + padding-top: .25rem; + padding-bottom: .25rem; +} + +.px-1 { + padding-left: .25rem; + padding-right: .25rem; +} + +.py-2 { + padding-top: .5rem; + padding-bottom: .5rem; +} + +.px-2 { + padding-left: .5rem; + padding-right: .5rem; +} + +.py-3 { + padding-top: .75rem; + padding-bottom: .75rem; +} + +.px-3 { + padding-left: .75rem; + padding-right: .75rem; +} + +.py-4 { + padding-top: 1rem; + padding-bottom: 1rem; +} + +.px-4 { + padding-left: 1rem; + padding-right: 1rem; +} + +.py-5 { + padding-top: 1.25rem; + padding-bottom: 1.25rem; +} + +.px-5 { + padding-left: 1.25rem; + padding-right: 1.25rem; +} + +.py-6 { + padding-top: 1.5rem; + padding-bottom: 1.5rem; +} + +.px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +.py-8 { + padding-top: 2rem; + padding-bottom: 2rem; +} + +.px-8 { + padding-left: 2rem; + padding-right: 2rem; +} + +.py-10 { + padding-top: 2.5rem; + padding-bottom: 2.5rem; +} + +.px-10 { + padding-left: 2.5rem; + padding-right: 2.5rem; +} + +.py-12 { + padding-top: 3rem; + padding-bottom: 3rem; +} + +.px-12 { + padding-left: 3rem; + padding-right: 3rem; +} + +.py-16 { + padding-top: 4rem; + padding-bottom: 4rem; +} + +.px-16 { + padding-left: 4rem; + padding-right: 4rem; +} + +.py-20 { + padding-top: 5rem; + padding-bottom: 5rem; +} + +.px-20 { + padding-left: 5rem; + padding-right: 5rem; +} + +.py-24 { + padding-top: 6rem; + padding-bottom: 6rem; +} + +.px-24 { + padding-left: 6rem; + padding-right: 6rem; +} + +.py-32 { + padding-top: 8rem; + padding-bottom: 8rem; +} + +.px-32 { + padding-left: 8rem; + padding-right: 8rem; +} + +.py-px { + padding-top: 1px; + padding-bottom: 1px; +} + +.px-px { + padding-left: 1px; + padding-right: 1px; +} + +.pt-0 { + padding-top: 0; +} + +.pr-0 { + padding-right: 0; +} + +.pb-0 { + padding-bottom: 0; +} + +.pl-0 { + padding-left: 0; +} + +.pt-1 { + padding-top: .25rem; +} + +.pr-1 { + padding-right: .25rem; +} + +.pb-1 { + padding-bottom: .25rem; +} + +.pl-1 { + padding-left: .25rem; +} + +.pt-2 { + padding-top: .5rem; +} + +.pr-2 { + padding-right: .5rem; +} + +.pb-2 { + padding-bottom: .5rem; +} + +.pl-2 { + padding-left: .5rem; +} + +.pt-3 { + padding-top: .75rem; +} + +.pr-3 { + padding-right: .75rem; +} + +.pb-3 { + padding-bottom: .75rem; +} + +.pl-3 { + padding-left: .75rem; +} + +.pt-4 { + padding-top: 1rem; +} + +.pr-4 { + padding-right: 1rem; +} + +.pb-4 { + padding-bottom: 1rem; +} + +.pl-4 { + padding-left: 1rem; +} + +.pt-5 { + padding-top: 1.25rem; +} + +.pr-5 { + padding-right: 1.25rem; +} + +.pb-5 { + padding-bottom: 1.25rem; +} + +.pl-5 { + padding-left: 1.25rem; +} + +.pt-6 { + padding-top: 1.5rem; +} + +.pr-6 { + padding-right: 1.5rem; +} + +.pb-6 { + padding-bottom: 1.5rem; +} + +.pl-6 { + padding-left: 1.5rem; +} + +.pt-8 { + padding-top: 2rem; +} + +.pr-8 { + padding-right: 2rem; +} + +.pb-8 { + padding-bottom: 2rem; +} + +.pl-8 { + padding-left: 2rem; +} + +.pt-10 { + padding-top: 2.5rem; +} + +.pr-10 { + padding-right: 2.5rem; +} + +.pb-10 { + padding-bottom: 2.5rem; +} + +.pl-10 { + padding-left: 2.5rem; +} + +.pt-12 { + padding-top: 3rem; +} + +.pr-12 { + padding-right: 3rem; +} + +.pb-12 { + padding-bottom: 3rem; +} + +.pl-12 { + padding-left: 3rem; +} + +.pt-16 { + padding-top: 4rem; +} + +.pr-16 { + padding-right: 4rem; +} + +.pb-16 { + padding-bottom: 4rem; +} + +.pl-16 { + padding-left: 4rem; +} + +.pt-20 { + padding-top: 5rem; +} + +.pr-20 { + padding-right: 5rem; +} + +.pb-20 { + padding-bottom: 5rem; +} + +.pl-20 { + padding-left: 5rem; +} + +.pt-24 { + padding-top: 6rem; +} + +.pr-24 { + padding-right: 6rem; +} + +.pb-24 { + padding-bottom: 6rem; +} + +.pl-24 { + padding-left: 6rem; +} + +.pt-32 { + padding-top: 8rem; +} + +.pr-32 { + padding-right: 8rem; +} + +.pb-32 { + padding-bottom: 8rem; +} + +.pl-32 { + padding-left: 8rem; +} + +.pt-px { + padding-top: 1px; +} + +.pr-px { + padding-right: 1px; +} + +.pb-px { + padding-bottom: 1px; +} + +.pl-px { + padding-left: 1px; +} + +.pointer-events-none { + pointer-events: none; +} + +.pointer-events-auto { + pointer-events: auto; +} + +.static { + position: static; +} + +.fixed { + position: fixed; +} + +.absolute { + position: absolute; +} + +.relative { + position: relative; +} + +.sticky { + position: -webkit-sticky; + position: sticky; +} + +.pin-none { + top: auto; + right: auto; + bottom: auto; + left: auto; +} + +.pin { + top: 0; + right: 0; + bottom: 0; + left: 0; +} + +.pin-y { + top: 0; + bottom: 0; +} + +.pin-x { + right: 0; + left: 0; +} + +.pin-t { + top: 0; +} + +.pin-r { + right: 0; +} + +.pin-b { + bottom: 0; +} + +.pin-l { + left: 0; +} + +.resize-none { + resize: none; +} + +.resize-y { + resize: vertical; +} + +.resize-x { + resize: horizontal; +} + +.resize { + resize: both; +} + +.shadow { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); +} + +.shadow-md { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); +} + +.shadow-lg { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); +} + +.shadow-inner { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); +} + +.shadow-outline { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); +} + +.shadow-none { + box-shadow: none; +} + +.hover\:shadow:hover { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); +} + +.hover\:shadow-md:hover { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); +} + +.hover\:shadow-lg:hover { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); +} + +.hover\:shadow-inner:hover { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); +} + +.hover\:shadow-outline:hover { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); +} + +.hover\:shadow-none:hover { + box-shadow: none; +} + +.focus\:shadow:focus { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); +} + +.focus\:shadow-md:focus { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); +} + +.focus\:shadow-lg:focus { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); +} + +.focus\:shadow-inner:focus { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); +} + +.focus\:shadow-outline:focus { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); +} + +.focus\:shadow-none:focus { + box-shadow: none; +} + +.fill-current { + fill: currentColor; +} + +.stroke-current { + stroke: currentColor; +} + +.table-auto { + table-layout: auto; +} + +.table-fixed { + table-layout: fixed; +} + +.text-left { + text-align: left; +} + +.text-center { + text-align: center; +} + +.text-right { + text-align: right; +} + +.text-justify { + text-align: justify; +} + +.text-transparent { + color: transparent; +} + +.text-black { + color: #22292f; +} + +.text-grey-darkest { + color: #3d4852; +} + +.text-grey-darker { + color: #606f7b; +} + +.text-grey-dark { + color: #8795a1; +} + +.text-grey { + color: #b8c2cc; +} + +.text-grey-light { + color: #dae1e7; +} + +.text-grey-lighter { + color: #f1f5f8; +} + +.text-grey-lightest { + color: #f8fafc; +} + +.text-white { + color: #fff; +} + +.text-red-darkest { + color: #3b0d0c; +} + +.text-red-darker { + color: #621b18; +} + +.text-red-dark { + color: #cc1f1a; +} + +.text-red { + color: #e3342f; +} + +.text-red-light { + color: #ef5753; +} + +.text-red-lighter { + color: #f9acaa; +} + +.text-red-lightest { + color: #fcebea; +} + +.text-orange-darkest { + color: #462a16; +} + +.text-orange-darker { + color: #613b1f; +} + +.text-orange-dark { + color: #de751f; +} + +.text-orange { + color: #f6993f; +} + +.text-orange-light { + color: #faad63; +} + +.text-orange-lighter { + color: #fcd9b6; +} + +.text-orange-lightest { + color: #fff5eb; +} + +.text-yellow-darkest { + color: #453411; +} + +.text-yellow-darker { + color: #684f1d; +} + +.text-yellow-dark { + color: #f2d024; +} + +.text-yellow { + color: #ffed4a; +} + +.text-yellow-light { + color: #fff382; +} + +.text-yellow-lighter { + color: #fff9c2; +} + +.text-yellow-lightest { + color: #fcfbeb; +} + +.text-green-darkest { + color: #0f2f21; +} + +.text-green-darker { + color: #1a4731; +} + +.text-green-dark { + color: #1f9d55; +} + +.text-green { + color: #38c172; +} + +.text-green-light { + color: #51d88a; +} + +.text-green-lighter { + color: #a2f5bf; +} + +.text-green-lightest { + color: #e3fcec; +} + +.text-teal-darkest { + color: #0d3331; +} + +.text-teal-darker { + color: #20504f; +} + +.text-teal-dark { + color: #38a89d; +} + +.text-teal { + color: #4dc0b5; +} + +.text-teal-light { + color: #64d5ca; +} + +.text-teal-lighter { + color: #a0f0ed; +} + +.text-teal-lightest { + color: #e8fffe; +} + +.text-blue-darkest { + color: #12283a; +} + +.text-blue-darker { + color: #1c3d5a; +} + +.text-blue-dark { + color: #2779bd; +} + +.text-blue { + color: #3490dc; +} + +.text-blue-light { + color: #6cb2eb; +} + +.text-blue-lighter { + color: #bcdefa; +} + +.text-blue-lightest { + color: #eff8ff; +} + +.text-indigo-darkest { + color: #191e38; +} + +.text-indigo-darker { + color: #2f365f; +} + +.text-indigo-dark { + color: #5661b3; +} + +.text-indigo { + color: #6574cd; +} + +.text-indigo-light { + color: #7886d7; +} + +.text-indigo-lighter { + color: #b2b7ff; +} + +.text-indigo-lightest { + color: #e6e8ff; +} + +.text-purple-darkest { + color: #21183c; +} + +.text-purple-darker { + color: #382b5f; +} + +.text-purple-dark { + color: #794acf; +} + +.text-purple { + color: #9561e2; +} + +.text-purple-light { + color: #a779e9; +} + +.text-purple-lighter { + color: #d6bbfc; +} + +.text-purple-lightest { + color: #f3ebff; +} + +.text-pink-darkest { + color: #451225; +} + +.text-pink-darker { + color: #6f213f; +} + +.text-pink-dark { + color: #eb5286; +} + +.text-pink { + color: #f66d9b; +} + +.text-pink-light { + color: #fa7ea8; +} + +.text-pink-lighter { + color: #ffbbca; +} + +.text-pink-lightest { + color: #ffebef; +} + +.hover\:text-transparent:hover { + color: transparent; +} + +.hover\:text-black:hover { + color: #22292f; +} + +.hover\:text-grey-darkest:hover { + color: #3d4852; +} + +.hover\:text-grey-darker:hover { + color: #606f7b; +} + +.hover\:text-grey-dark:hover { + color: #8795a1; +} + +.hover\:text-grey:hover { + color: #b8c2cc; +} + +.hover\:text-grey-light:hover { + color: #dae1e7; +} + +.hover\:text-grey-lighter:hover { + color: #f1f5f8; +} + +.hover\:text-grey-lightest:hover { + color: #f8fafc; +} + +.hover\:text-white:hover { + color: #fff; +} + +.hover\:text-red-darkest:hover { + color: #3b0d0c; +} + +.hover\:text-red-darker:hover { + color: #621b18; +} + +.hover\:text-red-dark:hover { + color: #cc1f1a; +} + +.hover\:text-red:hover { + color: #e3342f; +} + +.hover\:text-red-light:hover { + color: #ef5753; +} + +.hover\:text-red-lighter:hover { + color: #f9acaa; +} + +.hover\:text-red-lightest:hover { + color: #fcebea; +} + +.hover\:text-orange-darkest:hover { + color: #462a16; +} + +.hover\:text-orange-darker:hover { + color: #613b1f; +} + +.hover\:text-orange-dark:hover { + color: #de751f; +} + +.hover\:text-orange:hover { + color: #f6993f; +} + +.hover\:text-orange-light:hover { + color: #faad63; +} + +.hover\:text-orange-lighter:hover { + color: #fcd9b6; +} + +.hover\:text-orange-lightest:hover { + color: #fff5eb; +} + +.hover\:text-yellow-darkest:hover { + color: #453411; +} + +.hover\:text-yellow-darker:hover { + color: #684f1d; +} + +.hover\:text-yellow-dark:hover { + color: #f2d024; +} + +.hover\:text-yellow:hover { + color: #ffed4a; +} + +.hover\:text-yellow-light:hover { + color: #fff382; +} + +.hover\:text-yellow-lighter:hover { + color: #fff9c2; +} + +.hover\:text-yellow-lightest:hover { + color: #fcfbeb; +} + +.hover\:text-green-darkest:hover { + color: #0f2f21; +} + +.hover\:text-green-darker:hover { + color: #1a4731; +} + +.hover\:text-green-dark:hover { + color: #1f9d55; +} + +.hover\:text-green:hover { + color: #38c172; +} + +.hover\:text-green-light:hover { + color: #51d88a; +} + +.hover\:text-green-lighter:hover { + color: #a2f5bf; +} + +.hover\:text-green-lightest:hover { + color: #e3fcec; +} + +.hover\:text-teal-darkest:hover { + color: #0d3331; +} + +.hover\:text-teal-darker:hover { + color: #20504f; +} + +.hover\:text-teal-dark:hover { + color: #38a89d; +} + +.hover\:text-teal:hover { + color: #4dc0b5; +} + +.hover\:text-teal-light:hover { + color: #64d5ca; +} + +.hover\:text-teal-lighter:hover { + color: #a0f0ed; +} + +.hover\:text-teal-lightest:hover { + color: #e8fffe; +} + +.hover\:text-blue-darkest:hover { + color: #12283a; +} + +.hover\:text-blue-darker:hover { + color: #1c3d5a; +} + +.hover\:text-blue-dark:hover { + color: #2779bd; +} + +.hover\:text-blue:hover { + color: #3490dc; +} + +.hover\:text-blue-light:hover { + color: #6cb2eb; +} + +.hover\:text-blue-lighter:hover { + color: #bcdefa; +} + +.hover\:text-blue-lightest:hover { + color: #eff8ff; +} + +.hover\:text-indigo-darkest:hover { + color: #191e38; +} + +.hover\:text-indigo-darker:hover { + color: #2f365f; +} + +.hover\:text-indigo-dark:hover { + color: #5661b3; +} + +.hover\:text-indigo:hover { + color: #6574cd; +} + +.hover\:text-indigo-light:hover { + color: #7886d7; +} + +.hover\:text-indigo-lighter:hover { + color: #b2b7ff; +} + +.hover\:text-indigo-lightest:hover { + color: #e6e8ff; +} + +.hover\:text-purple-darkest:hover { + color: #21183c; +} + +.hover\:text-purple-darker:hover { + color: #382b5f; +} + +.hover\:text-purple-dark:hover { + color: #794acf; +} + +.hover\:text-purple:hover { + color: #9561e2; +} + +.hover\:text-purple-light:hover { + color: #a779e9; +} + +.hover\:text-purple-lighter:hover { + color: #d6bbfc; +} + +.hover\:text-purple-lightest:hover { + color: #f3ebff; +} + +.hover\:text-pink-darkest:hover { + color: #451225; +} + +.hover\:text-pink-darker:hover { + color: #6f213f; +} + +.hover\:text-pink-dark:hover { + color: #eb5286; +} + +.hover\:text-pink:hover { + color: #f66d9b; +} + +.hover\:text-pink-light:hover { + color: #fa7ea8; +} + +.hover\:text-pink-lighter:hover { + color: #ffbbca; +} + +.hover\:text-pink-lightest:hover { + color: #ffebef; +} + +.focus\:text-transparent:focus { + color: transparent; +} + +.focus\:text-black:focus { + color: #22292f; +} + +.focus\:text-grey-darkest:focus { + color: #3d4852; +} + +.focus\:text-grey-darker:focus { + color: #606f7b; +} + +.focus\:text-grey-dark:focus { + color: #8795a1; +} + +.focus\:text-grey:focus { + color: #b8c2cc; +} + +.focus\:text-grey-light:focus { + color: #dae1e7; +} + +.focus\:text-grey-lighter:focus { + color: #f1f5f8; +} + +.focus\:text-grey-lightest:focus { + color: #f8fafc; +} + +.focus\:text-white:focus { + color: #fff; +} + +.focus\:text-red-darkest:focus { + color: #3b0d0c; +} + +.focus\:text-red-darker:focus { + color: #621b18; +} + +.focus\:text-red-dark:focus { + color: #cc1f1a; +} + +.focus\:text-red:focus { + color: #e3342f; +} + +.focus\:text-red-light:focus { + color: #ef5753; +} + +.focus\:text-red-lighter:focus { + color: #f9acaa; +} + +.focus\:text-red-lightest:focus { + color: #fcebea; +} + +.focus\:text-orange-darkest:focus { + color: #462a16; +} + +.focus\:text-orange-darker:focus { + color: #613b1f; +} + +.focus\:text-orange-dark:focus { + color: #de751f; +} + +.focus\:text-orange:focus { + color: #f6993f; +} + +.focus\:text-orange-light:focus { + color: #faad63; +} + +.focus\:text-orange-lighter:focus { + color: #fcd9b6; +} + +.focus\:text-orange-lightest:focus { + color: #fff5eb; +} + +.focus\:text-yellow-darkest:focus { + color: #453411; +} + +.focus\:text-yellow-darker:focus { + color: #684f1d; +} + +.focus\:text-yellow-dark:focus { + color: #f2d024; +} + +.focus\:text-yellow:focus { + color: #ffed4a; +} + +.focus\:text-yellow-light:focus { + color: #fff382; +} + +.focus\:text-yellow-lighter:focus { + color: #fff9c2; +} + +.focus\:text-yellow-lightest:focus { + color: #fcfbeb; +} + +.focus\:text-green-darkest:focus { + color: #0f2f21; +} + +.focus\:text-green-darker:focus { + color: #1a4731; +} + +.focus\:text-green-dark:focus { + color: #1f9d55; +} + +.focus\:text-green:focus { + color: #38c172; +} + +.focus\:text-green-light:focus { + color: #51d88a; +} + +.focus\:text-green-lighter:focus { + color: #a2f5bf; +} + +.focus\:text-green-lightest:focus { + color: #e3fcec; +} + +.focus\:text-teal-darkest:focus { + color: #0d3331; +} + +.focus\:text-teal-darker:focus { + color: #20504f; +} + +.focus\:text-teal-dark:focus { + color: #38a89d; +} + +.focus\:text-teal:focus { + color: #4dc0b5; +} + +.focus\:text-teal-light:focus { + color: #64d5ca; +} + +.focus\:text-teal-lighter:focus { + color: #a0f0ed; +} + +.focus\:text-teal-lightest:focus { + color: #e8fffe; +} + +.focus\:text-blue-darkest:focus { + color: #12283a; +} + +.focus\:text-blue-darker:focus { + color: #1c3d5a; +} + +.focus\:text-blue-dark:focus { + color: #2779bd; +} + +.focus\:text-blue:focus { + color: #3490dc; +} + +.focus\:text-blue-light:focus { + color: #6cb2eb; +} + +.focus\:text-blue-lighter:focus { + color: #bcdefa; +} + +.focus\:text-blue-lightest:focus { + color: #eff8ff; +} + +.focus\:text-indigo-darkest:focus { + color: #191e38; +} + +.focus\:text-indigo-darker:focus { + color: #2f365f; +} + +.focus\:text-indigo-dark:focus { + color: #5661b3; +} + +.focus\:text-indigo:focus { + color: #6574cd; +} + +.focus\:text-indigo-light:focus { + color: #7886d7; +} + +.focus\:text-indigo-lighter:focus { + color: #b2b7ff; +} + +.focus\:text-indigo-lightest:focus { + color: #e6e8ff; +} + +.focus\:text-purple-darkest:focus { + color: #21183c; +} + +.focus\:text-purple-darker:focus { + color: #382b5f; +} + +.focus\:text-purple-dark:focus { + color: #794acf; +} + +.focus\:text-purple:focus { + color: #9561e2; +} + +.focus\:text-purple-light:focus { + color: #a779e9; +} + +.focus\:text-purple-lighter:focus { + color: #d6bbfc; +} + +.focus\:text-purple-lightest:focus { + color: #f3ebff; +} + +.focus\:text-pink-darkest:focus { + color: #451225; +} + +.focus\:text-pink-darker:focus { + color: #6f213f; +} + +.focus\:text-pink-dark:focus { + color: #eb5286; +} + +.focus\:text-pink:focus { + color: #f66d9b; +} + +.focus\:text-pink-light:focus { + color: #fa7ea8; +} + +.focus\:text-pink-lighter:focus { + color: #ffbbca; +} + +.focus\:text-pink-lightest:focus { + color: #ffebef; +} + +.text-xs { + font-size: .75rem; +} + +.text-sm { + font-size: .875rem; +} + +.text-base { + font-size: 1rem; +} + +.text-lg { + font-size: 1.125rem; +} + +.text-xl { + font-size: 1.25rem; +} + +.text-2xl { + font-size: 1.5rem; +} + +.text-3xl { + font-size: 1.875rem; +} + +.text-4xl { + font-size: 2.25rem; +} + +.text-5xl { + font-size: 3rem; +} + +.italic { + font-style: italic; +} + +.roman { + font-style: normal; +} + +.uppercase { + text-transform: uppercase; +} + +.lowercase { + text-transform: lowercase; +} + +.capitalize { + text-transform: capitalize; +} + +.normal-case { + text-transform: none; +} + +.underline { + text-decoration: underline; +} + +.line-through { + text-decoration: line-through; +} + +.no-underline { + text-decoration: none; +} + +.antialiased { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.subpixel-antialiased { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; +} + +.hover\:italic:hover { + font-style: italic; +} + +.hover\:roman:hover { + font-style: normal; +} + +.hover\:uppercase:hover { + text-transform: uppercase; +} + +.hover\:lowercase:hover { + text-transform: lowercase; +} + +.hover\:capitalize:hover { + text-transform: capitalize; +} + +.hover\:normal-case:hover { + text-transform: none; +} + +.hover\:underline:hover { + text-decoration: underline; +} + +.hover\:line-through:hover { + text-decoration: line-through; +} + +.hover\:no-underline:hover { + text-decoration: none; +} + +.hover\:antialiased:hover { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.hover\:subpixel-antialiased:hover { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; +} + +.focus\:italic:focus { + font-style: italic; +} + +.focus\:roman:focus { + font-style: normal; +} + +.focus\:uppercase:focus { + text-transform: uppercase; +} + +.focus\:lowercase:focus { + text-transform: lowercase; +} + +.focus\:capitalize:focus { + text-transform: capitalize; +} + +.focus\:normal-case:focus { + text-transform: none; +} + +.focus\:underline:focus { + text-decoration: underline; +} + +.focus\:line-through:focus { + text-decoration: line-through; +} + +.focus\:no-underline:focus { + text-decoration: none; +} + +.focus\:antialiased:focus { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.focus\:subpixel-antialiased:focus { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; +} + +.tracking-tight { + letter-spacing: -0.05em; +} + +.tracking-normal { + letter-spacing: 0; +} + +.tracking-wide { + letter-spacing: .05em; +} + +.select-none { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.select-text { + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; +} + +.align-baseline { + vertical-align: baseline; +} + +.align-top { + vertical-align: top; +} + +.align-middle { + vertical-align: middle; +} + +.align-bottom { + vertical-align: bottom; +} + +.align-text-top { + vertical-align: text-top; +} + +.align-text-bottom { + vertical-align: text-bottom; +} + +.visible { + visibility: visible; +} + +.invisible { + visibility: hidden; +} + +.whitespace-normal { + white-space: normal; +} + +.whitespace-no-wrap { + white-space: nowrap; +} + +.whitespace-pre { + white-space: pre; +} + +.whitespace-pre-line { + white-space: pre-line; +} + +.whitespace-pre-wrap { + white-space: pre-wrap; +} + +.break-words { + word-wrap: break-word; +} + +.break-normal { + word-wrap: normal; +} + +.truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.w-1 { + width: .25rem; +} + +.w-2 { + width: .5rem; +} + +.w-3 { + width: .75rem; +} + +.w-4 { + width: 1rem; +} + +.w-5 { + width: 1.25rem; +} + +.w-6 { + width: 1.5rem; +} + +.w-8 { + width: 2rem; +} + +.w-10 { + width: 2.5rem; +} + +.w-12 { + width: 3rem; +} + +.w-16 { + width: 4rem; +} + +.w-24 { + width: 6rem; +} + +.w-32 { + width: 8rem; +} + +.w-48 { + width: 12rem; +} + +.w-64 { + width: 16rem; +} + +.w-auto { + width: auto; +} + +.w-px { + width: 1px; +} + +.w-1\/2 { + width: 50%; +} + +.w-1\/3 { + width: 33.33333%; +} + +.w-2\/3 { + width: 66.66667%; +} + +.w-1\/4 { + width: 25%; +} + +.w-3\/4 { + width: 75%; +} + +.w-1\/5 { + width: 20%; +} + +.w-2\/5 { + width: 40%; +} + +.w-3\/5 { + width: 60%; +} + +.w-4\/5 { + width: 80%; +} + +.w-1\/6 { + width: 16.66667%; +} + +.w-5\/6 { + width: 83.33333%; +} + +.w-full { + width: 100%; +} + +.w-screen { + width: 100vw; +} + +.z-0 { + z-index: 0; +} + +.z-10 { + z-index: 10; +} + +.z-20 { + z-index: 20; +} + +.z-30 { + z-index: 30; +} + +.z-40 { + z-index: 40; +} + +.z-50 { + z-index: 50; +} + +.z-auto { + z-index: auto; +} + +/* Your custom CSS here */ + +@media (min-width: 576px) { + .sm\:list-reset { + list-style: none; + padding: 0; + } + + .sm\:appearance-none { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + .sm\:bg-fixed { + background-attachment: fixed; + } + + .sm\:bg-local { + background-attachment: local; + } + + .sm\:bg-scroll { + background-attachment: scroll; + } + + .sm\:bg-transparent { + background-color: transparent; + } + + .sm\:bg-black { + background-color: #22292f; + } + + .sm\:bg-grey-darkest { + background-color: #3d4852; + } + + .sm\:bg-grey-darker { + background-color: #606f7b; + } + + .sm\:bg-grey-dark { + background-color: #8795a1; + } + + .sm\:bg-grey { + background-color: #b8c2cc; + } + + .sm\:bg-grey-light { + background-color: #dae1e7; + } + + .sm\:bg-grey-lighter { + background-color: #f1f5f8; + } + + .sm\:bg-grey-lightest { + background-color: #f8fafc; + } + + .sm\:bg-white { + background-color: #fff; + } + + .sm\:bg-red-darkest { + background-color: #3b0d0c; + } + + .sm\:bg-red-darker { + background-color: #621b18; + } + + .sm\:bg-red-dark { + background-color: #cc1f1a; + } + + .sm\:bg-red { + background-color: #e3342f; + } + + .sm\:bg-red-light { + background-color: #ef5753; + } + + .sm\:bg-red-lighter { + background-color: #f9acaa; + } + + .sm\:bg-red-lightest { + background-color: #fcebea; + } + + .sm\:bg-orange-darkest { + background-color: #462a16; + } + + .sm\:bg-orange-darker { + background-color: #613b1f; + } + + .sm\:bg-orange-dark { + background-color: #de751f; + } + + .sm\:bg-orange { + background-color: #f6993f; + } + + .sm\:bg-orange-light { + background-color: #faad63; + } + + .sm\:bg-orange-lighter { + background-color: #fcd9b6; + } + + .sm\:bg-orange-lightest { + background-color: #fff5eb; + } + + .sm\:bg-yellow-darkest { + background-color: #453411; + } + + .sm\:bg-yellow-darker { + background-color: #684f1d; + } + + .sm\:bg-yellow-dark { + background-color: #f2d024; + } + + .sm\:bg-yellow { + background-color: #ffed4a; + } + + .sm\:bg-yellow-light { + background-color: #fff382; + } + + .sm\:bg-yellow-lighter { + background-color: #fff9c2; + } + + .sm\:bg-yellow-lightest { + background-color: #fcfbeb; + } + + .sm\:bg-green-darkest { + background-color: #0f2f21; + } + + .sm\:bg-green-darker { + background-color: #1a4731; + } + + .sm\:bg-green-dark { + background-color: #1f9d55; + } + + .sm\:bg-green { + background-color: #38c172; + } + + .sm\:bg-green-light { + background-color: #51d88a; + } + + .sm\:bg-green-lighter { + background-color: #a2f5bf; + } + + .sm\:bg-green-lightest { + background-color: #e3fcec; + } + + .sm\:bg-teal-darkest { + background-color: #0d3331; + } + + .sm\:bg-teal-darker { + background-color: #20504f; + } + + .sm\:bg-teal-dark { + background-color: #38a89d; + } + + .sm\:bg-teal { + background-color: #4dc0b5; + } + + .sm\:bg-teal-light { + background-color: #64d5ca; + } + + .sm\:bg-teal-lighter { + background-color: #a0f0ed; + } + + .sm\:bg-teal-lightest { + background-color: #e8fffe; + } + + .sm\:bg-blue-darkest { + background-color: #12283a; + } + + .sm\:bg-blue-darker { + background-color: #1c3d5a; + } + + .sm\:bg-blue-dark { + background-color: #2779bd; + } + + .sm\:bg-blue { + background-color: #3490dc; + } + + .sm\:bg-blue-light { + background-color: #6cb2eb; + } + + .sm\:bg-blue-lighter { + background-color: #bcdefa; + } + + .sm\:bg-blue-lightest { + background-color: #eff8ff; + } + + .sm\:bg-indigo-darkest { + background-color: #191e38; + } + + .sm\:bg-indigo-darker { + background-color: #2f365f; + } + + .sm\:bg-indigo-dark { + background-color: #5661b3; + } + + .sm\:bg-indigo { + background-color: #6574cd; + } + + .sm\:bg-indigo-light { + background-color: #7886d7; + } + + .sm\:bg-indigo-lighter { + background-color: #b2b7ff; + } + + .sm\:bg-indigo-lightest { + background-color: #e6e8ff; + } + + .sm\:bg-purple-darkest { + background-color: #21183c; + } + + .sm\:bg-purple-darker { + background-color: #382b5f; + } + + .sm\:bg-purple-dark { + background-color: #794acf; + } + + .sm\:bg-purple { + background-color: #9561e2; + } + + .sm\:bg-purple-light { + background-color: #a779e9; + } + + .sm\:bg-purple-lighter { + background-color: #d6bbfc; + } + + .sm\:bg-purple-lightest { + background-color: #f3ebff; + } + + .sm\:bg-pink-darkest { + background-color: #451225; + } + + .sm\:bg-pink-darker { + background-color: #6f213f; + } + + .sm\:bg-pink-dark { + background-color: #eb5286; + } + + .sm\:bg-pink { + background-color: #f66d9b; + } + + .sm\:bg-pink-light { + background-color: #fa7ea8; + } + + .sm\:bg-pink-lighter { + background-color: #ffbbca; + } + + .sm\:bg-pink-lightest { + background-color: #ffebef; + } + + .sm\:hover\:bg-transparent:hover { + background-color: transparent; + } + + .sm\:hover\:bg-black:hover { + background-color: #22292f; + } + + .sm\:hover\:bg-grey-darkest:hover { + background-color: #3d4852; + } + + .sm\:hover\:bg-grey-darker:hover { + background-color: #606f7b; + } + + .sm\:hover\:bg-grey-dark:hover { + background-color: #8795a1; + } + + .sm\:hover\:bg-grey:hover { + background-color: #b8c2cc; + } + + .sm\:hover\:bg-grey-light:hover { + background-color: #dae1e7; + } + + .sm\:hover\:bg-grey-lighter:hover { + background-color: #f1f5f8; + } + + .sm\:hover\:bg-grey-lightest:hover { + background-color: #f8fafc; + } + + .sm\:hover\:bg-white:hover { + background-color: #fff; + } + + .sm\:hover\:bg-red-darkest:hover { + background-color: #3b0d0c; + } + + .sm\:hover\:bg-red-darker:hover { + background-color: #621b18; + } + + .sm\:hover\:bg-red-dark:hover { + background-color: #cc1f1a; + } + + .sm\:hover\:bg-red:hover { + background-color: #e3342f; + } + + .sm\:hover\:bg-red-light:hover { + background-color: #ef5753; + } + + .sm\:hover\:bg-red-lighter:hover { + background-color: #f9acaa; + } + + .sm\:hover\:bg-red-lightest:hover { + background-color: #fcebea; + } + + .sm\:hover\:bg-orange-darkest:hover { + background-color: #462a16; + } + + .sm\:hover\:bg-orange-darker:hover { + background-color: #613b1f; + } + + .sm\:hover\:bg-orange-dark:hover { + background-color: #de751f; + } + + .sm\:hover\:bg-orange:hover { + background-color: #f6993f; + } + + .sm\:hover\:bg-orange-light:hover { + background-color: #faad63; + } + + .sm\:hover\:bg-orange-lighter:hover { + background-color: #fcd9b6; + } + + .sm\:hover\:bg-orange-lightest:hover { + background-color: #fff5eb; + } + + .sm\:hover\:bg-yellow-darkest:hover { + background-color: #453411; + } + + .sm\:hover\:bg-yellow-darker:hover { + background-color: #684f1d; + } + + .sm\:hover\:bg-yellow-dark:hover { + background-color: #f2d024; + } + + .sm\:hover\:bg-yellow:hover { + background-color: #ffed4a; + } + + .sm\:hover\:bg-yellow-light:hover { + background-color: #fff382; + } + + .sm\:hover\:bg-yellow-lighter:hover { + background-color: #fff9c2; + } + + .sm\:hover\:bg-yellow-lightest:hover { + background-color: #fcfbeb; + } + + .sm\:hover\:bg-green-darkest:hover { + background-color: #0f2f21; + } + + .sm\:hover\:bg-green-darker:hover { + background-color: #1a4731; + } + + .sm\:hover\:bg-green-dark:hover { + background-color: #1f9d55; + } + + .sm\:hover\:bg-green:hover { + background-color: #38c172; + } + + .sm\:hover\:bg-green-light:hover { + background-color: #51d88a; + } + + .sm\:hover\:bg-green-lighter:hover { + background-color: #a2f5bf; + } + + .sm\:hover\:bg-green-lightest:hover { + background-color: #e3fcec; + } + + .sm\:hover\:bg-teal-darkest:hover { + background-color: #0d3331; + } + + .sm\:hover\:bg-teal-darker:hover { + background-color: #20504f; + } + + .sm\:hover\:bg-teal-dark:hover { + background-color: #38a89d; + } + + .sm\:hover\:bg-teal:hover { + background-color: #4dc0b5; + } + + .sm\:hover\:bg-teal-light:hover { + background-color: #64d5ca; + } + + .sm\:hover\:bg-teal-lighter:hover { + background-color: #a0f0ed; + } + + .sm\:hover\:bg-teal-lightest:hover { + background-color: #e8fffe; + } + + .sm\:hover\:bg-blue-darkest:hover { + background-color: #12283a; + } + + .sm\:hover\:bg-blue-darker:hover { + background-color: #1c3d5a; + } + + .sm\:hover\:bg-blue-dark:hover { + background-color: #2779bd; + } + + .sm\:hover\:bg-blue:hover { + background-color: #3490dc; + } + + .sm\:hover\:bg-blue-light:hover { + background-color: #6cb2eb; + } + + .sm\:hover\:bg-blue-lighter:hover { + background-color: #bcdefa; + } + + .sm\:hover\:bg-blue-lightest:hover { + background-color: #eff8ff; + } + + .sm\:hover\:bg-indigo-darkest:hover { + background-color: #191e38; + } + + .sm\:hover\:bg-indigo-darker:hover { + background-color: #2f365f; + } + + .sm\:hover\:bg-indigo-dark:hover { + background-color: #5661b3; + } + + .sm\:hover\:bg-indigo:hover { + background-color: #6574cd; + } + + .sm\:hover\:bg-indigo-light:hover { + background-color: #7886d7; + } + + .sm\:hover\:bg-indigo-lighter:hover { + background-color: #b2b7ff; + } + + .sm\:hover\:bg-indigo-lightest:hover { + background-color: #e6e8ff; + } + + .sm\:hover\:bg-purple-darkest:hover { + background-color: #21183c; + } + + .sm\:hover\:bg-purple-darker:hover { + background-color: #382b5f; + } + + .sm\:hover\:bg-purple-dark:hover { + background-color: #794acf; + } + + .sm\:hover\:bg-purple:hover { + background-color: #9561e2; + } + + .sm\:hover\:bg-purple-light:hover { + background-color: #a779e9; + } + + .sm\:hover\:bg-purple-lighter:hover { + background-color: #d6bbfc; + } + + .sm\:hover\:bg-purple-lightest:hover { + background-color: #f3ebff; + } + + .sm\:hover\:bg-pink-darkest:hover { + background-color: #451225; + } + + .sm\:hover\:bg-pink-darker:hover { + background-color: #6f213f; + } + + .sm\:hover\:bg-pink-dark:hover { + background-color: #eb5286; + } + + .sm\:hover\:bg-pink:hover { + background-color: #f66d9b; + } + + .sm\:hover\:bg-pink-light:hover { + background-color: #fa7ea8; + } + + .sm\:hover\:bg-pink-lighter:hover { + background-color: #ffbbca; + } + + .sm\:hover\:bg-pink-lightest:hover { + background-color: #ffebef; + } + + .sm\:focus\:bg-transparent:focus { + background-color: transparent; + } + + .sm\:focus\:bg-black:focus { + background-color: #22292f; + } + + .sm\:focus\:bg-grey-darkest:focus { + background-color: #3d4852; + } + + .sm\:focus\:bg-grey-darker:focus { + background-color: #606f7b; + } + + .sm\:focus\:bg-grey-dark:focus { + background-color: #8795a1; + } + + .sm\:focus\:bg-grey:focus { + background-color: #b8c2cc; + } + + .sm\:focus\:bg-grey-light:focus { + background-color: #dae1e7; + } + + .sm\:focus\:bg-grey-lighter:focus { + background-color: #f1f5f8; + } + + .sm\:focus\:bg-grey-lightest:focus { + background-color: #f8fafc; + } + + .sm\:focus\:bg-white:focus { + background-color: #fff; + } + + .sm\:focus\:bg-red-darkest:focus { + background-color: #3b0d0c; + } + + .sm\:focus\:bg-red-darker:focus { + background-color: #621b18; + } + + .sm\:focus\:bg-red-dark:focus { + background-color: #cc1f1a; + } + + .sm\:focus\:bg-red:focus { + background-color: #e3342f; + } + + .sm\:focus\:bg-red-light:focus { + background-color: #ef5753; + } + + .sm\:focus\:bg-red-lighter:focus { + background-color: #f9acaa; + } + + .sm\:focus\:bg-red-lightest:focus { + background-color: #fcebea; + } + + .sm\:focus\:bg-orange-darkest:focus { + background-color: #462a16; + } + + .sm\:focus\:bg-orange-darker:focus { + background-color: #613b1f; + } + + .sm\:focus\:bg-orange-dark:focus { + background-color: #de751f; + } + + .sm\:focus\:bg-orange:focus { + background-color: #f6993f; + } + + .sm\:focus\:bg-orange-light:focus { + background-color: #faad63; + } + + .sm\:focus\:bg-orange-lighter:focus { + background-color: #fcd9b6; + } + + .sm\:focus\:bg-orange-lightest:focus { + background-color: #fff5eb; + } + + .sm\:focus\:bg-yellow-darkest:focus { + background-color: #453411; + } + + .sm\:focus\:bg-yellow-darker:focus { + background-color: #684f1d; + } + + .sm\:focus\:bg-yellow-dark:focus { + background-color: #f2d024; + } + + .sm\:focus\:bg-yellow:focus { + background-color: #ffed4a; + } + + .sm\:focus\:bg-yellow-light:focus { + background-color: #fff382; + } + + .sm\:focus\:bg-yellow-lighter:focus { + background-color: #fff9c2; + } + + .sm\:focus\:bg-yellow-lightest:focus { + background-color: #fcfbeb; + } + + .sm\:focus\:bg-green-darkest:focus { + background-color: #0f2f21; + } + + .sm\:focus\:bg-green-darker:focus { + background-color: #1a4731; + } + + .sm\:focus\:bg-green-dark:focus { + background-color: #1f9d55; + } + + .sm\:focus\:bg-green:focus { + background-color: #38c172; + } + + .sm\:focus\:bg-green-light:focus { + background-color: #51d88a; + } + + .sm\:focus\:bg-green-lighter:focus { + background-color: #a2f5bf; + } + + .sm\:focus\:bg-green-lightest:focus { + background-color: #e3fcec; + } + + .sm\:focus\:bg-teal-darkest:focus { + background-color: #0d3331; + } + + .sm\:focus\:bg-teal-darker:focus { + background-color: #20504f; + } + + .sm\:focus\:bg-teal-dark:focus { + background-color: #38a89d; + } + + .sm\:focus\:bg-teal:focus { + background-color: #4dc0b5; + } + + .sm\:focus\:bg-teal-light:focus { + background-color: #64d5ca; + } + + .sm\:focus\:bg-teal-lighter:focus { + background-color: #a0f0ed; + } + + .sm\:focus\:bg-teal-lightest:focus { + background-color: #e8fffe; + } + + .sm\:focus\:bg-blue-darkest:focus { + background-color: #12283a; + } + + .sm\:focus\:bg-blue-darker:focus { + background-color: #1c3d5a; + } + + .sm\:focus\:bg-blue-dark:focus { + background-color: #2779bd; + } + + .sm\:focus\:bg-blue:focus { + background-color: #3490dc; + } + + .sm\:focus\:bg-blue-light:focus { + background-color: #6cb2eb; + } + + .sm\:focus\:bg-blue-lighter:focus { + background-color: #bcdefa; + } + + .sm\:focus\:bg-blue-lightest:focus { + background-color: #eff8ff; + } + + .sm\:focus\:bg-indigo-darkest:focus { + background-color: #191e38; + } + + .sm\:focus\:bg-indigo-darker:focus { + background-color: #2f365f; + } + + .sm\:focus\:bg-indigo-dark:focus { + background-color: #5661b3; + } + + .sm\:focus\:bg-indigo:focus { + background-color: #6574cd; + } + + .sm\:focus\:bg-indigo-light:focus { + background-color: #7886d7; + } + + .sm\:focus\:bg-indigo-lighter:focus { + background-color: #b2b7ff; + } + + .sm\:focus\:bg-indigo-lightest:focus { + background-color: #e6e8ff; + } + + .sm\:focus\:bg-purple-darkest:focus { + background-color: #21183c; + } + + .sm\:focus\:bg-purple-darker:focus { + background-color: #382b5f; + } + + .sm\:focus\:bg-purple-dark:focus { + background-color: #794acf; + } + + .sm\:focus\:bg-purple:focus { + background-color: #9561e2; + } + + .sm\:focus\:bg-purple-light:focus { + background-color: #a779e9; + } + + .sm\:focus\:bg-purple-lighter:focus { + background-color: #d6bbfc; + } + + .sm\:focus\:bg-purple-lightest:focus { + background-color: #f3ebff; + } + + .sm\:focus\:bg-pink-darkest:focus { + background-color: #451225; + } + + .sm\:focus\:bg-pink-darker:focus { + background-color: #6f213f; + } + + .sm\:focus\:bg-pink-dark:focus { + background-color: #eb5286; + } + + .sm\:focus\:bg-pink:focus { + background-color: #f66d9b; + } + + .sm\:focus\:bg-pink-light:focus { + background-color: #fa7ea8; + } + + .sm\:focus\:bg-pink-lighter:focus { + background-color: #ffbbca; + } + + .sm\:focus\:bg-pink-lightest:focus { + background-color: #ffebef; + } + + .sm\:bg-bottom { + background-position: bottom; + } + + .sm\:bg-center { + background-position: center; + } + + .sm\:bg-left { + background-position: left; + } + + .sm\:bg-left-bottom { + background-position: left bottom; + } + + .sm\:bg-left-top { + background-position: left top; + } + + .sm\:bg-right { + background-position: right; + } + + .sm\:bg-right-bottom { + background-position: right bottom; + } + + .sm\:bg-right-top { + background-position: right top; + } + + .sm\:bg-top { + background-position: top; + } + + .sm\:bg-repeat { + background-repeat: repeat; + } + + .sm\:bg-no-repeat { + background-repeat: no-repeat; + } + + .sm\:bg-repeat-x { + background-repeat: repeat-x; + } + + .sm\:bg-repeat-y { + background-repeat: repeat-y; + } + + .sm\:bg-auto { + background-size: auto; + } + + .sm\:bg-cover { + background-size: cover; + } + + .sm\:bg-contain { + background-size: contain; + } + + .sm\:border-transparent { + border-color: transparent; + } + + .sm\:border-black { + border-color: #22292f; + } + + .sm\:border-grey-darkest { + border-color: #3d4852; + } + + .sm\:border-grey-darker { + border-color: #606f7b; + } + + .sm\:border-grey-dark { + border-color: #8795a1; + } + + .sm\:border-grey { + border-color: #b8c2cc; + } + + .sm\:border-grey-light { + border-color: #dae1e7; + } + + .sm\:border-grey-lighter { + border-color: #f1f5f8; + } + + .sm\:border-grey-lightest { + border-color: #f8fafc; + } + + .sm\:border-white { + border-color: #fff; + } + + .sm\:border-red-darkest { + border-color: #3b0d0c; + } + + .sm\:border-red-darker { + border-color: #621b18; + } + + .sm\:border-red-dark { + border-color: #cc1f1a; + } + + .sm\:border-red { + border-color: #e3342f; + } + + .sm\:border-red-light { + border-color: #ef5753; + } + + .sm\:border-red-lighter { + border-color: #f9acaa; + } + + .sm\:border-red-lightest { + border-color: #fcebea; + } + + .sm\:border-orange-darkest { + border-color: #462a16; + } + + .sm\:border-orange-darker { + border-color: #613b1f; + } + + .sm\:border-orange-dark { + border-color: #de751f; + } + + .sm\:border-orange { + border-color: #f6993f; + } + + .sm\:border-orange-light { + border-color: #faad63; + } + + .sm\:border-orange-lighter { + border-color: #fcd9b6; + } + + .sm\:border-orange-lightest { + border-color: #fff5eb; + } + + .sm\:border-yellow-darkest { + border-color: #453411; + } + + .sm\:border-yellow-darker { + border-color: #684f1d; + } + + .sm\:border-yellow-dark { + border-color: #f2d024; + } + + .sm\:border-yellow { + border-color: #ffed4a; + } + + .sm\:border-yellow-light { + border-color: #fff382; + } + + .sm\:border-yellow-lighter { + border-color: #fff9c2; + } + + .sm\:border-yellow-lightest { + border-color: #fcfbeb; + } + + .sm\:border-green-darkest { + border-color: #0f2f21; + } + + .sm\:border-green-darker { + border-color: #1a4731; + } + + .sm\:border-green-dark { + border-color: #1f9d55; + } + + .sm\:border-green { + border-color: #38c172; + } + + .sm\:border-green-light { + border-color: #51d88a; + } + + .sm\:border-green-lighter { + border-color: #a2f5bf; + } + + .sm\:border-green-lightest { + border-color: #e3fcec; + } + + .sm\:border-teal-darkest { + border-color: #0d3331; + } + + .sm\:border-teal-darker { + border-color: #20504f; + } + + .sm\:border-teal-dark { + border-color: #38a89d; + } + + .sm\:border-teal { + border-color: #4dc0b5; + } + + .sm\:border-teal-light { + border-color: #64d5ca; + } + + .sm\:border-teal-lighter { + border-color: #a0f0ed; + } + + .sm\:border-teal-lightest { + border-color: #e8fffe; + } + + .sm\:border-blue-darkest { + border-color: #12283a; + } + + .sm\:border-blue-darker { + border-color: #1c3d5a; + } + + .sm\:border-blue-dark { + border-color: #2779bd; + } + + .sm\:border-blue { + border-color: #3490dc; + } + + .sm\:border-blue-light { + border-color: #6cb2eb; + } + + .sm\:border-blue-lighter { + border-color: #bcdefa; + } + + .sm\:border-blue-lightest { + border-color: #eff8ff; + } + + .sm\:border-indigo-darkest { + border-color: #191e38; + } + + .sm\:border-indigo-darker { + border-color: #2f365f; + } + + .sm\:border-indigo-dark { + border-color: #5661b3; + } + + .sm\:border-indigo { + border-color: #6574cd; + } + + .sm\:border-indigo-light { + border-color: #7886d7; + } + + .sm\:border-indigo-lighter { + border-color: #b2b7ff; + } + + .sm\:border-indigo-lightest { + border-color: #e6e8ff; + } + + .sm\:border-purple-darkest { + border-color: #21183c; + } + + .sm\:border-purple-darker { + border-color: #382b5f; + } + + .sm\:border-purple-dark { + border-color: #794acf; + } + + .sm\:border-purple { + border-color: #9561e2; + } + + .sm\:border-purple-light { + border-color: #a779e9; + } + + .sm\:border-purple-lighter { + border-color: #d6bbfc; + } + + .sm\:border-purple-lightest { + border-color: #f3ebff; + } + + .sm\:border-pink-darkest { + border-color: #451225; + } + + .sm\:border-pink-darker { + border-color: #6f213f; + } + + .sm\:border-pink-dark { + border-color: #eb5286; + } + + .sm\:border-pink { + border-color: #f66d9b; + } + + .sm\:border-pink-light { + border-color: #fa7ea8; + } + + .sm\:border-pink-lighter { + border-color: #ffbbca; + } + + .sm\:border-pink-lightest { + border-color: #ffebef; + } + + .sm\:hover\:border-transparent:hover { + border-color: transparent; + } + + .sm\:hover\:border-black:hover { + border-color: #22292f; + } + + .sm\:hover\:border-grey-darkest:hover { + border-color: #3d4852; + } + + .sm\:hover\:border-grey-darker:hover { + border-color: #606f7b; + } + + .sm\:hover\:border-grey-dark:hover { + border-color: #8795a1; + } + + .sm\:hover\:border-grey:hover { + border-color: #b8c2cc; + } + + .sm\:hover\:border-grey-light:hover { + border-color: #dae1e7; + } + + .sm\:hover\:border-grey-lighter:hover { + border-color: #f1f5f8; + } + + .sm\:hover\:border-grey-lightest:hover { + border-color: #f8fafc; + } + + .sm\:hover\:border-white:hover { + border-color: #fff; + } + + .sm\:hover\:border-red-darkest:hover { + border-color: #3b0d0c; + } + + .sm\:hover\:border-red-darker:hover { + border-color: #621b18; + } + + .sm\:hover\:border-red-dark:hover { + border-color: #cc1f1a; + } + + .sm\:hover\:border-red:hover { + border-color: #e3342f; + } + + .sm\:hover\:border-red-light:hover { + border-color: #ef5753; + } + + .sm\:hover\:border-red-lighter:hover { + border-color: #f9acaa; + } + + .sm\:hover\:border-red-lightest:hover { + border-color: #fcebea; + } + + .sm\:hover\:border-orange-darkest:hover { + border-color: #462a16; + } + + .sm\:hover\:border-orange-darker:hover { + border-color: #613b1f; + } + + .sm\:hover\:border-orange-dark:hover { + border-color: #de751f; + } + + .sm\:hover\:border-orange:hover { + border-color: #f6993f; + } + + .sm\:hover\:border-orange-light:hover { + border-color: #faad63; + } + + .sm\:hover\:border-orange-lighter:hover { + border-color: #fcd9b6; + } + + .sm\:hover\:border-orange-lightest:hover { + border-color: #fff5eb; + } + + .sm\:hover\:border-yellow-darkest:hover { + border-color: #453411; + } + + .sm\:hover\:border-yellow-darker:hover { + border-color: #684f1d; + } + + .sm\:hover\:border-yellow-dark:hover { + border-color: #f2d024; + } + + .sm\:hover\:border-yellow:hover { + border-color: #ffed4a; + } + + .sm\:hover\:border-yellow-light:hover { + border-color: #fff382; + } + + .sm\:hover\:border-yellow-lighter:hover { + border-color: #fff9c2; + } + + .sm\:hover\:border-yellow-lightest:hover { + border-color: #fcfbeb; + } + + .sm\:hover\:border-green-darkest:hover { + border-color: #0f2f21; + } + + .sm\:hover\:border-green-darker:hover { + border-color: #1a4731; + } + + .sm\:hover\:border-green-dark:hover { + border-color: #1f9d55; + } + + .sm\:hover\:border-green:hover { + border-color: #38c172; + } + + .sm\:hover\:border-green-light:hover { + border-color: #51d88a; + } + + .sm\:hover\:border-green-lighter:hover { + border-color: #a2f5bf; + } + + .sm\:hover\:border-green-lightest:hover { + border-color: #e3fcec; + } + + .sm\:hover\:border-teal-darkest:hover { + border-color: #0d3331; + } + + .sm\:hover\:border-teal-darker:hover { + border-color: #20504f; + } + + .sm\:hover\:border-teal-dark:hover { + border-color: #38a89d; + } + + .sm\:hover\:border-teal:hover { + border-color: #4dc0b5; + } + + .sm\:hover\:border-teal-light:hover { + border-color: #64d5ca; + } + + .sm\:hover\:border-teal-lighter:hover { + border-color: #a0f0ed; + } + + .sm\:hover\:border-teal-lightest:hover { + border-color: #e8fffe; + } + + .sm\:hover\:border-blue-darkest:hover { + border-color: #12283a; + } + + .sm\:hover\:border-blue-darker:hover { + border-color: #1c3d5a; + } + + .sm\:hover\:border-blue-dark:hover { + border-color: #2779bd; + } + + .sm\:hover\:border-blue:hover { + border-color: #3490dc; + } + + .sm\:hover\:border-blue-light:hover { + border-color: #6cb2eb; + } + + .sm\:hover\:border-blue-lighter:hover { + border-color: #bcdefa; + } + + .sm\:hover\:border-blue-lightest:hover { + border-color: #eff8ff; + } + + .sm\:hover\:border-indigo-darkest:hover { + border-color: #191e38; + } + + .sm\:hover\:border-indigo-darker:hover { + border-color: #2f365f; + } + + .sm\:hover\:border-indigo-dark:hover { + border-color: #5661b3; + } + + .sm\:hover\:border-indigo:hover { + border-color: #6574cd; + } + + .sm\:hover\:border-indigo-light:hover { + border-color: #7886d7; + } + + .sm\:hover\:border-indigo-lighter:hover { + border-color: #b2b7ff; + } + + .sm\:hover\:border-indigo-lightest:hover { + border-color: #e6e8ff; + } + + .sm\:hover\:border-purple-darkest:hover { + border-color: #21183c; + } + + .sm\:hover\:border-purple-darker:hover { + border-color: #382b5f; + } + + .sm\:hover\:border-purple-dark:hover { + border-color: #794acf; + } + + .sm\:hover\:border-purple:hover { + border-color: #9561e2; + } + + .sm\:hover\:border-purple-light:hover { + border-color: #a779e9; + } + + .sm\:hover\:border-purple-lighter:hover { + border-color: #d6bbfc; + } + + .sm\:hover\:border-purple-lightest:hover { + border-color: #f3ebff; + } + + .sm\:hover\:border-pink-darkest:hover { + border-color: #451225; + } + + .sm\:hover\:border-pink-darker:hover { + border-color: #6f213f; + } + + .sm\:hover\:border-pink-dark:hover { + border-color: #eb5286; + } + + .sm\:hover\:border-pink:hover { + border-color: #f66d9b; + } + + .sm\:hover\:border-pink-light:hover { + border-color: #fa7ea8; + } + + .sm\:hover\:border-pink-lighter:hover { + border-color: #ffbbca; + } + + .sm\:hover\:border-pink-lightest:hover { + border-color: #ffebef; + } + + .sm\:focus\:border-transparent:focus { + border-color: transparent; + } + + .sm\:focus\:border-black:focus { + border-color: #22292f; + } + + .sm\:focus\:border-grey-darkest:focus { + border-color: #3d4852; + } + + .sm\:focus\:border-grey-darker:focus { + border-color: #606f7b; + } + + .sm\:focus\:border-grey-dark:focus { + border-color: #8795a1; + } + + .sm\:focus\:border-grey:focus { + border-color: #b8c2cc; + } + + .sm\:focus\:border-grey-light:focus { + border-color: #dae1e7; + } + + .sm\:focus\:border-grey-lighter:focus { + border-color: #f1f5f8; + } + + .sm\:focus\:border-grey-lightest:focus { + border-color: #f8fafc; + } + + .sm\:focus\:border-white:focus { + border-color: #fff; + } + + .sm\:focus\:border-red-darkest:focus { + border-color: #3b0d0c; + } + + .sm\:focus\:border-red-darker:focus { + border-color: #621b18; + } + + .sm\:focus\:border-red-dark:focus { + border-color: #cc1f1a; + } + + .sm\:focus\:border-red:focus { + border-color: #e3342f; + } + + .sm\:focus\:border-red-light:focus { + border-color: #ef5753; + } + + .sm\:focus\:border-red-lighter:focus { + border-color: #f9acaa; + } + + .sm\:focus\:border-red-lightest:focus { + border-color: #fcebea; + } + + .sm\:focus\:border-orange-darkest:focus { + border-color: #462a16; + } + + .sm\:focus\:border-orange-darker:focus { + border-color: #613b1f; + } + + .sm\:focus\:border-orange-dark:focus { + border-color: #de751f; + } + + .sm\:focus\:border-orange:focus { + border-color: #f6993f; + } + + .sm\:focus\:border-orange-light:focus { + border-color: #faad63; + } + + .sm\:focus\:border-orange-lighter:focus { + border-color: #fcd9b6; + } + + .sm\:focus\:border-orange-lightest:focus { + border-color: #fff5eb; + } + + .sm\:focus\:border-yellow-darkest:focus { + border-color: #453411; + } + + .sm\:focus\:border-yellow-darker:focus { + border-color: #684f1d; + } + + .sm\:focus\:border-yellow-dark:focus { + border-color: #f2d024; + } + + .sm\:focus\:border-yellow:focus { + border-color: #ffed4a; + } + + .sm\:focus\:border-yellow-light:focus { + border-color: #fff382; + } + + .sm\:focus\:border-yellow-lighter:focus { + border-color: #fff9c2; + } + + .sm\:focus\:border-yellow-lightest:focus { + border-color: #fcfbeb; + } + + .sm\:focus\:border-green-darkest:focus { + border-color: #0f2f21; + } + + .sm\:focus\:border-green-darker:focus { + border-color: #1a4731; + } + + .sm\:focus\:border-green-dark:focus { + border-color: #1f9d55; + } + + .sm\:focus\:border-green:focus { + border-color: #38c172; + } + + .sm\:focus\:border-green-light:focus { + border-color: #51d88a; + } + + .sm\:focus\:border-green-lighter:focus { + border-color: #a2f5bf; + } + + .sm\:focus\:border-green-lightest:focus { + border-color: #e3fcec; + } + + .sm\:focus\:border-teal-darkest:focus { + border-color: #0d3331; + } + + .sm\:focus\:border-teal-darker:focus { + border-color: #20504f; + } + + .sm\:focus\:border-teal-dark:focus { + border-color: #38a89d; + } + + .sm\:focus\:border-teal:focus { + border-color: #4dc0b5; + } + + .sm\:focus\:border-teal-light:focus { + border-color: #64d5ca; + } + + .sm\:focus\:border-teal-lighter:focus { + border-color: #a0f0ed; + } + + .sm\:focus\:border-teal-lightest:focus { + border-color: #e8fffe; + } + + .sm\:focus\:border-blue-darkest:focus { + border-color: #12283a; + } + + .sm\:focus\:border-blue-darker:focus { + border-color: #1c3d5a; + } + + .sm\:focus\:border-blue-dark:focus { + border-color: #2779bd; + } + + .sm\:focus\:border-blue:focus { + border-color: #3490dc; + } + + .sm\:focus\:border-blue-light:focus { + border-color: #6cb2eb; + } + + .sm\:focus\:border-blue-lighter:focus { + border-color: #bcdefa; + } + + .sm\:focus\:border-blue-lightest:focus { + border-color: #eff8ff; + } + + .sm\:focus\:border-indigo-darkest:focus { + border-color: #191e38; + } + + .sm\:focus\:border-indigo-darker:focus { + border-color: #2f365f; + } + + .sm\:focus\:border-indigo-dark:focus { + border-color: #5661b3; + } + + .sm\:focus\:border-indigo:focus { + border-color: #6574cd; + } + + .sm\:focus\:border-indigo-light:focus { + border-color: #7886d7; + } + + .sm\:focus\:border-indigo-lighter:focus { + border-color: #b2b7ff; + } + + .sm\:focus\:border-indigo-lightest:focus { + border-color: #e6e8ff; + } + + .sm\:focus\:border-purple-darkest:focus { + border-color: #21183c; + } + + .sm\:focus\:border-purple-darker:focus { + border-color: #382b5f; + } + + .sm\:focus\:border-purple-dark:focus { + border-color: #794acf; + } + + .sm\:focus\:border-purple:focus { + border-color: #9561e2; + } + + .sm\:focus\:border-purple-light:focus { + border-color: #a779e9; + } + + .sm\:focus\:border-purple-lighter:focus { + border-color: #d6bbfc; + } + + .sm\:focus\:border-purple-lightest:focus { + border-color: #f3ebff; + } + + .sm\:focus\:border-pink-darkest:focus { + border-color: #451225; + } + + .sm\:focus\:border-pink-darker:focus { + border-color: #6f213f; + } + + .sm\:focus\:border-pink-dark:focus { + border-color: #eb5286; + } + + .sm\:focus\:border-pink:focus { + border-color: #f66d9b; + } + + .sm\:focus\:border-pink-light:focus { + border-color: #fa7ea8; + } + + .sm\:focus\:border-pink-lighter:focus { + border-color: #ffbbca; + } + + .sm\:focus\:border-pink-lightest:focus { + border-color: #ffebef; + } + + .sm\:rounded-none { + border-radius: 0; + } + + .sm\:rounded-sm { + border-radius: .125rem; + } + + .sm\:rounded { + border-radius: .25rem; + } + + .sm\:rounded-lg { + border-radius: .5rem; + } + + .sm\:rounded-full { + border-radius: 9999px; + } + + .sm\:rounded-t-none { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + + .sm\:rounded-r-none { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + + .sm\:rounded-b-none { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + } + + .sm\:rounded-l-none { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + + .sm\:rounded-t-sm { + border-top-left-radius: .125rem; + border-top-right-radius: .125rem; + } + + .sm\:rounded-r-sm { + border-top-right-radius: .125rem; + border-bottom-right-radius: .125rem; + } + + .sm\:rounded-b-sm { + border-bottom-right-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .sm\:rounded-l-sm { + border-top-left-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .sm\:rounded-t { + border-top-left-radius: .25rem; + border-top-right-radius: .25rem; + } + + .sm\:rounded-r { + border-top-right-radius: .25rem; + border-bottom-right-radius: .25rem; + } + + .sm\:rounded-b { + border-bottom-right-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .sm\:rounded-l { + border-top-left-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .sm\:rounded-t-lg { + border-top-left-radius: .5rem; + border-top-right-radius: .5rem; + } + + .sm\:rounded-r-lg { + border-top-right-radius: .5rem; + border-bottom-right-radius: .5rem; + } + + .sm\:rounded-b-lg { + border-bottom-right-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .sm\:rounded-l-lg { + border-top-left-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .sm\:rounded-t-full { + border-top-left-radius: 9999px; + border-top-right-radius: 9999px; + } + + .sm\:rounded-r-full { + border-top-right-radius: 9999px; + border-bottom-right-radius: 9999px; + } + + .sm\:rounded-b-full { + border-bottom-right-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .sm\:rounded-l-full { + border-top-left-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .sm\:rounded-tl-none { + border-top-left-radius: 0; + } + + .sm\:rounded-tr-none { + border-top-right-radius: 0; + } + + .sm\:rounded-br-none { + border-bottom-right-radius: 0; + } + + .sm\:rounded-bl-none { + border-bottom-left-radius: 0; + } + + .sm\:rounded-tl-sm { + border-top-left-radius: .125rem; + } + + .sm\:rounded-tr-sm { + border-top-right-radius: .125rem; + } + + .sm\:rounded-br-sm { + border-bottom-right-radius: .125rem; + } + + .sm\:rounded-bl-sm { + border-bottom-left-radius: .125rem; + } + + .sm\:rounded-tl { + border-top-left-radius: .25rem; + } + + .sm\:rounded-tr { + border-top-right-radius: .25rem; + } + + .sm\:rounded-br { + border-bottom-right-radius: .25rem; + } + + .sm\:rounded-bl { + border-bottom-left-radius: .25rem; + } + + .sm\:rounded-tl-lg { + border-top-left-radius: .5rem; + } + + .sm\:rounded-tr-lg { + border-top-right-radius: .5rem; + } + + .sm\:rounded-br-lg { + border-bottom-right-radius: .5rem; + } + + .sm\:rounded-bl-lg { + border-bottom-left-radius: .5rem; + } + + .sm\:rounded-tl-full { + border-top-left-radius: 9999px; + } + + .sm\:rounded-tr-full { + border-top-right-radius: 9999px; + } + + .sm\:rounded-br-full { + border-bottom-right-radius: 9999px; + } + + .sm\:rounded-bl-full { + border-bottom-left-radius: 9999px; + } + + .sm\:border-solid { + border-style: solid; + } + + .sm\:border-dashed { + border-style: dashed; + } + + .sm\:border-dotted { + border-style: dotted; + } + + .sm\:border-none { + border-style: none; + } + + .sm\:border-0 { + border-width: 0; + } + + .sm\:border-2 { + border-width: 2px; + } + + .sm\:border-4 { + border-width: 4px; + } + + .sm\:border-8 { + border-width: 8px; + } + + .sm\:border { + border-width: 1px; + } + + .sm\:border-t-0 { + border-top-width: 0; + } + + .sm\:border-r-0 { + border-right-width: 0; + } + + .sm\:border-b-0 { + border-bottom-width: 0; + } + + .sm\:border-l-0 { + border-left-width: 0; + } + + .sm\:border-t-2 { + border-top-width: 2px; + } + + .sm\:border-r-2 { + border-right-width: 2px; + } + + .sm\:border-b-2 { + border-bottom-width: 2px; + } + + .sm\:border-l-2 { + border-left-width: 2px; + } + + .sm\:border-t-4 { + border-top-width: 4px; + } + + .sm\:border-r-4 { + border-right-width: 4px; + } + + .sm\:border-b-4 { + border-bottom-width: 4px; + } + + .sm\:border-l-4 { + border-left-width: 4px; + } + + .sm\:border-t-8 { + border-top-width: 8px; + } + + .sm\:border-r-8 { + border-right-width: 8px; + } + + .sm\:border-b-8 { + border-bottom-width: 8px; + } + + .sm\:border-l-8 { + border-left-width: 8px; + } + + .sm\:border-t { + border-top-width: 1px; + } + + .sm\:border-r { + border-right-width: 1px; + } + + .sm\:border-b { + border-bottom-width: 1px; + } + + .sm\:border-l { + border-left-width: 1px; + } + + .sm\:cursor-auto { + cursor: auto; + } + + .sm\:cursor-default { + cursor: default; + } + + .sm\:cursor-pointer { + cursor: pointer; + } + + .sm\:cursor-wait { + cursor: wait; + } + + .sm\:cursor-move { + cursor: move; + } + + .sm\:cursor-not-allowed { + cursor: not-allowed; + } + + .sm\:block { + display: block; + } + + .sm\:inline-block { + display: inline-block; + } + + .sm\:inline { + display: inline; + } + + .sm\:table { + display: table; + } + + .sm\:table-row { + display: table-row; + } + + .sm\:table-cell { + display: table-cell; + } + + .sm\:hidden { + display: none; + } + + .sm\:flex { + display: flex; + } + + .sm\:inline-flex { + display: inline-flex; + } + + .sm\:flex-row { + flex-direction: row; + } + + .sm\:flex-row-reverse { + flex-direction: row-reverse; + } + + .sm\:flex-col { + flex-direction: column; + } + + .sm\:flex-col-reverse { + flex-direction: column-reverse; + } + + .sm\:flex-wrap { + flex-wrap: wrap; + } + + .sm\:flex-wrap-reverse { + flex-wrap: wrap-reverse; + } + + .sm\:flex-no-wrap { + flex-wrap: nowrap; + } + + .sm\:items-start { + align-items: flex-start; + } + + .sm\:items-end { + align-items: flex-end; + } + + .sm\:items-center { + align-items: center; + } + + .sm\:items-baseline { + align-items: baseline; + } + + .sm\:items-stretch { + align-items: stretch; + } + + .sm\:self-auto { + align-self: auto; + } + + .sm\:self-start { + align-self: flex-start; + } + + .sm\:self-end { + align-self: flex-end; + } + + .sm\:self-center { + align-self: center; + } + + .sm\:self-stretch { + align-self: stretch; + } + + .sm\:justify-start { + justify-content: flex-start; + } + + .sm\:justify-end { + justify-content: flex-end; + } + + .sm\:justify-center { + justify-content: center; + } + + .sm\:justify-between { + justify-content: space-between; + } + + .sm\:justify-around { + justify-content: space-around; + } + + .sm\:content-center { + align-content: center; + } + + .sm\:content-start { + align-content: flex-start; + } + + .sm\:content-end { + align-content: flex-end; + } + + .sm\:content-between { + align-content: space-between; + } + + .sm\:content-around { + align-content: space-around; + } + + .sm\:flex-1 { + flex: 1 1 0%; + } + + .sm\:flex-auto { + flex: 1 1 auto; + } + + .sm\:flex-initial { + flex: 0 1 auto; + } + + .sm\:flex-none { + flex: none; + } + + .sm\:flex-grow { + flex-grow: 1; + } + + .sm\:flex-shrink { + flex-shrink: 1; + } + + .sm\:flex-no-grow { + flex-grow: 0; + } + + .sm\:flex-no-shrink { + flex-shrink: 0; + } + + .sm\:float-right { + float: right; + } + + .sm\:float-left { + float: left; + } + + .sm\:float-none { + float: none; + } + + .sm\:clearfix:after { + content: ""; + display: table; + clear: both; + } + + .sm\:font-sans { + font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; + } + + .sm\:font-serif { + font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; + } + + .sm\:font-mono { + font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; + } + + .sm\:font-hairline { + font-weight: 100; + } + + .sm\:font-thin { + font-weight: 200; + } + + .sm\:font-light { + font-weight: 300; + } + + .sm\:font-normal { + font-weight: 400; + } + + .sm\:font-medium { + font-weight: 500; + } + + .sm\:font-semibold { + font-weight: 600; + } + + .sm\:font-bold { + font-weight: 700; + } + + .sm\:font-extrabold { + font-weight: 800; + } + + .sm\:font-black { + font-weight: 900; + } + + .sm\:hover\:font-hairline:hover { + font-weight: 100; + } + + .sm\:hover\:font-thin:hover { + font-weight: 200; + } + + .sm\:hover\:font-light:hover { + font-weight: 300; + } + + .sm\:hover\:font-normal:hover { + font-weight: 400; + } + + .sm\:hover\:font-medium:hover { + font-weight: 500; + } + + .sm\:hover\:font-semibold:hover { + font-weight: 600; + } + + .sm\:hover\:font-bold:hover { + font-weight: 700; + } + + .sm\:hover\:font-extrabold:hover { + font-weight: 800; + } + + .sm\:hover\:font-black:hover { + font-weight: 900; + } + + .sm\:focus\:font-hairline:focus { + font-weight: 100; + } + + .sm\:focus\:font-thin:focus { + font-weight: 200; + } + + .sm\:focus\:font-light:focus { + font-weight: 300; + } + + .sm\:focus\:font-normal:focus { + font-weight: 400; + } + + .sm\:focus\:font-medium:focus { + font-weight: 500; + } + + .sm\:focus\:font-semibold:focus { + font-weight: 600; + } + + .sm\:focus\:font-bold:focus { + font-weight: 700; + } + + .sm\:focus\:font-extrabold:focus { + font-weight: 800; + } + + .sm\:focus\:font-black:focus { + font-weight: 900; + } + + .sm\:h-1 { + height: .25rem; + } + + .sm\:h-2 { + height: .5rem; + } + + .sm\:h-3 { + height: .75rem; + } + + .sm\:h-4 { + height: 1rem; + } + + .sm\:h-5 { + height: 1.25rem; + } + + .sm\:h-6 { + height: 1.5rem; + } + + .sm\:h-8 { + height: 2rem; + } + + .sm\:h-10 { + height: 2.5rem; + } + + .sm\:h-12 { + height: 3rem; + } + + .sm\:h-16 { + height: 4rem; + } + + .sm\:h-24 { + height: 6rem; + } + + .sm\:h-32 { + height: 8rem; + } + + .sm\:h-48 { + height: 12rem; + } + + .sm\:h-64 { + height: 16rem; + } + + .sm\:h-auto { + height: auto; + } + + .sm\:h-px { + height: 1px; + } + + .sm\:h-full { + height: 100%; + } + + .sm\:h-screen { + height: 100vh; + } + + .sm\:leading-none { + line-height: 1; + } + + .sm\:leading-tight { + line-height: 1.25; + } + + .sm\:leading-normal { + line-height: 1.5; + } + + .sm\:leading-loose { + line-height: 2; + } + + .sm\:m-0 { + margin: 0; + } + + .sm\:m-1 { + margin: .25rem; + } + + .sm\:m-2 { + margin: .5rem; + } + + .sm\:m-3 { + margin: .75rem; + } + + .sm\:m-4 { + margin: 1rem; + } + + .sm\:m-5 { + margin: 1.25rem; + } + + .sm\:m-6 { + margin: 1.5rem; + } + + .sm\:m-8 { + margin: 2rem; + } + + .sm\:m-10 { + margin: 2.5rem; + } + + .sm\:m-12 { + margin: 3rem; + } + + .sm\:m-16 { + margin: 4rem; + } + + .sm\:m-20 { + margin: 5rem; + } + + .sm\:m-24 { + margin: 6rem; + } + + .sm\:m-32 { + margin: 8rem; + } + + .sm\:m-auto { + margin: auto; + } + + .sm\:m-px { + margin: 1px; + } + + .sm\:my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .sm\:mx-0 { + margin-left: 0; + margin-right: 0; + } + + .sm\:my-1 { + margin-top: .25rem; + margin-bottom: .25rem; + } + + .sm\:mx-1 { + margin-left: .25rem; + margin-right: .25rem; + } + + .sm\:my-2 { + margin-top: .5rem; + margin-bottom: .5rem; + } + + .sm\:mx-2 { + margin-left: .5rem; + margin-right: .5rem; + } + + .sm\:my-3 { + margin-top: .75rem; + margin-bottom: .75rem; + } + + .sm\:mx-3 { + margin-left: .75rem; + margin-right: .75rem; + } + + .sm\:my-4 { + margin-top: 1rem; + margin-bottom: 1rem; + } + + .sm\:mx-4 { + margin-left: 1rem; + margin-right: 1rem; + } + + .sm\:my-5 { + margin-top: 1.25rem; + margin-bottom: 1.25rem; + } + + .sm\:mx-5 { + margin-left: 1.25rem; + margin-right: 1.25rem; + } + + .sm\:my-6 { + margin-top: 1.5rem; + margin-bottom: 1.5rem; + } + + .sm\:mx-6 { + margin-left: 1.5rem; + margin-right: 1.5rem; + } + + .sm\:my-8 { + margin-top: 2rem; + margin-bottom: 2rem; + } + + .sm\:mx-8 { + margin-left: 2rem; + margin-right: 2rem; + } + + .sm\:my-10 { + margin-top: 2.5rem; + margin-bottom: 2.5rem; + } + + .sm\:mx-10 { + margin-left: 2.5rem; + margin-right: 2.5rem; + } + + .sm\:my-12 { + margin-top: 3rem; + margin-bottom: 3rem; + } + + .sm\:mx-12 { + margin-left: 3rem; + margin-right: 3rem; + } + + .sm\:my-16 { + margin-top: 4rem; + margin-bottom: 4rem; + } + + .sm\:mx-16 { + margin-left: 4rem; + margin-right: 4rem; + } + + .sm\:my-20 { + margin-top: 5rem; + margin-bottom: 5rem; + } + + .sm\:mx-20 { + margin-left: 5rem; + margin-right: 5rem; + } + + .sm\:my-24 { + margin-top: 6rem; + margin-bottom: 6rem; + } + + .sm\:mx-24 { + margin-left: 6rem; + margin-right: 6rem; + } + + .sm\:my-32 { + margin-top: 8rem; + margin-bottom: 8rem; + } + + .sm\:mx-32 { + margin-left: 8rem; + margin-right: 8rem; + } + + .sm\:my-auto { + margin-top: auto; + margin-bottom: auto; + } + + .sm\:mx-auto { + margin-left: auto; + margin-right: auto; + } + + .sm\:my-px { + margin-top: 1px; + margin-bottom: 1px; + } + + .sm\:mx-px { + margin-left: 1px; + margin-right: 1px; + } + + .sm\:mt-0 { + margin-top: 0; + } + + .sm\:mr-0 { + margin-right: 0; + } + + .sm\:mb-0 { + margin-bottom: 0; + } + + .sm\:ml-0 { + margin-left: 0; + } + + .sm\:mt-1 { + margin-top: .25rem; + } + + .sm\:mr-1 { + margin-right: .25rem; + } + + .sm\:mb-1 { + margin-bottom: .25rem; + } + + .sm\:ml-1 { + margin-left: .25rem; + } + + .sm\:mt-2 { + margin-top: .5rem; + } + + .sm\:mr-2 { + margin-right: .5rem; + } + + .sm\:mb-2 { + margin-bottom: .5rem; + } + + .sm\:ml-2 { + margin-left: .5rem; + } + + .sm\:mt-3 { + margin-top: .75rem; + } + + .sm\:mr-3 { + margin-right: .75rem; + } + + .sm\:mb-3 { + margin-bottom: .75rem; + } + + .sm\:ml-3 { + margin-left: .75rem; + } + + .sm\:mt-4 { + margin-top: 1rem; + } + + .sm\:mr-4 { + margin-right: 1rem; + } + + .sm\:mb-4 { + margin-bottom: 1rem; + } + + .sm\:ml-4 { + margin-left: 1rem; + } + + .sm\:mt-5 { + margin-top: 1.25rem; + } + + .sm\:mr-5 { + margin-right: 1.25rem; + } + + .sm\:mb-5 { + margin-bottom: 1.25rem; + } + + .sm\:ml-5 { + margin-left: 1.25rem; + } + + .sm\:mt-6 { + margin-top: 1.5rem; + } + + .sm\:mr-6 { + margin-right: 1.5rem; + } + + .sm\:mb-6 { + margin-bottom: 1.5rem; + } + + .sm\:ml-6 { + margin-left: 1.5rem; + } + + .sm\:mt-8 { + margin-top: 2rem; + } + + .sm\:mr-8 { + margin-right: 2rem; + } + + .sm\:mb-8 { + margin-bottom: 2rem; + } + + .sm\:ml-8 { + margin-left: 2rem; + } + + .sm\:mt-10 { + margin-top: 2.5rem; + } + + .sm\:mr-10 { + margin-right: 2.5rem; + } + + .sm\:mb-10 { + margin-bottom: 2.5rem; + } + + .sm\:ml-10 { + margin-left: 2.5rem; + } + + .sm\:mt-12 { + margin-top: 3rem; + } + + .sm\:mr-12 { + margin-right: 3rem; + } + + .sm\:mb-12 { + margin-bottom: 3rem; + } + + .sm\:ml-12 { + margin-left: 3rem; + } + + .sm\:mt-16 { + margin-top: 4rem; + } + + .sm\:mr-16 { + margin-right: 4rem; + } + + .sm\:mb-16 { + margin-bottom: 4rem; + } + + .sm\:ml-16 { + margin-left: 4rem; + } + + .sm\:mt-20 { + margin-top: 5rem; + } + + .sm\:mr-20 { + margin-right: 5rem; + } + + .sm\:mb-20 { + margin-bottom: 5rem; + } + + .sm\:ml-20 { + margin-left: 5rem; + } + + .sm\:mt-24 { + margin-top: 6rem; + } + + .sm\:mr-24 { + margin-right: 6rem; + } + + .sm\:mb-24 { + margin-bottom: 6rem; + } + + .sm\:ml-24 { + margin-left: 6rem; + } + + .sm\:mt-32 { + margin-top: 8rem; + } + + .sm\:mr-32 { + margin-right: 8rem; + } + + .sm\:mb-32 { + margin-bottom: 8rem; + } + + .sm\:ml-32 { + margin-left: 8rem; + } + + .sm\:mt-auto { + margin-top: auto; + } + + .sm\:mr-auto { + margin-right: auto; + } + + .sm\:mb-auto { + margin-bottom: auto; + } + + .sm\:ml-auto { + margin-left: auto; + } + + .sm\:mt-px { + margin-top: 1px; + } + + .sm\:mr-px { + margin-right: 1px; + } + + .sm\:mb-px { + margin-bottom: 1px; + } + + .sm\:ml-px { + margin-left: 1px; + } + + .sm\:max-h-full { + max-height: 100%; + } + + .sm\:max-h-screen { + max-height: 100vh; + } + + .sm\:max-w-xs { + max-width: 20rem; + } + + .sm\:max-w-sm { + max-width: 30rem; + } + + .sm\:max-w-md { + max-width: 40rem; + } + + .sm\:max-w-lg { + max-width: 50rem; + } + + .sm\:max-w-xl { + max-width: 60rem; + } + + .sm\:max-w-2xl { + max-width: 70rem; + } + + .sm\:max-w-3xl { + max-width: 80rem; + } + + .sm\:max-w-4xl { + max-width: 90rem; + } + + .sm\:max-w-5xl { + max-width: 100rem; + } + + .sm\:max-w-full { + max-width: 100%; + } + + .sm\:min-h-0 { + min-height: 0; + } + + .sm\:min-h-full { + min-height: 100%; + } + + .sm\:min-h-screen { + min-height: 100vh; + } + + .sm\:min-w-0 { + min-width: 0; + } + + .sm\:min-w-full { + min-width: 100%; + } + + .sm\:-m-0 { + margin: 0; + } + + .sm\:-m-1 { + margin: -0.25rem; + } + + .sm\:-m-2 { + margin: -0.5rem; + } + + .sm\:-m-3 { + margin: -0.75rem; + } + + .sm\:-m-4 { + margin: -1rem; + } + + .sm\:-m-5 { + margin: -1.25rem; + } + + .sm\:-m-6 { + margin: -1.5rem; + } + + .sm\:-m-8 { + margin: -2rem; + } + + .sm\:-m-10 { + margin: -2.5rem; + } + + .sm\:-m-12 { + margin: -3rem; + } + + .sm\:-m-16 { + margin: -4rem; + } + + .sm\:-m-20 { + margin: -5rem; + } + + .sm\:-m-24 { + margin: -6rem; + } + + .sm\:-m-32 { + margin: -8rem; + } + + .sm\:-m-px { + margin: -1px; + } + + .sm\:-my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .sm\:-mx-0 { + margin-left: 0; + margin-right: 0; + } + + .sm\:-my-1 { + margin-top: -0.25rem; + margin-bottom: -0.25rem; + } + + .sm\:-mx-1 { + margin-left: -0.25rem; + margin-right: -0.25rem; + } + + .sm\:-my-2 { + margin-top: -0.5rem; + margin-bottom: -0.5rem; + } + + .sm\:-mx-2 { + margin-left: -0.5rem; + margin-right: -0.5rem; + } + + .sm\:-my-3 { + margin-top: -0.75rem; + margin-bottom: -0.75rem; + } + + .sm\:-mx-3 { + margin-left: -0.75rem; + margin-right: -0.75rem; + } + + .sm\:-my-4 { + margin-top: -1rem; + margin-bottom: -1rem; + } + + .sm\:-mx-4 { + margin-left: -1rem; + margin-right: -1rem; + } + + .sm\:-my-5 { + margin-top: -1.25rem; + margin-bottom: -1.25rem; + } + + .sm\:-mx-5 { + margin-left: -1.25rem; + margin-right: -1.25rem; + } + + .sm\:-my-6 { + margin-top: -1.5rem; + margin-bottom: -1.5rem; + } + + .sm\:-mx-6 { + margin-left: -1.5rem; + margin-right: -1.5rem; + } + + .sm\:-my-8 { + margin-top: -2rem; + margin-bottom: -2rem; + } + + .sm\:-mx-8 { + margin-left: -2rem; + margin-right: -2rem; + } + + .sm\:-my-10 { + margin-top: -2.5rem; + margin-bottom: -2.5rem; + } + + .sm\:-mx-10 { + margin-left: -2.5rem; + margin-right: -2.5rem; + } + + .sm\:-my-12 { + margin-top: -3rem; + margin-bottom: -3rem; + } + + .sm\:-mx-12 { + margin-left: -3rem; + margin-right: -3rem; + } + + .sm\:-my-16 { + margin-top: -4rem; + margin-bottom: -4rem; + } + + .sm\:-mx-16 { + margin-left: -4rem; + margin-right: -4rem; + } + + .sm\:-my-20 { + margin-top: -5rem; + margin-bottom: -5rem; + } + + .sm\:-mx-20 { + margin-left: -5rem; + margin-right: -5rem; + } + + .sm\:-my-24 { + margin-top: -6rem; + margin-bottom: -6rem; + } + + .sm\:-mx-24 { + margin-left: -6rem; + margin-right: -6rem; + } + + .sm\:-my-32 { + margin-top: -8rem; + margin-bottom: -8rem; + } + + .sm\:-mx-32 { + margin-left: -8rem; + margin-right: -8rem; + } + + .sm\:-my-px { + margin-top: -1px; + margin-bottom: -1px; + } + + .sm\:-mx-px { + margin-left: -1px; + margin-right: -1px; + } + + .sm\:-mt-0 { + margin-top: 0; + } + + .sm\:-mr-0 { + margin-right: 0; + } + + .sm\:-mb-0 { + margin-bottom: 0; + } + + .sm\:-ml-0 { + margin-left: 0; + } + + .sm\:-mt-1 { + margin-top: -0.25rem; + } + + .sm\:-mr-1 { + margin-right: -0.25rem; + } + + .sm\:-mb-1 { + margin-bottom: -0.25rem; + } + + .sm\:-ml-1 { + margin-left: -0.25rem; + } + + .sm\:-mt-2 { + margin-top: -0.5rem; + } + + .sm\:-mr-2 { + margin-right: -0.5rem; + } + + .sm\:-mb-2 { + margin-bottom: -0.5rem; + } + + .sm\:-ml-2 { + margin-left: -0.5rem; + } + + .sm\:-mt-3 { + margin-top: -0.75rem; + } + + .sm\:-mr-3 { + margin-right: -0.75rem; + } + + .sm\:-mb-3 { + margin-bottom: -0.75rem; + } + + .sm\:-ml-3 { + margin-left: -0.75rem; + } + + .sm\:-mt-4 { + margin-top: -1rem; + } + + .sm\:-mr-4 { + margin-right: -1rem; + } + + .sm\:-mb-4 { + margin-bottom: -1rem; + } + + .sm\:-ml-4 { + margin-left: -1rem; + } + + .sm\:-mt-5 { + margin-top: -1.25rem; + } + + .sm\:-mr-5 { + margin-right: -1.25rem; + } + + .sm\:-mb-5 { + margin-bottom: -1.25rem; + } + + .sm\:-ml-5 { + margin-left: -1.25rem; + } + + .sm\:-mt-6 { + margin-top: -1.5rem; + } + + .sm\:-mr-6 { + margin-right: -1.5rem; + } + + .sm\:-mb-6 { + margin-bottom: -1.5rem; + } + + .sm\:-ml-6 { + margin-left: -1.5rem; + } + + .sm\:-mt-8 { + margin-top: -2rem; + } + + .sm\:-mr-8 { + margin-right: -2rem; + } + + .sm\:-mb-8 { + margin-bottom: -2rem; + } + + .sm\:-ml-8 { + margin-left: -2rem; + } + + .sm\:-mt-10 { + margin-top: -2.5rem; + } + + .sm\:-mr-10 { + margin-right: -2.5rem; + } + + .sm\:-mb-10 { + margin-bottom: -2.5rem; + } + + .sm\:-ml-10 { + margin-left: -2.5rem; + } + + .sm\:-mt-12 { + margin-top: -3rem; + } + + .sm\:-mr-12 { + margin-right: -3rem; + } + + .sm\:-mb-12 { + margin-bottom: -3rem; + } + + .sm\:-ml-12 { + margin-left: -3rem; + } + + .sm\:-mt-16 { + margin-top: -4rem; + } + + .sm\:-mr-16 { + margin-right: -4rem; + } + + .sm\:-mb-16 { + margin-bottom: -4rem; + } + + .sm\:-ml-16 { + margin-left: -4rem; + } + + .sm\:-mt-20 { + margin-top: -5rem; + } + + .sm\:-mr-20 { + margin-right: -5rem; + } + + .sm\:-mb-20 { + margin-bottom: -5rem; + } + + .sm\:-ml-20 { + margin-left: -5rem; + } + + .sm\:-mt-24 { + margin-top: -6rem; + } + + .sm\:-mr-24 { + margin-right: -6rem; + } + + .sm\:-mb-24 { + margin-bottom: -6rem; + } + + .sm\:-ml-24 { + margin-left: -6rem; + } + + .sm\:-mt-32 { + margin-top: -8rem; + } + + .sm\:-mr-32 { + margin-right: -8rem; + } + + .sm\:-mb-32 { + margin-bottom: -8rem; + } + + .sm\:-ml-32 { + margin-left: -8rem; + } + + .sm\:-mt-px { + margin-top: -1px; + } + + .sm\:-mr-px { + margin-right: -1px; + } + + .sm\:-mb-px { + margin-bottom: -1px; + } + + .sm\:-ml-px { + margin-left: -1px; + } + + .sm\:opacity-0 { + opacity: 0; + } + + .sm\:opacity-25 { + opacity: .25; + } + + .sm\:opacity-50 { + opacity: .5; + } + + .sm\:opacity-75 { + opacity: .75; + } + + .sm\:opacity-100 { + opacity: 1; + } + + .sm\:overflow-auto { + overflow: auto; + } + + .sm\:overflow-hidden { + overflow: hidden; + } + + .sm\:overflow-visible { + overflow: visible; + } + + .sm\:overflow-scroll { + overflow: scroll; + } + + .sm\:overflow-x-auto { + overflow-x: auto; + } + + .sm\:overflow-y-auto { + overflow-y: auto; + } + + .sm\:overflow-x-hidden { + overflow-x: hidden; + } + + .sm\:overflow-y-hidden { + overflow-y: hidden; + } + + .sm\:overflow-x-visible { + overflow-x: visible; + } + + .sm\:overflow-y-visible { + overflow-y: visible; + } + + .sm\:overflow-x-scroll { + overflow-x: scroll; + } + + .sm\:overflow-y-scroll { + overflow-y: scroll; + } + + .sm\:scrolling-touch { + -webkit-overflow-scrolling: touch; + } + + .sm\:scrolling-auto { + -webkit-overflow-scrolling: auto; + } + + .sm\:p-0 { + padding: 0; + } + + .sm\:p-1 { + padding: .25rem; + } + + .sm\:p-2 { + padding: .5rem; + } + + .sm\:p-3 { + padding: .75rem; + } + + .sm\:p-4 { + padding: 1rem; + } + + .sm\:p-5 { + padding: 1.25rem; + } + + .sm\:p-6 { + padding: 1.5rem; + } + + .sm\:p-8 { + padding: 2rem; + } + + .sm\:p-10 { + padding: 2.5rem; + } + + .sm\:p-12 { + padding: 3rem; + } + + .sm\:p-16 { + padding: 4rem; + } + + .sm\:p-20 { + padding: 5rem; + } + + .sm\:p-24 { + padding: 6rem; + } + + .sm\:p-32 { + padding: 8rem; + } + + .sm\:p-px { + padding: 1px; + } + + .sm\:py-0 { + padding-top: 0; + padding-bottom: 0; + } + + .sm\:px-0 { + padding-left: 0; + padding-right: 0; + } + + .sm\:py-1 { + padding-top: .25rem; + padding-bottom: .25rem; + } + + .sm\:px-1 { + padding-left: .25rem; + padding-right: .25rem; + } + + .sm\:py-2 { + padding-top: .5rem; + padding-bottom: .5rem; + } + + .sm\:px-2 { + padding-left: .5rem; + padding-right: .5rem; + } + + .sm\:py-3 { + padding-top: .75rem; + padding-bottom: .75rem; + } + + .sm\:px-3 { + padding-left: .75rem; + padding-right: .75rem; + } + + .sm\:py-4 { + padding-top: 1rem; + padding-bottom: 1rem; + } + + .sm\:px-4 { + padding-left: 1rem; + padding-right: 1rem; + } + + .sm\:py-5 { + padding-top: 1.25rem; + padding-bottom: 1.25rem; + } + + .sm\:px-5 { + padding-left: 1.25rem; + padding-right: 1.25rem; + } + + .sm\:py-6 { + padding-top: 1.5rem; + padding-bottom: 1.5rem; + } + + .sm\:px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; + } + + .sm\:py-8 { + padding-top: 2rem; + padding-bottom: 2rem; + } + + .sm\:px-8 { + padding-left: 2rem; + padding-right: 2rem; + } + + .sm\:py-10 { + padding-top: 2.5rem; + padding-bottom: 2.5rem; + } + + .sm\:px-10 { + padding-left: 2.5rem; + padding-right: 2.5rem; + } + + .sm\:py-12 { + padding-top: 3rem; + padding-bottom: 3rem; + } + + .sm\:px-12 { + padding-left: 3rem; + padding-right: 3rem; + } + + .sm\:py-16 { + padding-top: 4rem; + padding-bottom: 4rem; + } + + .sm\:px-16 { + padding-left: 4rem; + padding-right: 4rem; + } + + .sm\:py-20 { + padding-top: 5rem; + padding-bottom: 5rem; + } + + .sm\:px-20 { + padding-left: 5rem; + padding-right: 5rem; + } + + .sm\:py-24 { + padding-top: 6rem; + padding-bottom: 6rem; + } + + .sm\:px-24 { + padding-left: 6rem; + padding-right: 6rem; + } + + .sm\:py-32 { + padding-top: 8rem; + padding-bottom: 8rem; + } + + .sm\:px-32 { + padding-left: 8rem; + padding-right: 8rem; + } + + .sm\:py-px { + padding-top: 1px; + padding-bottom: 1px; + } + + .sm\:px-px { + padding-left: 1px; + padding-right: 1px; + } + + .sm\:pt-0 { + padding-top: 0; + } + + .sm\:pr-0 { + padding-right: 0; + } + + .sm\:pb-0 { + padding-bottom: 0; + } + + .sm\:pl-0 { + padding-left: 0; + } + + .sm\:pt-1 { + padding-top: .25rem; + } + + .sm\:pr-1 { + padding-right: .25rem; + } + + .sm\:pb-1 { + padding-bottom: .25rem; + } + + .sm\:pl-1 { + padding-left: .25rem; + } + + .sm\:pt-2 { + padding-top: .5rem; + } + + .sm\:pr-2 { + padding-right: .5rem; + } + + .sm\:pb-2 { + padding-bottom: .5rem; + } + + .sm\:pl-2 { + padding-left: .5rem; + } + + .sm\:pt-3 { + padding-top: .75rem; + } + + .sm\:pr-3 { + padding-right: .75rem; + } + + .sm\:pb-3 { + padding-bottom: .75rem; + } + + .sm\:pl-3 { + padding-left: .75rem; + } + + .sm\:pt-4 { + padding-top: 1rem; + } + + .sm\:pr-4 { + padding-right: 1rem; + } + + .sm\:pb-4 { + padding-bottom: 1rem; + } + + .sm\:pl-4 { + padding-left: 1rem; + } + + .sm\:pt-5 { + padding-top: 1.25rem; + } + + .sm\:pr-5 { + padding-right: 1.25rem; + } + + .sm\:pb-5 { + padding-bottom: 1.25rem; + } + + .sm\:pl-5 { + padding-left: 1.25rem; + } + + .sm\:pt-6 { + padding-top: 1.5rem; + } + + .sm\:pr-6 { + padding-right: 1.5rem; + } + + .sm\:pb-6 { + padding-bottom: 1.5rem; + } + + .sm\:pl-6 { + padding-left: 1.5rem; + } + + .sm\:pt-8 { + padding-top: 2rem; + } + + .sm\:pr-8 { + padding-right: 2rem; + } + + .sm\:pb-8 { + padding-bottom: 2rem; + } + + .sm\:pl-8 { + padding-left: 2rem; + } + + .sm\:pt-10 { + padding-top: 2.5rem; + } + + .sm\:pr-10 { + padding-right: 2.5rem; + } + + .sm\:pb-10 { + padding-bottom: 2.5rem; + } + + .sm\:pl-10 { + padding-left: 2.5rem; + } + + .sm\:pt-12 { + padding-top: 3rem; + } + + .sm\:pr-12 { + padding-right: 3rem; + } + + .sm\:pb-12 { + padding-bottom: 3rem; + } + + .sm\:pl-12 { + padding-left: 3rem; + } + + .sm\:pt-16 { + padding-top: 4rem; + } + + .sm\:pr-16 { + padding-right: 4rem; + } + + .sm\:pb-16 { + padding-bottom: 4rem; + } + + .sm\:pl-16 { + padding-left: 4rem; + } + + .sm\:pt-20 { + padding-top: 5rem; + } + + .sm\:pr-20 { + padding-right: 5rem; + } + + .sm\:pb-20 { + padding-bottom: 5rem; + } + + .sm\:pl-20 { + padding-left: 5rem; + } + + .sm\:pt-24 { + padding-top: 6rem; + } + + .sm\:pr-24 { + padding-right: 6rem; + } + + .sm\:pb-24 { + padding-bottom: 6rem; + } + + .sm\:pl-24 { + padding-left: 6rem; + } + + .sm\:pt-32 { + padding-top: 8rem; + } + + .sm\:pr-32 { + padding-right: 8rem; + } + + .sm\:pb-32 { + padding-bottom: 8rem; + } + + .sm\:pl-32 { + padding-left: 8rem; + } + + .sm\:pt-px { + padding-top: 1px; + } + + .sm\:pr-px { + padding-right: 1px; + } + + .sm\:pb-px { + padding-bottom: 1px; + } + + .sm\:pl-px { + padding-left: 1px; + } + + .sm\:pointer-events-none { + pointer-events: none; + } + + .sm\:pointer-events-auto { + pointer-events: auto; + } + + .sm\:static { + position: static; + } + + .sm\:fixed { + position: fixed; + } + + .sm\:absolute { + position: absolute; + } + + .sm\:relative { + position: relative; + } + + .sm\:sticky { + position: -webkit-sticky; + position: sticky; + } + + .sm\:pin-none { + top: auto; + right: auto; + bottom: auto; + left: auto; + } + + .sm\:pin { + top: 0; + right: 0; + bottom: 0; + left: 0; + } + + .sm\:pin-y { + top: 0; + bottom: 0; + } + + .sm\:pin-x { + right: 0; + left: 0; + } + + .sm\:pin-t { + top: 0; + } + + .sm\:pin-r { + right: 0; + } + + .sm\:pin-b { + bottom: 0; + } + + .sm\:pin-l { + left: 0; + } + + .sm\:resize-none { + resize: none; + } + + .sm\:resize-y { + resize: vertical; + } + + .sm\:resize-x { + resize: horizontal; + } + + .sm\:resize { + resize: both; + } + + .sm\:shadow { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .sm\:shadow-md { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .sm\:shadow-lg { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .sm\:shadow-inner { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .sm\:shadow-outline { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .sm\:shadow-none { + box-shadow: none; + } + + .sm\:hover\:shadow:hover { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .sm\:hover\:shadow-md:hover { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .sm\:hover\:shadow-lg:hover { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .sm\:hover\:shadow-inner:hover { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .sm\:hover\:shadow-outline:hover { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .sm\:hover\:shadow-none:hover { + box-shadow: none; + } + + .sm\:focus\:shadow:focus { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .sm\:focus\:shadow-md:focus { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .sm\:focus\:shadow-lg:focus { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .sm\:focus\:shadow-inner:focus { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .sm\:focus\:shadow-outline:focus { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .sm\:focus\:shadow-none:focus { + box-shadow: none; + } + + .sm\:table-auto { + table-layout: auto; + } + + .sm\:table-fixed { + table-layout: fixed; + } + + .sm\:text-left { + text-align: left; + } + + .sm\:text-center { + text-align: center; + } + + .sm\:text-right { + text-align: right; + } + + .sm\:text-justify { + text-align: justify; + } + + .sm\:text-transparent { + color: transparent; + } + + .sm\:text-black { + color: #22292f; + } + + .sm\:text-grey-darkest { + color: #3d4852; + } + + .sm\:text-grey-darker { + color: #606f7b; + } + + .sm\:text-grey-dark { + color: #8795a1; + } + + .sm\:text-grey { + color: #b8c2cc; + } + + .sm\:text-grey-light { + color: #dae1e7; + } + + .sm\:text-grey-lighter { + color: #f1f5f8; + } + + .sm\:text-grey-lightest { + color: #f8fafc; + } + + .sm\:text-white { + color: #fff; + } + + .sm\:text-red-darkest { + color: #3b0d0c; + } + + .sm\:text-red-darker { + color: #621b18; + } + + .sm\:text-red-dark { + color: #cc1f1a; + } + + .sm\:text-red { + color: #e3342f; + } + + .sm\:text-red-light { + color: #ef5753; + } + + .sm\:text-red-lighter { + color: #f9acaa; + } + + .sm\:text-red-lightest { + color: #fcebea; + } + + .sm\:text-orange-darkest { + color: #462a16; + } + + .sm\:text-orange-darker { + color: #613b1f; + } + + .sm\:text-orange-dark { + color: #de751f; + } + + .sm\:text-orange { + color: #f6993f; + } + + .sm\:text-orange-light { + color: #faad63; + } + + .sm\:text-orange-lighter { + color: #fcd9b6; + } + + .sm\:text-orange-lightest { + color: #fff5eb; + } + + .sm\:text-yellow-darkest { + color: #453411; + } + + .sm\:text-yellow-darker { + color: #684f1d; + } + + .sm\:text-yellow-dark { + color: #f2d024; + } + + .sm\:text-yellow { + color: #ffed4a; + } + + .sm\:text-yellow-light { + color: #fff382; + } + + .sm\:text-yellow-lighter { + color: #fff9c2; + } + + .sm\:text-yellow-lightest { + color: #fcfbeb; + } + + .sm\:text-green-darkest { + color: #0f2f21; + } + + .sm\:text-green-darker { + color: #1a4731; + } + + .sm\:text-green-dark { + color: #1f9d55; + } + + .sm\:text-green { + color: #38c172; + } + + .sm\:text-green-light { + color: #51d88a; + } + + .sm\:text-green-lighter { + color: #a2f5bf; + } + + .sm\:text-green-lightest { + color: #e3fcec; + } + + .sm\:text-teal-darkest { + color: #0d3331; + } + + .sm\:text-teal-darker { + color: #20504f; + } + + .sm\:text-teal-dark { + color: #38a89d; + } + + .sm\:text-teal { + color: #4dc0b5; + } + + .sm\:text-teal-light { + color: #64d5ca; + } + + .sm\:text-teal-lighter { + color: #a0f0ed; + } + + .sm\:text-teal-lightest { + color: #e8fffe; + } + + .sm\:text-blue-darkest { + color: #12283a; + } + + .sm\:text-blue-darker { + color: #1c3d5a; + } + + .sm\:text-blue-dark { + color: #2779bd; + } + + .sm\:text-blue { + color: #3490dc; + } + + .sm\:text-blue-light { + color: #6cb2eb; + } + + .sm\:text-blue-lighter { + color: #bcdefa; + } + + .sm\:text-blue-lightest { + color: #eff8ff; + } + + .sm\:text-indigo-darkest { + color: #191e38; + } + + .sm\:text-indigo-darker { + color: #2f365f; + } + + .sm\:text-indigo-dark { + color: #5661b3; + } + + .sm\:text-indigo { + color: #6574cd; + } + + .sm\:text-indigo-light { + color: #7886d7; + } + + .sm\:text-indigo-lighter { + color: #b2b7ff; + } + + .sm\:text-indigo-lightest { + color: #e6e8ff; + } + + .sm\:text-purple-darkest { + color: #21183c; + } + + .sm\:text-purple-darker { + color: #382b5f; + } + + .sm\:text-purple-dark { + color: #794acf; + } + + .sm\:text-purple { + color: #9561e2; + } + + .sm\:text-purple-light { + color: #a779e9; + } + + .sm\:text-purple-lighter { + color: #d6bbfc; + } + + .sm\:text-purple-lightest { + color: #f3ebff; + } + + .sm\:text-pink-darkest { + color: #451225; + } + + .sm\:text-pink-darker { + color: #6f213f; + } + + .sm\:text-pink-dark { + color: #eb5286; + } + + .sm\:text-pink { + color: #f66d9b; + } + + .sm\:text-pink-light { + color: #fa7ea8; + } + + .sm\:text-pink-lighter { + color: #ffbbca; + } + + .sm\:text-pink-lightest { + color: #ffebef; + } + + .sm\:hover\:text-transparent:hover { + color: transparent; + } + + .sm\:hover\:text-black:hover { + color: #22292f; + } + + .sm\:hover\:text-grey-darkest:hover { + color: #3d4852; + } + + .sm\:hover\:text-grey-darker:hover { + color: #606f7b; + } + + .sm\:hover\:text-grey-dark:hover { + color: #8795a1; + } + + .sm\:hover\:text-grey:hover { + color: #b8c2cc; + } + + .sm\:hover\:text-grey-light:hover { + color: #dae1e7; + } + + .sm\:hover\:text-grey-lighter:hover { + color: #f1f5f8; + } + + .sm\:hover\:text-grey-lightest:hover { + color: #f8fafc; + } + + .sm\:hover\:text-white:hover { + color: #fff; + } + + .sm\:hover\:text-red-darkest:hover { + color: #3b0d0c; + } + + .sm\:hover\:text-red-darker:hover { + color: #621b18; + } + + .sm\:hover\:text-red-dark:hover { + color: #cc1f1a; + } + + .sm\:hover\:text-red:hover { + color: #e3342f; + } + + .sm\:hover\:text-red-light:hover { + color: #ef5753; + } + + .sm\:hover\:text-red-lighter:hover { + color: #f9acaa; + } + + .sm\:hover\:text-red-lightest:hover { + color: #fcebea; + } + + .sm\:hover\:text-orange-darkest:hover { + color: #462a16; + } + + .sm\:hover\:text-orange-darker:hover { + color: #613b1f; + } + + .sm\:hover\:text-orange-dark:hover { + color: #de751f; + } + + .sm\:hover\:text-orange:hover { + color: #f6993f; + } + + .sm\:hover\:text-orange-light:hover { + color: #faad63; + } + + .sm\:hover\:text-orange-lighter:hover { + color: #fcd9b6; + } + + .sm\:hover\:text-orange-lightest:hover { + color: #fff5eb; + } + + .sm\:hover\:text-yellow-darkest:hover { + color: #453411; + } + + .sm\:hover\:text-yellow-darker:hover { + color: #684f1d; + } + + .sm\:hover\:text-yellow-dark:hover { + color: #f2d024; + } + + .sm\:hover\:text-yellow:hover { + color: #ffed4a; + } + + .sm\:hover\:text-yellow-light:hover { + color: #fff382; + } + + .sm\:hover\:text-yellow-lighter:hover { + color: #fff9c2; + } + + .sm\:hover\:text-yellow-lightest:hover { + color: #fcfbeb; + } + + .sm\:hover\:text-green-darkest:hover { + color: #0f2f21; + } + + .sm\:hover\:text-green-darker:hover { + color: #1a4731; + } + + .sm\:hover\:text-green-dark:hover { + color: #1f9d55; + } + + .sm\:hover\:text-green:hover { + color: #38c172; + } + + .sm\:hover\:text-green-light:hover { + color: #51d88a; + } + + .sm\:hover\:text-green-lighter:hover { + color: #a2f5bf; + } + + .sm\:hover\:text-green-lightest:hover { + color: #e3fcec; + } + + .sm\:hover\:text-teal-darkest:hover { + color: #0d3331; + } + + .sm\:hover\:text-teal-darker:hover { + color: #20504f; + } + + .sm\:hover\:text-teal-dark:hover { + color: #38a89d; + } + + .sm\:hover\:text-teal:hover { + color: #4dc0b5; + } + + .sm\:hover\:text-teal-light:hover { + color: #64d5ca; + } + + .sm\:hover\:text-teal-lighter:hover { + color: #a0f0ed; + } + + .sm\:hover\:text-teal-lightest:hover { + color: #e8fffe; + } + + .sm\:hover\:text-blue-darkest:hover { + color: #12283a; + } + + .sm\:hover\:text-blue-darker:hover { + color: #1c3d5a; + } + + .sm\:hover\:text-blue-dark:hover { + color: #2779bd; + } + + .sm\:hover\:text-blue:hover { + color: #3490dc; + } + + .sm\:hover\:text-blue-light:hover { + color: #6cb2eb; + } + + .sm\:hover\:text-blue-lighter:hover { + color: #bcdefa; + } + + .sm\:hover\:text-blue-lightest:hover { + color: #eff8ff; + } + + .sm\:hover\:text-indigo-darkest:hover { + color: #191e38; + } + + .sm\:hover\:text-indigo-darker:hover { + color: #2f365f; + } + + .sm\:hover\:text-indigo-dark:hover { + color: #5661b3; + } + + .sm\:hover\:text-indigo:hover { + color: #6574cd; + } + + .sm\:hover\:text-indigo-light:hover { + color: #7886d7; + } + + .sm\:hover\:text-indigo-lighter:hover { + color: #b2b7ff; + } + + .sm\:hover\:text-indigo-lightest:hover { + color: #e6e8ff; + } + + .sm\:hover\:text-purple-darkest:hover { + color: #21183c; + } + + .sm\:hover\:text-purple-darker:hover { + color: #382b5f; + } + + .sm\:hover\:text-purple-dark:hover { + color: #794acf; + } + + .sm\:hover\:text-purple:hover { + color: #9561e2; + } + + .sm\:hover\:text-purple-light:hover { + color: #a779e9; + } + + .sm\:hover\:text-purple-lighter:hover { + color: #d6bbfc; + } + + .sm\:hover\:text-purple-lightest:hover { + color: #f3ebff; + } + + .sm\:hover\:text-pink-darkest:hover { + color: #451225; + } + + .sm\:hover\:text-pink-darker:hover { + color: #6f213f; + } + + .sm\:hover\:text-pink-dark:hover { + color: #eb5286; + } + + .sm\:hover\:text-pink:hover { + color: #f66d9b; + } + + .sm\:hover\:text-pink-light:hover { + color: #fa7ea8; + } + + .sm\:hover\:text-pink-lighter:hover { + color: #ffbbca; + } + + .sm\:hover\:text-pink-lightest:hover { + color: #ffebef; + } + + .sm\:focus\:text-transparent:focus { + color: transparent; + } + + .sm\:focus\:text-black:focus { + color: #22292f; + } + + .sm\:focus\:text-grey-darkest:focus { + color: #3d4852; + } + + .sm\:focus\:text-grey-darker:focus { + color: #606f7b; + } + + .sm\:focus\:text-grey-dark:focus { + color: #8795a1; + } + + .sm\:focus\:text-grey:focus { + color: #b8c2cc; + } + + .sm\:focus\:text-grey-light:focus { + color: #dae1e7; + } + + .sm\:focus\:text-grey-lighter:focus { + color: #f1f5f8; + } + + .sm\:focus\:text-grey-lightest:focus { + color: #f8fafc; + } + + .sm\:focus\:text-white:focus { + color: #fff; + } + + .sm\:focus\:text-red-darkest:focus { + color: #3b0d0c; + } + + .sm\:focus\:text-red-darker:focus { + color: #621b18; + } + + .sm\:focus\:text-red-dark:focus { + color: #cc1f1a; + } + + .sm\:focus\:text-red:focus { + color: #e3342f; + } + + .sm\:focus\:text-red-light:focus { + color: #ef5753; + } + + .sm\:focus\:text-red-lighter:focus { + color: #f9acaa; + } + + .sm\:focus\:text-red-lightest:focus { + color: #fcebea; + } + + .sm\:focus\:text-orange-darkest:focus { + color: #462a16; + } + + .sm\:focus\:text-orange-darker:focus { + color: #613b1f; + } + + .sm\:focus\:text-orange-dark:focus { + color: #de751f; + } + + .sm\:focus\:text-orange:focus { + color: #f6993f; + } + + .sm\:focus\:text-orange-light:focus { + color: #faad63; + } + + .sm\:focus\:text-orange-lighter:focus { + color: #fcd9b6; + } + + .sm\:focus\:text-orange-lightest:focus { + color: #fff5eb; + } + + .sm\:focus\:text-yellow-darkest:focus { + color: #453411; + } + + .sm\:focus\:text-yellow-darker:focus { + color: #684f1d; + } + + .sm\:focus\:text-yellow-dark:focus { + color: #f2d024; + } + + .sm\:focus\:text-yellow:focus { + color: #ffed4a; + } + + .sm\:focus\:text-yellow-light:focus { + color: #fff382; + } + + .sm\:focus\:text-yellow-lighter:focus { + color: #fff9c2; + } + + .sm\:focus\:text-yellow-lightest:focus { + color: #fcfbeb; + } + + .sm\:focus\:text-green-darkest:focus { + color: #0f2f21; + } + + .sm\:focus\:text-green-darker:focus { + color: #1a4731; + } + + .sm\:focus\:text-green-dark:focus { + color: #1f9d55; + } + + .sm\:focus\:text-green:focus { + color: #38c172; + } + + .sm\:focus\:text-green-light:focus { + color: #51d88a; + } + + .sm\:focus\:text-green-lighter:focus { + color: #a2f5bf; + } + + .sm\:focus\:text-green-lightest:focus { + color: #e3fcec; + } + + .sm\:focus\:text-teal-darkest:focus { + color: #0d3331; + } + + .sm\:focus\:text-teal-darker:focus { + color: #20504f; + } + + .sm\:focus\:text-teal-dark:focus { + color: #38a89d; + } + + .sm\:focus\:text-teal:focus { + color: #4dc0b5; + } + + .sm\:focus\:text-teal-light:focus { + color: #64d5ca; + } + + .sm\:focus\:text-teal-lighter:focus { + color: #a0f0ed; + } + + .sm\:focus\:text-teal-lightest:focus { + color: #e8fffe; + } + + .sm\:focus\:text-blue-darkest:focus { + color: #12283a; + } + + .sm\:focus\:text-blue-darker:focus { + color: #1c3d5a; + } + + .sm\:focus\:text-blue-dark:focus { + color: #2779bd; + } + + .sm\:focus\:text-blue:focus { + color: #3490dc; + } + + .sm\:focus\:text-blue-light:focus { + color: #6cb2eb; + } + + .sm\:focus\:text-blue-lighter:focus { + color: #bcdefa; + } + + .sm\:focus\:text-blue-lightest:focus { + color: #eff8ff; + } + + .sm\:focus\:text-indigo-darkest:focus { + color: #191e38; + } + + .sm\:focus\:text-indigo-darker:focus { + color: #2f365f; + } + + .sm\:focus\:text-indigo-dark:focus { + color: #5661b3; + } + + .sm\:focus\:text-indigo:focus { + color: #6574cd; + } + + .sm\:focus\:text-indigo-light:focus { + color: #7886d7; + } + + .sm\:focus\:text-indigo-lighter:focus { + color: #b2b7ff; + } + + .sm\:focus\:text-indigo-lightest:focus { + color: #e6e8ff; + } + + .sm\:focus\:text-purple-darkest:focus { + color: #21183c; + } + + .sm\:focus\:text-purple-darker:focus { + color: #382b5f; + } + + .sm\:focus\:text-purple-dark:focus { + color: #794acf; + } + + .sm\:focus\:text-purple:focus { + color: #9561e2; + } + + .sm\:focus\:text-purple-light:focus { + color: #a779e9; + } + + .sm\:focus\:text-purple-lighter:focus { + color: #d6bbfc; + } + + .sm\:focus\:text-purple-lightest:focus { + color: #f3ebff; + } + + .sm\:focus\:text-pink-darkest:focus { + color: #451225; + } + + .sm\:focus\:text-pink-darker:focus { + color: #6f213f; + } + + .sm\:focus\:text-pink-dark:focus { + color: #eb5286; + } + + .sm\:focus\:text-pink:focus { + color: #f66d9b; + } + + .sm\:focus\:text-pink-light:focus { + color: #fa7ea8; + } + + .sm\:focus\:text-pink-lighter:focus { + color: #ffbbca; + } + + .sm\:focus\:text-pink-lightest:focus { + color: #ffebef; + } + + .sm\:text-xs { + font-size: .75rem; + } + + .sm\:text-sm { + font-size: .875rem; + } + + .sm\:text-base { + font-size: 1rem; + } + + .sm\:text-lg { + font-size: 1.125rem; + } + + .sm\:text-xl { + font-size: 1.25rem; + } + + .sm\:text-2xl { + font-size: 1.5rem; + } + + .sm\:text-3xl { + font-size: 1.875rem; + } + + .sm\:text-4xl { + font-size: 2.25rem; + } + + .sm\:text-5xl { + font-size: 3rem; + } + + .sm\:italic { + font-style: italic; + } + + .sm\:roman { + font-style: normal; + } + + .sm\:uppercase { + text-transform: uppercase; + } + + .sm\:lowercase { + text-transform: lowercase; + } + + .sm\:capitalize { + text-transform: capitalize; + } + + .sm\:normal-case { + text-transform: none; + } + + .sm\:underline { + text-decoration: underline; + } + + .sm\:line-through { + text-decoration: line-through; + } + + .sm\:no-underline { + text-decoration: none; + } + + .sm\:antialiased { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .sm\:subpixel-antialiased { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .sm\:hover\:italic:hover { + font-style: italic; + } + + .sm\:hover\:roman:hover { + font-style: normal; + } + + .sm\:hover\:uppercase:hover { + text-transform: uppercase; + } + + .sm\:hover\:lowercase:hover { + text-transform: lowercase; + } + + .sm\:hover\:capitalize:hover { + text-transform: capitalize; + } + + .sm\:hover\:normal-case:hover { + text-transform: none; + } + + .sm\:hover\:underline:hover { + text-decoration: underline; + } + + .sm\:hover\:line-through:hover { + text-decoration: line-through; + } + + .sm\:hover\:no-underline:hover { + text-decoration: none; + } + + .sm\:hover\:antialiased:hover { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .sm\:hover\:subpixel-antialiased:hover { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .sm\:focus\:italic:focus { + font-style: italic; + } + + .sm\:focus\:roman:focus { + font-style: normal; + } + + .sm\:focus\:uppercase:focus { + text-transform: uppercase; + } + + .sm\:focus\:lowercase:focus { + text-transform: lowercase; + } + + .sm\:focus\:capitalize:focus { + text-transform: capitalize; + } + + .sm\:focus\:normal-case:focus { + text-transform: none; + } + + .sm\:focus\:underline:focus { + text-decoration: underline; + } + + .sm\:focus\:line-through:focus { + text-decoration: line-through; + } + + .sm\:focus\:no-underline:focus { + text-decoration: none; + } + + .sm\:focus\:antialiased:focus { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .sm\:focus\:subpixel-antialiased:focus { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .sm\:tracking-tight { + letter-spacing: -0.05em; + } + + .sm\:tracking-normal { + letter-spacing: 0; + } + + .sm\:tracking-wide { + letter-spacing: .05em; + } + + .sm\:select-none { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + } + + .sm\:select-text { + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; + } + + .sm\:align-baseline { + vertical-align: baseline; + } + + .sm\:align-top { + vertical-align: top; + } + + .sm\:align-middle { + vertical-align: middle; + } + + .sm\:align-bottom { + vertical-align: bottom; + } + + .sm\:align-text-top { + vertical-align: text-top; + } + + .sm\:align-text-bottom { + vertical-align: text-bottom; + } + + .sm\:visible { + visibility: visible; + } + + .sm\:invisible { + visibility: hidden; + } + + .sm\:whitespace-normal { + white-space: normal; + } + + .sm\:whitespace-no-wrap { + white-space: nowrap; + } + + .sm\:whitespace-pre { + white-space: pre; + } + + .sm\:whitespace-pre-line { + white-space: pre-line; + } + + .sm\:whitespace-pre-wrap { + white-space: pre-wrap; + } + + .sm\:break-words { + word-wrap: break-word; + } + + .sm\:break-normal { + word-wrap: normal; + } + + .sm\:truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + + .sm\:w-1 { + width: .25rem; + } + + .sm\:w-2 { + width: .5rem; + } + + .sm\:w-3 { + width: .75rem; + } + + .sm\:w-4 { + width: 1rem; + } + + .sm\:w-5 { + width: 1.25rem; + } + + .sm\:w-6 { + width: 1.5rem; + } + + .sm\:w-8 { + width: 2rem; + } + + .sm\:w-10 { + width: 2.5rem; + } + + .sm\:w-12 { + width: 3rem; + } + + .sm\:w-16 { + width: 4rem; + } + + .sm\:w-24 { + width: 6rem; + } + + .sm\:w-32 { + width: 8rem; + } + + .sm\:w-48 { + width: 12rem; + } + + .sm\:w-64 { + width: 16rem; + } + + .sm\:w-auto { + width: auto; + } + + .sm\:w-px { + width: 1px; + } + + .sm\:w-1\/2 { + width: 50%; + } + + .sm\:w-1\/3 { + width: 33.33333%; + } + + .sm\:w-2\/3 { + width: 66.66667%; + } + + .sm\:w-1\/4 { + width: 25%; + } + + .sm\:w-3\/4 { + width: 75%; + } + + .sm\:w-1\/5 { + width: 20%; + } + + .sm\:w-2\/5 { + width: 40%; + } + + .sm\:w-3\/5 { + width: 60%; + } + + .sm\:w-4\/5 { + width: 80%; + } + + .sm\:w-1\/6 { + width: 16.66667%; + } + + .sm\:w-5\/6 { + width: 83.33333%; + } + + .sm\:w-full { + width: 100%; + } + + .sm\:w-screen { + width: 100vw; + } + + .sm\:z-0 { + z-index: 0; + } + + .sm\:z-10 { + z-index: 10; + } + + .sm\:z-20 { + z-index: 20; + } + + .sm\:z-30 { + z-index: 30; + } + + .sm\:z-40 { + z-index: 40; + } + + .sm\:z-50 { + z-index: 50; + } + + .sm\:z-auto { + z-index: auto; + } +} + +@media (min-width: 768px) { + .md\:list-reset { + list-style: none; + padding: 0; + } + + .md\:appearance-none { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + .md\:bg-fixed { + background-attachment: fixed; + } + + .md\:bg-local { + background-attachment: local; + } + + .md\:bg-scroll { + background-attachment: scroll; + } + + .md\:bg-transparent { + background-color: transparent; + } + + .md\:bg-black { + background-color: #22292f; + } + + .md\:bg-grey-darkest { + background-color: #3d4852; + } + + .md\:bg-grey-darker { + background-color: #606f7b; + } + + .md\:bg-grey-dark { + background-color: #8795a1; + } + + .md\:bg-grey { + background-color: #b8c2cc; + } + + .md\:bg-grey-light { + background-color: #dae1e7; + } + + .md\:bg-grey-lighter { + background-color: #f1f5f8; + } + + .md\:bg-grey-lightest { + background-color: #f8fafc; + } + + .md\:bg-white { + background-color: #fff; + } + + .md\:bg-red-darkest { + background-color: #3b0d0c; + } + + .md\:bg-red-darker { + background-color: #621b18; + } + + .md\:bg-red-dark { + background-color: #cc1f1a; + } + + .md\:bg-red { + background-color: #e3342f; + } + + .md\:bg-red-light { + background-color: #ef5753; + } + + .md\:bg-red-lighter { + background-color: #f9acaa; + } + + .md\:bg-red-lightest { + background-color: #fcebea; + } + + .md\:bg-orange-darkest { + background-color: #462a16; + } + + .md\:bg-orange-darker { + background-color: #613b1f; + } + + .md\:bg-orange-dark { + background-color: #de751f; + } + + .md\:bg-orange { + background-color: #f6993f; + } + + .md\:bg-orange-light { + background-color: #faad63; + } + + .md\:bg-orange-lighter { + background-color: #fcd9b6; + } + + .md\:bg-orange-lightest { + background-color: #fff5eb; + } + + .md\:bg-yellow-darkest { + background-color: #453411; + } + + .md\:bg-yellow-darker { + background-color: #684f1d; + } + + .md\:bg-yellow-dark { + background-color: #f2d024; + } + + .md\:bg-yellow { + background-color: #ffed4a; + } + + .md\:bg-yellow-light { + background-color: #fff382; + } + + .md\:bg-yellow-lighter { + background-color: #fff9c2; + } + + .md\:bg-yellow-lightest { + background-color: #fcfbeb; + } + + .md\:bg-green-darkest { + background-color: #0f2f21; + } + + .md\:bg-green-darker { + background-color: #1a4731; + } + + .md\:bg-green-dark { + background-color: #1f9d55; + } + + .md\:bg-green { + background-color: #38c172; + } + + .md\:bg-green-light { + background-color: #51d88a; + } + + .md\:bg-green-lighter { + background-color: #a2f5bf; + } + + .md\:bg-green-lightest { + background-color: #e3fcec; + } + + .md\:bg-teal-darkest { + background-color: #0d3331; + } + + .md\:bg-teal-darker { + background-color: #20504f; + } + + .md\:bg-teal-dark { + background-color: #38a89d; + } + + .md\:bg-teal { + background-color: #4dc0b5; + } + + .md\:bg-teal-light { + background-color: #64d5ca; + } + + .md\:bg-teal-lighter { + background-color: #a0f0ed; + } + + .md\:bg-teal-lightest { + background-color: #e8fffe; + } + + .md\:bg-blue-darkest { + background-color: #12283a; + } + + .md\:bg-blue-darker { + background-color: #1c3d5a; + } + + .md\:bg-blue-dark { + background-color: #2779bd; + } + + .md\:bg-blue { + background-color: #3490dc; + } + + .md\:bg-blue-light { + background-color: #6cb2eb; + } + + .md\:bg-blue-lighter { + background-color: #bcdefa; + } + + .md\:bg-blue-lightest { + background-color: #eff8ff; + } + + .md\:bg-indigo-darkest { + background-color: #191e38; + } + + .md\:bg-indigo-darker { + background-color: #2f365f; + } + + .md\:bg-indigo-dark { + background-color: #5661b3; + } + + .md\:bg-indigo { + background-color: #6574cd; + } + + .md\:bg-indigo-light { + background-color: #7886d7; + } + + .md\:bg-indigo-lighter { + background-color: #b2b7ff; + } + + .md\:bg-indigo-lightest { + background-color: #e6e8ff; + } + + .md\:bg-purple-darkest { + background-color: #21183c; + } + + .md\:bg-purple-darker { + background-color: #382b5f; + } + + .md\:bg-purple-dark { + background-color: #794acf; + } + + .md\:bg-purple { + background-color: #9561e2; + } + + .md\:bg-purple-light { + background-color: #a779e9; + } + + .md\:bg-purple-lighter { + background-color: #d6bbfc; + } + + .md\:bg-purple-lightest { + background-color: #f3ebff; + } + + .md\:bg-pink-darkest { + background-color: #451225; + } + + .md\:bg-pink-darker { + background-color: #6f213f; + } + + .md\:bg-pink-dark { + background-color: #eb5286; + } + + .md\:bg-pink { + background-color: #f66d9b; + } + + .md\:bg-pink-light { + background-color: #fa7ea8; + } + + .md\:bg-pink-lighter { + background-color: #ffbbca; + } + + .md\:bg-pink-lightest { + background-color: #ffebef; + } + + .md\:hover\:bg-transparent:hover { + background-color: transparent; + } + + .md\:hover\:bg-black:hover { + background-color: #22292f; + } + + .md\:hover\:bg-grey-darkest:hover { + background-color: #3d4852; + } + + .md\:hover\:bg-grey-darker:hover { + background-color: #606f7b; + } + + .md\:hover\:bg-grey-dark:hover { + background-color: #8795a1; + } + + .md\:hover\:bg-grey:hover { + background-color: #b8c2cc; + } + + .md\:hover\:bg-grey-light:hover { + background-color: #dae1e7; + } + + .md\:hover\:bg-grey-lighter:hover { + background-color: #f1f5f8; + } + + .md\:hover\:bg-grey-lightest:hover { + background-color: #f8fafc; + } + + .md\:hover\:bg-white:hover { + background-color: #fff; + } + + .md\:hover\:bg-red-darkest:hover { + background-color: #3b0d0c; + } + + .md\:hover\:bg-red-darker:hover { + background-color: #621b18; + } + + .md\:hover\:bg-red-dark:hover { + background-color: #cc1f1a; + } + + .md\:hover\:bg-red:hover { + background-color: #e3342f; + } + + .md\:hover\:bg-red-light:hover { + background-color: #ef5753; + } + + .md\:hover\:bg-red-lighter:hover { + background-color: #f9acaa; + } + + .md\:hover\:bg-red-lightest:hover { + background-color: #fcebea; + } + + .md\:hover\:bg-orange-darkest:hover { + background-color: #462a16; + } + + .md\:hover\:bg-orange-darker:hover { + background-color: #613b1f; + } + + .md\:hover\:bg-orange-dark:hover { + background-color: #de751f; + } + + .md\:hover\:bg-orange:hover { + background-color: #f6993f; + } + + .md\:hover\:bg-orange-light:hover { + background-color: #faad63; + } + + .md\:hover\:bg-orange-lighter:hover { + background-color: #fcd9b6; + } + + .md\:hover\:bg-orange-lightest:hover { + background-color: #fff5eb; + } + + .md\:hover\:bg-yellow-darkest:hover { + background-color: #453411; + } + + .md\:hover\:bg-yellow-darker:hover { + background-color: #684f1d; + } + + .md\:hover\:bg-yellow-dark:hover { + background-color: #f2d024; + } + + .md\:hover\:bg-yellow:hover { + background-color: #ffed4a; + } + + .md\:hover\:bg-yellow-light:hover { + background-color: #fff382; + } + + .md\:hover\:bg-yellow-lighter:hover { + background-color: #fff9c2; + } + + .md\:hover\:bg-yellow-lightest:hover { + background-color: #fcfbeb; + } + + .md\:hover\:bg-green-darkest:hover { + background-color: #0f2f21; + } + + .md\:hover\:bg-green-darker:hover { + background-color: #1a4731; + } + + .md\:hover\:bg-green-dark:hover { + background-color: #1f9d55; + } + + .md\:hover\:bg-green:hover { + background-color: #38c172; + } + + .md\:hover\:bg-green-light:hover { + background-color: #51d88a; + } + + .md\:hover\:bg-green-lighter:hover { + background-color: #a2f5bf; + } + + .md\:hover\:bg-green-lightest:hover { + background-color: #e3fcec; + } + + .md\:hover\:bg-teal-darkest:hover { + background-color: #0d3331; + } + + .md\:hover\:bg-teal-darker:hover { + background-color: #20504f; + } + + .md\:hover\:bg-teal-dark:hover { + background-color: #38a89d; + } + + .md\:hover\:bg-teal:hover { + background-color: #4dc0b5; + } + + .md\:hover\:bg-teal-light:hover { + background-color: #64d5ca; + } + + .md\:hover\:bg-teal-lighter:hover { + background-color: #a0f0ed; + } + + .md\:hover\:bg-teal-lightest:hover { + background-color: #e8fffe; + } + + .md\:hover\:bg-blue-darkest:hover { + background-color: #12283a; + } + + .md\:hover\:bg-blue-darker:hover { + background-color: #1c3d5a; + } + + .md\:hover\:bg-blue-dark:hover { + background-color: #2779bd; + } + + .md\:hover\:bg-blue:hover { + background-color: #3490dc; + } + + .md\:hover\:bg-blue-light:hover { + background-color: #6cb2eb; + } + + .md\:hover\:bg-blue-lighter:hover { + background-color: #bcdefa; + } + + .md\:hover\:bg-blue-lightest:hover { + background-color: #eff8ff; + } + + .md\:hover\:bg-indigo-darkest:hover { + background-color: #191e38; + } + + .md\:hover\:bg-indigo-darker:hover { + background-color: #2f365f; + } + + .md\:hover\:bg-indigo-dark:hover { + background-color: #5661b3; + } + + .md\:hover\:bg-indigo:hover { + background-color: #6574cd; + } + + .md\:hover\:bg-indigo-light:hover { + background-color: #7886d7; + } + + .md\:hover\:bg-indigo-lighter:hover { + background-color: #b2b7ff; + } + + .md\:hover\:bg-indigo-lightest:hover { + background-color: #e6e8ff; + } + + .md\:hover\:bg-purple-darkest:hover { + background-color: #21183c; + } + + .md\:hover\:bg-purple-darker:hover { + background-color: #382b5f; + } + + .md\:hover\:bg-purple-dark:hover { + background-color: #794acf; + } + + .md\:hover\:bg-purple:hover { + background-color: #9561e2; + } + + .md\:hover\:bg-purple-light:hover { + background-color: #a779e9; + } + + .md\:hover\:bg-purple-lighter:hover { + background-color: #d6bbfc; + } + + .md\:hover\:bg-purple-lightest:hover { + background-color: #f3ebff; + } + + .md\:hover\:bg-pink-darkest:hover { + background-color: #451225; + } + + .md\:hover\:bg-pink-darker:hover { + background-color: #6f213f; + } + + .md\:hover\:bg-pink-dark:hover { + background-color: #eb5286; + } + + .md\:hover\:bg-pink:hover { + background-color: #f66d9b; + } + + .md\:hover\:bg-pink-light:hover { + background-color: #fa7ea8; + } + + .md\:hover\:bg-pink-lighter:hover { + background-color: #ffbbca; + } + + .md\:hover\:bg-pink-lightest:hover { + background-color: #ffebef; + } + + .md\:focus\:bg-transparent:focus { + background-color: transparent; + } + + .md\:focus\:bg-black:focus { + background-color: #22292f; + } + + .md\:focus\:bg-grey-darkest:focus { + background-color: #3d4852; + } + + .md\:focus\:bg-grey-darker:focus { + background-color: #606f7b; + } + + .md\:focus\:bg-grey-dark:focus { + background-color: #8795a1; + } + + .md\:focus\:bg-grey:focus { + background-color: #b8c2cc; + } + + .md\:focus\:bg-grey-light:focus { + background-color: #dae1e7; + } + + .md\:focus\:bg-grey-lighter:focus { + background-color: #f1f5f8; + } + + .md\:focus\:bg-grey-lightest:focus { + background-color: #f8fafc; + } + + .md\:focus\:bg-white:focus { + background-color: #fff; + } + + .md\:focus\:bg-red-darkest:focus { + background-color: #3b0d0c; + } + + .md\:focus\:bg-red-darker:focus { + background-color: #621b18; + } + + .md\:focus\:bg-red-dark:focus { + background-color: #cc1f1a; + } + + .md\:focus\:bg-red:focus { + background-color: #e3342f; + } + + .md\:focus\:bg-red-light:focus { + background-color: #ef5753; + } + + .md\:focus\:bg-red-lighter:focus { + background-color: #f9acaa; + } + + .md\:focus\:bg-red-lightest:focus { + background-color: #fcebea; + } + + .md\:focus\:bg-orange-darkest:focus { + background-color: #462a16; + } + + .md\:focus\:bg-orange-darker:focus { + background-color: #613b1f; + } + + .md\:focus\:bg-orange-dark:focus { + background-color: #de751f; + } + + .md\:focus\:bg-orange:focus { + background-color: #f6993f; + } + + .md\:focus\:bg-orange-light:focus { + background-color: #faad63; + } + + .md\:focus\:bg-orange-lighter:focus { + background-color: #fcd9b6; + } + + .md\:focus\:bg-orange-lightest:focus { + background-color: #fff5eb; + } + + .md\:focus\:bg-yellow-darkest:focus { + background-color: #453411; + } + + .md\:focus\:bg-yellow-darker:focus { + background-color: #684f1d; + } + + .md\:focus\:bg-yellow-dark:focus { + background-color: #f2d024; + } + + .md\:focus\:bg-yellow:focus { + background-color: #ffed4a; + } + + .md\:focus\:bg-yellow-light:focus { + background-color: #fff382; + } + + .md\:focus\:bg-yellow-lighter:focus { + background-color: #fff9c2; + } + + .md\:focus\:bg-yellow-lightest:focus { + background-color: #fcfbeb; + } + + .md\:focus\:bg-green-darkest:focus { + background-color: #0f2f21; + } + + .md\:focus\:bg-green-darker:focus { + background-color: #1a4731; + } + + .md\:focus\:bg-green-dark:focus { + background-color: #1f9d55; + } + + .md\:focus\:bg-green:focus { + background-color: #38c172; + } + + .md\:focus\:bg-green-light:focus { + background-color: #51d88a; + } + + .md\:focus\:bg-green-lighter:focus { + background-color: #a2f5bf; + } + + .md\:focus\:bg-green-lightest:focus { + background-color: #e3fcec; + } + + .md\:focus\:bg-teal-darkest:focus { + background-color: #0d3331; + } + + .md\:focus\:bg-teal-darker:focus { + background-color: #20504f; + } + + .md\:focus\:bg-teal-dark:focus { + background-color: #38a89d; + } + + .md\:focus\:bg-teal:focus { + background-color: #4dc0b5; + } + + .md\:focus\:bg-teal-light:focus { + background-color: #64d5ca; + } + + .md\:focus\:bg-teal-lighter:focus { + background-color: #a0f0ed; + } + + .md\:focus\:bg-teal-lightest:focus { + background-color: #e8fffe; + } + + .md\:focus\:bg-blue-darkest:focus { + background-color: #12283a; + } + + .md\:focus\:bg-blue-darker:focus { + background-color: #1c3d5a; + } + + .md\:focus\:bg-blue-dark:focus { + background-color: #2779bd; + } + + .md\:focus\:bg-blue:focus { + background-color: #3490dc; + } + + .md\:focus\:bg-blue-light:focus { + background-color: #6cb2eb; + } + + .md\:focus\:bg-blue-lighter:focus { + background-color: #bcdefa; + } + + .md\:focus\:bg-blue-lightest:focus { + background-color: #eff8ff; + } + + .md\:focus\:bg-indigo-darkest:focus { + background-color: #191e38; + } + + .md\:focus\:bg-indigo-darker:focus { + background-color: #2f365f; + } + + .md\:focus\:bg-indigo-dark:focus { + background-color: #5661b3; + } + + .md\:focus\:bg-indigo:focus { + background-color: #6574cd; + } + + .md\:focus\:bg-indigo-light:focus { + background-color: #7886d7; + } + + .md\:focus\:bg-indigo-lighter:focus { + background-color: #b2b7ff; + } + + .md\:focus\:bg-indigo-lightest:focus { + background-color: #e6e8ff; + } + + .md\:focus\:bg-purple-darkest:focus { + background-color: #21183c; + } + + .md\:focus\:bg-purple-darker:focus { + background-color: #382b5f; + } + + .md\:focus\:bg-purple-dark:focus { + background-color: #794acf; + } + + .md\:focus\:bg-purple:focus { + background-color: #9561e2; + } + + .md\:focus\:bg-purple-light:focus { + background-color: #a779e9; + } + + .md\:focus\:bg-purple-lighter:focus { + background-color: #d6bbfc; + } + + .md\:focus\:bg-purple-lightest:focus { + background-color: #f3ebff; + } + + .md\:focus\:bg-pink-darkest:focus { + background-color: #451225; + } + + .md\:focus\:bg-pink-darker:focus { + background-color: #6f213f; + } + + .md\:focus\:bg-pink-dark:focus { + background-color: #eb5286; + } + + .md\:focus\:bg-pink:focus { + background-color: #f66d9b; + } + + .md\:focus\:bg-pink-light:focus { + background-color: #fa7ea8; + } + + .md\:focus\:bg-pink-lighter:focus { + background-color: #ffbbca; + } + + .md\:focus\:bg-pink-lightest:focus { + background-color: #ffebef; + } + + .md\:bg-bottom { + background-position: bottom; + } + + .md\:bg-center { + background-position: center; + } + + .md\:bg-left { + background-position: left; + } + + .md\:bg-left-bottom { + background-position: left bottom; + } + + .md\:bg-left-top { + background-position: left top; + } + + .md\:bg-right { + background-position: right; + } + + .md\:bg-right-bottom { + background-position: right bottom; + } + + .md\:bg-right-top { + background-position: right top; + } + + .md\:bg-top { + background-position: top; + } + + .md\:bg-repeat { + background-repeat: repeat; + } + + .md\:bg-no-repeat { + background-repeat: no-repeat; + } + + .md\:bg-repeat-x { + background-repeat: repeat-x; + } + + .md\:bg-repeat-y { + background-repeat: repeat-y; + } + + .md\:bg-auto { + background-size: auto; + } + + .md\:bg-cover { + background-size: cover; + } + + .md\:bg-contain { + background-size: contain; + } + + .md\:border-transparent { + border-color: transparent; + } + + .md\:border-black { + border-color: #22292f; + } + + .md\:border-grey-darkest { + border-color: #3d4852; + } + + .md\:border-grey-darker { + border-color: #606f7b; + } + + .md\:border-grey-dark { + border-color: #8795a1; + } + + .md\:border-grey { + border-color: #b8c2cc; + } + + .md\:border-grey-light { + border-color: #dae1e7; + } + + .md\:border-grey-lighter { + border-color: #f1f5f8; + } + + .md\:border-grey-lightest { + border-color: #f8fafc; + } + + .md\:border-white { + border-color: #fff; + } + + .md\:border-red-darkest { + border-color: #3b0d0c; + } + + .md\:border-red-darker { + border-color: #621b18; + } + + .md\:border-red-dark { + border-color: #cc1f1a; + } + + .md\:border-red { + border-color: #e3342f; + } + + .md\:border-red-light { + border-color: #ef5753; + } + + .md\:border-red-lighter { + border-color: #f9acaa; + } + + .md\:border-red-lightest { + border-color: #fcebea; + } + + .md\:border-orange-darkest { + border-color: #462a16; + } + + .md\:border-orange-darker { + border-color: #613b1f; + } + + .md\:border-orange-dark { + border-color: #de751f; + } + + .md\:border-orange { + border-color: #f6993f; + } + + .md\:border-orange-light { + border-color: #faad63; + } + + .md\:border-orange-lighter { + border-color: #fcd9b6; + } + + .md\:border-orange-lightest { + border-color: #fff5eb; + } + + .md\:border-yellow-darkest { + border-color: #453411; + } + + .md\:border-yellow-darker { + border-color: #684f1d; + } + + .md\:border-yellow-dark { + border-color: #f2d024; + } + + .md\:border-yellow { + border-color: #ffed4a; + } + + .md\:border-yellow-light { + border-color: #fff382; + } + + .md\:border-yellow-lighter { + border-color: #fff9c2; + } + + .md\:border-yellow-lightest { + border-color: #fcfbeb; + } + + .md\:border-green-darkest { + border-color: #0f2f21; + } + + .md\:border-green-darker { + border-color: #1a4731; + } + + .md\:border-green-dark { + border-color: #1f9d55; + } + + .md\:border-green { + border-color: #38c172; + } + + .md\:border-green-light { + border-color: #51d88a; + } + + .md\:border-green-lighter { + border-color: #a2f5bf; + } + + .md\:border-green-lightest { + border-color: #e3fcec; + } + + .md\:border-teal-darkest { + border-color: #0d3331; + } + + .md\:border-teal-darker { + border-color: #20504f; + } + + .md\:border-teal-dark { + border-color: #38a89d; + } + + .md\:border-teal { + border-color: #4dc0b5; + } + + .md\:border-teal-light { + border-color: #64d5ca; + } + + .md\:border-teal-lighter { + border-color: #a0f0ed; + } + + .md\:border-teal-lightest { + border-color: #e8fffe; + } + + .md\:border-blue-darkest { + border-color: #12283a; + } + + .md\:border-blue-darker { + border-color: #1c3d5a; + } + + .md\:border-blue-dark { + border-color: #2779bd; + } + + .md\:border-blue { + border-color: #3490dc; + } + + .md\:border-blue-light { + border-color: #6cb2eb; + } + + .md\:border-blue-lighter { + border-color: #bcdefa; + } + + .md\:border-blue-lightest { + border-color: #eff8ff; + } + + .md\:border-indigo-darkest { + border-color: #191e38; + } + + .md\:border-indigo-darker { + border-color: #2f365f; + } + + .md\:border-indigo-dark { + border-color: #5661b3; + } + + .md\:border-indigo { + border-color: #6574cd; + } + + .md\:border-indigo-light { + border-color: #7886d7; + } + + .md\:border-indigo-lighter { + border-color: #b2b7ff; + } + + .md\:border-indigo-lightest { + border-color: #e6e8ff; + } + + .md\:border-purple-darkest { + border-color: #21183c; + } + + .md\:border-purple-darker { + border-color: #382b5f; + } + + .md\:border-purple-dark { + border-color: #794acf; + } + + .md\:border-purple { + border-color: #9561e2; + } + + .md\:border-purple-light { + border-color: #a779e9; + } + + .md\:border-purple-lighter { + border-color: #d6bbfc; + } + + .md\:border-purple-lightest { + border-color: #f3ebff; + } + + .md\:border-pink-darkest { + border-color: #451225; + } + + .md\:border-pink-darker { + border-color: #6f213f; + } + + .md\:border-pink-dark { + border-color: #eb5286; + } + + .md\:border-pink { + border-color: #f66d9b; + } + + .md\:border-pink-light { + border-color: #fa7ea8; + } + + .md\:border-pink-lighter { + border-color: #ffbbca; + } + + .md\:border-pink-lightest { + border-color: #ffebef; + } + + .md\:hover\:border-transparent:hover { + border-color: transparent; + } + + .md\:hover\:border-black:hover { + border-color: #22292f; + } + + .md\:hover\:border-grey-darkest:hover { + border-color: #3d4852; + } + + .md\:hover\:border-grey-darker:hover { + border-color: #606f7b; + } + + .md\:hover\:border-grey-dark:hover { + border-color: #8795a1; + } + + .md\:hover\:border-grey:hover { + border-color: #b8c2cc; + } + + .md\:hover\:border-grey-light:hover { + border-color: #dae1e7; + } + + .md\:hover\:border-grey-lighter:hover { + border-color: #f1f5f8; + } + + .md\:hover\:border-grey-lightest:hover { + border-color: #f8fafc; + } + + .md\:hover\:border-white:hover { + border-color: #fff; + } + + .md\:hover\:border-red-darkest:hover { + border-color: #3b0d0c; + } + + .md\:hover\:border-red-darker:hover { + border-color: #621b18; + } + + .md\:hover\:border-red-dark:hover { + border-color: #cc1f1a; + } + + .md\:hover\:border-red:hover { + border-color: #e3342f; + } + + .md\:hover\:border-red-light:hover { + border-color: #ef5753; + } + + .md\:hover\:border-red-lighter:hover { + border-color: #f9acaa; + } + + .md\:hover\:border-red-lightest:hover { + border-color: #fcebea; + } + + .md\:hover\:border-orange-darkest:hover { + border-color: #462a16; + } + + .md\:hover\:border-orange-darker:hover { + border-color: #613b1f; + } + + .md\:hover\:border-orange-dark:hover { + border-color: #de751f; + } + + .md\:hover\:border-orange:hover { + border-color: #f6993f; + } + + .md\:hover\:border-orange-light:hover { + border-color: #faad63; + } + + .md\:hover\:border-orange-lighter:hover { + border-color: #fcd9b6; + } + + .md\:hover\:border-orange-lightest:hover { + border-color: #fff5eb; + } + + .md\:hover\:border-yellow-darkest:hover { + border-color: #453411; + } + + .md\:hover\:border-yellow-darker:hover { + border-color: #684f1d; + } + + .md\:hover\:border-yellow-dark:hover { + border-color: #f2d024; + } + + .md\:hover\:border-yellow:hover { + border-color: #ffed4a; + } + + .md\:hover\:border-yellow-light:hover { + border-color: #fff382; + } + + .md\:hover\:border-yellow-lighter:hover { + border-color: #fff9c2; + } + + .md\:hover\:border-yellow-lightest:hover { + border-color: #fcfbeb; + } + + .md\:hover\:border-green-darkest:hover { + border-color: #0f2f21; + } + + .md\:hover\:border-green-darker:hover { + border-color: #1a4731; + } + + .md\:hover\:border-green-dark:hover { + border-color: #1f9d55; + } + + .md\:hover\:border-green:hover { + border-color: #38c172; + } + + .md\:hover\:border-green-light:hover { + border-color: #51d88a; + } + + .md\:hover\:border-green-lighter:hover { + border-color: #a2f5bf; + } + + .md\:hover\:border-green-lightest:hover { + border-color: #e3fcec; + } + + .md\:hover\:border-teal-darkest:hover { + border-color: #0d3331; + } + + .md\:hover\:border-teal-darker:hover { + border-color: #20504f; + } + + .md\:hover\:border-teal-dark:hover { + border-color: #38a89d; + } + + .md\:hover\:border-teal:hover { + border-color: #4dc0b5; + } + + .md\:hover\:border-teal-light:hover { + border-color: #64d5ca; + } + + .md\:hover\:border-teal-lighter:hover { + border-color: #a0f0ed; + } + + .md\:hover\:border-teal-lightest:hover { + border-color: #e8fffe; + } + + .md\:hover\:border-blue-darkest:hover { + border-color: #12283a; + } + + .md\:hover\:border-blue-darker:hover { + border-color: #1c3d5a; + } + + .md\:hover\:border-blue-dark:hover { + border-color: #2779bd; + } + + .md\:hover\:border-blue:hover { + border-color: #3490dc; + } + + .md\:hover\:border-blue-light:hover { + border-color: #6cb2eb; + } + + .md\:hover\:border-blue-lighter:hover { + border-color: #bcdefa; + } + + .md\:hover\:border-blue-lightest:hover { + border-color: #eff8ff; + } + + .md\:hover\:border-indigo-darkest:hover { + border-color: #191e38; + } + + .md\:hover\:border-indigo-darker:hover { + border-color: #2f365f; + } + + .md\:hover\:border-indigo-dark:hover { + border-color: #5661b3; + } + + .md\:hover\:border-indigo:hover { + border-color: #6574cd; + } + + .md\:hover\:border-indigo-light:hover { + border-color: #7886d7; + } + + .md\:hover\:border-indigo-lighter:hover { + border-color: #b2b7ff; + } + + .md\:hover\:border-indigo-lightest:hover { + border-color: #e6e8ff; + } + + .md\:hover\:border-purple-darkest:hover { + border-color: #21183c; + } + + .md\:hover\:border-purple-darker:hover { + border-color: #382b5f; + } + + .md\:hover\:border-purple-dark:hover { + border-color: #794acf; + } + + .md\:hover\:border-purple:hover { + border-color: #9561e2; + } + + .md\:hover\:border-purple-light:hover { + border-color: #a779e9; + } + + .md\:hover\:border-purple-lighter:hover { + border-color: #d6bbfc; + } + + .md\:hover\:border-purple-lightest:hover { + border-color: #f3ebff; + } + + .md\:hover\:border-pink-darkest:hover { + border-color: #451225; + } + + .md\:hover\:border-pink-darker:hover { + border-color: #6f213f; + } + + .md\:hover\:border-pink-dark:hover { + border-color: #eb5286; + } + + .md\:hover\:border-pink:hover { + border-color: #f66d9b; + } + + .md\:hover\:border-pink-light:hover { + border-color: #fa7ea8; + } + + .md\:hover\:border-pink-lighter:hover { + border-color: #ffbbca; + } + + .md\:hover\:border-pink-lightest:hover { + border-color: #ffebef; + } + + .md\:focus\:border-transparent:focus { + border-color: transparent; + } + + .md\:focus\:border-black:focus { + border-color: #22292f; + } + + .md\:focus\:border-grey-darkest:focus { + border-color: #3d4852; + } + + .md\:focus\:border-grey-darker:focus { + border-color: #606f7b; + } + + .md\:focus\:border-grey-dark:focus { + border-color: #8795a1; + } + + .md\:focus\:border-grey:focus { + border-color: #b8c2cc; + } + + .md\:focus\:border-grey-light:focus { + border-color: #dae1e7; + } + + .md\:focus\:border-grey-lighter:focus { + border-color: #f1f5f8; + } + + .md\:focus\:border-grey-lightest:focus { + border-color: #f8fafc; + } + + .md\:focus\:border-white:focus { + border-color: #fff; + } + + .md\:focus\:border-red-darkest:focus { + border-color: #3b0d0c; + } + + .md\:focus\:border-red-darker:focus { + border-color: #621b18; + } + + .md\:focus\:border-red-dark:focus { + border-color: #cc1f1a; + } + + .md\:focus\:border-red:focus { + border-color: #e3342f; + } + + .md\:focus\:border-red-light:focus { + border-color: #ef5753; + } + + .md\:focus\:border-red-lighter:focus { + border-color: #f9acaa; + } + + .md\:focus\:border-red-lightest:focus { + border-color: #fcebea; + } + + .md\:focus\:border-orange-darkest:focus { + border-color: #462a16; + } + + .md\:focus\:border-orange-darker:focus { + border-color: #613b1f; + } + + .md\:focus\:border-orange-dark:focus { + border-color: #de751f; + } + + .md\:focus\:border-orange:focus { + border-color: #f6993f; + } + + .md\:focus\:border-orange-light:focus { + border-color: #faad63; + } + + .md\:focus\:border-orange-lighter:focus { + border-color: #fcd9b6; + } + + .md\:focus\:border-orange-lightest:focus { + border-color: #fff5eb; + } + + .md\:focus\:border-yellow-darkest:focus { + border-color: #453411; + } + + .md\:focus\:border-yellow-darker:focus { + border-color: #684f1d; + } + + .md\:focus\:border-yellow-dark:focus { + border-color: #f2d024; + } + + .md\:focus\:border-yellow:focus { + border-color: #ffed4a; + } + + .md\:focus\:border-yellow-light:focus { + border-color: #fff382; + } + + .md\:focus\:border-yellow-lighter:focus { + border-color: #fff9c2; + } + + .md\:focus\:border-yellow-lightest:focus { + border-color: #fcfbeb; + } + + .md\:focus\:border-green-darkest:focus { + border-color: #0f2f21; + } + + .md\:focus\:border-green-darker:focus { + border-color: #1a4731; + } + + .md\:focus\:border-green-dark:focus { + border-color: #1f9d55; + } + + .md\:focus\:border-green:focus { + border-color: #38c172; + } + + .md\:focus\:border-green-light:focus { + border-color: #51d88a; + } + + .md\:focus\:border-green-lighter:focus { + border-color: #a2f5bf; + } + + .md\:focus\:border-green-lightest:focus { + border-color: #e3fcec; + } + + .md\:focus\:border-teal-darkest:focus { + border-color: #0d3331; + } + + .md\:focus\:border-teal-darker:focus { + border-color: #20504f; + } + + .md\:focus\:border-teal-dark:focus { + border-color: #38a89d; + } + + .md\:focus\:border-teal:focus { + border-color: #4dc0b5; + } + + .md\:focus\:border-teal-light:focus { + border-color: #64d5ca; + } + + .md\:focus\:border-teal-lighter:focus { + border-color: #a0f0ed; + } + + .md\:focus\:border-teal-lightest:focus { + border-color: #e8fffe; + } + + .md\:focus\:border-blue-darkest:focus { + border-color: #12283a; + } + + .md\:focus\:border-blue-darker:focus { + border-color: #1c3d5a; + } + + .md\:focus\:border-blue-dark:focus { + border-color: #2779bd; + } + + .md\:focus\:border-blue:focus { + border-color: #3490dc; + } + + .md\:focus\:border-blue-light:focus { + border-color: #6cb2eb; + } + + .md\:focus\:border-blue-lighter:focus { + border-color: #bcdefa; + } + + .md\:focus\:border-blue-lightest:focus { + border-color: #eff8ff; + } + + .md\:focus\:border-indigo-darkest:focus { + border-color: #191e38; + } + + .md\:focus\:border-indigo-darker:focus { + border-color: #2f365f; + } + + .md\:focus\:border-indigo-dark:focus { + border-color: #5661b3; + } + + .md\:focus\:border-indigo:focus { + border-color: #6574cd; + } + + .md\:focus\:border-indigo-light:focus { + border-color: #7886d7; + } + + .md\:focus\:border-indigo-lighter:focus { + border-color: #b2b7ff; + } + + .md\:focus\:border-indigo-lightest:focus { + border-color: #e6e8ff; + } + + .md\:focus\:border-purple-darkest:focus { + border-color: #21183c; + } + + .md\:focus\:border-purple-darker:focus { + border-color: #382b5f; + } + + .md\:focus\:border-purple-dark:focus { + border-color: #794acf; + } + + .md\:focus\:border-purple:focus { + border-color: #9561e2; + } + + .md\:focus\:border-purple-light:focus { + border-color: #a779e9; + } + + .md\:focus\:border-purple-lighter:focus { + border-color: #d6bbfc; + } + + .md\:focus\:border-purple-lightest:focus { + border-color: #f3ebff; + } + + .md\:focus\:border-pink-darkest:focus { + border-color: #451225; + } + + .md\:focus\:border-pink-darker:focus { + border-color: #6f213f; + } + + .md\:focus\:border-pink-dark:focus { + border-color: #eb5286; + } + + .md\:focus\:border-pink:focus { + border-color: #f66d9b; + } + + .md\:focus\:border-pink-light:focus { + border-color: #fa7ea8; + } + + .md\:focus\:border-pink-lighter:focus { + border-color: #ffbbca; + } + + .md\:focus\:border-pink-lightest:focus { + border-color: #ffebef; + } + + .md\:rounded-none { + border-radius: 0; + } + + .md\:rounded-sm { + border-radius: .125rem; + } + + .md\:rounded { + border-radius: .25rem; + } + + .md\:rounded-lg { + border-radius: .5rem; + } + + .md\:rounded-full { + border-radius: 9999px; + } + + .md\:rounded-t-none { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + + .md\:rounded-r-none { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + + .md\:rounded-b-none { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + } + + .md\:rounded-l-none { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + + .md\:rounded-t-sm { + border-top-left-radius: .125rem; + border-top-right-radius: .125rem; + } + + .md\:rounded-r-sm { + border-top-right-radius: .125rem; + border-bottom-right-radius: .125rem; + } + + .md\:rounded-b-sm { + border-bottom-right-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .md\:rounded-l-sm { + border-top-left-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .md\:rounded-t { + border-top-left-radius: .25rem; + border-top-right-radius: .25rem; + } + + .md\:rounded-r { + border-top-right-radius: .25rem; + border-bottom-right-radius: .25rem; + } + + .md\:rounded-b { + border-bottom-right-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .md\:rounded-l { + border-top-left-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .md\:rounded-t-lg { + border-top-left-radius: .5rem; + border-top-right-radius: .5rem; + } + + .md\:rounded-r-lg { + border-top-right-radius: .5rem; + border-bottom-right-radius: .5rem; + } + + .md\:rounded-b-lg { + border-bottom-right-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .md\:rounded-l-lg { + border-top-left-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .md\:rounded-t-full { + border-top-left-radius: 9999px; + border-top-right-radius: 9999px; + } + + .md\:rounded-r-full { + border-top-right-radius: 9999px; + border-bottom-right-radius: 9999px; + } + + .md\:rounded-b-full { + border-bottom-right-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .md\:rounded-l-full { + border-top-left-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .md\:rounded-tl-none { + border-top-left-radius: 0; + } + + .md\:rounded-tr-none { + border-top-right-radius: 0; + } + + .md\:rounded-br-none { + border-bottom-right-radius: 0; + } + + .md\:rounded-bl-none { + border-bottom-left-radius: 0; + } + + .md\:rounded-tl-sm { + border-top-left-radius: .125rem; + } + + .md\:rounded-tr-sm { + border-top-right-radius: .125rem; + } + + .md\:rounded-br-sm { + border-bottom-right-radius: .125rem; + } + + .md\:rounded-bl-sm { + border-bottom-left-radius: .125rem; + } + + .md\:rounded-tl { + border-top-left-radius: .25rem; + } + + .md\:rounded-tr { + border-top-right-radius: .25rem; + } + + .md\:rounded-br { + border-bottom-right-radius: .25rem; + } + + .md\:rounded-bl { + border-bottom-left-radius: .25rem; + } + + .md\:rounded-tl-lg { + border-top-left-radius: .5rem; + } + + .md\:rounded-tr-lg { + border-top-right-radius: .5rem; + } + + .md\:rounded-br-lg { + border-bottom-right-radius: .5rem; + } + + .md\:rounded-bl-lg { + border-bottom-left-radius: .5rem; + } + + .md\:rounded-tl-full { + border-top-left-radius: 9999px; + } + + .md\:rounded-tr-full { + border-top-right-radius: 9999px; + } + + .md\:rounded-br-full { + border-bottom-right-radius: 9999px; + } + + .md\:rounded-bl-full { + border-bottom-left-radius: 9999px; + } + + .md\:border-solid { + border-style: solid; + } + + .md\:border-dashed { + border-style: dashed; + } + + .md\:border-dotted { + border-style: dotted; + } + + .md\:border-none { + border-style: none; + } + + .md\:border-0 { + border-width: 0; + } + + .md\:border-2 { + border-width: 2px; + } + + .md\:border-4 { + border-width: 4px; + } + + .md\:border-8 { + border-width: 8px; + } + + .md\:border { + border-width: 1px; + } + + .md\:border-t-0 { + border-top-width: 0; + } + + .md\:border-r-0 { + border-right-width: 0; + } + + .md\:border-b-0 { + border-bottom-width: 0; + } + + .md\:border-l-0 { + border-left-width: 0; + } + + .md\:border-t-2 { + border-top-width: 2px; + } + + .md\:border-r-2 { + border-right-width: 2px; + } + + .md\:border-b-2 { + border-bottom-width: 2px; + } + + .md\:border-l-2 { + border-left-width: 2px; + } + + .md\:border-t-4 { + border-top-width: 4px; + } + + .md\:border-r-4 { + border-right-width: 4px; + } + + .md\:border-b-4 { + border-bottom-width: 4px; + } + + .md\:border-l-4 { + border-left-width: 4px; + } + + .md\:border-t-8 { + border-top-width: 8px; + } + + .md\:border-r-8 { + border-right-width: 8px; + } + + .md\:border-b-8 { + border-bottom-width: 8px; + } + + .md\:border-l-8 { + border-left-width: 8px; + } + + .md\:border-t { + border-top-width: 1px; + } + + .md\:border-r { + border-right-width: 1px; + } + + .md\:border-b { + border-bottom-width: 1px; + } + + .md\:border-l { + border-left-width: 1px; + } + + .md\:cursor-auto { + cursor: auto; + } + + .md\:cursor-default { + cursor: default; + } + + .md\:cursor-pointer { + cursor: pointer; + } + + .md\:cursor-wait { + cursor: wait; + } + + .md\:cursor-move { + cursor: move; + } + + .md\:cursor-not-allowed { + cursor: not-allowed; + } + + .md\:block { + display: block; + } + + .md\:inline-block { + display: inline-block; + } + + .md\:inline { + display: inline; + } + + .md\:table { + display: table; + } + + .md\:table-row { + display: table-row; + } + + .md\:table-cell { + display: table-cell; + } + + .md\:hidden { + display: none; + } + + .md\:flex { + display: flex; + } + + .md\:inline-flex { + display: inline-flex; + } + + .md\:flex-row { + flex-direction: row; + } + + .md\:flex-row-reverse { + flex-direction: row-reverse; + } + + .md\:flex-col { + flex-direction: column; + } + + .md\:flex-col-reverse { + flex-direction: column-reverse; + } + + .md\:flex-wrap { + flex-wrap: wrap; + } + + .md\:flex-wrap-reverse { + flex-wrap: wrap-reverse; + } + + .md\:flex-no-wrap { + flex-wrap: nowrap; + } + + .md\:items-start { + align-items: flex-start; + } + + .md\:items-end { + align-items: flex-end; + } + + .md\:items-center { + align-items: center; + } + + .md\:items-baseline { + align-items: baseline; + } + + .md\:items-stretch { + align-items: stretch; + } + + .md\:self-auto { + align-self: auto; + } + + .md\:self-start { + align-self: flex-start; + } + + .md\:self-end { + align-self: flex-end; + } + + .md\:self-center { + align-self: center; + } + + .md\:self-stretch { + align-self: stretch; + } + + .md\:justify-start { + justify-content: flex-start; + } + + .md\:justify-end { + justify-content: flex-end; + } + + .md\:justify-center { + justify-content: center; + } + + .md\:justify-between { + justify-content: space-between; + } + + .md\:justify-around { + justify-content: space-around; + } + + .md\:content-center { + align-content: center; + } + + .md\:content-start { + align-content: flex-start; + } + + .md\:content-end { + align-content: flex-end; + } + + .md\:content-between { + align-content: space-between; + } + + .md\:content-around { + align-content: space-around; + } + + .md\:flex-1 { + flex: 1 1 0%; + } + + .md\:flex-auto { + flex: 1 1 auto; + } + + .md\:flex-initial { + flex: 0 1 auto; + } + + .md\:flex-none { + flex: none; + } + + .md\:flex-grow { + flex-grow: 1; + } + + .md\:flex-shrink { + flex-shrink: 1; + } + + .md\:flex-no-grow { + flex-grow: 0; + } + + .md\:flex-no-shrink { + flex-shrink: 0; + } + + .md\:float-right { + float: right; + } + + .md\:float-left { + float: left; + } + + .md\:float-none { + float: none; + } + + .md\:clearfix:after { + content: ""; + display: table; + clear: both; + } + + .md\:font-sans { + font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; + } + + .md\:font-serif { + font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; + } + + .md\:font-mono { + font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; + } + + .md\:font-hairline { + font-weight: 100; + } + + .md\:font-thin { + font-weight: 200; + } + + .md\:font-light { + font-weight: 300; + } + + .md\:font-normal { + font-weight: 400; + } + + .md\:font-medium { + font-weight: 500; + } + + .md\:font-semibold { + font-weight: 600; + } + + .md\:font-bold { + font-weight: 700; + } + + .md\:font-extrabold { + font-weight: 800; + } + + .md\:font-black { + font-weight: 900; + } + + .md\:hover\:font-hairline:hover { + font-weight: 100; + } + + .md\:hover\:font-thin:hover { + font-weight: 200; + } + + .md\:hover\:font-light:hover { + font-weight: 300; + } + + .md\:hover\:font-normal:hover { + font-weight: 400; + } + + .md\:hover\:font-medium:hover { + font-weight: 500; + } + + .md\:hover\:font-semibold:hover { + font-weight: 600; + } + + .md\:hover\:font-bold:hover { + font-weight: 700; + } + + .md\:hover\:font-extrabold:hover { + font-weight: 800; + } + + .md\:hover\:font-black:hover { + font-weight: 900; + } + + .md\:focus\:font-hairline:focus { + font-weight: 100; + } + + .md\:focus\:font-thin:focus { + font-weight: 200; + } + + .md\:focus\:font-light:focus { + font-weight: 300; + } + + .md\:focus\:font-normal:focus { + font-weight: 400; + } + + .md\:focus\:font-medium:focus { + font-weight: 500; + } + + .md\:focus\:font-semibold:focus { + font-weight: 600; + } + + .md\:focus\:font-bold:focus { + font-weight: 700; + } + + .md\:focus\:font-extrabold:focus { + font-weight: 800; + } + + .md\:focus\:font-black:focus { + font-weight: 900; + } + + .md\:h-1 { + height: .25rem; + } + + .md\:h-2 { + height: .5rem; + } + + .md\:h-3 { + height: .75rem; + } + + .md\:h-4 { + height: 1rem; + } + + .md\:h-5 { + height: 1.25rem; + } + + .md\:h-6 { + height: 1.5rem; + } + + .md\:h-8 { + height: 2rem; + } + + .md\:h-10 { + height: 2.5rem; + } + + .md\:h-12 { + height: 3rem; + } + + .md\:h-16 { + height: 4rem; + } + + .md\:h-24 { + height: 6rem; + } + + .md\:h-32 { + height: 8rem; + } + + .md\:h-48 { + height: 12rem; + } + + .md\:h-64 { + height: 16rem; + } + + .md\:h-auto { + height: auto; + } + + .md\:h-px { + height: 1px; + } + + .md\:h-full { + height: 100%; + } + + .md\:h-screen { + height: 100vh; + } + + .md\:leading-none { + line-height: 1; + } + + .md\:leading-tight { + line-height: 1.25; + } + + .md\:leading-normal { + line-height: 1.5; + } + + .md\:leading-loose { + line-height: 2; + } + + .md\:m-0 { + margin: 0; + } + + .md\:m-1 { + margin: .25rem; + } + + .md\:m-2 { + margin: .5rem; + } + + .md\:m-3 { + margin: .75rem; + } + + .md\:m-4 { + margin: 1rem; + } + + .md\:m-5 { + margin: 1.25rem; + } + + .md\:m-6 { + margin: 1.5rem; + } + + .md\:m-8 { + margin: 2rem; + } + + .md\:m-10 { + margin: 2.5rem; + } + + .md\:m-12 { + margin: 3rem; + } + + .md\:m-16 { + margin: 4rem; + } + + .md\:m-20 { + margin: 5rem; + } + + .md\:m-24 { + margin: 6rem; + } + + .md\:m-32 { + margin: 8rem; + } + + .md\:m-auto { + margin: auto; + } + + .md\:m-px { + margin: 1px; + } + + .md\:my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .md\:mx-0 { + margin-left: 0; + margin-right: 0; + } + + .md\:my-1 { + margin-top: .25rem; + margin-bottom: .25rem; + } + + .md\:mx-1 { + margin-left: .25rem; + margin-right: .25rem; + } + + .md\:my-2 { + margin-top: .5rem; + margin-bottom: .5rem; + } + + .md\:mx-2 { + margin-left: .5rem; + margin-right: .5rem; + } + + .md\:my-3 { + margin-top: .75rem; + margin-bottom: .75rem; + } + + .md\:mx-3 { + margin-left: .75rem; + margin-right: .75rem; + } + + .md\:my-4 { + margin-top: 1rem; + margin-bottom: 1rem; + } + + .md\:mx-4 { + margin-left: 1rem; + margin-right: 1rem; + } + + .md\:my-5 { + margin-top: 1.25rem; + margin-bottom: 1.25rem; + } + + .md\:mx-5 { + margin-left: 1.25rem; + margin-right: 1.25rem; + } + + .md\:my-6 { + margin-top: 1.5rem; + margin-bottom: 1.5rem; + } + + .md\:mx-6 { + margin-left: 1.5rem; + margin-right: 1.5rem; + } + + .md\:my-8 { + margin-top: 2rem; + margin-bottom: 2rem; + } + + .md\:mx-8 { + margin-left: 2rem; + margin-right: 2rem; + } + + .md\:my-10 { + margin-top: 2.5rem; + margin-bottom: 2.5rem; + } + + .md\:mx-10 { + margin-left: 2.5rem; + margin-right: 2.5rem; + } + + .md\:my-12 { + margin-top: 3rem; + margin-bottom: 3rem; + } + + .md\:mx-12 { + margin-left: 3rem; + margin-right: 3rem; + } + + .md\:my-16 { + margin-top: 4rem; + margin-bottom: 4rem; + } + + .md\:mx-16 { + margin-left: 4rem; + margin-right: 4rem; + } + + .md\:my-20 { + margin-top: 5rem; + margin-bottom: 5rem; + } + + .md\:mx-20 { + margin-left: 5rem; + margin-right: 5rem; + } + + .md\:my-24 { + margin-top: 6rem; + margin-bottom: 6rem; + } + + .md\:mx-24 { + margin-left: 6rem; + margin-right: 6rem; + } + + .md\:my-32 { + margin-top: 8rem; + margin-bottom: 8rem; + } + + .md\:mx-32 { + margin-left: 8rem; + margin-right: 8rem; + } + + .md\:my-auto { + margin-top: auto; + margin-bottom: auto; + } + + .md\:mx-auto { + margin-left: auto; + margin-right: auto; + } + + .md\:my-px { + margin-top: 1px; + margin-bottom: 1px; + } + + .md\:mx-px { + margin-left: 1px; + margin-right: 1px; + } + + .md\:mt-0 { + margin-top: 0; + } + + .md\:mr-0 { + margin-right: 0; + } + + .md\:mb-0 { + margin-bottom: 0; + } + + .md\:ml-0 { + margin-left: 0; + } + + .md\:mt-1 { + margin-top: .25rem; + } + + .md\:mr-1 { + margin-right: .25rem; + } + + .md\:mb-1 { + margin-bottom: .25rem; + } + + .md\:ml-1 { + margin-left: .25rem; + } + + .md\:mt-2 { + margin-top: .5rem; + } + + .md\:mr-2 { + margin-right: .5rem; + } + + .md\:mb-2 { + margin-bottom: .5rem; + } + + .md\:ml-2 { + margin-left: .5rem; + } + + .md\:mt-3 { + margin-top: .75rem; + } + + .md\:mr-3 { + margin-right: .75rem; + } + + .md\:mb-3 { + margin-bottom: .75rem; + } + + .md\:ml-3 { + margin-left: .75rem; + } + + .md\:mt-4 { + margin-top: 1rem; + } + + .md\:mr-4 { + margin-right: 1rem; + } + + .md\:mb-4 { + margin-bottom: 1rem; + } + + .md\:ml-4 { + margin-left: 1rem; + } + + .md\:mt-5 { + margin-top: 1.25rem; + } + + .md\:mr-5 { + margin-right: 1.25rem; + } + + .md\:mb-5 { + margin-bottom: 1.25rem; + } + + .md\:ml-5 { + margin-left: 1.25rem; + } + + .md\:mt-6 { + margin-top: 1.5rem; + } + + .md\:mr-6 { + margin-right: 1.5rem; + } + + .md\:mb-6 { + margin-bottom: 1.5rem; + } + + .md\:ml-6 { + margin-left: 1.5rem; + } + + .md\:mt-8 { + margin-top: 2rem; + } + + .md\:mr-8 { + margin-right: 2rem; + } + + .md\:mb-8 { + margin-bottom: 2rem; + } + + .md\:ml-8 { + margin-left: 2rem; + } + + .md\:mt-10 { + margin-top: 2.5rem; + } + + .md\:mr-10 { + margin-right: 2.5rem; + } + + .md\:mb-10 { + margin-bottom: 2.5rem; + } + + .md\:ml-10 { + margin-left: 2.5rem; + } + + .md\:mt-12 { + margin-top: 3rem; + } + + .md\:mr-12 { + margin-right: 3rem; + } + + .md\:mb-12 { + margin-bottom: 3rem; + } + + .md\:ml-12 { + margin-left: 3rem; + } + + .md\:mt-16 { + margin-top: 4rem; + } + + .md\:mr-16 { + margin-right: 4rem; + } + + .md\:mb-16 { + margin-bottom: 4rem; + } + + .md\:ml-16 { + margin-left: 4rem; + } + + .md\:mt-20 { + margin-top: 5rem; + } + + .md\:mr-20 { + margin-right: 5rem; + } + + .md\:mb-20 { + margin-bottom: 5rem; + } + + .md\:ml-20 { + margin-left: 5rem; + } + + .md\:mt-24 { + margin-top: 6rem; + } + + .md\:mr-24 { + margin-right: 6rem; + } + + .md\:mb-24 { + margin-bottom: 6rem; + } + + .md\:ml-24 { + margin-left: 6rem; + } + + .md\:mt-32 { + margin-top: 8rem; + } + + .md\:mr-32 { + margin-right: 8rem; + } + + .md\:mb-32 { + margin-bottom: 8rem; + } + + .md\:ml-32 { + margin-left: 8rem; + } + + .md\:mt-auto { + margin-top: auto; + } + + .md\:mr-auto { + margin-right: auto; + } + + .md\:mb-auto { + margin-bottom: auto; + } + + .md\:ml-auto { + margin-left: auto; + } + + .md\:mt-px { + margin-top: 1px; + } + + .md\:mr-px { + margin-right: 1px; + } + + .md\:mb-px { + margin-bottom: 1px; + } + + .md\:ml-px { + margin-left: 1px; + } + + .md\:max-h-full { + max-height: 100%; + } + + .md\:max-h-screen { + max-height: 100vh; + } + + .md\:max-w-xs { + max-width: 20rem; + } + + .md\:max-w-sm { + max-width: 30rem; + } + + .md\:max-w-md { + max-width: 40rem; + } + + .md\:max-w-lg { + max-width: 50rem; + } + + .md\:max-w-xl { + max-width: 60rem; + } + + .md\:max-w-2xl { + max-width: 70rem; + } + + .md\:max-w-3xl { + max-width: 80rem; + } + + .md\:max-w-4xl { + max-width: 90rem; + } + + .md\:max-w-5xl { + max-width: 100rem; + } + + .md\:max-w-full { + max-width: 100%; + } + + .md\:min-h-0 { + min-height: 0; + } + + .md\:min-h-full { + min-height: 100%; + } + + .md\:min-h-screen { + min-height: 100vh; + } + + .md\:min-w-0 { + min-width: 0; + } + + .md\:min-w-full { + min-width: 100%; + } + + .md\:-m-0 { + margin: 0; + } + + .md\:-m-1 { + margin: -0.25rem; + } + + .md\:-m-2 { + margin: -0.5rem; + } + + .md\:-m-3 { + margin: -0.75rem; + } + + .md\:-m-4 { + margin: -1rem; + } + + .md\:-m-5 { + margin: -1.25rem; + } + + .md\:-m-6 { + margin: -1.5rem; + } + + .md\:-m-8 { + margin: -2rem; + } + + .md\:-m-10 { + margin: -2.5rem; + } + + .md\:-m-12 { + margin: -3rem; + } + + .md\:-m-16 { + margin: -4rem; + } + + .md\:-m-20 { + margin: -5rem; + } + + .md\:-m-24 { + margin: -6rem; + } + + .md\:-m-32 { + margin: -8rem; + } + + .md\:-m-px { + margin: -1px; + } + + .md\:-my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .md\:-mx-0 { + margin-left: 0; + margin-right: 0; + } + + .md\:-my-1 { + margin-top: -0.25rem; + margin-bottom: -0.25rem; + } + + .md\:-mx-1 { + margin-left: -0.25rem; + margin-right: -0.25rem; + } + + .md\:-my-2 { + margin-top: -0.5rem; + margin-bottom: -0.5rem; + } + + .md\:-mx-2 { + margin-left: -0.5rem; + margin-right: -0.5rem; + } + + .md\:-my-3 { + margin-top: -0.75rem; + margin-bottom: -0.75rem; + } + + .md\:-mx-3 { + margin-left: -0.75rem; + margin-right: -0.75rem; + } + + .md\:-my-4 { + margin-top: -1rem; + margin-bottom: -1rem; + } + + .md\:-mx-4 { + margin-left: -1rem; + margin-right: -1rem; + } + + .md\:-my-5 { + margin-top: -1.25rem; + margin-bottom: -1.25rem; + } + + .md\:-mx-5 { + margin-left: -1.25rem; + margin-right: -1.25rem; + } + + .md\:-my-6 { + margin-top: -1.5rem; + margin-bottom: -1.5rem; + } + + .md\:-mx-6 { + margin-left: -1.5rem; + margin-right: -1.5rem; + } + + .md\:-my-8 { + margin-top: -2rem; + margin-bottom: -2rem; + } + + .md\:-mx-8 { + margin-left: -2rem; + margin-right: -2rem; + } + + .md\:-my-10 { + margin-top: -2.5rem; + margin-bottom: -2.5rem; + } + + .md\:-mx-10 { + margin-left: -2.5rem; + margin-right: -2.5rem; + } + + .md\:-my-12 { + margin-top: -3rem; + margin-bottom: -3rem; + } + + .md\:-mx-12 { + margin-left: -3rem; + margin-right: -3rem; + } + + .md\:-my-16 { + margin-top: -4rem; + margin-bottom: -4rem; + } + + .md\:-mx-16 { + margin-left: -4rem; + margin-right: -4rem; + } + + .md\:-my-20 { + margin-top: -5rem; + margin-bottom: -5rem; + } + + .md\:-mx-20 { + margin-left: -5rem; + margin-right: -5rem; + } + + .md\:-my-24 { + margin-top: -6rem; + margin-bottom: -6rem; + } + + .md\:-mx-24 { + margin-left: -6rem; + margin-right: -6rem; + } + + .md\:-my-32 { + margin-top: -8rem; + margin-bottom: -8rem; + } + + .md\:-mx-32 { + margin-left: -8rem; + margin-right: -8rem; + } + + .md\:-my-px { + margin-top: -1px; + margin-bottom: -1px; + } + + .md\:-mx-px { + margin-left: -1px; + margin-right: -1px; + } + + .md\:-mt-0 { + margin-top: 0; + } + + .md\:-mr-0 { + margin-right: 0; + } + + .md\:-mb-0 { + margin-bottom: 0; + } + + .md\:-ml-0 { + margin-left: 0; + } + + .md\:-mt-1 { + margin-top: -0.25rem; + } + + .md\:-mr-1 { + margin-right: -0.25rem; + } + + .md\:-mb-1 { + margin-bottom: -0.25rem; + } + + .md\:-ml-1 { + margin-left: -0.25rem; + } + + .md\:-mt-2 { + margin-top: -0.5rem; + } + + .md\:-mr-2 { + margin-right: -0.5rem; + } + + .md\:-mb-2 { + margin-bottom: -0.5rem; + } + + .md\:-ml-2 { + margin-left: -0.5rem; + } + + .md\:-mt-3 { + margin-top: -0.75rem; + } + + .md\:-mr-3 { + margin-right: -0.75rem; + } + + .md\:-mb-3 { + margin-bottom: -0.75rem; + } + + .md\:-ml-3 { + margin-left: -0.75rem; + } + + .md\:-mt-4 { + margin-top: -1rem; + } + + .md\:-mr-4 { + margin-right: -1rem; + } + + .md\:-mb-4 { + margin-bottom: -1rem; + } + + .md\:-ml-4 { + margin-left: -1rem; + } + + .md\:-mt-5 { + margin-top: -1.25rem; + } + + .md\:-mr-5 { + margin-right: -1.25rem; + } + + .md\:-mb-5 { + margin-bottom: -1.25rem; + } + + .md\:-ml-5 { + margin-left: -1.25rem; + } + + .md\:-mt-6 { + margin-top: -1.5rem; + } + + .md\:-mr-6 { + margin-right: -1.5rem; + } + + .md\:-mb-6 { + margin-bottom: -1.5rem; + } + + .md\:-ml-6 { + margin-left: -1.5rem; + } + + .md\:-mt-8 { + margin-top: -2rem; + } + + .md\:-mr-8 { + margin-right: -2rem; + } + + .md\:-mb-8 { + margin-bottom: -2rem; + } + + .md\:-ml-8 { + margin-left: -2rem; + } + + .md\:-mt-10 { + margin-top: -2.5rem; + } + + .md\:-mr-10 { + margin-right: -2.5rem; + } + + .md\:-mb-10 { + margin-bottom: -2.5rem; + } + + .md\:-ml-10 { + margin-left: -2.5rem; + } + + .md\:-mt-12 { + margin-top: -3rem; + } + + .md\:-mr-12 { + margin-right: -3rem; + } + + .md\:-mb-12 { + margin-bottom: -3rem; + } + + .md\:-ml-12 { + margin-left: -3rem; + } + + .md\:-mt-16 { + margin-top: -4rem; + } + + .md\:-mr-16 { + margin-right: -4rem; + } + + .md\:-mb-16 { + margin-bottom: -4rem; + } + + .md\:-ml-16 { + margin-left: -4rem; + } + + .md\:-mt-20 { + margin-top: -5rem; + } + + .md\:-mr-20 { + margin-right: -5rem; + } + + .md\:-mb-20 { + margin-bottom: -5rem; + } + + .md\:-ml-20 { + margin-left: -5rem; + } + + .md\:-mt-24 { + margin-top: -6rem; + } + + .md\:-mr-24 { + margin-right: -6rem; + } + + .md\:-mb-24 { + margin-bottom: -6rem; + } + + .md\:-ml-24 { + margin-left: -6rem; + } + + .md\:-mt-32 { + margin-top: -8rem; + } + + .md\:-mr-32 { + margin-right: -8rem; + } + + .md\:-mb-32 { + margin-bottom: -8rem; + } + + .md\:-ml-32 { + margin-left: -8rem; + } + + .md\:-mt-px { + margin-top: -1px; + } + + .md\:-mr-px { + margin-right: -1px; + } + + .md\:-mb-px { + margin-bottom: -1px; + } + + .md\:-ml-px { + margin-left: -1px; + } + + .md\:opacity-0 { + opacity: 0; + } + + .md\:opacity-25 { + opacity: .25; + } + + .md\:opacity-50 { + opacity: .5; + } + + .md\:opacity-75 { + opacity: .75; + } + + .md\:opacity-100 { + opacity: 1; + } + + .md\:overflow-auto { + overflow: auto; + } + + .md\:overflow-hidden { + overflow: hidden; + } + + .md\:overflow-visible { + overflow: visible; + } + + .md\:overflow-scroll { + overflow: scroll; + } + + .md\:overflow-x-auto { + overflow-x: auto; + } + + .md\:overflow-y-auto { + overflow-y: auto; + } + + .md\:overflow-x-hidden { + overflow-x: hidden; + } + + .md\:overflow-y-hidden { + overflow-y: hidden; + } + + .md\:overflow-x-visible { + overflow-x: visible; + } + + .md\:overflow-y-visible { + overflow-y: visible; + } + + .md\:overflow-x-scroll { + overflow-x: scroll; + } + + .md\:overflow-y-scroll { + overflow-y: scroll; + } + + .md\:scrolling-touch { + -webkit-overflow-scrolling: touch; + } + + .md\:scrolling-auto { + -webkit-overflow-scrolling: auto; + } + + .md\:p-0 { + padding: 0; + } + + .md\:p-1 { + padding: .25rem; + } + + .md\:p-2 { + padding: .5rem; + } + + .md\:p-3 { + padding: .75rem; + } + + .md\:p-4 { + padding: 1rem; + } + + .md\:p-5 { + padding: 1.25rem; + } + + .md\:p-6 { + padding: 1.5rem; + } + + .md\:p-8 { + padding: 2rem; + } + + .md\:p-10 { + padding: 2.5rem; + } + + .md\:p-12 { + padding: 3rem; + } + + .md\:p-16 { + padding: 4rem; + } + + .md\:p-20 { + padding: 5rem; + } + + .md\:p-24 { + padding: 6rem; + } + + .md\:p-32 { + padding: 8rem; + } + + .md\:p-px { + padding: 1px; + } + + .md\:py-0 { + padding-top: 0; + padding-bottom: 0; + } + + .md\:px-0 { + padding-left: 0; + padding-right: 0; + } + + .md\:py-1 { + padding-top: .25rem; + padding-bottom: .25rem; + } + + .md\:px-1 { + padding-left: .25rem; + padding-right: .25rem; + } + + .md\:py-2 { + padding-top: .5rem; + padding-bottom: .5rem; + } + + .md\:px-2 { + padding-left: .5rem; + padding-right: .5rem; + } + + .md\:py-3 { + padding-top: .75rem; + padding-bottom: .75rem; + } + + .md\:px-3 { + padding-left: .75rem; + padding-right: .75rem; + } + + .md\:py-4 { + padding-top: 1rem; + padding-bottom: 1rem; + } + + .md\:px-4 { + padding-left: 1rem; + padding-right: 1rem; + } + + .md\:py-5 { + padding-top: 1.25rem; + padding-bottom: 1.25rem; + } + + .md\:px-5 { + padding-left: 1.25rem; + padding-right: 1.25rem; + } + + .md\:py-6 { + padding-top: 1.5rem; + padding-bottom: 1.5rem; + } + + .md\:px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; + } + + .md\:py-8 { + padding-top: 2rem; + padding-bottom: 2rem; + } + + .md\:px-8 { + padding-left: 2rem; + padding-right: 2rem; + } + + .md\:py-10 { + padding-top: 2.5rem; + padding-bottom: 2.5rem; + } + + .md\:px-10 { + padding-left: 2.5rem; + padding-right: 2.5rem; + } + + .md\:py-12 { + padding-top: 3rem; + padding-bottom: 3rem; + } + + .md\:px-12 { + padding-left: 3rem; + padding-right: 3rem; + } + + .md\:py-16 { + padding-top: 4rem; + padding-bottom: 4rem; + } + + .md\:px-16 { + padding-left: 4rem; + padding-right: 4rem; + } + + .md\:py-20 { + padding-top: 5rem; + padding-bottom: 5rem; + } + + .md\:px-20 { + padding-left: 5rem; + padding-right: 5rem; + } + + .md\:py-24 { + padding-top: 6rem; + padding-bottom: 6rem; + } + + .md\:px-24 { + padding-left: 6rem; + padding-right: 6rem; + } + + .md\:py-32 { + padding-top: 8rem; + padding-bottom: 8rem; + } + + .md\:px-32 { + padding-left: 8rem; + padding-right: 8rem; + } + + .md\:py-px { + padding-top: 1px; + padding-bottom: 1px; + } + + .md\:px-px { + padding-left: 1px; + padding-right: 1px; + } + + .md\:pt-0 { + padding-top: 0; + } + + .md\:pr-0 { + padding-right: 0; + } + + .md\:pb-0 { + padding-bottom: 0; + } + + .md\:pl-0 { + padding-left: 0; + } + + .md\:pt-1 { + padding-top: .25rem; + } + + .md\:pr-1 { + padding-right: .25rem; + } + + .md\:pb-1 { + padding-bottom: .25rem; + } + + .md\:pl-1 { + padding-left: .25rem; + } + + .md\:pt-2 { + padding-top: .5rem; + } + + .md\:pr-2 { + padding-right: .5rem; + } + + .md\:pb-2 { + padding-bottom: .5rem; + } + + .md\:pl-2 { + padding-left: .5rem; + } + + .md\:pt-3 { + padding-top: .75rem; + } + + .md\:pr-3 { + padding-right: .75rem; + } + + .md\:pb-3 { + padding-bottom: .75rem; + } + + .md\:pl-3 { + padding-left: .75rem; + } + + .md\:pt-4 { + padding-top: 1rem; + } + + .md\:pr-4 { + padding-right: 1rem; + } + + .md\:pb-4 { + padding-bottom: 1rem; + } + + .md\:pl-4 { + padding-left: 1rem; + } + + .md\:pt-5 { + padding-top: 1.25rem; + } + + .md\:pr-5 { + padding-right: 1.25rem; + } + + .md\:pb-5 { + padding-bottom: 1.25rem; + } + + .md\:pl-5 { + padding-left: 1.25rem; + } + + .md\:pt-6 { + padding-top: 1.5rem; + } + + .md\:pr-6 { + padding-right: 1.5rem; + } + + .md\:pb-6 { + padding-bottom: 1.5rem; + } + + .md\:pl-6 { + padding-left: 1.5rem; + } + + .md\:pt-8 { + padding-top: 2rem; + } + + .md\:pr-8 { + padding-right: 2rem; + } + + .md\:pb-8 { + padding-bottom: 2rem; + } + + .md\:pl-8 { + padding-left: 2rem; + } + + .md\:pt-10 { + padding-top: 2.5rem; + } + + .md\:pr-10 { + padding-right: 2.5rem; + } + + .md\:pb-10 { + padding-bottom: 2.5rem; + } + + .md\:pl-10 { + padding-left: 2.5rem; + } + + .md\:pt-12 { + padding-top: 3rem; + } + + .md\:pr-12 { + padding-right: 3rem; + } + + .md\:pb-12 { + padding-bottom: 3rem; + } + + .md\:pl-12 { + padding-left: 3rem; + } + + .md\:pt-16 { + padding-top: 4rem; + } + + .md\:pr-16 { + padding-right: 4rem; + } + + .md\:pb-16 { + padding-bottom: 4rem; + } + + .md\:pl-16 { + padding-left: 4rem; + } + + .md\:pt-20 { + padding-top: 5rem; + } + + .md\:pr-20 { + padding-right: 5rem; + } + + .md\:pb-20 { + padding-bottom: 5rem; + } + + .md\:pl-20 { + padding-left: 5rem; + } + + .md\:pt-24 { + padding-top: 6rem; + } + + .md\:pr-24 { + padding-right: 6rem; + } + + .md\:pb-24 { + padding-bottom: 6rem; + } + + .md\:pl-24 { + padding-left: 6rem; + } + + .md\:pt-32 { + padding-top: 8rem; + } + + .md\:pr-32 { + padding-right: 8rem; + } + + .md\:pb-32 { + padding-bottom: 8rem; + } + + .md\:pl-32 { + padding-left: 8rem; + } + + .md\:pt-px { + padding-top: 1px; + } + + .md\:pr-px { + padding-right: 1px; + } + + .md\:pb-px { + padding-bottom: 1px; + } + + .md\:pl-px { + padding-left: 1px; + } + + .md\:pointer-events-none { + pointer-events: none; + } + + .md\:pointer-events-auto { + pointer-events: auto; + } + + .md\:static { + position: static; + } + + .md\:fixed { + position: fixed; + } + + .md\:absolute { + position: absolute; + } + + .md\:relative { + position: relative; + } + + .md\:sticky { + position: -webkit-sticky; + position: sticky; + } + + .md\:pin-none { + top: auto; + right: auto; + bottom: auto; + left: auto; + } + + .md\:pin { + top: 0; + right: 0; + bottom: 0; + left: 0; + } + + .md\:pin-y { + top: 0; + bottom: 0; + } + + .md\:pin-x { + right: 0; + left: 0; + } + + .md\:pin-t { + top: 0; + } + + .md\:pin-r { + right: 0; + } + + .md\:pin-b { + bottom: 0; + } + + .md\:pin-l { + left: 0; + } + + .md\:resize-none { + resize: none; + } + + .md\:resize-y { + resize: vertical; + } + + .md\:resize-x { + resize: horizontal; + } + + .md\:resize { + resize: both; + } + + .md\:shadow { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .md\:shadow-md { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .md\:shadow-lg { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .md\:shadow-inner { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .md\:shadow-outline { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .md\:shadow-none { + box-shadow: none; + } + + .md\:hover\:shadow:hover { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .md\:hover\:shadow-md:hover { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .md\:hover\:shadow-lg:hover { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .md\:hover\:shadow-inner:hover { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .md\:hover\:shadow-outline:hover { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .md\:hover\:shadow-none:hover { + box-shadow: none; + } + + .md\:focus\:shadow:focus { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .md\:focus\:shadow-md:focus { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .md\:focus\:shadow-lg:focus { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .md\:focus\:shadow-inner:focus { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .md\:focus\:shadow-outline:focus { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .md\:focus\:shadow-none:focus { + box-shadow: none; + } + + .md\:table-auto { + table-layout: auto; + } + + .md\:table-fixed { + table-layout: fixed; + } + + .md\:text-left { + text-align: left; + } + + .md\:text-center { + text-align: center; + } + + .md\:text-right { + text-align: right; + } + + .md\:text-justify { + text-align: justify; + } + + .md\:text-transparent { + color: transparent; + } + + .md\:text-black { + color: #22292f; + } + + .md\:text-grey-darkest { + color: #3d4852; + } + + .md\:text-grey-darker { + color: #606f7b; + } + + .md\:text-grey-dark { + color: #8795a1; + } + + .md\:text-grey { + color: #b8c2cc; + } + + .md\:text-grey-light { + color: #dae1e7; + } + + .md\:text-grey-lighter { + color: #f1f5f8; + } + + .md\:text-grey-lightest { + color: #f8fafc; + } + + .md\:text-white { + color: #fff; + } + + .md\:text-red-darkest { + color: #3b0d0c; + } + + .md\:text-red-darker { + color: #621b18; + } + + .md\:text-red-dark { + color: #cc1f1a; + } + + .md\:text-red { + color: #e3342f; + } + + .md\:text-red-light { + color: #ef5753; + } + + .md\:text-red-lighter { + color: #f9acaa; + } + + .md\:text-red-lightest { + color: #fcebea; + } + + .md\:text-orange-darkest { + color: #462a16; + } + + .md\:text-orange-darker { + color: #613b1f; + } + + .md\:text-orange-dark { + color: #de751f; + } + + .md\:text-orange { + color: #f6993f; + } + + .md\:text-orange-light { + color: #faad63; + } + + .md\:text-orange-lighter { + color: #fcd9b6; + } + + .md\:text-orange-lightest { + color: #fff5eb; + } + + .md\:text-yellow-darkest { + color: #453411; + } + + .md\:text-yellow-darker { + color: #684f1d; + } + + .md\:text-yellow-dark { + color: #f2d024; + } + + .md\:text-yellow { + color: #ffed4a; + } + + .md\:text-yellow-light { + color: #fff382; + } + + .md\:text-yellow-lighter { + color: #fff9c2; + } + + .md\:text-yellow-lightest { + color: #fcfbeb; + } + + .md\:text-green-darkest { + color: #0f2f21; + } + + .md\:text-green-darker { + color: #1a4731; + } + + .md\:text-green-dark { + color: #1f9d55; + } + + .md\:text-green { + color: #38c172; + } + + .md\:text-green-light { + color: #51d88a; + } + + .md\:text-green-lighter { + color: #a2f5bf; + } + + .md\:text-green-lightest { + color: #e3fcec; + } + + .md\:text-teal-darkest { + color: #0d3331; + } + + .md\:text-teal-darker { + color: #20504f; + } + + .md\:text-teal-dark { + color: #38a89d; + } + + .md\:text-teal { + color: #4dc0b5; + } + + .md\:text-teal-light { + color: #64d5ca; + } + + .md\:text-teal-lighter { + color: #a0f0ed; + } + + .md\:text-teal-lightest { + color: #e8fffe; + } + + .md\:text-blue-darkest { + color: #12283a; + } + + .md\:text-blue-darker { + color: #1c3d5a; + } + + .md\:text-blue-dark { + color: #2779bd; + } + + .md\:text-blue { + color: #3490dc; + } + + .md\:text-blue-light { + color: #6cb2eb; + } + + .md\:text-blue-lighter { + color: #bcdefa; + } + + .md\:text-blue-lightest { + color: #eff8ff; + } + + .md\:text-indigo-darkest { + color: #191e38; + } + + .md\:text-indigo-darker { + color: #2f365f; + } + + .md\:text-indigo-dark { + color: #5661b3; + } + + .md\:text-indigo { + color: #6574cd; + } + + .md\:text-indigo-light { + color: #7886d7; + } + + .md\:text-indigo-lighter { + color: #b2b7ff; + } + + .md\:text-indigo-lightest { + color: #e6e8ff; + } + + .md\:text-purple-darkest { + color: #21183c; + } + + .md\:text-purple-darker { + color: #382b5f; + } + + .md\:text-purple-dark { + color: #794acf; + } + + .md\:text-purple { + color: #9561e2; + } + + .md\:text-purple-light { + color: #a779e9; + } + + .md\:text-purple-lighter { + color: #d6bbfc; + } + + .md\:text-purple-lightest { + color: #f3ebff; + } + + .md\:text-pink-darkest { + color: #451225; + } + + .md\:text-pink-darker { + color: #6f213f; + } + + .md\:text-pink-dark { + color: #eb5286; + } + + .md\:text-pink { + color: #f66d9b; + } + + .md\:text-pink-light { + color: #fa7ea8; + } + + .md\:text-pink-lighter { + color: #ffbbca; + } + + .md\:text-pink-lightest { + color: #ffebef; + } + + .md\:hover\:text-transparent:hover { + color: transparent; + } + + .md\:hover\:text-black:hover { + color: #22292f; + } + + .md\:hover\:text-grey-darkest:hover { + color: #3d4852; + } + + .md\:hover\:text-grey-darker:hover { + color: #606f7b; + } + + .md\:hover\:text-grey-dark:hover { + color: #8795a1; + } + + .md\:hover\:text-grey:hover { + color: #b8c2cc; + } + + .md\:hover\:text-grey-light:hover { + color: #dae1e7; + } + + .md\:hover\:text-grey-lighter:hover { + color: #f1f5f8; + } + + .md\:hover\:text-grey-lightest:hover { + color: #f8fafc; + } + + .md\:hover\:text-white:hover { + color: #fff; + } + + .md\:hover\:text-red-darkest:hover { + color: #3b0d0c; + } + + .md\:hover\:text-red-darker:hover { + color: #621b18; + } + + .md\:hover\:text-red-dark:hover { + color: #cc1f1a; + } + + .md\:hover\:text-red:hover { + color: #e3342f; + } + + .md\:hover\:text-red-light:hover { + color: #ef5753; + } + + .md\:hover\:text-red-lighter:hover { + color: #f9acaa; + } + + .md\:hover\:text-red-lightest:hover { + color: #fcebea; + } + + .md\:hover\:text-orange-darkest:hover { + color: #462a16; + } + + .md\:hover\:text-orange-darker:hover { + color: #613b1f; + } + + .md\:hover\:text-orange-dark:hover { + color: #de751f; + } + + .md\:hover\:text-orange:hover { + color: #f6993f; + } + + .md\:hover\:text-orange-light:hover { + color: #faad63; + } + + .md\:hover\:text-orange-lighter:hover { + color: #fcd9b6; + } + + .md\:hover\:text-orange-lightest:hover { + color: #fff5eb; + } + + .md\:hover\:text-yellow-darkest:hover { + color: #453411; + } + + .md\:hover\:text-yellow-darker:hover { + color: #684f1d; + } + + .md\:hover\:text-yellow-dark:hover { + color: #f2d024; + } + + .md\:hover\:text-yellow:hover { + color: #ffed4a; + } + + .md\:hover\:text-yellow-light:hover { + color: #fff382; + } + + .md\:hover\:text-yellow-lighter:hover { + color: #fff9c2; + } + + .md\:hover\:text-yellow-lightest:hover { + color: #fcfbeb; + } + + .md\:hover\:text-green-darkest:hover { + color: #0f2f21; + } + + .md\:hover\:text-green-darker:hover { + color: #1a4731; + } + + .md\:hover\:text-green-dark:hover { + color: #1f9d55; + } + + .md\:hover\:text-green:hover { + color: #38c172; + } + + .md\:hover\:text-green-light:hover { + color: #51d88a; + } + + .md\:hover\:text-green-lighter:hover { + color: #a2f5bf; + } + + .md\:hover\:text-green-lightest:hover { + color: #e3fcec; + } + + .md\:hover\:text-teal-darkest:hover { + color: #0d3331; + } + + .md\:hover\:text-teal-darker:hover { + color: #20504f; + } + + .md\:hover\:text-teal-dark:hover { + color: #38a89d; + } + + .md\:hover\:text-teal:hover { + color: #4dc0b5; + } + + .md\:hover\:text-teal-light:hover { + color: #64d5ca; + } + + .md\:hover\:text-teal-lighter:hover { + color: #a0f0ed; + } + + .md\:hover\:text-teal-lightest:hover { + color: #e8fffe; + } + + .md\:hover\:text-blue-darkest:hover { + color: #12283a; + } + + .md\:hover\:text-blue-darker:hover { + color: #1c3d5a; + } + + .md\:hover\:text-blue-dark:hover { + color: #2779bd; + } + + .md\:hover\:text-blue:hover { + color: #3490dc; + } + + .md\:hover\:text-blue-light:hover { + color: #6cb2eb; + } + + .md\:hover\:text-blue-lighter:hover { + color: #bcdefa; + } + + .md\:hover\:text-blue-lightest:hover { + color: #eff8ff; + } + + .md\:hover\:text-indigo-darkest:hover { + color: #191e38; + } + + .md\:hover\:text-indigo-darker:hover { + color: #2f365f; + } + + .md\:hover\:text-indigo-dark:hover { + color: #5661b3; + } + + .md\:hover\:text-indigo:hover { + color: #6574cd; + } + + .md\:hover\:text-indigo-light:hover { + color: #7886d7; + } + + .md\:hover\:text-indigo-lighter:hover { + color: #b2b7ff; + } + + .md\:hover\:text-indigo-lightest:hover { + color: #e6e8ff; + } + + .md\:hover\:text-purple-darkest:hover { + color: #21183c; + } + + .md\:hover\:text-purple-darker:hover { + color: #382b5f; + } + + .md\:hover\:text-purple-dark:hover { + color: #794acf; + } + + .md\:hover\:text-purple:hover { + color: #9561e2; + } + + .md\:hover\:text-purple-light:hover { + color: #a779e9; + } + + .md\:hover\:text-purple-lighter:hover { + color: #d6bbfc; + } + + .md\:hover\:text-purple-lightest:hover { + color: #f3ebff; + } + + .md\:hover\:text-pink-darkest:hover { + color: #451225; + } + + .md\:hover\:text-pink-darker:hover { + color: #6f213f; + } + + .md\:hover\:text-pink-dark:hover { + color: #eb5286; + } + + .md\:hover\:text-pink:hover { + color: #f66d9b; + } + + .md\:hover\:text-pink-light:hover { + color: #fa7ea8; + } + + .md\:hover\:text-pink-lighter:hover { + color: #ffbbca; + } + + .md\:hover\:text-pink-lightest:hover { + color: #ffebef; + } + + .md\:focus\:text-transparent:focus { + color: transparent; + } + + .md\:focus\:text-black:focus { + color: #22292f; + } + + .md\:focus\:text-grey-darkest:focus { + color: #3d4852; + } + + .md\:focus\:text-grey-darker:focus { + color: #606f7b; + } + + .md\:focus\:text-grey-dark:focus { + color: #8795a1; + } + + .md\:focus\:text-grey:focus { + color: #b8c2cc; + } + + .md\:focus\:text-grey-light:focus { + color: #dae1e7; + } + + .md\:focus\:text-grey-lighter:focus { + color: #f1f5f8; + } + + .md\:focus\:text-grey-lightest:focus { + color: #f8fafc; + } + + .md\:focus\:text-white:focus { + color: #fff; + } + + .md\:focus\:text-red-darkest:focus { + color: #3b0d0c; + } + + .md\:focus\:text-red-darker:focus { + color: #621b18; + } + + .md\:focus\:text-red-dark:focus { + color: #cc1f1a; + } + + .md\:focus\:text-red:focus { + color: #e3342f; + } + + .md\:focus\:text-red-light:focus { + color: #ef5753; + } + + .md\:focus\:text-red-lighter:focus { + color: #f9acaa; + } + + .md\:focus\:text-red-lightest:focus { + color: #fcebea; + } + + .md\:focus\:text-orange-darkest:focus { + color: #462a16; + } + + .md\:focus\:text-orange-darker:focus { + color: #613b1f; + } + + .md\:focus\:text-orange-dark:focus { + color: #de751f; + } + + .md\:focus\:text-orange:focus { + color: #f6993f; + } + + .md\:focus\:text-orange-light:focus { + color: #faad63; + } + + .md\:focus\:text-orange-lighter:focus { + color: #fcd9b6; + } + + .md\:focus\:text-orange-lightest:focus { + color: #fff5eb; + } + + .md\:focus\:text-yellow-darkest:focus { + color: #453411; + } + + .md\:focus\:text-yellow-darker:focus { + color: #684f1d; + } + + .md\:focus\:text-yellow-dark:focus { + color: #f2d024; + } + + .md\:focus\:text-yellow:focus { + color: #ffed4a; + } + + .md\:focus\:text-yellow-light:focus { + color: #fff382; + } + + .md\:focus\:text-yellow-lighter:focus { + color: #fff9c2; + } + + .md\:focus\:text-yellow-lightest:focus { + color: #fcfbeb; + } + + .md\:focus\:text-green-darkest:focus { + color: #0f2f21; + } + + .md\:focus\:text-green-darker:focus { + color: #1a4731; + } + + .md\:focus\:text-green-dark:focus { + color: #1f9d55; + } + + .md\:focus\:text-green:focus { + color: #38c172; + } + + .md\:focus\:text-green-light:focus { + color: #51d88a; + } + + .md\:focus\:text-green-lighter:focus { + color: #a2f5bf; + } + + .md\:focus\:text-green-lightest:focus { + color: #e3fcec; + } + + .md\:focus\:text-teal-darkest:focus { + color: #0d3331; + } + + .md\:focus\:text-teal-darker:focus { + color: #20504f; + } + + .md\:focus\:text-teal-dark:focus { + color: #38a89d; + } + + .md\:focus\:text-teal:focus { + color: #4dc0b5; + } + + .md\:focus\:text-teal-light:focus { + color: #64d5ca; + } + + .md\:focus\:text-teal-lighter:focus { + color: #a0f0ed; + } + + .md\:focus\:text-teal-lightest:focus { + color: #e8fffe; + } + + .md\:focus\:text-blue-darkest:focus { + color: #12283a; + } + + .md\:focus\:text-blue-darker:focus { + color: #1c3d5a; + } + + .md\:focus\:text-blue-dark:focus { + color: #2779bd; + } + + .md\:focus\:text-blue:focus { + color: #3490dc; + } + + .md\:focus\:text-blue-light:focus { + color: #6cb2eb; + } + + .md\:focus\:text-blue-lighter:focus { + color: #bcdefa; + } + + .md\:focus\:text-blue-lightest:focus { + color: #eff8ff; + } + + .md\:focus\:text-indigo-darkest:focus { + color: #191e38; + } + + .md\:focus\:text-indigo-darker:focus { + color: #2f365f; + } + + .md\:focus\:text-indigo-dark:focus { + color: #5661b3; + } + + .md\:focus\:text-indigo:focus { + color: #6574cd; + } + + .md\:focus\:text-indigo-light:focus { + color: #7886d7; + } + + .md\:focus\:text-indigo-lighter:focus { + color: #b2b7ff; + } + + .md\:focus\:text-indigo-lightest:focus { + color: #e6e8ff; + } + + .md\:focus\:text-purple-darkest:focus { + color: #21183c; + } + + .md\:focus\:text-purple-darker:focus { + color: #382b5f; + } + + .md\:focus\:text-purple-dark:focus { + color: #794acf; + } + + .md\:focus\:text-purple:focus { + color: #9561e2; + } + + .md\:focus\:text-purple-light:focus { + color: #a779e9; + } + + .md\:focus\:text-purple-lighter:focus { + color: #d6bbfc; + } + + .md\:focus\:text-purple-lightest:focus { + color: #f3ebff; + } + + .md\:focus\:text-pink-darkest:focus { + color: #451225; + } + + .md\:focus\:text-pink-darker:focus { + color: #6f213f; + } + + .md\:focus\:text-pink-dark:focus { + color: #eb5286; + } + + .md\:focus\:text-pink:focus { + color: #f66d9b; + } + + .md\:focus\:text-pink-light:focus { + color: #fa7ea8; + } + + .md\:focus\:text-pink-lighter:focus { + color: #ffbbca; + } + + .md\:focus\:text-pink-lightest:focus { + color: #ffebef; + } + + .md\:text-xs { + font-size: .75rem; + } + + .md\:text-sm { + font-size: .875rem; + } + + .md\:text-base { + font-size: 1rem; + } + + .md\:text-lg { + font-size: 1.125rem; + } + + .md\:text-xl { + font-size: 1.25rem; + } + + .md\:text-2xl { + font-size: 1.5rem; + } + + .md\:text-3xl { + font-size: 1.875rem; + } + + .md\:text-4xl { + font-size: 2.25rem; + } + + .md\:text-5xl { + font-size: 3rem; + } + + .md\:italic { + font-style: italic; + } + + .md\:roman { + font-style: normal; + } + + .md\:uppercase { + text-transform: uppercase; + } + + .md\:lowercase { + text-transform: lowercase; + } + + .md\:capitalize { + text-transform: capitalize; + } + + .md\:normal-case { + text-transform: none; + } + + .md\:underline { + text-decoration: underline; + } + + .md\:line-through { + text-decoration: line-through; + } + + .md\:no-underline { + text-decoration: none; + } + + .md\:antialiased { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .md\:subpixel-antialiased { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .md\:hover\:italic:hover { + font-style: italic; + } + + .md\:hover\:roman:hover { + font-style: normal; + } + + .md\:hover\:uppercase:hover { + text-transform: uppercase; + } + + .md\:hover\:lowercase:hover { + text-transform: lowercase; + } + + .md\:hover\:capitalize:hover { + text-transform: capitalize; + } + + .md\:hover\:normal-case:hover { + text-transform: none; + } + + .md\:hover\:underline:hover { + text-decoration: underline; + } + + .md\:hover\:line-through:hover { + text-decoration: line-through; + } + + .md\:hover\:no-underline:hover { + text-decoration: none; + } + + .md\:hover\:antialiased:hover { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .md\:hover\:subpixel-antialiased:hover { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .md\:focus\:italic:focus { + font-style: italic; + } + + .md\:focus\:roman:focus { + font-style: normal; + } + + .md\:focus\:uppercase:focus { + text-transform: uppercase; + } + + .md\:focus\:lowercase:focus { + text-transform: lowercase; + } + + .md\:focus\:capitalize:focus { + text-transform: capitalize; + } + + .md\:focus\:normal-case:focus { + text-transform: none; + } + + .md\:focus\:underline:focus { + text-decoration: underline; + } + + .md\:focus\:line-through:focus { + text-decoration: line-through; + } + + .md\:focus\:no-underline:focus { + text-decoration: none; + } + + .md\:focus\:antialiased:focus { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .md\:focus\:subpixel-antialiased:focus { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .md\:tracking-tight { + letter-spacing: -0.05em; + } + + .md\:tracking-normal { + letter-spacing: 0; + } + + .md\:tracking-wide { + letter-spacing: .05em; + } + + .md\:select-none { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + } + + .md\:select-text { + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; + } + + .md\:align-baseline { + vertical-align: baseline; + } + + .md\:align-top { + vertical-align: top; + } + + .md\:align-middle { + vertical-align: middle; + } + + .md\:align-bottom { + vertical-align: bottom; + } + + .md\:align-text-top { + vertical-align: text-top; + } + + .md\:align-text-bottom { + vertical-align: text-bottom; + } + + .md\:visible { + visibility: visible; + } + + .md\:invisible { + visibility: hidden; + } + + .md\:whitespace-normal { + white-space: normal; + } + + .md\:whitespace-no-wrap { + white-space: nowrap; + } + + .md\:whitespace-pre { + white-space: pre; + } + + .md\:whitespace-pre-line { + white-space: pre-line; + } + + .md\:whitespace-pre-wrap { + white-space: pre-wrap; + } + + .md\:break-words { + word-wrap: break-word; + } + + .md\:break-normal { + word-wrap: normal; + } + + .md\:truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + + .md\:w-1 { + width: .25rem; + } + + .md\:w-2 { + width: .5rem; + } + + .md\:w-3 { + width: .75rem; + } + + .md\:w-4 { + width: 1rem; + } + + .md\:w-5 { + width: 1.25rem; + } + + .md\:w-6 { + width: 1.5rem; + } + + .md\:w-8 { + width: 2rem; + } + + .md\:w-10 { + width: 2.5rem; + } + + .md\:w-12 { + width: 3rem; + } + + .md\:w-16 { + width: 4rem; + } + + .md\:w-24 { + width: 6rem; + } + + .md\:w-32 { + width: 8rem; + } + + .md\:w-48 { + width: 12rem; + } + + .md\:w-64 { + width: 16rem; + } + + .md\:w-auto { + width: auto; + } + + .md\:w-px { + width: 1px; + } + + .md\:w-1\/2 { + width: 50%; + } + + .md\:w-1\/3 { + width: 33.33333%; + } + + .md\:w-2\/3 { + width: 66.66667%; + } + + .md\:w-1\/4 { + width: 25%; + } + + .md\:w-3\/4 { + width: 75%; + } + + .md\:w-1\/5 { + width: 20%; + } + + .md\:w-2\/5 { + width: 40%; + } + + .md\:w-3\/5 { + width: 60%; + } + + .md\:w-4\/5 { + width: 80%; + } + + .md\:w-1\/6 { + width: 16.66667%; + } + + .md\:w-5\/6 { + width: 83.33333%; + } + + .md\:w-full { + width: 100%; + } + + .md\:w-screen { + width: 100vw; + } + + .md\:z-0 { + z-index: 0; + } + + .md\:z-10 { + z-index: 10; + } + + .md\:z-20 { + z-index: 20; + } + + .md\:z-30 { + z-index: 30; + } + + .md\:z-40 { + z-index: 40; + } + + .md\:z-50 { + z-index: 50; + } + + .md\:z-auto { + z-index: auto; + } +} + +@media (min-width: 992px) { + .lg\:list-reset { + list-style: none; + padding: 0; + } + + .lg\:appearance-none { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + .lg\:bg-fixed { + background-attachment: fixed; + } + + .lg\:bg-local { + background-attachment: local; + } + + .lg\:bg-scroll { + background-attachment: scroll; + } + + .lg\:bg-transparent { + background-color: transparent; + } + + .lg\:bg-black { + background-color: #22292f; + } + + .lg\:bg-grey-darkest { + background-color: #3d4852; + } + + .lg\:bg-grey-darker { + background-color: #606f7b; + } + + .lg\:bg-grey-dark { + background-color: #8795a1; + } + + .lg\:bg-grey { + background-color: #b8c2cc; + } + + .lg\:bg-grey-light { + background-color: #dae1e7; + } + + .lg\:bg-grey-lighter { + background-color: #f1f5f8; + } + + .lg\:bg-grey-lightest { + background-color: #f8fafc; + } + + .lg\:bg-white { + background-color: #fff; + } + + .lg\:bg-red-darkest { + background-color: #3b0d0c; + } + + .lg\:bg-red-darker { + background-color: #621b18; + } + + .lg\:bg-red-dark { + background-color: #cc1f1a; + } + + .lg\:bg-red { + background-color: #e3342f; + } + + .lg\:bg-red-light { + background-color: #ef5753; + } + + .lg\:bg-red-lighter { + background-color: #f9acaa; + } + + .lg\:bg-red-lightest { + background-color: #fcebea; + } + + .lg\:bg-orange-darkest { + background-color: #462a16; + } + + .lg\:bg-orange-darker { + background-color: #613b1f; + } + + .lg\:bg-orange-dark { + background-color: #de751f; + } + + .lg\:bg-orange { + background-color: #f6993f; + } + + .lg\:bg-orange-light { + background-color: #faad63; + } + + .lg\:bg-orange-lighter { + background-color: #fcd9b6; + } + + .lg\:bg-orange-lightest { + background-color: #fff5eb; + } + + .lg\:bg-yellow-darkest { + background-color: #453411; + } + + .lg\:bg-yellow-darker { + background-color: #684f1d; + } + + .lg\:bg-yellow-dark { + background-color: #f2d024; + } + + .lg\:bg-yellow { + background-color: #ffed4a; + } + + .lg\:bg-yellow-light { + background-color: #fff382; + } + + .lg\:bg-yellow-lighter { + background-color: #fff9c2; + } + + .lg\:bg-yellow-lightest { + background-color: #fcfbeb; + } + + .lg\:bg-green-darkest { + background-color: #0f2f21; + } + + .lg\:bg-green-darker { + background-color: #1a4731; + } + + .lg\:bg-green-dark { + background-color: #1f9d55; + } + + .lg\:bg-green { + background-color: #38c172; + } + + .lg\:bg-green-light { + background-color: #51d88a; + } + + .lg\:bg-green-lighter { + background-color: #a2f5bf; + } + + .lg\:bg-green-lightest { + background-color: #e3fcec; + } + + .lg\:bg-teal-darkest { + background-color: #0d3331; + } + + .lg\:bg-teal-darker { + background-color: #20504f; + } + + .lg\:bg-teal-dark { + background-color: #38a89d; + } + + .lg\:bg-teal { + background-color: #4dc0b5; + } + + .lg\:bg-teal-light { + background-color: #64d5ca; + } + + .lg\:bg-teal-lighter { + background-color: #a0f0ed; + } + + .lg\:bg-teal-lightest { + background-color: #e8fffe; + } + + .lg\:bg-blue-darkest { + background-color: #12283a; + } + + .lg\:bg-blue-darker { + background-color: #1c3d5a; + } + + .lg\:bg-blue-dark { + background-color: #2779bd; + } + + .lg\:bg-blue { + background-color: #3490dc; + } + + .lg\:bg-blue-light { + background-color: #6cb2eb; + } + + .lg\:bg-blue-lighter { + background-color: #bcdefa; + } + + .lg\:bg-blue-lightest { + background-color: #eff8ff; + } + + .lg\:bg-indigo-darkest { + background-color: #191e38; + } + + .lg\:bg-indigo-darker { + background-color: #2f365f; + } + + .lg\:bg-indigo-dark { + background-color: #5661b3; + } + + .lg\:bg-indigo { + background-color: #6574cd; + } + + .lg\:bg-indigo-light { + background-color: #7886d7; + } + + .lg\:bg-indigo-lighter { + background-color: #b2b7ff; + } + + .lg\:bg-indigo-lightest { + background-color: #e6e8ff; + } + + .lg\:bg-purple-darkest { + background-color: #21183c; + } + + .lg\:bg-purple-darker { + background-color: #382b5f; + } + + .lg\:bg-purple-dark { + background-color: #794acf; + } + + .lg\:bg-purple { + background-color: #9561e2; + } + + .lg\:bg-purple-light { + background-color: #a779e9; + } + + .lg\:bg-purple-lighter { + background-color: #d6bbfc; + } + + .lg\:bg-purple-lightest { + background-color: #f3ebff; + } + + .lg\:bg-pink-darkest { + background-color: #451225; + } + + .lg\:bg-pink-darker { + background-color: #6f213f; + } + + .lg\:bg-pink-dark { + background-color: #eb5286; + } + + .lg\:bg-pink { + background-color: #f66d9b; + } + + .lg\:bg-pink-light { + background-color: #fa7ea8; + } + + .lg\:bg-pink-lighter { + background-color: #ffbbca; + } + + .lg\:bg-pink-lightest { + background-color: #ffebef; + } + + .lg\:hover\:bg-transparent:hover { + background-color: transparent; + } + + .lg\:hover\:bg-black:hover { + background-color: #22292f; + } + + .lg\:hover\:bg-grey-darkest:hover { + background-color: #3d4852; + } + + .lg\:hover\:bg-grey-darker:hover { + background-color: #606f7b; + } + + .lg\:hover\:bg-grey-dark:hover { + background-color: #8795a1; + } + + .lg\:hover\:bg-grey:hover { + background-color: #b8c2cc; + } + + .lg\:hover\:bg-grey-light:hover { + background-color: #dae1e7; + } + + .lg\:hover\:bg-grey-lighter:hover { + background-color: #f1f5f8; + } + + .lg\:hover\:bg-grey-lightest:hover { + background-color: #f8fafc; + } + + .lg\:hover\:bg-white:hover { + background-color: #fff; + } + + .lg\:hover\:bg-red-darkest:hover { + background-color: #3b0d0c; + } + + .lg\:hover\:bg-red-darker:hover { + background-color: #621b18; + } + + .lg\:hover\:bg-red-dark:hover { + background-color: #cc1f1a; + } + + .lg\:hover\:bg-red:hover { + background-color: #e3342f; + } + + .lg\:hover\:bg-red-light:hover { + background-color: #ef5753; + } + + .lg\:hover\:bg-red-lighter:hover { + background-color: #f9acaa; + } + + .lg\:hover\:bg-red-lightest:hover { + background-color: #fcebea; + } + + .lg\:hover\:bg-orange-darkest:hover { + background-color: #462a16; + } + + .lg\:hover\:bg-orange-darker:hover { + background-color: #613b1f; + } + + .lg\:hover\:bg-orange-dark:hover { + background-color: #de751f; + } + + .lg\:hover\:bg-orange:hover { + background-color: #f6993f; + } + + .lg\:hover\:bg-orange-light:hover { + background-color: #faad63; + } + + .lg\:hover\:bg-orange-lighter:hover { + background-color: #fcd9b6; + } + + .lg\:hover\:bg-orange-lightest:hover { + background-color: #fff5eb; + } + + .lg\:hover\:bg-yellow-darkest:hover { + background-color: #453411; + } + + .lg\:hover\:bg-yellow-darker:hover { + background-color: #684f1d; + } + + .lg\:hover\:bg-yellow-dark:hover { + background-color: #f2d024; + } + + .lg\:hover\:bg-yellow:hover { + background-color: #ffed4a; + } + + .lg\:hover\:bg-yellow-light:hover { + background-color: #fff382; + } + + .lg\:hover\:bg-yellow-lighter:hover { + background-color: #fff9c2; + } + + .lg\:hover\:bg-yellow-lightest:hover { + background-color: #fcfbeb; + } + + .lg\:hover\:bg-green-darkest:hover { + background-color: #0f2f21; + } + + .lg\:hover\:bg-green-darker:hover { + background-color: #1a4731; + } + + .lg\:hover\:bg-green-dark:hover { + background-color: #1f9d55; + } + + .lg\:hover\:bg-green:hover { + background-color: #38c172; + } + + .lg\:hover\:bg-green-light:hover { + background-color: #51d88a; + } + + .lg\:hover\:bg-green-lighter:hover { + background-color: #a2f5bf; + } + + .lg\:hover\:bg-green-lightest:hover { + background-color: #e3fcec; + } + + .lg\:hover\:bg-teal-darkest:hover { + background-color: #0d3331; + } + + .lg\:hover\:bg-teal-darker:hover { + background-color: #20504f; + } + + .lg\:hover\:bg-teal-dark:hover { + background-color: #38a89d; + } + + .lg\:hover\:bg-teal:hover { + background-color: #4dc0b5; + } + + .lg\:hover\:bg-teal-light:hover { + background-color: #64d5ca; + } + + .lg\:hover\:bg-teal-lighter:hover { + background-color: #a0f0ed; + } + + .lg\:hover\:bg-teal-lightest:hover { + background-color: #e8fffe; + } + + .lg\:hover\:bg-blue-darkest:hover { + background-color: #12283a; + } + + .lg\:hover\:bg-blue-darker:hover { + background-color: #1c3d5a; + } + + .lg\:hover\:bg-blue-dark:hover { + background-color: #2779bd; + } + + .lg\:hover\:bg-blue:hover { + background-color: #3490dc; + } + + .lg\:hover\:bg-blue-light:hover { + background-color: #6cb2eb; + } + + .lg\:hover\:bg-blue-lighter:hover { + background-color: #bcdefa; + } + + .lg\:hover\:bg-blue-lightest:hover { + background-color: #eff8ff; + } + + .lg\:hover\:bg-indigo-darkest:hover { + background-color: #191e38; + } + + .lg\:hover\:bg-indigo-darker:hover { + background-color: #2f365f; + } + + .lg\:hover\:bg-indigo-dark:hover { + background-color: #5661b3; + } + + .lg\:hover\:bg-indigo:hover { + background-color: #6574cd; + } + + .lg\:hover\:bg-indigo-light:hover { + background-color: #7886d7; + } + + .lg\:hover\:bg-indigo-lighter:hover { + background-color: #b2b7ff; + } + + .lg\:hover\:bg-indigo-lightest:hover { + background-color: #e6e8ff; + } + + .lg\:hover\:bg-purple-darkest:hover { + background-color: #21183c; + } + + .lg\:hover\:bg-purple-darker:hover { + background-color: #382b5f; + } + + .lg\:hover\:bg-purple-dark:hover { + background-color: #794acf; + } + + .lg\:hover\:bg-purple:hover { + background-color: #9561e2; + } + + .lg\:hover\:bg-purple-light:hover { + background-color: #a779e9; + } + + .lg\:hover\:bg-purple-lighter:hover { + background-color: #d6bbfc; + } + + .lg\:hover\:bg-purple-lightest:hover { + background-color: #f3ebff; + } + + .lg\:hover\:bg-pink-darkest:hover { + background-color: #451225; + } + + .lg\:hover\:bg-pink-darker:hover { + background-color: #6f213f; + } + + .lg\:hover\:bg-pink-dark:hover { + background-color: #eb5286; + } + + .lg\:hover\:bg-pink:hover { + background-color: #f66d9b; + } + + .lg\:hover\:bg-pink-light:hover { + background-color: #fa7ea8; + } + + .lg\:hover\:bg-pink-lighter:hover { + background-color: #ffbbca; + } + + .lg\:hover\:bg-pink-lightest:hover { + background-color: #ffebef; + } + + .lg\:focus\:bg-transparent:focus { + background-color: transparent; + } + + .lg\:focus\:bg-black:focus { + background-color: #22292f; + } + + .lg\:focus\:bg-grey-darkest:focus { + background-color: #3d4852; + } + + .lg\:focus\:bg-grey-darker:focus { + background-color: #606f7b; + } + + .lg\:focus\:bg-grey-dark:focus { + background-color: #8795a1; + } + + .lg\:focus\:bg-grey:focus { + background-color: #b8c2cc; + } + + .lg\:focus\:bg-grey-light:focus { + background-color: #dae1e7; + } + + .lg\:focus\:bg-grey-lighter:focus { + background-color: #f1f5f8; + } + + .lg\:focus\:bg-grey-lightest:focus { + background-color: #f8fafc; + } + + .lg\:focus\:bg-white:focus { + background-color: #fff; + } + + .lg\:focus\:bg-red-darkest:focus { + background-color: #3b0d0c; + } + + .lg\:focus\:bg-red-darker:focus { + background-color: #621b18; + } + + .lg\:focus\:bg-red-dark:focus { + background-color: #cc1f1a; + } + + .lg\:focus\:bg-red:focus { + background-color: #e3342f; + } + + .lg\:focus\:bg-red-light:focus { + background-color: #ef5753; + } + + .lg\:focus\:bg-red-lighter:focus { + background-color: #f9acaa; + } + + .lg\:focus\:bg-red-lightest:focus { + background-color: #fcebea; + } + + .lg\:focus\:bg-orange-darkest:focus { + background-color: #462a16; + } + + .lg\:focus\:bg-orange-darker:focus { + background-color: #613b1f; + } + + .lg\:focus\:bg-orange-dark:focus { + background-color: #de751f; + } + + .lg\:focus\:bg-orange:focus { + background-color: #f6993f; + } + + .lg\:focus\:bg-orange-light:focus { + background-color: #faad63; + } + + .lg\:focus\:bg-orange-lighter:focus { + background-color: #fcd9b6; + } + + .lg\:focus\:bg-orange-lightest:focus { + background-color: #fff5eb; + } + + .lg\:focus\:bg-yellow-darkest:focus { + background-color: #453411; + } + + .lg\:focus\:bg-yellow-darker:focus { + background-color: #684f1d; + } + + .lg\:focus\:bg-yellow-dark:focus { + background-color: #f2d024; + } + + .lg\:focus\:bg-yellow:focus { + background-color: #ffed4a; + } + + .lg\:focus\:bg-yellow-light:focus { + background-color: #fff382; + } + + .lg\:focus\:bg-yellow-lighter:focus { + background-color: #fff9c2; + } + + .lg\:focus\:bg-yellow-lightest:focus { + background-color: #fcfbeb; + } + + .lg\:focus\:bg-green-darkest:focus { + background-color: #0f2f21; + } + + .lg\:focus\:bg-green-darker:focus { + background-color: #1a4731; + } + + .lg\:focus\:bg-green-dark:focus { + background-color: #1f9d55; + } + + .lg\:focus\:bg-green:focus { + background-color: #38c172; + } + + .lg\:focus\:bg-green-light:focus { + background-color: #51d88a; + } + + .lg\:focus\:bg-green-lighter:focus { + background-color: #a2f5bf; + } + + .lg\:focus\:bg-green-lightest:focus { + background-color: #e3fcec; + } + + .lg\:focus\:bg-teal-darkest:focus { + background-color: #0d3331; + } + + .lg\:focus\:bg-teal-darker:focus { + background-color: #20504f; + } + + .lg\:focus\:bg-teal-dark:focus { + background-color: #38a89d; + } + + .lg\:focus\:bg-teal:focus { + background-color: #4dc0b5; + } + + .lg\:focus\:bg-teal-light:focus { + background-color: #64d5ca; + } + + .lg\:focus\:bg-teal-lighter:focus { + background-color: #a0f0ed; + } + + .lg\:focus\:bg-teal-lightest:focus { + background-color: #e8fffe; + } + + .lg\:focus\:bg-blue-darkest:focus { + background-color: #12283a; + } + + .lg\:focus\:bg-blue-darker:focus { + background-color: #1c3d5a; + } + + .lg\:focus\:bg-blue-dark:focus { + background-color: #2779bd; + } + + .lg\:focus\:bg-blue:focus { + background-color: #3490dc; + } + + .lg\:focus\:bg-blue-light:focus { + background-color: #6cb2eb; + } + + .lg\:focus\:bg-blue-lighter:focus { + background-color: #bcdefa; + } + + .lg\:focus\:bg-blue-lightest:focus { + background-color: #eff8ff; + } + + .lg\:focus\:bg-indigo-darkest:focus { + background-color: #191e38; + } + + .lg\:focus\:bg-indigo-darker:focus { + background-color: #2f365f; + } + + .lg\:focus\:bg-indigo-dark:focus { + background-color: #5661b3; + } + + .lg\:focus\:bg-indigo:focus { + background-color: #6574cd; + } + + .lg\:focus\:bg-indigo-light:focus { + background-color: #7886d7; + } + + .lg\:focus\:bg-indigo-lighter:focus { + background-color: #b2b7ff; + } + + .lg\:focus\:bg-indigo-lightest:focus { + background-color: #e6e8ff; + } + + .lg\:focus\:bg-purple-darkest:focus { + background-color: #21183c; + } + + .lg\:focus\:bg-purple-darker:focus { + background-color: #382b5f; + } + + .lg\:focus\:bg-purple-dark:focus { + background-color: #794acf; + } + + .lg\:focus\:bg-purple:focus { + background-color: #9561e2; + } + + .lg\:focus\:bg-purple-light:focus { + background-color: #a779e9; + } + + .lg\:focus\:bg-purple-lighter:focus { + background-color: #d6bbfc; + } + + .lg\:focus\:bg-purple-lightest:focus { + background-color: #f3ebff; + } + + .lg\:focus\:bg-pink-darkest:focus { + background-color: #451225; + } + + .lg\:focus\:bg-pink-darker:focus { + background-color: #6f213f; + } + + .lg\:focus\:bg-pink-dark:focus { + background-color: #eb5286; + } + + .lg\:focus\:bg-pink:focus { + background-color: #f66d9b; + } + + .lg\:focus\:bg-pink-light:focus { + background-color: #fa7ea8; + } + + .lg\:focus\:bg-pink-lighter:focus { + background-color: #ffbbca; + } + + .lg\:focus\:bg-pink-lightest:focus { + background-color: #ffebef; + } + + .lg\:bg-bottom { + background-position: bottom; + } + + .lg\:bg-center { + background-position: center; + } + + .lg\:bg-left { + background-position: left; + } + + .lg\:bg-left-bottom { + background-position: left bottom; + } + + .lg\:bg-left-top { + background-position: left top; + } + + .lg\:bg-right { + background-position: right; + } + + .lg\:bg-right-bottom { + background-position: right bottom; + } + + .lg\:bg-right-top { + background-position: right top; + } + + .lg\:bg-top { + background-position: top; + } + + .lg\:bg-repeat { + background-repeat: repeat; + } + + .lg\:bg-no-repeat { + background-repeat: no-repeat; + } + + .lg\:bg-repeat-x { + background-repeat: repeat-x; + } + + .lg\:bg-repeat-y { + background-repeat: repeat-y; + } + + .lg\:bg-auto { + background-size: auto; + } + + .lg\:bg-cover { + background-size: cover; + } + + .lg\:bg-contain { + background-size: contain; + } + + .lg\:border-transparent { + border-color: transparent; + } + + .lg\:border-black { + border-color: #22292f; + } + + .lg\:border-grey-darkest { + border-color: #3d4852; + } + + .lg\:border-grey-darker { + border-color: #606f7b; + } + + .lg\:border-grey-dark { + border-color: #8795a1; + } + + .lg\:border-grey { + border-color: #b8c2cc; + } + + .lg\:border-grey-light { + border-color: #dae1e7; + } + + .lg\:border-grey-lighter { + border-color: #f1f5f8; + } + + .lg\:border-grey-lightest { + border-color: #f8fafc; + } + + .lg\:border-white { + border-color: #fff; + } + + .lg\:border-red-darkest { + border-color: #3b0d0c; + } + + .lg\:border-red-darker { + border-color: #621b18; + } + + .lg\:border-red-dark { + border-color: #cc1f1a; + } + + .lg\:border-red { + border-color: #e3342f; + } + + .lg\:border-red-light { + border-color: #ef5753; + } + + .lg\:border-red-lighter { + border-color: #f9acaa; + } + + .lg\:border-red-lightest { + border-color: #fcebea; + } + + .lg\:border-orange-darkest { + border-color: #462a16; + } + + .lg\:border-orange-darker { + border-color: #613b1f; + } + + .lg\:border-orange-dark { + border-color: #de751f; + } + + .lg\:border-orange { + border-color: #f6993f; + } + + .lg\:border-orange-light { + border-color: #faad63; + } + + .lg\:border-orange-lighter { + border-color: #fcd9b6; + } + + .lg\:border-orange-lightest { + border-color: #fff5eb; + } + + .lg\:border-yellow-darkest { + border-color: #453411; + } + + .lg\:border-yellow-darker { + border-color: #684f1d; + } + + .lg\:border-yellow-dark { + border-color: #f2d024; + } + + .lg\:border-yellow { + border-color: #ffed4a; + } + + .lg\:border-yellow-light { + border-color: #fff382; + } + + .lg\:border-yellow-lighter { + border-color: #fff9c2; + } + + .lg\:border-yellow-lightest { + border-color: #fcfbeb; + } + + .lg\:border-green-darkest { + border-color: #0f2f21; + } + + .lg\:border-green-darker { + border-color: #1a4731; + } + + .lg\:border-green-dark { + border-color: #1f9d55; + } + + .lg\:border-green { + border-color: #38c172; + } + + .lg\:border-green-light { + border-color: #51d88a; + } + + .lg\:border-green-lighter { + border-color: #a2f5bf; + } + + .lg\:border-green-lightest { + border-color: #e3fcec; + } + + .lg\:border-teal-darkest { + border-color: #0d3331; + } + + .lg\:border-teal-darker { + border-color: #20504f; + } + + .lg\:border-teal-dark { + border-color: #38a89d; + } + + .lg\:border-teal { + border-color: #4dc0b5; + } + + .lg\:border-teal-light { + border-color: #64d5ca; + } + + .lg\:border-teal-lighter { + border-color: #a0f0ed; + } + + .lg\:border-teal-lightest { + border-color: #e8fffe; + } + + .lg\:border-blue-darkest { + border-color: #12283a; + } + + .lg\:border-blue-darker { + border-color: #1c3d5a; + } + + .lg\:border-blue-dark { + border-color: #2779bd; + } + + .lg\:border-blue { + border-color: #3490dc; + } + + .lg\:border-blue-light { + border-color: #6cb2eb; + } + + .lg\:border-blue-lighter { + border-color: #bcdefa; + } + + .lg\:border-blue-lightest { + border-color: #eff8ff; + } + + .lg\:border-indigo-darkest { + border-color: #191e38; + } + + .lg\:border-indigo-darker { + border-color: #2f365f; + } + + .lg\:border-indigo-dark { + border-color: #5661b3; + } + + .lg\:border-indigo { + border-color: #6574cd; + } + + .lg\:border-indigo-light { + border-color: #7886d7; + } + + .lg\:border-indigo-lighter { + border-color: #b2b7ff; + } + + .lg\:border-indigo-lightest { + border-color: #e6e8ff; + } + + .lg\:border-purple-darkest { + border-color: #21183c; + } + + .lg\:border-purple-darker { + border-color: #382b5f; + } + + .lg\:border-purple-dark { + border-color: #794acf; + } + + .lg\:border-purple { + border-color: #9561e2; + } + + .lg\:border-purple-light { + border-color: #a779e9; + } + + .lg\:border-purple-lighter { + border-color: #d6bbfc; + } + + .lg\:border-purple-lightest { + border-color: #f3ebff; + } + + .lg\:border-pink-darkest { + border-color: #451225; + } + + .lg\:border-pink-darker { + border-color: #6f213f; + } + + .lg\:border-pink-dark { + border-color: #eb5286; + } + + .lg\:border-pink { + border-color: #f66d9b; + } + + .lg\:border-pink-light { + border-color: #fa7ea8; + } + + .lg\:border-pink-lighter { + border-color: #ffbbca; + } + + .lg\:border-pink-lightest { + border-color: #ffebef; + } + + .lg\:hover\:border-transparent:hover { + border-color: transparent; + } + + .lg\:hover\:border-black:hover { + border-color: #22292f; + } + + .lg\:hover\:border-grey-darkest:hover { + border-color: #3d4852; + } + + .lg\:hover\:border-grey-darker:hover { + border-color: #606f7b; + } + + .lg\:hover\:border-grey-dark:hover { + border-color: #8795a1; + } + + .lg\:hover\:border-grey:hover { + border-color: #b8c2cc; + } + + .lg\:hover\:border-grey-light:hover { + border-color: #dae1e7; + } + + .lg\:hover\:border-grey-lighter:hover { + border-color: #f1f5f8; + } + + .lg\:hover\:border-grey-lightest:hover { + border-color: #f8fafc; + } + + .lg\:hover\:border-white:hover { + border-color: #fff; + } + + .lg\:hover\:border-red-darkest:hover { + border-color: #3b0d0c; + } + + .lg\:hover\:border-red-darker:hover { + border-color: #621b18; + } + + .lg\:hover\:border-red-dark:hover { + border-color: #cc1f1a; + } + + .lg\:hover\:border-red:hover { + border-color: #e3342f; + } + + .lg\:hover\:border-red-light:hover { + border-color: #ef5753; + } + + .lg\:hover\:border-red-lighter:hover { + border-color: #f9acaa; + } + + .lg\:hover\:border-red-lightest:hover { + border-color: #fcebea; + } + + .lg\:hover\:border-orange-darkest:hover { + border-color: #462a16; + } + + .lg\:hover\:border-orange-darker:hover { + border-color: #613b1f; + } + + .lg\:hover\:border-orange-dark:hover { + border-color: #de751f; + } + + .lg\:hover\:border-orange:hover { + border-color: #f6993f; + } + + .lg\:hover\:border-orange-light:hover { + border-color: #faad63; + } + + .lg\:hover\:border-orange-lighter:hover { + border-color: #fcd9b6; + } + + .lg\:hover\:border-orange-lightest:hover { + border-color: #fff5eb; + } + + .lg\:hover\:border-yellow-darkest:hover { + border-color: #453411; + } + + .lg\:hover\:border-yellow-darker:hover { + border-color: #684f1d; + } + + .lg\:hover\:border-yellow-dark:hover { + border-color: #f2d024; + } + + .lg\:hover\:border-yellow:hover { + border-color: #ffed4a; + } + + .lg\:hover\:border-yellow-light:hover { + border-color: #fff382; + } + + .lg\:hover\:border-yellow-lighter:hover { + border-color: #fff9c2; + } + + .lg\:hover\:border-yellow-lightest:hover { + border-color: #fcfbeb; + } + + .lg\:hover\:border-green-darkest:hover { + border-color: #0f2f21; + } + + .lg\:hover\:border-green-darker:hover { + border-color: #1a4731; + } + + .lg\:hover\:border-green-dark:hover { + border-color: #1f9d55; + } + + .lg\:hover\:border-green:hover { + border-color: #38c172; + } + + .lg\:hover\:border-green-light:hover { + border-color: #51d88a; + } + + .lg\:hover\:border-green-lighter:hover { + border-color: #a2f5bf; + } + + .lg\:hover\:border-green-lightest:hover { + border-color: #e3fcec; + } + + .lg\:hover\:border-teal-darkest:hover { + border-color: #0d3331; + } + + .lg\:hover\:border-teal-darker:hover { + border-color: #20504f; + } + + .lg\:hover\:border-teal-dark:hover { + border-color: #38a89d; + } + + .lg\:hover\:border-teal:hover { + border-color: #4dc0b5; + } + + .lg\:hover\:border-teal-light:hover { + border-color: #64d5ca; + } + + .lg\:hover\:border-teal-lighter:hover { + border-color: #a0f0ed; + } + + .lg\:hover\:border-teal-lightest:hover { + border-color: #e8fffe; + } + + .lg\:hover\:border-blue-darkest:hover { + border-color: #12283a; + } + + .lg\:hover\:border-blue-darker:hover { + border-color: #1c3d5a; + } + + .lg\:hover\:border-blue-dark:hover { + border-color: #2779bd; + } + + .lg\:hover\:border-blue:hover { + border-color: #3490dc; + } + + .lg\:hover\:border-blue-light:hover { + border-color: #6cb2eb; + } + + .lg\:hover\:border-blue-lighter:hover { + border-color: #bcdefa; + } + + .lg\:hover\:border-blue-lightest:hover { + border-color: #eff8ff; + } + + .lg\:hover\:border-indigo-darkest:hover { + border-color: #191e38; + } + + .lg\:hover\:border-indigo-darker:hover { + border-color: #2f365f; + } + + .lg\:hover\:border-indigo-dark:hover { + border-color: #5661b3; + } + + .lg\:hover\:border-indigo:hover { + border-color: #6574cd; + } + + .lg\:hover\:border-indigo-light:hover { + border-color: #7886d7; + } + + .lg\:hover\:border-indigo-lighter:hover { + border-color: #b2b7ff; + } + + .lg\:hover\:border-indigo-lightest:hover { + border-color: #e6e8ff; + } + + .lg\:hover\:border-purple-darkest:hover { + border-color: #21183c; + } + + .lg\:hover\:border-purple-darker:hover { + border-color: #382b5f; + } + + .lg\:hover\:border-purple-dark:hover { + border-color: #794acf; + } + + .lg\:hover\:border-purple:hover { + border-color: #9561e2; + } + + .lg\:hover\:border-purple-light:hover { + border-color: #a779e9; + } + + .lg\:hover\:border-purple-lighter:hover { + border-color: #d6bbfc; + } + + .lg\:hover\:border-purple-lightest:hover { + border-color: #f3ebff; + } + + .lg\:hover\:border-pink-darkest:hover { + border-color: #451225; + } + + .lg\:hover\:border-pink-darker:hover { + border-color: #6f213f; + } + + .lg\:hover\:border-pink-dark:hover { + border-color: #eb5286; + } + + .lg\:hover\:border-pink:hover { + border-color: #f66d9b; + } + + .lg\:hover\:border-pink-light:hover { + border-color: #fa7ea8; + } + + .lg\:hover\:border-pink-lighter:hover { + border-color: #ffbbca; + } + + .lg\:hover\:border-pink-lightest:hover { + border-color: #ffebef; + } + + .lg\:focus\:border-transparent:focus { + border-color: transparent; + } + + .lg\:focus\:border-black:focus { + border-color: #22292f; + } + + .lg\:focus\:border-grey-darkest:focus { + border-color: #3d4852; + } + + .lg\:focus\:border-grey-darker:focus { + border-color: #606f7b; + } + + .lg\:focus\:border-grey-dark:focus { + border-color: #8795a1; + } + + .lg\:focus\:border-grey:focus { + border-color: #b8c2cc; + } + + .lg\:focus\:border-grey-light:focus { + border-color: #dae1e7; + } + + .lg\:focus\:border-grey-lighter:focus { + border-color: #f1f5f8; + } + + .lg\:focus\:border-grey-lightest:focus { + border-color: #f8fafc; + } + + .lg\:focus\:border-white:focus { + border-color: #fff; + } + + .lg\:focus\:border-red-darkest:focus { + border-color: #3b0d0c; + } + + .lg\:focus\:border-red-darker:focus { + border-color: #621b18; + } + + .lg\:focus\:border-red-dark:focus { + border-color: #cc1f1a; + } + + .lg\:focus\:border-red:focus { + border-color: #e3342f; + } + + .lg\:focus\:border-red-light:focus { + border-color: #ef5753; + } + + .lg\:focus\:border-red-lighter:focus { + border-color: #f9acaa; + } + + .lg\:focus\:border-red-lightest:focus { + border-color: #fcebea; + } + + .lg\:focus\:border-orange-darkest:focus { + border-color: #462a16; + } + + .lg\:focus\:border-orange-darker:focus { + border-color: #613b1f; + } + + .lg\:focus\:border-orange-dark:focus { + border-color: #de751f; + } + + .lg\:focus\:border-orange:focus { + border-color: #f6993f; + } + + .lg\:focus\:border-orange-light:focus { + border-color: #faad63; + } + + .lg\:focus\:border-orange-lighter:focus { + border-color: #fcd9b6; + } + + .lg\:focus\:border-orange-lightest:focus { + border-color: #fff5eb; + } + + .lg\:focus\:border-yellow-darkest:focus { + border-color: #453411; + } + + .lg\:focus\:border-yellow-darker:focus { + border-color: #684f1d; + } + + .lg\:focus\:border-yellow-dark:focus { + border-color: #f2d024; + } + + .lg\:focus\:border-yellow:focus { + border-color: #ffed4a; + } + + .lg\:focus\:border-yellow-light:focus { + border-color: #fff382; + } + + .lg\:focus\:border-yellow-lighter:focus { + border-color: #fff9c2; + } + + .lg\:focus\:border-yellow-lightest:focus { + border-color: #fcfbeb; + } + + .lg\:focus\:border-green-darkest:focus { + border-color: #0f2f21; + } + + .lg\:focus\:border-green-darker:focus { + border-color: #1a4731; + } + + .lg\:focus\:border-green-dark:focus { + border-color: #1f9d55; + } + + .lg\:focus\:border-green:focus { + border-color: #38c172; + } + + .lg\:focus\:border-green-light:focus { + border-color: #51d88a; + } + + .lg\:focus\:border-green-lighter:focus { + border-color: #a2f5bf; + } + + .lg\:focus\:border-green-lightest:focus { + border-color: #e3fcec; + } + + .lg\:focus\:border-teal-darkest:focus { + border-color: #0d3331; + } + + .lg\:focus\:border-teal-darker:focus { + border-color: #20504f; + } + + .lg\:focus\:border-teal-dark:focus { + border-color: #38a89d; + } + + .lg\:focus\:border-teal:focus { + border-color: #4dc0b5; + } + + .lg\:focus\:border-teal-light:focus { + border-color: #64d5ca; + } + + .lg\:focus\:border-teal-lighter:focus { + border-color: #a0f0ed; + } + + .lg\:focus\:border-teal-lightest:focus { + border-color: #e8fffe; + } + + .lg\:focus\:border-blue-darkest:focus { + border-color: #12283a; + } + + .lg\:focus\:border-blue-darker:focus { + border-color: #1c3d5a; + } + + .lg\:focus\:border-blue-dark:focus { + border-color: #2779bd; + } + + .lg\:focus\:border-blue:focus { + border-color: #3490dc; + } + + .lg\:focus\:border-blue-light:focus { + border-color: #6cb2eb; + } + + .lg\:focus\:border-blue-lighter:focus { + border-color: #bcdefa; + } + + .lg\:focus\:border-blue-lightest:focus { + border-color: #eff8ff; + } + + .lg\:focus\:border-indigo-darkest:focus { + border-color: #191e38; + } + + .lg\:focus\:border-indigo-darker:focus { + border-color: #2f365f; + } + + .lg\:focus\:border-indigo-dark:focus { + border-color: #5661b3; + } + + .lg\:focus\:border-indigo:focus { + border-color: #6574cd; + } + + .lg\:focus\:border-indigo-light:focus { + border-color: #7886d7; + } + + .lg\:focus\:border-indigo-lighter:focus { + border-color: #b2b7ff; + } + + .lg\:focus\:border-indigo-lightest:focus { + border-color: #e6e8ff; + } + + .lg\:focus\:border-purple-darkest:focus { + border-color: #21183c; + } + + .lg\:focus\:border-purple-darker:focus { + border-color: #382b5f; + } + + .lg\:focus\:border-purple-dark:focus { + border-color: #794acf; + } + + .lg\:focus\:border-purple:focus { + border-color: #9561e2; + } + + .lg\:focus\:border-purple-light:focus { + border-color: #a779e9; + } + + .lg\:focus\:border-purple-lighter:focus { + border-color: #d6bbfc; + } + + .lg\:focus\:border-purple-lightest:focus { + border-color: #f3ebff; + } + + .lg\:focus\:border-pink-darkest:focus { + border-color: #451225; + } + + .lg\:focus\:border-pink-darker:focus { + border-color: #6f213f; + } + + .lg\:focus\:border-pink-dark:focus { + border-color: #eb5286; + } + + .lg\:focus\:border-pink:focus { + border-color: #f66d9b; + } + + .lg\:focus\:border-pink-light:focus { + border-color: #fa7ea8; + } + + .lg\:focus\:border-pink-lighter:focus { + border-color: #ffbbca; + } + + .lg\:focus\:border-pink-lightest:focus { + border-color: #ffebef; + } + + .lg\:rounded-none { + border-radius: 0; + } + + .lg\:rounded-sm { + border-radius: .125rem; + } + + .lg\:rounded { + border-radius: .25rem; + } + + .lg\:rounded-lg { + border-radius: .5rem; + } + + .lg\:rounded-full { + border-radius: 9999px; + } + + .lg\:rounded-t-none { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + + .lg\:rounded-r-none { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + + .lg\:rounded-b-none { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + } + + .lg\:rounded-l-none { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + + .lg\:rounded-t-sm { + border-top-left-radius: .125rem; + border-top-right-radius: .125rem; + } + + .lg\:rounded-r-sm { + border-top-right-radius: .125rem; + border-bottom-right-radius: .125rem; + } + + .lg\:rounded-b-sm { + border-bottom-right-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .lg\:rounded-l-sm { + border-top-left-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .lg\:rounded-t { + border-top-left-radius: .25rem; + border-top-right-radius: .25rem; + } + + .lg\:rounded-r { + border-top-right-radius: .25rem; + border-bottom-right-radius: .25rem; + } + + .lg\:rounded-b { + border-bottom-right-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .lg\:rounded-l { + border-top-left-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .lg\:rounded-t-lg { + border-top-left-radius: .5rem; + border-top-right-radius: .5rem; + } + + .lg\:rounded-r-lg { + border-top-right-radius: .5rem; + border-bottom-right-radius: .5rem; + } + + .lg\:rounded-b-lg { + border-bottom-right-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .lg\:rounded-l-lg { + border-top-left-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .lg\:rounded-t-full { + border-top-left-radius: 9999px; + border-top-right-radius: 9999px; + } + + .lg\:rounded-r-full { + border-top-right-radius: 9999px; + border-bottom-right-radius: 9999px; + } + + .lg\:rounded-b-full { + border-bottom-right-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .lg\:rounded-l-full { + border-top-left-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .lg\:rounded-tl-none { + border-top-left-radius: 0; + } + + .lg\:rounded-tr-none { + border-top-right-radius: 0; + } + + .lg\:rounded-br-none { + border-bottom-right-radius: 0; + } + + .lg\:rounded-bl-none { + border-bottom-left-radius: 0; + } + + .lg\:rounded-tl-sm { + border-top-left-radius: .125rem; + } + + .lg\:rounded-tr-sm { + border-top-right-radius: .125rem; + } + + .lg\:rounded-br-sm { + border-bottom-right-radius: .125rem; + } + + .lg\:rounded-bl-sm { + border-bottom-left-radius: .125rem; + } + + .lg\:rounded-tl { + border-top-left-radius: .25rem; + } + + .lg\:rounded-tr { + border-top-right-radius: .25rem; + } + + .lg\:rounded-br { + border-bottom-right-radius: .25rem; + } + + .lg\:rounded-bl { + border-bottom-left-radius: .25rem; + } + + .lg\:rounded-tl-lg { + border-top-left-radius: .5rem; + } + + .lg\:rounded-tr-lg { + border-top-right-radius: .5rem; + } + + .lg\:rounded-br-lg { + border-bottom-right-radius: .5rem; + } + + .lg\:rounded-bl-lg { + border-bottom-left-radius: .5rem; + } + + .lg\:rounded-tl-full { + border-top-left-radius: 9999px; + } + + .lg\:rounded-tr-full { + border-top-right-radius: 9999px; + } + + .lg\:rounded-br-full { + border-bottom-right-radius: 9999px; + } + + .lg\:rounded-bl-full { + border-bottom-left-radius: 9999px; + } + + .lg\:border-solid { + border-style: solid; + } + + .lg\:border-dashed { + border-style: dashed; + } + + .lg\:border-dotted { + border-style: dotted; + } + + .lg\:border-none { + border-style: none; + } + + .lg\:border-0 { + border-width: 0; + } + + .lg\:border-2 { + border-width: 2px; + } + + .lg\:border-4 { + border-width: 4px; + } + + .lg\:border-8 { + border-width: 8px; + } + + .lg\:border { + border-width: 1px; + } + + .lg\:border-t-0 { + border-top-width: 0; + } + + .lg\:border-r-0 { + border-right-width: 0; + } + + .lg\:border-b-0 { + border-bottom-width: 0; + } + + .lg\:border-l-0 { + border-left-width: 0; + } + + .lg\:border-t-2 { + border-top-width: 2px; + } + + .lg\:border-r-2 { + border-right-width: 2px; + } + + .lg\:border-b-2 { + border-bottom-width: 2px; + } + + .lg\:border-l-2 { + border-left-width: 2px; + } + + .lg\:border-t-4 { + border-top-width: 4px; + } + + .lg\:border-r-4 { + border-right-width: 4px; + } + + .lg\:border-b-4 { + border-bottom-width: 4px; + } + + .lg\:border-l-4 { + border-left-width: 4px; + } + + .lg\:border-t-8 { + border-top-width: 8px; + } + + .lg\:border-r-8 { + border-right-width: 8px; + } + + .lg\:border-b-8 { + border-bottom-width: 8px; + } + + .lg\:border-l-8 { + border-left-width: 8px; + } + + .lg\:border-t { + border-top-width: 1px; + } + + .lg\:border-r { + border-right-width: 1px; + } + + .lg\:border-b { + border-bottom-width: 1px; + } + + .lg\:border-l { + border-left-width: 1px; + } + + .lg\:cursor-auto { + cursor: auto; + } + + .lg\:cursor-default { + cursor: default; + } + + .lg\:cursor-pointer { + cursor: pointer; + } + + .lg\:cursor-wait { + cursor: wait; + } + + .lg\:cursor-move { + cursor: move; + } + + .lg\:cursor-not-allowed { + cursor: not-allowed; + } + + .lg\:block { + display: block; + } + + .lg\:inline-block { + display: inline-block; + } + + .lg\:inline { + display: inline; + } + + .lg\:table { + display: table; + } + + .lg\:table-row { + display: table-row; + } + + .lg\:table-cell { + display: table-cell; + } + + .lg\:hidden { + display: none; + } + + .lg\:flex { + display: flex; + } + + .lg\:inline-flex { + display: inline-flex; + } + + .lg\:flex-row { + flex-direction: row; + } + + .lg\:flex-row-reverse { + flex-direction: row-reverse; + } + + .lg\:flex-col { + flex-direction: column; + } + + .lg\:flex-col-reverse { + flex-direction: column-reverse; + } + + .lg\:flex-wrap { + flex-wrap: wrap; + } + + .lg\:flex-wrap-reverse { + flex-wrap: wrap-reverse; + } + + .lg\:flex-no-wrap { + flex-wrap: nowrap; + } + + .lg\:items-start { + align-items: flex-start; + } + + .lg\:items-end { + align-items: flex-end; + } + + .lg\:items-center { + align-items: center; + } + + .lg\:items-baseline { + align-items: baseline; + } + + .lg\:items-stretch { + align-items: stretch; + } + + .lg\:self-auto { + align-self: auto; + } + + .lg\:self-start { + align-self: flex-start; + } + + .lg\:self-end { + align-self: flex-end; + } + + .lg\:self-center { + align-self: center; + } + + .lg\:self-stretch { + align-self: stretch; + } + + .lg\:justify-start { + justify-content: flex-start; + } + + .lg\:justify-end { + justify-content: flex-end; + } + + .lg\:justify-center { + justify-content: center; + } + + .lg\:justify-between { + justify-content: space-between; + } + + .lg\:justify-around { + justify-content: space-around; + } + + .lg\:content-center { + align-content: center; + } + + .lg\:content-start { + align-content: flex-start; + } + + .lg\:content-end { + align-content: flex-end; + } + + .lg\:content-between { + align-content: space-between; + } + + .lg\:content-around { + align-content: space-around; + } + + .lg\:flex-1 { + flex: 1 1 0%; + } + + .lg\:flex-auto { + flex: 1 1 auto; + } + + .lg\:flex-initial { + flex: 0 1 auto; + } + + .lg\:flex-none { + flex: none; + } + + .lg\:flex-grow { + flex-grow: 1; + } + + .lg\:flex-shrink { + flex-shrink: 1; + } + + .lg\:flex-no-grow { + flex-grow: 0; + } + + .lg\:flex-no-shrink { + flex-shrink: 0; + } + + .lg\:float-right { + float: right; + } + + .lg\:float-left { + float: left; + } + + .lg\:float-none { + float: none; + } + + .lg\:clearfix:after { + content: ""; + display: table; + clear: both; + } + + .lg\:font-sans { + font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; + } + + .lg\:font-serif { + font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; + } + + .lg\:font-mono { + font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; + } + + .lg\:font-hairline { + font-weight: 100; + } + + .lg\:font-thin { + font-weight: 200; + } + + .lg\:font-light { + font-weight: 300; + } + + .lg\:font-normal { + font-weight: 400; + } + + .lg\:font-medium { + font-weight: 500; + } + + .lg\:font-semibold { + font-weight: 600; + } + + .lg\:font-bold { + font-weight: 700; + } + + .lg\:font-extrabold { + font-weight: 800; + } + + .lg\:font-black { + font-weight: 900; + } + + .lg\:hover\:font-hairline:hover { + font-weight: 100; + } + + .lg\:hover\:font-thin:hover { + font-weight: 200; + } + + .lg\:hover\:font-light:hover { + font-weight: 300; + } + + .lg\:hover\:font-normal:hover { + font-weight: 400; + } + + .lg\:hover\:font-medium:hover { + font-weight: 500; + } + + .lg\:hover\:font-semibold:hover { + font-weight: 600; + } + + .lg\:hover\:font-bold:hover { + font-weight: 700; + } + + .lg\:hover\:font-extrabold:hover { + font-weight: 800; + } + + .lg\:hover\:font-black:hover { + font-weight: 900; + } + + .lg\:focus\:font-hairline:focus { + font-weight: 100; + } + + .lg\:focus\:font-thin:focus { + font-weight: 200; + } + + .lg\:focus\:font-light:focus { + font-weight: 300; + } + + .lg\:focus\:font-normal:focus { + font-weight: 400; + } + + .lg\:focus\:font-medium:focus { + font-weight: 500; + } + + .lg\:focus\:font-semibold:focus { + font-weight: 600; + } + + .lg\:focus\:font-bold:focus { + font-weight: 700; + } + + .lg\:focus\:font-extrabold:focus { + font-weight: 800; + } + + .lg\:focus\:font-black:focus { + font-weight: 900; + } + + .lg\:h-1 { + height: .25rem; + } + + .lg\:h-2 { + height: .5rem; + } + + .lg\:h-3 { + height: .75rem; + } + + .lg\:h-4 { + height: 1rem; + } + + .lg\:h-5 { + height: 1.25rem; + } + + .lg\:h-6 { + height: 1.5rem; + } + + .lg\:h-8 { + height: 2rem; + } + + .lg\:h-10 { + height: 2.5rem; + } + + .lg\:h-12 { + height: 3rem; + } + + .lg\:h-16 { + height: 4rem; + } + + .lg\:h-24 { + height: 6rem; + } + + .lg\:h-32 { + height: 8rem; + } + + .lg\:h-48 { + height: 12rem; + } + + .lg\:h-64 { + height: 16rem; + } + + .lg\:h-auto { + height: auto; + } + + .lg\:h-px { + height: 1px; + } + + .lg\:h-full { + height: 100%; + } + + .lg\:h-screen { + height: 100vh; + } + + .lg\:leading-none { + line-height: 1; + } + + .lg\:leading-tight { + line-height: 1.25; + } + + .lg\:leading-normal { + line-height: 1.5; + } + + .lg\:leading-loose { + line-height: 2; + } + + .lg\:m-0 { + margin: 0; + } + + .lg\:m-1 { + margin: .25rem; + } + + .lg\:m-2 { + margin: .5rem; + } + + .lg\:m-3 { + margin: .75rem; + } + + .lg\:m-4 { + margin: 1rem; + } + + .lg\:m-5 { + margin: 1.25rem; + } + + .lg\:m-6 { + margin: 1.5rem; + } + + .lg\:m-8 { + margin: 2rem; + } + + .lg\:m-10 { + margin: 2.5rem; + } + + .lg\:m-12 { + margin: 3rem; + } + + .lg\:m-16 { + margin: 4rem; + } + + .lg\:m-20 { + margin: 5rem; + } + + .lg\:m-24 { + margin: 6rem; + } + + .lg\:m-32 { + margin: 8rem; + } + + .lg\:m-auto { + margin: auto; + } + + .lg\:m-px { + margin: 1px; + } + + .lg\:my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .lg\:mx-0 { + margin-left: 0; + margin-right: 0; + } + + .lg\:my-1 { + margin-top: .25rem; + margin-bottom: .25rem; + } + + .lg\:mx-1 { + margin-left: .25rem; + margin-right: .25rem; + } + + .lg\:my-2 { + margin-top: .5rem; + margin-bottom: .5rem; + } + + .lg\:mx-2 { + margin-left: .5rem; + margin-right: .5rem; + } + + .lg\:my-3 { + margin-top: .75rem; + margin-bottom: .75rem; + } + + .lg\:mx-3 { + margin-left: .75rem; + margin-right: .75rem; + } + + .lg\:my-4 { + margin-top: 1rem; + margin-bottom: 1rem; + } + + .lg\:mx-4 { + margin-left: 1rem; + margin-right: 1rem; + } + + .lg\:my-5 { + margin-top: 1.25rem; + margin-bottom: 1.25rem; + } + + .lg\:mx-5 { + margin-left: 1.25rem; + margin-right: 1.25rem; + } + + .lg\:my-6 { + margin-top: 1.5rem; + margin-bottom: 1.5rem; + } + + .lg\:mx-6 { + margin-left: 1.5rem; + margin-right: 1.5rem; + } + + .lg\:my-8 { + margin-top: 2rem; + margin-bottom: 2rem; + } + + .lg\:mx-8 { + margin-left: 2rem; + margin-right: 2rem; + } + + .lg\:my-10 { + margin-top: 2.5rem; + margin-bottom: 2.5rem; + } + + .lg\:mx-10 { + margin-left: 2.5rem; + margin-right: 2.5rem; + } + + .lg\:my-12 { + margin-top: 3rem; + margin-bottom: 3rem; + } + + .lg\:mx-12 { + margin-left: 3rem; + margin-right: 3rem; + } + + .lg\:my-16 { + margin-top: 4rem; + margin-bottom: 4rem; + } + + .lg\:mx-16 { + margin-left: 4rem; + margin-right: 4rem; + } + + .lg\:my-20 { + margin-top: 5rem; + margin-bottom: 5rem; + } + + .lg\:mx-20 { + margin-left: 5rem; + margin-right: 5rem; + } + + .lg\:my-24 { + margin-top: 6rem; + margin-bottom: 6rem; + } + + .lg\:mx-24 { + margin-left: 6rem; + margin-right: 6rem; + } + + .lg\:my-32 { + margin-top: 8rem; + margin-bottom: 8rem; + } + + .lg\:mx-32 { + margin-left: 8rem; + margin-right: 8rem; + } + + .lg\:my-auto { + margin-top: auto; + margin-bottom: auto; + } + + .lg\:mx-auto { + margin-left: auto; + margin-right: auto; + } + + .lg\:my-px { + margin-top: 1px; + margin-bottom: 1px; + } + + .lg\:mx-px { + margin-left: 1px; + margin-right: 1px; + } + + .lg\:mt-0 { + margin-top: 0; + } + + .lg\:mr-0 { + margin-right: 0; + } + + .lg\:mb-0 { + margin-bottom: 0; + } + + .lg\:ml-0 { + margin-left: 0; + } + + .lg\:mt-1 { + margin-top: .25rem; + } + + .lg\:mr-1 { + margin-right: .25rem; + } + + .lg\:mb-1 { + margin-bottom: .25rem; + } + + .lg\:ml-1 { + margin-left: .25rem; + } + + .lg\:mt-2 { + margin-top: .5rem; + } + + .lg\:mr-2 { + margin-right: .5rem; + } + + .lg\:mb-2 { + margin-bottom: .5rem; + } + + .lg\:ml-2 { + margin-left: .5rem; + } + + .lg\:mt-3 { + margin-top: .75rem; + } + + .lg\:mr-3 { + margin-right: .75rem; + } + + .lg\:mb-3 { + margin-bottom: .75rem; + } + + .lg\:ml-3 { + margin-left: .75rem; + } + + .lg\:mt-4 { + margin-top: 1rem; + } + + .lg\:mr-4 { + margin-right: 1rem; + } + + .lg\:mb-4 { + margin-bottom: 1rem; + } + + .lg\:ml-4 { + margin-left: 1rem; + } + + .lg\:mt-5 { + margin-top: 1.25rem; + } + + .lg\:mr-5 { + margin-right: 1.25rem; + } + + .lg\:mb-5 { + margin-bottom: 1.25rem; + } + + .lg\:ml-5 { + margin-left: 1.25rem; + } + + .lg\:mt-6 { + margin-top: 1.5rem; + } + + .lg\:mr-6 { + margin-right: 1.5rem; + } + + .lg\:mb-6 { + margin-bottom: 1.5rem; + } + + .lg\:ml-6 { + margin-left: 1.5rem; + } + + .lg\:mt-8 { + margin-top: 2rem; + } + + .lg\:mr-8 { + margin-right: 2rem; + } + + .lg\:mb-8 { + margin-bottom: 2rem; + } + + .lg\:ml-8 { + margin-left: 2rem; + } + + .lg\:mt-10 { + margin-top: 2.5rem; + } + + .lg\:mr-10 { + margin-right: 2.5rem; + } + + .lg\:mb-10 { + margin-bottom: 2.5rem; + } + + .lg\:ml-10 { + margin-left: 2.5rem; + } + + .lg\:mt-12 { + margin-top: 3rem; + } + + .lg\:mr-12 { + margin-right: 3rem; + } + + .lg\:mb-12 { + margin-bottom: 3rem; + } + + .lg\:ml-12 { + margin-left: 3rem; + } + + .lg\:mt-16 { + margin-top: 4rem; + } + + .lg\:mr-16 { + margin-right: 4rem; + } + + .lg\:mb-16 { + margin-bottom: 4rem; + } + + .lg\:ml-16 { + margin-left: 4rem; + } + + .lg\:mt-20 { + margin-top: 5rem; + } + + .lg\:mr-20 { + margin-right: 5rem; + } + + .lg\:mb-20 { + margin-bottom: 5rem; + } + + .lg\:ml-20 { + margin-left: 5rem; + } + + .lg\:mt-24 { + margin-top: 6rem; + } + + .lg\:mr-24 { + margin-right: 6rem; + } + + .lg\:mb-24 { + margin-bottom: 6rem; + } + + .lg\:ml-24 { + margin-left: 6rem; + } + + .lg\:mt-32 { + margin-top: 8rem; + } + + .lg\:mr-32 { + margin-right: 8rem; + } + + .lg\:mb-32 { + margin-bottom: 8rem; + } + + .lg\:ml-32 { + margin-left: 8rem; + } + + .lg\:mt-auto { + margin-top: auto; + } + + .lg\:mr-auto { + margin-right: auto; + } + + .lg\:mb-auto { + margin-bottom: auto; + } + + .lg\:ml-auto { + margin-left: auto; + } + + .lg\:mt-px { + margin-top: 1px; + } + + .lg\:mr-px { + margin-right: 1px; + } + + .lg\:mb-px { + margin-bottom: 1px; + } + + .lg\:ml-px { + margin-left: 1px; + } + + .lg\:max-h-full { + max-height: 100%; + } + + .lg\:max-h-screen { + max-height: 100vh; + } + + .lg\:max-w-xs { + max-width: 20rem; + } + + .lg\:max-w-sm { + max-width: 30rem; + } + + .lg\:max-w-md { + max-width: 40rem; + } + + .lg\:max-w-lg { + max-width: 50rem; + } + + .lg\:max-w-xl { + max-width: 60rem; + } + + .lg\:max-w-2xl { + max-width: 70rem; + } + + .lg\:max-w-3xl { + max-width: 80rem; + } + + .lg\:max-w-4xl { + max-width: 90rem; + } + + .lg\:max-w-5xl { + max-width: 100rem; + } + + .lg\:max-w-full { + max-width: 100%; + } + + .lg\:min-h-0 { + min-height: 0; + } + + .lg\:min-h-full { + min-height: 100%; + } + + .lg\:min-h-screen { + min-height: 100vh; + } + + .lg\:min-w-0 { + min-width: 0; + } + + .lg\:min-w-full { + min-width: 100%; + } + + .lg\:-m-0 { + margin: 0; + } + + .lg\:-m-1 { + margin: -0.25rem; + } + + .lg\:-m-2 { + margin: -0.5rem; + } + + .lg\:-m-3 { + margin: -0.75rem; + } + + .lg\:-m-4 { + margin: -1rem; + } + + .lg\:-m-5 { + margin: -1.25rem; + } + + .lg\:-m-6 { + margin: -1.5rem; + } + + .lg\:-m-8 { + margin: -2rem; + } + + .lg\:-m-10 { + margin: -2.5rem; + } + + .lg\:-m-12 { + margin: -3rem; + } + + .lg\:-m-16 { + margin: -4rem; + } + + .lg\:-m-20 { + margin: -5rem; + } + + .lg\:-m-24 { + margin: -6rem; + } + + .lg\:-m-32 { + margin: -8rem; + } + + .lg\:-m-px { + margin: -1px; + } + + .lg\:-my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .lg\:-mx-0 { + margin-left: 0; + margin-right: 0; + } + + .lg\:-my-1 { + margin-top: -0.25rem; + margin-bottom: -0.25rem; + } + + .lg\:-mx-1 { + margin-left: -0.25rem; + margin-right: -0.25rem; + } + + .lg\:-my-2 { + margin-top: -0.5rem; + margin-bottom: -0.5rem; + } + + .lg\:-mx-2 { + margin-left: -0.5rem; + margin-right: -0.5rem; + } + + .lg\:-my-3 { + margin-top: -0.75rem; + margin-bottom: -0.75rem; + } + + .lg\:-mx-3 { + margin-left: -0.75rem; + margin-right: -0.75rem; + } + + .lg\:-my-4 { + margin-top: -1rem; + margin-bottom: -1rem; + } + + .lg\:-mx-4 { + margin-left: -1rem; + margin-right: -1rem; + } + + .lg\:-my-5 { + margin-top: -1.25rem; + margin-bottom: -1.25rem; + } + + .lg\:-mx-5 { + margin-left: -1.25rem; + margin-right: -1.25rem; + } + + .lg\:-my-6 { + margin-top: -1.5rem; + margin-bottom: -1.5rem; + } + + .lg\:-mx-6 { + margin-left: -1.5rem; + margin-right: -1.5rem; + } + + .lg\:-my-8 { + margin-top: -2rem; + margin-bottom: -2rem; + } + + .lg\:-mx-8 { + margin-left: -2rem; + margin-right: -2rem; + } + + .lg\:-my-10 { + margin-top: -2.5rem; + margin-bottom: -2.5rem; + } + + .lg\:-mx-10 { + margin-left: -2.5rem; + margin-right: -2.5rem; + } + + .lg\:-my-12 { + margin-top: -3rem; + margin-bottom: -3rem; + } + + .lg\:-mx-12 { + margin-left: -3rem; + margin-right: -3rem; + } + + .lg\:-my-16 { + margin-top: -4rem; + margin-bottom: -4rem; + } + + .lg\:-mx-16 { + margin-left: -4rem; + margin-right: -4rem; + } + + .lg\:-my-20 { + margin-top: -5rem; + margin-bottom: -5rem; + } + + .lg\:-mx-20 { + margin-left: -5rem; + margin-right: -5rem; + } + + .lg\:-my-24 { + margin-top: -6rem; + margin-bottom: -6rem; + } + + .lg\:-mx-24 { + margin-left: -6rem; + margin-right: -6rem; + } + + .lg\:-my-32 { + margin-top: -8rem; + margin-bottom: -8rem; + } + + .lg\:-mx-32 { + margin-left: -8rem; + margin-right: -8rem; + } + + .lg\:-my-px { + margin-top: -1px; + margin-bottom: -1px; + } + + .lg\:-mx-px { + margin-left: -1px; + margin-right: -1px; + } + + .lg\:-mt-0 { + margin-top: 0; + } + + .lg\:-mr-0 { + margin-right: 0; + } + + .lg\:-mb-0 { + margin-bottom: 0; + } + + .lg\:-ml-0 { + margin-left: 0; + } + + .lg\:-mt-1 { + margin-top: -0.25rem; + } + + .lg\:-mr-1 { + margin-right: -0.25rem; + } + + .lg\:-mb-1 { + margin-bottom: -0.25rem; + } + + .lg\:-ml-1 { + margin-left: -0.25rem; + } + + .lg\:-mt-2 { + margin-top: -0.5rem; + } + + .lg\:-mr-2 { + margin-right: -0.5rem; + } + + .lg\:-mb-2 { + margin-bottom: -0.5rem; + } + + .lg\:-ml-2 { + margin-left: -0.5rem; + } + + .lg\:-mt-3 { + margin-top: -0.75rem; + } + + .lg\:-mr-3 { + margin-right: -0.75rem; + } + + .lg\:-mb-3 { + margin-bottom: -0.75rem; + } + + .lg\:-ml-3 { + margin-left: -0.75rem; + } + + .lg\:-mt-4 { + margin-top: -1rem; + } + + .lg\:-mr-4 { + margin-right: -1rem; + } + + .lg\:-mb-4 { + margin-bottom: -1rem; + } + + .lg\:-ml-4 { + margin-left: -1rem; + } + + .lg\:-mt-5 { + margin-top: -1.25rem; + } + + .lg\:-mr-5 { + margin-right: -1.25rem; + } + + .lg\:-mb-5 { + margin-bottom: -1.25rem; + } + + .lg\:-ml-5 { + margin-left: -1.25rem; + } + + .lg\:-mt-6 { + margin-top: -1.5rem; + } + + .lg\:-mr-6 { + margin-right: -1.5rem; + } + + .lg\:-mb-6 { + margin-bottom: -1.5rem; + } + + .lg\:-ml-6 { + margin-left: -1.5rem; + } + + .lg\:-mt-8 { + margin-top: -2rem; + } + + .lg\:-mr-8 { + margin-right: -2rem; + } + + .lg\:-mb-8 { + margin-bottom: -2rem; + } + + .lg\:-ml-8 { + margin-left: -2rem; + } + + .lg\:-mt-10 { + margin-top: -2.5rem; + } + + .lg\:-mr-10 { + margin-right: -2.5rem; + } + + .lg\:-mb-10 { + margin-bottom: -2.5rem; + } + + .lg\:-ml-10 { + margin-left: -2.5rem; + } + + .lg\:-mt-12 { + margin-top: -3rem; + } + + .lg\:-mr-12 { + margin-right: -3rem; + } + + .lg\:-mb-12 { + margin-bottom: -3rem; + } + + .lg\:-ml-12 { + margin-left: -3rem; + } + + .lg\:-mt-16 { + margin-top: -4rem; + } + + .lg\:-mr-16 { + margin-right: -4rem; + } + + .lg\:-mb-16 { + margin-bottom: -4rem; + } + + .lg\:-ml-16 { + margin-left: -4rem; + } + + .lg\:-mt-20 { + margin-top: -5rem; + } + + .lg\:-mr-20 { + margin-right: -5rem; + } + + .lg\:-mb-20 { + margin-bottom: -5rem; + } + + .lg\:-ml-20 { + margin-left: -5rem; + } + + .lg\:-mt-24 { + margin-top: -6rem; + } + + .lg\:-mr-24 { + margin-right: -6rem; + } + + .lg\:-mb-24 { + margin-bottom: -6rem; + } + + .lg\:-ml-24 { + margin-left: -6rem; + } + + .lg\:-mt-32 { + margin-top: -8rem; + } + + .lg\:-mr-32 { + margin-right: -8rem; + } + + .lg\:-mb-32 { + margin-bottom: -8rem; + } + + .lg\:-ml-32 { + margin-left: -8rem; + } + + .lg\:-mt-px { + margin-top: -1px; + } + + .lg\:-mr-px { + margin-right: -1px; + } + + .lg\:-mb-px { + margin-bottom: -1px; + } + + .lg\:-ml-px { + margin-left: -1px; + } + + .lg\:opacity-0 { + opacity: 0; + } + + .lg\:opacity-25 { + opacity: .25; + } + + .lg\:opacity-50 { + opacity: .5; + } + + .lg\:opacity-75 { + opacity: .75; + } + + .lg\:opacity-100 { + opacity: 1; + } + + .lg\:overflow-auto { + overflow: auto; + } + + .lg\:overflow-hidden { + overflow: hidden; + } + + .lg\:overflow-visible { + overflow: visible; + } + + .lg\:overflow-scroll { + overflow: scroll; + } + + .lg\:overflow-x-auto { + overflow-x: auto; + } + + .lg\:overflow-y-auto { + overflow-y: auto; + } + + .lg\:overflow-x-hidden { + overflow-x: hidden; + } + + .lg\:overflow-y-hidden { + overflow-y: hidden; + } + + .lg\:overflow-x-visible { + overflow-x: visible; + } + + .lg\:overflow-y-visible { + overflow-y: visible; + } + + .lg\:overflow-x-scroll { + overflow-x: scroll; + } + + .lg\:overflow-y-scroll { + overflow-y: scroll; + } + + .lg\:scrolling-touch { + -webkit-overflow-scrolling: touch; + } + + .lg\:scrolling-auto { + -webkit-overflow-scrolling: auto; + } + + .lg\:p-0 { + padding: 0; + } + + .lg\:p-1 { + padding: .25rem; + } + + .lg\:p-2 { + padding: .5rem; + } + + .lg\:p-3 { + padding: .75rem; + } + + .lg\:p-4 { + padding: 1rem; + } + + .lg\:p-5 { + padding: 1.25rem; + } + + .lg\:p-6 { + padding: 1.5rem; + } + + .lg\:p-8 { + padding: 2rem; + } + + .lg\:p-10 { + padding: 2.5rem; + } + + .lg\:p-12 { + padding: 3rem; + } + + .lg\:p-16 { + padding: 4rem; + } + + .lg\:p-20 { + padding: 5rem; + } + + .lg\:p-24 { + padding: 6rem; + } + + .lg\:p-32 { + padding: 8rem; + } + + .lg\:p-px { + padding: 1px; + } + + .lg\:py-0 { + padding-top: 0; + padding-bottom: 0; + } + + .lg\:px-0 { + padding-left: 0; + padding-right: 0; + } + + .lg\:py-1 { + padding-top: .25rem; + padding-bottom: .25rem; + } + + .lg\:px-1 { + padding-left: .25rem; + padding-right: .25rem; + } + + .lg\:py-2 { + padding-top: .5rem; + padding-bottom: .5rem; + } + + .lg\:px-2 { + padding-left: .5rem; + padding-right: .5rem; + } + + .lg\:py-3 { + padding-top: .75rem; + padding-bottom: .75rem; + } + + .lg\:px-3 { + padding-left: .75rem; + padding-right: .75rem; + } + + .lg\:py-4 { + padding-top: 1rem; + padding-bottom: 1rem; + } + + .lg\:px-4 { + padding-left: 1rem; + padding-right: 1rem; + } + + .lg\:py-5 { + padding-top: 1.25rem; + padding-bottom: 1.25rem; + } + + .lg\:px-5 { + padding-left: 1.25rem; + padding-right: 1.25rem; + } + + .lg\:py-6 { + padding-top: 1.5rem; + padding-bottom: 1.5rem; + } + + .lg\:px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; + } + + .lg\:py-8 { + padding-top: 2rem; + padding-bottom: 2rem; + } + + .lg\:px-8 { + padding-left: 2rem; + padding-right: 2rem; + } + + .lg\:py-10 { + padding-top: 2.5rem; + padding-bottom: 2.5rem; + } + + .lg\:px-10 { + padding-left: 2.5rem; + padding-right: 2.5rem; + } + + .lg\:py-12 { + padding-top: 3rem; + padding-bottom: 3rem; + } + + .lg\:px-12 { + padding-left: 3rem; + padding-right: 3rem; + } + + .lg\:py-16 { + padding-top: 4rem; + padding-bottom: 4rem; + } + + .lg\:px-16 { + padding-left: 4rem; + padding-right: 4rem; + } + + .lg\:py-20 { + padding-top: 5rem; + padding-bottom: 5rem; + } + + .lg\:px-20 { + padding-left: 5rem; + padding-right: 5rem; + } + + .lg\:py-24 { + padding-top: 6rem; + padding-bottom: 6rem; + } + + .lg\:px-24 { + padding-left: 6rem; + padding-right: 6rem; + } + + .lg\:py-32 { + padding-top: 8rem; + padding-bottom: 8rem; + } + + .lg\:px-32 { + padding-left: 8rem; + padding-right: 8rem; + } + + .lg\:py-px { + padding-top: 1px; + padding-bottom: 1px; + } + + .lg\:px-px { + padding-left: 1px; + padding-right: 1px; + } + + .lg\:pt-0 { + padding-top: 0; + } + + .lg\:pr-0 { + padding-right: 0; + } + + .lg\:pb-0 { + padding-bottom: 0; + } + + .lg\:pl-0 { + padding-left: 0; + } + + .lg\:pt-1 { + padding-top: .25rem; + } + + .lg\:pr-1 { + padding-right: .25rem; + } + + .lg\:pb-1 { + padding-bottom: .25rem; + } + + .lg\:pl-1 { + padding-left: .25rem; + } + + .lg\:pt-2 { + padding-top: .5rem; + } + + .lg\:pr-2 { + padding-right: .5rem; + } + + .lg\:pb-2 { + padding-bottom: .5rem; + } + + .lg\:pl-2 { + padding-left: .5rem; + } + + .lg\:pt-3 { + padding-top: .75rem; + } + + .lg\:pr-3 { + padding-right: .75rem; + } + + .lg\:pb-3 { + padding-bottom: .75rem; + } + + .lg\:pl-3 { + padding-left: .75rem; + } + + .lg\:pt-4 { + padding-top: 1rem; + } + + .lg\:pr-4 { + padding-right: 1rem; + } + + .lg\:pb-4 { + padding-bottom: 1rem; + } + + .lg\:pl-4 { + padding-left: 1rem; + } + + .lg\:pt-5 { + padding-top: 1.25rem; + } + + .lg\:pr-5 { + padding-right: 1.25rem; + } + + .lg\:pb-5 { + padding-bottom: 1.25rem; + } + + .lg\:pl-5 { + padding-left: 1.25rem; + } + + .lg\:pt-6 { + padding-top: 1.5rem; + } + + .lg\:pr-6 { + padding-right: 1.5rem; + } + + .lg\:pb-6 { + padding-bottom: 1.5rem; + } + + .lg\:pl-6 { + padding-left: 1.5rem; + } + + .lg\:pt-8 { + padding-top: 2rem; + } + + .lg\:pr-8 { + padding-right: 2rem; + } + + .lg\:pb-8 { + padding-bottom: 2rem; + } + + .lg\:pl-8 { + padding-left: 2rem; + } + + .lg\:pt-10 { + padding-top: 2.5rem; + } + + .lg\:pr-10 { + padding-right: 2.5rem; + } + + .lg\:pb-10 { + padding-bottom: 2.5rem; + } + + .lg\:pl-10 { + padding-left: 2.5rem; + } + + .lg\:pt-12 { + padding-top: 3rem; + } + + .lg\:pr-12 { + padding-right: 3rem; + } + + .lg\:pb-12 { + padding-bottom: 3rem; + } + + .lg\:pl-12 { + padding-left: 3rem; + } + + .lg\:pt-16 { + padding-top: 4rem; + } + + .lg\:pr-16 { + padding-right: 4rem; + } + + .lg\:pb-16 { + padding-bottom: 4rem; + } + + .lg\:pl-16 { + padding-left: 4rem; + } + + .lg\:pt-20 { + padding-top: 5rem; + } + + .lg\:pr-20 { + padding-right: 5rem; + } + + .lg\:pb-20 { + padding-bottom: 5rem; + } + + .lg\:pl-20 { + padding-left: 5rem; + } + + .lg\:pt-24 { + padding-top: 6rem; + } + + .lg\:pr-24 { + padding-right: 6rem; + } + + .lg\:pb-24 { + padding-bottom: 6rem; + } + + .lg\:pl-24 { + padding-left: 6rem; + } + + .lg\:pt-32 { + padding-top: 8rem; + } + + .lg\:pr-32 { + padding-right: 8rem; + } + + .lg\:pb-32 { + padding-bottom: 8rem; + } + + .lg\:pl-32 { + padding-left: 8rem; + } + + .lg\:pt-px { + padding-top: 1px; + } + + .lg\:pr-px { + padding-right: 1px; + } + + .lg\:pb-px { + padding-bottom: 1px; + } + + .lg\:pl-px { + padding-left: 1px; + } + + .lg\:pointer-events-none { + pointer-events: none; + } + + .lg\:pointer-events-auto { + pointer-events: auto; + } + + .lg\:static { + position: static; + } + + .lg\:fixed { + position: fixed; + } + + .lg\:absolute { + position: absolute; + } + + .lg\:relative { + position: relative; + } + + .lg\:sticky { + position: -webkit-sticky; + position: sticky; + } + + .lg\:pin-none { + top: auto; + right: auto; + bottom: auto; + left: auto; + } + + .lg\:pin { + top: 0; + right: 0; + bottom: 0; + left: 0; + } + + .lg\:pin-y { + top: 0; + bottom: 0; + } + + .lg\:pin-x { + right: 0; + left: 0; + } + + .lg\:pin-t { + top: 0; + } + + .lg\:pin-r { + right: 0; + } + + .lg\:pin-b { + bottom: 0; + } + + .lg\:pin-l { + left: 0; + } + + .lg\:resize-none { + resize: none; + } + + .lg\:resize-y { + resize: vertical; + } + + .lg\:resize-x { + resize: horizontal; + } + + .lg\:resize { + resize: both; + } + + .lg\:shadow { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .lg\:shadow-md { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .lg\:shadow-lg { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .lg\:shadow-inner { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .lg\:shadow-outline { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .lg\:shadow-none { + box-shadow: none; + } + + .lg\:hover\:shadow:hover { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .lg\:hover\:shadow-md:hover { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .lg\:hover\:shadow-lg:hover { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .lg\:hover\:shadow-inner:hover { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .lg\:hover\:shadow-outline:hover { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .lg\:hover\:shadow-none:hover { + box-shadow: none; + } + + .lg\:focus\:shadow:focus { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .lg\:focus\:shadow-md:focus { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .lg\:focus\:shadow-lg:focus { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .lg\:focus\:shadow-inner:focus { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .lg\:focus\:shadow-outline:focus { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .lg\:focus\:shadow-none:focus { + box-shadow: none; + } + + .lg\:table-auto { + table-layout: auto; + } + + .lg\:table-fixed { + table-layout: fixed; + } + + .lg\:text-left { + text-align: left; + } + + .lg\:text-center { + text-align: center; + } + + .lg\:text-right { + text-align: right; + } + + .lg\:text-justify { + text-align: justify; + } + + .lg\:text-transparent { + color: transparent; + } + + .lg\:text-black { + color: #22292f; + } + + .lg\:text-grey-darkest { + color: #3d4852; + } + + .lg\:text-grey-darker { + color: #606f7b; + } + + .lg\:text-grey-dark { + color: #8795a1; + } + + .lg\:text-grey { + color: #b8c2cc; + } + + .lg\:text-grey-light { + color: #dae1e7; + } + + .lg\:text-grey-lighter { + color: #f1f5f8; + } + + .lg\:text-grey-lightest { + color: #f8fafc; + } + + .lg\:text-white { + color: #fff; + } + + .lg\:text-red-darkest { + color: #3b0d0c; + } + + .lg\:text-red-darker { + color: #621b18; + } + + .lg\:text-red-dark { + color: #cc1f1a; + } + + .lg\:text-red { + color: #e3342f; + } + + .lg\:text-red-light { + color: #ef5753; + } + + .lg\:text-red-lighter { + color: #f9acaa; + } + + .lg\:text-red-lightest { + color: #fcebea; + } + + .lg\:text-orange-darkest { + color: #462a16; + } + + .lg\:text-orange-darker { + color: #613b1f; + } + + .lg\:text-orange-dark { + color: #de751f; + } + + .lg\:text-orange { + color: #f6993f; + } + + .lg\:text-orange-light { + color: #faad63; + } + + .lg\:text-orange-lighter { + color: #fcd9b6; + } + + .lg\:text-orange-lightest { + color: #fff5eb; + } + + .lg\:text-yellow-darkest { + color: #453411; + } + + .lg\:text-yellow-darker { + color: #684f1d; + } + + .lg\:text-yellow-dark { + color: #f2d024; + } + + .lg\:text-yellow { + color: #ffed4a; + } + + .lg\:text-yellow-light { + color: #fff382; + } + + .lg\:text-yellow-lighter { + color: #fff9c2; + } + + .lg\:text-yellow-lightest { + color: #fcfbeb; + } + + .lg\:text-green-darkest { + color: #0f2f21; + } + + .lg\:text-green-darker { + color: #1a4731; + } + + .lg\:text-green-dark { + color: #1f9d55; + } + + .lg\:text-green { + color: #38c172; + } + + .lg\:text-green-light { + color: #51d88a; + } + + .lg\:text-green-lighter { + color: #a2f5bf; + } + + .lg\:text-green-lightest { + color: #e3fcec; + } + + .lg\:text-teal-darkest { + color: #0d3331; + } + + .lg\:text-teal-darker { + color: #20504f; + } + + .lg\:text-teal-dark { + color: #38a89d; + } + + .lg\:text-teal { + color: #4dc0b5; + } + + .lg\:text-teal-light { + color: #64d5ca; + } + + .lg\:text-teal-lighter { + color: #a0f0ed; + } + + .lg\:text-teal-lightest { + color: #e8fffe; + } + + .lg\:text-blue-darkest { + color: #12283a; + } + + .lg\:text-blue-darker { + color: #1c3d5a; + } + + .lg\:text-blue-dark { + color: #2779bd; + } + + .lg\:text-blue { + color: #3490dc; + } + + .lg\:text-blue-light { + color: #6cb2eb; + } + + .lg\:text-blue-lighter { + color: #bcdefa; + } + + .lg\:text-blue-lightest { + color: #eff8ff; + } + + .lg\:text-indigo-darkest { + color: #191e38; + } + + .lg\:text-indigo-darker { + color: #2f365f; + } + + .lg\:text-indigo-dark { + color: #5661b3; + } + + .lg\:text-indigo { + color: #6574cd; + } + + .lg\:text-indigo-light { + color: #7886d7; + } + + .lg\:text-indigo-lighter { + color: #b2b7ff; + } + + .lg\:text-indigo-lightest { + color: #e6e8ff; + } + + .lg\:text-purple-darkest { + color: #21183c; + } + + .lg\:text-purple-darker { + color: #382b5f; + } + + .lg\:text-purple-dark { + color: #794acf; + } + + .lg\:text-purple { + color: #9561e2; + } + + .lg\:text-purple-light { + color: #a779e9; + } + + .lg\:text-purple-lighter { + color: #d6bbfc; + } + + .lg\:text-purple-lightest { + color: #f3ebff; + } + + .lg\:text-pink-darkest { + color: #451225; + } + + .lg\:text-pink-darker { + color: #6f213f; + } + + .lg\:text-pink-dark { + color: #eb5286; + } + + .lg\:text-pink { + color: #f66d9b; + } + + .lg\:text-pink-light { + color: #fa7ea8; + } + + .lg\:text-pink-lighter { + color: #ffbbca; + } + + .lg\:text-pink-lightest { + color: #ffebef; + } + + .lg\:hover\:text-transparent:hover { + color: transparent; + } + + .lg\:hover\:text-black:hover { + color: #22292f; + } + + .lg\:hover\:text-grey-darkest:hover { + color: #3d4852; + } + + .lg\:hover\:text-grey-darker:hover { + color: #606f7b; + } + + .lg\:hover\:text-grey-dark:hover { + color: #8795a1; + } + + .lg\:hover\:text-grey:hover { + color: #b8c2cc; + } + + .lg\:hover\:text-grey-light:hover { + color: #dae1e7; + } + + .lg\:hover\:text-grey-lighter:hover { + color: #f1f5f8; + } + + .lg\:hover\:text-grey-lightest:hover { + color: #f8fafc; + } + + .lg\:hover\:text-white:hover { + color: #fff; + } + + .lg\:hover\:text-red-darkest:hover { + color: #3b0d0c; + } + + .lg\:hover\:text-red-darker:hover { + color: #621b18; + } + + .lg\:hover\:text-red-dark:hover { + color: #cc1f1a; + } + + .lg\:hover\:text-red:hover { + color: #e3342f; + } + + .lg\:hover\:text-red-light:hover { + color: #ef5753; + } + + .lg\:hover\:text-red-lighter:hover { + color: #f9acaa; + } + + .lg\:hover\:text-red-lightest:hover { + color: #fcebea; + } + + .lg\:hover\:text-orange-darkest:hover { + color: #462a16; + } + + .lg\:hover\:text-orange-darker:hover { + color: #613b1f; + } + + .lg\:hover\:text-orange-dark:hover { + color: #de751f; + } + + .lg\:hover\:text-orange:hover { + color: #f6993f; + } + + .lg\:hover\:text-orange-light:hover { + color: #faad63; + } + + .lg\:hover\:text-orange-lighter:hover { + color: #fcd9b6; + } + + .lg\:hover\:text-orange-lightest:hover { + color: #fff5eb; + } + + .lg\:hover\:text-yellow-darkest:hover { + color: #453411; + } + + .lg\:hover\:text-yellow-darker:hover { + color: #684f1d; + } + + .lg\:hover\:text-yellow-dark:hover { + color: #f2d024; + } + + .lg\:hover\:text-yellow:hover { + color: #ffed4a; + } + + .lg\:hover\:text-yellow-light:hover { + color: #fff382; + } + + .lg\:hover\:text-yellow-lighter:hover { + color: #fff9c2; + } + + .lg\:hover\:text-yellow-lightest:hover { + color: #fcfbeb; + } + + .lg\:hover\:text-green-darkest:hover { + color: #0f2f21; + } + + .lg\:hover\:text-green-darker:hover { + color: #1a4731; + } + + .lg\:hover\:text-green-dark:hover { + color: #1f9d55; + } + + .lg\:hover\:text-green:hover { + color: #38c172; + } + + .lg\:hover\:text-green-light:hover { + color: #51d88a; + } + + .lg\:hover\:text-green-lighter:hover { + color: #a2f5bf; + } + + .lg\:hover\:text-green-lightest:hover { + color: #e3fcec; + } + + .lg\:hover\:text-teal-darkest:hover { + color: #0d3331; + } + + .lg\:hover\:text-teal-darker:hover { + color: #20504f; + } + + .lg\:hover\:text-teal-dark:hover { + color: #38a89d; + } + + .lg\:hover\:text-teal:hover { + color: #4dc0b5; + } + + .lg\:hover\:text-teal-light:hover { + color: #64d5ca; + } + + .lg\:hover\:text-teal-lighter:hover { + color: #a0f0ed; + } + + .lg\:hover\:text-teal-lightest:hover { + color: #e8fffe; + } + + .lg\:hover\:text-blue-darkest:hover { + color: #12283a; + } + + .lg\:hover\:text-blue-darker:hover { + color: #1c3d5a; + } + + .lg\:hover\:text-blue-dark:hover { + color: #2779bd; + } + + .lg\:hover\:text-blue:hover { + color: #3490dc; + } + + .lg\:hover\:text-blue-light:hover { + color: #6cb2eb; + } + + .lg\:hover\:text-blue-lighter:hover { + color: #bcdefa; + } + + .lg\:hover\:text-blue-lightest:hover { + color: #eff8ff; + } + + .lg\:hover\:text-indigo-darkest:hover { + color: #191e38; + } + + .lg\:hover\:text-indigo-darker:hover { + color: #2f365f; + } + + .lg\:hover\:text-indigo-dark:hover { + color: #5661b3; + } + + .lg\:hover\:text-indigo:hover { + color: #6574cd; + } + + .lg\:hover\:text-indigo-light:hover { + color: #7886d7; + } + + .lg\:hover\:text-indigo-lighter:hover { + color: #b2b7ff; + } + + .lg\:hover\:text-indigo-lightest:hover { + color: #e6e8ff; + } + + .lg\:hover\:text-purple-darkest:hover { + color: #21183c; + } + + .lg\:hover\:text-purple-darker:hover { + color: #382b5f; + } + + .lg\:hover\:text-purple-dark:hover { + color: #794acf; + } + + .lg\:hover\:text-purple:hover { + color: #9561e2; + } + + .lg\:hover\:text-purple-light:hover { + color: #a779e9; + } + + .lg\:hover\:text-purple-lighter:hover { + color: #d6bbfc; + } + + .lg\:hover\:text-purple-lightest:hover { + color: #f3ebff; + } + + .lg\:hover\:text-pink-darkest:hover { + color: #451225; + } + + .lg\:hover\:text-pink-darker:hover { + color: #6f213f; + } + + .lg\:hover\:text-pink-dark:hover { + color: #eb5286; + } + + .lg\:hover\:text-pink:hover { + color: #f66d9b; + } + + .lg\:hover\:text-pink-light:hover { + color: #fa7ea8; + } + + .lg\:hover\:text-pink-lighter:hover { + color: #ffbbca; + } + + .lg\:hover\:text-pink-lightest:hover { + color: #ffebef; + } + + .lg\:focus\:text-transparent:focus { + color: transparent; + } + + .lg\:focus\:text-black:focus { + color: #22292f; + } + + .lg\:focus\:text-grey-darkest:focus { + color: #3d4852; + } + + .lg\:focus\:text-grey-darker:focus { + color: #606f7b; + } + + .lg\:focus\:text-grey-dark:focus { + color: #8795a1; + } + + .lg\:focus\:text-grey:focus { + color: #b8c2cc; + } + + .lg\:focus\:text-grey-light:focus { + color: #dae1e7; + } + + .lg\:focus\:text-grey-lighter:focus { + color: #f1f5f8; + } + + .lg\:focus\:text-grey-lightest:focus { + color: #f8fafc; + } + + .lg\:focus\:text-white:focus { + color: #fff; + } + + .lg\:focus\:text-red-darkest:focus { + color: #3b0d0c; + } + + .lg\:focus\:text-red-darker:focus { + color: #621b18; + } + + .lg\:focus\:text-red-dark:focus { + color: #cc1f1a; + } + + .lg\:focus\:text-red:focus { + color: #e3342f; + } + + .lg\:focus\:text-red-light:focus { + color: #ef5753; + } + + .lg\:focus\:text-red-lighter:focus { + color: #f9acaa; + } + + .lg\:focus\:text-red-lightest:focus { + color: #fcebea; + } + + .lg\:focus\:text-orange-darkest:focus { + color: #462a16; + } + + .lg\:focus\:text-orange-darker:focus { + color: #613b1f; + } + + .lg\:focus\:text-orange-dark:focus { + color: #de751f; + } + + .lg\:focus\:text-orange:focus { + color: #f6993f; + } + + .lg\:focus\:text-orange-light:focus { + color: #faad63; + } + + .lg\:focus\:text-orange-lighter:focus { + color: #fcd9b6; + } + + .lg\:focus\:text-orange-lightest:focus { + color: #fff5eb; + } + + .lg\:focus\:text-yellow-darkest:focus { + color: #453411; + } + + .lg\:focus\:text-yellow-darker:focus { + color: #684f1d; + } + + .lg\:focus\:text-yellow-dark:focus { + color: #f2d024; + } + + .lg\:focus\:text-yellow:focus { + color: #ffed4a; + } + + .lg\:focus\:text-yellow-light:focus { + color: #fff382; + } + + .lg\:focus\:text-yellow-lighter:focus { + color: #fff9c2; + } + + .lg\:focus\:text-yellow-lightest:focus { + color: #fcfbeb; + } + + .lg\:focus\:text-green-darkest:focus { + color: #0f2f21; + } + + .lg\:focus\:text-green-darker:focus { + color: #1a4731; + } + + .lg\:focus\:text-green-dark:focus { + color: #1f9d55; + } + + .lg\:focus\:text-green:focus { + color: #38c172; + } + + .lg\:focus\:text-green-light:focus { + color: #51d88a; + } + + .lg\:focus\:text-green-lighter:focus { + color: #a2f5bf; + } + + .lg\:focus\:text-green-lightest:focus { + color: #e3fcec; + } + + .lg\:focus\:text-teal-darkest:focus { + color: #0d3331; + } + + .lg\:focus\:text-teal-darker:focus { + color: #20504f; + } + + .lg\:focus\:text-teal-dark:focus { + color: #38a89d; + } + + .lg\:focus\:text-teal:focus { + color: #4dc0b5; + } + + .lg\:focus\:text-teal-light:focus { + color: #64d5ca; + } + + .lg\:focus\:text-teal-lighter:focus { + color: #a0f0ed; + } + + .lg\:focus\:text-teal-lightest:focus { + color: #e8fffe; + } + + .lg\:focus\:text-blue-darkest:focus { + color: #12283a; + } + + .lg\:focus\:text-blue-darker:focus { + color: #1c3d5a; + } + + .lg\:focus\:text-blue-dark:focus { + color: #2779bd; + } + + .lg\:focus\:text-blue:focus { + color: #3490dc; + } + + .lg\:focus\:text-blue-light:focus { + color: #6cb2eb; + } + + .lg\:focus\:text-blue-lighter:focus { + color: #bcdefa; + } + + .lg\:focus\:text-blue-lightest:focus { + color: #eff8ff; + } + + .lg\:focus\:text-indigo-darkest:focus { + color: #191e38; + } + + .lg\:focus\:text-indigo-darker:focus { + color: #2f365f; + } + + .lg\:focus\:text-indigo-dark:focus { + color: #5661b3; + } + + .lg\:focus\:text-indigo:focus { + color: #6574cd; + } + + .lg\:focus\:text-indigo-light:focus { + color: #7886d7; + } + + .lg\:focus\:text-indigo-lighter:focus { + color: #b2b7ff; + } + + .lg\:focus\:text-indigo-lightest:focus { + color: #e6e8ff; + } + + .lg\:focus\:text-purple-darkest:focus { + color: #21183c; + } + + .lg\:focus\:text-purple-darker:focus { + color: #382b5f; + } + + .lg\:focus\:text-purple-dark:focus { + color: #794acf; + } + + .lg\:focus\:text-purple:focus { + color: #9561e2; + } + + .lg\:focus\:text-purple-light:focus { + color: #a779e9; + } + + .lg\:focus\:text-purple-lighter:focus { + color: #d6bbfc; + } + + .lg\:focus\:text-purple-lightest:focus { + color: #f3ebff; + } + + .lg\:focus\:text-pink-darkest:focus { + color: #451225; + } + + .lg\:focus\:text-pink-darker:focus { + color: #6f213f; + } + + .lg\:focus\:text-pink-dark:focus { + color: #eb5286; + } + + .lg\:focus\:text-pink:focus { + color: #f66d9b; + } + + .lg\:focus\:text-pink-light:focus { + color: #fa7ea8; + } + + .lg\:focus\:text-pink-lighter:focus { + color: #ffbbca; + } + + .lg\:focus\:text-pink-lightest:focus { + color: #ffebef; + } + + .lg\:text-xs { + font-size: .75rem; + } + + .lg\:text-sm { + font-size: .875rem; + } + + .lg\:text-base { + font-size: 1rem; + } + + .lg\:text-lg { + font-size: 1.125rem; + } + + .lg\:text-xl { + font-size: 1.25rem; + } + + .lg\:text-2xl { + font-size: 1.5rem; + } + + .lg\:text-3xl { + font-size: 1.875rem; + } + + .lg\:text-4xl { + font-size: 2.25rem; + } + + .lg\:text-5xl { + font-size: 3rem; + } + + .lg\:italic { + font-style: italic; + } + + .lg\:roman { + font-style: normal; + } + + .lg\:uppercase { + text-transform: uppercase; + } + + .lg\:lowercase { + text-transform: lowercase; + } + + .lg\:capitalize { + text-transform: capitalize; + } + + .lg\:normal-case { + text-transform: none; + } + + .lg\:underline { + text-decoration: underline; + } + + .lg\:line-through { + text-decoration: line-through; + } + + .lg\:no-underline { + text-decoration: none; + } + + .lg\:antialiased { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .lg\:subpixel-antialiased { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .lg\:hover\:italic:hover { + font-style: italic; + } + + .lg\:hover\:roman:hover { + font-style: normal; + } + + .lg\:hover\:uppercase:hover { + text-transform: uppercase; + } + + .lg\:hover\:lowercase:hover { + text-transform: lowercase; + } + + .lg\:hover\:capitalize:hover { + text-transform: capitalize; + } + + .lg\:hover\:normal-case:hover { + text-transform: none; + } + + .lg\:hover\:underline:hover { + text-decoration: underline; + } + + .lg\:hover\:line-through:hover { + text-decoration: line-through; + } + + .lg\:hover\:no-underline:hover { + text-decoration: none; + } + + .lg\:hover\:antialiased:hover { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .lg\:hover\:subpixel-antialiased:hover { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .lg\:focus\:italic:focus { + font-style: italic; + } + + .lg\:focus\:roman:focus { + font-style: normal; + } + + .lg\:focus\:uppercase:focus { + text-transform: uppercase; + } + + .lg\:focus\:lowercase:focus { + text-transform: lowercase; + } + + .lg\:focus\:capitalize:focus { + text-transform: capitalize; + } + + .lg\:focus\:normal-case:focus { + text-transform: none; + } + + .lg\:focus\:underline:focus { + text-decoration: underline; + } + + .lg\:focus\:line-through:focus { + text-decoration: line-through; + } + + .lg\:focus\:no-underline:focus { + text-decoration: none; + } + + .lg\:focus\:antialiased:focus { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .lg\:focus\:subpixel-antialiased:focus { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .lg\:tracking-tight { + letter-spacing: -0.05em; + } + + .lg\:tracking-normal { + letter-spacing: 0; + } + + .lg\:tracking-wide { + letter-spacing: .05em; + } + + .lg\:select-none { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + } + + .lg\:select-text { + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; + } + + .lg\:align-baseline { + vertical-align: baseline; + } + + .lg\:align-top { + vertical-align: top; + } + + .lg\:align-middle { + vertical-align: middle; + } + + .lg\:align-bottom { + vertical-align: bottom; + } + + .lg\:align-text-top { + vertical-align: text-top; + } + + .lg\:align-text-bottom { + vertical-align: text-bottom; + } + + .lg\:visible { + visibility: visible; + } + + .lg\:invisible { + visibility: hidden; + } + + .lg\:whitespace-normal { + white-space: normal; + } + + .lg\:whitespace-no-wrap { + white-space: nowrap; + } + + .lg\:whitespace-pre { + white-space: pre; + } + + .lg\:whitespace-pre-line { + white-space: pre-line; + } + + .lg\:whitespace-pre-wrap { + white-space: pre-wrap; + } + + .lg\:break-words { + word-wrap: break-word; + } + + .lg\:break-normal { + word-wrap: normal; + } + + .lg\:truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + + .lg\:w-1 { + width: .25rem; + } + + .lg\:w-2 { + width: .5rem; + } + + .lg\:w-3 { + width: .75rem; + } + + .lg\:w-4 { + width: 1rem; + } + + .lg\:w-5 { + width: 1.25rem; + } + + .lg\:w-6 { + width: 1.5rem; + } + + .lg\:w-8 { + width: 2rem; + } + + .lg\:w-10 { + width: 2.5rem; + } + + .lg\:w-12 { + width: 3rem; + } + + .lg\:w-16 { + width: 4rem; + } + + .lg\:w-24 { + width: 6rem; + } + + .lg\:w-32 { + width: 8rem; + } + + .lg\:w-48 { + width: 12rem; + } + + .lg\:w-64 { + width: 16rem; + } + + .lg\:w-auto { + width: auto; + } + + .lg\:w-px { + width: 1px; + } + + .lg\:w-1\/2 { + width: 50%; + } + + .lg\:w-1\/3 { + width: 33.33333%; + } + + .lg\:w-2\/3 { + width: 66.66667%; + } + + .lg\:w-1\/4 { + width: 25%; + } + + .lg\:w-3\/4 { + width: 75%; + } + + .lg\:w-1\/5 { + width: 20%; + } + + .lg\:w-2\/5 { + width: 40%; + } + + .lg\:w-3\/5 { + width: 60%; + } + + .lg\:w-4\/5 { + width: 80%; + } + + .lg\:w-1\/6 { + width: 16.66667%; + } + + .lg\:w-5\/6 { + width: 83.33333%; + } + + .lg\:w-full { + width: 100%; + } + + .lg\:w-screen { + width: 100vw; + } + + .lg\:z-0 { + z-index: 0; + } + + .lg\:z-10 { + z-index: 10; + } + + .lg\:z-20 { + z-index: 20; + } + + .lg\:z-30 { + z-index: 30; + } + + .lg\:z-40 { + z-index: 40; + } + + .lg\:z-50 { + z-index: 50; + } + + .lg\:z-auto { + z-index: auto; + } +} + +@media (min-width: 1200px) { + .xl\:list-reset { + list-style: none; + padding: 0; + } + + .xl\:appearance-none { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + .xl\:bg-fixed { + background-attachment: fixed; + } + + .xl\:bg-local { + background-attachment: local; + } + + .xl\:bg-scroll { + background-attachment: scroll; + } + + .xl\:bg-transparent { + background-color: transparent; + } + + .xl\:bg-black { + background-color: #22292f; + } + + .xl\:bg-grey-darkest { + background-color: #3d4852; + } + + .xl\:bg-grey-darker { + background-color: #606f7b; + } + + .xl\:bg-grey-dark { + background-color: #8795a1; + } + + .xl\:bg-grey { + background-color: #b8c2cc; + } + + .xl\:bg-grey-light { + background-color: #dae1e7; + } + + .xl\:bg-grey-lighter { + background-color: #f1f5f8; + } + + .xl\:bg-grey-lightest { + background-color: #f8fafc; + } + + .xl\:bg-white { + background-color: #fff; + } + + .xl\:bg-red-darkest { + background-color: #3b0d0c; + } + + .xl\:bg-red-darker { + background-color: #621b18; + } + + .xl\:bg-red-dark { + background-color: #cc1f1a; + } + + .xl\:bg-red { + background-color: #e3342f; + } + + .xl\:bg-red-light { + background-color: #ef5753; + } + + .xl\:bg-red-lighter { + background-color: #f9acaa; + } + + .xl\:bg-red-lightest { + background-color: #fcebea; + } + + .xl\:bg-orange-darkest { + background-color: #462a16; + } + + .xl\:bg-orange-darker { + background-color: #613b1f; + } + + .xl\:bg-orange-dark { + background-color: #de751f; + } + + .xl\:bg-orange { + background-color: #f6993f; + } + + .xl\:bg-orange-light { + background-color: #faad63; + } + + .xl\:bg-orange-lighter { + background-color: #fcd9b6; + } + + .xl\:bg-orange-lightest { + background-color: #fff5eb; + } + + .xl\:bg-yellow-darkest { + background-color: #453411; + } + + .xl\:bg-yellow-darker { + background-color: #684f1d; + } + + .xl\:bg-yellow-dark { + background-color: #f2d024; + } + + .xl\:bg-yellow { + background-color: #ffed4a; + } + + .xl\:bg-yellow-light { + background-color: #fff382; + } + + .xl\:bg-yellow-lighter { + background-color: #fff9c2; + } + + .xl\:bg-yellow-lightest { + background-color: #fcfbeb; + } + + .xl\:bg-green-darkest { + background-color: #0f2f21; + } + + .xl\:bg-green-darker { + background-color: #1a4731; + } + + .xl\:bg-green-dark { + background-color: #1f9d55; + } + + .xl\:bg-green { + background-color: #38c172; + } + + .xl\:bg-green-light { + background-color: #51d88a; + } + + .xl\:bg-green-lighter { + background-color: #a2f5bf; + } + + .xl\:bg-green-lightest { + background-color: #e3fcec; + } + + .xl\:bg-teal-darkest { + background-color: #0d3331; + } + + .xl\:bg-teal-darker { + background-color: #20504f; + } + + .xl\:bg-teal-dark { + background-color: #38a89d; + } + + .xl\:bg-teal { + background-color: #4dc0b5; + } + + .xl\:bg-teal-light { + background-color: #64d5ca; + } + + .xl\:bg-teal-lighter { + background-color: #a0f0ed; + } + + .xl\:bg-teal-lightest { + background-color: #e8fffe; + } + + .xl\:bg-blue-darkest { + background-color: #12283a; + } + + .xl\:bg-blue-darker { + background-color: #1c3d5a; + } + + .xl\:bg-blue-dark { + background-color: #2779bd; + } + + .xl\:bg-blue { + background-color: #3490dc; + } + + .xl\:bg-blue-light { + background-color: #6cb2eb; + } + + .xl\:bg-blue-lighter { + background-color: #bcdefa; + } + + .xl\:bg-blue-lightest { + background-color: #eff8ff; + } + + .xl\:bg-indigo-darkest { + background-color: #191e38; + } + + .xl\:bg-indigo-darker { + background-color: #2f365f; + } + + .xl\:bg-indigo-dark { + background-color: #5661b3; + } + + .xl\:bg-indigo { + background-color: #6574cd; + } + + .xl\:bg-indigo-light { + background-color: #7886d7; + } + + .xl\:bg-indigo-lighter { + background-color: #b2b7ff; + } + + .xl\:bg-indigo-lightest { + background-color: #e6e8ff; + } + + .xl\:bg-purple-darkest { + background-color: #21183c; + } + + .xl\:bg-purple-darker { + background-color: #382b5f; + } + + .xl\:bg-purple-dark { + background-color: #794acf; + } + + .xl\:bg-purple { + background-color: #9561e2; + } + + .xl\:bg-purple-light { + background-color: #a779e9; + } + + .xl\:bg-purple-lighter { + background-color: #d6bbfc; + } + + .xl\:bg-purple-lightest { + background-color: #f3ebff; + } + + .xl\:bg-pink-darkest { + background-color: #451225; + } + + .xl\:bg-pink-darker { + background-color: #6f213f; + } + + .xl\:bg-pink-dark { + background-color: #eb5286; + } + + .xl\:bg-pink { + background-color: #f66d9b; + } + + .xl\:bg-pink-light { + background-color: #fa7ea8; + } + + .xl\:bg-pink-lighter { + background-color: #ffbbca; + } + + .xl\:bg-pink-lightest { + background-color: #ffebef; + } + + .xl\:hover\:bg-transparent:hover { + background-color: transparent; + } + + .xl\:hover\:bg-black:hover { + background-color: #22292f; + } + + .xl\:hover\:bg-grey-darkest:hover { + background-color: #3d4852; + } + + .xl\:hover\:bg-grey-darker:hover { + background-color: #606f7b; + } + + .xl\:hover\:bg-grey-dark:hover { + background-color: #8795a1; + } + + .xl\:hover\:bg-grey:hover { + background-color: #b8c2cc; + } + + .xl\:hover\:bg-grey-light:hover { + background-color: #dae1e7; + } + + .xl\:hover\:bg-grey-lighter:hover { + background-color: #f1f5f8; + } + + .xl\:hover\:bg-grey-lightest:hover { + background-color: #f8fafc; + } + + .xl\:hover\:bg-white:hover { + background-color: #fff; + } + + .xl\:hover\:bg-red-darkest:hover { + background-color: #3b0d0c; + } + + .xl\:hover\:bg-red-darker:hover { + background-color: #621b18; + } + + .xl\:hover\:bg-red-dark:hover { + background-color: #cc1f1a; + } + + .xl\:hover\:bg-red:hover { + background-color: #e3342f; + } + + .xl\:hover\:bg-red-light:hover { + background-color: #ef5753; + } + + .xl\:hover\:bg-red-lighter:hover { + background-color: #f9acaa; + } + + .xl\:hover\:bg-red-lightest:hover { + background-color: #fcebea; + } + + .xl\:hover\:bg-orange-darkest:hover { + background-color: #462a16; + } + + .xl\:hover\:bg-orange-darker:hover { + background-color: #613b1f; + } + + .xl\:hover\:bg-orange-dark:hover { + background-color: #de751f; + } + + .xl\:hover\:bg-orange:hover { + background-color: #f6993f; + } + + .xl\:hover\:bg-orange-light:hover { + background-color: #faad63; + } + + .xl\:hover\:bg-orange-lighter:hover { + background-color: #fcd9b6; + } + + .xl\:hover\:bg-orange-lightest:hover { + background-color: #fff5eb; + } + + .xl\:hover\:bg-yellow-darkest:hover { + background-color: #453411; + } + + .xl\:hover\:bg-yellow-darker:hover { + background-color: #684f1d; + } + + .xl\:hover\:bg-yellow-dark:hover { + background-color: #f2d024; + } + + .xl\:hover\:bg-yellow:hover { + background-color: #ffed4a; + } + + .xl\:hover\:bg-yellow-light:hover { + background-color: #fff382; + } + + .xl\:hover\:bg-yellow-lighter:hover { + background-color: #fff9c2; + } + + .xl\:hover\:bg-yellow-lightest:hover { + background-color: #fcfbeb; + } + + .xl\:hover\:bg-green-darkest:hover { + background-color: #0f2f21; + } + + .xl\:hover\:bg-green-darker:hover { + background-color: #1a4731; + } + + .xl\:hover\:bg-green-dark:hover { + background-color: #1f9d55; + } + + .xl\:hover\:bg-green:hover { + background-color: #38c172; + } + + .xl\:hover\:bg-green-light:hover { + background-color: #51d88a; + } + + .xl\:hover\:bg-green-lighter:hover { + background-color: #a2f5bf; + } + + .xl\:hover\:bg-green-lightest:hover { + background-color: #e3fcec; + } + + .xl\:hover\:bg-teal-darkest:hover { + background-color: #0d3331; + } + + .xl\:hover\:bg-teal-darker:hover { + background-color: #20504f; + } + + .xl\:hover\:bg-teal-dark:hover { + background-color: #38a89d; + } + + .xl\:hover\:bg-teal:hover { + background-color: #4dc0b5; + } + + .xl\:hover\:bg-teal-light:hover { + background-color: #64d5ca; + } + + .xl\:hover\:bg-teal-lighter:hover { + background-color: #a0f0ed; + } + + .xl\:hover\:bg-teal-lightest:hover { + background-color: #e8fffe; + } + + .xl\:hover\:bg-blue-darkest:hover { + background-color: #12283a; + } + + .xl\:hover\:bg-blue-darker:hover { + background-color: #1c3d5a; + } + + .xl\:hover\:bg-blue-dark:hover { + background-color: #2779bd; + } + + .xl\:hover\:bg-blue:hover { + background-color: #3490dc; + } + + .xl\:hover\:bg-blue-light:hover { + background-color: #6cb2eb; + } + + .xl\:hover\:bg-blue-lighter:hover { + background-color: #bcdefa; + } + + .xl\:hover\:bg-blue-lightest:hover { + background-color: #eff8ff; + } + + .xl\:hover\:bg-indigo-darkest:hover { + background-color: #191e38; + } + + .xl\:hover\:bg-indigo-darker:hover { + background-color: #2f365f; + } + + .xl\:hover\:bg-indigo-dark:hover { + background-color: #5661b3; + } + + .xl\:hover\:bg-indigo:hover { + background-color: #6574cd; + } + + .xl\:hover\:bg-indigo-light:hover { + background-color: #7886d7; + } + + .xl\:hover\:bg-indigo-lighter:hover { + background-color: #b2b7ff; + } + + .xl\:hover\:bg-indigo-lightest:hover { + background-color: #e6e8ff; + } + + .xl\:hover\:bg-purple-darkest:hover { + background-color: #21183c; + } + + .xl\:hover\:bg-purple-darker:hover { + background-color: #382b5f; + } + + .xl\:hover\:bg-purple-dark:hover { + background-color: #794acf; + } + + .xl\:hover\:bg-purple:hover { + background-color: #9561e2; + } + + .xl\:hover\:bg-purple-light:hover { + background-color: #a779e9; + } + + .xl\:hover\:bg-purple-lighter:hover { + background-color: #d6bbfc; + } + + .xl\:hover\:bg-purple-lightest:hover { + background-color: #f3ebff; + } + + .xl\:hover\:bg-pink-darkest:hover { + background-color: #451225; + } + + .xl\:hover\:bg-pink-darker:hover { + background-color: #6f213f; + } + + .xl\:hover\:bg-pink-dark:hover { + background-color: #eb5286; + } + + .xl\:hover\:bg-pink:hover { + background-color: #f66d9b; + } + + .xl\:hover\:bg-pink-light:hover { + background-color: #fa7ea8; + } + + .xl\:hover\:bg-pink-lighter:hover { + background-color: #ffbbca; + } + + .xl\:hover\:bg-pink-lightest:hover { + background-color: #ffebef; + } + + .xl\:focus\:bg-transparent:focus { + background-color: transparent; + } + + .xl\:focus\:bg-black:focus { + background-color: #22292f; + } + + .xl\:focus\:bg-grey-darkest:focus { + background-color: #3d4852; + } + + .xl\:focus\:bg-grey-darker:focus { + background-color: #606f7b; + } + + .xl\:focus\:bg-grey-dark:focus { + background-color: #8795a1; + } + + .xl\:focus\:bg-grey:focus { + background-color: #b8c2cc; + } + + .xl\:focus\:bg-grey-light:focus { + background-color: #dae1e7; + } + + .xl\:focus\:bg-grey-lighter:focus { + background-color: #f1f5f8; + } + + .xl\:focus\:bg-grey-lightest:focus { + background-color: #f8fafc; + } + + .xl\:focus\:bg-white:focus { + background-color: #fff; + } + + .xl\:focus\:bg-red-darkest:focus { + background-color: #3b0d0c; + } + + .xl\:focus\:bg-red-darker:focus { + background-color: #621b18; + } + + .xl\:focus\:bg-red-dark:focus { + background-color: #cc1f1a; + } + + .xl\:focus\:bg-red:focus { + background-color: #e3342f; + } + + .xl\:focus\:bg-red-light:focus { + background-color: #ef5753; + } + + .xl\:focus\:bg-red-lighter:focus { + background-color: #f9acaa; + } + + .xl\:focus\:bg-red-lightest:focus { + background-color: #fcebea; + } + + .xl\:focus\:bg-orange-darkest:focus { + background-color: #462a16; + } + + .xl\:focus\:bg-orange-darker:focus { + background-color: #613b1f; + } + + .xl\:focus\:bg-orange-dark:focus { + background-color: #de751f; + } + + .xl\:focus\:bg-orange:focus { + background-color: #f6993f; + } + + .xl\:focus\:bg-orange-light:focus { + background-color: #faad63; + } + + .xl\:focus\:bg-orange-lighter:focus { + background-color: #fcd9b6; + } + + .xl\:focus\:bg-orange-lightest:focus { + background-color: #fff5eb; + } + + .xl\:focus\:bg-yellow-darkest:focus { + background-color: #453411; + } + + .xl\:focus\:bg-yellow-darker:focus { + background-color: #684f1d; + } + + .xl\:focus\:bg-yellow-dark:focus { + background-color: #f2d024; + } + + .xl\:focus\:bg-yellow:focus { + background-color: #ffed4a; + } + + .xl\:focus\:bg-yellow-light:focus { + background-color: #fff382; + } + + .xl\:focus\:bg-yellow-lighter:focus { + background-color: #fff9c2; + } + + .xl\:focus\:bg-yellow-lightest:focus { + background-color: #fcfbeb; + } + + .xl\:focus\:bg-green-darkest:focus { + background-color: #0f2f21; + } + + .xl\:focus\:bg-green-darker:focus { + background-color: #1a4731; + } + + .xl\:focus\:bg-green-dark:focus { + background-color: #1f9d55; + } + + .xl\:focus\:bg-green:focus { + background-color: #38c172; + } + + .xl\:focus\:bg-green-light:focus { + background-color: #51d88a; + } + + .xl\:focus\:bg-green-lighter:focus { + background-color: #a2f5bf; + } + + .xl\:focus\:bg-green-lightest:focus { + background-color: #e3fcec; + } + + .xl\:focus\:bg-teal-darkest:focus { + background-color: #0d3331; + } + + .xl\:focus\:bg-teal-darker:focus { + background-color: #20504f; + } + + .xl\:focus\:bg-teal-dark:focus { + background-color: #38a89d; + } + + .xl\:focus\:bg-teal:focus { + background-color: #4dc0b5; + } + + .xl\:focus\:bg-teal-light:focus { + background-color: #64d5ca; + } + + .xl\:focus\:bg-teal-lighter:focus { + background-color: #a0f0ed; + } + + .xl\:focus\:bg-teal-lightest:focus { + background-color: #e8fffe; + } + + .xl\:focus\:bg-blue-darkest:focus { + background-color: #12283a; + } + + .xl\:focus\:bg-blue-darker:focus { + background-color: #1c3d5a; + } + + .xl\:focus\:bg-blue-dark:focus { + background-color: #2779bd; + } + + .xl\:focus\:bg-blue:focus { + background-color: #3490dc; + } + + .xl\:focus\:bg-blue-light:focus { + background-color: #6cb2eb; + } + + .xl\:focus\:bg-blue-lighter:focus { + background-color: #bcdefa; + } + + .xl\:focus\:bg-blue-lightest:focus { + background-color: #eff8ff; + } + + .xl\:focus\:bg-indigo-darkest:focus { + background-color: #191e38; + } + + .xl\:focus\:bg-indigo-darker:focus { + background-color: #2f365f; + } + + .xl\:focus\:bg-indigo-dark:focus { + background-color: #5661b3; + } + + .xl\:focus\:bg-indigo:focus { + background-color: #6574cd; + } + + .xl\:focus\:bg-indigo-light:focus { + background-color: #7886d7; + } + + .xl\:focus\:bg-indigo-lighter:focus { + background-color: #b2b7ff; + } + + .xl\:focus\:bg-indigo-lightest:focus { + background-color: #e6e8ff; + } + + .xl\:focus\:bg-purple-darkest:focus { + background-color: #21183c; + } + + .xl\:focus\:bg-purple-darker:focus { + background-color: #382b5f; + } + + .xl\:focus\:bg-purple-dark:focus { + background-color: #794acf; + } + + .xl\:focus\:bg-purple:focus { + background-color: #9561e2; + } + + .xl\:focus\:bg-purple-light:focus { + background-color: #a779e9; + } + + .xl\:focus\:bg-purple-lighter:focus { + background-color: #d6bbfc; + } + + .xl\:focus\:bg-purple-lightest:focus { + background-color: #f3ebff; + } + + .xl\:focus\:bg-pink-darkest:focus { + background-color: #451225; + } + + .xl\:focus\:bg-pink-darker:focus { + background-color: #6f213f; + } + + .xl\:focus\:bg-pink-dark:focus { + background-color: #eb5286; + } + + .xl\:focus\:bg-pink:focus { + background-color: #f66d9b; + } + + .xl\:focus\:bg-pink-light:focus { + background-color: #fa7ea8; + } + + .xl\:focus\:bg-pink-lighter:focus { + background-color: #ffbbca; + } + + .xl\:focus\:bg-pink-lightest:focus { + background-color: #ffebef; + } + + .xl\:bg-bottom { + background-position: bottom; + } + + .xl\:bg-center { + background-position: center; + } + + .xl\:bg-left { + background-position: left; + } + + .xl\:bg-left-bottom { + background-position: left bottom; + } + + .xl\:bg-left-top { + background-position: left top; + } + + .xl\:bg-right { + background-position: right; + } + + .xl\:bg-right-bottom { + background-position: right bottom; + } + + .xl\:bg-right-top { + background-position: right top; + } + + .xl\:bg-top { + background-position: top; + } + + .xl\:bg-repeat { + background-repeat: repeat; + } + + .xl\:bg-no-repeat { + background-repeat: no-repeat; + } + + .xl\:bg-repeat-x { + background-repeat: repeat-x; + } + + .xl\:bg-repeat-y { + background-repeat: repeat-y; + } + + .xl\:bg-auto { + background-size: auto; + } + + .xl\:bg-cover { + background-size: cover; + } + + .xl\:bg-contain { + background-size: contain; + } + + .xl\:border-transparent { + border-color: transparent; + } + + .xl\:border-black { + border-color: #22292f; + } + + .xl\:border-grey-darkest { + border-color: #3d4852; + } + + .xl\:border-grey-darker { + border-color: #606f7b; + } + + .xl\:border-grey-dark { + border-color: #8795a1; + } + + .xl\:border-grey { + border-color: #b8c2cc; + } + + .xl\:border-grey-light { + border-color: #dae1e7; + } + + .xl\:border-grey-lighter { + border-color: #f1f5f8; + } + + .xl\:border-grey-lightest { + border-color: #f8fafc; + } + + .xl\:border-white { + border-color: #fff; + } + + .xl\:border-red-darkest { + border-color: #3b0d0c; + } + + .xl\:border-red-darker { + border-color: #621b18; + } + + .xl\:border-red-dark { + border-color: #cc1f1a; + } + + .xl\:border-red { + border-color: #e3342f; + } + + .xl\:border-red-light { + border-color: #ef5753; + } + + .xl\:border-red-lighter { + border-color: #f9acaa; + } + + .xl\:border-red-lightest { + border-color: #fcebea; + } + + .xl\:border-orange-darkest { + border-color: #462a16; + } + + .xl\:border-orange-darker { + border-color: #613b1f; + } + + .xl\:border-orange-dark { + border-color: #de751f; + } + + .xl\:border-orange { + border-color: #f6993f; + } + + .xl\:border-orange-light { + border-color: #faad63; + } + + .xl\:border-orange-lighter { + border-color: #fcd9b6; + } + + .xl\:border-orange-lightest { + border-color: #fff5eb; + } + + .xl\:border-yellow-darkest { + border-color: #453411; + } + + .xl\:border-yellow-darker { + border-color: #684f1d; + } + + .xl\:border-yellow-dark { + border-color: #f2d024; + } + + .xl\:border-yellow { + border-color: #ffed4a; + } + + .xl\:border-yellow-light { + border-color: #fff382; + } + + .xl\:border-yellow-lighter { + border-color: #fff9c2; + } + + .xl\:border-yellow-lightest { + border-color: #fcfbeb; + } + + .xl\:border-green-darkest { + border-color: #0f2f21; + } + + .xl\:border-green-darker { + border-color: #1a4731; + } + + .xl\:border-green-dark { + border-color: #1f9d55; + } + + .xl\:border-green { + border-color: #38c172; + } + + .xl\:border-green-light { + border-color: #51d88a; + } + + .xl\:border-green-lighter { + border-color: #a2f5bf; + } + + .xl\:border-green-lightest { + border-color: #e3fcec; + } + + .xl\:border-teal-darkest { + border-color: #0d3331; + } + + .xl\:border-teal-darker { + border-color: #20504f; + } + + .xl\:border-teal-dark { + border-color: #38a89d; + } + + .xl\:border-teal { + border-color: #4dc0b5; + } + + .xl\:border-teal-light { + border-color: #64d5ca; + } + + .xl\:border-teal-lighter { + border-color: #a0f0ed; + } + + .xl\:border-teal-lightest { + border-color: #e8fffe; + } + + .xl\:border-blue-darkest { + border-color: #12283a; + } + + .xl\:border-blue-darker { + border-color: #1c3d5a; + } + + .xl\:border-blue-dark { + border-color: #2779bd; + } + + .xl\:border-blue { + border-color: #3490dc; + } + + .xl\:border-blue-light { + border-color: #6cb2eb; + } + + .xl\:border-blue-lighter { + border-color: #bcdefa; + } + + .xl\:border-blue-lightest { + border-color: #eff8ff; + } + + .xl\:border-indigo-darkest { + border-color: #191e38; + } + + .xl\:border-indigo-darker { + border-color: #2f365f; + } + + .xl\:border-indigo-dark { + border-color: #5661b3; + } + + .xl\:border-indigo { + border-color: #6574cd; + } + + .xl\:border-indigo-light { + border-color: #7886d7; + } + + .xl\:border-indigo-lighter { + border-color: #b2b7ff; + } + + .xl\:border-indigo-lightest { + border-color: #e6e8ff; + } + + .xl\:border-purple-darkest { + border-color: #21183c; + } + + .xl\:border-purple-darker { + border-color: #382b5f; + } + + .xl\:border-purple-dark { + border-color: #794acf; + } + + .xl\:border-purple { + border-color: #9561e2; + } + + .xl\:border-purple-light { + border-color: #a779e9; + } + + .xl\:border-purple-lighter { + border-color: #d6bbfc; + } + + .xl\:border-purple-lightest { + border-color: #f3ebff; + } + + .xl\:border-pink-darkest { + border-color: #451225; + } + + .xl\:border-pink-darker { + border-color: #6f213f; + } + + .xl\:border-pink-dark { + border-color: #eb5286; + } + + .xl\:border-pink { + border-color: #f66d9b; + } + + .xl\:border-pink-light { + border-color: #fa7ea8; + } + + .xl\:border-pink-lighter { + border-color: #ffbbca; + } + + .xl\:border-pink-lightest { + border-color: #ffebef; + } + + .xl\:hover\:border-transparent:hover { + border-color: transparent; + } + + .xl\:hover\:border-black:hover { + border-color: #22292f; + } + + .xl\:hover\:border-grey-darkest:hover { + border-color: #3d4852; + } + + .xl\:hover\:border-grey-darker:hover { + border-color: #606f7b; + } + + .xl\:hover\:border-grey-dark:hover { + border-color: #8795a1; + } + + .xl\:hover\:border-grey:hover { + border-color: #b8c2cc; + } + + .xl\:hover\:border-grey-light:hover { + border-color: #dae1e7; + } + + .xl\:hover\:border-grey-lighter:hover { + border-color: #f1f5f8; + } + + .xl\:hover\:border-grey-lightest:hover { + border-color: #f8fafc; + } + + .xl\:hover\:border-white:hover { + border-color: #fff; + } + + .xl\:hover\:border-red-darkest:hover { + border-color: #3b0d0c; + } + + .xl\:hover\:border-red-darker:hover { + border-color: #621b18; + } + + .xl\:hover\:border-red-dark:hover { + border-color: #cc1f1a; + } + + .xl\:hover\:border-red:hover { + border-color: #e3342f; + } + + .xl\:hover\:border-red-light:hover { + border-color: #ef5753; + } + + .xl\:hover\:border-red-lighter:hover { + border-color: #f9acaa; + } + + .xl\:hover\:border-red-lightest:hover { + border-color: #fcebea; + } + + .xl\:hover\:border-orange-darkest:hover { + border-color: #462a16; + } + + .xl\:hover\:border-orange-darker:hover { + border-color: #613b1f; + } + + .xl\:hover\:border-orange-dark:hover { + border-color: #de751f; + } + + .xl\:hover\:border-orange:hover { + border-color: #f6993f; + } + + .xl\:hover\:border-orange-light:hover { + border-color: #faad63; + } + + .xl\:hover\:border-orange-lighter:hover { + border-color: #fcd9b6; + } + + .xl\:hover\:border-orange-lightest:hover { + border-color: #fff5eb; + } + + .xl\:hover\:border-yellow-darkest:hover { + border-color: #453411; + } + + .xl\:hover\:border-yellow-darker:hover { + border-color: #684f1d; + } + + .xl\:hover\:border-yellow-dark:hover { + border-color: #f2d024; + } + + .xl\:hover\:border-yellow:hover { + border-color: #ffed4a; + } + + .xl\:hover\:border-yellow-light:hover { + border-color: #fff382; + } + + .xl\:hover\:border-yellow-lighter:hover { + border-color: #fff9c2; + } + + .xl\:hover\:border-yellow-lightest:hover { + border-color: #fcfbeb; + } + + .xl\:hover\:border-green-darkest:hover { + border-color: #0f2f21; + } + + .xl\:hover\:border-green-darker:hover { + border-color: #1a4731; + } + + .xl\:hover\:border-green-dark:hover { + border-color: #1f9d55; + } + + .xl\:hover\:border-green:hover { + border-color: #38c172; + } + + .xl\:hover\:border-green-light:hover { + border-color: #51d88a; + } + + .xl\:hover\:border-green-lighter:hover { + border-color: #a2f5bf; + } + + .xl\:hover\:border-green-lightest:hover { + border-color: #e3fcec; + } + + .xl\:hover\:border-teal-darkest:hover { + border-color: #0d3331; + } + + .xl\:hover\:border-teal-darker:hover { + border-color: #20504f; + } + + .xl\:hover\:border-teal-dark:hover { + border-color: #38a89d; + } + + .xl\:hover\:border-teal:hover { + border-color: #4dc0b5; + } + + .xl\:hover\:border-teal-light:hover { + border-color: #64d5ca; + } + + .xl\:hover\:border-teal-lighter:hover { + border-color: #a0f0ed; + } + + .xl\:hover\:border-teal-lightest:hover { + border-color: #e8fffe; + } + + .xl\:hover\:border-blue-darkest:hover { + border-color: #12283a; + } + + .xl\:hover\:border-blue-darker:hover { + border-color: #1c3d5a; + } + + .xl\:hover\:border-blue-dark:hover { + border-color: #2779bd; + } + + .xl\:hover\:border-blue:hover { + border-color: #3490dc; + } + + .xl\:hover\:border-blue-light:hover { + border-color: #6cb2eb; + } + + .xl\:hover\:border-blue-lighter:hover { + border-color: #bcdefa; + } + + .xl\:hover\:border-blue-lightest:hover { + border-color: #eff8ff; + } + + .xl\:hover\:border-indigo-darkest:hover { + border-color: #191e38; + } + + .xl\:hover\:border-indigo-darker:hover { + border-color: #2f365f; + } + + .xl\:hover\:border-indigo-dark:hover { + border-color: #5661b3; + } + + .xl\:hover\:border-indigo:hover { + border-color: #6574cd; + } + + .xl\:hover\:border-indigo-light:hover { + border-color: #7886d7; + } + + .xl\:hover\:border-indigo-lighter:hover { + border-color: #b2b7ff; + } + + .xl\:hover\:border-indigo-lightest:hover { + border-color: #e6e8ff; + } + + .xl\:hover\:border-purple-darkest:hover { + border-color: #21183c; + } + + .xl\:hover\:border-purple-darker:hover { + border-color: #382b5f; + } + + .xl\:hover\:border-purple-dark:hover { + border-color: #794acf; + } + + .xl\:hover\:border-purple:hover { + border-color: #9561e2; + } + + .xl\:hover\:border-purple-light:hover { + border-color: #a779e9; + } + + .xl\:hover\:border-purple-lighter:hover { + border-color: #d6bbfc; + } + + .xl\:hover\:border-purple-lightest:hover { + border-color: #f3ebff; + } + + .xl\:hover\:border-pink-darkest:hover { + border-color: #451225; + } + + .xl\:hover\:border-pink-darker:hover { + border-color: #6f213f; + } + + .xl\:hover\:border-pink-dark:hover { + border-color: #eb5286; + } + + .xl\:hover\:border-pink:hover { + border-color: #f66d9b; + } + + .xl\:hover\:border-pink-light:hover { + border-color: #fa7ea8; + } + + .xl\:hover\:border-pink-lighter:hover { + border-color: #ffbbca; + } + + .xl\:hover\:border-pink-lightest:hover { + border-color: #ffebef; + } + + .xl\:focus\:border-transparent:focus { + border-color: transparent; + } + + .xl\:focus\:border-black:focus { + border-color: #22292f; + } + + .xl\:focus\:border-grey-darkest:focus { + border-color: #3d4852; + } + + .xl\:focus\:border-grey-darker:focus { + border-color: #606f7b; + } + + .xl\:focus\:border-grey-dark:focus { + border-color: #8795a1; + } + + .xl\:focus\:border-grey:focus { + border-color: #b8c2cc; + } + + .xl\:focus\:border-grey-light:focus { + border-color: #dae1e7; + } + + .xl\:focus\:border-grey-lighter:focus { + border-color: #f1f5f8; + } + + .xl\:focus\:border-grey-lightest:focus { + border-color: #f8fafc; + } + + .xl\:focus\:border-white:focus { + border-color: #fff; + } + + .xl\:focus\:border-red-darkest:focus { + border-color: #3b0d0c; + } + + .xl\:focus\:border-red-darker:focus { + border-color: #621b18; + } + + .xl\:focus\:border-red-dark:focus { + border-color: #cc1f1a; + } + + .xl\:focus\:border-red:focus { + border-color: #e3342f; + } + + .xl\:focus\:border-red-light:focus { + border-color: #ef5753; + } + + .xl\:focus\:border-red-lighter:focus { + border-color: #f9acaa; + } + + .xl\:focus\:border-red-lightest:focus { + border-color: #fcebea; + } + + .xl\:focus\:border-orange-darkest:focus { + border-color: #462a16; + } + + .xl\:focus\:border-orange-darker:focus { + border-color: #613b1f; + } + + .xl\:focus\:border-orange-dark:focus { + border-color: #de751f; + } + + .xl\:focus\:border-orange:focus { + border-color: #f6993f; + } + + .xl\:focus\:border-orange-light:focus { + border-color: #faad63; + } + + .xl\:focus\:border-orange-lighter:focus { + border-color: #fcd9b6; + } + + .xl\:focus\:border-orange-lightest:focus { + border-color: #fff5eb; + } + + .xl\:focus\:border-yellow-darkest:focus { + border-color: #453411; + } + + .xl\:focus\:border-yellow-darker:focus { + border-color: #684f1d; + } + + .xl\:focus\:border-yellow-dark:focus { + border-color: #f2d024; + } + + .xl\:focus\:border-yellow:focus { + border-color: #ffed4a; + } + + .xl\:focus\:border-yellow-light:focus { + border-color: #fff382; + } + + .xl\:focus\:border-yellow-lighter:focus { + border-color: #fff9c2; + } + + .xl\:focus\:border-yellow-lightest:focus { + border-color: #fcfbeb; + } + + .xl\:focus\:border-green-darkest:focus { + border-color: #0f2f21; + } + + .xl\:focus\:border-green-darker:focus { + border-color: #1a4731; + } + + .xl\:focus\:border-green-dark:focus { + border-color: #1f9d55; + } + + .xl\:focus\:border-green:focus { + border-color: #38c172; + } + + .xl\:focus\:border-green-light:focus { + border-color: #51d88a; + } + + .xl\:focus\:border-green-lighter:focus { + border-color: #a2f5bf; + } + + .xl\:focus\:border-green-lightest:focus { + border-color: #e3fcec; + } + + .xl\:focus\:border-teal-darkest:focus { + border-color: #0d3331; + } + + .xl\:focus\:border-teal-darker:focus { + border-color: #20504f; + } + + .xl\:focus\:border-teal-dark:focus { + border-color: #38a89d; + } + + .xl\:focus\:border-teal:focus { + border-color: #4dc0b5; + } + + .xl\:focus\:border-teal-light:focus { + border-color: #64d5ca; + } + + .xl\:focus\:border-teal-lighter:focus { + border-color: #a0f0ed; + } + + .xl\:focus\:border-teal-lightest:focus { + border-color: #e8fffe; + } + + .xl\:focus\:border-blue-darkest:focus { + border-color: #12283a; + } + + .xl\:focus\:border-blue-darker:focus { + border-color: #1c3d5a; + } + + .xl\:focus\:border-blue-dark:focus { + border-color: #2779bd; + } + + .xl\:focus\:border-blue:focus { + border-color: #3490dc; + } + + .xl\:focus\:border-blue-light:focus { + border-color: #6cb2eb; + } + + .xl\:focus\:border-blue-lighter:focus { + border-color: #bcdefa; + } + + .xl\:focus\:border-blue-lightest:focus { + border-color: #eff8ff; + } + + .xl\:focus\:border-indigo-darkest:focus { + border-color: #191e38; + } + + .xl\:focus\:border-indigo-darker:focus { + border-color: #2f365f; + } + + .xl\:focus\:border-indigo-dark:focus { + border-color: #5661b3; + } + + .xl\:focus\:border-indigo:focus { + border-color: #6574cd; + } + + .xl\:focus\:border-indigo-light:focus { + border-color: #7886d7; + } + + .xl\:focus\:border-indigo-lighter:focus { + border-color: #b2b7ff; + } + + .xl\:focus\:border-indigo-lightest:focus { + border-color: #e6e8ff; + } + + .xl\:focus\:border-purple-darkest:focus { + border-color: #21183c; + } + + .xl\:focus\:border-purple-darker:focus { + border-color: #382b5f; + } + + .xl\:focus\:border-purple-dark:focus { + border-color: #794acf; + } + + .xl\:focus\:border-purple:focus { + border-color: #9561e2; + } + + .xl\:focus\:border-purple-light:focus { + border-color: #a779e9; + } + + .xl\:focus\:border-purple-lighter:focus { + border-color: #d6bbfc; + } + + .xl\:focus\:border-purple-lightest:focus { + border-color: #f3ebff; + } + + .xl\:focus\:border-pink-darkest:focus { + border-color: #451225; + } + + .xl\:focus\:border-pink-darker:focus { + border-color: #6f213f; + } + + .xl\:focus\:border-pink-dark:focus { + border-color: #eb5286; + } + + .xl\:focus\:border-pink:focus { + border-color: #f66d9b; + } + + .xl\:focus\:border-pink-light:focus { + border-color: #fa7ea8; + } + + .xl\:focus\:border-pink-lighter:focus { + border-color: #ffbbca; + } + + .xl\:focus\:border-pink-lightest:focus { + border-color: #ffebef; + } + + .xl\:rounded-none { + border-radius: 0; + } + + .xl\:rounded-sm { + border-radius: .125rem; + } + + .xl\:rounded { + border-radius: .25rem; + } + + .xl\:rounded-lg { + border-radius: .5rem; + } + + .xl\:rounded-full { + border-radius: 9999px; + } + + .xl\:rounded-t-none { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + + .xl\:rounded-r-none { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + + .xl\:rounded-b-none { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + } + + .xl\:rounded-l-none { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + + .xl\:rounded-t-sm { + border-top-left-radius: .125rem; + border-top-right-radius: .125rem; + } + + .xl\:rounded-r-sm { + border-top-right-radius: .125rem; + border-bottom-right-radius: .125rem; + } + + .xl\:rounded-b-sm { + border-bottom-right-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .xl\:rounded-l-sm { + border-top-left-radius: .125rem; + border-bottom-left-radius: .125rem; + } + + .xl\:rounded-t { + border-top-left-radius: .25rem; + border-top-right-radius: .25rem; + } + + .xl\:rounded-r { + border-top-right-radius: .25rem; + border-bottom-right-radius: .25rem; + } + + .xl\:rounded-b { + border-bottom-right-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .xl\:rounded-l { + border-top-left-radius: .25rem; + border-bottom-left-radius: .25rem; + } + + .xl\:rounded-t-lg { + border-top-left-radius: .5rem; + border-top-right-radius: .5rem; + } + + .xl\:rounded-r-lg { + border-top-right-radius: .5rem; + border-bottom-right-radius: .5rem; + } + + .xl\:rounded-b-lg { + border-bottom-right-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .xl\:rounded-l-lg { + border-top-left-radius: .5rem; + border-bottom-left-radius: .5rem; + } + + .xl\:rounded-t-full { + border-top-left-radius: 9999px; + border-top-right-radius: 9999px; + } + + .xl\:rounded-r-full { + border-top-right-radius: 9999px; + border-bottom-right-radius: 9999px; + } + + .xl\:rounded-b-full { + border-bottom-right-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .xl\:rounded-l-full { + border-top-left-radius: 9999px; + border-bottom-left-radius: 9999px; + } + + .xl\:rounded-tl-none { + border-top-left-radius: 0; + } + + .xl\:rounded-tr-none { + border-top-right-radius: 0; + } + + .xl\:rounded-br-none { + border-bottom-right-radius: 0; + } + + .xl\:rounded-bl-none { + border-bottom-left-radius: 0; + } + + .xl\:rounded-tl-sm { + border-top-left-radius: .125rem; + } + + .xl\:rounded-tr-sm { + border-top-right-radius: .125rem; + } + + .xl\:rounded-br-sm { + border-bottom-right-radius: .125rem; + } + + .xl\:rounded-bl-sm { + border-bottom-left-radius: .125rem; + } + + .xl\:rounded-tl { + border-top-left-radius: .25rem; + } + + .xl\:rounded-tr { + border-top-right-radius: .25rem; + } + + .xl\:rounded-br { + border-bottom-right-radius: .25rem; + } + + .xl\:rounded-bl { + border-bottom-left-radius: .25rem; + } + + .xl\:rounded-tl-lg { + border-top-left-radius: .5rem; + } + + .xl\:rounded-tr-lg { + border-top-right-radius: .5rem; + } + + .xl\:rounded-br-lg { + border-bottom-right-radius: .5rem; + } + + .xl\:rounded-bl-lg { + border-bottom-left-radius: .5rem; + } + + .xl\:rounded-tl-full { + border-top-left-radius: 9999px; + } + + .xl\:rounded-tr-full { + border-top-right-radius: 9999px; + } + + .xl\:rounded-br-full { + border-bottom-right-radius: 9999px; + } + + .xl\:rounded-bl-full { + border-bottom-left-radius: 9999px; + } + + .xl\:border-solid { + border-style: solid; + } + + .xl\:border-dashed { + border-style: dashed; + } + + .xl\:border-dotted { + border-style: dotted; + } + + .xl\:border-none { + border-style: none; + } + + .xl\:border-0 { + border-width: 0; + } + + .xl\:border-2 { + border-width: 2px; + } + + .xl\:border-4 { + border-width: 4px; + } + + .xl\:border-8 { + border-width: 8px; + } + + .xl\:border { + border-width: 1px; + } + + .xl\:border-t-0 { + border-top-width: 0; + } + + .xl\:border-r-0 { + border-right-width: 0; + } + + .xl\:border-b-0 { + border-bottom-width: 0; + } + + .xl\:border-l-0 { + border-left-width: 0; + } + + .xl\:border-t-2 { + border-top-width: 2px; + } + + .xl\:border-r-2 { + border-right-width: 2px; + } + + .xl\:border-b-2 { + border-bottom-width: 2px; + } + + .xl\:border-l-2 { + border-left-width: 2px; + } + + .xl\:border-t-4 { + border-top-width: 4px; + } + + .xl\:border-r-4 { + border-right-width: 4px; + } + + .xl\:border-b-4 { + border-bottom-width: 4px; + } + + .xl\:border-l-4 { + border-left-width: 4px; + } + + .xl\:border-t-8 { + border-top-width: 8px; + } + + .xl\:border-r-8 { + border-right-width: 8px; + } + + .xl\:border-b-8 { + border-bottom-width: 8px; + } + + .xl\:border-l-8 { + border-left-width: 8px; + } + + .xl\:border-t { + border-top-width: 1px; + } + + .xl\:border-r { + border-right-width: 1px; + } + + .xl\:border-b { + border-bottom-width: 1px; + } + + .xl\:border-l { + border-left-width: 1px; + } + + .xl\:cursor-auto { + cursor: auto; + } + + .xl\:cursor-default { + cursor: default; + } + + .xl\:cursor-pointer { + cursor: pointer; + } + + .xl\:cursor-wait { + cursor: wait; + } + + .xl\:cursor-move { + cursor: move; + } + + .xl\:cursor-not-allowed { + cursor: not-allowed; + } + + .xl\:block { + display: block; + } + + .xl\:inline-block { + display: inline-block; + } + + .xl\:inline { + display: inline; + } + + .xl\:table { + display: table; + } + + .xl\:table-row { + display: table-row; + } + + .xl\:table-cell { + display: table-cell; + } + + .xl\:hidden { + display: none; + } + + .xl\:flex { + display: flex; + } + + .xl\:inline-flex { + display: inline-flex; + } + + .xl\:flex-row { + flex-direction: row; + } + + .xl\:flex-row-reverse { + flex-direction: row-reverse; + } + + .xl\:flex-col { + flex-direction: column; + } + + .xl\:flex-col-reverse { + flex-direction: column-reverse; + } + + .xl\:flex-wrap { + flex-wrap: wrap; + } + + .xl\:flex-wrap-reverse { + flex-wrap: wrap-reverse; + } + + .xl\:flex-no-wrap { + flex-wrap: nowrap; + } + + .xl\:items-start { + align-items: flex-start; + } + + .xl\:items-end { + align-items: flex-end; + } + + .xl\:items-center { + align-items: center; + } + + .xl\:items-baseline { + align-items: baseline; + } + + .xl\:items-stretch { + align-items: stretch; + } + + .xl\:self-auto { + align-self: auto; + } + + .xl\:self-start { + align-self: flex-start; + } + + .xl\:self-end { + align-self: flex-end; + } + + .xl\:self-center { + align-self: center; + } + + .xl\:self-stretch { + align-self: stretch; + } + + .xl\:justify-start { + justify-content: flex-start; + } + + .xl\:justify-end { + justify-content: flex-end; + } + + .xl\:justify-center { + justify-content: center; + } + + .xl\:justify-between { + justify-content: space-between; + } + + .xl\:justify-around { + justify-content: space-around; + } + + .xl\:content-center { + align-content: center; + } + + .xl\:content-start { + align-content: flex-start; + } + + .xl\:content-end { + align-content: flex-end; + } + + .xl\:content-between { + align-content: space-between; + } + + .xl\:content-around { + align-content: space-around; + } + + .xl\:flex-1 { + flex: 1 1 0%; + } + + .xl\:flex-auto { + flex: 1 1 auto; + } + + .xl\:flex-initial { + flex: 0 1 auto; + } + + .xl\:flex-none { + flex: none; + } + + .xl\:flex-grow { + flex-grow: 1; + } + + .xl\:flex-shrink { + flex-shrink: 1; + } + + .xl\:flex-no-grow { + flex-grow: 0; + } + + .xl\:flex-no-shrink { + flex-shrink: 0; + } + + .xl\:float-right { + float: right; + } + + .xl\:float-left { + float: left; + } + + .xl\:float-none { + float: none; + } + + .xl\:clearfix:after { + content: ""; + display: table; + clear: both; + } + + .xl\:font-sans { + font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; + } + + .xl\:font-serif { + font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; + } + + .xl\:font-mono { + font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; + } + + .xl\:font-hairline { + font-weight: 100; + } + + .xl\:font-thin { + font-weight: 200; + } + + .xl\:font-light { + font-weight: 300; + } + + .xl\:font-normal { + font-weight: 400; + } + + .xl\:font-medium { + font-weight: 500; + } + + .xl\:font-semibold { + font-weight: 600; + } + + .xl\:font-bold { + font-weight: 700; + } + + .xl\:font-extrabold { + font-weight: 800; + } + + .xl\:font-black { + font-weight: 900; + } + + .xl\:hover\:font-hairline:hover { + font-weight: 100; + } + + .xl\:hover\:font-thin:hover { + font-weight: 200; + } + + .xl\:hover\:font-light:hover { + font-weight: 300; + } + + .xl\:hover\:font-normal:hover { + font-weight: 400; + } + + .xl\:hover\:font-medium:hover { + font-weight: 500; + } + + .xl\:hover\:font-semibold:hover { + font-weight: 600; + } + + .xl\:hover\:font-bold:hover { + font-weight: 700; + } + + .xl\:hover\:font-extrabold:hover { + font-weight: 800; + } + + .xl\:hover\:font-black:hover { + font-weight: 900; + } + + .xl\:focus\:font-hairline:focus { + font-weight: 100; + } + + .xl\:focus\:font-thin:focus { + font-weight: 200; + } + + .xl\:focus\:font-light:focus { + font-weight: 300; + } + + .xl\:focus\:font-normal:focus { + font-weight: 400; + } + + .xl\:focus\:font-medium:focus { + font-weight: 500; + } + + .xl\:focus\:font-semibold:focus { + font-weight: 600; + } + + .xl\:focus\:font-bold:focus { + font-weight: 700; + } + + .xl\:focus\:font-extrabold:focus { + font-weight: 800; + } + + .xl\:focus\:font-black:focus { + font-weight: 900; + } + + .xl\:h-1 { + height: .25rem; + } + + .xl\:h-2 { + height: .5rem; + } + + .xl\:h-3 { + height: .75rem; + } + + .xl\:h-4 { + height: 1rem; + } + + .xl\:h-5 { + height: 1.25rem; + } + + .xl\:h-6 { + height: 1.5rem; + } + + .xl\:h-8 { + height: 2rem; + } + + .xl\:h-10 { + height: 2.5rem; + } + + .xl\:h-12 { + height: 3rem; + } + + .xl\:h-16 { + height: 4rem; + } + + .xl\:h-24 { + height: 6rem; + } + + .xl\:h-32 { + height: 8rem; + } + + .xl\:h-48 { + height: 12rem; + } + + .xl\:h-64 { + height: 16rem; + } + + .xl\:h-auto { + height: auto; + } + + .xl\:h-px { + height: 1px; + } + + .xl\:h-full { + height: 100%; + } + + .xl\:h-screen { + height: 100vh; + } + + .xl\:leading-none { + line-height: 1; + } + + .xl\:leading-tight { + line-height: 1.25; + } + + .xl\:leading-normal { + line-height: 1.5; + } + + .xl\:leading-loose { + line-height: 2; + } + + .xl\:m-0 { + margin: 0; + } + + .xl\:m-1 { + margin: .25rem; + } + + .xl\:m-2 { + margin: .5rem; + } + + .xl\:m-3 { + margin: .75rem; + } + + .xl\:m-4 { + margin: 1rem; + } + + .xl\:m-5 { + margin: 1.25rem; + } + + .xl\:m-6 { + margin: 1.5rem; + } + + .xl\:m-8 { + margin: 2rem; + } + + .xl\:m-10 { + margin: 2.5rem; + } + + .xl\:m-12 { + margin: 3rem; + } + + .xl\:m-16 { + margin: 4rem; + } + + .xl\:m-20 { + margin: 5rem; + } + + .xl\:m-24 { + margin: 6rem; + } + + .xl\:m-32 { + margin: 8rem; + } + + .xl\:m-auto { + margin: auto; + } + + .xl\:m-px { + margin: 1px; + } + + .xl\:my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .xl\:mx-0 { + margin-left: 0; + margin-right: 0; + } + + .xl\:my-1 { + margin-top: .25rem; + margin-bottom: .25rem; + } + + .xl\:mx-1 { + margin-left: .25rem; + margin-right: .25rem; + } + + .xl\:my-2 { + margin-top: .5rem; + margin-bottom: .5rem; + } + + .xl\:mx-2 { + margin-left: .5rem; + margin-right: .5rem; + } + + .xl\:my-3 { + margin-top: .75rem; + margin-bottom: .75rem; + } + + .xl\:mx-3 { + margin-left: .75rem; + margin-right: .75rem; + } + + .xl\:my-4 { + margin-top: 1rem; + margin-bottom: 1rem; + } + + .xl\:mx-4 { + margin-left: 1rem; + margin-right: 1rem; + } + + .xl\:my-5 { + margin-top: 1.25rem; + margin-bottom: 1.25rem; + } + + .xl\:mx-5 { + margin-left: 1.25rem; + margin-right: 1.25rem; + } + + .xl\:my-6 { + margin-top: 1.5rem; + margin-bottom: 1.5rem; + } + + .xl\:mx-6 { + margin-left: 1.5rem; + margin-right: 1.5rem; + } + + .xl\:my-8 { + margin-top: 2rem; + margin-bottom: 2rem; + } + + .xl\:mx-8 { + margin-left: 2rem; + margin-right: 2rem; + } + + .xl\:my-10 { + margin-top: 2.5rem; + margin-bottom: 2.5rem; + } + + .xl\:mx-10 { + margin-left: 2.5rem; + margin-right: 2.5rem; + } + + .xl\:my-12 { + margin-top: 3rem; + margin-bottom: 3rem; + } + + .xl\:mx-12 { + margin-left: 3rem; + margin-right: 3rem; + } + + .xl\:my-16 { + margin-top: 4rem; + margin-bottom: 4rem; + } + + .xl\:mx-16 { + margin-left: 4rem; + margin-right: 4rem; + } + + .xl\:my-20 { + margin-top: 5rem; + margin-bottom: 5rem; + } + + .xl\:mx-20 { + margin-left: 5rem; + margin-right: 5rem; + } + + .xl\:my-24 { + margin-top: 6rem; + margin-bottom: 6rem; + } + + .xl\:mx-24 { + margin-left: 6rem; + margin-right: 6rem; + } + + .xl\:my-32 { + margin-top: 8rem; + margin-bottom: 8rem; + } + + .xl\:mx-32 { + margin-left: 8rem; + margin-right: 8rem; + } + + .xl\:my-auto { + margin-top: auto; + margin-bottom: auto; + } + + .xl\:mx-auto { + margin-left: auto; + margin-right: auto; + } + + .xl\:my-px { + margin-top: 1px; + margin-bottom: 1px; + } + + .xl\:mx-px { + margin-left: 1px; + margin-right: 1px; + } + + .xl\:mt-0 { + margin-top: 0; + } + + .xl\:mr-0 { + margin-right: 0; + } + + .xl\:mb-0 { + margin-bottom: 0; + } + + .xl\:ml-0 { + margin-left: 0; + } + + .xl\:mt-1 { + margin-top: .25rem; + } + + .xl\:mr-1 { + margin-right: .25rem; + } + + .xl\:mb-1 { + margin-bottom: .25rem; + } + + .xl\:ml-1 { + margin-left: .25rem; + } + + .xl\:mt-2 { + margin-top: .5rem; + } + + .xl\:mr-2 { + margin-right: .5rem; + } + + .xl\:mb-2 { + margin-bottom: .5rem; + } + + .xl\:ml-2 { + margin-left: .5rem; + } + + .xl\:mt-3 { + margin-top: .75rem; + } + + .xl\:mr-3 { + margin-right: .75rem; + } + + .xl\:mb-3 { + margin-bottom: .75rem; + } + + .xl\:ml-3 { + margin-left: .75rem; + } + + .xl\:mt-4 { + margin-top: 1rem; + } + + .xl\:mr-4 { + margin-right: 1rem; + } + + .xl\:mb-4 { + margin-bottom: 1rem; + } + + .xl\:ml-4 { + margin-left: 1rem; + } + + .xl\:mt-5 { + margin-top: 1.25rem; + } + + .xl\:mr-5 { + margin-right: 1.25rem; + } + + .xl\:mb-5 { + margin-bottom: 1.25rem; + } + + .xl\:ml-5 { + margin-left: 1.25rem; + } + + .xl\:mt-6 { + margin-top: 1.5rem; + } + + .xl\:mr-6 { + margin-right: 1.5rem; + } + + .xl\:mb-6 { + margin-bottom: 1.5rem; + } + + .xl\:ml-6 { + margin-left: 1.5rem; + } + + .xl\:mt-8 { + margin-top: 2rem; + } + + .xl\:mr-8 { + margin-right: 2rem; + } + + .xl\:mb-8 { + margin-bottom: 2rem; + } + + .xl\:ml-8 { + margin-left: 2rem; + } + + .xl\:mt-10 { + margin-top: 2.5rem; + } + + .xl\:mr-10 { + margin-right: 2.5rem; + } + + .xl\:mb-10 { + margin-bottom: 2.5rem; + } + + .xl\:ml-10 { + margin-left: 2.5rem; + } + + .xl\:mt-12 { + margin-top: 3rem; + } + + .xl\:mr-12 { + margin-right: 3rem; + } + + .xl\:mb-12 { + margin-bottom: 3rem; + } + + .xl\:ml-12 { + margin-left: 3rem; + } + + .xl\:mt-16 { + margin-top: 4rem; + } + + .xl\:mr-16 { + margin-right: 4rem; + } + + .xl\:mb-16 { + margin-bottom: 4rem; + } + + .xl\:ml-16 { + margin-left: 4rem; + } + + .xl\:mt-20 { + margin-top: 5rem; + } + + .xl\:mr-20 { + margin-right: 5rem; + } + + .xl\:mb-20 { + margin-bottom: 5rem; + } + + .xl\:ml-20 { + margin-left: 5rem; + } + + .xl\:mt-24 { + margin-top: 6rem; + } + + .xl\:mr-24 { + margin-right: 6rem; + } + + .xl\:mb-24 { + margin-bottom: 6rem; + } + + .xl\:ml-24 { + margin-left: 6rem; + } + + .xl\:mt-32 { + margin-top: 8rem; + } + + .xl\:mr-32 { + margin-right: 8rem; + } + + .xl\:mb-32 { + margin-bottom: 8rem; + } + + .xl\:ml-32 { + margin-left: 8rem; + } + + .xl\:mt-auto { + margin-top: auto; + } + + .xl\:mr-auto { + margin-right: auto; + } + + .xl\:mb-auto { + margin-bottom: auto; + } + + .xl\:ml-auto { + margin-left: auto; + } + + .xl\:mt-px { + margin-top: 1px; + } + + .xl\:mr-px { + margin-right: 1px; + } + + .xl\:mb-px { + margin-bottom: 1px; + } + + .xl\:ml-px { + margin-left: 1px; + } + + .xl\:max-h-full { + max-height: 100%; + } + + .xl\:max-h-screen { + max-height: 100vh; + } + + .xl\:max-w-xs { + max-width: 20rem; + } + + .xl\:max-w-sm { + max-width: 30rem; + } + + .xl\:max-w-md { + max-width: 40rem; + } + + .xl\:max-w-lg { + max-width: 50rem; + } + + .xl\:max-w-xl { + max-width: 60rem; + } + + .xl\:max-w-2xl { + max-width: 70rem; + } + + .xl\:max-w-3xl { + max-width: 80rem; + } + + .xl\:max-w-4xl { + max-width: 90rem; + } + + .xl\:max-w-5xl { + max-width: 100rem; + } + + .xl\:max-w-full { + max-width: 100%; + } + + .xl\:min-h-0 { + min-height: 0; + } + + .xl\:min-h-full { + min-height: 100%; + } + + .xl\:min-h-screen { + min-height: 100vh; + } + + .xl\:min-w-0 { + min-width: 0; + } + + .xl\:min-w-full { + min-width: 100%; + } + + .xl\:-m-0 { + margin: 0; + } + + .xl\:-m-1 { + margin: -0.25rem; + } + + .xl\:-m-2 { + margin: -0.5rem; + } + + .xl\:-m-3 { + margin: -0.75rem; + } + + .xl\:-m-4 { + margin: -1rem; + } + + .xl\:-m-5 { + margin: -1.25rem; + } + + .xl\:-m-6 { + margin: -1.5rem; + } + + .xl\:-m-8 { + margin: -2rem; + } + + .xl\:-m-10 { + margin: -2.5rem; + } + + .xl\:-m-12 { + margin: -3rem; + } + + .xl\:-m-16 { + margin: -4rem; + } + + .xl\:-m-20 { + margin: -5rem; + } + + .xl\:-m-24 { + margin: -6rem; + } + + .xl\:-m-32 { + margin: -8rem; + } + + .xl\:-m-px { + margin: -1px; + } + + .xl\:-my-0 { + margin-top: 0; + margin-bottom: 0; + } + + .xl\:-mx-0 { + margin-left: 0; + margin-right: 0; + } + + .xl\:-my-1 { + margin-top: -0.25rem; + margin-bottom: -0.25rem; + } + + .xl\:-mx-1 { + margin-left: -0.25rem; + margin-right: -0.25rem; + } + + .xl\:-my-2 { + margin-top: -0.5rem; + margin-bottom: -0.5rem; + } + + .xl\:-mx-2 { + margin-left: -0.5rem; + margin-right: -0.5rem; + } + + .xl\:-my-3 { + margin-top: -0.75rem; + margin-bottom: -0.75rem; + } + + .xl\:-mx-3 { + margin-left: -0.75rem; + margin-right: -0.75rem; + } + + .xl\:-my-4 { + margin-top: -1rem; + margin-bottom: -1rem; + } + + .xl\:-mx-4 { + margin-left: -1rem; + margin-right: -1rem; + } + + .xl\:-my-5 { + margin-top: -1.25rem; + margin-bottom: -1.25rem; + } + + .xl\:-mx-5 { + margin-left: -1.25rem; + margin-right: -1.25rem; + } + + .xl\:-my-6 { + margin-top: -1.5rem; + margin-bottom: -1.5rem; + } + + .xl\:-mx-6 { + margin-left: -1.5rem; + margin-right: -1.5rem; + } + + .xl\:-my-8 { + margin-top: -2rem; + margin-bottom: -2rem; + } + + .xl\:-mx-8 { + margin-left: -2rem; + margin-right: -2rem; + } + + .xl\:-my-10 { + margin-top: -2.5rem; + margin-bottom: -2.5rem; + } + + .xl\:-mx-10 { + margin-left: -2.5rem; + margin-right: -2.5rem; + } + + .xl\:-my-12 { + margin-top: -3rem; + margin-bottom: -3rem; + } + + .xl\:-mx-12 { + margin-left: -3rem; + margin-right: -3rem; + } + + .xl\:-my-16 { + margin-top: -4rem; + margin-bottom: -4rem; + } + + .xl\:-mx-16 { + margin-left: -4rem; + margin-right: -4rem; + } + + .xl\:-my-20 { + margin-top: -5rem; + margin-bottom: -5rem; + } + + .xl\:-mx-20 { + margin-left: -5rem; + margin-right: -5rem; + } + + .xl\:-my-24 { + margin-top: -6rem; + margin-bottom: -6rem; + } + + .xl\:-mx-24 { + margin-left: -6rem; + margin-right: -6rem; + } + + .xl\:-my-32 { + margin-top: -8rem; + margin-bottom: -8rem; + } + + .xl\:-mx-32 { + margin-left: -8rem; + margin-right: -8rem; + } + + .xl\:-my-px { + margin-top: -1px; + margin-bottom: -1px; + } + + .xl\:-mx-px { + margin-left: -1px; + margin-right: -1px; + } + + .xl\:-mt-0 { + margin-top: 0; + } + + .xl\:-mr-0 { + margin-right: 0; + } + + .xl\:-mb-0 { + margin-bottom: 0; + } + + .xl\:-ml-0 { + margin-left: 0; + } + + .xl\:-mt-1 { + margin-top: -0.25rem; + } + + .xl\:-mr-1 { + margin-right: -0.25rem; + } + + .xl\:-mb-1 { + margin-bottom: -0.25rem; + } + + .xl\:-ml-1 { + margin-left: -0.25rem; + } + + .xl\:-mt-2 { + margin-top: -0.5rem; + } + + .xl\:-mr-2 { + margin-right: -0.5rem; + } + + .xl\:-mb-2 { + margin-bottom: -0.5rem; + } + + .xl\:-ml-2 { + margin-left: -0.5rem; + } + + .xl\:-mt-3 { + margin-top: -0.75rem; + } + + .xl\:-mr-3 { + margin-right: -0.75rem; + } + + .xl\:-mb-3 { + margin-bottom: -0.75rem; + } + + .xl\:-ml-3 { + margin-left: -0.75rem; + } + + .xl\:-mt-4 { + margin-top: -1rem; + } + + .xl\:-mr-4 { + margin-right: -1rem; + } + + .xl\:-mb-4 { + margin-bottom: -1rem; + } + + .xl\:-ml-4 { + margin-left: -1rem; + } + + .xl\:-mt-5 { + margin-top: -1.25rem; + } + + .xl\:-mr-5 { + margin-right: -1.25rem; + } + + .xl\:-mb-5 { + margin-bottom: -1.25rem; + } + + .xl\:-ml-5 { + margin-left: -1.25rem; + } + + .xl\:-mt-6 { + margin-top: -1.5rem; + } + + .xl\:-mr-6 { + margin-right: -1.5rem; + } + + .xl\:-mb-6 { + margin-bottom: -1.5rem; + } + + .xl\:-ml-6 { + margin-left: -1.5rem; + } + + .xl\:-mt-8 { + margin-top: -2rem; + } + + .xl\:-mr-8 { + margin-right: -2rem; + } + + .xl\:-mb-8 { + margin-bottom: -2rem; + } + + .xl\:-ml-8 { + margin-left: -2rem; + } + + .xl\:-mt-10 { + margin-top: -2.5rem; + } + + .xl\:-mr-10 { + margin-right: -2.5rem; + } + + .xl\:-mb-10 { + margin-bottom: -2.5rem; + } + + .xl\:-ml-10 { + margin-left: -2.5rem; + } + + .xl\:-mt-12 { + margin-top: -3rem; + } + + .xl\:-mr-12 { + margin-right: -3rem; + } + + .xl\:-mb-12 { + margin-bottom: -3rem; + } + + .xl\:-ml-12 { + margin-left: -3rem; + } + + .xl\:-mt-16 { + margin-top: -4rem; + } + + .xl\:-mr-16 { + margin-right: -4rem; + } + + .xl\:-mb-16 { + margin-bottom: -4rem; + } + + .xl\:-ml-16 { + margin-left: -4rem; + } + + .xl\:-mt-20 { + margin-top: -5rem; + } + + .xl\:-mr-20 { + margin-right: -5rem; + } + + .xl\:-mb-20 { + margin-bottom: -5rem; + } + + .xl\:-ml-20 { + margin-left: -5rem; + } + + .xl\:-mt-24 { + margin-top: -6rem; + } + + .xl\:-mr-24 { + margin-right: -6rem; + } + + .xl\:-mb-24 { + margin-bottom: -6rem; + } + + .xl\:-ml-24 { + margin-left: -6rem; + } + + .xl\:-mt-32 { + margin-top: -8rem; + } + + .xl\:-mr-32 { + margin-right: -8rem; + } + + .xl\:-mb-32 { + margin-bottom: -8rem; + } + + .xl\:-ml-32 { + margin-left: -8rem; + } + + .xl\:-mt-px { + margin-top: -1px; + } + + .xl\:-mr-px { + margin-right: -1px; + } + + .xl\:-mb-px { + margin-bottom: -1px; + } + + .xl\:-ml-px { + margin-left: -1px; + } + + .xl\:opacity-0 { + opacity: 0; + } + + .xl\:opacity-25 { + opacity: .25; + } + + .xl\:opacity-50 { + opacity: .5; + } + + .xl\:opacity-75 { + opacity: .75; + } + + .xl\:opacity-100 { + opacity: 1; + } + + .xl\:overflow-auto { + overflow: auto; + } + + .xl\:overflow-hidden { + overflow: hidden; + } + + .xl\:overflow-visible { + overflow: visible; + } + + .xl\:overflow-scroll { + overflow: scroll; + } + + .xl\:overflow-x-auto { + overflow-x: auto; + } + + .xl\:overflow-y-auto { + overflow-y: auto; + } + + .xl\:overflow-x-hidden { + overflow-x: hidden; + } + + .xl\:overflow-y-hidden { + overflow-y: hidden; + } + + .xl\:overflow-x-visible { + overflow-x: visible; + } + + .xl\:overflow-y-visible { + overflow-y: visible; + } + + .xl\:overflow-x-scroll { + overflow-x: scroll; + } + + .xl\:overflow-y-scroll { + overflow-y: scroll; + } + + .xl\:scrolling-touch { + -webkit-overflow-scrolling: touch; + } + + .xl\:scrolling-auto { + -webkit-overflow-scrolling: auto; + } + + .xl\:p-0 { + padding: 0; + } + + .xl\:p-1 { + padding: .25rem; + } + + .xl\:p-2 { + padding: .5rem; + } + + .xl\:p-3 { + padding: .75rem; + } + + .xl\:p-4 { + padding: 1rem; + } + + .xl\:p-5 { + padding: 1.25rem; + } + + .xl\:p-6 { + padding: 1.5rem; + } + + .xl\:p-8 { + padding: 2rem; + } + + .xl\:p-10 { + padding: 2.5rem; + } + + .xl\:p-12 { + padding: 3rem; + } + + .xl\:p-16 { + padding: 4rem; + } + + .xl\:p-20 { + padding: 5rem; + } + + .xl\:p-24 { + padding: 6rem; + } + + .xl\:p-32 { + padding: 8rem; + } + + .xl\:p-px { + padding: 1px; + } + + .xl\:py-0 { + padding-top: 0; + padding-bottom: 0; + } + + .xl\:px-0 { + padding-left: 0; + padding-right: 0; + } + + .xl\:py-1 { + padding-top: .25rem; + padding-bottom: .25rem; + } + + .xl\:px-1 { + padding-left: .25rem; + padding-right: .25rem; + } + + .xl\:py-2 { + padding-top: .5rem; + padding-bottom: .5rem; + } + + .xl\:px-2 { + padding-left: .5rem; + padding-right: .5rem; + } + + .xl\:py-3 { + padding-top: .75rem; + padding-bottom: .75rem; + } + + .xl\:px-3 { + padding-left: .75rem; + padding-right: .75rem; + } + + .xl\:py-4 { + padding-top: 1rem; + padding-bottom: 1rem; + } + + .xl\:px-4 { + padding-left: 1rem; + padding-right: 1rem; + } + + .xl\:py-5 { + padding-top: 1.25rem; + padding-bottom: 1.25rem; + } + + .xl\:px-5 { + padding-left: 1.25rem; + padding-right: 1.25rem; + } + + .xl\:py-6 { + padding-top: 1.5rem; + padding-bottom: 1.5rem; + } + + .xl\:px-6 { + padding-left: 1.5rem; + padding-right: 1.5rem; + } + + .xl\:py-8 { + padding-top: 2rem; + padding-bottom: 2rem; + } + + .xl\:px-8 { + padding-left: 2rem; + padding-right: 2rem; + } + + .xl\:py-10 { + padding-top: 2.5rem; + padding-bottom: 2.5rem; + } + + .xl\:px-10 { + padding-left: 2.5rem; + padding-right: 2.5rem; + } + + .xl\:py-12 { + padding-top: 3rem; + padding-bottom: 3rem; + } + + .xl\:px-12 { + padding-left: 3rem; + padding-right: 3rem; + } + + .xl\:py-16 { + padding-top: 4rem; + padding-bottom: 4rem; + } + + .xl\:px-16 { + padding-left: 4rem; + padding-right: 4rem; + } + + .xl\:py-20 { + padding-top: 5rem; + padding-bottom: 5rem; + } + + .xl\:px-20 { + padding-left: 5rem; + padding-right: 5rem; + } + + .xl\:py-24 { + padding-top: 6rem; + padding-bottom: 6rem; + } + + .xl\:px-24 { + padding-left: 6rem; + padding-right: 6rem; + } + + .xl\:py-32 { + padding-top: 8rem; + padding-bottom: 8rem; + } + + .xl\:px-32 { + padding-left: 8rem; + padding-right: 8rem; + } + + .xl\:py-px { + padding-top: 1px; + padding-bottom: 1px; + } + + .xl\:px-px { + padding-left: 1px; + padding-right: 1px; + } + + .xl\:pt-0 { + padding-top: 0; + } + + .xl\:pr-0 { + padding-right: 0; + } + + .xl\:pb-0 { + padding-bottom: 0; + } + + .xl\:pl-0 { + padding-left: 0; + } + + .xl\:pt-1 { + padding-top: .25rem; + } + + .xl\:pr-1 { + padding-right: .25rem; + } + + .xl\:pb-1 { + padding-bottom: .25rem; + } + + .xl\:pl-1 { + padding-left: .25rem; + } + + .xl\:pt-2 { + padding-top: .5rem; + } + + .xl\:pr-2 { + padding-right: .5rem; + } + + .xl\:pb-2 { + padding-bottom: .5rem; + } + + .xl\:pl-2 { + padding-left: .5rem; + } + + .xl\:pt-3 { + padding-top: .75rem; + } + + .xl\:pr-3 { + padding-right: .75rem; + } + + .xl\:pb-3 { + padding-bottom: .75rem; + } + + .xl\:pl-3 { + padding-left: .75rem; + } + + .xl\:pt-4 { + padding-top: 1rem; + } + + .xl\:pr-4 { + padding-right: 1rem; + } + + .xl\:pb-4 { + padding-bottom: 1rem; + } + + .xl\:pl-4 { + padding-left: 1rem; + } + + .xl\:pt-5 { + padding-top: 1.25rem; + } + + .xl\:pr-5 { + padding-right: 1.25rem; + } + + .xl\:pb-5 { + padding-bottom: 1.25rem; + } + + .xl\:pl-5 { + padding-left: 1.25rem; + } + + .xl\:pt-6 { + padding-top: 1.5rem; + } + + .xl\:pr-6 { + padding-right: 1.5rem; + } + + .xl\:pb-6 { + padding-bottom: 1.5rem; + } + + .xl\:pl-6 { + padding-left: 1.5rem; + } + + .xl\:pt-8 { + padding-top: 2rem; + } + + .xl\:pr-8 { + padding-right: 2rem; + } + + .xl\:pb-8 { + padding-bottom: 2rem; + } + + .xl\:pl-8 { + padding-left: 2rem; + } + + .xl\:pt-10 { + padding-top: 2.5rem; + } + + .xl\:pr-10 { + padding-right: 2.5rem; + } + + .xl\:pb-10 { + padding-bottom: 2.5rem; + } + + .xl\:pl-10 { + padding-left: 2.5rem; + } + + .xl\:pt-12 { + padding-top: 3rem; + } + + .xl\:pr-12 { + padding-right: 3rem; + } + + .xl\:pb-12 { + padding-bottom: 3rem; + } + + .xl\:pl-12 { + padding-left: 3rem; + } + + .xl\:pt-16 { + padding-top: 4rem; + } + + .xl\:pr-16 { + padding-right: 4rem; + } + + .xl\:pb-16 { + padding-bottom: 4rem; + } + + .xl\:pl-16 { + padding-left: 4rem; + } + + .xl\:pt-20 { + padding-top: 5rem; + } + + .xl\:pr-20 { + padding-right: 5rem; + } + + .xl\:pb-20 { + padding-bottom: 5rem; + } + + .xl\:pl-20 { + padding-left: 5rem; + } + + .xl\:pt-24 { + padding-top: 6rem; + } + + .xl\:pr-24 { + padding-right: 6rem; + } + + .xl\:pb-24 { + padding-bottom: 6rem; + } + + .xl\:pl-24 { + padding-left: 6rem; + } + + .xl\:pt-32 { + padding-top: 8rem; + } + + .xl\:pr-32 { + padding-right: 8rem; + } + + .xl\:pb-32 { + padding-bottom: 8rem; + } + + .xl\:pl-32 { + padding-left: 8rem; + } + + .xl\:pt-px { + padding-top: 1px; + } + + .xl\:pr-px { + padding-right: 1px; + } + + .xl\:pb-px { + padding-bottom: 1px; + } + + .xl\:pl-px { + padding-left: 1px; + } + + .xl\:pointer-events-none { + pointer-events: none; + } + + .xl\:pointer-events-auto { + pointer-events: auto; + } + + .xl\:static { + position: static; + } + + .xl\:fixed { + position: fixed; + } + + .xl\:absolute { + position: absolute; + } + + .xl\:relative { + position: relative; + } + + .xl\:sticky { + position: -webkit-sticky; + position: sticky; + } + + .xl\:pin-none { + top: auto; + right: auto; + bottom: auto; + left: auto; + } + + .xl\:pin { + top: 0; + right: 0; + bottom: 0; + left: 0; + } + + .xl\:pin-y { + top: 0; + bottom: 0; + } + + .xl\:pin-x { + right: 0; + left: 0; + } + + .xl\:pin-t { + top: 0; + } + + .xl\:pin-r { + right: 0; + } + + .xl\:pin-b { + bottom: 0; + } + + .xl\:pin-l { + left: 0; + } + + .xl\:resize-none { + resize: none; + } + + .xl\:resize-y { + resize: vertical; + } + + .xl\:resize-x { + resize: horizontal; + } + + .xl\:resize { + resize: both; + } + + .xl\:shadow { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .xl\:shadow-md { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .xl\:shadow-lg { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .xl\:shadow-inner { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .xl\:shadow-outline { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .xl\:shadow-none { + box-shadow: none; + } + + .xl\:hover\:shadow:hover { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .xl\:hover\:shadow-md:hover { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .xl\:hover\:shadow-lg:hover { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .xl\:hover\:shadow-inner:hover { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .xl\:hover\:shadow-outline:hover { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .xl\:hover\:shadow-none:hover { + box-shadow: none; + } + + .xl\:focus\:shadow:focus { + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); + } + + .xl\:focus\:shadow-md:focus { + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); + } + + .xl\:focus\:shadow-lg:focus { + box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); + } + + .xl\:focus\:shadow-inner:focus { + box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); + } + + .xl\:focus\:shadow-outline:focus { + box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); + } + + .xl\:focus\:shadow-none:focus { + box-shadow: none; + } + + .xl\:table-auto { + table-layout: auto; + } + + .xl\:table-fixed { + table-layout: fixed; + } + + .xl\:text-left { + text-align: left; + } + + .xl\:text-center { + text-align: center; + } + + .xl\:text-right { + text-align: right; + } + + .xl\:text-justify { + text-align: justify; + } + + .xl\:text-transparent { + color: transparent; + } + + .xl\:text-black { + color: #22292f; + } + + .xl\:text-grey-darkest { + color: #3d4852; + } + + .xl\:text-grey-darker { + color: #606f7b; + } + + .xl\:text-grey-dark { + color: #8795a1; + } + + .xl\:text-grey { + color: #b8c2cc; + } + + .xl\:text-grey-light { + color: #dae1e7; + } + + .xl\:text-grey-lighter { + color: #f1f5f8; + } + + .xl\:text-grey-lightest { + color: #f8fafc; + } + + .xl\:text-white { + color: #fff; + } + + .xl\:text-red-darkest { + color: #3b0d0c; + } + + .xl\:text-red-darker { + color: #621b18; + } + + .xl\:text-red-dark { + color: #cc1f1a; + } + + .xl\:text-red { + color: #e3342f; + } + + .xl\:text-red-light { + color: #ef5753; + } + + .xl\:text-red-lighter { + color: #f9acaa; + } + + .xl\:text-red-lightest { + color: #fcebea; + } + + .xl\:text-orange-darkest { + color: #462a16; + } + + .xl\:text-orange-darker { + color: #613b1f; + } + + .xl\:text-orange-dark { + color: #de751f; + } + + .xl\:text-orange { + color: #f6993f; + } + + .xl\:text-orange-light { + color: #faad63; + } + + .xl\:text-orange-lighter { + color: #fcd9b6; + } + + .xl\:text-orange-lightest { + color: #fff5eb; + } + + .xl\:text-yellow-darkest { + color: #453411; + } + + .xl\:text-yellow-darker { + color: #684f1d; + } + + .xl\:text-yellow-dark { + color: #f2d024; + } + + .xl\:text-yellow { + color: #ffed4a; + } + + .xl\:text-yellow-light { + color: #fff382; + } + + .xl\:text-yellow-lighter { + color: #fff9c2; + } + + .xl\:text-yellow-lightest { + color: #fcfbeb; + } + + .xl\:text-green-darkest { + color: #0f2f21; + } + + .xl\:text-green-darker { + color: #1a4731; + } + + .xl\:text-green-dark { + color: #1f9d55; + } + + .xl\:text-green { + color: #38c172; + } + + .xl\:text-green-light { + color: #51d88a; + } + + .xl\:text-green-lighter { + color: #a2f5bf; + } + + .xl\:text-green-lightest { + color: #e3fcec; + } + + .xl\:text-teal-darkest { + color: #0d3331; + } + + .xl\:text-teal-darker { + color: #20504f; + } + + .xl\:text-teal-dark { + color: #38a89d; + } + + .xl\:text-teal { + color: #4dc0b5; + } + + .xl\:text-teal-light { + color: #64d5ca; + } + + .xl\:text-teal-lighter { + color: #a0f0ed; + } + + .xl\:text-teal-lightest { + color: #e8fffe; + } + + .xl\:text-blue-darkest { + color: #12283a; + } + + .xl\:text-blue-darker { + color: #1c3d5a; + } + + .xl\:text-blue-dark { + color: #2779bd; + } + + .xl\:text-blue { + color: #3490dc; + } + + .xl\:text-blue-light { + color: #6cb2eb; + } + + .xl\:text-blue-lighter { + color: #bcdefa; + } + + .xl\:text-blue-lightest { + color: #eff8ff; + } + + .xl\:text-indigo-darkest { + color: #191e38; + } + + .xl\:text-indigo-darker { + color: #2f365f; + } + + .xl\:text-indigo-dark { + color: #5661b3; + } + + .xl\:text-indigo { + color: #6574cd; + } + + .xl\:text-indigo-light { + color: #7886d7; + } + + .xl\:text-indigo-lighter { + color: #b2b7ff; + } + + .xl\:text-indigo-lightest { + color: #e6e8ff; + } + + .xl\:text-purple-darkest { + color: #21183c; + } + + .xl\:text-purple-darker { + color: #382b5f; + } + + .xl\:text-purple-dark { + color: #794acf; + } + + .xl\:text-purple { + color: #9561e2; + } + + .xl\:text-purple-light { + color: #a779e9; + } + + .xl\:text-purple-lighter { + color: #d6bbfc; + } + + .xl\:text-purple-lightest { + color: #f3ebff; + } + + .xl\:text-pink-darkest { + color: #451225; + } + + .xl\:text-pink-darker { + color: #6f213f; + } + + .xl\:text-pink-dark { + color: #eb5286; + } + + .xl\:text-pink { + color: #f66d9b; + } + + .xl\:text-pink-light { + color: #fa7ea8; + } + + .xl\:text-pink-lighter { + color: #ffbbca; + } + + .xl\:text-pink-lightest { + color: #ffebef; + } + + .xl\:hover\:text-transparent:hover { + color: transparent; + } + + .xl\:hover\:text-black:hover { + color: #22292f; + } + + .xl\:hover\:text-grey-darkest:hover { + color: #3d4852; + } + + .xl\:hover\:text-grey-darker:hover { + color: #606f7b; + } + + .xl\:hover\:text-grey-dark:hover { + color: #8795a1; + } + + .xl\:hover\:text-grey:hover { + color: #b8c2cc; + } + + .xl\:hover\:text-grey-light:hover { + color: #dae1e7; + } + + .xl\:hover\:text-grey-lighter:hover { + color: #f1f5f8; + } + + .xl\:hover\:text-grey-lightest:hover { + color: #f8fafc; + } + + .xl\:hover\:text-white:hover { + color: #fff; + } + + .xl\:hover\:text-red-darkest:hover { + color: #3b0d0c; + } + + .xl\:hover\:text-red-darker:hover { + color: #621b18; + } + + .xl\:hover\:text-red-dark:hover { + color: #cc1f1a; + } + + .xl\:hover\:text-red:hover { + color: #e3342f; + } + + .xl\:hover\:text-red-light:hover { + color: #ef5753; + } + + .xl\:hover\:text-red-lighter:hover { + color: #f9acaa; + } + + .xl\:hover\:text-red-lightest:hover { + color: #fcebea; + } + + .xl\:hover\:text-orange-darkest:hover { + color: #462a16; + } + + .xl\:hover\:text-orange-darker:hover { + color: #613b1f; + } + + .xl\:hover\:text-orange-dark:hover { + color: #de751f; + } + + .xl\:hover\:text-orange:hover { + color: #f6993f; + } + + .xl\:hover\:text-orange-light:hover { + color: #faad63; + } + + .xl\:hover\:text-orange-lighter:hover { + color: #fcd9b6; + } + + .xl\:hover\:text-orange-lightest:hover { + color: #fff5eb; + } + + .xl\:hover\:text-yellow-darkest:hover { + color: #453411; + } + + .xl\:hover\:text-yellow-darker:hover { + color: #684f1d; + } + + .xl\:hover\:text-yellow-dark:hover { + color: #f2d024; + } + + .xl\:hover\:text-yellow:hover { + color: #ffed4a; + } + + .xl\:hover\:text-yellow-light:hover { + color: #fff382; + } + + .xl\:hover\:text-yellow-lighter:hover { + color: #fff9c2; + } + + .xl\:hover\:text-yellow-lightest:hover { + color: #fcfbeb; + } + + .xl\:hover\:text-green-darkest:hover { + color: #0f2f21; + } + + .xl\:hover\:text-green-darker:hover { + color: #1a4731; + } + + .xl\:hover\:text-green-dark:hover { + color: #1f9d55; + } + + .xl\:hover\:text-green:hover { + color: #38c172; + } + + .xl\:hover\:text-green-light:hover { + color: #51d88a; + } + + .xl\:hover\:text-green-lighter:hover { + color: #a2f5bf; + } + + .xl\:hover\:text-green-lightest:hover { + color: #e3fcec; + } + + .xl\:hover\:text-teal-darkest:hover { + color: #0d3331; + } + + .xl\:hover\:text-teal-darker:hover { + color: #20504f; + } + + .xl\:hover\:text-teal-dark:hover { + color: #38a89d; + } + + .xl\:hover\:text-teal:hover { + color: #4dc0b5; + } + + .xl\:hover\:text-teal-light:hover { + color: #64d5ca; + } + + .xl\:hover\:text-teal-lighter:hover { + color: #a0f0ed; + } + + .xl\:hover\:text-teal-lightest:hover { + color: #e8fffe; + } + + .xl\:hover\:text-blue-darkest:hover { + color: #12283a; + } + + .xl\:hover\:text-blue-darker:hover { + color: #1c3d5a; + } + + .xl\:hover\:text-blue-dark:hover { + color: #2779bd; + } + + .xl\:hover\:text-blue:hover { + color: #3490dc; + } + + .xl\:hover\:text-blue-light:hover { + color: #6cb2eb; + } + + .xl\:hover\:text-blue-lighter:hover { + color: #bcdefa; + } + + .xl\:hover\:text-blue-lightest:hover { + color: #eff8ff; + } + + .xl\:hover\:text-indigo-darkest:hover { + color: #191e38; + } + + .xl\:hover\:text-indigo-darker:hover { + color: #2f365f; + } + + .xl\:hover\:text-indigo-dark:hover { + color: #5661b3; + } + + .xl\:hover\:text-indigo:hover { + color: #6574cd; + } + + .xl\:hover\:text-indigo-light:hover { + color: #7886d7; + } + + .xl\:hover\:text-indigo-lighter:hover { + color: #b2b7ff; + } + + .xl\:hover\:text-indigo-lightest:hover { + color: #e6e8ff; + } + + .xl\:hover\:text-purple-darkest:hover { + color: #21183c; + } + + .xl\:hover\:text-purple-darker:hover { + color: #382b5f; + } + + .xl\:hover\:text-purple-dark:hover { + color: #794acf; + } + + .xl\:hover\:text-purple:hover { + color: #9561e2; + } + + .xl\:hover\:text-purple-light:hover { + color: #a779e9; + } + + .xl\:hover\:text-purple-lighter:hover { + color: #d6bbfc; + } + + .xl\:hover\:text-purple-lightest:hover { + color: #f3ebff; + } + + .xl\:hover\:text-pink-darkest:hover { + color: #451225; + } + + .xl\:hover\:text-pink-darker:hover { + color: #6f213f; + } + + .xl\:hover\:text-pink-dark:hover { + color: #eb5286; + } + + .xl\:hover\:text-pink:hover { + color: #f66d9b; + } + + .xl\:hover\:text-pink-light:hover { + color: #fa7ea8; + } + + .xl\:hover\:text-pink-lighter:hover { + color: #ffbbca; + } + + .xl\:hover\:text-pink-lightest:hover { + color: #ffebef; + } + + .xl\:focus\:text-transparent:focus { + color: transparent; + } + + .xl\:focus\:text-black:focus { + color: #22292f; + } + + .xl\:focus\:text-grey-darkest:focus { + color: #3d4852; + } + + .xl\:focus\:text-grey-darker:focus { + color: #606f7b; + } + + .xl\:focus\:text-grey-dark:focus { + color: #8795a1; + } + + .xl\:focus\:text-grey:focus { + color: #b8c2cc; + } + + .xl\:focus\:text-grey-light:focus { + color: #dae1e7; + } + + .xl\:focus\:text-grey-lighter:focus { + color: #f1f5f8; + } + + .xl\:focus\:text-grey-lightest:focus { + color: #f8fafc; + } + + .xl\:focus\:text-white:focus { + color: #fff; + } + + .xl\:focus\:text-red-darkest:focus { + color: #3b0d0c; + } + + .xl\:focus\:text-red-darker:focus { + color: #621b18; + } + + .xl\:focus\:text-red-dark:focus { + color: #cc1f1a; + } + + .xl\:focus\:text-red:focus { + color: #e3342f; + } + + .xl\:focus\:text-red-light:focus { + color: #ef5753; + } + + .xl\:focus\:text-red-lighter:focus { + color: #f9acaa; + } + + .xl\:focus\:text-red-lightest:focus { + color: #fcebea; + } + + .xl\:focus\:text-orange-darkest:focus { + color: #462a16; + } + + .xl\:focus\:text-orange-darker:focus { + color: #613b1f; + } + + .xl\:focus\:text-orange-dark:focus { + color: #de751f; + } + + .xl\:focus\:text-orange:focus { + color: #f6993f; + } + + .xl\:focus\:text-orange-light:focus { + color: #faad63; + } + + .xl\:focus\:text-orange-lighter:focus { + color: #fcd9b6; + } + + .xl\:focus\:text-orange-lightest:focus { + color: #fff5eb; + } + + .xl\:focus\:text-yellow-darkest:focus { + color: #453411; + } + + .xl\:focus\:text-yellow-darker:focus { + color: #684f1d; + } + + .xl\:focus\:text-yellow-dark:focus { + color: #f2d024; + } + + .xl\:focus\:text-yellow:focus { + color: #ffed4a; + } + + .xl\:focus\:text-yellow-light:focus { + color: #fff382; + } + + .xl\:focus\:text-yellow-lighter:focus { + color: #fff9c2; + } + + .xl\:focus\:text-yellow-lightest:focus { + color: #fcfbeb; + } + + .xl\:focus\:text-green-darkest:focus { + color: #0f2f21; + } + + .xl\:focus\:text-green-darker:focus { + color: #1a4731; + } + + .xl\:focus\:text-green-dark:focus { + color: #1f9d55; + } + + .xl\:focus\:text-green:focus { + color: #38c172; + } + + .xl\:focus\:text-green-light:focus { + color: #51d88a; + } + + .xl\:focus\:text-green-lighter:focus { + color: #a2f5bf; + } + + .xl\:focus\:text-green-lightest:focus { + color: #e3fcec; + } + + .xl\:focus\:text-teal-darkest:focus { + color: #0d3331; + } + + .xl\:focus\:text-teal-darker:focus { + color: #20504f; + } + + .xl\:focus\:text-teal-dark:focus { + color: #38a89d; + } + + .xl\:focus\:text-teal:focus { + color: #4dc0b5; + } + + .xl\:focus\:text-teal-light:focus { + color: #64d5ca; + } + + .xl\:focus\:text-teal-lighter:focus { + color: #a0f0ed; + } + + .xl\:focus\:text-teal-lightest:focus { + color: #e8fffe; + } + + .xl\:focus\:text-blue-darkest:focus { + color: #12283a; + } + + .xl\:focus\:text-blue-darker:focus { + color: #1c3d5a; + } + + .xl\:focus\:text-blue-dark:focus { + color: #2779bd; + } + + .xl\:focus\:text-blue:focus { + color: #3490dc; + } + + .xl\:focus\:text-blue-light:focus { + color: #6cb2eb; + } + + .xl\:focus\:text-blue-lighter:focus { + color: #bcdefa; + } + + .xl\:focus\:text-blue-lightest:focus { + color: #eff8ff; + } + + .xl\:focus\:text-indigo-darkest:focus { + color: #191e38; + } + + .xl\:focus\:text-indigo-darker:focus { + color: #2f365f; + } + + .xl\:focus\:text-indigo-dark:focus { + color: #5661b3; + } + + .xl\:focus\:text-indigo:focus { + color: #6574cd; + } + + .xl\:focus\:text-indigo-light:focus { + color: #7886d7; + } + + .xl\:focus\:text-indigo-lighter:focus { + color: #b2b7ff; + } + + .xl\:focus\:text-indigo-lightest:focus { + color: #e6e8ff; + } + + .xl\:focus\:text-purple-darkest:focus { + color: #21183c; + } + + .xl\:focus\:text-purple-darker:focus { + color: #382b5f; + } + + .xl\:focus\:text-purple-dark:focus { + color: #794acf; + } + + .xl\:focus\:text-purple:focus { + color: #9561e2; + } + + .xl\:focus\:text-purple-light:focus { + color: #a779e9; + } + + .xl\:focus\:text-purple-lighter:focus { + color: #d6bbfc; + } + + .xl\:focus\:text-purple-lightest:focus { + color: #f3ebff; + } + + .xl\:focus\:text-pink-darkest:focus { + color: #451225; + } + + .xl\:focus\:text-pink-darker:focus { + color: #6f213f; + } + + .xl\:focus\:text-pink-dark:focus { + color: #eb5286; + } + + .xl\:focus\:text-pink:focus { + color: #f66d9b; + } + + .xl\:focus\:text-pink-light:focus { + color: #fa7ea8; + } + + .xl\:focus\:text-pink-lighter:focus { + color: #ffbbca; + } + + .xl\:focus\:text-pink-lightest:focus { + color: #ffebef; + } + + .xl\:text-xs { + font-size: .75rem; + } + + .xl\:text-sm { + font-size: .875rem; + } + + .xl\:text-base { + font-size: 1rem; + } + + .xl\:text-lg { + font-size: 1.125rem; + } + + .xl\:text-xl { + font-size: 1.25rem; + } + + .xl\:text-2xl { + font-size: 1.5rem; + } + + .xl\:text-3xl { + font-size: 1.875rem; + } + + .xl\:text-4xl { + font-size: 2.25rem; + } + + .xl\:text-5xl { + font-size: 3rem; + } + + .xl\:italic { + font-style: italic; + } + + .xl\:roman { + font-style: normal; + } + + .xl\:uppercase { + text-transform: uppercase; + } + + .xl\:lowercase { + text-transform: lowercase; + } + + .xl\:capitalize { + text-transform: capitalize; + } + + .xl\:normal-case { + text-transform: none; + } + + .xl\:underline { + text-decoration: underline; + } + + .xl\:line-through { + text-decoration: line-through; + } + + .xl\:no-underline { + text-decoration: none; + } + + .xl\:antialiased { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .xl\:subpixel-antialiased { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .xl\:hover\:italic:hover { + font-style: italic; + } + + .xl\:hover\:roman:hover { + font-style: normal; + } + + .xl\:hover\:uppercase:hover { + text-transform: uppercase; + } + + .xl\:hover\:lowercase:hover { + text-transform: lowercase; + } + + .xl\:hover\:capitalize:hover { + text-transform: capitalize; + } + + .xl\:hover\:normal-case:hover { + text-transform: none; + } + + .xl\:hover\:underline:hover { + text-decoration: underline; + } + + .xl\:hover\:line-through:hover { + text-decoration: line-through; + } + + .xl\:hover\:no-underline:hover { + text-decoration: none; + } + + .xl\:hover\:antialiased:hover { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .xl\:hover\:subpixel-antialiased:hover { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .xl\:focus\:italic:focus { + font-style: italic; + } + + .xl\:focus\:roman:focus { + font-style: normal; + } + + .xl\:focus\:uppercase:focus { + text-transform: uppercase; + } + + .xl\:focus\:lowercase:focus { + text-transform: lowercase; + } + + .xl\:focus\:capitalize:focus { + text-transform: capitalize; + } + + .xl\:focus\:normal-case:focus { + text-transform: none; + } + + .xl\:focus\:underline:focus { + text-decoration: underline; + } + + .xl\:focus\:line-through:focus { + text-decoration: line-through; + } + + .xl\:focus\:no-underline:focus { + text-decoration: none; + } + + .xl\:focus\:antialiased:focus { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .xl\:focus\:subpixel-antialiased:focus { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + } + + .xl\:tracking-tight { + letter-spacing: -0.05em; + } + + .xl\:tracking-normal { + letter-spacing: 0; + } + + .xl\:tracking-wide { + letter-spacing: .05em; + } + + .xl\:select-none { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + } + + .xl\:select-text { + -webkit-user-select: text; + -moz-user-select: text; + -ms-user-select: text; + user-select: text; + } + + .xl\:align-baseline { + vertical-align: baseline; + } + + .xl\:align-top { + vertical-align: top; + } + + .xl\:align-middle { + vertical-align: middle; + } + + .xl\:align-bottom { + vertical-align: bottom; + } + + .xl\:align-text-top { + vertical-align: text-top; + } + + .xl\:align-text-bottom { + vertical-align: text-bottom; + } + + .xl\:visible { + visibility: visible; + } + + .xl\:invisible { + visibility: hidden; + } + + .xl\:whitespace-normal { + white-space: normal; + } + + .xl\:whitespace-no-wrap { + white-space: nowrap; + } + + .xl\:whitespace-pre { + white-space: pre; + } + + .xl\:whitespace-pre-line { + white-space: pre-line; + } + + .xl\:whitespace-pre-wrap { + white-space: pre-wrap; + } + + .xl\:break-words { + word-wrap: break-word; + } + + .xl\:break-normal { + word-wrap: normal; + } + + .xl\:truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + + .xl\:w-1 { + width: .25rem; + } + + .xl\:w-2 { + width: .5rem; + } + + .xl\:w-3 { + width: .75rem; + } + + .xl\:w-4 { + width: 1rem; + } + + .xl\:w-5 { + width: 1.25rem; + } + + .xl\:w-6 { + width: 1.5rem; + } + + .xl\:w-8 { + width: 2rem; + } + + .xl\:w-10 { + width: 2.5rem; + } + + .xl\:w-12 { + width: 3rem; + } + + .xl\:w-16 { + width: 4rem; + } + + .xl\:w-24 { + width: 6rem; + } + + .xl\:w-32 { + width: 8rem; + } + + .xl\:w-48 { + width: 12rem; + } + + .xl\:w-64 { + width: 16rem; + } + + .xl\:w-auto { + width: auto; + } + + .xl\:w-px { + width: 1px; + } + + .xl\:w-1\/2 { + width: 50%; + } + + .xl\:w-1\/3 { + width: 33.33333%; + } + + .xl\:w-2\/3 { + width: 66.66667%; + } + + .xl\:w-1\/4 { + width: 25%; + } + + .xl\:w-3\/4 { + width: 75%; + } + + .xl\:w-1\/5 { + width: 20%; + } + + .xl\:w-2\/5 { + width: 40%; + } + + .xl\:w-3\/5 { + width: 60%; + } + + .xl\:w-4\/5 { + width: 80%; + } + + .xl\:w-1\/6 { + width: 16.66667%; + } + + .xl\:w-5\/6 { + width: 83.33333%; + } + + .xl\:w-full { + width: 100%; + } + + .xl\:w-screen { + width: 100vw; + } + + .xl\:z-0 { + z-index: 0; + } + + .xl\:z-10 { + z-index: 10; + } + + .xl\:z-20 { + z-index: 20; + } + + .xl\:z-30 { + z-index: 30; + } + + .xl\:z-40 { + z-index: 40; + } + + .xl\:z-50 { + z-index: 50; + } + + .xl\:z-auto { + z-index: auto; + } +} diff --git a/src/styles/index.css b/src/styles/index.css new file mode 100644 index 0000000..0594179 --- /dev/null +++ b/src/styles/index.css @@ -0,0 +1,5 @@ +@tailwind preflight; +@tailwind components; +@tailwind utilities; + +/* Your custom CSS here */ diff --git a/tailwind.config.js b/tailwind.config.js new file mode 100644 index 0000000..d9c4e34 --- /dev/null +++ b/tailwind.config.js @@ -0,0 +1,980 @@ +/* + +Tailwind - The Utility-First CSS Framework + +A project by Adam Wathan (@adamwathan), Jonathan Reinink (@reinink), +David Hemphill (@davidhemphill) and Steve Schoger (@steveschoger). + +Welcome to the Tailwind config file. This is where you can customize +Tailwind specifically for your project. Don't be intimidated by the +length of this file. It's really just a big JavaScript object and +we've done our very best to explain each section. + +View the full documentation at https://tailwindcss.com. + + +|------------------------------------------------------------------------------- +| The default config +|------------------------------------------------------------------------------- +| +| This variable contains the default Tailwind config. You don't have +| to use it, but it can sometimes be helpful to have available. For +| example, you may choose to merge your custom configuration +| values with some of the Tailwind defaults. +| +*/ + +let defaultConfig = require('tailwindcss/defaultConfig')() + + +/* +|------------------------------------------------------------------------------- +| Colors https://tailwindcss.com/docs/colors +|------------------------------------------------------------------------------- +| +| Here you can specify the colors used in your project. To get you started, +| we've provided a generous palette of great looking colors that are perfect +| for prototyping, but don't hesitate to change them for your project. You +| own these colors, nothing will break if you change everything about them. +| +| We've used literal color names ("red", "blue", etc.) for the default +| palette, but if you'd rather use functional names like "primary" and +| "secondary", or even a numeric scale like "100" and "200", go for it. +| +*/ + +let colors = { + 'transparent': 'transparent', + + 'black': '#22292f', + 'grey-darkest': '#3d4852', + 'grey-darker': '#606f7b', + 'grey-dark': '#8795a1', + 'grey': '#b8c2cc', + 'grey-light': '#dae1e7', + 'grey-lighter': '#f1f5f8', + 'grey-lightest': '#f8fafc', + 'white': '#ffffff', + + 'red-darkest': '#3b0d0c', + 'red-darker': '#621b18', + 'red-dark': '#cc1f1a', + 'red': '#e3342f', + 'red-light': '#ef5753', + 'red-lighter': '#f9acaa', + 'red-lightest': '#fcebea', + + 'orange-darkest': '#462a16', + 'orange-darker': '#613b1f', + 'orange-dark': '#de751f', + 'orange': '#f6993f', + 'orange-light': '#faad63', + 'orange-lighter': '#fcd9b6', + 'orange-lightest': '#fff5eb', + + 'yellow-darkest': '#453411', + 'yellow-darker': '#684f1d', + 'yellow-dark': '#f2d024', + 'yellow': '#ffed4a', + 'yellow-light': '#fff382', + 'yellow-lighter': '#fff9c2', + 'yellow-lightest': '#fcfbeb', + + 'green-darkest': '#0f2f21', + 'green-darker': '#1a4731', + 'green-dark': '#1f9d55', + 'green': '#38c172', + 'green-light': '#51d88a', + 'green-lighter': '#a2f5bf', + 'green-lightest': '#e3fcec', + + 'teal-darkest': '#0d3331', + 'teal-darker': '#20504f', + 'teal-dark': '#38a89d', + 'teal': '#4dc0b5', + 'teal-light': '#64d5ca', + 'teal-lighter': '#a0f0ed', + 'teal-lightest': '#e8fffe', + + 'blue-darkest': '#12283a', + 'blue-darker': '#1c3d5a', + 'blue-dark': '#2779bd', + 'blue': '#3490dc', + 'blue-light': '#6cb2eb', + 'blue-lighter': '#bcdefa', + 'blue-lightest': '#eff8ff', + + 'indigo-darkest': '#191e38', + 'indigo-darker': '#2f365f', + 'indigo-dark': '#5661b3', + 'indigo': '#6574cd', + 'indigo-light': '#7886d7', + 'indigo-lighter': '#b2b7ff', + 'indigo-lightest': '#e6e8ff', + + 'purple-darkest': '#21183c', + 'purple-darker': '#382b5f', + 'purple-dark': '#794acf', + 'purple': '#9561e2', + 'purple-light': '#a779e9', + 'purple-lighter': '#d6bbfc', + 'purple-lightest': '#f3ebff', + + 'pink-darkest': '#451225', + 'pink-darker': '#6f213f', + 'pink-dark': '#eb5286', + 'pink': '#f66d9b', + 'pink-light': '#fa7ea8', + 'pink-lighter': '#ffbbca', + 'pink-lightest': '#ffebef', +} + +module.exports = { + + /* + |----------------------------------------------------------------------------- + | Colors https://tailwindcss.com/docs/colors + |----------------------------------------------------------------------------- + | + | The color palette defined above is also assigned to the "colors" key of + | your Tailwind config. This makes it easy to access them in your CSS + | using Tailwind's config helper. For example: + | + | .error { color: config('colors.red') } + | + */ + + colors: colors, + + + /* + |----------------------------------------------------------------------------- + | Screens https://tailwindcss.com/docs/responsive-design + |----------------------------------------------------------------------------- + | + | Screens in Tailwind are translated to CSS media queries. They define the + | responsive breakpoints for your project. By default Tailwind takes a + | "mobile first" approach, where each screen size represents a minimum + | viewport width. Feel free to have as few or as many screens as you + | want, naming them in whatever way you'd prefer for your project. + | + | Tailwind also allows for more complex screen definitions, which can be + | useful in certain situations. Be sure to see the full responsive + | documentation for a complete list of options. + | + | Class name: .{screen}:{utility} + | + */ + + screens: { + 'sm': '576px', + 'md': '768px', + 'lg': '992px', + 'xl': '1200px', + }, + + + /* + |----------------------------------------------------------------------------- + | Fonts https://tailwindcss.com/docs/fonts + |----------------------------------------------------------------------------- + | + | Here is where you define your project's font stack, or font families. + | Keep in mind that Tailwind doesn't actually load any fonts for you. + | If you're using custom fonts you'll need to import them prior to + | defining them here. + | + | By default we provide a native font stack that works remarkably well on + | any device or OS you're using, since it just uses the default fonts + | provided by the platform. + | + | Class name: .font-{name} + | CSS property: font-family + | + */ + + fonts: { + 'sans': [ + 'system-ui', + 'BlinkMacSystemFont', + '-apple-system', + 'Segoe UI', + 'Roboto', + 'Oxygen', + 'Ubuntu', + 'Cantarell', + 'Fira Sans', + 'Droid Sans', + 'Helvetica Neue', + 'sans-serif', + ], + 'serif': [ + 'Constantia', + 'Lucida Bright', + 'Lucidabright', + 'Lucida Serif', + 'Lucida', + 'DejaVu Serif', + 'Bitstream Vera Serif', + 'Liberation Serif', + 'Georgia', + 'serif', + ], + 'mono': [ + 'Menlo', + 'Monaco', + 'Consolas', + 'Liberation Mono', + 'Courier New', + 'monospace', + ], + }, + + + /* + |----------------------------------------------------------------------------- + | Text sizes https://tailwindcss.com/docs/text-sizing + |----------------------------------------------------------------------------- + | + | Here is where you define your text sizes. Name these in whatever way + | makes the most sense to you. We use size names by default, but + | you're welcome to use a numeric scale or even something else + | entirely. + | + | By default Tailwind uses the "rem" unit type for most measurements. + | This allows you to set a root font size which all other sizes are + | then based on. That said, you are free to use whatever units you + | prefer, be it rems, ems, pixels or other. + | + | Class name: .text-{size} + | CSS property: font-size + | + */ + + textSizes: { + 'xs': '.75rem', // 12px + 'sm': '.875rem', // 14px + 'base': '1rem', // 16px + 'lg': '1.125rem', // 18px + 'xl': '1.25rem', // 20px + '2xl': '1.5rem', // 24px + '3xl': '1.875rem', // 30px + '4xl': '2.25rem', // 36px + '5xl': '3rem', // 48px + }, + + + /* + |----------------------------------------------------------------------------- + | Font weights https://tailwindcss.com/docs/font-weight + |----------------------------------------------------------------------------- + | + | Here is where you define your font weights. We've provided a list of + | common font weight names with their respective numeric scale values + | to get you started. It's unlikely that your project will require + | all of these, so we recommend removing those you don't need. + | + | Class name: .font-{weight} + | CSS property: font-weight + | + */ + + fontWeights: { + 'hairline': 100, + 'thin': 200, + 'light': 300, + 'normal': 400, + 'medium': 500, + 'semibold': 600, + 'bold': 700, + 'extrabold': 800, + 'black': 900, + }, + + + /* + |----------------------------------------------------------------------------- + | Leading (line height) https://tailwindcss.com/docs/line-height + |----------------------------------------------------------------------------- + | + | Here is where you define your line height values, or as we call + | them in Tailwind, leadings. + | + | Class name: .leading-{size} + | CSS property: line-height + | + */ + + leading: { + 'none': 1, + 'tight': 1.25, + 'normal': 1.5, + 'loose': 2, + }, + + + /* + |----------------------------------------------------------------------------- + | Tracking (letter spacing) https://tailwindcss.com/docs/letter-spacing + |----------------------------------------------------------------------------- + | + | Here is where you define your letter spacing values, or as we call + | them in Tailwind, tracking. + | + | Class name: .tracking-{size} + | CSS property: letter-spacing + | + */ + + tracking: { + 'tight': '-0.05em', + 'normal': '0', + 'wide': '0.05em', + }, + + + /* + |----------------------------------------------------------------------------- + | Text colors https://tailwindcss.com/docs/text-color + |----------------------------------------------------------------------------- + | + | Here is where you define your text colors. By default these use the + | color palette we defined above, however you're welcome to set these + | independently if that makes sense for your project. + | + | Class name: .text-{color} + | CSS property: color + | + */ + + textColors: colors, + + + /* + |----------------------------------------------------------------------------- + | Background colors https://tailwindcss.com/docs/background-color + |----------------------------------------------------------------------------- + | + | Here is where you define your background colors. By default these use + | the color palette we defined above, however you're welcome to set + | these independently if that makes sense for your project. + | + | Class name: .bg-{color} + | CSS property: background-color + | + */ + + backgroundColors: colors, + + + /* + |----------------------------------------------------------------------------- + | Background sizes https://tailwindcss.com/docs/background-size + |----------------------------------------------------------------------------- + | + | Here is where you define your background sizes. We provide some common + | values that are useful in most projects, but feel free to add other sizes + | that are specific to your project here as well. + | + | Class name: .bg-{size} + | CSS property: background-size + | + */ + + backgroundSize: { + 'auto': 'auto', + 'cover': 'cover', + 'contain': 'contain', + }, + + + /* + |----------------------------------------------------------------------------- + | Border widths https://tailwindcss.com/docs/border-width + |----------------------------------------------------------------------------- + | + | Here is where you define your border widths. Take note that border + | widths require a special "default" value set as well. This is the + | width that will be used when you do not specify a border width. + | + | Class name: .border{-side?}{-width?} + | CSS property: border-width + | + */ + + borderWidths: { + default: '1px', + '0': '0', + '2': '2px', + '4': '4px', + '8': '8px', + }, + + + /* + |----------------------------------------------------------------------------- + | Border colors https://tailwindcss.com/docs/border-color + |----------------------------------------------------------------------------- + | + | Here is where you define your border colors. By default these use the + | color palette we defined above, however you're welcome to set these + | independently if that makes sense for your project. + | + | Take note that border colors require a special "default" value set + | as well. This is the color that will be used when you do not + | specify a border color. + | + | Class name: .border-{color} + | CSS property: border-color + | + */ + + borderColors: global.Object.assign({ default: colors['grey-light'] }, colors), + + + /* + |----------------------------------------------------------------------------- + | Border radius https://tailwindcss.com/docs/border-radius + |----------------------------------------------------------------------------- + | + | Here is where you define your border radius values. If a `default` radius + | is provided, it will be made available as the non-suffixed `.rounded` + | utility. + | + | If your scale includes a `0` value to reset already rounded corners, it's + | a good idea to put it first so other values are able to override it. + | + | Class name: .rounded{-side?}{-size?} + | CSS property: border-radius + | + */ + + borderRadius: { + 'none': '0', + 'sm': '.125rem', + default: '.25rem', + 'lg': '.5rem', + 'full': '9999px', + }, + + + /* + |----------------------------------------------------------------------------- + | Width https://tailwindcss.com/docs/width + |----------------------------------------------------------------------------- + | + | Here is where you define your width utility sizes. These can be + | percentage based, pixels, rems, or any other units. By default + | we provide a sensible rem based numeric scale, a percentage + | based fraction scale, plus some other common use-cases. You + | can, of course, modify these values as needed. + | + | + | It's also worth mentioning that Tailwind automatically escapes + | invalid CSS class name characters, which allows you to have + | awesome classes like .w-2/3. + | + | Class name: .w-{size} + | CSS property: width + | + */ + + width: { + 'auto': 'auto', + 'px': '1px', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '5': '1.25rem', + '6': '1.5rem', + '8': '2rem', + '10': '2.5rem', + '12': '3rem', + '16': '4rem', + '24': '6rem', + '32': '8rem', + '48': '12rem', + '64': '16rem', + '1/2': '50%', + '1/3': '33.33333%', + '2/3': '66.66667%', + '1/4': '25%', + '3/4': '75%', + '1/5': '20%', + '2/5': '40%', + '3/5': '60%', + '4/5': '80%', + '1/6': '16.66667%', + '5/6': '83.33333%', + 'full': '100%', + 'screen': '100vw', + }, + + + /* + |----------------------------------------------------------------------------- + | Height https://tailwindcss.com/docs/height + |----------------------------------------------------------------------------- + | + | Here is where you define your height utility sizes. These can be + | percentage based, pixels, rems, or any other units. By default + | we provide a sensible rem based numeric scale plus some other + | common use-cases. You can, of course, modify these values as + | needed. + | + | Class name: .h-{size} + | CSS property: height + | + */ + + height: { + 'auto': 'auto', + 'px': '1px', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '5': '1.25rem', + '6': '1.5rem', + '8': '2rem', + '10': '2.5rem', + '12': '3rem', + '16': '4rem', + '24': '6rem', + '32': '8rem', + '48': '12rem', + '64': '16rem', + 'full': '100%', + 'screen': '100vh', + }, + + + /* + |----------------------------------------------------------------------------- + | Minimum width https://tailwindcss.com/docs/min-width + |----------------------------------------------------------------------------- + | + | Here is where you define your minimum width utility sizes. These can + | be percentage based, pixels, rems, or any other units. We provide a + | couple common use-cases by default. You can, of course, modify + | these values as needed. + | + | Class name: .min-w-{size} + | CSS property: min-width + | + */ + + minWidth: { + '0': '0', + 'full': '100%', + }, + + + /* + |----------------------------------------------------------------------------- + | Minimum height https://tailwindcss.com/docs/min-height + |----------------------------------------------------------------------------- + | + | Here is where you define your minimum height utility sizes. These can + | be percentage based, pixels, rems, or any other units. We provide a + | few common use-cases by default. You can, of course, modify these + | values as needed. + | + | Class name: .min-h-{size} + | CSS property: min-height + | + */ + + minHeight: { + '0': '0', + 'full': '100%', + 'screen': '100vh', + }, + + + /* + |----------------------------------------------------------------------------- + | Maximum width https://tailwindcss.com/docs/max-width + |----------------------------------------------------------------------------- + | + | Here is where you define your maximum width utility sizes. These can + | be percentage based, pixels, rems, or any other units. By default + | we provide a sensible rem based scale and a "full width" size, + | which is basically a reset utility. You can, of course, + | modify these values as needed. + | + | Class name: .max-w-{size} + | CSS property: max-width + | + */ + + maxWidth: { + 'xs': '20rem', + 'sm': '30rem', + 'md': '40rem', + 'lg': '50rem', + 'xl': '60rem', + '2xl': '70rem', + '3xl': '80rem', + '4xl': '90rem', + '5xl': '100rem', + 'full': '100%', + }, + + + /* + |----------------------------------------------------------------------------- + | Maximum height https://tailwindcss.com/docs/max-height + |----------------------------------------------------------------------------- + | + | Here is where you define your maximum height utility sizes. These can + | be percentage based, pixels, rems, or any other units. We provide a + | couple common use-cases by default. You can, of course, modify + | these values as needed. + | + | Class name: .max-h-{size} + | CSS property: max-height + | + */ + + maxHeight: { + 'full': '100%', + 'screen': '100vh', + }, + + + /* + |----------------------------------------------------------------------------- + | Padding https://tailwindcss.com/docs/padding + |----------------------------------------------------------------------------- + | + | Here is where you define your padding utility sizes. These can be + | percentage based, pixels, rems, or any other units. By default we + | provide a sensible rem based numeric scale plus a couple other + | common use-cases like "1px". You can, of course, modify these + | values as needed. + | + | Class name: .p{side?}-{size} + | CSS property: padding + | + */ + + padding: { + 'px': '1px', + '0': '0', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '5': '1.25rem', + '6': '1.5rem', + '8': '2rem', + '10': '2.5rem', + '12': '3rem', + '16': '4rem', + '20': '5rem', + '24': '6rem', + '32': '8rem', + }, + + + /* + |----------------------------------------------------------------------------- + | Margin https://tailwindcss.com/docs/margin + |----------------------------------------------------------------------------- + | + | Here is where you define your margin utility sizes. These can be + | percentage based, pixels, rems, or any other units. By default we + | provide a sensible rem based numeric scale plus a couple other + | common use-cases like "1px". You can, of course, modify these + | values as needed. + | + | Class name: .m{side?}-{size} + | CSS property: margin + | + */ + + margin: { + 'auto': 'auto', + 'px': '1px', + '0': '0', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '5': '1.25rem', + '6': '1.5rem', + '8': '2rem', + '10': '2.5rem', + '12': '3rem', + '16': '4rem', + '20': '5rem', + '24': '6rem', + '32': '8rem', + }, + + + /* + |----------------------------------------------------------------------------- + | Negative margin https://tailwindcss.com/docs/negative-margin + |----------------------------------------------------------------------------- + | + | Here is where you define your negative margin utility sizes. These can + | be percentage based, pixels, rems, or any other units. By default we + | provide matching values to the padding scale since these utilities + | generally get used together. You can, of course, modify these + | values as needed. + | + | Class name: .-m{side?}-{size} + | CSS property: margin + | + */ + + negativeMargin: { + 'px': '1px', + '0': '0', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '5': '1.25rem', + '6': '1.5rem', + '8': '2rem', + '10': '2.5rem', + '12': '3rem', + '16': '4rem', + '20': '5rem', + '24': '6rem', + '32': '8rem', + }, + + + /* + |----------------------------------------------------------------------------- + | Shadows https://tailwindcss.com/docs/shadows + |----------------------------------------------------------------------------- + | + | Here is where you define your shadow utilities. As you can see from + | the defaults we provide, it's possible to apply multiple shadows + | per utility using comma separation. + | + | If a `default` shadow is provided, it will be made available as the non- + | suffixed `.shadow` utility. + | + | Class name: .shadow-{size?} + | CSS property: box-shadow + | + */ + + shadows: { + default: '0 2px 4px 0 rgba(0,0,0,0.10)', + 'md': '0 4px 8px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.08)', + 'lg': '0 15px 30px 0 rgba(0,0,0,0.11), 0 5px 15px 0 rgba(0,0,0,0.08)', + 'inner': 'inset 0 2px 4px 0 rgba(0,0,0,0.06)', + 'outline': '0 0 0 3px rgba(52,144,220,0.5)', + 'none': 'none', + }, + + + /* + |----------------------------------------------------------------------------- + | Z-index https://tailwindcss.com/docs/z-index + |----------------------------------------------------------------------------- + | + | Here is where you define your z-index utility values. By default we + | provide a sensible numeric scale. You can, of course, modify these + | values as needed. + | + | Class name: .z-{index} + | CSS property: z-index + | + */ + + zIndex: { + 'auto': 'auto', + '0': 0, + '10': 10, + '20': 20, + '30': 30, + '40': 40, + '50': 50, + }, + + + /* + |----------------------------------------------------------------------------- + | Opacity https://tailwindcss.com/docs/opacity + |----------------------------------------------------------------------------- + | + | Here is where you define your opacity utility values. By default we + | provide a sensible numeric scale. You can, of course, modify these + | values as needed. + | + | Class name: .opacity-{name} + | CSS property: opacity + | + */ + + opacity: { + '0': '0', + '25': '.25', + '50': '.5', + '75': '.75', + '100': '1', + }, + + + /* + |----------------------------------------------------------------------------- + | SVG fill https://tailwindcss.com/docs/svg + |----------------------------------------------------------------------------- + | + | Here is where you define your SVG fill colors. By default we just provide + | `fill-current` which sets the fill to the current text color. This lets you + | specify a fill color using existing text color utilities and helps keep the + | generated CSS file size down. + | + | Class name: .fill-{name} + | CSS property: fill + | + */ + + svgFill: { + 'current': 'currentColor', + }, + + + /* + |----------------------------------------------------------------------------- + | SVG stroke https://tailwindcss.com/docs/svg + |----------------------------------------------------------------------------- + | + | Here is where you define your SVG stroke colors. By default we just provide + | `stroke-current` which sets the stroke to the current text color. This lets + | you specify a stroke color using existing text color utilities and helps + | keep the generated CSS file size down. + | + | Class name: .stroke-{name} + | CSS property: stroke + | + */ + + svgStroke: { + 'current': 'currentColor', + }, + + + /* + |----------------------------------------------------------------------------- + | Modules https://tailwindcss.com/docs/configuration#modules + |----------------------------------------------------------------------------- + | + | Here is where you control which modules are generated and what variants are + | generated for each of those modules. + | + | Currently supported variants: + | - responsive + | - hover + | - focus + | - focus-within + | - active + | - group-hover + | + | To disable a module completely, use `false` instead of an array. + | + */ + + modules: { + appearance: ['responsive'], + backgroundAttachment: ['responsive'], + backgroundColors: ['responsive', 'hover', 'focus'], + backgroundPosition: ['responsive'], + backgroundRepeat: ['responsive'], + backgroundSize: ['responsive'], + borderCollapse: [], + borderColors: ['responsive', 'hover', 'focus'], + borderRadius: ['responsive'], + borderStyle: ['responsive'], + borderWidths: ['responsive'], + cursor: ['responsive'], + display: ['responsive'], + flexbox: ['responsive'], + float: ['responsive'], + fonts: ['responsive'], + fontWeights: ['responsive', 'hover', 'focus'], + height: ['responsive'], + leading: ['responsive'], + lists: ['responsive'], + margin: ['responsive'], + maxHeight: ['responsive'], + maxWidth: ['responsive'], + minHeight: ['responsive'], + minWidth: ['responsive'], + negativeMargin: ['responsive'], + objectFit: false, + objectPosition: false, + opacity: ['responsive'], + outline: ['focus'], + overflow: ['responsive'], + padding: ['responsive'], + pointerEvents: ['responsive'], + position: ['responsive'], + resize: ['responsive'], + shadows: ['responsive', 'hover', 'focus'], + svgFill: [], + svgStroke: [], + tableLayout: ['responsive'], + textAlign: ['responsive'], + textColors: ['responsive', 'hover', 'focus'], + textSizes: ['responsive'], + textStyle: ['responsive', 'hover', 'focus'], + tracking: ['responsive'], + userSelect: ['responsive'], + verticalAlign: ['responsive'], + visibility: ['responsive'], + whitespace: ['responsive'], + width: ['responsive'], + zIndex: ['responsive'], + }, + + + /* + |----------------------------------------------------------------------------- + | Plugins https://tailwindcss.com/docs/plugins + |----------------------------------------------------------------------------- + | + | Here is where you can register any plugins you'd like to use in your + | project. Tailwind's built-in `container` plugin is enabled by default to + | give you a Bootstrap-style responsive container component out of the box. + | + | Be sure to view the complete plugin documentation to learn more about how + | the plugin system works. + | + */ + + plugins: [ + require('tailwindcss/plugins/container')({ + // center: true, + // padding: '1rem', + }), + ], + + + /* + |----------------------------------------------------------------------------- + | Advanced Options https://tailwindcss.com/docs/configuration#options + |----------------------------------------------------------------------------- + | + | Here is where you can tweak advanced configuration options. We recommend + | leaving these options alone unless you absolutely need to change them. + | + */ + + options: { + prefix: '', + important: false, + separator: ':', + }, + +} From f4d5f33b15563f99a3fd6ef7a557550ec9a1f933 Mon Sep 17 00:00:00 2001 From: Justice Date: Sun, 21 Apr 2019 08:50:01 +0100 Subject: [PATCH 002/151] removed taiwindcss and rewrote the readme --- README.md | 15 +- package.json | 13 +- pages/index.js | 6 - postcss.config.js | 4 - src/index.css | 28431 ----------------------------------------- src/styles/index.css | 5 - tailwind.config.js | 980 -- 7 files changed, 17 insertions(+), 29437 deletions(-) delete mode 100644 postcss.config.js delete mode 100644 src/index.css delete mode 100644 src/styles/index.css delete mode 100644 tailwind.config.js diff --git a/README.md b/README.md index 26f035b..2d2df88 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,13 @@ -# project-template -Document your applications API and general usage +# Project Help Me # + +Help Me is an app that connects Depressed people to each other, essentially, it is a social network for depressed people + +## Development ## + +* clone the repo * +* ```cd helpme``` +* ```npm install``` +* ```npm run dev``` + + +Antdesign is also used for the components, check diff --git a/package.json b/package.json index 203b60a..66fc680 100644 --- a/package.json +++ b/package.json @@ -4,12 +4,10 @@ "description": "An App That connects depressed people to each other for comfort", "main": "index.js", "scripts": { - "build:css": "postcss src/styles/index.css -o src/index.css", - "watch:css": "postcss src/styles/index.css -o src/index.css -w", "lint": "eslint pages", - "dev": "npm run build:css && next", - "build": "npm run build:css && next build", - "start": "npm run build:css && next start" + "dev": "next", + "build": "next build", + "start": "next start" }, "repository": { "type": "git", @@ -22,7 +20,6 @@ }, "homepage": "https://github.com/team-helpme/helpme#readme", "devDependencies": { - "autoprefixer": "^9.5.1", "babel-eslint": "^10.0.1", "chai": "^4.2.0", "enzyme": "^3.9.0", @@ -37,9 +34,7 @@ "eslint-plugin-standard": "^4.0.0", "jest": "^24.7.1", "mocha": "^6.1.2", - "postcss-cli": "^6.1.2", - "sinon": "^7.3.1", - "tailwindcss": "^0.7.4" + "sinon": "^7.3.1" }, "dependencies": { "@zeit/next-css": "^1.0.1", diff --git a/pages/index.js b/pages/index.js index f6c4678..e69de29 100644 --- a/pages/index.js +++ b/pages/index.js @@ -1,6 +0,0 @@ -// import React from 'react'; -// import '../src/index.css'; - -// const test = () =>
Today is my cay
; - -// export default test; diff --git a/postcss.config.js b/postcss.config.js deleted file mode 100644 index a81a9fb..0000000 --- a/postcss.config.js +++ /dev/null @@ -1,4 +0,0 @@ -const tailwindcss = require('tailwindcss'); -module.exports = { - plugins: [tailwindcss('./tailwind.config.js'), require('autoprefixer')] -}; diff --git a/src/index.css b/src/index.css deleted file mode 100644 index aaa8109..0000000 --- a/src/index.css +++ /dev/null @@ -1,28431 +0,0 @@ -/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ - -/* Document - ========================================================================== */ - -/** - * 1. Correct the line height in all browsers. - * 2. Prevent adjustments of font size after orientation changes in iOS. - */ - -html { - line-height: 1.15; /* 1 */ - -webkit-text-size-adjust: 100%; /* 2 */ -} - -/* Sections - ========================================================================== */ - -/** - * Remove the margin in all browsers. - */ - -body { - margin: 0; -} - -/** - * Render the `main` element consistently in IE. - */ - -main { - display: block; -} - -/** - * Correct the font size and margin on `h1` elements within `section` and - * `article` contexts in Chrome, Firefox, and Safari. - */ - -h1 { - font-size: 2em; - margin: .67em 0; -} - -/* Grouping content - ========================================================================== */ - -/** - * 1. Add the correct box sizing in Firefox. - * 2. Show the overflow in Edge and IE. - */ - -hr { - box-sizing: content-box; /* 1 */ - height: 0; /* 1 */ - overflow: visible; /* 2 */ -} - -/** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - -pre { - font-family: monospace, monospace; /* 1 */ - font-size: 1em; /* 2 */ -} - -/* Text-level semantics - ========================================================================== */ - -/** - * Remove the gray background on active links in IE 10. - */ - -a { - background-color: transparent; -} - -/** - * 1. Remove the bottom border in Chrome 57- - * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. - */ - -abbr[title] { - border-bottom: none; /* 1 */ - text-decoration: underline; /* 2 */ - -webkit-text-decoration: underline dotted; - text-decoration: underline dotted; /* 2 */ -} - -/** - * Add the correct font weight in Chrome, Edge, and Safari. - */ - -b, -strong { - font-weight: bolder; -} - -/** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - -code, -kbd, -samp { - font-family: monospace, monospace; /* 1 */ - font-size: 1em; /* 2 */ -} - -/** - * Add the correct font size in all browsers. - */ - -small { - font-size: 80%; -} - -/** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - -sub, -sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; -} - -sub { - bottom: -0.25em; -} - -sup { - top: -0.5em; -} - -/* Embedded content - ========================================================================== */ - -/** - * Remove the border on images inside links in IE 10. - */ - -img { - border-style: none; -} - -/* Forms - ========================================================================== */ - -/** - * 1. Change the font styles in all browsers. - * 2. Remove the margin in Firefox and Safari. - */ - -button, -input, -optgroup, -select, -textarea { - font-family: inherit; /* 1 */ - font-size: 100%; /* 1 */ - line-height: 1.15; /* 1 */ - margin: 0; /* 2 */ -} - -/** - * Show the overflow in IE. - * 1. Show the overflow in Edge. - */ - -button, -input { - /* 1 */ - overflow: visible; -} - -/** - * Remove the inheritance of text transform in Edge, Firefox, and IE. - * 1. Remove the inheritance of text transform in Firefox. - */ - -button, -select { - /* 1 */ - text-transform: none; -} - -/** - * Correct the inability to style clickable types in iOS and Safari. - */ - -button, -[type="button"], -[type="reset"], -[type="submit"] { - -webkit-appearance: button; -} - -/** - * Remove the inner border and padding in Firefox. - */ - -button::-moz-focus-inner, -[type="button"]::-moz-focus-inner, -[type="reset"]::-moz-focus-inner, -[type="submit"]::-moz-focus-inner { - border-style: none; - padding: 0; -} - -/** - * Restore the focus styles unset by the previous rule. - */ - -button:-moz-focusring, -[type="button"]:-moz-focusring, -[type="reset"]:-moz-focusring, -[type="submit"]:-moz-focusring { - outline: 1px dotted ButtonText; -} - -/** - * Correct the padding in Firefox. - */ - -fieldset { - padding: .35em .75em .625em; -} - -/** - * 1. Correct the text wrapping in Edge and IE. - * 2. Correct the color inheritance from `fieldset` elements in IE. - * 3. Remove the padding so developers are not caught out when they zero out - * `fieldset` elements in all browsers. - */ - -legend { - box-sizing: border-box; /* 1 */ - color: inherit; /* 2 */ - display: table; /* 1 */ - max-width: 100%; /* 1 */ - padding: 0; /* 3 */ - white-space: normal; /* 1 */ -} - -/** - * Add the correct vertical alignment in Chrome, Firefox, and Opera. - */ - -progress { - vertical-align: baseline; -} - -/** - * Remove the default vertical scrollbar in IE 10+. - */ - -textarea { - overflow: auto; -} - -/** - * 1. Add the correct box sizing in IE 10. - * 2. Remove the padding in IE 10. - */ - -[type="checkbox"], -[type="radio"] { - box-sizing: border-box; /* 1 */ - padding: 0; /* 2 */ -} - -/** - * Correct the cursor style of increment and decrement buttons in Chrome. - */ - -[type="number"]::-webkit-inner-spin-button, -[type="number"]::-webkit-outer-spin-button { - height: auto; -} - -/** - * 1. Correct the odd appearance in Chrome and Safari. - * 2. Correct the outline style in Safari. - */ - -[type="search"] { - -webkit-appearance: textfield; /* 1 */ - outline-offset: -2px; /* 2 */ -} - -/** - * Remove the inner padding in Chrome and Safari on macOS. - */ - -[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; -} - -/** - * 1. Correct the inability to style clickable types in iOS and Safari. - * 2. Change font properties to `inherit` in Safari. - */ - -::-webkit-file-upload-button { - -webkit-appearance: button; /* 1 */ - font: inherit; /* 2 */ -} - -/* Interactive - ========================================================================== */ - -/* - * Add the correct display in Edge, IE 10+, and Firefox. - */ - -details { - display: block; -} - -/* - * Add the correct display in all browsers. - */ - -summary { - display: list-item; -} - -/* Misc - ========================================================================== */ - -/** - * Add the correct display in IE 10+. - */ - -template { - display: none; -} - -/** - * Add the correct display in IE 10. - */ - -[hidden] { - display: none; -} - -/** - * Manually forked from SUIT CSS Base: https://github.com/suitcss/base - * A thin layer on top of normalize.css that provides a starting point more - * suitable for web applications. - */ - -/** - * 1. Prevent padding and border from affecting element width - * https://goo.gl/pYtbK7 - * 2. Change the default font family in all browsers (opinionated) - */ - -html { - box-sizing: border-box; /* 1 */ - font-family: sans-serif; /* 2 */ -} - -*, -*::before, -*::after { - box-sizing: inherit; -} - -/** - * Removes the default spacing and border for appropriate elements. - */ - -blockquote, -dl, -dd, -h1, -h2, -h3, -h4, -h5, -h6, -figure, -p, -pre { - margin: 0; -} - -button { - background: transparent; - padding: 0; -} - -/** - * Work around a Firefox/IE bug where the transparent `button` background - * results in a loss of the default `button` focus styles. - */ - -button:focus { - outline: 1px dotted; - outline: 5px auto -webkit-focus-ring-color; -} - -fieldset { - margin: 0; - padding: 0; -} - -ol, -ul { - margin: 0; -} - -/** - * Tailwind custom reset styles - */ - -/** - * Allow adding a border to an element by just adding a border-width. - * - * By default, the way the browser specifies that an element should have no - * border is by setting it's border-style to `none` in the user-agent - * stylesheet. - * - * In order to easily add borders to elements by just setting the `border-width` - * property, we change the default border-style for all elements to `solid`, and - * use border-width to hide them instead. This way our `border` utilities only - * need to set the `border-width` property instead of the entire `border` - * shorthand, making our border utilities much more straightforward to compose. - * - * https://github.com/tailwindcss/tailwindcss/pull/116 - */ - -*, -*::before, -*::after { - border-width: 0; - border-style: solid; - border-color: #dae1e7; -} - -/** - * Undo the `border-style: none` reset that Normalize applies to images so that - * our `border-{width}` utilities have the expected effect. - * - * The Normalize reset is unnecessary for us since we default the border-width - * to 0 on all elements. - * - * https://github.com/tailwindcss/tailwindcss/issues/362 - */ - -img { - border-style: solid; -} - -textarea { - resize: vertical; -} - -img { - max-width: 100%; - height: auto; -} - -input::-webkit-input-placeholder, -textarea::-webkit-input-placeholder { - color: inherit; - opacity: .5; -} - -input::-moz-placeholder, -textarea::-moz-placeholder { - color: inherit; - opacity: .5; -} - -input:-ms-input-placeholder, -textarea:-ms-input-placeholder { - color: inherit; - opacity: .5; -} - -input::-ms-input-placeholder, -textarea::-ms-input-placeholder { - color: inherit; - opacity: .5; -} - -input::placeholder, -textarea::placeholder { - color: inherit; - opacity: .5; -} - -button, -[role="button"] { - cursor: pointer; -} - -table { - border-collapse: collapse; -} - -.container { - width: 100%; -} - -@media (min-width: 576px) { - .container { - max-width: 576px; - } -} - -@media (min-width: 768px) { - .container { - max-width: 768px; - } -} - -@media (min-width: 992px) { - .container { - max-width: 992px; - } -} - -@media (min-width: 1200px) { - .container { - max-width: 1200px; - } -} - -.list-reset { - list-style: none; - padding: 0; -} - -.appearance-none { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; -} - -.bg-fixed { - background-attachment: fixed; -} - -.bg-local { - background-attachment: local; -} - -.bg-scroll { - background-attachment: scroll; -} - -.bg-transparent { - background-color: transparent; -} - -.bg-black { - background-color: #22292f; -} - -.bg-grey-darkest { - background-color: #3d4852; -} - -.bg-grey-darker { - background-color: #606f7b; -} - -.bg-grey-dark { - background-color: #8795a1; -} - -.bg-grey { - background-color: #b8c2cc; -} - -.bg-grey-light { - background-color: #dae1e7; -} - -.bg-grey-lighter { - background-color: #f1f5f8; -} - -.bg-grey-lightest { - background-color: #f8fafc; -} - -.bg-white { - background-color: #fff; -} - -.bg-red-darkest { - background-color: #3b0d0c; -} - -.bg-red-darker { - background-color: #621b18; -} - -.bg-red-dark { - background-color: #cc1f1a; -} - -.bg-red { - background-color: #e3342f; -} - -.bg-red-light { - background-color: #ef5753; -} - -.bg-red-lighter { - background-color: #f9acaa; -} - -.bg-red-lightest { - background-color: #fcebea; -} - -.bg-orange-darkest { - background-color: #462a16; -} - -.bg-orange-darker { - background-color: #613b1f; -} - -.bg-orange-dark { - background-color: #de751f; -} - -.bg-orange { - background-color: #f6993f; -} - -.bg-orange-light { - background-color: #faad63; -} - -.bg-orange-lighter { - background-color: #fcd9b6; -} - -.bg-orange-lightest { - background-color: #fff5eb; -} - -.bg-yellow-darkest { - background-color: #453411; -} - -.bg-yellow-darker { - background-color: #684f1d; -} - -.bg-yellow-dark { - background-color: #f2d024; -} - -.bg-yellow { - background-color: #ffed4a; -} - -.bg-yellow-light { - background-color: #fff382; -} - -.bg-yellow-lighter { - background-color: #fff9c2; -} - -.bg-yellow-lightest { - background-color: #fcfbeb; -} - -.bg-green-darkest { - background-color: #0f2f21; -} - -.bg-green-darker { - background-color: #1a4731; -} - -.bg-green-dark { - background-color: #1f9d55; -} - -.bg-green { - background-color: #38c172; -} - -.bg-green-light { - background-color: #51d88a; -} - -.bg-green-lighter { - background-color: #a2f5bf; -} - -.bg-green-lightest { - background-color: #e3fcec; -} - -.bg-teal-darkest { - background-color: #0d3331; -} - -.bg-teal-darker { - background-color: #20504f; -} - -.bg-teal-dark { - background-color: #38a89d; -} - -.bg-teal { - background-color: #4dc0b5; -} - -.bg-teal-light { - background-color: #64d5ca; -} - -.bg-teal-lighter { - background-color: #a0f0ed; -} - -.bg-teal-lightest { - background-color: #e8fffe; -} - -.bg-blue-darkest { - background-color: #12283a; -} - -.bg-blue-darker { - background-color: #1c3d5a; -} - -.bg-blue-dark { - background-color: #2779bd; -} - -.bg-blue { - background-color: #3490dc; -} - -.bg-blue-light { - background-color: #6cb2eb; -} - -.bg-blue-lighter { - background-color: #bcdefa; -} - -.bg-blue-lightest { - background-color: #eff8ff; -} - -.bg-indigo-darkest { - background-color: #191e38; -} - -.bg-indigo-darker { - background-color: #2f365f; -} - -.bg-indigo-dark { - background-color: #5661b3; -} - -.bg-indigo { - background-color: #6574cd; -} - -.bg-indigo-light { - background-color: #7886d7; -} - -.bg-indigo-lighter { - background-color: #b2b7ff; -} - -.bg-indigo-lightest { - background-color: #e6e8ff; -} - -.bg-purple-darkest { - background-color: #21183c; -} - -.bg-purple-darker { - background-color: #382b5f; -} - -.bg-purple-dark { - background-color: #794acf; -} - -.bg-purple { - background-color: #9561e2; -} - -.bg-purple-light { - background-color: #a779e9; -} - -.bg-purple-lighter { - background-color: #d6bbfc; -} - -.bg-purple-lightest { - background-color: #f3ebff; -} - -.bg-pink-darkest { - background-color: #451225; -} - -.bg-pink-darker { - background-color: #6f213f; -} - -.bg-pink-dark { - background-color: #eb5286; -} - -.bg-pink { - background-color: #f66d9b; -} - -.bg-pink-light { - background-color: #fa7ea8; -} - -.bg-pink-lighter { - background-color: #ffbbca; -} - -.bg-pink-lightest { - background-color: #ffebef; -} - -.hover\:bg-transparent:hover { - background-color: transparent; -} - -.hover\:bg-black:hover { - background-color: #22292f; -} - -.hover\:bg-grey-darkest:hover { - background-color: #3d4852; -} - -.hover\:bg-grey-darker:hover { - background-color: #606f7b; -} - -.hover\:bg-grey-dark:hover { - background-color: #8795a1; -} - -.hover\:bg-grey:hover { - background-color: #b8c2cc; -} - -.hover\:bg-grey-light:hover { - background-color: #dae1e7; -} - -.hover\:bg-grey-lighter:hover { - background-color: #f1f5f8; -} - -.hover\:bg-grey-lightest:hover { - background-color: #f8fafc; -} - -.hover\:bg-white:hover { - background-color: #fff; -} - -.hover\:bg-red-darkest:hover { - background-color: #3b0d0c; -} - -.hover\:bg-red-darker:hover { - background-color: #621b18; -} - -.hover\:bg-red-dark:hover { - background-color: #cc1f1a; -} - -.hover\:bg-red:hover { - background-color: #e3342f; -} - -.hover\:bg-red-light:hover { - background-color: #ef5753; -} - -.hover\:bg-red-lighter:hover { - background-color: #f9acaa; -} - -.hover\:bg-red-lightest:hover { - background-color: #fcebea; -} - -.hover\:bg-orange-darkest:hover { - background-color: #462a16; -} - -.hover\:bg-orange-darker:hover { - background-color: #613b1f; -} - -.hover\:bg-orange-dark:hover { - background-color: #de751f; -} - -.hover\:bg-orange:hover { - background-color: #f6993f; -} - -.hover\:bg-orange-light:hover { - background-color: #faad63; -} - -.hover\:bg-orange-lighter:hover { - background-color: #fcd9b6; -} - -.hover\:bg-orange-lightest:hover { - background-color: #fff5eb; -} - -.hover\:bg-yellow-darkest:hover { - background-color: #453411; -} - -.hover\:bg-yellow-darker:hover { - background-color: #684f1d; -} - -.hover\:bg-yellow-dark:hover { - background-color: #f2d024; -} - -.hover\:bg-yellow:hover { - background-color: #ffed4a; -} - -.hover\:bg-yellow-light:hover { - background-color: #fff382; -} - -.hover\:bg-yellow-lighter:hover { - background-color: #fff9c2; -} - -.hover\:bg-yellow-lightest:hover { - background-color: #fcfbeb; -} - -.hover\:bg-green-darkest:hover { - background-color: #0f2f21; -} - -.hover\:bg-green-darker:hover { - background-color: #1a4731; -} - -.hover\:bg-green-dark:hover { - background-color: #1f9d55; -} - -.hover\:bg-green:hover { - background-color: #38c172; -} - -.hover\:bg-green-light:hover { - background-color: #51d88a; -} - -.hover\:bg-green-lighter:hover { - background-color: #a2f5bf; -} - -.hover\:bg-green-lightest:hover { - background-color: #e3fcec; -} - -.hover\:bg-teal-darkest:hover { - background-color: #0d3331; -} - -.hover\:bg-teal-darker:hover { - background-color: #20504f; -} - -.hover\:bg-teal-dark:hover { - background-color: #38a89d; -} - -.hover\:bg-teal:hover { - background-color: #4dc0b5; -} - -.hover\:bg-teal-light:hover { - background-color: #64d5ca; -} - -.hover\:bg-teal-lighter:hover { - background-color: #a0f0ed; -} - -.hover\:bg-teal-lightest:hover { - background-color: #e8fffe; -} - -.hover\:bg-blue-darkest:hover { - background-color: #12283a; -} - -.hover\:bg-blue-darker:hover { - background-color: #1c3d5a; -} - -.hover\:bg-blue-dark:hover { - background-color: #2779bd; -} - -.hover\:bg-blue:hover { - background-color: #3490dc; -} - -.hover\:bg-blue-light:hover { - background-color: #6cb2eb; -} - -.hover\:bg-blue-lighter:hover { - background-color: #bcdefa; -} - -.hover\:bg-blue-lightest:hover { - background-color: #eff8ff; -} - -.hover\:bg-indigo-darkest:hover { - background-color: #191e38; -} - -.hover\:bg-indigo-darker:hover { - background-color: #2f365f; -} - -.hover\:bg-indigo-dark:hover { - background-color: #5661b3; -} - -.hover\:bg-indigo:hover { - background-color: #6574cd; -} - -.hover\:bg-indigo-light:hover { - background-color: #7886d7; -} - -.hover\:bg-indigo-lighter:hover { - background-color: #b2b7ff; -} - -.hover\:bg-indigo-lightest:hover { - background-color: #e6e8ff; -} - -.hover\:bg-purple-darkest:hover { - background-color: #21183c; -} - -.hover\:bg-purple-darker:hover { - background-color: #382b5f; -} - -.hover\:bg-purple-dark:hover { - background-color: #794acf; -} - -.hover\:bg-purple:hover { - background-color: #9561e2; -} - -.hover\:bg-purple-light:hover { - background-color: #a779e9; -} - -.hover\:bg-purple-lighter:hover { - background-color: #d6bbfc; -} - -.hover\:bg-purple-lightest:hover { - background-color: #f3ebff; -} - -.hover\:bg-pink-darkest:hover { - background-color: #451225; -} - -.hover\:bg-pink-darker:hover { - background-color: #6f213f; -} - -.hover\:bg-pink-dark:hover { - background-color: #eb5286; -} - -.hover\:bg-pink:hover { - background-color: #f66d9b; -} - -.hover\:bg-pink-light:hover { - background-color: #fa7ea8; -} - -.hover\:bg-pink-lighter:hover { - background-color: #ffbbca; -} - -.hover\:bg-pink-lightest:hover { - background-color: #ffebef; -} - -.focus\:bg-transparent:focus { - background-color: transparent; -} - -.focus\:bg-black:focus { - background-color: #22292f; -} - -.focus\:bg-grey-darkest:focus { - background-color: #3d4852; -} - -.focus\:bg-grey-darker:focus { - background-color: #606f7b; -} - -.focus\:bg-grey-dark:focus { - background-color: #8795a1; -} - -.focus\:bg-grey:focus { - background-color: #b8c2cc; -} - -.focus\:bg-grey-light:focus { - background-color: #dae1e7; -} - -.focus\:bg-grey-lighter:focus { - background-color: #f1f5f8; -} - -.focus\:bg-grey-lightest:focus { - background-color: #f8fafc; -} - -.focus\:bg-white:focus { - background-color: #fff; -} - -.focus\:bg-red-darkest:focus { - background-color: #3b0d0c; -} - -.focus\:bg-red-darker:focus { - background-color: #621b18; -} - -.focus\:bg-red-dark:focus { - background-color: #cc1f1a; -} - -.focus\:bg-red:focus { - background-color: #e3342f; -} - -.focus\:bg-red-light:focus { - background-color: #ef5753; -} - -.focus\:bg-red-lighter:focus { - background-color: #f9acaa; -} - -.focus\:bg-red-lightest:focus { - background-color: #fcebea; -} - -.focus\:bg-orange-darkest:focus { - background-color: #462a16; -} - -.focus\:bg-orange-darker:focus { - background-color: #613b1f; -} - -.focus\:bg-orange-dark:focus { - background-color: #de751f; -} - -.focus\:bg-orange:focus { - background-color: #f6993f; -} - -.focus\:bg-orange-light:focus { - background-color: #faad63; -} - -.focus\:bg-orange-lighter:focus { - background-color: #fcd9b6; -} - -.focus\:bg-orange-lightest:focus { - background-color: #fff5eb; -} - -.focus\:bg-yellow-darkest:focus { - background-color: #453411; -} - -.focus\:bg-yellow-darker:focus { - background-color: #684f1d; -} - -.focus\:bg-yellow-dark:focus { - background-color: #f2d024; -} - -.focus\:bg-yellow:focus { - background-color: #ffed4a; -} - -.focus\:bg-yellow-light:focus { - background-color: #fff382; -} - -.focus\:bg-yellow-lighter:focus { - background-color: #fff9c2; -} - -.focus\:bg-yellow-lightest:focus { - background-color: #fcfbeb; -} - -.focus\:bg-green-darkest:focus { - background-color: #0f2f21; -} - -.focus\:bg-green-darker:focus { - background-color: #1a4731; -} - -.focus\:bg-green-dark:focus { - background-color: #1f9d55; -} - -.focus\:bg-green:focus { - background-color: #38c172; -} - -.focus\:bg-green-light:focus { - background-color: #51d88a; -} - -.focus\:bg-green-lighter:focus { - background-color: #a2f5bf; -} - -.focus\:bg-green-lightest:focus { - background-color: #e3fcec; -} - -.focus\:bg-teal-darkest:focus { - background-color: #0d3331; -} - -.focus\:bg-teal-darker:focus { - background-color: #20504f; -} - -.focus\:bg-teal-dark:focus { - background-color: #38a89d; -} - -.focus\:bg-teal:focus { - background-color: #4dc0b5; -} - -.focus\:bg-teal-light:focus { - background-color: #64d5ca; -} - -.focus\:bg-teal-lighter:focus { - background-color: #a0f0ed; -} - -.focus\:bg-teal-lightest:focus { - background-color: #e8fffe; -} - -.focus\:bg-blue-darkest:focus { - background-color: #12283a; -} - -.focus\:bg-blue-darker:focus { - background-color: #1c3d5a; -} - -.focus\:bg-blue-dark:focus { - background-color: #2779bd; -} - -.focus\:bg-blue:focus { - background-color: #3490dc; -} - -.focus\:bg-blue-light:focus { - background-color: #6cb2eb; -} - -.focus\:bg-blue-lighter:focus { - background-color: #bcdefa; -} - -.focus\:bg-blue-lightest:focus { - background-color: #eff8ff; -} - -.focus\:bg-indigo-darkest:focus { - background-color: #191e38; -} - -.focus\:bg-indigo-darker:focus { - background-color: #2f365f; -} - -.focus\:bg-indigo-dark:focus { - background-color: #5661b3; -} - -.focus\:bg-indigo:focus { - background-color: #6574cd; -} - -.focus\:bg-indigo-light:focus { - background-color: #7886d7; -} - -.focus\:bg-indigo-lighter:focus { - background-color: #b2b7ff; -} - -.focus\:bg-indigo-lightest:focus { - background-color: #e6e8ff; -} - -.focus\:bg-purple-darkest:focus { - background-color: #21183c; -} - -.focus\:bg-purple-darker:focus { - background-color: #382b5f; -} - -.focus\:bg-purple-dark:focus { - background-color: #794acf; -} - -.focus\:bg-purple:focus { - background-color: #9561e2; -} - -.focus\:bg-purple-light:focus { - background-color: #a779e9; -} - -.focus\:bg-purple-lighter:focus { - background-color: #d6bbfc; -} - -.focus\:bg-purple-lightest:focus { - background-color: #f3ebff; -} - -.focus\:bg-pink-darkest:focus { - background-color: #451225; -} - -.focus\:bg-pink-darker:focus { - background-color: #6f213f; -} - -.focus\:bg-pink-dark:focus { - background-color: #eb5286; -} - -.focus\:bg-pink:focus { - background-color: #f66d9b; -} - -.focus\:bg-pink-light:focus { - background-color: #fa7ea8; -} - -.focus\:bg-pink-lighter:focus { - background-color: #ffbbca; -} - -.focus\:bg-pink-lightest:focus { - background-color: #ffebef; -} - -.bg-bottom { - background-position: bottom; -} - -.bg-center { - background-position: center; -} - -.bg-left { - background-position: left; -} - -.bg-left-bottom { - background-position: left bottom; -} - -.bg-left-top { - background-position: left top; -} - -.bg-right { - background-position: right; -} - -.bg-right-bottom { - background-position: right bottom; -} - -.bg-right-top { - background-position: right top; -} - -.bg-top { - background-position: top; -} - -.bg-repeat { - background-repeat: repeat; -} - -.bg-no-repeat { - background-repeat: no-repeat; -} - -.bg-repeat-x { - background-repeat: repeat-x; -} - -.bg-repeat-y { - background-repeat: repeat-y; -} - -.bg-auto { - background-size: auto; -} - -.bg-cover { - background-size: cover; -} - -.bg-contain { - background-size: contain; -} - -.border-collapse { - border-collapse: collapse; -} - -.border-separate { - border-collapse: separate; -} - -.border-transparent { - border-color: transparent; -} - -.border-black { - border-color: #22292f; -} - -.border-grey-darkest { - border-color: #3d4852; -} - -.border-grey-darker { - border-color: #606f7b; -} - -.border-grey-dark { - border-color: #8795a1; -} - -.border-grey { - border-color: #b8c2cc; -} - -.border-grey-light { - border-color: #dae1e7; -} - -.border-grey-lighter { - border-color: #f1f5f8; -} - -.border-grey-lightest { - border-color: #f8fafc; -} - -.border-white { - border-color: #fff; -} - -.border-red-darkest { - border-color: #3b0d0c; -} - -.border-red-darker { - border-color: #621b18; -} - -.border-red-dark { - border-color: #cc1f1a; -} - -.border-red { - border-color: #e3342f; -} - -.border-red-light { - border-color: #ef5753; -} - -.border-red-lighter { - border-color: #f9acaa; -} - -.border-red-lightest { - border-color: #fcebea; -} - -.border-orange-darkest { - border-color: #462a16; -} - -.border-orange-darker { - border-color: #613b1f; -} - -.border-orange-dark { - border-color: #de751f; -} - -.border-orange { - border-color: #f6993f; -} - -.border-orange-light { - border-color: #faad63; -} - -.border-orange-lighter { - border-color: #fcd9b6; -} - -.border-orange-lightest { - border-color: #fff5eb; -} - -.border-yellow-darkest { - border-color: #453411; -} - -.border-yellow-darker { - border-color: #684f1d; -} - -.border-yellow-dark { - border-color: #f2d024; -} - -.border-yellow { - border-color: #ffed4a; -} - -.border-yellow-light { - border-color: #fff382; -} - -.border-yellow-lighter { - border-color: #fff9c2; -} - -.border-yellow-lightest { - border-color: #fcfbeb; -} - -.border-green-darkest { - border-color: #0f2f21; -} - -.border-green-darker { - border-color: #1a4731; -} - -.border-green-dark { - border-color: #1f9d55; -} - -.border-green { - border-color: #38c172; -} - -.border-green-light { - border-color: #51d88a; -} - -.border-green-lighter { - border-color: #a2f5bf; -} - -.border-green-lightest { - border-color: #e3fcec; -} - -.border-teal-darkest { - border-color: #0d3331; -} - -.border-teal-darker { - border-color: #20504f; -} - -.border-teal-dark { - border-color: #38a89d; -} - -.border-teal { - border-color: #4dc0b5; -} - -.border-teal-light { - border-color: #64d5ca; -} - -.border-teal-lighter { - border-color: #a0f0ed; -} - -.border-teal-lightest { - border-color: #e8fffe; -} - -.border-blue-darkest { - border-color: #12283a; -} - -.border-blue-darker { - border-color: #1c3d5a; -} - -.border-blue-dark { - border-color: #2779bd; -} - -.border-blue { - border-color: #3490dc; -} - -.border-blue-light { - border-color: #6cb2eb; -} - -.border-blue-lighter { - border-color: #bcdefa; -} - -.border-blue-lightest { - border-color: #eff8ff; -} - -.border-indigo-darkest { - border-color: #191e38; -} - -.border-indigo-darker { - border-color: #2f365f; -} - -.border-indigo-dark { - border-color: #5661b3; -} - -.border-indigo { - border-color: #6574cd; -} - -.border-indigo-light { - border-color: #7886d7; -} - -.border-indigo-lighter { - border-color: #b2b7ff; -} - -.border-indigo-lightest { - border-color: #e6e8ff; -} - -.border-purple-darkest { - border-color: #21183c; -} - -.border-purple-darker { - border-color: #382b5f; -} - -.border-purple-dark { - border-color: #794acf; -} - -.border-purple { - border-color: #9561e2; -} - -.border-purple-light { - border-color: #a779e9; -} - -.border-purple-lighter { - border-color: #d6bbfc; -} - -.border-purple-lightest { - border-color: #f3ebff; -} - -.border-pink-darkest { - border-color: #451225; -} - -.border-pink-darker { - border-color: #6f213f; -} - -.border-pink-dark { - border-color: #eb5286; -} - -.border-pink { - border-color: #f66d9b; -} - -.border-pink-light { - border-color: #fa7ea8; -} - -.border-pink-lighter { - border-color: #ffbbca; -} - -.border-pink-lightest { - border-color: #ffebef; -} - -.hover\:border-transparent:hover { - border-color: transparent; -} - -.hover\:border-black:hover { - border-color: #22292f; -} - -.hover\:border-grey-darkest:hover { - border-color: #3d4852; -} - -.hover\:border-grey-darker:hover { - border-color: #606f7b; -} - -.hover\:border-grey-dark:hover { - border-color: #8795a1; -} - -.hover\:border-grey:hover { - border-color: #b8c2cc; -} - -.hover\:border-grey-light:hover { - border-color: #dae1e7; -} - -.hover\:border-grey-lighter:hover { - border-color: #f1f5f8; -} - -.hover\:border-grey-lightest:hover { - border-color: #f8fafc; -} - -.hover\:border-white:hover { - border-color: #fff; -} - -.hover\:border-red-darkest:hover { - border-color: #3b0d0c; -} - -.hover\:border-red-darker:hover { - border-color: #621b18; -} - -.hover\:border-red-dark:hover { - border-color: #cc1f1a; -} - -.hover\:border-red:hover { - border-color: #e3342f; -} - -.hover\:border-red-light:hover { - border-color: #ef5753; -} - -.hover\:border-red-lighter:hover { - border-color: #f9acaa; -} - -.hover\:border-red-lightest:hover { - border-color: #fcebea; -} - -.hover\:border-orange-darkest:hover { - border-color: #462a16; -} - -.hover\:border-orange-darker:hover { - border-color: #613b1f; -} - -.hover\:border-orange-dark:hover { - border-color: #de751f; -} - -.hover\:border-orange:hover { - border-color: #f6993f; -} - -.hover\:border-orange-light:hover { - border-color: #faad63; -} - -.hover\:border-orange-lighter:hover { - border-color: #fcd9b6; -} - -.hover\:border-orange-lightest:hover { - border-color: #fff5eb; -} - -.hover\:border-yellow-darkest:hover { - border-color: #453411; -} - -.hover\:border-yellow-darker:hover { - border-color: #684f1d; -} - -.hover\:border-yellow-dark:hover { - border-color: #f2d024; -} - -.hover\:border-yellow:hover { - border-color: #ffed4a; -} - -.hover\:border-yellow-light:hover { - border-color: #fff382; -} - -.hover\:border-yellow-lighter:hover { - border-color: #fff9c2; -} - -.hover\:border-yellow-lightest:hover { - border-color: #fcfbeb; -} - -.hover\:border-green-darkest:hover { - border-color: #0f2f21; -} - -.hover\:border-green-darker:hover { - border-color: #1a4731; -} - -.hover\:border-green-dark:hover { - border-color: #1f9d55; -} - -.hover\:border-green:hover { - border-color: #38c172; -} - -.hover\:border-green-light:hover { - border-color: #51d88a; -} - -.hover\:border-green-lighter:hover { - border-color: #a2f5bf; -} - -.hover\:border-green-lightest:hover { - border-color: #e3fcec; -} - -.hover\:border-teal-darkest:hover { - border-color: #0d3331; -} - -.hover\:border-teal-darker:hover { - border-color: #20504f; -} - -.hover\:border-teal-dark:hover { - border-color: #38a89d; -} - -.hover\:border-teal:hover { - border-color: #4dc0b5; -} - -.hover\:border-teal-light:hover { - border-color: #64d5ca; -} - -.hover\:border-teal-lighter:hover { - border-color: #a0f0ed; -} - -.hover\:border-teal-lightest:hover { - border-color: #e8fffe; -} - -.hover\:border-blue-darkest:hover { - border-color: #12283a; -} - -.hover\:border-blue-darker:hover { - border-color: #1c3d5a; -} - -.hover\:border-blue-dark:hover { - border-color: #2779bd; -} - -.hover\:border-blue:hover { - border-color: #3490dc; -} - -.hover\:border-blue-light:hover { - border-color: #6cb2eb; -} - -.hover\:border-blue-lighter:hover { - border-color: #bcdefa; -} - -.hover\:border-blue-lightest:hover { - border-color: #eff8ff; -} - -.hover\:border-indigo-darkest:hover { - border-color: #191e38; -} - -.hover\:border-indigo-darker:hover { - border-color: #2f365f; -} - -.hover\:border-indigo-dark:hover { - border-color: #5661b3; -} - -.hover\:border-indigo:hover { - border-color: #6574cd; -} - -.hover\:border-indigo-light:hover { - border-color: #7886d7; -} - -.hover\:border-indigo-lighter:hover { - border-color: #b2b7ff; -} - -.hover\:border-indigo-lightest:hover { - border-color: #e6e8ff; -} - -.hover\:border-purple-darkest:hover { - border-color: #21183c; -} - -.hover\:border-purple-darker:hover { - border-color: #382b5f; -} - -.hover\:border-purple-dark:hover { - border-color: #794acf; -} - -.hover\:border-purple:hover { - border-color: #9561e2; -} - -.hover\:border-purple-light:hover { - border-color: #a779e9; -} - -.hover\:border-purple-lighter:hover { - border-color: #d6bbfc; -} - -.hover\:border-purple-lightest:hover { - border-color: #f3ebff; -} - -.hover\:border-pink-darkest:hover { - border-color: #451225; -} - -.hover\:border-pink-darker:hover { - border-color: #6f213f; -} - -.hover\:border-pink-dark:hover { - border-color: #eb5286; -} - -.hover\:border-pink:hover { - border-color: #f66d9b; -} - -.hover\:border-pink-light:hover { - border-color: #fa7ea8; -} - -.hover\:border-pink-lighter:hover { - border-color: #ffbbca; -} - -.hover\:border-pink-lightest:hover { - border-color: #ffebef; -} - -.focus\:border-transparent:focus { - border-color: transparent; -} - -.focus\:border-black:focus { - border-color: #22292f; -} - -.focus\:border-grey-darkest:focus { - border-color: #3d4852; -} - -.focus\:border-grey-darker:focus { - border-color: #606f7b; -} - -.focus\:border-grey-dark:focus { - border-color: #8795a1; -} - -.focus\:border-grey:focus { - border-color: #b8c2cc; -} - -.focus\:border-grey-light:focus { - border-color: #dae1e7; -} - -.focus\:border-grey-lighter:focus { - border-color: #f1f5f8; -} - -.focus\:border-grey-lightest:focus { - border-color: #f8fafc; -} - -.focus\:border-white:focus { - border-color: #fff; -} - -.focus\:border-red-darkest:focus { - border-color: #3b0d0c; -} - -.focus\:border-red-darker:focus { - border-color: #621b18; -} - -.focus\:border-red-dark:focus { - border-color: #cc1f1a; -} - -.focus\:border-red:focus { - border-color: #e3342f; -} - -.focus\:border-red-light:focus { - border-color: #ef5753; -} - -.focus\:border-red-lighter:focus { - border-color: #f9acaa; -} - -.focus\:border-red-lightest:focus { - border-color: #fcebea; -} - -.focus\:border-orange-darkest:focus { - border-color: #462a16; -} - -.focus\:border-orange-darker:focus { - border-color: #613b1f; -} - -.focus\:border-orange-dark:focus { - border-color: #de751f; -} - -.focus\:border-orange:focus { - border-color: #f6993f; -} - -.focus\:border-orange-light:focus { - border-color: #faad63; -} - -.focus\:border-orange-lighter:focus { - border-color: #fcd9b6; -} - -.focus\:border-orange-lightest:focus { - border-color: #fff5eb; -} - -.focus\:border-yellow-darkest:focus { - border-color: #453411; -} - -.focus\:border-yellow-darker:focus { - border-color: #684f1d; -} - -.focus\:border-yellow-dark:focus { - border-color: #f2d024; -} - -.focus\:border-yellow:focus { - border-color: #ffed4a; -} - -.focus\:border-yellow-light:focus { - border-color: #fff382; -} - -.focus\:border-yellow-lighter:focus { - border-color: #fff9c2; -} - -.focus\:border-yellow-lightest:focus { - border-color: #fcfbeb; -} - -.focus\:border-green-darkest:focus { - border-color: #0f2f21; -} - -.focus\:border-green-darker:focus { - border-color: #1a4731; -} - -.focus\:border-green-dark:focus { - border-color: #1f9d55; -} - -.focus\:border-green:focus { - border-color: #38c172; -} - -.focus\:border-green-light:focus { - border-color: #51d88a; -} - -.focus\:border-green-lighter:focus { - border-color: #a2f5bf; -} - -.focus\:border-green-lightest:focus { - border-color: #e3fcec; -} - -.focus\:border-teal-darkest:focus { - border-color: #0d3331; -} - -.focus\:border-teal-darker:focus { - border-color: #20504f; -} - -.focus\:border-teal-dark:focus { - border-color: #38a89d; -} - -.focus\:border-teal:focus { - border-color: #4dc0b5; -} - -.focus\:border-teal-light:focus { - border-color: #64d5ca; -} - -.focus\:border-teal-lighter:focus { - border-color: #a0f0ed; -} - -.focus\:border-teal-lightest:focus { - border-color: #e8fffe; -} - -.focus\:border-blue-darkest:focus { - border-color: #12283a; -} - -.focus\:border-blue-darker:focus { - border-color: #1c3d5a; -} - -.focus\:border-blue-dark:focus { - border-color: #2779bd; -} - -.focus\:border-blue:focus { - border-color: #3490dc; -} - -.focus\:border-blue-light:focus { - border-color: #6cb2eb; -} - -.focus\:border-blue-lighter:focus { - border-color: #bcdefa; -} - -.focus\:border-blue-lightest:focus { - border-color: #eff8ff; -} - -.focus\:border-indigo-darkest:focus { - border-color: #191e38; -} - -.focus\:border-indigo-darker:focus { - border-color: #2f365f; -} - -.focus\:border-indigo-dark:focus { - border-color: #5661b3; -} - -.focus\:border-indigo:focus { - border-color: #6574cd; -} - -.focus\:border-indigo-light:focus { - border-color: #7886d7; -} - -.focus\:border-indigo-lighter:focus { - border-color: #b2b7ff; -} - -.focus\:border-indigo-lightest:focus { - border-color: #e6e8ff; -} - -.focus\:border-purple-darkest:focus { - border-color: #21183c; -} - -.focus\:border-purple-darker:focus { - border-color: #382b5f; -} - -.focus\:border-purple-dark:focus { - border-color: #794acf; -} - -.focus\:border-purple:focus { - border-color: #9561e2; -} - -.focus\:border-purple-light:focus { - border-color: #a779e9; -} - -.focus\:border-purple-lighter:focus { - border-color: #d6bbfc; -} - -.focus\:border-purple-lightest:focus { - border-color: #f3ebff; -} - -.focus\:border-pink-darkest:focus { - border-color: #451225; -} - -.focus\:border-pink-darker:focus { - border-color: #6f213f; -} - -.focus\:border-pink-dark:focus { - border-color: #eb5286; -} - -.focus\:border-pink:focus { - border-color: #f66d9b; -} - -.focus\:border-pink-light:focus { - border-color: #fa7ea8; -} - -.focus\:border-pink-lighter:focus { - border-color: #ffbbca; -} - -.focus\:border-pink-lightest:focus { - border-color: #ffebef; -} - -.rounded-none { - border-radius: 0; -} - -.rounded-sm { - border-radius: .125rem; -} - -.rounded { - border-radius: .25rem; -} - -.rounded-lg { - border-radius: .5rem; -} - -.rounded-full { - border-radius: 9999px; -} - -.rounded-t-none { - border-top-left-radius: 0; - border-top-right-radius: 0; -} - -.rounded-r-none { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -.rounded-b-none { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; -} - -.rounded-l-none { - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -.rounded-t-sm { - border-top-left-radius: .125rem; - border-top-right-radius: .125rem; -} - -.rounded-r-sm { - border-top-right-radius: .125rem; - border-bottom-right-radius: .125rem; -} - -.rounded-b-sm { - border-bottom-right-radius: .125rem; - border-bottom-left-radius: .125rem; -} - -.rounded-l-sm { - border-top-left-radius: .125rem; - border-bottom-left-radius: .125rem; -} - -.rounded-t { - border-top-left-radius: .25rem; - border-top-right-radius: .25rem; -} - -.rounded-r { - border-top-right-radius: .25rem; - border-bottom-right-radius: .25rem; -} - -.rounded-b { - border-bottom-right-radius: .25rem; - border-bottom-left-radius: .25rem; -} - -.rounded-l { - border-top-left-radius: .25rem; - border-bottom-left-radius: .25rem; -} - -.rounded-t-lg { - border-top-left-radius: .5rem; - border-top-right-radius: .5rem; -} - -.rounded-r-lg { - border-top-right-radius: .5rem; - border-bottom-right-radius: .5rem; -} - -.rounded-b-lg { - border-bottom-right-radius: .5rem; - border-bottom-left-radius: .5rem; -} - -.rounded-l-lg { - border-top-left-radius: .5rem; - border-bottom-left-radius: .5rem; -} - -.rounded-t-full { - border-top-left-radius: 9999px; - border-top-right-radius: 9999px; -} - -.rounded-r-full { - border-top-right-radius: 9999px; - border-bottom-right-radius: 9999px; -} - -.rounded-b-full { - border-bottom-right-radius: 9999px; - border-bottom-left-radius: 9999px; -} - -.rounded-l-full { - border-top-left-radius: 9999px; - border-bottom-left-radius: 9999px; -} - -.rounded-tl-none { - border-top-left-radius: 0; -} - -.rounded-tr-none { - border-top-right-radius: 0; -} - -.rounded-br-none { - border-bottom-right-radius: 0; -} - -.rounded-bl-none { - border-bottom-left-radius: 0; -} - -.rounded-tl-sm { - border-top-left-radius: .125rem; -} - -.rounded-tr-sm { - border-top-right-radius: .125rem; -} - -.rounded-br-sm { - border-bottom-right-radius: .125rem; -} - -.rounded-bl-sm { - border-bottom-left-radius: .125rem; -} - -.rounded-tl { - border-top-left-radius: .25rem; -} - -.rounded-tr { - border-top-right-radius: .25rem; -} - -.rounded-br { - border-bottom-right-radius: .25rem; -} - -.rounded-bl { - border-bottom-left-radius: .25rem; -} - -.rounded-tl-lg { - border-top-left-radius: .5rem; -} - -.rounded-tr-lg { - border-top-right-radius: .5rem; -} - -.rounded-br-lg { - border-bottom-right-radius: .5rem; -} - -.rounded-bl-lg { - border-bottom-left-radius: .5rem; -} - -.rounded-tl-full { - border-top-left-radius: 9999px; -} - -.rounded-tr-full { - border-top-right-radius: 9999px; -} - -.rounded-br-full { - border-bottom-right-radius: 9999px; -} - -.rounded-bl-full { - border-bottom-left-radius: 9999px; -} - -.border-solid { - border-style: solid; -} - -.border-dashed { - border-style: dashed; -} - -.border-dotted { - border-style: dotted; -} - -.border-none { - border-style: none; -} - -.border-0 { - border-width: 0; -} - -.border-2 { - border-width: 2px; -} - -.border-4 { - border-width: 4px; -} - -.border-8 { - border-width: 8px; -} - -.border { - border-width: 1px; -} - -.border-t-0 { - border-top-width: 0; -} - -.border-r-0 { - border-right-width: 0; -} - -.border-b-0 { - border-bottom-width: 0; -} - -.border-l-0 { - border-left-width: 0; -} - -.border-t-2 { - border-top-width: 2px; -} - -.border-r-2 { - border-right-width: 2px; -} - -.border-b-2 { - border-bottom-width: 2px; -} - -.border-l-2 { - border-left-width: 2px; -} - -.border-t-4 { - border-top-width: 4px; -} - -.border-r-4 { - border-right-width: 4px; -} - -.border-b-4 { - border-bottom-width: 4px; -} - -.border-l-4 { - border-left-width: 4px; -} - -.border-t-8 { - border-top-width: 8px; -} - -.border-r-8 { - border-right-width: 8px; -} - -.border-b-8 { - border-bottom-width: 8px; -} - -.border-l-8 { - border-left-width: 8px; -} - -.border-t { - border-top-width: 1px; -} - -.border-r { - border-right-width: 1px; -} - -.border-b { - border-bottom-width: 1px; -} - -.border-l { - border-left-width: 1px; -} - -.cursor-auto { - cursor: auto; -} - -.cursor-default { - cursor: default; -} - -.cursor-pointer { - cursor: pointer; -} - -.cursor-wait { - cursor: wait; -} - -.cursor-move { - cursor: move; -} - -.cursor-not-allowed { - cursor: not-allowed; -} - -.block { - display: block; -} - -.inline-block { - display: inline-block; -} - -.inline { - display: inline; -} - -.table { - display: table; -} - -.table-row { - display: table-row; -} - -.table-cell { - display: table-cell; -} - -.hidden { - display: none; -} - -.flex { - display: flex; -} - -.inline-flex { - display: inline-flex; -} - -.flex-row { - flex-direction: row; -} - -.flex-row-reverse { - flex-direction: row-reverse; -} - -.flex-col { - flex-direction: column; -} - -.flex-col-reverse { - flex-direction: column-reverse; -} - -.flex-wrap { - flex-wrap: wrap; -} - -.flex-wrap-reverse { - flex-wrap: wrap-reverse; -} - -.flex-no-wrap { - flex-wrap: nowrap; -} - -.items-start { - align-items: flex-start; -} - -.items-end { - align-items: flex-end; -} - -.items-center { - align-items: center; -} - -.items-baseline { - align-items: baseline; -} - -.items-stretch { - align-items: stretch; -} - -.self-auto { - align-self: auto; -} - -.self-start { - align-self: flex-start; -} - -.self-end { - align-self: flex-end; -} - -.self-center { - align-self: center; -} - -.self-stretch { - align-self: stretch; -} - -.justify-start { - justify-content: flex-start; -} - -.justify-end { - justify-content: flex-end; -} - -.justify-center { - justify-content: center; -} - -.justify-between { - justify-content: space-between; -} - -.justify-around { - justify-content: space-around; -} - -.content-center { - align-content: center; -} - -.content-start { - align-content: flex-start; -} - -.content-end { - align-content: flex-end; -} - -.content-between { - align-content: space-between; -} - -.content-around { - align-content: space-around; -} - -.flex-1 { - flex: 1 1 0%; -} - -.flex-auto { - flex: 1 1 auto; -} - -.flex-initial { - flex: 0 1 auto; -} - -.flex-none { - flex: none; -} - -.flex-grow { - flex-grow: 1; -} - -.flex-shrink { - flex-shrink: 1; -} - -.flex-no-grow { - flex-grow: 0; -} - -.flex-no-shrink { - flex-shrink: 0; -} - -.float-right { - float: right; -} - -.float-left { - float: left; -} - -.float-none { - float: none; -} - -.clearfix:after { - content: ""; - display: table; - clear: both; -} - -.font-sans { - font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; -} - -.font-serif { - font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; -} - -.font-mono { - font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; -} - -.font-hairline { - font-weight: 100; -} - -.font-thin { - font-weight: 200; -} - -.font-light { - font-weight: 300; -} - -.font-normal { - font-weight: 400; -} - -.font-medium { - font-weight: 500; -} - -.font-semibold { - font-weight: 600; -} - -.font-bold { - font-weight: 700; -} - -.font-extrabold { - font-weight: 800; -} - -.font-black { - font-weight: 900; -} - -.hover\:font-hairline:hover { - font-weight: 100; -} - -.hover\:font-thin:hover { - font-weight: 200; -} - -.hover\:font-light:hover { - font-weight: 300; -} - -.hover\:font-normal:hover { - font-weight: 400; -} - -.hover\:font-medium:hover { - font-weight: 500; -} - -.hover\:font-semibold:hover { - font-weight: 600; -} - -.hover\:font-bold:hover { - font-weight: 700; -} - -.hover\:font-extrabold:hover { - font-weight: 800; -} - -.hover\:font-black:hover { - font-weight: 900; -} - -.focus\:font-hairline:focus { - font-weight: 100; -} - -.focus\:font-thin:focus { - font-weight: 200; -} - -.focus\:font-light:focus { - font-weight: 300; -} - -.focus\:font-normal:focus { - font-weight: 400; -} - -.focus\:font-medium:focus { - font-weight: 500; -} - -.focus\:font-semibold:focus { - font-weight: 600; -} - -.focus\:font-bold:focus { - font-weight: 700; -} - -.focus\:font-extrabold:focus { - font-weight: 800; -} - -.focus\:font-black:focus { - font-weight: 900; -} - -.h-1 { - height: .25rem; -} - -.h-2 { - height: .5rem; -} - -.h-3 { - height: .75rem; -} - -.h-4 { - height: 1rem; -} - -.h-5 { - height: 1.25rem; -} - -.h-6 { - height: 1.5rem; -} - -.h-8 { - height: 2rem; -} - -.h-10 { - height: 2.5rem; -} - -.h-12 { - height: 3rem; -} - -.h-16 { - height: 4rem; -} - -.h-24 { - height: 6rem; -} - -.h-32 { - height: 8rem; -} - -.h-48 { - height: 12rem; -} - -.h-64 { - height: 16rem; -} - -.h-auto { - height: auto; -} - -.h-px { - height: 1px; -} - -.h-full { - height: 100%; -} - -.h-screen { - height: 100vh; -} - -.leading-none { - line-height: 1; -} - -.leading-tight { - line-height: 1.25; -} - -.leading-normal { - line-height: 1.5; -} - -.leading-loose { - line-height: 2; -} - -.m-0 { - margin: 0; -} - -.m-1 { - margin: .25rem; -} - -.m-2 { - margin: .5rem; -} - -.m-3 { - margin: .75rem; -} - -.m-4 { - margin: 1rem; -} - -.m-5 { - margin: 1.25rem; -} - -.m-6 { - margin: 1.5rem; -} - -.m-8 { - margin: 2rem; -} - -.m-10 { - margin: 2.5rem; -} - -.m-12 { - margin: 3rem; -} - -.m-16 { - margin: 4rem; -} - -.m-20 { - margin: 5rem; -} - -.m-24 { - margin: 6rem; -} - -.m-32 { - margin: 8rem; -} - -.m-auto { - margin: auto; -} - -.m-px { - margin: 1px; -} - -.my-0 { - margin-top: 0; - margin-bottom: 0; -} - -.mx-0 { - margin-left: 0; - margin-right: 0; -} - -.my-1 { - margin-top: .25rem; - margin-bottom: .25rem; -} - -.mx-1 { - margin-left: .25rem; - margin-right: .25rem; -} - -.my-2 { - margin-top: .5rem; - margin-bottom: .5rem; -} - -.mx-2 { - margin-left: .5rem; - margin-right: .5rem; -} - -.my-3 { - margin-top: .75rem; - margin-bottom: .75rem; -} - -.mx-3 { - margin-left: .75rem; - margin-right: .75rem; -} - -.my-4 { - margin-top: 1rem; - margin-bottom: 1rem; -} - -.mx-4 { - margin-left: 1rem; - margin-right: 1rem; -} - -.my-5 { - margin-top: 1.25rem; - margin-bottom: 1.25rem; -} - -.mx-5 { - margin-left: 1.25rem; - margin-right: 1.25rem; -} - -.my-6 { - margin-top: 1.5rem; - margin-bottom: 1.5rem; -} - -.mx-6 { - margin-left: 1.5rem; - margin-right: 1.5rem; -} - -.my-8 { - margin-top: 2rem; - margin-bottom: 2rem; -} - -.mx-8 { - margin-left: 2rem; - margin-right: 2rem; -} - -.my-10 { - margin-top: 2.5rem; - margin-bottom: 2.5rem; -} - -.mx-10 { - margin-left: 2.5rem; - margin-right: 2.5rem; -} - -.my-12 { - margin-top: 3rem; - margin-bottom: 3rem; -} - -.mx-12 { - margin-left: 3rem; - margin-right: 3rem; -} - -.my-16 { - margin-top: 4rem; - margin-bottom: 4rem; -} - -.mx-16 { - margin-left: 4rem; - margin-right: 4rem; -} - -.my-20 { - margin-top: 5rem; - margin-bottom: 5rem; -} - -.mx-20 { - margin-left: 5rem; - margin-right: 5rem; -} - -.my-24 { - margin-top: 6rem; - margin-bottom: 6rem; -} - -.mx-24 { - margin-left: 6rem; - margin-right: 6rem; -} - -.my-32 { - margin-top: 8rem; - margin-bottom: 8rem; -} - -.mx-32 { - margin-left: 8rem; - margin-right: 8rem; -} - -.my-auto { - margin-top: auto; - margin-bottom: auto; -} - -.mx-auto { - margin-left: auto; - margin-right: auto; -} - -.my-px { - margin-top: 1px; - margin-bottom: 1px; -} - -.mx-px { - margin-left: 1px; - margin-right: 1px; -} - -.mt-0 { - margin-top: 0; -} - -.mr-0 { - margin-right: 0; -} - -.mb-0 { - margin-bottom: 0; -} - -.ml-0 { - margin-left: 0; -} - -.mt-1 { - margin-top: .25rem; -} - -.mr-1 { - margin-right: .25rem; -} - -.mb-1 { - margin-bottom: .25rem; -} - -.ml-1 { - margin-left: .25rem; -} - -.mt-2 { - margin-top: .5rem; -} - -.mr-2 { - margin-right: .5rem; -} - -.mb-2 { - margin-bottom: .5rem; -} - -.ml-2 { - margin-left: .5rem; -} - -.mt-3 { - margin-top: .75rem; -} - -.mr-3 { - margin-right: .75rem; -} - -.mb-3 { - margin-bottom: .75rem; -} - -.ml-3 { - margin-left: .75rem; -} - -.mt-4 { - margin-top: 1rem; -} - -.mr-4 { - margin-right: 1rem; -} - -.mb-4 { - margin-bottom: 1rem; -} - -.ml-4 { - margin-left: 1rem; -} - -.mt-5 { - margin-top: 1.25rem; -} - -.mr-5 { - margin-right: 1.25rem; -} - -.mb-5 { - margin-bottom: 1.25rem; -} - -.ml-5 { - margin-left: 1.25rem; -} - -.mt-6 { - margin-top: 1.5rem; -} - -.mr-6 { - margin-right: 1.5rem; -} - -.mb-6 { - margin-bottom: 1.5rem; -} - -.ml-6 { - margin-left: 1.5rem; -} - -.mt-8 { - margin-top: 2rem; -} - -.mr-8 { - margin-right: 2rem; -} - -.mb-8 { - margin-bottom: 2rem; -} - -.ml-8 { - margin-left: 2rem; -} - -.mt-10 { - margin-top: 2.5rem; -} - -.mr-10 { - margin-right: 2.5rem; -} - -.mb-10 { - margin-bottom: 2.5rem; -} - -.ml-10 { - margin-left: 2.5rem; -} - -.mt-12 { - margin-top: 3rem; -} - -.mr-12 { - margin-right: 3rem; -} - -.mb-12 { - margin-bottom: 3rem; -} - -.ml-12 { - margin-left: 3rem; -} - -.mt-16 { - margin-top: 4rem; -} - -.mr-16 { - margin-right: 4rem; -} - -.mb-16 { - margin-bottom: 4rem; -} - -.ml-16 { - margin-left: 4rem; -} - -.mt-20 { - margin-top: 5rem; -} - -.mr-20 { - margin-right: 5rem; -} - -.mb-20 { - margin-bottom: 5rem; -} - -.ml-20 { - margin-left: 5rem; -} - -.mt-24 { - margin-top: 6rem; -} - -.mr-24 { - margin-right: 6rem; -} - -.mb-24 { - margin-bottom: 6rem; -} - -.ml-24 { - margin-left: 6rem; -} - -.mt-32 { - margin-top: 8rem; -} - -.mr-32 { - margin-right: 8rem; -} - -.mb-32 { - margin-bottom: 8rem; -} - -.ml-32 { - margin-left: 8rem; -} - -.mt-auto { - margin-top: auto; -} - -.mr-auto { - margin-right: auto; -} - -.mb-auto { - margin-bottom: auto; -} - -.ml-auto { - margin-left: auto; -} - -.mt-px { - margin-top: 1px; -} - -.mr-px { - margin-right: 1px; -} - -.mb-px { - margin-bottom: 1px; -} - -.ml-px { - margin-left: 1px; -} - -.max-h-full { - max-height: 100%; -} - -.max-h-screen { - max-height: 100vh; -} - -.max-w-xs { - max-width: 20rem; -} - -.max-w-sm { - max-width: 30rem; -} - -.max-w-md { - max-width: 40rem; -} - -.max-w-lg { - max-width: 50rem; -} - -.max-w-xl { - max-width: 60rem; -} - -.max-w-2xl { - max-width: 70rem; -} - -.max-w-3xl { - max-width: 80rem; -} - -.max-w-4xl { - max-width: 90rem; -} - -.max-w-5xl { - max-width: 100rem; -} - -.max-w-full { - max-width: 100%; -} - -.min-h-0 { - min-height: 0; -} - -.min-h-full { - min-height: 100%; -} - -.min-h-screen { - min-height: 100vh; -} - -.min-w-0 { - min-width: 0; -} - -.min-w-full { - min-width: 100%; -} - -.-m-0 { - margin: 0; -} - -.-m-1 { - margin: -0.25rem; -} - -.-m-2 { - margin: -0.5rem; -} - -.-m-3 { - margin: -0.75rem; -} - -.-m-4 { - margin: -1rem; -} - -.-m-5 { - margin: -1.25rem; -} - -.-m-6 { - margin: -1.5rem; -} - -.-m-8 { - margin: -2rem; -} - -.-m-10 { - margin: -2.5rem; -} - -.-m-12 { - margin: -3rem; -} - -.-m-16 { - margin: -4rem; -} - -.-m-20 { - margin: -5rem; -} - -.-m-24 { - margin: -6rem; -} - -.-m-32 { - margin: -8rem; -} - -.-m-px { - margin: -1px; -} - -.-my-0 { - margin-top: 0; - margin-bottom: 0; -} - -.-mx-0 { - margin-left: 0; - margin-right: 0; -} - -.-my-1 { - margin-top: -0.25rem; - margin-bottom: -0.25rem; -} - -.-mx-1 { - margin-left: -0.25rem; - margin-right: -0.25rem; -} - -.-my-2 { - margin-top: -0.5rem; - margin-bottom: -0.5rem; -} - -.-mx-2 { - margin-left: -0.5rem; - margin-right: -0.5rem; -} - -.-my-3 { - margin-top: -0.75rem; - margin-bottom: -0.75rem; -} - -.-mx-3 { - margin-left: -0.75rem; - margin-right: -0.75rem; -} - -.-my-4 { - margin-top: -1rem; - margin-bottom: -1rem; -} - -.-mx-4 { - margin-left: -1rem; - margin-right: -1rem; -} - -.-my-5 { - margin-top: -1.25rem; - margin-bottom: -1.25rem; -} - -.-mx-5 { - margin-left: -1.25rem; - margin-right: -1.25rem; -} - -.-my-6 { - margin-top: -1.5rem; - margin-bottom: -1.5rem; -} - -.-mx-6 { - margin-left: -1.5rem; - margin-right: -1.5rem; -} - -.-my-8 { - margin-top: -2rem; - margin-bottom: -2rem; -} - -.-mx-8 { - margin-left: -2rem; - margin-right: -2rem; -} - -.-my-10 { - margin-top: -2.5rem; - margin-bottom: -2.5rem; -} - -.-mx-10 { - margin-left: -2.5rem; - margin-right: -2.5rem; -} - -.-my-12 { - margin-top: -3rem; - margin-bottom: -3rem; -} - -.-mx-12 { - margin-left: -3rem; - margin-right: -3rem; -} - -.-my-16 { - margin-top: -4rem; - margin-bottom: -4rem; -} - -.-mx-16 { - margin-left: -4rem; - margin-right: -4rem; -} - -.-my-20 { - margin-top: -5rem; - margin-bottom: -5rem; -} - -.-mx-20 { - margin-left: -5rem; - margin-right: -5rem; -} - -.-my-24 { - margin-top: -6rem; - margin-bottom: -6rem; -} - -.-mx-24 { - margin-left: -6rem; - margin-right: -6rem; -} - -.-my-32 { - margin-top: -8rem; - margin-bottom: -8rem; -} - -.-mx-32 { - margin-left: -8rem; - margin-right: -8rem; -} - -.-my-px { - margin-top: -1px; - margin-bottom: -1px; -} - -.-mx-px { - margin-left: -1px; - margin-right: -1px; -} - -.-mt-0 { - margin-top: 0; -} - -.-mr-0 { - margin-right: 0; -} - -.-mb-0 { - margin-bottom: 0; -} - -.-ml-0 { - margin-left: 0; -} - -.-mt-1 { - margin-top: -0.25rem; -} - -.-mr-1 { - margin-right: -0.25rem; -} - -.-mb-1 { - margin-bottom: -0.25rem; -} - -.-ml-1 { - margin-left: -0.25rem; -} - -.-mt-2 { - margin-top: -0.5rem; -} - -.-mr-2 { - margin-right: -0.5rem; -} - -.-mb-2 { - margin-bottom: -0.5rem; -} - -.-ml-2 { - margin-left: -0.5rem; -} - -.-mt-3 { - margin-top: -0.75rem; -} - -.-mr-3 { - margin-right: -0.75rem; -} - -.-mb-3 { - margin-bottom: -0.75rem; -} - -.-ml-3 { - margin-left: -0.75rem; -} - -.-mt-4 { - margin-top: -1rem; -} - -.-mr-4 { - margin-right: -1rem; -} - -.-mb-4 { - margin-bottom: -1rem; -} - -.-ml-4 { - margin-left: -1rem; -} - -.-mt-5 { - margin-top: -1.25rem; -} - -.-mr-5 { - margin-right: -1.25rem; -} - -.-mb-5 { - margin-bottom: -1.25rem; -} - -.-ml-5 { - margin-left: -1.25rem; -} - -.-mt-6 { - margin-top: -1.5rem; -} - -.-mr-6 { - margin-right: -1.5rem; -} - -.-mb-6 { - margin-bottom: -1.5rem; -} - -.-ml-6 { - margin-left: -1.5rem; -} - -.-mt-8 { - margin-top: -2rem; -} - -.-mr-8 { - margin-right: -2rem; -} - -.-mb-8 { - margin-bottom: -2rem; -} - -.-ml-8 { - margin-left: -2rem; -} - -.-mt-10 { - margin-top: -2.5rem; -} - -.-mr-10 { - margin-right: -2.5rem; -} - -.-mb-10 { - margin-bottom: -2.5rem; -} - -.-ml-10 { - margin-left: -2.5rem; -} - -.-mt-12 { - margin-top: -3rem; -} - -.-mr-12 { - margin-right: -3rem; -} - -.-mb-12 { - margin-bottom: -3rem; -} - -.-ml-12 { - margin-left: -3rem; -} - -.-mt-16 { - margin-top: -4rem; -} - -.-mr-16 { - margin-right: -4rem; -} - -.-mb-16 { - margin-bottom: -4rem; -} - -.-ml-16 { - margin-left: -4rem; -} - -.-mt-20 { - margin-top: -5rem; -} - -.-mr-20 { - margin-right: -5rem; -} - -.-mb-20 { - margin-bottom: -5rem; -} - -.-ml-20 { - margin-left: -5rem; -} - -.-mt-24 { - margin-top: -6rem; -} - -.-mr-24 { - margin-right: -6rem; -} - -.-mb-24 { - margin-bottom: -6rem; -} - -.-ml-24 { - margin-left: -6rem; -} - -.-mt-32 { - margin-top: -8rem; -} - -.-mr-32 { - margin-right: -8rem; -} - -.-mb-32 { - margin-bottom: -8rem; -} - -.-ml-32 { - margin-left: -8rem; -} - -.-mt-px { - margin-top: -1px; -} - -.-mr-px { - margin-right: -1px; -} - -.-mb-px { - margin-bottom: -1px; -} - -.-ml-px { - margin-left: -1px; -} - -.opacity-0 { - opacity: 0; -} - -.opacity-25 { - opacity: .25; -} - -.opacity-50 { - opacity: .5; -} - -.opacity-75 { - opacity: .75; -} - -.opacity-100 { - opacity: 1; -} - -.outline-none { - outline: 0; -} - -.focus\:outline-none:focus { - outline: 0; -} - -.overflow-auto { - overflow: auto; -} - -.overflow-hidden { - overflow: hidden; -} - -.overflow-visible { - overflow: visible; -} - -.overflow-scroll { - overflow: scroll; -} - -.overflow-x-auto { - overflow-x: auto; -} - -.overflow-y-auto { - overflow-y: auto; -} - -.overflow-x-hidden { - overflow-x: hidden; -} - -.overflow-y-hidden { - overflow-y: hidden; -} - -.overflow-x-visible { - overflow-x: visible; -} - -.overflow-y-visible { - overflow-y: visible; -} - -.overflow-x-scroll { - overflow-x: scroll; -} - -.overflow-y-scroll { - overflow-y: scroll; -} - -.scrolling-touch { - -webkit-overflow-scrolling: touch; -} - -.scrolling-auto { - -webkit-overflow-scrolling: auto; -} - -.p-0 { - padding: 0; -} - -.p-1 { - padding: .25rem; -} - -.p-2 { - padding: .5rem; -} - -.p-3 { - padding: .75rem; -} - -.p-4 { - padding: 1rem; -} - -.p-5 { - padding: 1.25rem; -} - -.p-6 { - padding: 1.5rem; -} - -.p-8 { - padding: 2rem; -} - -.p-10 { - padding: 2.5rem; -} - -.p-12 { - padding: 3rem; -} - -.p-16 { - padding: 4rem; -} - -.p-20 { - padding: 5rem; -} - -.p-24 { - padding: 6rem; -} - -.p-32 { - padding: 8rem; -} - -.p-px { - padding: 1px; -} - -.py-0 { - padding-top: 0; - padding-bottom: 0; -} - -.px-0 { - padding-left: 0; - padding-right: 0; -} - -.py-1 { - padding-top: .25rem; - padding-bottom: .25rem; -} - -.px-1 { - padding-left: .25rem; - padding-right: .25rem; -} - -.py-2 { - padding-top: .5rem; - padding-bottom: .5rem; -} - -.px-2 { - padding-left: .5rem; - padding-right: .5rem; -} - -.py-3 { - padding-top: .75rem; - padding-bottom: .75rem; -} - -.px-3 { - padding-left: .75rem; - padding-right: .75rem; -} - -.py-4 { - padding-top: 1rem; - padding-bottom: 1rem; -} - -.px-4 { - padding-left: 1rem; - padding-right: 1rem; -} - -.py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; -} - -.px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; -} - -.py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; -} - -.px-6 { - padding-left: 1.5rem; - padding-right: 1.5rem; -} - -.py-8 { - padding-top: 2rem; - padding-bottom: 2rem; -} - -.px-8 { - padding-left: 2rem; - padding-right: 2rem; -} - -.py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; -} - -.px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; -} - -.py-12 { - padding-top: 3rem; - padding-bottom: 3rem; -} - -.px-12 { - padding-left: 3rem; - padding-right: 3rem; -} - -.py-16 { - padding-top: 4rem; - padding-bottom: 4rem; -} - -.px-16 { - padding-left: 4rem; - padding-right: 4rem; -} - -.py-20 { - padding-top: 5rem; - padding-bottom: 5rem; -} - -.px-20 { - padding-left: 5rem; - padding-right: 5rem; -} - -.py-24 { - padding-top: 6rem; - padding-bottom: 6rem; -} - -.px-24 { - padding-left: 6rem; - padding-right: 6rem; -} - -.py-32 { - padding-top: 8rem; - padding-bottom: 8rem; -} - -.px-32 { - padding-left: 8rem; - padding-right: 8rem; -} - -.py-px { - padding-top: 1px; - padding-bottom: 1px; -} - -.px-px { - padding-left: 1px; - padding-right: 1px; -} - -.pt-0 { - padding-top: 0; -} - -.pr-0 { - padding-right: 0; -} - -.pb-0 { - padding-bottom: 0; -} - -.pl-0 { - padding-left: 0; -} - -.pt-1 { - padding-top: .25rem; -} - -.pr-1 { - padding-right: .25rem; -} - -.pb-1 { - padding-bottom: .25rem; -} - -.pl-1 { - padding-left: .25rem; -} - -.pt-2 { - padding-top: .5rem; -} - -.pr-2 { - padding-right: .5rem; -} - -.pb-2 { - padding-bottom: .5rem; -} - -.pl-2 { - padding-left: .5rem; -} - -.pt-3 { - padding-top: .75rem; -} - -.pr-3 { - padding-right: .75rem; -} - -.pb-3 { - padding-bottom: .75rem; -} - -.pl-3 { - padding-left: .75rem; -} - -.pt-4 { - padding-top: 1rem; -} - -.pr-4 { - padding-right: 1rem; -} - -.pb-4 { - padding-bottom: 1rem; -} - -.pl-4 { - padding-left: 1rem; -} - -.pt-5 { - padding-top: 1.25rem; -} - -.pr-5 { - padding-right: 1.25rem; -} - -.pb-5 { - padding-bottom: 1.25rem; -} - -.pl-5 { - padding-left: 1.25rem; -} - -.pt-6 { - padding-top: 1.5rem; -} - -.pr-6 { - padding-right: 1.5rem; -} - -.pb-6 { - padding-bottom: 1.5rem; -} - -.pl-6 { - padding-left: 1.5rem; -} - -.pt-8 { - padding-top: 2rem; -} - -.pr-8 { - padding-right: 2rem; -} - -.pb-8 { - padding-bottom: 2rem; -} - -.pl-8 { - padding-left: 2rem; -} - -.pt-10 { - padding-top: 2.5rem; -} - -.pr-10 { - padding-right: 2.5rem; -} - -.pb-10 { - padding-bottom: 2.5rem; -} - -.pl-10 { - padding-left: 2.5rem; -} - -.pt-12 { - padding-top: 3rem; -} - -.pr-12 { - padding-right: 3rem; -} - -.pb-12 { - padding-bottom: 3rem; -} - -.pl-12 { - padding-left: 3rem; -} - -.pt-16 { - padding-top: 4rem; -} - -.pr-16 { - padding-right: 4rem; -} - -.pb-16 { - padding-bottom: 4rem; -} - -.pl-16 { - padding-left: 4rem; -} - -.pt-20 { - padding-top: 5rem; -} - -.pr-20 { - padding-right: 5rem; -} - -.pb-20 { - padding-bottom: 5rem; -} - -.pl-20 { - padding-left: 5rem; -} - -.pt-24 { - padding-top: 6rem; -} - -.pr-24 { - padding-right: 6rem; -} - -.pb-24 { - padding-bottom: 6rem; -} - -.pl-24 { - padding-left: 6rem; -} - -.pt-32 { - padding-top: 8rem; -} - -.pr-32 { - padding-right: 8rem; -} - -.pb-32 { - padding-bottom: 8rem; -} - -.pl-32 { - padding-left: 8rem; -} - -.pt-px { - padding-top: 1px; -} - -.pr-px { - padding-right: 1px; -} - -.pb-px { - padding-bottom: 1px; -} - -.pl-px { - padding-left: 1px; -} - -.pointer-events-none { - pointer-events: none; -} - -.pointer-events-auto { - pointer-events: auto; -} - -.static { - position: static; -} - -.fixed { - position: fixed; -} - -.absolute { - position: absolute; -} - -.relative { - position: relative; -} - -.sticky { - position: -webkit-sticky; - position: sticky; -} - -.pin-none { - top: auto; - right: auto; - bottom: auto; - left: auto; -} - -.pin { - top: 0; - right: 0; - bottom: 0; - left: 0; -} - -.pin-y { - top: 0; - bottom: 0; -} - -.pin-x { - right: 0; - left: 0; -} - -.pin-t { - top: 0; -} - -.pin-r { - right: 0; -} - -.pin-b { - bottom: 0; -} - -.pin-l { - left: 0; -} - -.resize-none { - resize: none; -} - -.resize-y { - resize: vertical; -} - -.resize-x { - resize: horizontal; -} - -.resize { - resize: both; -} - -.shadow { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); -} - -.shadow-md { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); -} - -.shadow-lg { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); -} - -.shadow-inner { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); -} - -.shadow-outline { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); -} - -.shadow-none { - box-shadow: none; -} - -.hover\:shadow:hover { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); -} - -.hover\:shadow-md:hover { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); -} - -.hover\:shadow-lg:hover { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); -} - -.hover\:shadow-inner:hover { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); -} - -.hover\:shadow-outline:hover { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); -} - -.hover\:shadow-none:hover { - box-shadow: none; -} - -.focus\:shadow:focus { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); -} - -.focus\:shadow-md:focus { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); -} - -.focus\:shadow-lg:focus { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); -} - -.focus\:shadow-inner:focus { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); -} - -.focus\:shadow-outline:focus { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); -} - -.focus\:shadow-none:focus { - box-shadow: none; -} - -.fill-current { - fill: currentColor; -} - -.stroke-current { - stroke: currentColor; -} - -.table-auto { - table-layout: auto; -} - -.table-fixed { - table-layout: fixed; -} - -.text-left { - text-align: left; -} - -.text-center { - text-align: center; -} - -.text-right { - text-align: right; -} - -.text-justify { - text-align: justify; -} - -.text-transparent { - color: transparent; -} - -.text-black { - color: #22292f; -} - -.text-grey-darkest { - color: #3d4852; -} - -.text-grey-darker { - color: #606f7b; -} - -.text-grey-dark { - color: #8795a1; -} - -.text-grey { - color: #b8c2cc; -} - -.text-grey-light { - color: #dae1e7; -} - -.text-grey-lighter { - color: #f1f5f8; -} - -.text-grey-lightest { - color: #f8fafc; -} - -.text-white { - color: #fff; -} - -.text-red-darkest { - color: #3b0d0c; -} - -.text-red-darker { - color: #621b18; -} - -.text-red-dark { - color: #cc1f1a; -} - -.text-red { - color: #e3342f; -} - -.text-red-light { - color: #ef5753; -} - -.text-red-lighter { - color: #f9acaa; -} - -.text-red-lightest { - color: #fcebea; -} - -.text-orange-darkest { - color: #462a16; -} - -.text-orange-darker { - color: #613b1f; -} - -.text-orange-dark { - color: #de751f; -} - -.text-orange { - color: #f6993f; -} - -.text-orange-light { - color: #faad63; -} - -.text-orange-lighter { - color: #fcd9b6; -} - -.text-orange-lightest { - color: #fff5eb; -} - -.text-yellow-darkest { - color: #453411; -} - -.text-yellow-darker { - color: #684f1d; -} - -.text-yellow-dark { - color: #f2d024; -} - -.text-yellow { - color: #ffed4a; -} - -.text-yellow-light { - color: #fff382; -} - -.text-yellow-lighter { - color: #fff9c2; -} - -.text-yellow-lightest { - color: #fcfbeb; -} - -.text-green-darkest { - color: #0f2f21; -} - -.text-green-darker { - color: #1a4731; -} - -.text-green-dark { - color: #1f9d55; -} - -.text-green { - color: #38c172; -} - -.text-green-light { - color: #51d88a; -} - -.text-green-lighter { - color: #a2f5bf; -} - -.text-green-lightest { - color: #e3fcec; -} - -.text-teal-darkest { - color: #0d3331; -} - -.text-teal-darker { - color: #20504f; -} - -.text-teal-dark { - color: #38a89d; -} - -.text-teal { - color: #4dc0b5; -} - -.text-teal-light { - color: #64d5ca; -} - -.text-teal-lighter { - color: #a0f0ed; -} - -.text-teal-lightest { - color: #e8fffe; -} - -.text-blue-darkest { - color: #12283a; -} - -.text-blue-darker { - color: #1c3d5a; -} - -.text-blue-dark { - color: #2779bd; -} - -.text-blue { - color: #3490dc; -} - -.text-blue-light { - color: #6cb2eb; -} - -.text-blue-lighter { - color: #bcdefa; -} - -.text-blue-lightest { - color: #eff8ff; -} - -.text-indigo-darkest { - color: #191e38; -} - -.text-indigo-darker { - color: #2f365f; -} - -.text-indigo-dark { - color: #5661b3; -} - -.text-indigo { - color: #6574cd; -} - -.text-indigo-light { - color: #7886d7; -} - -.text-indigo-lighter { - color: #b2b7ff; -} - -.text-indigo-lightest { - color: #e6e8ff; -} - -.text-purple-darkest { - color: #21183c; -} - -.text-purple-darker { - color: #382b5f; -} - -.text-purple-dark { - color: #794acf; -} - -.text-purple { - color: #9561e2; -} - -.text-purple-light { - color: #a779e9; -} - -.text-purple-lighter { - color: #d6bbfc; -} - -.text-purple-lightest { - color: #f3ebff; -} - -.text-pink-darkest { - color: #451225; -} - -.text-pink-darker { - color: #6f213f; -} - -.text-pink-dark { - color: #eb5286; -} - -.text-pink { - color: #f66d9b; -} - -.text-pink-light { - color: #fa7ea8; -} - -.text-pink-lighter { - color: #ffbbca; -} - -.text-pink-lightest { - color: #ffebef; -} - -.hover\:text-transparent:hover { - color: transparent; -} - -.hover\:text-black:hover { - color: #22292f; -} - -.hover\:text-grey-darkest:hover { - color: #3d4852; -} - -.hover\:text-grey-darker:hover { - color: #606f7b; -} - -.hover\:text-grey-dark:hover { - color: #8795a1; -} - -.hover\:text-grey:hover { - color: #b8c2cc; -} - -.hover\:text-grey-light:hover { - color: #dae1e7; -} - -.hover\:text-grey-lighter:hover { - color: #f1f5f8; -} - -.hover\:text-grey-lightest:hover { - color: #f8fafc; -} - -.hover\:text-white:hover { - color: #fff; -} - -.hover\:text-red-darkest:hover { - color: #3b0d0c; -} - -.hover\:text-red-darker:hover { - color: #621b18; -} - -.hover\:text-red-dark:hover { - color: #cc1f1a; -} - -.hover\:text-red:hover { - color: #e3342f; -} - -.hover\:text-red-light:hover { - color: #ef5753; -} - -.hover\:text-red-lighter:hover { - color: #f9acaa; -} - -.hover\:text-red-lightest:hover { - color: #fcebea; -} - -.hover\:text-orange-darkest:hover { - color: #462a16; -} - -.hover\:text-orange-darker:hover { - color: #613b1f; -} - -.hover\:text-orange-dark:hover { - color: #de751f; -} - -.hover\:text-orange:hover { - color: #f6993f; -} - -.hover\:text-orange-light:hover { - color: #faad63; -} - -.hover\:text-orange-lighter:hover { - color: #fcd9b6; -} - -.hover\:text-orange-lightest:hover { - color: #fff5eb; -} - -.hover\:text-yellow-darkest:hover { - color: #453411; -} - -.hover\:text-yellow-darker:hover { - color: #684f1d; -} - -.hover\:text-yellow-dark:hover { - color: #f2d024; -} - -.hover\:text-yellow:hover { - color: #ffed4a; -} - -.hover\:text-yellow-light:hover { - color: #fff382; -} - -.hover\:text-yellow-lighter:hover { - color: #fff9c2; -} - -.hover\:text-yellow-lightest:hover { - color: #fcfbeb; -} - -.hover\:text-green-darkest:hover { - color: #0f2f21; -} - -.hover\:text-green-darker:hover { - color: #1a4731; -} - -.hover\:text-green-dark:hover { - color: #1f9d55; -} - -.hover\:text-green:hover { - color: #38c172; -} - -.hover\:text-green-light:hover { - color: #51d88a; -} - -.hover\:text-green-lighter:hover { - color: #a2f5bf; -} - -.hover\:text-green-lightest:hover { - color: #e3fcec; -} - -.hover\:text-teal-darkest:hover { - color: #0d3331; -} - -.hover\:text-teal-darker:hover { - color: #20504f; -} - -.hover\:text-teal-dark:hover { - color: #38a89d; -} - -.hover\:text-teal:hover { - color: #4dc0b5; -} - -.hover\:text-teal-light:hover { - color: #64d5ca; -} - -.hover\:text-teal-lighter:hover { - color: #a0f0ed; -} - -.hover\:text-teal-lightest:hover { - color: #e8fffe; -} - -.hover\:text-blue-darkest:hover { - color: #12283a; -} - -.hover\:text-blue-darker:hover { - color: #1c3d5a; -} - -.hover\:text-blue-dark:hover { - color: #2779bd; -} - -.hover\:text-blue:hover { - color: #3490dc; -} - -.hover\:text-blue-light:hover { - color: #6cb2eb; -} - -.hover\:text-blue-lighter:hover { - color: #bcdefa; -} - -.hover\:text-blue-lightest:hover { - color: #eff8ff; -} - -.hover\:text-indigo-darkest:hover { - color: #191e38; -} - -.hover\:text-indigo-darker:hover { - color: #2f365f; -} - -.hover\:text-indigo-dark:hover { - color: #5661b3; -} - -.hover\:text-indigo:hover { - color: #6574cd; -} - -.hover\:text-indigo-light:hover { - color: #7886d7; -} - -.hover\:text-indigo-lighter:hover { - color: #b2b7ff; -} - -.hover\:text-indigo-lightest:hover { - color: #e6e8ff; -} - -.hover\:text-purple-darkest:hover { - color: #21183c; -} - -.hover\:text-purple-darker:hover { - color: #382b5f; -} - -.hover\:text-purple-dark:hover { - color: #794acf; -} - -.hover\:text-purple:hover { - color: #9561e2; -} - -.hover\:text-purple-light:hover { - color: #a779e9; -} - -.hover\:text-purple-lighter:hover { - color: #d6bbfc; -} - -.hover\:text-purple-lightest:hover { - color: #f3ebff; -} - -.hover\:text-pink-darkest:hover { - color: #451225; -} - -.hover\:text-pink-darker:hover { - color: #6f213f; -} - -.hover\:text-pink-dark:hover { - color: #eb5286; -} - -.hover\:text-pink:hover { - color: #f66d9b; -} - -.hover\:text-pink-light:hover { - color: #fa7ea8; -} - -.hover\:text-pink-lighter:hover { - color: #ffbbca; -} - -.hover\:text-pink-lightest:hover { - color: #ffebef; -} - -.focus\:text-transparent:focus { - color: transparent; -} - -.focus\:text-black:focus { - color: #22292f; -} - -.focus\:text-grey-darkest:focus { - color: #3d4852; -} - -.focus\:text-grey-darker:focus { - color: #606f7b; -} - -.focus\:text-grey-dark:focus { - color: #8795a1; -} - -.focus\:text-grey:focus { - color: #b8c2cc; -} - -.focus\:text-grey-light:focus { - color: #dae1e7; -} - -.focus\:text-grey-lighter:focus { - color: #f1f5f8; -} - -.focus\:text-grey-lightest:focus { - color: #f8fafc; -} - -.focus\:text-white:focus { - color: #fff; -} - -.focus\:text-red-darkest:focus { - color: #3b0d0c; -} - -.focus\:text-red-darker:focus { - color: #621b18; -} - -.focus\:text-red-dark:focus { - color: #cc1f1a; -} - -.focus\:text-red:focus { - color: #e3342f; -} - -.focus\:text-red-light:focus { - color: #ef5753; -} - -.focus\:text-red-lighter:focus { - color: #f9acaa; -} - -.focus\:text-red-lightest:focus { - color: #fcebea; -} - -.focus\:text-orange-darkest:focus { - color: #462a16; -} - -.focus\:text-orange-darker:focus { - color: #613b1f; -} - -.focus\:text-orange-dark:focus { - color: #de751f; -} - -.focus\:text-orange:focus { - color: #f6993f; -} - -.focus\:text-orange-light:focus { - color: #faad63; -} - -.focus\:text-orange-lighter:focus { - color: #fcd9b6; -} - -.focus\:text-orange-lightest:focus { - color: #fff5eb; -} - -.focus\:text-yellow-darkest:focus { - color: #453411; -} - -.focus\:text-yellow-darker:focus { - color: #684f1d; -} - -.focus\:text-yellow-dark:focus { - color: #f2d024; -} - -.focus\:text-yellow:focus { - color: #ffed4a; -} - -.focus\:text-yellow-light:focus { - color: #fff382; -} - -.focus\:text-yellow-lighter:focus { - color: #fff9c2; -} - -.focus\:text-yellow-lightest:focus { - color: #fcfbeb; -} - -.focus\:text-green-darkest:focus { - color: #0f2f21; -} - -.focus\:text-green-darker:focus { - color: #1a4731; -} - -.focus\:text-green-dark:focus { - color: #1f9d55; -} - -.focus\:text-green:focus { - color: #38c172; -} - -.focus\:text-green-light:focus { - color: #51d88a; -} - -.focus\:text-green-lighter:focus { - color: #a2f5bf; -} - -.focus\:text-green-lightest:focus { - color: #e3fcec; -} - -.focus\:text-teal-darkest:focus { - color: #0d3331; -} - -.focus\:text-teal-darker:focus { - color: #20504f; -} - -.focus\:text-teal-dark:focus { - color: #38a89d; -} - -.focus\:text-teal:focus { - color: #4dc0b5; -} - -.focus\:text-teal-light:focus { - color: #64d5ca; -} - -.focus\:text-teal-lighter:focus { - color: #a0f0ed; -} - -.focus\:text-teal-lightest:focus { - color: #e8fffe; -} - -.focus\:text-blue-darkest:focus { - color: #12283a; -} - -.focus\:text-blue-darker:focus { - color: #1c3d5a; -} - -.focus\:text-blue-dark:focus { - color: #2779bd; -} - -.focus\:text-blue:focus { - color: #3490dc; -} - -.focus\:text-blue-light:focus { - color: #6cb2eb; -} - -.focus\:text-blue-lighter:focus { - color: #bcdefa; -} - -.focus\:text-blue-lightest:focus { - color: #eff8ff; -} - -.focus\:text-indigo-darkest:focus { - color: #191e38; -} - -.focus\:text-indigo-darker:focus { - color: #2f365f; -} - -.focus\:text-indigo-dark:focus { - color: #5661b3; -} - -.focus\:text-indigo:focus { - color: #6574cd; -} - -.focus\:text-indigo-light:focus { - color: #7886d7; -} - -.focus\:text-indigo-lighter:focus { - color: #b2b7ff; -} - -.focus\:text-indigo-lightest:focus { - color: #e6e8ff; -} - -.focus\:text-purple-darkest:focus { - color: #21183c; -} - -.focus\:text-purple-darker:focus { - color: #382b5f; -} - -.focus\:text-purple-dark:focus { - color: #794acf; -} - -.focus\:text-purple:focus { - color: #9561e2; -} - -.focus\:text-purple-light:focus { - color: #a779e9; -} - -.focus\:text-purple-lighter:focus { - color: #d6bbfc; -} - -.focus\:text-purple-lightest:focus { - color: #f3ebff; -} - -.focus\:text-pink-darkest:focus { - color: #451225; -} - -.focus\:text-pink-darker:focus { - color: #6f213f; -} - -.focus\:text-pink-dark:focus { - color: #eb5286; -} - -.focus\:text-pink:focus { - color: #f66d9b; -} - -.focus\:text-pink-light:focus { - color: #fa7ea8; -} - -.focus\:text-pink-lighter:focus { - color: #ffbbca; -} - -.focus\:text-pink-lightest:focus { - color: #ffebef; -} - -.text-xs { - font-size: .75rem; -} - -.text-sm { - font-size: .875rem; -} - -.text-base { - font-size: 1rem; -} - -.text-lg { - font-size: 1.125rem; -} - -.text-xl { - font-size: 1.25rem; -} - -.text-2xl { - font-size: 1.5rem; -} - -.text-3xl { - font-size: 1.875rem; -} - -.text-4xl { - font-size: 2.25rem; -} - -.text-5xl { - font-size: 3rem; -} - -.italic { - font-style: italic; -} - -.roman { - font-style: normal; -} - -.uppercase { - text-transform: uppercase; -} - -.lowercase { - text-transform: lowercase; -} - -.capitalize { - text-transform: capitalize; -} - -.normal-case { - text-transform: none; -} - -.underline { - text-decoration: underline; -} - -.line-through { - text-decoration: line-through; -} - -.no-underline { - text-decoration: none; -} - -.antialiased { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -.subpixel-antialiased { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; -} - -.hover\:italic:hover { - font-style: italic; -} - -.hover\:roman:hover { - font-style: normal; -} - -.hover\:uppercase:hover { - text-transform: uppercase; -} - -.hover\:lowercase:hover { - text-transform: lowercase; -} - -.hover\:capitalize:hover { - text-transform: capitalize; -} - -.hover\:normal-case:hover { - text-transform: none; -} - -.hover\:underline:hover { - text-decoration: underline; -} - -.hover\:line-through:hover { - text-decoration: line-through; -} - -.hover\:no-underline:hover { - text-decoration: none; -} - -.hover\:antialiased:hover { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -.hover\:subpixel-antialiased:hover { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; -} - -.focus\:italic:focus { - font-style: italic; -} - -.focus\:roman:focus { - font-style: normal; -} - -.focus\:uppercase:focus { - text-transform: uppercase; -} - -.focus\:lowercase:focus { - text-transform: lowercase; -} - -.focus\:capitalize:focus { - text-transform: capitalize; -} - -.focus\:normal-case:focus { - text-transform: none; -} - -.focus\:underline:focus { - text-decoration: underline; -} - -.focus\:line-through:focus { - text-decoration: line-through; -} - -.focus\:no-underline:focus { - text-decoration: none; -} - -.focus\:antialiased:focus { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -.focus\:subpixel-antialiased:focus { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; -} - -.tracking-tight { - letter-spacing: -0.05em; -} - -.tracking-normal { - letter-spacing: 0; -} - -.tracking-wide { - letter-spacing: .05em; -} - -.select-none { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -.select-text { - -webkit-user-select: text; - -moz-user-select: text; - -ms-user-select: text; - user-select: text; -} - -.align-baseline { - vertical-align: baseline; -} - -.align-top { - vertical-align: top; -} - -.align-middle { - vertical-align: middle; -} - -.align-bottom { - vertical-align: bottom; -} - -.align-text-top { - vertical-align: text-top; -} - -.align-text-bottom { - vertical-align: text-bottom; -} - -.visible { - visibility: visible; -} - -.invisible { - visibility: hidden; -} - -.whitespace-normal { - white-space: normal; -} - -.whitespace-no-wrap { - white-space: nowrap; -} - -.whitespace-pre { - white-space: pre; -} - -.whitespace-pre-line { - white-space: pre-line; -} - -.whitespace-pre-wrap { - white-space: pre-wrap; -} - -.break-words { - word-wrap: break-word; -} - -.break-normal { - word-wrap: normal; -} - -.truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.w-1 { - width: .25rem; -} - -.w-2 { - width: .5rem; -} - -.w-3 { - width: .75rem; -} - -.w-4 { - width: 1rem; -} - -.w-5 { - width: 1.25rem; -} - -.w-6 { - width: 1.5rem; -} - -.w-8 { - width: 2rem; -} - -.w-10 { - width: 2.5rem; -} - -.w-12 { - width: 3rem; -} - -.w-16 { - width: 4rem; -} - -.w-24 { - width: 6rem; -} - -.w-32 { - width: 8rem; -} - -.w-48 { - width: 12rem; -} - -.w-64 { - width: 16rem; -} - -.w-auto { - width: auto; -} - -.w-px { - width: 1px; -} - -.w-1\/2 { - width: 50%; -} - -.w-1\/3 { - width: 33.33333%; -} - -.w-2\/3 { - width: 66.66667%; -} - -.w-1\/4 { - width: 25%; -} - -.w-3\/4 { - width: 75%; -} - -.w-1\/5 { - width: 20%; -} - -.w-2\/5 { - width: 40%; -} - -.w-3\/5 { - width: 60%; -} - -.w-4\/5 { - width: 80%; -} - -.w-1\/6 { - width: 16.66667%; -} - -.w-5\/6 { - width: 83.33333%; -} - -.w-full { - width: 100%; -} - -.w-screen { - width: 100vw; -} - -.z-0 { - z-index: 0; -} - -.z-10 { - z-index: 10; -} - -.z-20 { - z-index: 20; -} - -.z-30 { - z-index: 30; -} - -.z-40 { - z-index: 40; -} - -.z-50 { - z-index: 50; -} - -.z-auto { - z-index: auto; -} - -/* Your custom CSS here */ - -@media (min-width: 576px) { - .sm\:list-reset { - list-style: none; - padding: 0; - } - - .sm\:appearance-none { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - } - - .sm\:bg-fixed { - background-attachment: fixed; - } - - .sm\:bg-local { - background-attachment: local; - } - - .sm\:bg-scroll { - background-attachment: scroll; - } - - .sm\:bg-transparent { - background-color: transparent; - } - - .sm\:bg-black { - background-color: #22292f; - } - - .sm\:bg-grey-darkest { - background-color: #3d4852; - } - - .sm\:bg-grey-darker { - background-color: #606f7b; - } - - .sm\:bg-grey-dark { - background-color: #8795a1; - } - - .sm\:bg-grey { - background-color: #b8c2cc; - } - - .sm\:bg-grey-light { - background-color: #dae1e7; - } - - .sm\:bg-grey-lighter { - background-color: #f1f5f8; - } - - .sm\:bg-grey-lightest { - background-color: #f8fafc; - } - - .sm\:bg-white { - background-color: #fff; - } - - .sm\:bg-red-darkest { - background-color: #3b0d0c; - } - - .sm\:bg-red-darker { - background-color: #621b18; - } - - .sm\:bg-red-dark { - background-color: #cc1f1a; - } - - .sm\:bg-red { - background-color: #e3342f; - } - - .sm\:bg-red-light { - background-color: #ef5753; - } - - .sm\:bg-red-lighter { - background-color: #f9acaa; - } - - .sm\:bg-red-lightest { - background-color: #fcebea; - } - - .sm\:bg-orange-darkest { - background-color: #462a16; - } - - .sm\:bg-orange-darker { - background-color: #613b1f; - } - - .sm\:bg-orange-dark { - background-color: #de751f; - } - - .sm\:bg-orange { - background-color: #f6993f; - } - - .sm\:bg-orange-light { - background-color: #faad63; - } - - .sm\:bg-orange-lighter { - background-color: #fcd9b6; - } - - .sm\:bg-orange-lightest { - background-color: #fff5eb; - } - - .sm\:bg-yellow-darkest { - background-color: #453411; - } - - .sm\:bg-yellow-darker { - background-color: #684f1d; - } - - .sm\:bg-yellow-dark { - background-color: #f2d024; - } - - .sm\:bg-yellow { - background-color: #ffed4a; - } - - .sm\:bg-yellow-light { - background-color: #fff382; - } - - .sm\:bg-yellow-lighter { - background-color: #fff9c2; - } - - .sm\:bg-yellow-lightest { - background-color: #fcfbeb; - } - - .sm\:bg-green-darkest { - background-color: #0f2f21; - } - - .sm\:bg-green-darker { - background-color: #1a4731; - } - - .sm\:bg-green-dark { - background-color: #1f9d55; - } - - .sm\:bg-green { - background-color: #38c172; - } - - .sm\:bg-green-light { - background-color: #51d88a; - } - - .sm\:bg-green-lighter { - background-color: #a2f5bf; - } - - .sm\:bg-green-lightest { - background-color: #e3fcec; - } - - .sm\:bg-teal-darkest { - background-color: #0d3331; - } - - .sm\:bg-teal-darker { - background-color: #20504f; - } - - .sm\:bg-teal-dark { - background-color: #38a89d; - } - - .sm\:bg-teal { - background-color: #4dc0b5; - } - - .sm\:bg-teal-light { - background-color: #64d5ca; - } - - .sm\:bg-teal-lighter { - background-color: #a0f0ed; - } - - .sm\:bg-teal-lightest { - background-color: #e8fffe; - } - - .sm\:bg-blue-darkest { - background-color: #12283a; - } - - .sm\:bg-blue-darker { - background-color: #1c3d5a; - } - - .sm\:bg-blue-dark { - background-color: #2779bd; - } - - .sm\:bg-blue { - background-color: #3490dc; - } - - .sm\:bg-blue-light { - background-color: #6cb2eb; - } - - .sm\:bg-blue-lighter { - background-color: #bcdefa; - } - - .sm\:bg-blue-lightest { - background-color: #eff8ff; - } - - .sm\:bg-indigo-darkest { - background-color: #191e38; - } - - .sm\:bg-indigo-darker { - background-color: #2f365f; - } - - .sm\:bg-indigo-dark { - background-color: #5661b3; - } - - .sm\:bg-indigo { - background-color: #6574cd; - } - - .sm\:bg-indigo-light { - background-color: #7886d7; - } - - .sm\:bg-indigo-lighter { - background-color: #b2b7ff; - } - - .sm\:bg-indigo-lightest { - background-color: #e6e8ff; - } - - .sm\:bg-purple-darkest { - background-color: #21183c; - } - - .sm\:bg-purple-darker { - background-color: #382b5f; - } - - .sm\:bg-purple-dark { - background-color: #794acf; - } - - .sm\:bg-purple { - background-color: #9561e2; - } - - .sm\:bg-purple-light { - background-color: #a779e9; - } - - .sm\:bg-purple-lighter { - background-color: #d6bbfc; - } - - .sm\:bg-purple-lightest { - background-color: #f3ebff; - } - - .sm\:bg-pink-darkest { - background-color: #451225; - } - - .sm\:bg-pink-darker { - background-color: #6f213f; - } - - .sm\:bg-pink-dark { - background-color: #eb5286; - } - - .sm\:bg-pink { - background-color: #f66d9b; - } - - .sm\:bg-pink-light { - background-color: #fa7ea8; - } - - .sm\:bg-pink-lighter { - background-color: #ffbbca; - } - - .sm\:bg-pink-lightest { - background-color: #ffebef; - } - - .sm\:hover\:bg-transparent:hover { - background-color: transparent; - } - - .sm\:hover\:bg-black:hover { - background-color: #22292f; - } - - .sm\:hover\:bg-grey-darkest:hover { - background-color: #3d4852; - } - - .sm\:hover\:bg-grey-darker:hover { - background-color: #606f7b; - } - - .sm\:hover\:bg-grey-dark:hover { - background-color: #8795a1; - } - - .sm\:hover\:bg-grey:hover { - background-color: #b8c2cc; - } - - .sm\:hover\:bg-grey-light:hover { - background-color: #dae1e7; - } - - .sm\:hover\:bg-grey-lighter:hover { - background-color: #f1f5f8; - } - - .sm\:hover\:bg-grey-lightest:hover { - background-color: #f8fafc; - } - - .sm\:hover\:bg-white:hover { - background-color: #fff; - } - - .sm\:hover\:bg-red-darkest:hover { - background-color: #3b0d0c; - } - - .sm\:hover\:bg-red-darker:hover { - background-color: #621b18; - } - - .sm\:hover\:bg-red-dark:hover { - background-color: #cc1f1a; - } - - .sm\:hover\:bg-red:hover { - background-color: #e3342f; - } - - .sm\:hover\:bg-red-light:hover { - background-color: #ef5753; - } - - .sm\:hover\:bg-red-lighter:hover { - background-color: #f9acaa; - } - - .sm\:hover\:bg-red-lightest:hover { - background-color: #fcebea; - } - - .sm\:hover\:bg-orange-darkest:hover { - background-color: #462a16; - } - - .sm\:hover\:bg-orange-darker:hover { - background-color: #613b1f; - } - - .sm\:hover\:bg-orange-dark:hover { - background-color: #de751f; - } - - .sm\:hover\:bg-orange:hover { - background-color: #f6993f; - } - - .sm\:hover\:bg-orange-light:hover { - background-color: #faad63; - } - - .sm\:hover\:bg-orange-lighter:hover { - background-color: #fcd9b6; - } - - .sm\:hover\:bg-orange-lightest:hover { - background-color: #fff5eb; - } - - .sm\:hover\:bg-yellow-darkest:hover { - background-color: #453411; - } - - .sm\:hover\:bg-yellow-darker:hover { - background-color: #684f1d; - } - - .sm\:hover\:bg-yellow-dark:hover { - background-color: #f2d024; - } - - .sm\:hover\:bg-yellow:hover { - background-color: #ffed4a; - } - - .sm\:hover\:bg-yellow-light:hover { - background-color: #fff382; - } - - .sm\:hover\:bg-yellow-lighter:hover { - background-color: #fff9c2; - } - - .sm\:hover\:bg-yellow-lightest:hover { - background-color: #fcfbeb; - } - - .sm\:hover\:bg-green-darkest:hover { - background-color: #0f2f21; - } - - .sm\:hover\:bg-green-darker:hover { - background-color: #1a4731; - } - - .sm\:hover\:bg-green-dark:hover { - background-color: #1f9d55; - } - - .sm\:hover\:bg-green:hover { - background-color: #38c172; - } - - .sm\:hover\:bg-green-light:hover { - background-color: #51d88a; - } - - .sm\:hover\:bg-green-lighter:hover { - background-color: #a2f5bf; - } - - .sm\:hover\:bg-green-lightest:hover { - background-color: #e3fcec; - } - - .sm\:hover\:bg-teal-darkest:hover { - background-color: #0d3331; - } - - .sm\:hover\:bg-teal-darker:hover { - background-color: #20504f; - } - - .sm\:hover\:bg-teal-dark:hover { - background-color: #38a89d; - } - - .sm\:hover\:bg-teal:hover { - background-color: #4dc0b5; - } - - .sm\:hover\:bg-teal-light:hover { - background-color: #64d5ca; - } - - .sm\:hover\:bg-teal-lighter:hover { - background-color: #a0f0ed; - } - - .sm\:hover\:bg-teal-lightest:hover { - background-color: #e8fffe; - } - - .sm\:hover\:bg-blue-darkest:hover { - background-color: #12283a; - } - - .sm\:hover\:bg-blue-darker:hover { - background-color: #1c3d5a; - } - - .sm\:hover\:bg-blue-dark:hover { - background-color: #2779bd; - } - - .sm\:hover\:bg-blue:hover { - background-color: #3490dc; - } - - .sm\:hover\:bg-blue-light:hover { - background-color: #6cb2eb; - } - - .sm\:hover\:bg-blue-lighter:hover { - background-color: #bcdefa; - } - - .sm\:hover\:bg-blue-lightest:hover { - background-color: #eff8ff; - } - - .sm\:hover\:bg-indigo-darkest:hover { - background-color: #191e38; - } - - .sm\:hover\:bg-indigo-darker:hover { - background-color: #2f365f; - } - - .sm\:hover\:bg-indigo-dark:hover { - background-color: #5661b3; - } - - .sm\:hover\:bg-indigo:hover { - background-color: #6574cd; - } - - .sm\:hover\:bg-indigo-light:hover { - background-color: #7886d7; - } - - .sm\:hover\:bg-indigo-lighter:hover { - background-color: #b2b7ff; - } - - .sm\:hover\:bg-indigo-lightest:hover { - background-color: #e6e8ff; - } - - .sm\:hover\:bg-purple-darkest:hover { - background-color: #21183c; - } - - .sm\:hover\:bg-purple-darker:hover { - background-color: #382b5f; - } - - .sm\:hover\:bg-purple-dark:hover { - background-color: #794acf; - } - - .sm\:hover\:bg-purple:hover { - background-color: #9561e2; - } - - .sm\:hover\:bg-purple-light:hover { - background-color: #a779e9; - } - - .sm\:hover\:bg-purple-lighter:hover { - background-color: #d6bbfc; - } - - .sm\:hover\:bg-purple-lightest:hover { - background-color: #f3ebff; - } - - .sm\:hover\:bg-pink-darkest:hover { - background-color: #451225; - } - - .sm\:hover\:bg-pink-darker:hover { - background-color: #6f213f; - } - - .sm\:hover\:bg-pink-dark:hover { - background-color: #eb5286; - } - - .sm\:hover\:bg-pink:hover { - background-color: #f66d9b; - } - - .sm\:hover\:bg-pink-light:hover { - background-color: #fa7ea8; - } - - .sm\:hover\:bg-pink-lighter:hover { - background-color: #ffbbca; - } - - .sm\:hover\:bg-pink-lightest:hover { - background-color: #ffebef; - } - - .sm\:focus\:bg-transparent:focus { - background-color: transparent; - } - - .sm\:focus\:bg-black:focus { - background-color: #22292f; - } - - .sm\:focus\:bg-grey-darkest:focus { - background-color: #3d4852; - } - - .sm\:focus\:bg-grey-darker:focus { - background-color: #606f7b; - } - - .sm\:focus\:bg-grey-dark:focus { - background-color: #8795a1; - } - - .sm\:focus\:bg-grey:focus { - background-color: #b8c2cc; - } - - .sm\:focus\:bg-grey-light:focus { - background-color: #dae1e7; - } - - .sm\:focus\:bg-grey-lighter:focus { - background-color: #f1f5f8; - } - - .sm\:focus\:bg-grey-lightest:focus { - background-color: #f8fafc; - } - - .sm\:focus\:bg-white:focus { - background-color: #fff; - } - - .sm\:focus\:bg-red-darkest:focus { - background-color: #3b0d0c; - } - - .sm\:focus\:bg-red-darker:focus { - background-color: #621b18; - } - - .sm\:focus\:bg-red-dark:focus { - background-color: #cc1f1a; - } - - .sm\:focus\:bg-red:focus { - background-color: #e3342f; - } - - .sm\:focus\:bg-red-light:focus { - background-color: #ef5753; - } - - .sm\:focus\:bg-red-lighter:focus { - background-color: #f9acaa; - } - - .sm\:focus\:bg-red-lightest:focus { - background-color: #fcebea; - } - - .sm\:focus\:bg-orange-darkest:focus { - background-color: #462a16; - } - - .sm\:focus\:bg-orange-darker:focus { - background-color: #613b1f; - } - - .sm\:focus\:bg-orange-dark:focus { - background-color: #de751f; - } - - .sm\:focus\:bg-orange:focus { - background-color: #f6993f; - } - - .sm\:focus\:bg-orange-light:focus { - background-color: #faad63; - } - - .sm\:focus\:bg-orange-lighter:focus { - background-color: #fcd9b6; - } - - .sm\:focus\:bg-orange-lightest:focus { - background-color: #fff5eb; - } - - .sm\:focus\:bg-yellow-darkest:focus { - background-color: #453411; - } - - .sm\:focus\:bg-yellow-darker:focus { - background-color: #684f1d; - } - - .sm\:focus\:bg-yellow-dark:focus { - background-color: #f2d024; - } - - .sm\:focus\:bg-yellow:focus { - background-color: #ffed4a; - } - - .sm\:focus\:bg-yellow-light:focus { - background-color: #fff382; - } - - .sm\:focus\:bg-yellow-lighter:focus { - background-color: #fff9c2; - } - - .sm\:focus\:bg-yellow-lightest:focus { - background-color: #fcfbeb; - } - - .sm\:focus\:bg-green-darkest:focus { - background-color: #0f2f21; - } - - .sm\:focus\:bg-green-darker:focus { - background-color: #1a4731; - } - - .sm\:focus\:bg-green-dark:focus { - background-color: #1f9d55; - } - - .sm\:focus\:bg-green:focus { - background-color: #38c172; - } - - .sm\:focus\:bg-green-light:focus { - background-color: #51d88a; - } - - .sm\:focus\:bg-green-lighter:focus { - background-color: #a2f5bf; - } - - .sm\:focus\:bg-green-lightest:focus { - background-color: #e3fcec; - } - - .sm\:focus\:bg-teal-darkest:focus { - background-color: #0d3331; - } - - .sm\:focus\:bg-teal-darker:focus { - background-color: #20504f; - } - - .sm\:focus\:bg-teal-dark:focus { - background-color: #38a89d; - } - - .sm\:focus\:bg-teal:focus { - background-color: #4dc0b5; - } - - .sm\:focus\:bg-teal-light:focus { - background-color: #64d5ca; - } - - .sm\:focus\:bg-teal-lighter:focus { - background-color: #a0f0ed; - } - - .sm\:focus\:bg-teal-lightest:focus { - background-color: #e8fffe; - } - - .sm\:focus\:bg-blue-darkest:focus { - background-color: #12283a; - } - - .sm\:focus\:bg-blue-darker:focus { - background-color: #1c3d5a; - } - - .sm\:focus\:bg-blue-dark:focus { - background-color: #2779bd; - } - - .sm\:focus\:bg-blue:focus { - background-color: #3490dc; - } - - .sm\:focus\:bg-blue-light:focus { - background-color: #6cb2eb; - } - - .sm\:focus\:bg-blue-lighter:focus { - background-color: #bcdefa; - } - - .sm\:focus\:bg-blue-lightest:focus { - background-color: #eff8ff; - } - - .sm\:focus\:bg-indigo-darkest:focus { - background-color: #191e38; - } - - .sm\:focus\:bg-indigo-darker:focus { - background-color: #2f365f; - } - - .sm\:focus\:bg-indigo-dark:focus { - background-color: #5661b3; - } - - .sm\:focus\:bg-indigo:focus { - background-color: #6574cd; - } - - .sm\:focus\:bg-indigo-light:focus { - background-color: #7886d7; - } - - .sm\:focus\:bg-indigo-lighter:focus { - background-color: #b2b7ff; - } - - .sm\:focus\:bg-indigo-lightest:focus { - background-color: #e6e8ff; - } - - .sm\:focus\:bg-purple-darkest:focus { - background-color: #21183c; - } - - .sm\:focus\:bg-purple-darker:focus { - background-color: #382b5f; - } - - .sm\:focus\:bg-purple-dark:focus { - background-color: #794acf; - } - - .sm\:focus\:bg-purple:focus { - background-color: #9561e2; - } - - .sm\:focus\:bg-purple-light:focus { - background-color: #a779e9; - } - - .sm\:focus\:bg-purple-lighter:focus { - background-color: #d6bbfc; - } - - .sm\:focus\:bg-purple-lightest:focus { - background-color: #f3ebff; - } - - .sm\:focus\:bg-pink-darkest:focus { - background-color: #451225; - } - - .sm\:focus\:bg-pink-darker:focus { - background-color: #6f213f; - } - - .sm\:focus\:bg-pink-dark:focus { - background-color: #eb5286; - } - - .sm\:focus\:bg-pink:focus { - background-color: #f66d9b; - } - - .sm\:focus\:bg-pink-light:focus { - background-color: #fa7ea8; - } - - .sm\:focus\:bg-pink-lighter:focus { - background-color: #ffbbca; - } - - .sm\:focus\:bg-pink-lightest:focus { - background-color: #ffebef; - } - - .sm\:bg-bottom { - background-position: bottom; - } - - .sm\:bg-center { - background-position: center; - } - - .sm\:bg-left { - background-position: left; - } - - .sm\:bg-left-bottom { - background-position: left bottom; - } - - .sm\:bg-left-top { - background-position: left top; - } - - .sm\:bg-right { - background-position: right; - } - - .sm\:bg-right-bottom { - background-position: right bottom; - } - - .sm\:bg-right-top { - background-position: right top; - } - - .sm\:bg-top { - background-position: top; - } - - .sm\:bg-repeat { - background-repeat: repeat; - } - - .sm\:bg-no-repeat { - background-repeat: no-repeat; - } - - .sm\:bg-repeat-x { - background-repeat: repeat-x; - } - - .sm\:bg-repeat-y { - background-repeat: repeat-y; - } - - .sm\:bg-auto { - background-size: auto; - } - - .sm\:bg-cover { - background-size: cover; - } - - .sm\:bg-contain { - background-size: contain; - } - - .sm\:border-transparent { - border-color: transparent; - } - - .sm\:border-black { - border-color: #22292f; - } - - .sm\:border-grey-darkest { - border-color: #3d4852; - } - - .sm\:border-grey-darker { - border-color: #606f7b; - } - - .sm\:border-grey-dark { - border-color: #8795a1; - } - - .sm\:border-grey { - border-color: #b8c2cc; - } - - .sm\:border-grey-light { - border-color: #dae1e7; - } - - .sm\:border-grey-lighter { - border-color: #f1f5f8; - } - - .sm\:border-grey-lightest { - border-color: #f8fafc; - } - - .sm\:border-white { - border-color: #fff; - } - - .sm\:border-red-darkest { - border-color: #3b0d0c; - } - - .sm\:border-red-darker { - border-color: #621b18; - } - - .sm\:border-red-dark { - border-color: #cc1f1a; - } - - .sm\:border-red { - border-color: #e3342f; - } - - .sm\:border-red-light { - border-color: #ef5753; - } - - .sm\:border-red-lighter { - border-color: #f9acaa; - } - - .sm\:border-red-lightest { - border-color: #fcebea; - } - - .sm\:border-orange-darkest { - border-color: #462a16; - } - - .sm\:border-orange-darker { - border-color: #613b1f; - } - - .sm\:border-orange-dark { - border-color: #de751f; - } - - .sm\:border-orange { - border-color: #f6993f; - } - - .sm\:border-orange-light { - border-color: #faad63; - } - - .sm\:border-orange-lighter { - border-color: #fcd9b6; - } - - .sm\:border-orange-lightest { - border-color: #fff5eb; - } - - .sm\:border-yellow-darkest { - border-color: #453411; - } - - .sm\:border-yellow-darker { - border-color: #684f1d; - } - - .sm\:border-yellow-dark { - border-color: #f2d024; - } - - .sm\:border-yellow { - border-color: #ffed4a; - } - - .sm\:border-yellow-light { - border-color: #fff382; - } - - .sm\:border-yellow-lighter { - border-color: #fff9c2; - } - - .sm\:border-yellow-lightest { - border-color: #fcfbeb; - } - - .sm\:border-green-darkest { - border-color: #0f2f21; - } - - .sm\:border-green-darker { - border-color: #1a4731; - } - - .sm\:border-green-dark { - border-color: #1f9d55; - } - - .sm\:border-green { - border-color: #38c172; - } - - .sm\:border-green-light { - border-color: #51d88a; - } - - .sm\:border-green-lighter { - border-color: #a2f5bf; - } - - .sm\:border-green-lightest { - border-color: #e3fcec; - } - - .sm\:border-teal-darkest { - border-color: #0d3331; - } - - .sm\:border-teal-darker { - border-color: #20504f; - } - - .sm\:border-teal-dark { - border-color: #38a89d; - } - - .sm\:border-teal { - border-color: #4dc0b5; - } - - .sm\:border-teal-light { - border-color: #64d5ca; - } - - .sm\:border-teal-lighter { - border-color: #a0f0ed; - } - - .sm\:border-teal-lightest { - border-color: #e8fffe; - } - - .sm\:border-blue-darkest { - border-color: #12283a; - } - - .sm\:border-blue-darker { - border-color: #1c3d5a; - } - - .sm\:border-blue-dark { - border-color: #2779bd; - } - - .sm\:border-blue { - border-color: #3490dc; - } - - .sm\:border-blue-light { - border-color: #6cb2eb; - } - - .sm\:border-blue-lighter { - border-color: #bcdefa; - } - - .sm\:border-blue-lightest { - border-color: #eff8ff; - } - - .sm\:border-indigo-darkest { - border-color: #191e38; - } - - .sm\:border-indigo-darker { - border-color: #2f365f; - } - - .sm\:border-indigo-dark { - border-color: #5661b3; - } - - .sm\:border-indigo { - border-color: #6574cd; - } - - .sm\:border-indigo-light { - border-color: #7886d7; - } - - .sm\:border-indigo-lighter { - border-color: #b2b7ff; - } - - .sm\:border-indigo-lightest { - border-color: #e6e8ff; - } - - .sm\:border-purple-darkest { - border-color: #21183c; - } - - .sm\:border-purple-darker { - border-color: #382b5f; - } - - .sm\:border-purple-dark { - border-color: #794acf; - } - - .sm\:border-purple { - border-color: #9561e2; - } - - .sm\:border-purple-light { - border-color: #a779e9; - } - - .sm\:border-purple-lighter { - border-color: #d6bbfc; - } - - .sm\:border-purple-lightest { - border-color: #f3ebff; - } - - .sm\:border-pink-darkest { - border-color: #451225; - } - - .sm\:border-pink-darker { - border-color: #6f213f; - } - - .sm\:border-pink-dark { - border-color: #eb5286; - } - - .sm\:border-pink { - border-color: #f66d9b; - } - - .sm\:border-pink-light { - border-color: #fa7ea8; - } - - .sm\:border-pink-lighter { - border-color: #ffbbca; - } - - .sm\:border-pink-lightest { - border-color: #ffebef; - } - - .sm\:hover\:border-transparent:hover { - border-color: transparent; - } - - .sm\:hover\:border-black:hover { - border-color: #22292f; - } - - .sm\:hover\:border-grey-darkest:hover { - border-color: #3d4852; - } - - .sm\:hover\:border-grey-darker:hover { - border-color: #606f7b; - } - - .sm\:hover\:border-grey-dark:hover { - border-color: #8795a1; - } - - .sm\:hover\:border-grey:hover { - border-color: #b8c2cc; - } - - .sm\:hover\:border-grey-light:hover { - border-color: #dae1e7; - } - - .sm\:hover\:border-grey-lighter:hover { - border-color: #f1f5f8; - } - - .sm\:hover\:border-grey-lightest:hover { - border-color: #f8fafc; - } - - .sm\:hover\:border-white:hover { - border-color: #fff; - } - - .sm\:hover\:border-red-darkest:hover { - border-color: #3b0d0c; - } - - .sm\:hover\:border-red-darker:hover { - border-color: #621b18; - } - - .sm\:hover\:border-red-dark:hover { - border-color: #cc1f1a; - } - - .sm\:hover\:border-red:hover { - border-color: #e3342f; - } - - .sm\:hover\:border-red-light:hover { - border-color: #ef5753; - } - - .sm\:hover\:border-red-lighter:hover { - border-color: #f9acaa; - } - - .sm\:hover\:border-red-lightest:hover { - border-color: #fcebea; - } - - .sm\:hover\:border-orange-darkest:hover { - border-color: #462a16; - } - - .sm\:hover\:border-orange-darker:hover { - border-color: #613b1f; - } - - .sm\:hover\:border-orange-dark:hover { - border-color: #de751f; - } - - .sm\:hover\:border-orange:hover { - border-color: #f6993f; - } - - .sm\:hover\:border-orange-light:hover { - border-color: #faad63; - } - - .sm\:hover\:border-orange-lighter:hover { - border-color: #fcd9b6; - } - - .sm\:hover\:border-orange-lightest:hover { - border-color: #fff5eb; - } - - .sm\:hover\:border-yellow-darkest:hover { - border-color: #453411; - } - - .sm\:hover\:border-yellow-darker:hover { - border-color: #684f1d; - } - - .sm\:hover\:border-yellow-dark:hover { - border-color: #f2d024; - } - - .sm\:hover\:border-yellow:hover { - border-color: #ffed4a; - } - - .sm\:hover\:border-yellow-light:hover { - border-color: #fff382; - } - - .sm\:hover\:border-yellow-lighter:hover { - border-color: #fff9c2; - } - - .sm\:hover\:border-yellow-lightest:hover { - border-color: #fcfbeb; - } - - .sm\:hover\:border-green-darkest:hover { - border-color: #0f2f21; - } - - .sm\:hover\:border-green-darker:hover { - border-color: #1a4731; - } - - .sm\:hover\:border-green-dark:hover { - border-color: #1f9d55; - } - - .sm\:hover\:border-green:hover { - border-color: #38c172; - } - - .sm\:hover\:border-green-light:hover { - border-color: #51d88a; - } - - .sm\:hover\:border-green-lighter:hover { - border-color: #a2f5bf; - } - - .sm\:hover\:border-green-lightest:hover { - border-color: #e3fcec; - } - - .sm\:hover\:border-teal-darkest:hover { - border-color: #0d3331; - } - - .sm\:hover\:border-teal-darker:hover { - border-color: #20504f; - } - - .sm\:hover\:border-teal-dark:hover { - border-color: #38a89d; - } - - .sm\:hover\:border-teal:hover { - border-color: #4dc0b5; - } - - .sm\:hover\:border-teal-light:hover { - border-color: #64d5ca; - } - - .sm\:hover\:border-teal-lighter:hover { - border-color: #a0f0ed; - } - - .sm\:hover\:border-teal-lightest:hover { - border-color: #e8fffe; - } - - .sm\:hover\:border-blue-darkest:hover { - border-color: #12283a; - } - - .sm\:hover\:border-blue-darker:hover { - border-color: #1c3d5a; - } - - .sm\:hover\:border-blue-dark:hover { - border-color: #2779bd; - } - - .sm\:hover\:border-blue:hover { - border-color: #3490dc; - } - - .sm\:hover\:border-blue-light:hover { - border-color: #6cb2eb; - } - - .sm\:hover\:border-blue-lighter:hover { - border-color: #bcdefa; - } - - .sm\:hover\:border-blue-lightest:hover { - border-color: #eff8ff; - } - - .sm\:hover\:border-indigo-darkest:hover { - border-color: #191e38; - } - - .sm\:hover\:border-indigo-darker:hover { - border-color: #2f365f; - } - - .sm\:hover\:border-indigo-dark:hover { - border-color: #5661b3; - } - - .sm\:hover\:border-indigo:hover { - border-color: #6574cd; - } - - .sm\:hover\:border-indigo-light:hover { - border-color: #7886d7; - } - - .sm\:hover\:border-indigo-lighter:hover { - border-color: #b2b7ff; - } - - .sm\:hover\:border-indigo-lightest:hover { - border-color: #e6e8ff; - } - - .sm\:hover\:border-purple-darkest:hover { - border-color: #21183c; - } - - .sm\:hover\:border-purple-darker:hover { - border-color: #382b5f; - } - - .sm\:hover\:border-purple-dark:hover { - border-color: #794acf; - } - - .sm\:hover\:border-purple:hover { - border-color: #9561e2; - } - - .sm\:hover\:border-purple-light:hover { - border-color: #a779e9; - } - - .sm\:hover\:border-purple-lighter:hover { - border-color: #d6bbfc; - } - - .sm\:hover\:border-purple-lightest:hover { - border-color: #f3ebff; - } - - .sm\:hover\:border-pink-darkest:hover { - border-color: #451225; - } - - .sm\:hover\:border-pink-darker:hover { - border-color: #6f213f; - } - - .sm\:hover\:border-pink-dark:hover { - border-color: #eb5286; - } - - .sm\:hover\:border-pink:hover { - border-color: #f66d9b; - } - - .sm\:hover\:border-pink-light:hover { - border-color: #fa7ea8; - } - - .sm\:hover\:border-pink-lighter:hover { - border-color: #ffbbca; - } - - .sm\:hover\:border-pink-lightest:hover { - border-color: #ffebef; - } - - .sm\:focus\:border-transparent:focus { - border-color: transparent; - } - - .sm\:focus\:border-black:focus { - border-color: #22292f; - } - - .sm\:focus\:border-grey-darkest:focus { - border-color: #3d4852; - } - - .sm\:focus\:border-grey-darker:focus { - border-color: #606f7b; - } - - .sm\:focus\:border-grey-dark:focus { - border-color: #8795a1; - } - - .sm\:focus\:border-grey:focus { - border-color: #b8c2cc; - } - - .sm\:focus\:border-grey-light:focus { - border-color: #dae1e7; - } - - .sm\:focus\:border-grey-lighter:focus { - border-color: #f1f5f8; - } - - .sm\:focus\:border-grey-lightest:focus { - border-color: #f8fafc; - } - - .sm\:focus\:border-white:focus { - border-color: #fff; - } - - .sm\:focus\:border-red-darkest:focus { - border-color: #3b0d0c; - } - - .sm\:focus\:border-red-darker:focus { - border-color: #621b18; - } - - .sm\:focus\:border-red-dark:focus { - border-color: #cc1f1a; - } - - .sm\:focus\:border-red:focus { - border-color: #e3342f; - } - - .sm\:focus\:border-red-light:focus { - border-color: #ef5753; - } - - .sm\:focus\:border-red-lighter:focus { - border-color: #f9acaa; - } - - .sm\:focus\:border-red-lightest:focus { - border-color: #fcebea; - } - - .sm\:focus\:border-orange-darkest:focus { - border-color: #462a16; - } - - .sm\:focus\:border-orange-darker:focus { - border-color: #613b1f; - } - - .sm\:focus\:border-orange-dark:focus { - border-color: #de751f; - } - - .sm\:focus\:border-orange:focus { - border-color: #f6993f; - } - - .sm\:focus\:border-orange-light:focus { - border-color: #faad63; - } - - .sm\:focus\:border-orange-lighter:focus { - border-color: #fcd9b6; - } - - .sm\:focus\:border-orange-lightest:focus { - border-color: #fff5eb; - } - - .sm\:focus\:border-yellow-darkest:focus { - border-color: #453411; - } - - .sm\:focus\:border-yellow-darker:focus { - border-color: #684f1d; - } - - .sm\:focus\:border-yellow-dark:focus { - border-color: #f2d024; - } - - .sm\:focus\:border-yellow:focus { - border-color: #ffed4a; - } - - .sm\:focus\:border-yellow-light:focus { - border-color: #fff382; - } - - .sm\:focus\:border-yellow-lighter:focus { - border-color: #fff9c2; - } - - .sm\:focus\:border-yellow-lightest:focus { - border-color: #fcfbeb; - } - - .sm\:focus\:border-green-darkest:focus { - border-color: #0f2f21; - } - - .sm\:focus\:border-green-darker:focus { - border-color: #1a4731; - } - - .sm\:focus\:border-green-dark:focus { - border-color: #1f9d55; - } - - .sm\:focus\:border-green:focus { - border-color: #38c172; - } - - .sm\:focus\:border-green-light:focus { - border-color: #51d88a; - } - - .sm\:focus\:border-green-lighter:focus { - border-color: #a2f5bf; - } - - .sm\:focus\:border-green-lightest:focus { - border-color: #e3fcec; - } - - .sm\:focus\:border-teal-darkest:focus { - border-color: #0d3331; - } - - .sm\:focus\:border-teal-darker:focus { - border-color: #20504f; - } - - .sm\:focus\:border-teal-dark:focus { - border-color: #38a89d; - } - - .sm\:focus\:border-teal:focus { - border-color: #4dc0b5; - } - - .sm\:focus\:border-teal-light:focus { - border-color: #64d5ca; - } - - .sm\:focus\:border-teal-lighter:focus { - border-color: #a0f0ed; - } - - .sm\:focus\:border-teal-lightest:focus { - border-color: #e8fffe; - } - - .sm\:focus\:border-blue-darkest:focus { - border-color: #12283a; - } - - .sm\:focus\:border-blue-darker:focus { - border-color: #1c3d5a; - } - - .sm\:focus\:border-blue-dark:focus { - border-color: #2779bd; - } - - .sm\:focus\:border-blue:focus { - border-color: #3490dc; - } - - .sm\:focus\:border-blue-light:focus { - border-color: #6cb2eb; - } - - .sm\:focus\:border-blue-lighter:focus { - border-color: #bcdefa; - } - - .sm\:focus\:border-blue-lightest:focus { - border-color: #eff8ff; - } - - .sm\:focus\:border-indigo-darkest:focus { - border-color: #191e38; - } - - .sm\:focus\:border-indigo-darker:focus { - border-color: #2f365f; - } - - .sm\:focus\:border-indigo-dark:focus { - border-color: #5661b3; - } - - .sm\:focus\:border-indigo:focus { - border-color: #6574cd; - } - - .sm\:focus\:border-indigo-light:focus { - border-color: #7886d7; - } - - .sm\:focus\:border-indigo-lighter:focus { - border-color: #b2b7ff; - } - - .sm\:focus\:border-indigo-lightest:focus { - border-color: #e6e8ff; - } - - .sm\:focus\:border-purple-darkest:focus { - border-color: #21183c; - } - - .sm\:focus\:border-purple-darker:focus { - border-color: #382b5f; - } - - .sm\:focus\:border-purple-dark:focus { - border-color: #794acf; - } - - .sm\:focus\:border-purple:focus { - border-color: #9561e2; - } - - .sm\:focus\:border-purple-light:focus { - border-color: #a779e9; - } - - .sm\:focus\:border-purple-lighter:focus { - border-color: #d6bbfc; - } - - .sm\:focus\:border-purple-lightest:focus { - border-color: #f3ebff; - } - - .sm\:focus\:border-pink-darkest:focus { - border-color: #451225; - } - - .sm\:focus\:border-pink-darker:focus { - border-color: #6f213f; - } - - .sm\:focus\:border-pink-dark:focus { - border-color: #eb5286; - } - - .sm\:focus\:border-pink:focus { - border-color: #f66d9b; - } - - .sm\:focus\:border-pink-light:focus { - border-color: #fa7ea8; - } - - .sm\:focus\:border-pink-lighter:focus { - border-color: #ffbbca; - } - - .sm\:focus\:border-pink-lightest:focus { - border-color: #ffebef; - } - - .sm\:rounded-none { - border-radius: 0; - } - - .sm\:rounded-sm { - border-radius: .125rem; - } - - .sm\:rounded { - border-radius: .25rem; - } - - .sm\:rounded-lg { - border-radius: .5rem; - } - - .sm\:rounded-full { - border-radius: 9999px; - } - - .sm\:rounded-t-none { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - - .sm\:rounded-r-none { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - - .sm\:rounded-b-none { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - } - - .sm\:rounded-l-none { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - } - - .sm\:rounded-t-sm { - border-top-left-radius: .125rem; - border-top-right-radius: .125rem; - } - - .sm\:rounded-r-sm { - border-top-right-radius: .125rem; - border-bottom-right-radius: .125rem; - } - - .sm\:rounded-b-sm { - border-bottom-right-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .sm\:rounded-l-sm { - border-top-left-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .sm\:rounded-t { - border-top-left-radius: .25rem; - border-top-right-radius: .25rem; - } - - .sm\:rounded-r { - border-top-right-radius: .25rem; - border-bottom-right-radius: .25rem; - } - - .sm\:rounded-b { - border-bottom-right-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .sm\:rounded-l { - border-top-left-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .sm\:rounded-t-lg { - border-top-left-radius: .5rem; - border-top-right-radius: .5rem; - } - - .sm\:rounded-r-lg { - border-top-right-radius: .5rem; - border-bottom-right-radius: .5rem; - } - - .sm\:rounded-b-lg { - border-bottom-right-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .sm\:rounded-l-lg { - border-top-left-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .sm\:rounded-t-full { - border-top-left-radius: 9999px; - border-top-right-radius: 9999px; - } - - .sm\:rounded-r-full { - border-top-right-radius: 9999px; - border-bottom-right-radius: 9999px; - } - - .sm\:rounded-b-full { - border-bottom-right-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .sm\:rounded-l-full { - border-top-left-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .sm\:rounded-tl-none { - border-top-left-radius: 0; - } - - .sm\:rounded-tr-none { - border-top-right-radius: 0; - } - - .sm\:rounded-br-none { - border-bottom-right-radius: 0; - } - - .sm\:rounded-bl-none { - border-bottom-left-radius: 0; - } - - .sm\:rounded-tl-sm { - border-top-left-radius: .125rem; - } - - .sm\:rounded-tr-sm { - border-top-right-radius: .125rem; - } - - .sm\:rounded-br-sm { - border-bottom-right-radius: .125rem; - } - - .sm\:rounded-bl-sm { - border-bottom-left-radius: .125rem; - } - - .sm\:rounded-tl { - border-top-left-radius: .25rem; - } - - .sm\:rounded-tr { - border-top-right-radius: .25rem; - } - - .sm\:rounded-br { - border-bottom-right-radius: .25rem; - } - - .sm\:rounded-bl { - border-bottom-left-radius: .25rem; - } - - .sm\:rounded-tl-lg { - border-top-left-radius: .5rem; - } - - .sm\:rounded-tr-lg { - border-top-right-radius: .5rem; - } - - .sm\:rounded-br-lg { - border-bottom-right-radius: .5rem; - } - - .sm\:rounded-bl-lg { - border-bottom-left-radius: .5rem; - } - - .sm\:rounded-tl-full { - border-top-left-radius: 9999px; - } - - .sm\:rounded-tr-full { - border-top-right-radius: 9999px; - } - - .sm\:rounded-br-full { - border-bottom-right-radius: 9999px; - } - - .sm\:rounded-bl-full { - border-bottom-left-radius: 9999px; - } - - .sm\:border-solid { - border-style: solid; - } - - .sm\:border-dashed { - border-style: dashed; - } - - .sm\:border-dotted { - border-style: dotted; - } - - .sm\:border-none { - border-style: none; - } - - .sm\:border-0 { - border-width: 0; - } - - .sm\:border-2 { - border-width: 2px; - } - - .sm\:border-4 { - border-width: 4px; - } - - .sm\:border-8 { - border-width: 8px; - } - - .sm\:border { - border-width: 1px; - } - - .sm\:border-t-0 { - border-top-width: 0; - } - - .sm\:border-r-0 { - border-right-width: 0; - } - - .sm\:border-b-0 { - border-bottom-width: 0; - } - - .sm\:border-l-0 { - border-left-width: 0; - } - - .sm\:border-t-2 { - border-top-width: 2px; - } - - .sm\:border-r-2 { - border-right-width: 2px; - } - - .sm\:border-b-2 { - border-bottom-width: 2px; - } - - .sm\:border-l-2 { - border-left-width: 2px; - } - - .sm\:border-t-4 { - border-top-width: 4px; - } - - .sm\:border-r-4 { - border-right-width: 4px; - } - - .sm\:border-b-4 { - border-bottom-width: 4px; - } - - .sm\:border-l-4 { - border-left-width: 4px; - } - - .sm\:border-t-8 { - border-top-width: 8px; - } - - .sm\:border-r-8 { - border-right-width: 8px; - } - - .sm\:border-b-8 { - border-bottom-width: 8px; - } - - .sm\:border-l-8 { - border-left-width: 8px; - } - - .sm\:border-t { - border-top-width: 1px; - } - - .sm\:border-r { - border-right-width: 1px; - } - - .sm\:border-b { - border-bottom-width: 1px; - } - - .sm\:border-l { - border-left-width: 1px; - } - - .sm\:cursor-auto { - cursor: auto; - } - - .sm\:cursor-default { - cursor: default; - } - - .sm\:cursor-pointer { - cursor: pointer; - } - - .sm\:cursor-wait { - cursor: wait; - } - - .sm\:cursor-move { - cursor: move; - } - - .sm\:cursor-not-allowed { - cursor: not-allowed; - } - - .sm\:block { - display: block; - } - - .sm\:inline-block { - display: inline-block; - } - - .sm\:inline { - display: inline; - } - - .sm\:table { - display: table; - } - - .sm\:table-row { - display: table-row; - } - - .sm\:table-cell { - display: table-cell; - } - - .sm\:hidden { - display: none; - } - - .sm\:flex { - display: flex; - } - - .sm\:inline-flex { - display: inline-flex; - } - - .sm\:flex-row { - flex-direction: row; - } - - .sm\:flex-row-reverse { - flex-direction: row-reverse; - } - - .sm\:flex-col { - flex-direction: column; - } - - .sm\:flex-col-reverse { - flex-direction: column-reverse; - } - - .sm\:flex-wrap { - flex-wrap: wrap; - } - - .sm\:flex-wrap-reverse { - flex-wrap: wrap-reverse; - } - - .sm\:flex-no-wrap { - flex-wrap: nowrap; - } - - .sm\:items-start { - align-items: flex-start; - } - - .sm\:items-end { - align-items: flex-end; - } - - .sm\:items-center { - align-items: center; - } - - .sm\:items-baseline { - align-items: baseline; - } - - .sm\:items-stretch { - align-items: stretch; - } - - .sm\:self-auto { - align-self: auto; - } - - .sm\:self-start { - align-self: flex-start; - } - - .sm\:self-end { - align-self: flex-end; - } - - .sm\:self-center { - align-self: center; - } - - .sm\:self-stretch { - align-self: stretch; - } - - .sm\:justify-start { - justify-content: flex-start; - } - - .sm\:justify-end { - justify-content: flex-end; - } - - .sm\:justify-center { - justify-content: center; - } - - .sm\:justify-between { - justify-content: space-between; - } - - .sm\:justify-around { - justify-content: space-around; - } - - .sm\:content-center { - align-content: center; - } - - .sm\:content-start { - align-content: flex-start; - } - - .sm\:content-end { - align-content: flex-end; - } - - .sm\:content-between { - align-content: space-between; - } - - .sm\:content-around { - align-content: space-around; - } - - .sm\:flex-1 { - flex: 1 1 0%; - } - - .sm\:flex-auto { - flex: 1 1 auto; - } - - .sm\:flex-initial { - flex: 0 1 auto; - } - - .sm\:flex-none { - flex: none; - } - - .sm\:flex-grow { - flex-grow: 1; - } - - .sm\:flex-shrink { - flex-shrink: 1; - } - - .sm\:flex-no-grow { - flex-grow: 0; - } - - .sm\:flex-no-shrink { - flex-shrink: 0; - } - - .sm\:float-right { - float: right; - } - - .sm\:float-left { - float: left; - } - - .sm\:float-none { - float: none; - } - - .sm\:clearfix:after { - content: ""; - display: table; - clear: both; - } - - .sm\:font-sans { - font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; - } - - .sm\:font-serif { - font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; - } - - .sm\:font-mono { - font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; - } - - .sm\:font-hairline { - font-weight: 100; - } - - .sm\:font-thin { - font-weight: 200; - } - - .sm\:font-light { - font-weight: 300; - } - - .sm\:font-normal { - font-weight: 400; - } - - .sm\:font-medium { - font-weight: 500; - } - - .sm\:font-semibold { - font-weight: 600; - } - - .sm\:font-bold { - font-weight: 700; - } - - .sm\:font-extrabold { - font-weight: 800; - } - - .sm\:font-black { - font-weight: 900; - } - - .sm\:hover\:font-hairline:hover { - font-weight: 100; - } - - .sm\:hover\:font-thin:hover { - font-weight: 200; - } - - .sm\:hover\:font-light:hover { - font-weight: 300; - } - - .sm\:hover\:font-normal:hover { - font-weight: 400; - } - - .sm\:hover\:font-medium:hover { - font-weight: 500; - } - - .sm\:hover\:font-semibold:hover { - font-weight: 600; - } - - .sm\:hover\:font-bold:hover { - font-weight: 700; - } - - .sm\:hover\:font-extrabold:hover { - font-weight: 800; - } - - .sm\:hover\:font-black:hover { - font-weight: 900; - } - - .sm\:focus\:font-hairline:focus { - font-weight: 100; - } - - .sm\:focus\:font-thin:focus { - font-weight: 200; - } - - .sm\:focus\:font-light:focus { - font-weight: 300; - } - - .sm\:focus\:font-normal:focus { - font-weight: 400; - } - - .sm\:focus\:font-medium:focus { - font-weight: 500; - } - - .sm\:focus\:font-semibold:focus { - font-weight: 600; - } - - .sm\:focus\:font-bold:focus { - font-weight: 700; - } - - .sm\:focus\:font-extrabold:focus { - font-weight: 800; - } - - .sm\:focus\:font-black:focus { - font-weight: 900; - } - - .sm\:h-1 { - height: .25rem; - } - - .sm\:h-2 { - height: .5rem; - } - - .sm\:h-3 { - height: .75rem; - } - - .sm\:h-4 { - height: 1rem; - } - - .sm\:h-5 { - height: 1.25rem; - } - - .sm\:h-6 { - height: 1.5rem; - } - - .sm\:h-8 { - height: 2rem; - } - - .sm\:h-10 { - height: 2.5rem; - } - - .sm\:h-12 { - height: 3rem; - } - - .sm\:h-16 { - height: 4rem; - } - - .sm\:h-24 { - height: 6rem; - } - - .sm\:h-32 { - height: 8rem; - } - - .sm\:h-48 { - height: 12rem; - } - - .sm\:h-64 { - height: 16rem; - } - - .sm\:h-auto { - height: auto; - } - - .sm\:h-px { - height: 1px; - } - - .sm\:h-full { - height: 100%; - } - - .sm\:h-screen { - height: 100vh; - } - - .sm\:leading-none { - line-height: 1; - } - - .sm\:leading-tight { - line-height: 1.25; - } - - .sm\:leading-normal { - line-height: 1.5; - } - - .sm\:leading-loose { - line-height: 2; - } - - .sm\:m-0 { - margin: 0; - } - - .sm\:m-1 { - margin: .25rem; - } - - .sm\:m-2 { - margin: .5rem; - } - - .sm\:m-3 { - margin: .75rem; - } - - .sm\:m-4 { - margin: 1rem; - } - - .sm\:m-5 { - margin: 1.25rem; - } - - .sm\:m-6 { - margin: 1.5rem; - } - - .sm\:m-8 { - margin: 2rem; - } - - .sm\:m-10 { - margin: 2.5rem; - } - - .sm\:m-12 { - margin: 3rem; - } - - .sm\:m-16 { - margin: 4rem; - } - - .sm\:m-20 { - margin: 5rem; - } - - .sm\:m-24 { - margin: 6rem; - } - - .sm\:m-32 { - margin: 8rem; - } - - .sm\:m-auto { - margin: auto; - } - - .sm\:m-px { - margin: 1px; - } - - .sm\:my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .sm\:mx-0 { - margin-left: 0; - margin-right: 0; - } - - .sm\:my-1 { - margin-top: .25rem; - margin-bottom: .25rem; - } - - .sm\:mx-1 { - margin-left: .25rem; - margin-right: .25rem; - } - - .sm\:my-2 { - margin-top: .5rem; - margin-bottom: .5rem; - } - - .sm\:mx-2 { - margin-left: .5rem; - margin-right: .5rem; - } - - .sm\:my-3 { - margin-top: .75rem; - margin-bottom: .75rem; - } - - .sm\:mx-3 { - margin-left: .75rem; - margin-right: .75rem; - } - - .sm\:my-4 { - margin-top: 1rem; - margin-bottom: 1rem; - } - - .sm\:mx-4 { - margin-left: 1rem; - margin-right: 1rem; - } - - .sm\:my-5 { - margin-top: 1.25rem; - margin-bottom: 1.25rem; - } - - .sm\:mx-5 { - margin-left: 1.25rem; - margin-right: 1.25rem; - } - - .sm\:my-6 { - margin-top: 1.5rem; - margin-bottom: 1.5rem; - } - - .sm\:mx-6 { - margin-left: 1.5rem; - margin-right: 1.5rem; - } - - .sm\:my-8 { - margin-top: 2rem; - margin-bottom: 2rem; - } - - .sm\:mx-8 { - margin-left: 2rem; - margin-right: 2rem; - } - - .sm\:my-10 { - margin-top: 2.5rem; - margin-bottom: 2.5rem; - } - - .sm\:mx-10 { - margin-left: 2.5rem; - margin-right: 2.5rem; - } - - .sm\:my-12 { - margin-top: 3rem; - margin-bottom: 3rem; - } - - .sm\:mx-12 { - margin-left: 3rem; - margin-right: 3rem; - } - - .sm\:my-16 { - margin-top: 4rem; - margin-bottom: 4rem; - } - - .sm\:mx-16 { - margin-left: 4rem; - margin-right: 4rem; - } - - .sm\:my-20 { - margin-top: 5rem; - margin-bottom: 5rem; - } - - .sm\:mx-20 { - margin-left: 5rem; - margin-right: 5rem; - } - - .sm\:my-24 { - margin-top: 6rem; - margin-bottom: 6rem; - } - - .sm\:mx-24 { - margin-left: 6rem; - margin-right: 6rem; - } - - .sm\:my-32 { - margin-top: 8rem; - margin-bottom: 8rem; - } - - .sm\:mx-32 { - margin-left: 8rem; - margin-right: 8rem; - } - - .sm\:my-auto { - margin-top: auto; - margin-bottom: auto; - } - - .sm\:mx-auto { - margin-left: auto; - margin-right: auto; - } - - .sm\:my-px { - margin-top: 1px; - margin-bottom: 1px; - } - - .sm\:mx-px { - margin-left: 1px; - margin-right: 1px; - } - - .sm\:mt-0 { - margin-top: 0; - } - - .sm\:mr-0 { - margin-right: 0; - } - - .sm\:mb-0 { - margin-bottom: 0; - } - - .sm\:ml-0 { - margin-left: 0; - } - - .sm\:mt-1 { - margin-top: .25rem; - } - - .sm\:mr-1 { - margin-right: .25rem; - } - - .sm\:mb-1 { - margin-bottom: .25rem; - } - - .sm\:ml-1 { - margin-left: .25rem; - } - - .sm\:mt-2 { - margin-top: .5rem; - } - - .sm\:mr-2 { - margin-right: .5rem; - } - - .sm\:mb-2 { - margin-bottom: .5rem; - } - - .sm\:ml-2 { - margin-left: .5rem; - } - - .sm\:mt-3 { - margin-top: .75rem; - } - - .sm\:mr-3 { - margin-right: .75rem; - } - - .sm\:mb-3 { - margin-bottom: .75rem; - } - - .sm\:ml-3 { - margin-left: .75rem; - } - - .sm\:mt-4 { - margin-top: 1rem; - } - - .sm\:mr-4 { - margin-right: 1rem; - } - - .sm\:mb-4 { - margin-bottom: 1rem; - } - - .sm\:ml-4 { - margin-left: 1rem; - } - - .sm\:mt-5 { - margin-top: 1.25rem; - } - - .sm\:mr-5 { - margin-right: 1.25rem; - } - - .sm\:mb-5 { - margin-bottom: 1.25rem; - } - - .sm\:ml-5 { - margin-left: 1.25rem; - } - - .sm\:mt-6 { - margin-top: 1.5rem; - } - - .sm\:mr-6 { - margin-right: 1.5rem; - } - - .sm\:mb-6 { - margin-bottom: 1.5rem; - } - - .sm\:ml-6 { - margin-left: 1.5rem; - } - - .sm\:mt-8 { - margin-top: 2rem; - } - - .sm\:mr-8 { - margin-right: 2rem; - } - - .sm\:mb-8 { - margin-bottom: 2rem; - } - - .sm\:ml-8 { - margin-left: 2rem; - } - - .sm\:mt-10 { - margin-top: 2.5rem; - } - - .sm\:mr-10 { - margin-right: 2.5rem; - } - - .sm\:mb-10 { - margin-bottom: 2.5rem; - } - - .sm\:ml-10 { - margin-left: 2.5rem; - } - - .sm\:mt-12 { - margin-top: 3rem; - } - - .sm\:mr-12 { - margin-right: 3rem; - } - - .sm\:mb-12 { - margin-bottom: 3rem; - } - - .sm\:ml-12 { - margin-left: 3rem; - } - - .sm\:mt-16 { - margin-top: 4rem; - } - - .sm\:mr-16 { - margin-right: 4rem; - } - - .sm\:mb-16 { - margin-bottom: 4rem; - } - - .sm\:ml-16 { - margin-left: 4rem; - } - - .sm\:mt-20 { - margin-top: 5rem; - } - - .sm\:mr-20 { - margin-right: 5rem; - } - - .sm\:mb-20 { - margin-bottom: 5rem; - } - - .sm\:ml-20 { - margin-left: 5rem; - } - - .sm\:mt-24 { - margin-top: 6rem; - } - - .sm\:mr-24 { - margin-right: 6rem; - } - - .sm\:mb-24 { - margin-bottom: 6rem; - } - - .sm\:ml-24 { - margin-left: 6rem; - } - - .sm\:mt-32 { - margin-top: 8rem; - } - - .sm\:mr-32 { - margin-right: 8rem; - } - - .sm\:mb-32 { - margin-bottom: 8rem; - } - - .sm\:ml-32 { - margin-left: 8rem; - } - - .sm\:mt-auto { - margin-top: auto; - } - - .sm\:mr-auto { - margin-right: auto; - } - - .sm\:mb-auto { - margin-bottom: auto; - } - - .sm\:ml-auto { - margin-left: auto; - } - - .sm\:mt-px { - margin-top: 1px; - } - - .sm\:mr-px { - margin-right: 1px; - } - - .sm\:mb-px { - margin-bottom: 1px; - } - - .sm\:ml-px { - margin-left: 1px; - } - - .sm\:max-h-full { - max-height: 100%; - } - - .sm\:max-h-screen { - max-height: 100vh; - } - - .sm\:max-w-xs { - max-width: 20rem; - } - - .sm\:max-w-sm { - max-width: 30rem; - } - - .sm\:max-w-md { - max-width: 40rem; - } - - .sm\:max-w-lg { - max-width: 50rem; - } - - .sm\:max-w-xl { - max-width: 60rem; - } - - .sm\:max-w-2xl { - max-width: 70rem; - } - - .sm\:max-w-3xl { - max-width: 80rem; - } - - .sm\:max-w-4xl { - max-width: 90rem; - } - - .sm\:max-w-5xl { - max-width: 100rem; - } - - .sm\:max-w-full { - max-width: 100%; - } - - .sm\:min-h-0 { - min-height: 0; - } - - .sm\:min-h-full { - min-height: 100%; - } - - .sm\:min-h-screen { - min-height: 100vh; - } - - .sm\:min-w-0 { - min-width: 0; - } - - .sm\:min-w-full { - min-width: 100%; - } - - .sm\:-m-0 { - margin: 0; - } - - .sm\:-m-1 { - margin: -0.25rem; - } - - .sm\:-m-2 { - margin: -0.5rem; - } - - .sm\:-m-3 { - margin: -0.75rem; - } - - .sm\:-m-4 { - margin: -1rem; - } - - .sm\:-m-5 { - margin: -1.25rem; - } - - .sm\:-m-6 { - margin: -1.5rem; - } - - .sm\:-m-8 { - margin: -2rem; - } - - .sm\:-m-10 { - margin: -2.5rem; - } - - .sm\:-m-12 { - margin: -3rem; - } - - .sm\:-m-16 { - margin: -4rem; - } - - .sm\:-m-20 { - margin: -5rem; - } - - .sm\:-m-24 { - margin: -6rem; - } - - .sm\:-m-32 { - margin: -8rem; - } - - .sm\:-m-px { - margin: -1px; - } - - .sm\:-my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .sm\:-mx-0 { - margin-left: 0; - margin-right: 0; - } - - .sm\:-my-1 { - margin-top: -0.25rem; - margin-bottom: -0.25rem; - } - - .sm\:-mx-1 { - margin-left: -0.25rem; - margin-right: -0.25rem; - } - - .sm\:-my-2 { - margin-top: -0.5rem; - margin-bottom: -0.5rem; - } - - .sm\:-mx-2 { - margin-left: -0.5rem; - margin-right: -0.5rem; - } - - .sm\:-my-3 { - margin-top: -0.75rem; - margin-bottom: -0.75rem; - } - - .sm\:-mx-3 { - margin-left: -0.75rem; - margin-right: -0.75rem; - } - - .sm\:-my-4 { - margin-top: -1rem; - margin-bottom: -1rem; - } - - .sm\:-mx-4 { - margin-left: -1rem; - margin-right: -1rem; - } - - .sm\:-my-5 { - margin-top: -1.25rem; - margin-bottom: -1.25rem; - } - - .sm\:-mx-5 { - margin-left: -1.25rem; - margin-right: -1.25rem; - } - - .sm\:-my-6 { - margin-top: -1.5rem; - margin-bottom: -1.5rem; - } - - .sm\:-mx-6 { - margin-left: -1.5rem; - margin-right: -1.5rem; - } - - .sm\:-my-8 { - margin-top: -2rem; - margin-bottom: -2rem; - } - - .sm\:-mx-8 { - margin-left: -2rem; - margin-right: -2rem; - } - - .sm\:-my-10 { - margin-top: -2.5rem; - margin-bottom: -2.5rem; - } - - .sm\:-mx-10 { - margin-left: -2.5rem; - margin-right: -2.5rem; - } - - .sm\:-my-12 { - margin-top: -3rem; - margin-bottom: -3rem; - } - - .sm\:-mx-12 { - margin-left: -3rem; - margin-right: -3rem; - } - - .sm\:-my-16 { - margin-top: -4rem; - margin-bottom: -4rem; - } - - .sm\:-mx-16 { - margin-left: -4rem; - margin-right: -4rem; - } - - .sm\:-my-20 { - margin-top: -5rem; - margin-bottom: -5rem; - } - - .sm\:-mx-20 { - margin-left: -5rem; - margin-right: -5rem; - } - - .sm\:-my-24 { - margin-top: -6rem; - margin-bottom: -6rem; - } - - .sm\:-mx-24 { - margin-left: -6rem; - margin-right: -6rem; - } - - .sm\:-my-32 { - margin-top: -8rem; - margin-bottom: -8rem; - } - - .sm\:-mx-32 { - margin-left: -8rem; - margin-right: -8rem; - } - - .sm\:-my-px { - margin-top: -1px; - margin-bottom: -1px; - } - - .sm\:-mx-px { - margin-left: -1px; - margin-right: -1px; - } - - .sm\:-mt-0 { - margin-top: 0; - } - - .sm\:-mr-0 { - margin-right: 0; - } - - .sm\:-mb-0 { - margin-bottom: 0; - } - - .sm\:-ml-0 { - margin-left: 0; - } - - .sm\:-mt-1 { - margin-top: -0.25rem; - } - - .sm\:-mr-1 { - margin-right: -0.25rem; - } - - .sm\:-mb-1 { - margin-bottom: -0.25rem; - } - - .sm\:-ml-1 { - margin-left: -0.25rem; - } - - .sm\:-mt-2 { - margin-top: -0.5rem; - } - - .sm\:-mr-2 { - margin-right: -0.5rem; - } - - .sm\:-mb-2 { - margin-bottom: -0.5rem; - } - - .sm\:-ml-2 { - margin-left: -0.5rem; - } - - .sm\:-mt-3 { - margin-top: -0.75rem; - } - - .sm\:-mr-3 { - margin-right: -0.75rem; - } - - .sm\:-mb-3 { - margin-bottom: -0.75rem; - } - - .sm\:-ml-3 { - margin-left: -0.75rem; - } - - .sm\:-mt-4 { - margin-top: -1rem; - } - - .sm\:-mr-4 { - margin-right: -1rem; - } - - .sm\:-mb-4 { - margin-bottom: -1rem; - } - - .sm\:-ml-4 { - margin-left: -1rem; - } - - .sm\:-mt-5 { - margin-top: -1.25rem; - } - - .sm\:-mr-5 { - margin-right: -1.25rem; - } - - .sm\:-mb-5 { - margin-bottom: -1.25rem; - } - - .sm\:-ml-5 { - margin-left: -1.25rem; - } - - .sm\:-mt-6 { - margin-top: -1.5rem; - } - - .sm\:-mr-6 { - margin-right: -1.5rem; - } - - .sm\:-mb-6 { - margin-bottom: -1.5rem; - } - - .sm\:-ml-6 { - margin-left: -1.5rem; - } - - .sm\:-mt-8 { - margin-top: -2rem; - } - - .sm\:-mr-8 { - margin-right: -2rem; - } - - .sm\:-mb-8 { - margin-bottom: -2rem; - } - - .sm\:-ml-8 { - margin-left: -2rem; - } - - .sm\:-mt-10 { - margin-top: -2.5rem; - } - - .sm\:-mr-10 { - margin-right: -2.5rem; - } - - .sm\:-mb-10 { - margin-bottom: -2.5rem; - } - - .sm\:-ml-10 { - margin-left: -2.5rem; - } - - .sm\:-mt-12 { - margin-top: -3rem; - } - - .sm\:-mr-12 { - margin-right: -3rem; - } - - .sm\:-mb-12 { - margin-bottom: -3rem; - } - - .sm\:-ml-12 { - margin-left: -3rem; - } - - .sm\:-mt-16 { - margin-top: -4rem; - } - - .sm\:-mr-16 { - margin-right: -4rem; - } - - .sm\:-mb-16 { - margin-bottom: -4rem; - } - - .sm\:-ml-16 { - margin-left: -4rem; - } - - .sm\:-mt-20 { - margin-top: -5rem; - } - - .sm\:-mr-20 { - margin-right: -5rem; - } - - .sm\:-mb-20 { - margin-bottom: -5rem; - } - - .sm\:-ml-20 { - margin-left: -5rem; - } - - .sm\:-mt-24 { - margin-top: -6rem; - } - - .sm\:-mr-24 { - margin-right: -6rem; - } - - .sm\:-mb-24 { - margin-bottom: -6rem; - } - - .sm\:-ml-24 { - margin-left: -6rem; - } - - .sm\:-mt-32 { - margin-top: -8rem; - } - - .sm\:-mr-32 { - margin-right: -8rem; - } - - .sm\:-mb-32 { - margin-bottom: -8rem; - } - - .sm\:-ml-32 { - margin-left: -8rem; - } - - .sm\:-mt-px { - margin-top: -1px; - } - - .sm\:-mr-px { - margin-right: -1px; - } - - .sm\:-mb-px { - margin-bottom: -1px; - } - - .sm\:-ml-px { - margin-left: -1px; - } - - .sm\:opacity-0 { - opacity: 0; - } - - .sm\:opacity-25 { - opacity: .25; - } - - .sm\:opacity-50 { - opacity: .5; - } - - .sm\:opacity-75 { - opacity: .75; - } - - .sm\:opacity-100 { - opacity: 1; - } - - .sm\:overflow-auto { - overflow: auto; - } - - .sm\:overflow-hidden { - overflow: hidden; - } - - .sm\:overflow-visible { - overflow: visible; - } - - .sm\:overflow-scroll { - overflow: scroll; - } - - .sm\:overflow-x-auto { - overflow-x: auto; - } - - .sm\:overflow-y-auto { - overflow-y: auto; - } - - .sm\:overflow-x-hidden { - overflow-x: hidden; - } - - .sm\:overflow-y-hidden { - overflow-y: hidden; - } - - .sm\:overflow-x-visible { - overflow-x: visible; - } - - .sm\:overflow-y-visible { - overflow-y: visible; - } - - .sm\:overflow-x-scroll { - overflow-x: scroll; - } - - .sm\:overflow-y-scroll { - overflow-y: scroll; - } - - .sm\:scrolling-touch { - -webkit-overflow-scrolling: touch; - } - - .sm\:scrolling-auto { - -webkit-overflow-scrolling: auto; - } - - .sm\:p-0 { - padding: 0; - } - - .sm\:p-1 { - padding: .25rem; - } - - .sm\:p-2 { - padding: .5rem; - } - - .sm\:p-3 { - padding: .75rem; - } - - .sm\:p-4 { - padding: 1rem; - } - - .sm\:p-5 { - padding: 1.25rem; - } - - .sm\:p-6 { - padding: 1.5rem; - } - - .sm\:p-8 { - padding: 2rem; - } - - .sm\:p-10 { - padding: 2.5rem; - } - - .sm\:p-12 { - padding: 3rem; - } - - .sm\:p-16 { - padding: 4rem; - } - - .sm\:p-20 { - padding: 5rem; - } - - .sm\:p-24 { - padding: 6rem; - } - - .sm\:p-32 { - padding: 8rem; - } - - .sm\:p-px { - padding: 1px; - } - - .sm\:py-0 { - padding-top: 0; - padding-bottom: 0; - } - - .sm\:px-0 { - padding-left: 0; - padding-right: 0; - } - - .sm\:py-1 { - padding-top: .25rem; - padding-bottom: .25rem; - } - - .sm\:px-1 { - padding-left: .25rem; - padding-right: .25rem; - } - - .sm\:py-2 { - padding-top: .5rem; - padding-bottom: .5rem; - } - - .sm\:px-2 { - padding-left: .5rem; - padding-right: .5rem; - } - - .sm\:py-3 { - padding-top: .75rem; - padding-bottom: .75rem; - } - - .sm\:px-3 { - padding-left: .75rem; - padding-right: .75rem; - } - - .sm\:py-4 { - padding-top: 1rem; - padding-bottom: 1rem; - } - - .sm\:px-4 { - padding-left: 1rem; - padding-right: 1rem; - } - - .sm\:py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; - } - - .sm\:px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; - } - - .sm\:py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; - } - - .sm\:px-6 { - padding-left: 1.5rem; - padding-right: 1.5rem; - } - - .sm\:py-8 { - padding-top: 2rem; - padding-bottom: 2rem; - } - - .sm\:px-8 { - padding-left: 2rem; - padding-right: 2rem; - } - - .sm\:py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; - } - - .sm\:px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; - } - - .sm\:py-12 { - padding-top: 3rem; - padding-bottom: 3rem; - } - - .sm\:px-12 { - padding-left: 3rem; - padding-right: 3rem; - } - - .sm\:py-16 { - padding-top: 4rem; - padding-bottom: 4rem; - } - - .sm\:px-16 { - padding-left: 4rem; - padding-right: 4rem; - } - - .sm\:py-20 { - padding-top: 5rem; - padding-bottom: 5rem; - } - - .sm\:px-20 { - padding-left: 5rem; - padding-right: 5rem; - } - - .sm\:py-24 { - padding-top: 6rem; - padding-bottom: 6rem; - } - - .sm\:px-24 { - padding-left: 6rem; - padding-right: 6rem; - } - - .sm\:py-32 { - padding-top: 8rem; - padding-bottom: 8rem; - } - - .sm\:px-32 { - padding-left: 8rem; - padding-right: 8rem; - } - - .sm\:py-px { - padding-top: 1px; - padding-bottom: 1px; - } - - .sm\:px-px { - padding-left: 1px; - padding-right: 1px; - } - - .sm\:pt-0 { - padding-top: 0; - } - - .sm\:pr-0 { - padding-right: 0; - } - - .sm\:pb-0 { - padding-bottom: 0; - } - - .sm\:pl-0 { - padding-left: 0; - } - - .sm\:pt-1 { - padding-top: .25rem; - } - - .sm\:pr-1 { - padding-right: .25rem; - } - - .sm\:pb-1 { - padding-bottom: .25rem; - } - - .sm\:pl-1 { - padding-left: .25rem; - } - - .sm\:pt-2 { - padding-top: .5rem; - } - - .sm\:pr-2 { - padding-right: .5rem; - } - - .sm\:pb-2 { - padding-bottom: .5rem; - } - - .sm\:pl-2 { - padding-left: .5rem; - } - - .sm\:pt-3 { - padding-top: .75rem; - } - - .sm\:pr-3 { - padding-right: .75rem; - } - - .sm\:pb-3 { - padding-bottom: .75rem; - } - - .sm\:pl-3 { - padding-left: .75rem; - } - - .sm\:pt-4 { - padding-top: 1rem; - } - - .sm\:pr-4 { - padding-right: 1rem; - } - - .sm\:pb-4 { - padding-bottom: 1rem; - } - - .sm\:pl-4 { - padding-left: 1rem; - } - - .sm\:pt-5 { - padding-top: 1.25rem; - } - - .sm\:pr-5 { - padding-right: 1.25rem; - } - - .sm\:pb-5 { - padding-bottom: 1.25rem; - } - - .sm\:pl-5 { - padding-left: 1.25rem; - } - - .sm\:pt-6 { - padding-top: 1.5rem; - } - - .sm\:pr-6 { - padding-right: 1.5rem; - } - - .sm\:pb-6 { - padding-bottom: 1.5rem; - } - - .sm\:pl-6 { - padding-left: 1.5rem; - } - - .sm\:pt-8 { - padding-top: 2rem; - } - - .sm\:pr-8 { - padding-right: 2rem; - } - - .sm\:pb-8 { - padding-bottom: 2rem; - } - - .sm\:pl-8 { - padding-left: 2rem; - } - - .sm\:pt-10 { - padding-top: 2.5rem; - } - - .sm\:pr-10 { - padding-right: 2.5rem; - } - - .sm\:pb-10 { - padding-bottom: 2.5rem; - } - - .sm\:pl-10 { - padding-left: 2.5rem; - } - - .sm\:pt-12 { - padding-top: 3rem; - } - - .sm\:pr-12 { - padding-right: 3rem; - } - - .sm\:pb-12 { - padding-bottom: 3rem; - } - - .sm\:pl-12 { - padding-left: 3rem; - } - - .sm\:pt-16 { - padding-top: 4rem; - } - - .sm\:pr-16 { - padding-right: 4rem; - } - - .sm\:pb-16 { - padding-bottom: 4rem; - } - - .sm\:pl-16 { - padding-left: 4rem; - } - - .sm\:pt-20 { - padding-top: 5rem; - } - - .sm\:pr-20 { - padding-right: 5rem; - } - - .sm\:pb-20 { - padding-bottom: 5rem; - } - - .sm\:pl-20 { - padding-left: 5rem; - } - - .sm\:pt-24 { - padding-top: 6rem; - } - - .sm\:pr-24 { - padding-right: 6rem; - } - - .sm\:pb-24 { - padding-bottom: 6rem; - } - - .sm\:pl-24 { - padding-left: 6rem; - } - - .sm\:pt-32 { - padding-top: 8rem; - } - - .sm\:pr-32 { - padding-right: 8rem; - } - - .sm\:pb-32 { - padding-bottom: 8rem; - } - - .sm\:pl-32 { - padding-left: 8rem; - } - - .sm\:pt-px { - padding-top: 1px; - } - - .sm\:pr-px { - padding-right: 1px; - } - - .sm\:pb-px { - padding-bottom: 1px; - } - - .sm\:pl-px { - padding-left: 1px; - } - - .sm\:pointer-events-none { - pointer-events: none; - } - - .sm\:pointer-events-auto { - pointer-events: auto; - } - - .sm\:static { - position: static; - } - - .sm\:fixed { - position: fixed; - } - - .sm\:absolute { - position: absolute; - } - - .sm\:relative { - position: relative; - } - - .sm\:sticky { - position: -webkit-sticky; - position: sticky; - } - - .sm\:pin-none { - top: auto; - right: auto; - bottom: auto; - left: auto; - } - - .sm\:pin { - top: 0; - right: 0; - bottom: 0; - left: 0; - } - - .sm\:pin-y { - top: 0; - bottom: 0; - } - - .sm\:pin-x { - right: 0; - left: 0; - } - - .sm\:pin-t { - top: 0; - } - - .sm\:pin-r { - right: 0; - } - - .sm\:pin-b { - bottom: 0; - } - - .sm\:pin-l { - left: 0; - } - - .sm\:resize-none { - resize: none; - } - - .sm\:resize-y { - resize: vertical; - } - - .sm\:resize-x { - resize: horizontal; - } - - .sm\:resize { - resize: both; - } - - .sm\:shadow { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .sm\:shadow-md { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .sm\:shadow-lg { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .sm\:shadow-inner { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .sm\:shadow-outline { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .sm\:shadow-none { - box-shadow: none; - } - - .sm\:hover\:shadow:hover { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .sm\:hover\:shadow-md:hover { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .sm\:hover\:shadow-lg:hover { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .sm\:hover\:shadow-inner:hover { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .sm\:hover\:shadow-outline:hover { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .sm\:hover\:shadow-none:hover { - box-shadow: none; - } - - .sm\:focus\:shadow:focus { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .sm\:focus\:shadow-md:focus { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .sm\:focus\:shadow-lg:focus { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .sm\:focus\:shadow-inner:focus { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .sm\:focus\:shadow-outline:focus { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .sm\:focus\:shadow-none:focus { - box-shadow: none; - } - - .sm\:table-auto { - table-layout: auto; - } - - .sm\:table-fixed { - table-layout: fixed; - } - - .sm\:text-left { - text-align: left; - } - - .sm\:text-center { - text-align: center; - } - - .sm\:text-right { - text-align: right; - } - - .sm\:text-justify { - text-align: justify; - } - - .sm\:text-transparent { - color: transparent; - } - - .sm\:text-black { - color: #22292f; - } - - .sm\:text-grey-darkest { - color: #3d4852; - } - - .sm\:text-grey-darker { - color: #606f7b; - } - - .sm\:text-grey-dark { - color: #8795a1; - } - - .sm\:text-grey { - color: #b8c2cc; - } - - .sm\:text-grey-light { - color: #dae1e7; - } - - .sm\:text-grey-lighter { - color: #f1f5f8; - } - - .sm\:text-grey-lightest { - color: #f8fafc; - } - - .sm\:text-white { - color: #fff; - } - - .sm\:text-red-darkest { - color: #3b0d0c; - } - - .sm\:text-red-darker { - color: #621b18; - } - - .sm\:text-red-dark { - color: #cc1f1a; - } - - .sm\:text-red { - color: #e3342f; - } - - .sm\:text-red-light { - color: #ef5753; - } - - .sm\:text-red-lighter { - color: #f9acaa; - } - - .sm\:text-red-lightest { - color: #fcebea; - } - - .sm\:text-orange-darkest { - color: #462a16; - } - - .sm\:text-orange-darker { - color: #613b1f; - } - - .sm\:text-orange-dark { - color: #de751f; - } - - .sm\:text-orange { - color: #f6993f; - } - - .sm\:text-orange-light { - color: #faad63; - } - - .sm\:text-orange-lighter { - color: #fcd9b6; - } - - .sm\:text-orange-lightest { - color: #fff5eb; - } - - .sm\:text-yellow-darkest { - color: #453411; - } - - .sm\:text-yellow-darker { - color: #684f1d; - } - - .sm\:text-yellow-dark { - color: #f2d024; - } - - .sm\:text-yellow { - color: #ffed4a; - } - - .sm\:text-yellow-light { - color: #fff382; - } - - .sm\:text-yellow-lighter { - color: #fff9c2; - } - - .sm\:text-yellow-lightest { - color: #fcfbeb; - } - - .sm\:text-green-darkest { - color: #0f2f21; - } - - .sm\:text-green-darker { - color: #1a4731; - } - - .sm\:text-green-dark { - color: #1f9d55; - } - - .sm\:text-green { - color: #38c172; - } - - .sm\:text-green-light { - color: #51d88a; - } - - .sm\:text-green-lighter { - color: #a2f5bf; - } - - .sm\:text-green-lightest { - color: #e3fcec; - } - - .sm\:text-teal-darkest { - color: #0d3331; - } - - .sm\:text-teal-darker { - color: #20504f; - } - - .sm\:text-teal-dark { - color: #38a89d; - } - - .sm\:text-teal { - color: #4dc0b5; - } - - .sm\:text-teal-light { - color: #64d5ca; - } - - .sm\:text-teal-lighter { - color: #a0f0ed; - } - - .sm\:text-teal-lightest { - color: #e8fffe; - } - - .sm\:text-blue-darkest { - color: #12283a; - } - - .sm\:text-blue-darker { - color: #1c3d5a; - } - - .sm\:text-blue-dark { - color: #2779bd; - } - - .sm\:text-blue { - color: #3490dc; - } - - .sm\:text-blue-light { - color: #6cb2eb; - } - - .sm\:text-blue-lighter { - color: #bcdefa; - } - - .sm\:text-blue-lightest { - color: #eff8ff; - } - - .sm\:text-indigo-darkest { - color: #191e38; - } - - .sm\:text-indigo-darker { - color: #2f365f; - } - - .sm\:text-indigo-dark { - color: #5661b3; - } - - .sm\:text-indigo { - color: #6574cd; - } - - .sm\:text-indigo-light { - color: #7886d7; - } - - .sm\:text-indigo-lighter { - color: #b2b7ff; - } - - .sm\:text-indigo-lightest { - color: #e6e8ff; - } - - .sm\:text-purple-darkest { - color: #21183c; - } - - .sm\:text-purple-darker { - color: #382b5f; - } - - .sm\:text-purple-dark { - color: #794acf; - } - - .sm\:text-purple { - color: #9561e2; - } - - .sm\:text-purple-light { - color: #a779e9; - } - - .sm\:text-purple-lighter { - color: #d6bbfc; - } - - .sm\:text-purple-lightest { - color: #f3ebff; - } - - .sm\:text-pink-darkest { - color: #451225; - } - - .sm\:text-pink-darker { - color: #6f213f; - } - - .sm\:text-pink-dark { - color: #eb5286; - } - - .sm\:text-pink { - color: #f66d9b; - } - - .sm\:text-pink-light { - color: #fa7ea8; - } - - .sm\:text-pink-lighter { - color: #ffbbca; - } - - .sm\:text-pink-lightest { - color: #ffebef; - } - - .sm\:hover\:text-transparent:hover { - color: transparent; - } - - .sm\:hover\:text-black:hover { - color: #22292f; - } - - .sm\:hover\:text-grey-darkest:hover { - color: #3d4852; - } - - .sm\:hover\:text-grey-darker:hover { - color: #606f7b; - } - - .sm\:hover\:text-grey-dark:hover { - color: #8795a1; - } - - .sm\:hover\:text-grey:hover { - color: #b8c2cc; - } - - .sm\:hover\:text-grey-light:hover { - color: #dae1e7; - } - - .sm\:hover\:text-grey-lighter:hover { - color: #f1f5f8; - } - - .sm\:hover\:text-grey-lightest:hover { - color: #f8fafc; - } - - .sm\:hover\:text-white:hover { - color: #fff; - } - - .sm\:hover\:text-red-darkest:hover { - color: #3b0d0c; - } - - .sm\:hover\:text-red-darker:hover { - color: #621b18; - } - - .sm\:hover\:text-red-dark:hover { - color: #cc1f1a; - } - - .sm\:hover\:text-red:hover { - color: #e3342f; - } - - .sm\:hover\:text-red-light:hover { - color: #ef5753; - } - - .sm\:hover\:text-red-lighter:hover { - color: #f9acaa; - } - - .sm\:hover\:text-red-lightest:hover { - color: #fcebea; - } - - .sm\:hover\:text-orange-darkest:hover { - color: #462a16; - } - - .sm\:hover\:text-orange-darker:hover { - color: #613b1f; - } - - .sm\:hover\:text-orange-dark:hover { - color: #de751f; - } - - .sm\:hover\:text-orange:hover { - color: #f6993f; - } - - .sm\:hover\:text-orange-light:hover { - color: #faad63; - } - - .sm\:hover\:text-orange-lighter:hover { - color: #fcd9b6; - } - - .sm\:hover\:text-orange-lightest:hover { - color: #fff5eb; - } - - .sm\:hover\:text-yellow-darkest:hover { - color: #453411; - } - - .sm\:hover\:text-yellow-darker:hover { - color: #684f1d; - } - - .sm\:hover\:text-yellow-dark:hover { - color: #f2d024; - } - - .sm\:hover\:text-yellow:hover { - color: #ffed4a; - } - - .sm\:hover\:text-yellow-light:hover { - color: #fff382; - } - - .sm\:hover\:text-yellow-lighter:hover { - color: #fff9c2; - } - - .sm\:hover\:text-yellow-lightest:hover { - color: #fcfbeb; - } - - .sm\:hover\:text-green-darkest:hover { - color: #0f2f21; - } - - .sm\:hover\:text-green-darker:hover { - color: #1a4731; - } - - .sm\:hover\:text-green-dark:hover { - color: #1f9d55; - } - - .sm\:hover\:text-green:hover { - color: #38c172; - } - - .sm\:hover\:text-green-light:hover { - color: #51d88a; - } - - .sm\:hover\:text-green-lighter:hover { - color: #a2f5bf; - } - - .sm\:hover\:text-green-lightest:hover { - color: #e3fcec; - } - - .sm\:hover\:text-teal-darkest:hover { - color: #0d3331; - } - - .sm\:hover\:text-teal-darker:hover { - color: #20504f; - } - - .sm\:hover\:text-teal-dark:hover { - color: #38a89d; - } - - .sm\:hover\:text-teal:hover { - color: #4dc0b5; - } - - .sm\:hover\:text-teal-light:hover { - color: #64d5ca; - } - - .sm\:hover\:text-teal-lighter:hover { - color: #a0f0ed; - } - - .sm\:hover\:text-teal-lightest:hover { - color: #e8fffe; - } - - .sm\:hover\:text-blue-darkest:hover { - color: #12283a; - } - - .sm\:hover\:text-blue-darker:hover { - color: #1c3d5a; - } - - .sm\:hover\:text-blue-dark:hover { - color: #2779bd; - } - - .sm\:hover\:text-blue:hover { - color: #3490dc; - } - - .sm\:hover\:text-blue-light:hover { - color: #6cb2eb; - } - - .sm\:hover\:text-blue-lighter:hover { - color: #bcdefa; - } - - .sm\:hover\:text-blue-lightest:hover { - color: #eff8ff; - } - - .sm\:hover\:text-indigo-darkest:hover { - color: #191e38; - } - - .sm\:hover\:text-indigo-darker:hover { - color: #2f365f; - } - - .sm\:hover\:text-indigo-dark:hover { - color: #5661b3; - } - - .sm\:hover\:text-indigo:hover { - color: #6574cd; - } - - .sm\:hover\:text-indigo-light:hover { - color: #7886d7; - } - - .sm\:hover\:text-indigo-lighter:hover { - color: #b2b7ff; - } - - .sm\:hover\:text-indigo-lightest:hover { - color: #e6e8ff; - } - - .sm\:hover\:text-purple-darkest:hover { - color: #21183c; - } - - .sm\:hover\:text-purple-darker:hover { - color: #382b5f; - } - - .sm\:hover\:text-purple-dark:hover { - color: #794acf; - } - - .sm\:hover\:text-purple:hover { - color: #9561e2; - } - - .sm\:hover\:text-purple-light:hover { - color: #a779e9; - } - - .sm\:hover\:text-purple-lighter:hover { - color: #d6bbfc; - } - - .sm\:hover\:text-purple-lightest:hover { - color: #f3ebff; - } - - .sm\:hover\:text-pink-darkest:hover { - color: #451225; - } - - .sm\:hover\:text-pink-darker:hover { - color: #6f213f; - } - - .sm\:hover\:text-pink-dark:hover { - color: #eb5286; - } - - .sm\:hover\:text-pink:hover { - color: #f66d9b; - } - - .sm\:hover\:text-pink-light:hover { - color: #fa7ea8; - } - - .sm\:hover\:text-pink-lighter:hover { - color: #ffbbca; - } - - .sm\:hover\:text-pink-lightest:hover { - color: #ffebef; - } - - .sm\:focus\:text-transparent:focus { - color: transparent; - } - - .sm\:focus\:text-black:focus { - color: #22292f; - } - - .sm\:focus\:text-grey-darkest:focus { - color: #3d4852; - } - - .sm\:focus\:text-grey-darker:focus { - color: #606f7b; - } - - .sm\:focus\:text-grey-dark:focus { - color: #8795a1; - } - - .sm\:focus\:text-grey:focus { - color: #b8c2cc; - } - - .sm\:focus\:text-grey-light:focus { - color: #dae1e7; - } - - .sm\:focus\:text-grey-lighter:focus { - color: #f1f5f8; - } - - .sm\:focus\:text-grey-lightest:focus { - color: #f8fafc; - } - - .sm\:focus\:text-white:focus { - color: #fff; - } - - .sm\:focus\:text-red-darkest:focus { - color: #3b0d0c; - } - - .sm\:focus\:text-red-darker:focus { - color: #621b18; - } - - .sm\:focus\:text-red-dark:focus { - color: #cc1f1a; - } - - .sm\:focus\:text-red:focus { - color: #e3342f; - } - - .sm\:focus\:text-red-light:focus { - color: #ef5753; - } - - .sm\:focus\:text-red-lighter:focus { - color: #f9acaa; - } - - .sm\:focus\:text-red-lightest:focus { - color: #fcebea; - } - - .sm\:focus\:text-orange-darkest:focus { - color: #462a16; - } - - .sm\:focus\:text-orange-darker:focus { - color: #613b1f; - } - - .sm\:focus\:text-orange-dark:focus { - color: #de751f; - } - - .sm\:focus\:text-orange:focus { - color: #f6993f; - } - - .sm\:focus\:text-orange-light:focus { - color: #faad63; - } - - .sm\:focus\:text-orange-lighter:focus { - color: #fcd9b6; - } - - .sm\:focus\:text-orange-lightest:focus { - color: #fff5eb; - } - - .sm\:focus\:text-yellow-darkest:focus { - color: #453411; - } - - .sm\:focus\:text-yellow-darker:focus { - color: #684f1d; - } - - .sm\:focus\:text-yellow-dark:focus { - color: #f2d024; - } - - .sm\:focus\:text-yellow:focus { - color: #ffed4a; - } - - .sm\:focus\:text-yellow-light:focus { - color: #fff382; - } - - .sm\:focus\:text-yellow-lighter:focus { - color: #fff9c2; - } - - .sm\:focus\:text-yellow-lightest:focus { - color: #fcfbeb; - } - - .sm\:focus\:text-green-darkest:focus { - color: #0f2f21; - } - - .sm\:focus\:text-green-darker:focus { - color: #1a4731; - } - - .sm\:focus\:text-green-dark:focus { - color: #1f9d55; - } - - .sm\:focus\:text-green:focus { - color: #38c172; - } - - .sm\:focus\:text-green-light:focus { - color: #51d88a; - } - - .sm\:focus\:text-green-lighter:focus { - color: #a2f5bf; - } - - .sm\:focus\:text-green-lightest:focus { - color: #e3fcec; - } - - .sm\:focus\:text-teal-darkest:focus { - color: #0d3331; - } - - .sm\:focus\:text-teal-darker:focus { - color: #20504f; - } - - .sm\:focus\:text-teal-dark:focus { - color: #38a89d; - } - - .sm\:focus\:text-teal:focus { - color: #4dc0b5; - } - - .sm\:focus\:text-teal-light:focus { - color: #64d5ca; - } - - .sm\:focus\:text-teal-lighter:focus { - color: #a0f0ed; - } - - .sm\:focus\:text-teal-lightest:focus { - color: #e8fffe; - } - - .sm\:focus\:text-blue-darkest:focus { - color: #12283a; - } - - .sm\:focus\:text-blue-darker:focus { - color: #1c3d5a; - } - - .sm\:focus\:text-blue-dark:focus { - color: #2779bd; - } - - .sm\:focus\:text-blue:focus { - color: #3490dc; - } - - .sm\:focus\:text-blue-light:focus { - color: #6cb2eb; - } - - .sm\:focus\:text-blue-lighter:focus { - color: #bcdefa; - } - - .sm\:focus\:text-blue-lightest:focus { - color: #eff8ff; - } - - .sm\:focus\:text-indigo-darkest:focus { - color: #191e38; - } - - .sm\:focus\:text-indigo-darker:focus { - color: #2f365f; - } - - .sm\:focus\:text-indigo-dark:focus { - color: #5661b3; - } - - .sm\:focus\:text-indigo:focus { - color: #6574cd; - } - - .sm\:focus\:text-indigo-light:focus { - color: #7886d7; - } - - .sm\:focus\:text-indigo-lighter:focus { - color: #b2b7ff; - } - - .sm\:focus\:text-indigo-lightest:focus { - color: #e6e8ff; - } - - .sm\:focus\:text-purple-darkest:focus { - color: #21183c; - } - - .sm\:focus\:text-purple-darker:focus { - color: #382b5f; - } - - .sm\:focus\:text-purple-dark:focus { - color: #794acf; - } - - .sm\:focus\:text-purple:focus { - color: #9561e2; - } - - .sm\:focus\:text-purple-light:focus { - color: #a779e9; - } - - .sm\:focus\:text-purple-lighter:focus { - color: #d6bbfc; - } - - .sm\:focus\:text-purple-lightest:focus { - color: #f3ebff; - } - - .sm\:focus\:text-pink-darkest:focus { - color: #451225; - } - - .sm\:focus\:text-pink-darker:focus { - color: #6f213f; - } - - .sm\:focus\:text-pink-dark:focus { - color: #eb5286; - } - - .sm\:focus\:text-pink:focus { - color: #f66d9b; - } - - .sm\:focus\:text-pink-light:focus { - color: #fa7ea8; - } - - .sm\:focus\:text-pink-lighter:focus { - color: #ffbbca; - } - - .sm\:focus\:text-pink-lightest:focus { - color: #ffebef; - } - - .sm\:text-xs { - font-size: .75rem; - } - - .sm\:text-sm { - font-size: .875rem; - } - - .sm\:text-base { - font-size: 1rem; - } - - .sm\:text-lg { - font-size: 1.125rem; - } - - .sm\:text-xl { - font-size: 1.25rem; - } - - .sm\:text-2xl { - font-size: 1.5rem; - } - - .sm\:text-3xl { - font-size: 1.875rem; - } - - .sm\:text-4xl { - font-size: 2.25rem; - } - - .sm\:text-5xl { - font-size: 3rem; - } - - .sm\:italic { - font-style: italic; - } - - .sm\:roman { - font-style: normal; - } - - .sm\:uppercase { - text-transform: uppercase; - } - - .sm\:lowercase { - text-transform: lowercase; - } - - .sm\:capitalize { - text-transform: capitalize; - } - - .sm\:normal-case { - text-transform: none; - } - - .sm\:underline { - text-decoration: underline; - } - - .sm\:line-through { - text-decoration: line-through; - } - - .sm\:no-underline { - text-decoration: none; - } - - .sm\:antialiased { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .sm\:subpixel-antialiased { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .sm\:hover\:italic:hover { - font-style: italic; - } - - .sm\:hover\:roman:hover { - font-style: normal; - } - - .sm\:hover\:uppercase:hover { - text-transform: uppercase; - } - - .sm\:hover\:lowercase:hover { - text-transform: lowercase; - } - - .sm\:hover\:capitalize:hover { - text-transform: capitalize; - } - - .sm\:hover\:normal-case:hover { - text-transform: none; - } - - .sm\:hover\:underline:hover { - text-decoration: underline; - } - - .sm\:hover\:line-through:hover { - text-decoration: line-through; - } - - .sm\:hover\:no-underline:hover { - text-decoration: none; - } - - .sm\:hover\:antialiased:hover { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .sm\:hover\:subpixel-antialiased:hover { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .sm\:focus\:italic:focus { - font-style: italic; - } - - .sm\:focus\:roman:focus { - font-style: normal; - } - - .sm\:focus\:uppercase:focus { - text-transform: uppercase; - } - - .sm\:focus\:lowercase:focus { - text-transform: lowercase; - } - - .sm\:focus\:capitalize:focus { - text-transform: capitalize; - } - - .sm\:focus\:normal-case:focus { - text-transform: none; - } - - .sm\:focus\:underline:focus { - text-decoration: underline; - } - - .sm\:focus\:line-through:focus { - text-decoration: line-through; - } - - .sm\:focus\:no-underline:focus { - text-decoration: none; - } - - .sm\:focus\:antialiased:focus { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .sm\:focus\:subpixel-antialiased:focus { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .sm\:tracking-tight { - letter-spacing: -0.05em; - } - - .sm\:tracking-normal { - letter-spacing: 0; - } - - .sm\:tracking-wide { - letter-spacing: .05em; - } - - .sm\:select-none { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } - - .sm\:select-text { - -webkit-user-select: text; - -moz-user-select: text; - -ms-user-select: text; - user-select: text; - } - - .sm\:align-baseline { - vertical-align: baseline; - } - - .sm\:align-top { - vertical-align: top; - } - - .sm\:align-middle { - vertical-align: middle; - } - - .sm\:align-bottom { - vertical-align: bottom; - } - - .sm\:align-text-top { - vertical-align: text-top; - } - - .sm\:align-text-bottom { - vertical-align: text-bottom; - } - - .sm\:visible { - visibility: visible; - } - - .sm\:invisible { - visibility: hidden; - } - - .sm\:whitespace-normal { - white-space: normal; - } - - .sm\:whitespace-no-wrap { - white-space: nowrap; - } - - .sm\:whitespace-pre { - white-space: pre; - } - - .sm\:whitespace-pre-line { - white-space: pre-line; - } - - .sm\:whitespace-pre-wrap { - white-space: pre-wrap; - } - - .sm\:break-words { - word-wrap: break-word; - } - - .sm\:break-normal { - word-wrap: normal; - } - - .sm\:truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - .sm\:w-1 { - width: .25rem; - } - - .sm\:w-2 { - width: .5rem; - } - - .sm\:w-3 { - width: .75rem; - } - - .sm\:w-4 { - width: 1rem; - } - - .sm\:w-5 { - width: 1.25rem; - } - - .sm\:w-6 { - width: 1.5rem; - } - - .sm\:w-8 { - width: 2rem; - } - - .sm\:w-10 { - width: 2.5rem; - } - - .sm\:w-12 { - width: 3rem; - } - - .sm\:w-16 { - width: 4rem; - } - - .sm\:w-24 { - width: 6rem; - } - - .sm\:w-32 { - width: 8rem; - } - - .sm\:w-48 { - width: 12rem; - } - - .sm\:w-64 { - width: 16rem; - } - - .sm\:w-auto { - width: auto; - } - - .sm\:w-px { - width: 1px; - } - - .sm\:w-1\/2 { - width: 50%; - } - - .sm\:w-1\/3 { - width: 33.33333%; - } - - .sm\:w-2\/3 { - width: 66.66667%; - } - - .sm\:w-1\/4 { - width: 25%; - } - - .sm\:w-3\/4 { - width: 75%; - } - - .sm\:w-1\/5 { - width: 20%; - } - - .sm\:w-2\/5 { - width: 40%; - } - - .sm\:w-3\/5 { - width: 60%; - } - - .sm\:w-4\/5 { - width: 80%; - } - - .sm\:w-1\/6 { - width: 16.66667%; - } - - .sm\:w-5\/6 { - width: 83.33333%; - } - - .sm\:w-full { - width: 100%; - } - - .sm\:w-screen { - width: 100vw; - } - - .sm\:z-0 { - z-index: 0; - } - - .sm\:z-10 { - z-index: 10; - } - - .sm\:z-20 { - z-index: 20; - } - - .sm\:z-30 { - z-index: 30; - } - - .sm\:z-40 { - z-index: 40; - } - - .sm\:z-50 { - z-index: 50; - } - - .sm\:z-auto { - z-index: auto; - } -} - -@media (min-width: 768px) { - .md\:list-reset { - list-style: none; - padding: 0; - } - - .md\:appearance-none { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - } - - .md\:bg-fixed { - background-attachment: fixed; - } - - .md\:bg-local { - background-attachment: local; - } - - .md\:bg-scroll { - background-attachment: scroll; - } - - .md\:bg-transparent { - background-color: transparent; - } - - .md\:bg-black { - background-color: #22292f; - } - - .md\:bg-grey-darkest { - background-color: #3d4852; - } - - .md\:bg-grey-darker { - background-color: #606f7b; - } - - .md\:bg-grey-dark { - background-color: #8795a1; - } - - .md\:bg-grey { - background-color: #b8c2cc; - } - - .md\:bg-grey-light { - background-color: #dae1e7; - } - - .md\:bg-grey-lighter { - background-color: #f1f5f8; - } - - .md\:bg-grey-lightest { - background-color: #f8fafc; - } - - .md\:bg-white { - background-color: #fff; - } - - .md\:bg-red-darkest { - background-color: #3b0d0c; - } - - .md\:bg-red-darker { - background-color: #621b18; - } - - .md\:bg-red-dark { - background-color: #cc1f1a; - } - - .md\:bg-red { - background-color: #e3342f; - } - - .md\:bg-red-light { - background-color: #ef5753; - } - - .md\:bg-red-lighter { - background-color: #f9acaa; - } - - .md\:bg-red-lightest { - background-color: #fcebea; - } - - .md\:bg-orange-darkest { - background-color: #462a16; - } - - .md\:bg-orange-darker { - background-color: #613b1f; - } - - .md\:bg-orange-dark { - background-color: #de751f; - } - - .md\:bg-orange { - background-color: #f6993f; - } - - .md\:bg-orange-light { - background-color: #faad63; - } - - .md\:bg-orange-lighter { - background-color: #fcd9b6; - } - - .md\:bg-orange-lightest { - background-color: #fff5eb; - } - - .md\:bg-yellow-darkest { - background-color: #453411; - } - - .md\:bg-yellow-darker { - background-color: #684f1d; - } - - .md\:bg-yellow-dark { - background-color: #f2d024; - } - - .md\:bg-yellow { - background-color: #ffed4a; - } - - .md\:bg-yellow-light { - background-color: #fff382; - } - - .md\:bg-yellow-lighter { - background-color: #fff9c2; - } - - .md\:bg-yellow-lightest { - background-color: #fcfbeb; - } - - .md\:bg-green-darkest { - background-color: #0f2f21; - } - - .md\:bg-green-darker { - background-color: #1a4731; - } - - .md\:bg-green-dark { - background-color: #1f9d55; - } - - .md\:bg-green { - background-color: #38c172; - } - - .md\:bg-green-light { - background-color: #51d88a; - } - - .md\:bg-green-lighter { - background-color: #a2f5bf; - } - - .md\:bg-green-lightest { - background-color: #e3fcec; - } - - .md\:bg-teal-darkest { - background-color: #0d3331; - } - - .md\:bg-teal-darker { - background-color: #20504f; - } - - .md\:bg-teal-dark { - background-color: #38a89d; - } - - .md\:bg-teal { - background-color: #4dc0b5; - } - - .md\:bg-teal-light { - background-color: #64d5ca; - } - - .md\:bg-teal-lighter { - background-color: #a0f0ed; - } - - .md\:bg-teal-lightest { - background-color: #e8fffe; - } - - .md\:bg-blue-darkest { - background-color: #12283a; - } - - .md\:bg-blue-darker { - background-color: #1c3d5a; - } - - .md\:bg-blue-dark { - background-color: #2779bd; - } - - .md\:bg-blue { - background-color: #3490dc; - } - - .md\:bg-blue-light { - background-color: #6cb2eb; - } - - .md\:bg-blue-lighter { - background-color: #bcdefa; - } - - .md\:bg-blue-lightest { - background-color: #eff8ff; - } - - .md\:bg-indigo-darkest { - background-color: #191e38; - } - - .md\:bg-indigo-darker { - background-color: #2f365f; - } - - .md\:bg-indigo-dark { - background-color: #5661b3; - } - - .md\:bg-indigo { - background-color: #6574cd; - } - - .md\:bg-indigo-light { - background-color: #7886d7; - } - - .md\:bg-indigo-lighter { - background-color: #b2b7ff; - } - - .md\:bg-indigo-lightest { - background-color: #e6e8ff; - } - - .md\:bg-purple-darkest { - background-color: #21183c; - } - - .md\:bg-purple-darker { - background-color: #382b5f; - } - - .md\:bg-purple-dark { - background-color: #794acf; - } - - .md\:bg-purple { - background-color: #9561e2; - } - - .md\:bg-purple-light { - background-color: #a779e9; - } - - .md\:bg-purple-lighter { - background-color: #d6bbfc; - } - - .md\:bg-purple-lightest { - background-color: #f3ebff; - } - - .md\:bg-pink-darkest { - background-color: #451225; - } - - .md\:bg-pink-darker { - background-color: #6f213f; - } - - .md\:bg-pink-dark { - background-color: #eb5286; - } - - .md\:bg-pink { - background-color: #f66d9b; - } - - .md\:bg-pink-light { - background-color: #fa7ea8; - } - - .md\:bg-pink-lighter { - background-color: #ffbbca; - } - - .md\:bg-pink-lightest { - background-color: #ffebef; - } - - .md\:hover\:bg-transparent:hover { - background-color: transparent; - } - - .md\:hover\:bg-black:hover { - background-color: #22292f; - } - - .md\:hover\:bg-grey-darkest:hover { - background-color: #3d4852; - } - - .md\:hover\:bg-grey-darker:hover { - background-color: #606f7b; - } - - .md\:hover\:bg-grey-dark:hover { - background-color: #8795a1; - } - - .md\:hover\:bg-grey:hover { - background-color: #b8c2cc; - } - - .md\:hover\:bg-grey-light:hover { - background-color: #dae1e7; - } - - .md\:hover\:bg-grey-lighter:hover { - background-color: #f1f5f8; - } - - .md\:hover\:bg-grey-lightest:hover { - background-color: #f8fafc; - } - - .md\:hover\:bg-white:hover { - background-color: #fff; - } - - .md\:hover\:bg-red-darkest:hover { - background-color: #3b0d0c; - } - - .md\:hover\:bg-red-darker:hover { - background-color: #621b18; - } - - .md\:hover\:bg-red-dark:hover { - background-color: #cc1f1a; - } - - .md\:hover\:bg-red:hover { - background-color: #e3342f; - } - - .md\:hover\:bg-red-light:hover { - background-color: #ef5753; - } - - .md\:hover\:bg-red-lighter:hover { - background-color: #f9acaa; - } - - .md\:hover\:bg-red-lightest:hover { - background-color: #fcebea; - } - - .md\:hover\:bg-orange-darkest:hover { - background-color: #462a16; - } - - .md\:hover\:bg-orange-darker:hover { - background-color: #613b1f; - } - - .md\:hover\:bg-orange-dark:hover { - background-color: #de751f; - } - - .md\:hover\:bg-orange:hover { - background-color: #f6993f; - } - - .md\:hover\:bg-orange-light:hover { - background-color: #faad63; - } - - .md\:hover\:bg-orange-lighter:hover { - background-color: #fcd9b6; - } - - .md\:hover\:bg-orange-lightest:hover { - background-color: #fff5eb; - } - - .md\:hover\:bg-yellow-darkest:hover { - background-color: #453411; - } - - .md\:hover\:bg-yellow-darker:hover { - background-color: #684f1d; - } - - .md\:hover\:bg-yellow-dark:hover { - background-color: #f2d024; - } - - .md\:hover\:bg-yellow:hover { - background-color: #ffed4a; - } - - .md\:hover\:bg-yellow-light:hover { - background-color: #fff382; - } - - .md\:hover\:bg-yellow-lighter:hover { - background-color: #fff9c2; - } - - .md\:hover\:bg-yellow-lightest:hover { - background-color: #fcfbeb; - } - - .md\:hover\:bg-green-darkest:hover { - background-color: #0f2f21; - } - - .md\:hover\:bg-green-darker:hover { - background-color: #1a4731; - } - - .md\:hover\:bg-green-dark:hover { - background-color: #1f9d55; - } - - .md\:hover\:bg-green:hover { - background-color: #38c172; - } - - .md\:hover\:bg-green-light:hover { - background-color: #51d88a; - } - - .md\:hover\:bg-green-lighter:hover { - background-color: #a2f5bf; - } - - .md\:hover\:bg-green-lightest:hover { - background-color: #e3fcec; - } - - .md\:hover\:bg-teal-darkest:hover { - background-color: #0d3331; - } - - .md\:hover\:bg-teal-darker:hover { - background-color: #20504f; - } - - .md\:hover\:bg-teal-dark:hover { - background-color: #38a89d; - } - - .md\:hover\:bg-teal:hover { - background-color: #4dc0b5; - } - - .md\:hover\:bg-teal-light:hover { - background-color: #64d5ca; - } - - .md\:hover\:bg-teal-lighter:hover { - background-color: #a0f0ed; - } - - .md\:hover\:bg-teal-lightest:hover { - background-color: #e8fffe; - } - - .md\:hover\:bg-blue-darkest:hover { - background-color: #12283a; - } - - .md\:hover\:bg-blue-darker:hover { - background-color: #1c3d5a; - } - - .md\:hover\:bg-blue-dark:hover { - background-color: #2779bd; - } - - .md\:hover\:bg-blue:hover { - background-color: #3490dc; - } - - .md\:hover\:bg-blue-light:hover { - background-color: #6cb2eb; - } - - .md\:hover\:bg-blue-lighter:hover { - background-color: #bcdefa; - } - - .md\:hover\:bg-blue-lightest:hover { - background-color: #eff8ff; - } - - .md\:hover\:bg-indigo-darkest:hover { - background-color: #191e38; - } - - .md\:hover\:bg-indigo-darker:hover { - background-color: #2f365f; - } - - .md\:hover\:bg-indigo-dark:hover { - background-color: #5661b3; - } - - .md\:hover\:bg-indigo:hover { - background-color: #6574cd; - } - - .md\:hover\:bg-indigo-light:hover { - background-color: #7886d7; - } - - .md\:hover\:bg-indigo-lighter:hover { - background-color: #b2b7ff; - } - - .md\:hover\:bg-indigo-lightest:hover { - background-color: #e6e8ff; - } - - .md\:hover\:bg-purple-darkest:hover { - background-color: #21183c; - } - - .md\:hover\:bg-purple-darker:hover { - background-color: #382b5f; - } - - .md\:hover\:bg-purple-dark:hover { - background-color: #794acf; - } - - .md\:hover\:bg-purple:hover { - background-color: #9561e2; - } - - .md\:hover\:bg-purple-light:hover { - background-color: #a779e9; - } - - .md\:hover\:bg-purple-lighter:hover { - background-color: #d6bbfc; - } - - .md\:hover\:bg-purple-lightest:hover { - background-color: #f3ebff; - } - - .md\:hover\:bg-pink-darkest:hover { - background-color: #451225; - } - - .md\:hover\:bg-pink-darker:hover { - background-color: #6f213f; - } - - .md\:hover\:bg-pink-dark:hover { - background-color: #eb5286; - } - - .md\:hover\:bg-pink:hover { - background-color: #f66d9b; - } - - .md\:hover\:bg-pink-light:hover { - background-color: #fa7ea8; - } - - .md\:hover\:bg-pink-lighter:hover { - background-color: #ffbbca; - } - - .md\:hover\:bg-pink-lightest:hover { - background-color: #ffebef; - } - - .md\:focus\:bg-transparent:focus { - background-color: transparent; - } - - .md\:focus\:bg-black:focus { - background-color: #22292f; - } - - .md\:focus\:bg-grey-darkest:focus { - background-color: #3d4852; - } - - .md\:focus\:bg-grey-darker:focus { - background-color: #606f7b; - } - - .md\:focus\:bg-grey-dark:focus { - background-color: #8795a1; - } - - .md\:focus\:bg-grey:focus { - background-color: #b8c2cc; - } - - .md\:focus\:bg-grey-light:focus { - background-color: #dae1e7; - } - - .md\:focus\:bg-grey-lighter:focus { - background-color: #f1f5f8; - } - - .md\:focus\:bg-grey-lightest:focus { - background-color: #f8fafc; - } - - .md\:focus\:bg-white:focus { - background-color: #fff; - } - - .md\:focus\:bg-red-darkest:focus { - background-color: #3b0d0c; - } - - .md\:focus\:bg-red-darker:focus { - background-color: #621b18; - } - - .md\:focus\:bg-red-dark:focus { - background-color: #cc1f1a; - } - - .md\:focus\:bg-red:focus { - background-color: #e3342f; - } - - .md\:focus\:bg-red-light:focus { - background-color: #ef5753; - } - - .md\:focus\:bg-red-lighter:focus { - background-color: #f9acaa; - } - - .md\:focus\:bg-red-lightest:focus { - background-color: #fcebea; - } - - .md\:focus\:bg-orange-darkest:focus { - background-color: #462a16; - } - - .md\:focus\:bg-orange-darker:focus { - background-color: #613b1f; - } - - .md\:focus\:bg-orange-dark:focus { - background-color: #de751f; - } - - .md\:focus\:bg-orange:focus { - background-color: #f6993f; - } - - .md\:focus\:bg-orange-light:focus { - background-color: #faad63; - } - - .md\:focus\:bg-orange-lighter:focus { - background-color: #fcd9b6; - } - - .md\:focus\:bg-orange-lightest:focus { - background-color: #fff5eb; - } - - .md\:focus\:bg-yellow-darkest:focus { - background-color: #453411; - } - - .md\:focus\:bg-yellow-darker:focus { - background-color: #684f1d; - } - - .md\:focus\:bg-yellow-dark:focus { - background-color: #f2d024; - } - - .md\:focus\:bg-yellow:focus { - background-color: #ffed4a; - } - - .md\:focus\:bg-yellow-light:focus { - background-color: #fff382; - } - - .md\:focus\:bg-yellow-lighter:focus { - background-color: #fff9c2; - } - - .md\:focus\:bg-yellow-lightest:focus { - background-color: #fcfbeb; - } - - .md\:focus\:bg-green-darkest:focus { - background-color: #0f2f21; - } - - .md\:focus\:bg-green-darker:focus { - background-color: #1a4731; - } - - .md\:focus\:bg-green-dark:focus { - background-color: #1f9d55; - } - - .md\:focus\:bg-green:focus { - background-color: #38c172; - } - - .md\:focus\:bg-green-light:focus { - background-color: #51d88a; - } - - .md\:focus\:bg-green-lighter:focus { - background-color: #a2f5bf; - } - - .md\:focus\:bg-green-lightest:focus { - background-color: #e3fcec; - } - - .md\:focus\:bg-teal-darkest:focus { - background-color: #0d3331; - } - - .md\:focus\:bg-teal-darker:focus { - background-color: #20504f; - } - - .md\:focus\:bg-teal-dark:focus { - background-color: #38a89d; - } - - .md\:focus\:bg-teal:focus { - background-color: #4dc0b5; - } - - .md\:focus\:bg-teal-light:focus { - background-color: #64d5ca; - } - - .md\:focus\:bg-teal-lighter:focus { - background-color: #a0f0ed; - } - - .md\:focus\:bg-teal-lightest:focus { - background-color: #e8fffe; - } - - .md\:focus\:bg-blue-darkest:focus { - background-color: #12283a; - } - - .md\:focus\:bg-blue-darker:focus { - background-color: #1c3d5a; - } - - .md\:focus\:bg-blue-dark:focus { - background-color: #2779bd; - } - - .md\:focus\:bg-blue:focus { - background-color: #3490dc; - } - - .md\:focus\:bg-blue-light:focus { - background-color: #6cb2eb; - } - - .md\:focus\:bg-blue-lighter:focus { - background-color: #bcdefa; - } - - .md\:focus\:bg-blue-lightest:focus { - background-color: #eff8ff; - } - - .md\:focus\:bg-indigo-darkest:focus { - background-color: #191e38; - } - - .md\:focus\:bg-indigo-darker:focus { - background-color: #2f365f; - } - - .md\:focus\:bg-indigo-dark:focus { - background-color: #5661b3; - } - - .md\:focus\:bg-indigo:focus { - background-color: #6574cd; - } - - .md\:focus\:bg-indigo-light:focus { - background-color: #7886d7; - } - - .md\:focus\:bg-indigo-lighter:focus { - background-color: #b2b7ff; - } - - .md\:focus\:bg-indigo-lightest:focus { - background-color: #e6e8ff; - } - - .md\:focus\:bg-purple-darkest:focus { - background-color: #21183c; - } - - .md\:focus\:bg-purple-darker:focus { - background-color: #382b5f; - } - - .md\:focus\:bg-purple-dark:focus { - background-color: #794acf; - } - - .md\:focus\:bg-purple:focus { - background-color: #9561e2; - } - - .md\:focus\:bg-purple-light:focus { - background-color: #a779e9; - } - - .md\:focus\:bg-purple-lighter:focus { - background-color: #d6bbfc; - } - - .md\:focus\:bg-purple-lightest:focus { - background-color: #f3ebff; - } - - .md\:focus\:bg-pink-darkest:focus { - background-color: #451225; - } - - .md\:focus\:bg-pink-darker:focus { - background-color: #6f213f; - } - - .md\:focus\:bg-pink-dark:focus { - background-color: #eb5286; - } - - .md\:focus\:bg-pink:focus { - background-color: #f66d9b; - } - - .md\:focus\:bg-pink-light:focus { - background-color: #fa7ea8; - } - - .md\:focus\:bg-pink-lighter:focus { - background-color: #ffbbca; - } - - .md\:focus\:bg-pink-lightest:focus { - background-color: #ffebef; - } - - .md\:bg-bottom { - background-position: bottom; - } - - .md\:bg-center { - background-position: center; - } - - .md\:bg-left { - background-position: left; - } - - .md\:bg-left-bottom { - background-position: left bottom; - } - - .md\:bg-left-top { - background-position: left top; - } - - .md\:bg-right { - background-position: right; - } - - .md\:bg-right-bottom { - background-position: right bottom; - } - - .md\:bg-right-top { - background-position: right top; - } - - .md\:bg-top { - background-position: top; - } - - .md\:bg-repeat { - background-repeat: repeat; - } - - .md\:bg-no-repeat { - background-repeat: no-repeat; - } - - .md\:bg-repeat-x { - background-repeat: repeat-x; - } - - .md\:bg-repeat-y { - background-repeat: repeat-y; - } - - .md\:bg-auto { - background-size: auto; - } - - .md\:bg-cover { - background-size: cover; - } - - .md\:bg-contain { - background-size: contain; - } - - .md\:border-transparent { - border-color: transparent; - } - - .md\:border-black { - border-color: #22292f; - } - - .md\:border-grey-darkest { - border-color: #3d4852; - } - - .md\:border-grey-darker { - border-color: #606f7b; - } - - .md\:border-grey-dark { - border-color: #8795a1; - } - - .md\:border-grey { - border-color: #b8c2cc; - } - - .md\:border-grey-light { - border-color: #dae1e7; - } - - .md\:border-grey-lighter { - border-color: #f1f5f8; - } - - .md\:border-grey-lightest { - border-color: #f8fafc; - } - - .md\:border-white { - border-color: #fff; - } - - .md\:border-red-darkest { - border-color: #3b0d0c; - } - - .md\:border-red-darker { - border-color: #621b18; - } - - .md\:border-red-dark { - border-color: #cc1f1a; - } - - .md\:border-red { - border-color: #e3342f; - } - - .md\:border-red-light { - border-color: #ef5753; - } - - .md\:border-red-lighter { - border-color: #f9acaa; - } - - .md\:border-red-lightest { - border-color: #fcebea; - } - - .md\:border-orange-darkest { - border-color: #462a16; - } - - .md\:border-orange-darker { - border-color: #613b1f; - } - - .md\:border-orange-dark { - border-color: #de751f; - } - - .md\:border-orange { - border-color: #f6993f; - } - - .md\:border-orange-light { - border-color: #faad63; - } - - .md\:border-orange-lighter { - border-color: #fcd9b6; - } - - .md\:border-orange-lightest { - border-color: #fff5eb; - } - - .md\:border-yellow-darkest { - border-color: #453411; - } - - .md\:border-yellow-darker { - border-color: #684f1d; - } - - .md\:border-yellow-dark { - border-color: #f2d024; - } - - .md\:border-yellow { - border-color: #ffed4a; - } - - .md\:border-yellow-light { - border-color: #fff382; - } - - .md\:border-yellow-lighter { - border-color: #fff9c2; - } - - .md\:border-yellow-lightest { - border-color: #fcfbeb; - } - - .md\:border-green-darkest { - border-color: #0f2f21; - } - - .md\:border-green-darker { - border-color: #1a4731; - } - - .md\:border-green-dark { - border-color: #1f9d55; - } - - .md\:border-green { - border-color: #38c172; - } - - .md\:border-green-light { - border-color: #51d88a; - } - - .md\:border-green-lighter { - border-color: #a2f5bf; - } - - .md\:border-green-lightest { - border-color: #e3fcec; - } - - .md\:border-teal-darkest { - border-color: #0d3331; - } - - .md\:border-teal-darker { - border-color: #20504f; - } - - .md\:border-teal-dark { - border-color: #38a89d; - } - - .md\:border-teal { - border-color: #4dc0b5; - } - - .md\:border-teal-light { - border-color: #64d5ca; - } - - .md\:border-teal-lighter { - border-color: #a0f0ed; - } - - .md\:border-teal-lightest { - border-color: #e8fffe; - } - - .md\:border-blue-darkest { - border-color: #12283a; - } - - .md\:border-blue-darker { - border-color: #1c3d5a; - } - - .md\:border-blue-dark { - border-color: #2779bd; - } - - .md\:border-blue { - border-color: #3490dc; - } - - .md\:border-blue-light { - border-color: #6cb2eb; - } - - .md\:border-blue-lighter { - border-color: #bcdefa; - } - - .md\:border-blue-lightest { - border-color: #eff8ff; - } - - .md\:border-indigo-darkest { - border-color: #191e38; - } - - .md\:border-indigo-darker { - border-color: #2f365f; - } - - .md\:border-indigo-dark { - border-color: #5661b3; - } - - .md\:border-indigo { - border-color: #6574cd; - } - - .md\:border-indigo-light { - border-color: #7886d7; - } - - .md\:border-indigo-lighter { - border-color: #b2b7ff; - } - - .md\:border-indigo-lightest { - border-color: #e6e8ff; - } - - .md\:border-purple-darkest { - border-color: #21183c; - } - - .md\:border-purple-darker { - border-color: #382b5f; - } - - .md\:border-purple-dark { - border-color: #794acf; - } - - .md\:border-purple { - border-color: #9561e2; - } - - .md\:border-purple-light { - border-color: #a779e9; - } - - .md\:border-purple-lighter { - border-color: #d6bbfc; - } - - .md\:border-purple-lightest { - border-color: #f3ebff; - } - - .md\:border-pink-darkest { - border-color: #451225; - } - - .md\:border-pink-darker { - border-color: #6f213f; - } - - .md\:border-pink-dark { - border-color: #eb5286; - } - - .md\:border-pink { - border-color: #f66d9b; - } - - .md\:border-pink-light { - border-color: #fa7ea8; - } - - .md\:border-pink-lighter { - border-color: #ffbbca; - } - - .md\:border-pink-lightest { - border-color: #ffebef; - } - - .md\:hover\:border-transparent:hover { - border-color: transparent; - } - - .md\:hover\:border-black:hover { - border-color: #22292f; - } - - .md\:hover\:border-grey-darkest:hover { - border-color: #3d4852; - } - - .md\:hover\:border-grey-darker:hover { - border-color: #606f7b; - } - - .md\:hover\:border-grey-dark:hover { - border-color: #8795a1; - } - - .md\:hover\:border-grey:hover { - border-color: #b8c2cc; - } - - .md\:hover\:border-grey-light:hover { - border-color: #dae1e7; - } - - .md\:hover\:border-grey-lighter:hover { - border-color: #f1f5f8; - } - - .md\:hover\:border-grey-lightest:hover { - border-color: #f8fafc; - } - - .md\:hover\:border-white:hover { - border-color: #fff; - } - - .md\:hover\:border-red-darkest:hover { - border-color: #3b0d0c; - } - - .md\:hover\:border-red-darker:hover { - border-color: #621b18; - } - - .md\:hover\:border-red-dark:hover { - border-color: #cc1f1a; - } - - .md\:hover\:border-red:hover { - border-color: #e3342f; - } - - .md\:hover\:border-red-light:hover { - border-color: #ef5753; - } - - .md\:hover\:border-red-lighter:hover { - border-color: #f9acaa; - } - - .md\:hover\:border-red-lightest:hover { - border-color: #fcebea; - } - - .md\:hover\:border-orange-darkest:hover { - border-color: #462a16; - } - - .md\:hover\:border-orange-darker:hover { - border-color: #613b1f; - } - - .md\:hover\:border-orange-dark:hover { - border-color: #de751f; - } - - .md\:hover\:border-orange:hover { - border-color: #f6993f; - } - - .md\:hover\:border-orange-light:hover { - border-color: #faad63; - } - - .md\:hover\:border-orange-lighter:hover { - border-color: #fcd9b6; - } - - .md\:hover\:border-orange-lightest:hover { - border-color: #fff5eb; - } - - .md\:hover\:border-yellow-darkest:hover { - border-color: #453411; - } - - .md\:hover\:border-yellow-darker:hover { - border-color: #684f1d; - } - - .md\:hover\:border-yellow-dark:hover { - border-color: #f2d024; - } - - .md\:hover\:border-yellow:hover { - border-color: #ffed4a; - } - - .md\:hover\:border-yellow-light:hover { - border-color: #fff382; - } - - .md\:hover\:border-yellow-lighter:hover { - border-color: #fff9c2; - } - - .md\:hover\:border-yellow-lightest:hover { - border-color: #fcfbeb; - } - - .md\:hover\:border-green-darkest:hover { - border-color: #0f2f21; - } - - .md\:hover\:border-green-darker:hover { - border-color: #1a4731; - } - - .md\:hover\:border-green-dark:hover { - border-color: #1f9d55; - } - - .md\:hover\:border-green:hover { - border-color: #38c172; - } - - .md\:hover\:border-green-light:hover { - border-color: #51d88a; - } - - .md\:hover\:border-green-lighter:hover { - border-color: #a2f5bf; - } - - .md\:hover\:border-green-lightest:hover { - border-color: #e3fcec; - } - - .md\:hover\:border-teal-darkest:hover { - border-color: #0d3331; - } - - .md\:hover\:border-teal-darker:hover { - border-color: #20504f; - } - - .md\:hover\:border-teal-dark:hover { - border-color: #38a89d; - } - - .md\:hover\:border-teal:hover { - border-color: #4dc0b5; - } - - .md\:hover\:border-teal-light:hover { - border-color: #64d5ca; - } - - .md\:hover\:border-teal-lighter:hover { - border-color: #a0f0ed; - } - - .md\:hover\:border-teal-lightest:hover { - border-color: #e8fffe; - } - - .md\:hover\:border-blue-darkest:hover { - border-color: #12283a; - } - - .md\:hover\:border-blue-darker:hover { - border-color: #1c3d5a; - } - - .md\:hover\:border-blue-dark:hover { - border-color: #2779bd; - } - - .md\:hover\:border-blue:hover { - border-color: #3490dc; - } - - .md\:hover\:border-blue-light:hover { - border-color: #6cb2eb; - } - - .md\:hover\:border-blue-lighter:hover { - border-color: #bcdefa; - } - - .md\:hover\:border-blue-lightest:hover { - border-color: #eff8ff; - } - - .md\:hover\:border-indigo-darkest:hover { - border-color: #191e38; - } - - .md\:hover\:border-indigo-darker:hover { - border-color: #2f365f; - } - - .md\:hover\:border-indigo-dark:hover { - border-color: #5661b3; - } - - .md\:hover\:border-indigo:hover { - border-color: #6574cd; - } - - .md\:hover\:border-indigo-light:hover { - border-color: #7886d7; - } - - .md\:hover\:border-indigo-lighter:hover { - border-color: #b2b7ff; - } - - .md\:hover\:border-indigo-lightest:hover { - border-color: #e6e8ff; - } - - .md\:hover\:border-purple-darkest:hover { - border-color: #21183c; - } - - .md\:hover\:border-purple-darker:hover { - border-color: #382b5f; - } - - .md\:hover\:border-purple-dark:hover { - border-color: #794acf; - } - - .md\:hover\:border-purple:hover { - border-color: #9561e2; - } - - .md\:hover\:border-purple-light:hover { - border-color: #a779e9; - } - - .md\:hover\:border-purple-lighter:hover { - border-color: #d6bbfc; - } - - .md\:hover\:border-purple-lightest:hover { - border-color: #f3ebff; - } - - .md\:hover\:border-pink-darkest:hover { - border-color: #451225; - } - - .md\:hover\:border-pink-darker:hover { - border-color: #6f213f; - } - - .md\:hover\:border-pink-dark:hover { - border-color: #eb5286; - } - - .md\:hover\:border-pink:hover { - border-color: #f66d9b; - } - - .md\:hover\:border-pink-light:hover { - border-color: #fa7ea8; - } - - .md\:hover\:border-pink-lighter:hover { - border-color: #ffbbca; - } - - .md\:hover\:border-pink-lightest:hover { - border-color: #ffebef; - } - - .md\:focus\:border-transparent:focus { - border-color: transparent; - } - - .md\:focus\:border-black:focus { - border-color: #22292f; - } - - .md\:focus\:border-grey-darkest:focus { - border-color: #3d4852; - } - - .md\:focus\:border-grey-darker:focus { - border-color: #606f7b; - } - - .md\:focus\:border-grey-dark:focus { - border-color: #8795a1; - } - - .md\:focus\:border-grey:focus { - border-color: #b8c2cc; - } - - .md\:focus\:border-grey-light:focus { - border-color: #dae1e7; - } - - .md\:focus\:border-grey-lighter:focus { - border-color: #f1f5f8; - } - - .md\:focus\:border-grey-lightest:focus { - border-color: #f8fafc; - } - - .md\:focus\:border-white:focus { - border-color: #fff; - } - - .md\:focus\:border-red-darkest:focus { - border-color: #3b0d0c; - } - - .md\:focus\:border-red-darker:focus { - border-color: #621b18; - } - - .md\:focus\:border-red-dark:focus { - border-color: #cc1f1a; - } - - .md\:focus\:border-red:focus { - border-color: #e3342f; - } - - .md\:focus\:border-red-light:focus { - border-color: #ef5753; - } - - .md\:focus\:border-red-lighter:focus { - border-color: #f9acaa; - } - - .md\:focus\:border-red-lightest:focus { - border-color: #fcebea; - } - - .md\:focus\:border-orange-darkest:focus { - border-color: #462a16; - } - - .md\:focus\:border-orange-darker:focus { - border-color: #613b1f; - } - - .md\:focus\:border-orange-dark:focus { - border-color: #de751f; - } - - .md\:focus\:border-orange:focus { - border-color: #f6993f; - } - - .md\:focus\:border-orange-light:focus { - border-color: #faad63; - } - - .md\:focus\:border-orange-lighter:focus { - border-color: #fcd9b6; - } - - .md\:focus\:border-orange-lightest:focus { - border-color: #fff5eb; - } - - .md\:focus\:border-yellow-darkest:focus { - border-color: #453411; - } - - .md\:focus\:border-yellow-darker:focus { - border-color: #684f1d; - } - - .md\:focus\:border-yellow-dark:focus { - border-color: #f2d024; - } - - .md\:focus\:border-yellow:focus { - border-color: #ffed4a; - } - - .md\:focus\:border-yellow-light:focus { - border-color: #fff382; - } - - .md\:focus\:border-yellow-lighter:focus { - border-color: #fff9c2; - } - - .md\:focus\:border-yellow-lightest:focus { - border-color: #fcfbeb; - } - - .md\:focus\:border-green-darkest:focus { - border-color: #0f2f21; - } - - .md\:focus\:border-green-darker:focus { - border-color: #1a4731; - } - - .md\:focus\:border-green-dark:focus { - border-color: #1f9d55; - } - - .md\:focus\:border-green:focus { - border-color: #38c172; - } - - .md\:focus\:border-green-light:focus { - border-color: #51d88a; - } - - .md\:focus\:border-green-lighter:focus { - border-color: #a2f5bf; - } - - .md\:focus\:border-green-lightest:focus { - border-color: #e3fcec; - } - - .md\:focus\:border-teal-darkest:focus { - border-color: #0d3331; - } - - .md\:focus\:border-teal-darker:focus { - border-color: #20504f; - } - - .md\:focus\:border-teal-dark:focus { - border-color: #38a89d; - } - - .md\:focus\:border-teal:focus { - border-color: #4dc0b5; - } - - .md\:focus\:border-teal-light:focus { - border-color: #64d5ca; - } - - .md\:focus\:border-teal-lighter:focus { - border-color: #a0f0ed; - } - - .md\:focus\:border-teal-lightest:focus { - border-color: #e8fffe; - } - - .md\:focus\:border-blue-darkest:focus { - border-color: #12283a; - } - - .md\:focus\:border-blue-darker:focus { - border-color: #1c3d5a; - } - - .md\:focus\:border-blue-dark:focus { - border-color: #2779bd; - } - - .md\:focus\:border-blue:focus { - border-color: #3490dc; - } - - .md\:focus\:border-blue-light:focus { - border-color: #6cb2eb; - } - - .md\:focus\:border-blue-lighter:focus { - border-color: #bcdefa; - } - - .md\:focus\:border-blue-lightest:focus { - border-color: #eff8ff; - } - - .md\:focus\:border-indigo-darkest:focus { - border-color: #191e38; - } - - .md\:focus\:border-indigo-darker:focus { - border-color: #2f365f; - } - - .md\:focus\:border-indigo-dark:focus { - border-color: #5661b3; - } - - .md\:focus\:border-indigo:focus { - border-color: #6574cd; - } - - .md\:focus\:border-indigo-light:focus { - border-color: #7886d7; - } - - .md\:focus\:border-indigo-lighter:focus { - border-color: #b2b7ff; - } - - .md\:focus\:border-indigo-lightest:focus { - border-color: #e6e8ff; - } - - .md\:focus\:border-purple-darkest:focus { - border-color: #21183c; - } - - .md\:focus\:border-purple-darker:focus { - border-color: #382b5f; - } - - .md\:focus\:border-purple-dark:focus { - border-color: #794acf; - } - - .md\:focus\:border-purple:focus { - border-color: #9561e2; - } - - .md\:focus\:border-purple-light:focus { - border-color: #a779e9; - } - - .md\:focus\:border-purple-lighter:focus { - border-color: #d6bbfc; - } - - .md\:focus\:border-purple-lightest:focus { - border-color: #f3ebff; - } - - .md\:focus\:border-pink-darkest:focus { - border-color: #451225; - } - - .md\:focus\:border-pink-darker:focus { - border-color: #6f213f; - } - - .md\:focus\:border-pink-dark:focus { - border-color: #eb5286; - } - - .md\:focus\:border-pink:focus { - border-color: #f66d9b; - } - - .md\:focus\:border-pink-light:focus { - border-color: #fa7ea8; - } - - .md\:focus\:border-pink-lighter:focus { - border-color: #ffbbca; - } - - .md\:focus\:border-pink-lightest:focus { - border-color: #ffebef; - } - - .md\:rounded-none { - border-radius: 0; - } - - .md\:rounded-sm { - border-radius: .125rem; - } - - .md\:rounded { - border-radius: .25rem; - } - - .md\:rounded-lg { - border-radius: .5rem; - } - - .md\:rounded-full { - border-radius: 9999px; - } - - .md\:rounded-t-none { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - - .md\:rounded-r-none { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - - .md\:rounded-b-none { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - } - - .md\:rounded-l-none { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - } - - .md\:rounded-t-sm { - border-top-left-radius: .125rem; - border-top-right-radius: .125rem; - } - - .md\:rounded-r-sm { - border-top-right-radius: .125rem; - border-bottom-right-radius: .125rem; - } - - .md\:rounded-b-sm { - border-bottom-right-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .md\:rounded-l-sm { - border-top-left-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .md\:rounded-t { - border-top-left-radius: .25rem; - border-top-right-radius: .25rem; - } - - .md\:rounded-r { - border-top-right-radius: .25rem; - border-bottom-right-radius: .25rem; - } - - .md\:rounded-b { - border-bottom-right-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .md\:rounded-l { - border-top-left-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .md\:rounded-t-lg { - border-top-left-radius: .5rem; - border-top-right-radius: .5rem; - } - - .md\:rounded-r-lg { - border-top-right-radius: .5rem; - border-bottom-right-radius: .5rem; - } - - .md\:rounded-b-lg { - border-bottom-right-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .md\:rounded-l-lg { - border-top-left-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .md\:rounded-t-full { - border-top-left-radius: 9999px; - border-top-right-radius: 9999px; - } - - .md\:rounded-r-full { - border-top-right-radius: 9999px; - border-bottom-right-radius: 9999px; - } - - .md\:rounded-b-full { - border-bottom-right-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .md\:rounded-l-full { - border-top-left-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .md\:rounded-tl-none { - border-top-left-radius: 0; - } - - .md\:rounded-tr-none { - border-top-right-radius: 0; - } - - .md\:rounded-br-none { - border-bottom-right-radius: 0; - } - - .md\:rounded-bl-none { - border-bottom-left-radius: 0; - } - - .md\:rounded-tl-sm { - border-top-left-radius: .125rem; - } - - .md\:rounded-tr-sm { - border-top-right-radius: .125rem; - } - - .md\:rounded-br-sm { - border-bottom-right-radius: .125rem; - } - - .md\:rounded-bl-sm { - border-bottom-left-radius: .125rem; - } - - .md\:rounded-tl { - border-top-left-radius: .25rem; - } - - .md\:rounded-tr { - border-top-right-radius: .25rem; - } - - .md\:rounded-br { - border-bottom-right-radius: .25rem; - } - - .md\:rounded-bl { - border-bottom-left-radius: .25rem; - } - - .md\:rounded-tl-lg { - border-top-left-radius: .5rem; - } - - .md\:rounded-tr-lg { - border-top-right-radius: .5rem; - } - - .md\:rounded-br-lg { - border-bottom-right-radius: .5rem; - } - - .md\:rounded-bl-lg { - border-bottom-left-radius: .5rem; - } - - .md\:rounded-tl-full { - border-top-left-radius: 9999px; - } - - .md\:rounded-tr-full { - border-top-right-radius: 9999px; - } - - .md\:rounded-br-full { - border-bottom-right-radius: 9999px; - } - - .md\:rounded-bl-full { - border-bottom-left-radius: 9999px; - } - - .md\:border-solid { - border-style: solid; - } - - .md\:border-dashed { - border-style: dashed; - } - - .md\:border-dotted { - border-style: dotted; - } - - .md\:border-none { - border-style: none; - } - - .md\:border-0 { - border-width: 0; - } - - .md\:border-2 { - border-width: 2px; - } - - .md\:border-4 { - border-width: 4px; - } - - .md\:border-8 { - border-width: 8px; - } - - .md\:border { - border-width: 1px; - } - - .md\:border-t-0 { - border-top-width: 0; - } - - .md\:border-r-0 { - border-right-width: 0; - } - - .md\:border-b-0 { - border-bottom-width: 0; - } - - .md\:border-l-0 { - border-left-width: 0; - } - - .md\:border-t-2 { - border-top-width: 2px; - } - - .md\:border-r-2 { - border-right-width: 2px; - } - - .md\:border-b-2 { - border-bottom-width: 2px; - } - - .md\:border-l-2 { - border-left-width: 2px; - } - - .md\:border-t-4 { - border-top-width: 4px; - } - - .md\:border-r-4 { - border-right-width: 4px; - } - - .md\:border-b-4 { - border-bottom-width: 4px; - } - - .md\:border-l-4 { - border-left-width: 4px; - } - - .md\:border-t-8 { - border-top-width: 8px; - } - - .md\:border-r-8 { - border-right-width: 8px; - } - - .md\:border-b-8 { - border-bottom-width: 8px; - } - - .md\:border-l-8 { - border-left-width: 8px; - } - - .md\:border-t { - border-top-width: 1px; - } - - .md\:border-r { - border-right-width: 1px; - } - - .md\:border-b { - border-bottom-width: 1px; - } - - .md\:border-l { - border-left-width: 1px; - } - - .md\:cursor-auto { - cursor: auto; - } - - .md\:cursor-default { - cursor: default; - } - - .md\:cursor-pointer { - cursor: pointer; - } - - .md\:cursor-wait { - cursor: wait; - } - - .md\:cursor-move { - cursor: move; - } - - .md\:cursor-not-allowed { - cursor: not-allowed; - } - - .md\:block { - display: block; - } - - .md\:inline-block { - display: inline-block; - } - - .md\:inline { - display: inline; - } - - .md\:table { - display: table; - } - - .md\:table-row { - display: table-row; - } - - .md\:table-cell { - display: table-cell; - } - - .md\:hidden { - display: none; - } - - .md\:flex { - display: flex; - } - - .md\:inline-flex { - display: inline-flex; - } - - .md\:flex-row { - flex-direction: row; - } - - .md\:flex-row-reverse { - flex-direction: row-reverse; - } - - .md\:flex-col { - flex-direction: column; - } - - .md\:flex-col-reverse { - flex-direction: column-reverse; - } - - .md\:flex-wrap { - flex-wrap: wrap; - } - - .md\:flex-wrap-reverse { - flex-wrap: wrap-reverse; - } - - .md\:flex-no-wrap { - flex-wrap: nowrap; - } - - .md\:items-start { - align-items: flex-start; - } - - .md\:items-end { - align-items: flex-end; - } - - .md\:items-center { - align-items: center; - } - - .md\:items-baseline { - align-items: baseline; - } - - .md\:items-stretch { - align-items: stretch; - } - - .md\:self-auto { - align-self: auto; - } - - .md\:self-start { - align-self: flex-start; - } - - .md\:self-end { - align-self: flex-end; - } - - .md\:self-center { - align-self: center; - } - - .md\:self-stretch { - align-self: stretch; - } - - .md\:justify-start { - justify-content: flex-start; - } - - .md\:justify-end { - justify-content: flex-end; - } - - .md\:justify-center { - justify-content: center; - } - - .md\:justify-between { - justify-content: space-between; - } - - .md\:justify-around { - justify-content: space-around; - } - - .md\:content-center { - align-content: center; - } - - .md\:content-start { - align-content: flex-start; - } - - .md\:content-end { - align-content: flex-end; - } - - .md\:content-between { - align-content: space-between; - } - - .md\:content-around { - align-content: space-around; - } - - .md\:flex-1 { - flex: 1 1 0%; - } - - .md\:flex-auto { - flex: 1 1 auto; - } - - .md\:flex-initial { - flex: 0 1 auto; - } - - .md\:flex-none { - flex: none; - } - - .md\:flex-grow { - flex-grow: 1; - } - - .md\:flex-shrink { - flex-shrink: 1; - } - - .md\:flex-no-grow { - flex-grow: 0; - } - - .md\:flex-no-shrink { - flex-shrink: 0; - } - - .md\:float-right { - float: right; - } - - .md\:float-left { - float: left; - } - - .md\:float-none { - float: none; - } - - .md\:clearfix:after { - content: ""; - display: table; - clear: both; - } - - .md\:font-sans { - font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; - } - - .md\:font-serif { - font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; - } - - .md\:font-mono { - font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; - } - - .md\:font-hairline { - font-weight: 100; - } - - .md\:font-thin { - font-weight: 200; - } - - .md\:font-light { - font-weight: 300; - } - - .md\:font-normal { - font-weight: 400; - } - - .md\:font-medium { - font-weight: 500; - } - - .md\:font-semibold { - font-weight: 600; - } - - .md\:font-bold { - font-weight: 700; - } - - .md\:font-extrabold { - font-weight: 800; - } - - .md\:font-black { - font-weight: 900; - } - - .md\:hover\:font-hairline:hover { - font-weight: 100; - } - - .md\:hover\:font-thin:hover { - font-weight: 200; - } - - .md\:hover\:font-light:hover { - font-weight: 300; - } - - .md\:hover\:font-normal:hover { - font-weight: 400; - } - - .md\:hover\:font-medium:hover { - font-weight: 500; - } - - .md\:hover\:font-semibold:hover { - font-weight: 600; - } - - .md\:hover\:font-bold:hover { - font-weight: 700; - } - - .md\:hover\:font-extrabold:hover { - font-weight: 800; - } - - .md\:hover\:font-black:hover { - font-weight: 900; - } - - .md\:focus\:font-hairline:focus { - font-weight: 100; - } - - .md\:focus\:font-thin:focus { - font-weight: 200; - } - - .md\:focus\:font-light:focus { - font-weight: 300; - } - - .md\:focus\:font-normal:focus { - font-weight: 400; - } - - .md\:focus\:font-medium:focus { - font-weight: 500; - } - - .md\:focus\:font-semibold:focus { - font-weight: 600; - } - - .md\:focus\:font-bold:focus { - font-weight: 700; - } - - .md\:focus\:font-extrabold:focus { - font-weight: 800; - } - - .md\:focus\:font-black:focus { - font-weight: 900; - } - - .md\:h-1 { - height: .25rem; - } - - .md\:h-2 { - height: .5rem; - } - - .md\:h-3 { - height: .75rem; - } - - .md\:h-4 { - height: 1rem; - } - - .md\:h-5 { - height: 1.25rem; - } - - .md\:h-6 { - height: 1.5rem; - } - - .md\:h-8 { - height: 2rem; - } - - .md\:h-10 { - height: 2.5rem; - } - - .md\:h-12 { - height: 3rem; - } - - .md\:h-16 { - height: 4rem; - } - - .md\:h-24 { - height: 6rem; - } - - .md\:h-32 { - height: 8rem; - } - - .md\:h-48 { - height: 12rem; - } - - .md\:h-64 { - height: 16rem; - } - - .md\:h-auto { - height: auto; - } - - .md\:h-px { - height: 1px; - } - - .md\:h-full { - height: 100%; - } - - .md\:h-screen { - height: 100vh; - } - - .md\:leading-none { - line-height: 1; - } - - .md\:leading-tight { - line-height: 1.25; - } - - .md\:leading-normal { - line-height: 1.5; - } - - .md\:leading-loose { - line-height: 2; - } - - .md\:m-0 { - margin: 0; - } - - .md\:m-1 { - margin: .25rem; - } - - .md\:m-2 { - margin: .5rem; - } - - .md\:m-3 { - margin: .75rem; - } - - .md\:m-4 { - margin: 1rem; - } - - .md\:m-5 { - margin: 1.25rem; - } - - .md\:m-6 { - margin: 1.5rem; - } - - .md\:m-8 { - margin: 2rem; - } - - .md\:m-10 { - margin: 2.5rem; - } - - .md\:m-12 { - margin: 3rem; - } - - .md\:m-16 { - margin: 4rem; - } - - .md\:m-20 { - margin: 5rem; - } - - .md\:m-24 { - margin: 6rem; - } - - .md\:m-32 { - margin: 8rem; - } - - .md\:m-auto { - margin: auto; - } - - .md\:m-px { - margin: 1px; - } - - .md\:my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .md\:mx-0 { - margin-left: 0; - margin-right: 0; - } - - .md\:my-1 { - margin-top: .25rem; - margin-bottom: .25rem; - } - - .md\:mx-1 { - margin-left: .25rem; - margin-right: .25rem; - } - - .md\:my-2 { - margin-top: .5rem; - margin-bottom: .5rem; - } - - .md\:mx-2 { - margin-left: .5rem; - margin-right: .5rem; - } - - .md\:my-3 { - margin-top: .75rem; - margin-bottom: .75rem; - } - - .md\:mx-3 { - margin-left: .75rem; - margin-right: .75rem; - } - - .md\:my-4 { - margin-top: 1rem; - margin-bottom: 1rem; - } - - .md\:mx-4 { - margin-left: 1rem; - margin-right: 1rem; - } - - .md\:my-5 { - margin-top: 1.25rem; - margin-bottom: 1.25rem; - } - - .md\:mx-5 { - margin-left: 1.25rem; - margin-right: 1.25rem; - } - - .md\:my-6 { - margin-top: 1.5rem; - margin-bottom: 1.5rem; - } - - .md\:mx-6 { - margin-left: 1.5rem; - margin-right: 1.5rem; - } - - .md\:my-8 { - margin-top: 2rem; - margin-bottom: 2rem; - } - - .md\:mx-8 { - margin-left: 2rem; - margin-right: 2rem; - } - - .md\:my-10 { - margin-top: 2.5rem; - margin-bottom: 2.5rem; - } - - .md\:mx-10 { - margin-left: 2.5rem; - margin-right: 2.5rem; - } - - .md\:my-12 { - margin-top: 3rem; - margin-bottom: 3rem; - } - - .md\:mx-12 { - margin-left: 3rem; - margin-right: 3rem; - } - - .md\:my-16 { - margin-top: 4rem; - margin-bottom: 4rem; - } - - .md\:mx-16 { - margin-left: 4rem; - margin-right: 4rem; - } - - .md\:my-20 { - margin-top: 5rem; - margin-bottom: 5rem; - } - - .md\:mx-20 { - margin-left: 5rem; - margin-right: 5rem; - } - - .md\:my-24 { - margin-top: 6rem; - margin-bottom: 6rem; - } - - .md\:mx-24 { - margin-left: 6rem; - margin-right: 6rem; - } - - .md\:my-32 { - margin-top: 8rem; - margin-bottom: 8rem; - } - - .md\:mx-32 { - margin-left: 8rem; - margin-right: 8rem; - } - - .md\:my-auto { - margin-top: auto; - margin-bottom: auto; - } - - .md\:mx-auto { - margin-left: auto; - margin-right: auto; - } - - .md\:my-px { - margin-top: 1px; - margin-bottom: 1px; - } - - .md\:mx-px { - margin-left: 1px; - margin-right: 1px; - } - - .md\:mt-0 { - margin-top: 0; - } - - .md\:mr-0 { - margin-right: 0; - } - - .md\:mb-0 { - margin-bottom: 0; - } - - .md\:ml-0 { - margin-left: 0; - } - - .md\:mt-1 { - margin-top: .25rem; - } - - .md\:mr-1 { - margin-right: .25rem; - } - - .md\:mb-1 { - margin-bottom: .25rem; - } - - .md\:ml-1 { - margin-left: .25rem; - } - - .md\:mt-2 { - margin-top: .5rem; - } - - .md\:mr-2 { - margin-right: .5rem; - } - - .md\:mb-2 { - margin-bottom: .5rem; - } - - .md\:ml-2 { - margin-left: .5rem; - } - - .md\:mt-3 { - margin-top: .75rem; - } - - .md\:mr-3 { - margin-right: .75rem; - } - - .md\:mb-3 { - margin-bottom: .75rem; - } - - .md\:ml-3 { - margin-left: .75rem; - } - - .md\:mt-4 { - margin-top: 1rem; - } - - .md\:mr-4 { - margin-right: 1rem; - } - - .md\:mb-4 { - margin-bottom: 1rem; - } - - .md\:ml-4 { - margin-left: 1rem; - } - - .md\:mt-5 { - margin-top: 1.25rem; - } - - .md\:mr-5 { - margin-right: 1.25rem; - } - - .md\:mb-5 { - margin-bottom: 1.25rem; - } - - .md\:ml-5 { - margin-left: 1.25rem; - } - - .md\:mt-6 { - margin-top: 1.5rem; - } - - .md\:mr-6 { - margin-right: 1.5rem; - } - - .md\:mb-6 { - margin-bottom: 1.5rem; - } - - .md\:ml-6 { - margin-left: 1.5rem; - } - - .md\:mt-8 { - margin-top: 2rem; - } - - .md\:mr-8 { - margin-right: 2rem; - } - - .md\:mb-8 { - margin-bottom: 2rem; - } - - .md\:ml-8 { - margin-left: 2rem; - } - - .md\:mt-10 { - margin-top: 2.5rem; - } - - .md\:mr-10 { - margin-right: 2.5rem; - } - - .md\:mb-10 { - margin-bottom: 2.5rem; - } - - .md\:ml-10 { - margin-left: 2.5rem; - } - - .md\:mt-12 { - margin-top: 3rem; - } - - .md\:mr-12 { - margin-right: 3rem; - } - - .md\:mb-12 { - margin-bottom: 3rem; - } - - .md\:ml-12 { - margin-left: 3rem; - } - - .md\:mt-16 { - margin-top: 4rem; - } - - .md\:mr-16 { - margin-right: 4rem; - } - - .md\:mb-16 { - margin-bottom: 4rem; - } - - .md\:ml-16 { - margin-left: 4rem; - } - - .md\:mt-20 { - margin-top: 5rem; - } - - .md\:mr-20 { - margin-right: 5rem; - } - - .md\:mb-20 { - margin-bottom: 5rem; - } - - .md\:ml-20 { - margin-left: 5rem; - } - - .md\:mt-24 { - margin-top: 6rem; - } - - .md\:mr-24 { - margin-right: 6rem; - } - - .md\:mb-24 { - margin-bottom: 6rem; - } - - .md\:ml-24 { - margin-left: 6rem; - } - - .md\:mt-32 { - margin-top: 8rem; - } - - .md\:mr-32 { - margin-right: 8rem; - } - - .md\:mb-32 { - margin-bottom: 8rem; - } - - .md\:ml-32 { - margin-left: 8rem; - } - - .md\:mt-auto { - margin-top: auto; - } - - .md\:mr-auto { - margin-right: auto; - } - - .md\:mb-auto { - margin-bottom: auto; - } - - .md\:ml-auto { - margin-left: auto; - } - - .md\:mt-px { - margin-top: 1px; - } - - .md\:mr-px { - margin-right: 1px; - } - - .md\:mb-px { - margin-bottom: 1px; - } - - .md\:ml-px { - margin-left: 1px; - } - - .md\:max-h-full { - max-height: 100%; - } - - .md\:max-h-screen { - max-height: 100vh; - } - - .md\:max-w-xs { - max-width: 20rem; - } - - .md\:max-w-sm { - max-width: 30rem; - } - - .md\:max-w-md { - max-width: 40rem; - } - - .md\:max-w-lg { - max-width: 50rem; - } - - .md\:max-w-xl { - max-width: 60rem; - } - - .md\:max-w-2xl { - max-width: 70rem; - } - - .md\:max-w-3xl { - max-width: 80rem; - } - - .md\:max-w-4xl { - max-width: 90rem; - } - - .md\:max-w-5xl { - max-width: 100rem; - } - - .md\:max-w-full { - max-width: 100%; - } - - .md\:min-h-0 { - min-height: 0; - } - - .md\:min-h-full { - min-height: 100%; - } - - .md\:min-h-screen { - min-height: 100vh; - } - - .md\:min-w-0 { - min-width: 0; - } - - .md\:min-w-full { - min-width: 100%; - } - - .md\:-m-0 { - margin: 0; - } - - .md\:-m-1 { - margin: -0.25rem; - } - - .md\:-m-2 { - margin: -0.5rem; - } - - .md\:-m-3 { - margin: -0.75rem; - } - - .md\:-m-4 { - margin: -1rem; - } - - .md\:-m-5 { - margin: -1.25rem; - } - - .md\:-m-6 { - margin: -1.5rem; - } - - .md\:-m-8 { - margin: -2rem; - } - - .md\:-m-10 { - margin: -2.5rem; - } - - .md\:-m-12 { - margin: -3rem; - } - - .md\:-m-16 { - margin: -4rem; - } - - .md\:-m-20 { - margin: -5rem; - } - - .md\:-m-24 { - margin: -6rem; - } - - .md\:-m-32 { - margin: -8rem; - } - - .md\:-m-px { - margin: -1px; - } - - .md\:-my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .md\:-mx-0 { - margin-left: 0; - margin-right: 0; - } - - .md\:-my-1 { - margin-top: -0.25rem; - margin-bottom: -0.25rem; - } - - .md\:-mx-1 { - margin-left: -0.25rem; - margin-right: -0.25rem; - } - - .md\:-my-2 { - margin-top: -0.5rem; - margin-bottom: -0.5rem; - } - - .md\:-mx-2 { - margin-left: -0.5rem; - margin-right: -0.5rem; - } - - .md\:-my-3 { - margin-top: -0.75rem; - margin-bottom: -0.75rem; - } - - .md\:-mx-3 { - margin-left: -0.75rem; - margin-right: -0.75rem; - } - - .md\:-my-4 { - margin-top: -1rem; - margin-bottom: -1rem; - } - - .md\:-mx-4 { - margin-left: -1rem; - margin-right: -1rem; - } - - .md\:-my-5 { - margin-top: -1.25rem; - margin-bottom: -1.25rem; - } - - .md\:-mx-5 { - margin-left: -1.25rem; - margin-right: -1.25rem; - } - - .md\:-my-6 { - margin-top: -1.5rem; - margin-bottom: -1.5rem; - } - - .md\:-mx-6 { - margin-left: -1.5rem; - margin-right: -1.5rem; - } - - .md\:-my-8 { - margin-top: -2rem; - margin-bottom: -2rem; - } - - .md\:-mx-8 { - margin-left: -2rem; - margin-right: -2rem; - } - - .md\:-my-10 { - margin-top: -2.5rem; - margin-bottom: -2.5rem; - } - - .md\:-mx-10 { - margin-left: -2.5rem; - margin-right: -2.5rem; - } - - .md\:-my-12 { - margin-top: -3rem; - margin-bottom: -3rem; - } - - .md\:-mx-12 { - margin-left: -3rem; - margin-right: -3rem; - } - - .md\:-my-16 { - margin-top: -4rem; - margin-bottom: -4rem; - } - - .md\:-mx-16 { - margin-left: -4rem; - margin-right: -4rem; - } - - .md\:-my-20 { - margin-top: -5rem; - margin-bottom: -5rem; - } - - .md\:-mx-20 { - margin-left: -5rem; - margin-right: -5rem; - } - - .md\:-my-24 { - margin-top: -6rem; - margin-bottom: -6rem; - } - - .md\:-mx-24 { - margin-left: -6rem; - margin-right: -6rem; - } - - .md\:-my-32 { - margin-top: -8rem; - margin-bottom: -8rem; - } - - .md\:-mx-32 { - margin-left: -8rem; - margin-right: -8rem; - } - - .md\:-my-px { - margin-top: -1px; - margin-bottom: -1px; - } - - .md\:-mx-px { - margin-left: -1px; - margin-right: -1px; - } - - .md\:-mt-0 { - margin-top: 0; - } - - .md\:-mr-0 { - margin-right: 0; - } - - .md\:-mb-0 { - margin-bottom: 0; - } - - .md\:-ml-0 { - margin-left: 0; - } - - .md\:-mt-1 { - margin-top: -0.25rem; - } - - .md\:-mr-1 { - margin-right: -0.25rem; - } - - .md\:-mb-1 { - margin-bottom: -0.25rem; - } - - .md\:-ml-1 { - margin-left: -0.25rem; - } - - .md\:-mt-2 { - margin-top: -0.5rem; - } - - .md\:-mr-2 { - margin-right: -0.5rem; - } - - .md\:-mb-2 { - margin-bottom: -0.5rem; - } - - .md\:-ml-2 { - margin-left: -0.5rem; - } - - .md\:-mt-3 { - margin-top: -0.75rem; - } - - .md\:-mr-3 { - margin-right: -0.75rem; - } - - .md\:-mb-3 { - margin-bottom: -0.75rem; - } - - .md\:-ml-3 { - margin-left: -0.75rem; - } - - .md\:-mt-4 { - margin-top: -1rem; - } - - .md\:-mr-4 { - margin-right: -1rem; - } - - .md\:-mb-4 { - margin-bottom: -1rem; - } - - .md\:-ml-4 { - margin-left: -1rem; - } - - .md\:-mt-5 { - margin-top: -1.25rem; - } - - .md\:-mr-5 { - margin-right: -1.25rem; - } - - .md\:-mb-5 { - margin-bottom: -1.25rem; - } - - .md\:-ml-5 { - margin-left: -1.25rem; - } - - .md\:-mt-6 { - margin-top: -1.5rem; - } - - .md\:-mr-6 { - margin-right: -1.5rem; - } - - .md\:-mb-6 { - margin-bottom: -1.5rem; - } - - .md\:-ml-6 { - margin-left: -1.5rem; - } - - .md\:-mt-8 { - margin-top: -2rem; - } - - .md\:-mr-8 { - margin-right: -2rem; - } - - .md\:-mb-8 { - margin-bottom: -2rem; - } - - .md\:-ml-8 { - margin-left: -2rem; - } - - .md\:-mt-10 { - margin-top: -2.5rem; - } - - .md\:-mr-10 { - margin-right: -2.5rem; - } - - .md\:-mb-10 { - margin-bottom: -2.5rem; - } - - .md\:-ml-10 { - margin-left: -2.5rem; - } - - .md\:-mt-12 { - margin-top: -3rem; - } - - .md\:-mr-12 { - margin-right: -3rem; - } - - .md\:-mb-12 { - margin-bottom: -3rem; - } - - .md\:-ml-12 { - margin-left: -3rem; - } - - .md\:-mt-16 { - margin-top: -4rem; - } - - .md\:-mr-16 { - margin-right: -4rem; - } - - .md\:-mb-16 { - margin-bottom: -4rem; - } - - .md\:-ml-16 { - margin-left: -4rem; - } - - .md\:-mt-20 { - margin-top: -5rem; - } - - .md\:-mr-20 { - margin-right: -5rem; - } - - .md\:-mb-20 { - margin-bottom: -5rem; - } - - .md\:-ml-20 { - margin-left: -5rem; - } - - .md\:-mt-24 { - margin-top: -6rem; - } - - .md\:-mr-24 { - margin-right: -6rem; - } - - .md\:-mb-24 { - margin-bottom: -6rem; - } - - .md\:-ml-24 { - margin-left: -6rem; - } - - .md\:-mt-32 { - margin-top: -8rem; - } - - .md\:-mr-32 { - margin-right: -8rem; - } - - .md\:-mb-32 { - margin-bottom: -8rem; - } - - .md\:-ml-32 { - margin-left: -8rem; - } - - .md\:-mt-px { - margin-top: -1px; - } - - .md\:-mr-px { - margin-right: -1px; - } - - .md\:-mb-px { - margin-bottom: -1px; - } - - .md\:-ml-px { - margin-left: -1px; - } - - .md\:opacity-0 { - opacity: 0; - } - - .md\:opacity-25 { - opacity: .25; - } - - .md\:opacity-50 { - opacity: .5; - } - - .md\:opacity-75 { - opacity: .75; - } - - .md\:opacity-100 { - opacity: 1; - } - - .md\:overflow-auto { - overflow: auto; - } - - .md\:overflow-hidden { - overflow: hidden; - } - - .md\:overflow-visible { - overflow: visible; - } - - .md\:overflow-scroll { - overflow: scroll; - } - - .md\:overflow-x-auto { - overflow-x: auto; - } - - .md\:overflow-y-auto { - overflow-y: auto; - } - - .md\:overflow-x-hidden { - overflow-x: hidden; - } - - .md\:overflow-y-hidden { - overflow-y: hidden; - } - - .md\:overflow-x-visible { - overflow-x: visible; - } - - .md\:overflow-y-visible { - overflow-y: visible; - } - - .md\:overflow-x-scroll { - overflow-x: scroll; - } - - .md\:overflow-y-scroll { - overflow-y: scroll; - } - - .md\:scrolling-touch { - -webkit-overflow-scrolling: touch; - } - - .md\:scrolling-auto { - -webkit-overflow-scrolling: auto; - } - - .md\:p-0 { - padding: 0; - } - - .md\:p-1 { - padding: .25rem; - } - - .md\:p-2 { - padding: .5rem; - } - - .md\:p-3 { - padding: .75rem; - } - - .md\:p-4 { - padding: 1rem; - } - - .md\:p-5 { - padding: 1.25rem; - } - - .md\:p-6 { - padding: 1.5rem; - } - - .md\:p-8 { - padding: 2rem; - } - - .md\:p-10 { - padding: 2.5rem; - } - - .md\:p-12 { - padding: 3rem; - } - - .md\:p-16 { - padding: 4rem; - } - - .md\:p-20 { - padding: 5rem; - } - - .md\:p-24 { - padding: 6rem; - } - - .md\:p-32 { - padding: 8rem; - } - - .md\:p-px { - padding: 1px; - } - - .md\:py-0 { - padding-top: 0; - padding-bottom: 0; - } - - .md\:px-0 { - padding-left: 0; - padding-right: 0; - } - - .md\:py-1 { - padding-top: .25rem; - padding-bottom: .25rem; - } - - .md\:px-1 { - padding-left: .25rem; - padding-right: .25rem; - } - - .md\:py-2 { - padding-top: .5rem; - padding-bottom: .5rem; - } - - .md\:px-2 { - padding-left: .5rem; - padding-right: .5rem; - } - - .md\:py-3 { - padding-top: .75rem; - padding-bottom: .75rem; - } - - .md\:px-3 { - padding-left: .75rem; - padding-right: .75rem; - } - - .md\:py-4 { - padding-top: 1rem; - padding-bottom: 1rem; - } - - .md\:px-4 { - padding-left: 1rem; - padding-right: 1rem; - } - - .md\:py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; - } - - .md\:px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; - } - - .md\:py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; - } - - .md\:px-6 { - padding-left: 1.5rem; - padding-right: 1.5rem; - } - - .md\:py-8 { - padding-top: 2rem; - padding-bottom: 2rem; - } - - .md\:px-8 { - padding-left: 2rem; - padding-right: 2rem; - } - - .md\:py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; - } - - .md\:px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; - } - - .md\:py-12 { - padding-top: 3rem; - padding-bottom: 3rem; - } - - .md\:px-12 { - padding-left: 3rem; - padding-right: 3rem; - } - - .md\:py-16 { - padding-top: 4rem; - padding-bottom: 4rem; - } - - .md\:px-16 { - padding-left: 4rem; - padding-right: 4rem; - } - - .md\:py-20 { - padding-top: 5rem; - padding-bottom: 5rem; - } - - .md\:px-20 { - padding-left: 5rem; - padding-right: 5rem; - } - - .md\:py-24 { - padding-top: 6rem; - padding-bottom: 6rem; - } - - .md\:px-24 { - padding-left: 6rem; - padding-right: 6rem; - } - - .md\:py-32 { - padding-top: 8rem; - padding-bottom: 8rem; - } - - .md\:px-32 { - padding-left: 8rem; - padding-right: 8rem; - } - - .md\:py-px { - padding-top: 1px; - padding-bottom: 1px; - } - - .md\:px-px { - padding-left: 1px; - padding-right: 1px; - } - - .md\:pt-0 { - padding-top: 0; - } - - .md\:pr-0 { - padding-right: 0; - } - - .md\:pb-0 { - padding-bottom: 0; - } - - .md\:pl-0 { - padding-left: 0; - } - - .md\:pt-1 { - padding-top: .25rem; - } - - .md\:pr-1 { - padding-right: .25rem; - } - - .md\:pb-1 { - padding-bottom: .25rem; - } - - .md\:pl-1 { - padding-left: .25rem; - } - - .md\:pt-2 { - padding-top: .5rem; - } - - .md\:pr-2 { - padding-right: .5rem; - } - - .md\:pb-2 { - padding-bottom: .5rem; - } - - .md\:pl-2 { - padding-left: .5rem; - } - - .md\:pt-3 { - padding-top: .75rem; - } - - .md\:pr-3 { - padding-right: .75rem; - } - - .md\:pb-3 { - padding-bottom: .75rem; - } - - .md\:pl-3 { - padding-left: .75rem; - } - - .md\:pt-4 { - padding-top: 1rem; - } - - .md\:pr-4 { - padding-right: 1rem; - } - - .md\:pb-4 { - padding-bottom: 1rem; - } - - .md\:pl-4 { - padding-left: 1rem; - } - - .md\:pt-5 { - padding-top: 1.25rem; - } - - .md\:pr-5 { - padding-right: 1.25rem; - } - - .md\:pb-5 { - padding-bottom: 1.25rem; - } - - .md\:pl-5 { - padding-left: 1.25rem; - } - - .md\:pt-6 { - padding-top: 1.5rem; - } - - .md\:pr-6 { - padding-right: 1.5rem; - } - - .md\:pb-6 { - padding-bottom: 1.5rem; - } - - .md\:pl-6 { - padding-left: 1.5rem; - } - - .md\:pt-8 { - padding-top: 2rem; - } - - .md\:pr-8 { - padding-right: 2rem; - } - - .md\:pb-8 { - padding-bottom: 2rem; - } - - .md\:pl-8 { - padding-left: 2rem; - } - - .md\:pt-10 { - padding-top: 2.5rem; - } - - .md\:pr-10 { - padding-right: 2.5rem; - } - - .md\:pb-10 { - padding-bottom: 2.5rem; - } - - .md\:pl-10 { - padding-left: 2.5rem; - } - - .md\:pt-12 { - padding-top: 3rem; - } - - .md\:pr-12 { - padding-right: 3rem; - } - - .md\:pb-12 { - padding-bottom: 3rem; - } - - .md\:pl-12 { - padding-left: 3rem; - } - - .md\:pt-16 { - padding-top: 4rem; - } - - .md\:pr-16 { - padding-right: 4rem; - } - - .md\:pb-16 { - padding-bottom: 4rem; - } - - .md\:pl-16 { - padding-left: 4rem; - } - - .md\:pt-20 { - padding-top: 5rem; - } - - .md\:pr-20 { - padding-right: 5rem; - } - - .md\:pb-20 { - padding-bottom: 5rem; - } - - .md\:pl-20 { - padding-left: 5rem; - } - - .md\:pt-24 { - padding-top: 6rem; - } - - .md\:pr-24 { - padding-right: 6rem; - } - - .md\:pb-24 { - padding-bottom: 6rem; - } - - .md\:pl-24 { - padding-left: 6rem; - } - - .md\:pt-32 { - padding-top: 8rem; - } - - .md\:pr-32 { - padding-right: 8rem; - } - - .md\:pb-32 { - padding-bottom: 8rem; - } - - .md\:pl-32 { - padding-left: 8rem; - } - - .md\:pt-px { - padding-top: 1px; - } - - .md\:pr-px { - padding-right: 1px; - } - - .md\:pb-px { - padding-bottom: 1px; - } - - .md\:pl-px { - padding-left: 1px; - } - - .md\:pointer-events-none { - pointer-events: none; - } - - .md\:pointer-events-auto { - pointer-events: auto; - } - - .md\:static { - position: static; - } - - .md\:fixed { - position: fixed; - } - - .md\:absolute { - position: absolute; - } - - .md\:relative { - position: relative; - } - - .md\:sticky { - position: -webkit-sticky; - position: sticky; - } - - .md\:pin-none { - top: auto; - right: auto; - bottom: auto; - left: auto; - } - - .md\:pin { - top: 0; - right: 0; - bottom: 0; - left: 0; - } - - .md\:pin-y { - top: 0; - bottom: 0; - } - - .md\:pin-x { - right: 0; - left: 0; - } - - .md\:pin-t { - top: 0; - } - - .md\:pin-r { - right: 0; - } - - .md\:pin-b { - bottom: 0; - } - - .md\:pin-l { - left: 0; - } - - .md\:resize-none { - resize: none; - } - - .md\:resize-y { - resize: vertical; - } - - .md\:resize-x { - resize: horizontal; - } - - .md\:resize { - resize: both; - } - - .md\:shadow { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .md\:shadow-md { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .md\:shadow-lg { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .md\:shadow-inner { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .md\:shadow-outline { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .md\:shadow-none { - box-shadow: none; - } - - .md\:hover\:shadow:hover { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .md\:hover\:shadow-md:hover { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .md\:hover\:shadow-lg:hover { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .md\:hover\:shadow-inner:hover { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .md\:hover\:shadow-outline:hover { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .md\:hover\:shadow-none:hover { - box-shadow: none; - } - - .md\:focus\:shadow:focus { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .md\:focus\:shadow-md:focus { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .md\:focus\:shadow-lg:focus { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .md\:focus\:shadow-inner:focus { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .md\:focus\:shadow-outline:focus { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .md\:focus\:shadow-none:focus { - box-shadow: none; - } - - .md\:table-auto { - table-layout: auto; - } - - .md\:table-fixed { - table-layout: fixed; - } - - .md\:text-left { - text-align: left; - } - - .md\:text-center { - text-align: center; - } - - .md\:text-right { - text-align: right; - } - - .md\:text-justify { - text-align: justify; - } - - .md\:text-transparent { - color: transparent; - } - - .md\:text-black { - color: #22292f; - } - - .md\:text-grey-darkest { - color: #3d4852; - } - - .md\:text-grey-darker { - color: #606f7b; - } - - .md\:text-grey-dark { - color: #8795a1; - } - - .md\:text-grey { - color: #b8c2cc; - } - - .md\:text-grey-light { - color: #dae1e7; - } - - .md\:text-grey-lighter { - color: #f1f5f8; - } - - .md\:text-grey-lightest { - color: #f8fafc; - } - - .md\:text-white { - color: #fff; - } - - .md\:text-red-darkest { - color: #3b0d0c; - } - - .md\:text-red-darker { - color: #621b18; - } - - .md\:text-red-dark { - color: #cc1f1a; - } - - .md\:text-red { - color: #e3342f; - } - - .md\:text-red-light { - color: #ef5753; - } - - .md\:text-red-lighter { - color: #f9acaa; - } - - .md\:text-red-lightest { - color: #fcebea; - } - - .md\:text-orange-darkest { - color: #462a16; - } - - .md\:text-orange-darker { - color: #613b1f; - } - - .md\:text-orange-dark { - color: #de751f; - } - - .md\:text-orange { - color: #f6993f; - } - - .md\:text-orange-light { - color: #faad63; - } - - .md\:text-orange-lighter { - color: #fcd9b6; - } - - .md\:text-orange-lightest { - color: #fff5eb; - } - - .md\:text-yellow-darkest { - color: #453411; - } - - .md\:text-yellow-darker { - color: #684f1d; - } - - .md\:text-yellow-dark { - color: #f2d024; - } - - .md\:text-yellow { - color: #ffed4a; - } - - .md\:text-yellow-light { - color: #fff382; - } - - .md\:text-yellow-lighter { - color: #fff9c2; - } - - .md\:text-yellow-lightest { - color: #fcfbeb; - } - - .md\:text-green-darkest { - color: #0f2f21; - } - - .md\:text-green-darker { - color: #1a4731; - } - - .md\:text-green-dark { - color: #1f9d55; - } - - .md\:text-green { - color: #38c172; - } - - .md\:text-green-light { - color: #51d88a; - } - - .md\:text-green-lighter { - color: #a2f5bf; - } - - .md\:text-green-lightest { - color: #e3fcec; - } - - .md\:text-teal-darkest { - color: #0d3331; - } - - .md\:text-teal-darker { - color: #20504f; - } - - .md\:text-teal-dark { - color: #38a89d; - } - - .md\:text-teal { - color: #4dc0b5; - } - - .md\:text-teal-light { - color: #64d5ca; - } - - .md\:text-teal-lighter { - color: #a0f0ed; - } - - .md\:text-teal-lightest { - color: #e8fffe; - } - - .md\:text-blue-darkest { - color: #12283a; - } - - .md\:text-blue-darker { - color: #1c3d5a; - } - - .md\:text-blue-dark { - color: #2779bd; - } - - .md\:text-blue { - color: #3490dc; - } - - .md\:text-blue-light { - color: #6cb2eb; - } - - .md\:text-blue-lighter { - color: #bcdefa; - } - - .md\:text-blue-lightest { - color: #eff8ff; - } - - .md\:text-indigo-darkest { - color: #191e38; - } - - .md\:text-indigo-darker { - color: #2f365f; - } - - .md\:text-indigo-dark { - color: #5661b3; - } - - .md\:text-indigo { - color: #6574cd; - } - - .md\:text-indigo-light { - color: #7886d7; - } - - .md\:text-indigo-lighter { - color: #b2b7ff; - } - - .md\:text-indigo-lightest { - color: #e6e8ff; - } - - .md\:text-purple-darkest { - color: #21183c; - } - - .md\:text-purple-darker { - color: #382b5f; - } - - .md\:text-purple-dark { - color: #794acf; - } - - .md\:text-purple { - color: #9561e2; - } - - .md\:text-purple-light { - color: #a779e9; - } - - .md\:text-purple-lighter { - color: #d6bbfc; - } - - .md\:text-purple-lightest { - color: #f3ebff; - } - - .md\:text-pink-darkest { - color: #451225; - } - - .md\:text-pink-darker { - color: #6f213f; - } - - .md\:text-pink-dark { - color: #eb5286; - } - - .md\:text-pink { - color: #f66d9b; - } - - .md\:text-pink-light { - color: #fa7ea8; - } - - .md\:text-pink-lighter { - color: #ffbbca; - } - - .md\:text-pink-lightest { - color: #ffebef; - } - - .md\:hover\:text-transparent:hover { - color: transparent; - } - - .md\:hover\:text-black:hover { - color: #22292f; - } - - .md\:hover\:text-grey-darkest:hover { - color: #3d4852; - } - - .md\:hover\:text-grey-darker:hover { - color: #606f7b; - } - - .md\:hover\:text-grey-dark:hover { - color: #8795a1; - } - - .md\:hover\:text-grey:hover { - color: #b8c2cc; - } - - .md\:hover\:text-grey-light:hover { - color: #dae1e7; - } - - .md\:hover\:text-grey-lighter:hover { - color: #f1f5f8; - } - - .md\:hover\:text-grey-lightest:hover { - color: #f8fafc; - } - - .md\:hover\:text-white:hover { - color: #fff; - } - - .md\:hover\:text-red-darkest:hover { - color: #3b0d0c; - } - - .md\:hover\:text-red-darker:hover { - color: #621b18; - } - - .md\:hover\:text-red-dark:hover { - color: #cc1f1a; - } - - .md\:hover\:text-red:hover { - color: #e3342f; - } - - .md\:hover\:text-red-light:hover { - color: #ef5753; - } - - .md\:hover\:text-red-lighter:hover { - color: #f9acaa; - } - - .md\:hover\:text-red-lightest:hover { - color: #fcebea; - } - - .md\:hover\:text-orange-darkest:hover { - color: #462a16; - } - - .md\:hover\:text-orange-darker:hover { - color: #613b1f; - } - - .md\:hover\:text-orange-dark:hover { - color: #de751f; - } - - .md\:hover\:text-orange:hover { - color: #f6993f; - } - - .md\:hover\:text-orange-light:hover { - color: #faad63; - } - - .md\:hover\:text-orange-lighter:hover { - color: #fcd9b6; - } - - .md\:hover\:text-orange-lightest:hover { - color: #fff5eb; - } - - .md\:hover\:text-yellow-darkest:hover { - color: #453411; - } - - .md\:hover\:text-yellow-darker:hover { - color: #684f1d; - } - - .md\:hover\:text-yellow-dark:hover { - color: #f2d024; - } - - .md\:hover\:text-yellow:hover { - color: #ffed4a; - } - - .md\:hover\:text-yellow-light:hover { - color: #fff382; - } - - .md\:hover\:text-yellow-lighter:hover { - color: #fff9c2; - } - - .md\:hover\:text-yellow-lightest:hover { - color: #fcfbeb; - } - - .md\:hover\:text-green-darkest:hover { - color: #0f2f21; - } - - .md\:hover\:text-green-darker:hover { - color: #1a4731; - } - - .md\:hover\:text-green-dark:hover { - color: #1f9d55; - } - - .md\:hover\:text-green:hover { - color: #38c172; - } - - .md\:hover\:text-green-light:hover { - color: #51d88a; - } - - .md\:hover\:text-green-lighter:hover { - color: #a2f5bf; - } - - .md\:hover\:text-green-lightest:hover { - color: #e3fcec; - } - - .md\:hover\:text-teal-darkest:hover { - color: #0d3331; - } - - .md\:hover\:text-teal-darker:hover { - color: #20504f; - } - - .md\:hover\:text-teal-dark:hover { - color: #38a89d; - } - - .md\:hover\:text-teal:hover { - color: #4dc0b5; - } - - .md\:hover\:text-teal-light:hover { - color: #64d5ca; - } - - .md\:hover\:text-teal-lighter:hover { - color: #a0f0ed; - } - - .md\:hover\:text-teal-lightest:hover { - color: #e8fffe; - } - - .md\:hover\:text-blue-darkest:hover { - color: #12283a; - } - - .md\:hover\:text-blue-darker:hover { - color: #1c3d5a; - } - - .md\:hover\:text-blue-dark:hover { - color: #2779bd; - } - - .md\:hover\:text-blue:hover { - color: #3490dc; - } - - .md\:hover\:text-blue-light:hover { - color: #6cb2eb; - } - - .md\:hover\:text-blue-lighter:hover { - color: #bcdefa; - } - - .md\:hover\:text-blue-lightest:hover { - color: #eff8ff; - } - - .md\:hover\:text-indigo-darkest:hover { - color: #191e38; - } - - .md\:hover\:text-indigo-darker:hover { - color: #2f365f; - } - - .md\:hover\:text-indigo-dark:hover { - color: #5661b3; - } - - .md\:hover\:text-indigo:hover { - color: #6574cd; - } - - .md\:hover\:text-indigo-light:hover { - color: #7886d7; - } - - .md\:hover\:text-indigo-lighter:hover { - color: #b2b7ff; - } - - .md\:hover\:text-indigo-lightest:hover { - color: #e6e8ff; - } - - .md\:hover\:text-purple-darkest:hover { - color: #21183c; - } - - .md\:hover\:text-purple-darker:hover { - color: #382b5f; - } - - .md\:hover\:text-purple-dark:hover { - color: #794acf; - } - - .md\:hover\:text-purple:hover { - color: #9561e2; - } - - .md\:hover\:text-purple-light:hover { - color: #a779e9; - } - - .md\:hover\:text-purple-lighter:hover { - color: #d6bbfc; - } - - .md\:hover\:text-purple-lightest:hover { - color: #f3ebff; - } - - .md\:hover\:text-pink-darkest:hover { - color: #451225; - } - - .md\:hover\:text-pink-darker:hover { - color: #6f213f; - } - - .md\:hover\:text-pink-dark:hover { - color: #eb5286; - } - - .md\:hover\:text-pink:hover { - color: #f66d9b; - } - - .md\:hover\:text-pink-light:hover { - color: #fa7ea8; - } - - .md\:hover\:text-pink-lighter:hover { - color: #ffbbca; - } - - .md\:hover\:text-pink-lightest:hover { - color: #ffebef; - } - - .md\:focus\:text-transparent:focus { - color: transparent; - } - - .md\:focus\:text-black:focus { - color: #22292f; - } - - .md\:focus\:text-grey-darkest:focus { - color: #3d4852; - } - - .md\:focus\:text-grey-darker:focus { - color: #606f7b; - } - - .md\:focus\:text-grey-dark:focus { - color: #8795a1; - } - - .md\:focus\:text-grey:focus { - color: #b8c2cc; - } - - .md\:focus\:text-grey-light:focus { - color: #dae1e7; - } - - .md\:focus\:text-grey-lighter:focus { - color: #f1f5f8; - } - - .md\:focus\:text-grey-lightest:focus { - color: #f8fafc; - } - - .md\:focus\:text-white:focus { - color: #fff; - } - - .md\:focus\:text-red-darkest:focus { - color: #3b0d0c; - } - - .md\:focus\:text-red-darker:focus { - color: #621b18; - } - - .md\:focus\:text-red-dark:focus { - color: #cc1f1a; - } - - .md\:focus\:text-red:focus { - color: #e3342f; - } - - .md\:focus\:text-red-light:focus { - color: #ef5753; - } - - .md\:focus\:text-red-lighter:focus { - color: #f9acaa; - } - - .md\:focus\:text-red-lightest:focus { - color: #fcebea; - } - - .md\:focus\:text-orange-darkest:focus { - color: #462a16; - } - - .md\:focus\:text-orange-darker:focus { - color: #613b1f; - } - - .md\:focus\:text-orange-dark:focus { - color: #de751f; - } - - .md\:focus\:text-orange:focus { - color: #f6993f; - } - - .md\:focus\:text-orange-light:focus { - color: #faad63; - } - - .md\:focus\:text-orange-lighter:focus { - color: #fcd9b6; - } - - .md\:focus\:text-orange-lightest:focus { - color: #fff5eb; - } - - .md\:focus\:text-yellow-darkest:focus { - color: #453411; - } - - .md\:focus\:text-yellow-darker:focus { - color: #684f1d; - } - - .md\:focus\:text-yellow-dark:focus { - color: #f2d024; - } - - .md\:focus\:text-yellow:focus { - color: #ffed4a; - } - - .md\:focus\:text-yellow-light:focus { - color: #fff382; - } - - .md\:focus\:text-yellow-lighter:focus { - color: #fff9c2; - } - - .md\:focus\:text-yellow-lightest:focus { - color: #fcfbeb; - } - - .md\:focus\:text-green-darkest:focus { - color: #0f2f21; - } - - .md\:focus\:text-green-darker:focus { - color: #1a4731; - } - - .md\:focus\:text-green-dark:focus { - color: #1f9d55; - } - - .md\:focus\:text-green:focus { - color: #38c172; - } - - .md\:focus\:text-green-light:focus { - color: #51d88a; - } - - .md\:focus\:text-green-lighter:focus { - color: #a2f5bf; - } - - .md\:focus\:text-green-lightest:focus { - color: #e3fcec; - } - - .md\:focus\:text-teal-darkest:focus { - color: #0d3331; - } - - .md\:focus\:text-teal-darker:focus { - color: #20504f; - } - - .md\:focus\:text-teal-dark:focus { - color: #38a89d; - } - - .md\:focus\:text-teal:focus { - color: #4dc0b5; - } - - .md\:focus\:text-teal-light:focus { - color: #64d5ca; - } - - .md\:focus\:text-teal-lighter:focus { - color: #a0f0ed; - } - - .md\:focus\:text-teal-lightest:focus { - color: #e8fffe; - } - - .md\:focus\:text-blue-darkest:focus { - color: #12283a; - } - - .md\:focus\:text-blue-darker:focus { - color: #1c3d5a; - } - - .md\:focus\:text-blue-dark:focus { - color: #2779bd; - } - - .md\:focus\:text-blue:focus { - color: #3490dc; - } - - .md\:focus\:text-blue-light:focus { - color: #6cb2eb; - } - - .md\:focus\:text-blue-lighter:focus { - color: #bcdefa; - } - - .md\:focus\:text-blue-lightest:focus { - color: #eff8ff; - } - - .md\:focus\:text-indigo-darkest:focus { - color: #191e38; - } - - .md\:focus\:text-indigo-darker:focus { - color: #2f365f; - } - - .md\:focus\:text-indigo-dark:focus { - color: #5661b3; - } - - .md\:focus\:text-indigo:focus { - color: #6574cd; - } - - .md\:focus\:text-indigo-light:focus { - color: #7886d7; - } - - .md\:focus\:text-indigo-lighter:focus { - color: #b2b7ff; - } - - .md\:focus\:text-indigo-lightest:focus { - color: #e6e8ff; - } - - .md\:focus\:text-purple-darkest:focus { - color: #21183c; - } - - .md\:focus\:text-purple-darker:focus { - color: #382b5f; - } - - .md\:focus\:text-purple-dark:focus { - color: #794acf; - } - - .md\:focus\:text-purple:focus { - color: #9561e2; - } - - .md\:focus\:text-purple-light:focus { - color: #a779e9; - } - - .md\:focus\:text-purple-lighter:focus { - color: #d6bbfc; - } - - .md\:focus\:text-purple-lightest:focus { - color: #f3ebff; - } - - .md\:focus\:text-pink-darkest:focus { - color: #451225; - } - - .md\:focus\:text-pink-darker:focus { - color: #6f213f; - } - - .md\:focus\:text-pink-dark:focus { - color: #eb5286; - } - - .md\:focus\:text-pink:focus { - color: #f66d9b; - } - - .md\:focus\:text-pink-light:focus { - color: #fa7ea8; - } - - .md\:focus\:text-pink-lighter:focus { - color: #ffbbca; - } - - .md\:focus\:text-pink-lightest:focus { - color: #ffebef; - } - - .md\:text-xs { - font-size: .75rem; - } - - .md\:text-sm { - font-size: .875rem; - } - - .md\:text-base { - font-size: 1rem; - } - - .md\:text-lg { - font-size: 1.125rem; - } - - .md\:text-xl { - font-size: 1.25rem; - } - - .md\:text-2xl { - font-size: 1.5rem; - } - - .md\:text-3xl { - font-size: 1.875rem; - } - - .md\:text-4xl { - font-size: 2.25rem; - } - - .md\:text-5xl { - font-size: 3rem; - } - - .md\:italic { - font-style: italic; - } - - .md\:roman { - font-style: normal; - } - - .md\:uppercase { - text-transform: uppercase; - } - - .md\:lowercase { - text-transform: lowercase; - } - - .md\:capitalize { - text-transform: capitalize; - } - - .md\:normal-case { - text-transform: none; - } - - .md\:underline { - text-decoration: underline; - } - - .md\:line-through { - text-decoration: line-through; - } - - .md\:no-underline { - text-decoration: none; - } - - .md\:antialiased { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .md\:subpixel-antialiased { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .md\:hover\:italic:hover { - font-style: italic; - } - - .md\:hover\:roman:hover { - font-style: normal; - } - - .md\:hover\:uppercase:hover { - text-transform: uppercase; - } - - .md\:hover\:lowercase:hover { - text-transform: lowercase; - } - - .md\:hover\:capitalize:hover { - text-transform: capitalize; - } - - .md\:hover\:normal-case:hover { - text-transform: none; - } - - .md\:hover\:underline:hover { - text-decoration: underline; - } - - .md\:hover\:line-through:hover { - text-decoration: line-through; - } - - .md\:hover\:no-underline:hover { - text-decoration: none; - } - - .md\:hover\:antialiased:hover { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .md\:hover\:subpixel-antialiased:hover { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .md\:focus\:italic:focus { - font-style: italic; - } - - .md\:focus\:roman:focus { - font-style: normal; - } - - .md\:focus\:uppercase:focus { - text-transform: uppercase; - } - - .md\:focus\:lowercase:focus { - text-transform: lowercase; - } - - .md\:focus\:capitalize:focus { - text-transform: capitalize; - } - - .md\:focus\:normal-case:focus { - text-transform: none; - } - - .md\:focus\:underline:focus { - text-decoration: underline; - } - - .md\:focus\:line-through:focus { - text-decoration: line-through; - } - - .md\:focus\:no-underline:focus { - text-decoration: none; - } - - .md\:focus\:antialiased:focus { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .md\:focus\:subpixel-antialiased:focus { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .md\:tracking-tight { - letter-spacing: -0.05em; - } - - .md\:tracking-normal { - letter-spacing: 0; - } - - .md\:tracking-wide { - letter-spacing: .05em; - } - - .md\:select-none { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } - - .md\:select-text { - -webkit-user-select: text; - -moz-user-select: text; - -ms-user-select: text; - user-select: text; - } - - .md\:align-baseline { - vertical-align: baseline; - } - - .md\:align-top { - vertical-align: top; - } - - .md\:align-middle { - vertical-align: middle; - } - - .md\:align-bottom { - vertical-align: bottom; - } - - .md\:align-text-top { - vertical-align: text-top; - } - - .md\:align-text-bottom { - vertical-align: text-bottom; - } - - .md\:visible { - visibility: visible; - } - - .md\:invisible { - visibility: hidden; - } - - .md\:whitespace-normal { - white-space: normal; - } - - .md\:whitespace-no-wrap { - white-space: nowrap; - } - - .md\:whitespace-pre { - white-space: pre; - } - - .md\:whitespace-pre-line { - white-space: pre-line; - } - - .md\:whitespace-pre-wrap { - white-space: pre-wrap; - } - - .md\:break-words { - word-wrap: break-word; - } - - .md\:break-normal { - word-wrap: normal; - } - - .md\:truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - .md\:w-1 { - width: .25rem; - } - - .md\:w-2 { - width: .5rem; - } - - .md\:w-3 { - width: .75rem; - } - - .md\:w-4 { - width: 1rem; - } - - .md\:w-5 { - width: 1.25rem; - } - - .md\:w-6 { - width: 1.5rem; - } - - .md\:w-8 { - width: 2rem; - } - - .md\:w-10 { - width: 2.5rem; - } - - .md\:w-12 { - width: 3rem; - } - - .md\:w-16 { - width: 4rem; - } - - .md\:w-24 { - width: 6rem; - } - - .md\:w-32 { - width: 8rem; - } - - .md\:w-48 { - width: 12rem; - } - - .md\:w-64 { - width: 16rem; - } - - .md\:w-auto { - width: auto; - } - - .md\:w-px { - width: 1px; - } - - .md\:w-1\/2 { - width: 50%; - } - - .md\:w-1\/3 { - width: 33.33333%; - } - - .md\:w-2\/3 { - width: 66.66667%; - } - - .md\:w-1\/4 { - width: 25%; - } - - .md\:w-3\/4 { - width: 75%; - } - - .md\:w-1\/5 { - width: 20%; - } - - .md\:w-2\/5 { - width: 40%; - } - - .md\:w-3\/5 { - width: 60%; - } - - .md\:w-4\/5 { - width: 80%; - } - - .md\:w-1\/6 { - width: 16.66667%; - } - - .md\:w-5\/6 { - width: 83.33333%; - } - - .md\:w-full { - width: 100%; - } - - .md\:w-screen { - width: 100vw; - } - - .md\:z-0 { - z-index: 0; - } - - .md\:z-10 { - z-index: 10; - } - - .md\:z-20 { - z-index: 20; - } - - .md\:z-30 { - z-index: 30; - } - - .md\:z-40 { - z-index: 40; - } - - .md\:z-50 { - z-index: 50; - } - - .md\:z-auto { - z-index: auto; - } -} - -@media (min-width: 992px) { - .lg\:list-reset { - list-style: none; - padding: 0; - } - - .lg\:appearance-none { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - } - - .lg\:bg-fixed { - background-attachment: fixed; - } - - .lg\:bg-local { - background-attachment: local; - } - - .lg\:bg-scroll { - background-attachment: scroll; - } - - .lg\:bg-transparent { - background-color: transparent; - } - - .lg\:bg-black { - background-color: #22292f; - } - - .lg\:bg-grey-darkest { - background-color: #3d4852; - } - - .lg\:bg-grey-darker { - background-color: #606f7b; - } - - .lg\:bg-grey-dark { - background-color: #8795a1; - } - - .lg\:bg-grey { - background-color: #b8c2cc; - } - - .lg\:bg-grey-light { - background-color: #dae1e7; - } - - .lg\:bg-grey-lighter { - background-color: #f1f5f8; - } - - .lg\:bg-grey-lightest { - background-color: #f8fafc; - } - - .lg\:bg-white { - background-color: #fff; - } - - .lg\:bg-red-darkest { - background-color: #3b0d0c; - } - - .lg\:bg-red-darker { - background-color: #621b18; - } - - .lg\:bg-red-dark { - background-color: #cc1f1a; - } - - .lg\:bg-red { - background-color: #e3342f; - } - - .lg\:bg-red-light { - background-color: #ef5753; - } - - .lg\:bg-red-lighter { - background-color: #f9acaa; - } - - .lg\:bg-red-lightest { - background-color: #fcebea; - } - - .lg\:bg-orange-darkest { - background-color: #462a16; - } - - .lg\:bg-orange-darker { - background-color: #613b1f; - } - - .lg\:bg-orange-dark { - background-color: #de751f; - } - - .lg\:bg-orange { - background-color: #f6993f; - } - - .lg\:bg-orange-light { - background-color: #faad63; - } - - .lg\:bg-orange-lighter { - background-color: #fcd9b6; - } - - .lg\:bg-orange-lightest { - background-color: #fff5eb; - } - - .lg\:bg-yellow-darkest { - background-color: #453411; - } - - .lg\:bg-yellow-darker { - background-color: #684f1d; - } - - .lg\:bg-yellow-dark { - background-color: #f2d024; - } - - .lg\:bg-yellow { - background-color: #ffed4a; - } - - .lg\:bg-yellow-light { - background-color: #fff382; - } - - .lg\:bg-yellow-lighter { - background-color: #fff9c2; - } - - .lg\:bg-yellow-lightest { - background-color: #fcfbeb; - } - - .lg\:bg-green-darkest { - background-color: #0f2f21; - } - - .lg\:bg-green-darker { - background-color: #1a4731; - } - - .lg\:bg-green-dark { - background-color: #1f9d55; - } - - .lg\:bg-green { - background-color: #38c172; - } - - .lg\:bg-green-light { - background-color: #51d88a; - } - - .lg\:bg-green-lighter { - background-color: #a2f5bf; - } - - .lg\:bg-green-lightest { - background-color: #e3fcec; - } - - .lg\:bg-teal-darkest { - background-color: #0d3331; - } - - .lg\:bg-teal-darker { - background-color: #20504f; - } - - .lg\:bg-teal-dark { - background-color: #38a89d; - } - - .lg\:bg-teal { - background-color: #4dc0b5; - } - - .lg\:bg-teal-light { - background-color: #64d5ca; - } - - .lg\:bg-teal-lighter { - background-color: #a0f0ed; - } - - .lg\:bg-teal-lightest { - background-color: #e8fffe; - } - - .lg\:bg-blue-darkest { - background-color: #12283a; - } - - .lg\:bg-blue-darker { - background-color: #1c3d5a; - } - - .lg\:bg-blue-dark { - background-color: #2779bd; - } - - .lg\:bg-blue { - background-color: #3490dc; - } - - .lg\:bg-blue-light { - background-color: #6cb2eb; - } - - .lg\:bg-blue-lighter { - background-color: #bcdefa; - } - - .lg\:bg-blue-lightest { - background-color: #eff8ff; - } - - .lg\:bg-indigo-darkest { - background-color: #191e38; - } - - .lg\:bg-indigo-darker { - background-color: #2f365f; - } - - .lg\:bg-indigo-dark { - background-color: #5661b3; - } - - .lg\:bg-indigo { - background-color: #6574cd; - } - - .lg\:bg-indigo-light { - background-color: #7886d7; - } - - .lg\:bg-indigo-lighter { - background-color: #b2b7ff; - } - - .lg\:bg-indigo-lightest { - background-color: #e6e8ff; - } - - .lg\:bg-purple-darkest { - background-color: #21183c; - } - - .lg\:bg-purple-darker { - background-color: #382b5f; - } - - .lg\:bg-purple-dark { - background-color: #794acf; - } - - .lg\:bg-purple { - background-color: #9561e2; - } - - .lg\:bg-purple-light { - background-color: #a779e9; - } - - .lg\:bg-purple-lighter { - background-color: #d6bbfc; - } - - .lg\:bg-purple-lightest { - background-color: #f3ebff; - } - - .lg\:bg-pink-darkest { - background-color: #451225; - } - - .lg\:bg-pink-darker { - background-color: #6f213f; - } - - .lg\:bg-pink-dark { - background-color: #eb5286; - } - - .lg\:bg-pink { - background-color: #f66d9b; - } - - .lg\:bg-pink-light { - background-color: #fa7ea8; - } - - .lg\:bg-pink-lighter { - background-color: #ffbbca; - } - - .lg\:bg-pink-lightest { - background-color: #ffebef; - } - - .lg\:hover\:bg-transparent:hover { - background-color: transparent; - } - - .lg\:hover\:bg-black:hover { - background-color: #22292f; - } - - .lg\:hover\:bg-grey-darkest:hover { - background-color: #3d4852; - } - - .lg\:hover\:bg-grey-darker:hover { - background-color: #606f7b; - } - - .lg\:hover\:bg-grey-dark:hover { - background-color: #8795a1; - } - - .lg\:hover\:bg-grey:hover { - background-color: #b8c2cc; - } - - .lg\:hover\:bg-grey-light:hover { - background-color: #dae1e7; - } - - .lg\:hover\:bg-grey-lighter:hover { - background-color: #f1f5f8; - } - - .lg\:hover\:bg-grey-lightest:hover { - background-color: #f8fafc; - } - - .lg\:hover\:bg-white:hover { - background-color: #fff; - } - - .lg\:hover\:bg-red-darkest:hover { - background-color: #3b0d0c; - } - - .lg\:hover\:bg-red-darker:hover { - background-color: #621b18; - } - - .lg\:hover\:bg-red-dark:hover { - background-color: #cc1f1a; - } - - .lg\:hover\:bg-red:hover { - background-color: #e3342f; - } - - .lg\:hover\:bg-red-light:hover { - background-color: #ef5753; - } - - .lg\:hover\:bg-red-lighter:hover { - background-color: #f9acaa; - } - - .lg\:hover\:bg-red-lightest:hover { - background-color: #fcebea; - } - - .lg\:hover\:bg-orange-darkest:hover { - background-color: #462a16; - } - - .lg\:hover\:bg-orange-darker:hover { - background-color: #613b1f; - } - - .lg\:hover\:bg-orange-dark:hover { - background-color: #de751f; - } - - .lg\:hover\:bg-orange:hover { - background-color: #f6993f; - } - - .lg\:hover\:bg-orange-light:hover { - background-color: #faad63; - } - - .lg\:hover\:bg-orange-lighter:hover { - background-color: #fcd9b6; - } - - .lg\:hover\:bg-orange-lightest:hover { - background-color: #fff5eb; - } - - .lg\:hover\:bg-yellow-darkest:hover { - background-color: #453411; - } - - .lg\:hover\:bg-yellow-darker:hover { - background-color: #684f1d; - } - - .lg\:hover\:bg-yellow-dark:hover { - background-color: #f2d024; - } - - .lg\:hover\:bg-yellow:hover { - background-color: #ffed4a; - } - - .lg\:hover\:bg-yellow-light:hover { - background-color: #fff382; - } - - .lg\:hover\:bg-yellow-lighter:hover { - background-color: #fff9c2; - } - - .lg\:hover\:bg-yellow-lightest:hover { - background-color: #fcfbeb; - } - - .lg\:hover\:bg-green-darkest:hover { - background-color: #0f2f21; - } - - .lg\:hover\:bg-green-darker:hover { - background-color: #1a4731; - } - - .lg\:hover\:bg-green-dark:hover { - background-color: #1f9d55; - } - - .lg\:hover\:bg-green:hover { - background-color: #38c172; - } - - .lg\:hover\:bg-green-light:hover { - background-color: #51d88a; - } - - .lg\:hover\:bg-green-lighter:hover { - background-color: #a2f5bf; - } - - .lg\:hover\:bg-green-lightest:hover { - background-color: #e3fcec; - } - - .lg\:hover\:bg-teal-darkest:hover { - background-color: #0d3331; - } - - .lg\:hover\:bg-teal-darker:hover { - background-color: #20504f; - } - - .lg\:hover\:bg-teal-dark:hover { - background-color: #38a89d; - } - - .lg\:hover\:bg-teal:hover { - background-color: #4dc0b5; - } - - .lg\:hover\:bg-teal-light:hover { - background-color: #64d5ca; - } - - .lg\:hover\:bg-teal-lighter:hover { - background-color: #a0f0ed; - } - - .lg\:hover\:bg-teal-lightest:hover { - background-color: #e8fffe; - } - - .lg\:hover\:bg-blue-darkest:hover { - background-color: #12283a; - } - - .lg\:hover\:bg-blue-darker:hover { - background-color: #1c3d5a; - } - - .lg\:hover\:bg-blue-dark:hover { - background-color: #2779bd; - } - - .lg\:hover\:bg-blue:hover { - background-color: #3490dc; - } - - .lg\:hover\:bg-blue-light:hover { - background-color: #6cb2eb; - } - - .lg\:hover\:bg-blue-lighter:hover { - background-color: #bcdefa; - } - - .lg\:hover\:bg-blue-lightest:hover { - background-color: #eff8ff; - } - - .lg\:hover\:bg-indigo-darkest:hover { - background-color: #191e38; - } - - .lg\:hover\:bg-indigo-darker:hover { - background-color: #2f365f; - } - - .lg\:hover\:bg-indigo-dark:hover { - background-color: #5661b3; - } - - .lg\:hover\:bg-indigo:hover { - background-color: #6574cd; - } - - .lg\:hover\:bg-indigo-light:hover { - background-color: #7886d7; - } - - .lg\:hover\:bg-indigo-lighter:hover { - background-color: #b2b7ff; - } - - .lg\:hover\:bg-indigo-lightest:hover { - background-color: #e6e8ff; - } - - .lg\:hover\:bg-purple-darkest:hover { - background-color: #21183c; - } - - .lg\:hover\:bg-purple-darker:hover { - background-color: #382b5f; - } - - .lg\:hover\:bg-purple-dark:hover { - background-color: #794acf; - } - - .lg\:hover\:bg-purple:hover { - background-color: #9561e2; - } - - .lg\:hover\:bg-purple-light:hover { - background-color: #a779e9; - } - - .lg\:hover\:bg-purple-lighter:hover { - background-color: #d6bbfc; - } - - .lg\:hover\:bg-purple-lightest:hover { - background-color: #f3ebff; - } - - .lg\:hover\:bg-pink-darkest:hover { - background-color: #451225; - } - - .lg\:hover\:bg-pink-darker:hover { - background-color: #6f213f; - } - - .lg\:hover\:bg-pink-dark:hover { - background-color: #eb5286; - } - - .lg\:hover\:bg-pink:hover { - background-color: #f66d9b; - } - - .lg\:hover\:bg-pink-light:hover { - background-color: #fa7ea8; - } - - .lg\:hover\:bg-pink-lighter:hover { - background-color: #ffbbca; - } - - .lg\:hover\:bg-pink-lightest:hover { - background-color: #ffebef; - } - - .lg\:focus\:bg-transparent:focus { - background-color: transparent; - } - - .lg\:focus\:bg-black:focus { - background-color: #22292f; - } - - .lg\:focus\:bg-grey-darkest:focus { - background-color: #3d4852; - } - - .lg\:focus\:bg-grey-darker:focus { - background-color: #606f7b; - } - - .lg\:focus\:bg-grey-dark:focus { - background-color: #8795a1; - } - - .lg\:focus\:bg-grey:focus { - background-color: #b8c2cc; - } - - .lg\:focus\:bg-grey-light:focus { - background-color: #dae1e7; - } - - .lg\:focus\:bg-grey-lighter:focus { - background-color: #f1f5f8; - } - - .lg\:focus\:bg-grey-lightest:focus { - background-color: #f8fafc; - } - - .lg\:focus\:bg-white:focus { - background-color: #fff; - } - - .lg\:focus\:bg-red-darkest:focus { - background-color: #3b0d0c; - } - - .lg\:focus\:bg-red-darker:focus { - background-color: #621b18; - } - - .lg\:focus\:bg-red-dark:focus { - background-color: #cc1f1a; - } - - .lg\:focus\:bg-red:focus { - background-color: #e3342f; - } - - .lg\:focus\:bg-red-light:focus { - background-color: #ef5753; - } - - .lg\:focus\:bg-red-lighter:focus { - background-color: #f9acaa; - } - - .lg\:focus\:bg-red-lightest:focus { - background-color: #fcebea; - } - - .lg\:focus\:bg-orange-darkest:focus { - background-color: #462a16; - } - - .lg\:focus\:bg-orange-darker:focus { - background-color: #613b1f; - } - - .lg\:focus\:bg-orange-dark:focus { - background-color: #de751f; - } - - .lg\:focus\:bg-orange:focus { - background-color: #f6993f; - } - - .lg\:focus\:bg-orange-light:focus { - background-color: #faad63; - } - - .lg\:focus\:bg-orange-lighter:focus { - background-color: #fcd9b6; - } - - .lg\:focus\:bg-orange-lightest:focus { - background-color: #fff5eb; - } - - .lg\:focus\:bg-yellow-darkest:focus { - background-color: #453411; - } - - .lg\:focus\:bg-yellow-darker:focus { - background-color: #684f1d; - } - - .lg\:focus\:bg-yellow-dark:focus { - background-color: #f2d024; - } - - .lg\:focus\:bg-yellow:focus { - background-color: #ffed4a; - } - - .lg\:focus\:bg-yellow-light:focus { - background-color: #fff382; - } - - .lg\:focus\:bg-yellow-lighter:focus { - background-color: #fff9c2; - } - - .lg\:focus\:bg-yellow-lightest:focus { - background-color: #fcfbeb; - } - - .lg\:focus\:bg-green-darkest:focus { - background-color: #0f2f21; - } - - .lg\:focus\:bg-green-darker:focus { - background-color: #1a4731; - } - - .lg\:focus\:bg-green-dark:focus { - background-color: #1f9d55; - } - - .lg\:focus\:bg-green:focus { - background-color: #38c172; - } - - .lg\:focus\:bg-green-light:focus { - background-color: #51d88a; - } - - .lg\:focus\:bg-green-lighter:focus { - background-color: #a2f5bf; - } - - .lg\:focus\:bg-green-lightest:focus { - background-color: #e3fcec; - } - - .lg\:focus\:bg-teal-darkest:focus { - background-color: #0d3331; - } - - .lg\:focus\:bg-teal-darker:focus { - background-color: #20504f; - } - - .lg\:focus\:bg-teal-dark:focus { - background-color: #38a89d; - } - - .lg\:focus\:bg-teal:focus { - background-color: #4dc0b5; - } - - .lg\:focus\:bg-teal-light:focus { - background-color: #64d5ca; - } - - .lg\:focus\:bg-teal-lighter:focus { - background-color: #a0f0ed; - } - - .lg\:focus\:bg-teal-lightest:focus { - background-color: #e8fffe; - } - - .lg\:focus\:bg-blue-darkest:focus { - background-color: #12283a; - } - - .lg\:focus\:bg-blue-darker:focus { - background-color: #1c3d5a; - } - - .lg\:focus\:bg-blue-dark:focus { - background-color: #2779bd; - } - - .lg\:focus\:bg-blue:focus { - background-color: #3490dc; - } - - .lg\:focus\:bg-blue-light:focus { - background-color: #6cb2eb; - } - - .lg\:focus\:bg-blue-lighter:focus { - background-color: #bcdefa; - } - - .lg\:focus\:bg-blue-lightest:focus { - background-color: #eff8ff; - } - - .lg\:focus\:bg-indigo-darkest:focus { - background-color: #191e38; - } - - .lg\:focus\:bg-indigo-darker:focus { - background-color: #2f365f; - } - - .lg\:focus\:bg-indigo-dark:focus { - background-color: #5661b3; - } - - .lg\:focus\:bg-indigo:focus { - background-color: #6574cd; - } - - .lg\:focus\:bg-indigo-light:focus { - background-color: #7886d7; - } - - .lg\:focus\:bg-indigo-lighter:focus { - background-color: #b2b7ff; - } - - .lg\:focus\:bg-indigo-lightest:focus { - background-color: #e6e8ff; - } - - .lg\:focus\:bg-purple-darkest:focus { - background-color: #21183c; - } - - .lg\:focus\:bg-purple-darker:focus { - background-color: #382b5f; - } - - .lg\:focus\:bg-purple-dark:focus { - background-color: #794acf; - } - - .lg\:focus\:bg-purple:focus { - background-color: #9561e2; - } - - .lg\:focus\:bg-purple-light:focus { - background-color: #a779e9; - } - - .lg\:focus\:bg-purple-lighter:focus { - background-color: #d6bbfc; - } - - .lg\:focus\:bg-purple-lightest:focus { - background-color: #f3ebff; - } - - .lg\:focus\:bg-pink-darkest:focus { - background-color: #451225; - } - - .lg\:focus\:bg-pink-darker:focus { - background-color: #6f213f; - } - - .lg\:focus\:bg-pink-dark:focus { - background-color: #eb5286; - } - - .lg\:focus\:bg-pink:focus { - background-color: #f66d9b; - } - - .lg\:focus\:bg-pink-light:focus { - background-color: #fa7ea8; - } - - .lg\:focus\:bg-pink-lighter:focus { - background-color: #ffbbca; - } - - .lg\:focus\:bg-pink-lightest:focus { - background-color: #ffebef; - } - - .lg\:bg-bottom { - background-position: bottom; - } - - .lg\:bg-center { - background-position: center; - } - - .lg\:bg-left { - background-position: left; - } - - .lg\:bg-left-bottom { - background-position: left bottom; - } - - .lg\:bg-left-top { - background-position: left top; - } - - .lg\:bg-right { - background-position: right; - } - - .lg\:bg-right-bottom { - background-position: right bottom; - } - - .lg\:bg-right-top { - background-position: right top; - } - - .lg\:bg-top { - background-position: top; - } - - .lg\:bg-repeat { - background-repeat: repeat; - } - - .lg\:bg-no-repeat { - background-repeat: no-repeat; - } - - .lg\:bg-repeat-x { - background-repeat: repeat-x; - } - - .lg\:bg-repeat-y { - background-repeat: repeat-y; - } - - .lg\:bg-auto { - background-size: auto; - } - - .lg\:bg-cover { - background-size: cover; - } - - .lg\:bg-contain { - background-size: contain; - } - - .lg\:border-transparent { - border-color: transparent; - } - - .lg\:border-black { - border-color: #22292f; - } - - .lg\:border-grey-darkest { - border-color: #3d4852; - } - - .lg\:border-grey-darker { - border-color: #606f7b; - } - - .lg\:border-grey-dark { - border-color: #8795a1; - } - - .lg\:border-grey { - border-color: #b8c2cc; - } - - .lg\:border-grey-light { - border-color: #dae1e7; - } - - .lg\:border-grey-lighter { - border-color: #f1f5f8; - } - - .lg\:border-grey-lightest { - border-color: #f8fafc; - } - - .lg\:border-white { - border-color: #fff; - } - - .lg\:border-red-darkest { - border-color: #3b0d0c; - } - - .lg\:border-red-darker { - border-color: #621b18; - } - - .lg\:border-red-dark { - border-color: #cc1f1a; - } - - .lg\:border-red { - border-color: #e3342f; - } - - .lg\:border-red-light { - border-color: #ef5753; - } - - .lg\:border-red-lighter { - border-color: #f9acaa; - } - - .lg\:border-red-lightest { - border-color: #fcebea; - } - - .lg\:border-orange-darkest { - border-color: #462a16; - } - - .lg\:border-orange-darker { - border-color: #613b1f; - } - - .lg\:border-orange-dark { - border-color: #de751f; - } - - .lg\:border-orange { - border-color: #f6993f; - } - - .lg\:border-orange-light { - border-color: #faad63; - } - - .lg\:border-orange-lighter { - border-color: #fcd9b6; - } - - .lg\:border-orange-lightest { - border-color: #fff5eb; - } - - .lg\:border-yellow-darkest { - border-color: #453411; - } - - .lg\:border-yellow-darker { - border-color: #684f1d; - } - - .lg\:border-yellow-dark { - border-color: #f2d024; - } - - .lg\:border-yellow { - border-color: #ffed4a; - } - - .lg\:border-yellow-light { - border-color: #fff382; - } - - .lg\:border-yellow-lighter { - border-color: #fff9c2; - } - - .lg\:border-yellow-lightest { - border-color: #fcfbeb; - } - - .lg\:border-green-darkest { - border-color: #0f2f21; - } - - .lg\:border-green-darker { - border-color: #1a4731; - } - - .lg\:border-green-dark { - border-color: #1f9d55; - } - - .lg\:border-green { - border-color: #38c172; - } - - .lg\:border-green-light { - border-color: #51d88a; - } - - .lg\:border-green-lighter { - border-color: #a2f5bf; - } - - .lg\:border-green-lightest { - border-color: #e3fcec; - } - - .lg\:border-teal-darkest { - border-color: #0d3331; - } - - .lg\:border-teal-darker { - border-color: #20504f; - } - - .lg\:border-teal-dark { - border-color: #38a89d; - } - - .lg\:border-teal { - border-color: #4dc0b5; - } - - .lg\:border-teal-light { - border-color: #64d5ca; - } - - .lg\:border-teal-lighter { - border-color: #a0f0ed; - } - - .lg\:border-teal-lightest { - border-color: #e8fffe; - } - - .lg\:border-blue-darkest { - border-color: #12283a; - } - - .lg\:border-blue-darker { - border-color: #1c3d5a; - } - - .lg\:border-blue-dark { - border-color: #2779bd; - } - - .lg\:border-blue { - border-color: #3490dc; - } - - .lg\:border-blue-light { - border-color: #6cb2eb; - } - - .lg\:border-blue-lighter { - border-color: #bcdefa; - } - - .lg\:border-blue-lightest { - border-color: #eff8ff; - } - - .lg\:border-indigo-darkest { - border-color: #191e38; - } - - .lg\:border-indigo-darker { - border-color: #2f365f; - } - - .lg\:border-indigo-dark { - border-color: #5661b3; - } - - .lg\:border-indigo { - border-color: #6574cd; - } - - .lg\:border-indigo-light { - border-color: #7886d7; - } - - .lg\:border-indigo-lighter { - border-color: #b2b7ff; - } - - .lg\:border-indigo-lightest { - border-color: #e6e8ff; - } - - .lg\:border-purple-darkest { - border-color: #21183c; - } - - .lg\:border-purple-darker { - border-color: #382b5f; - } - - .lg\:border-purple-dark { - border-color: #794acf; - } - - .lg\:border-purple { - border-color: #9561e2; - } - - .lg\:border-purple-light { - border-color: #a779e9; - } - - .lg\:border-purple-lighter { - border-color: #d6bbfc; - } - - .lg\:border-purple-lightest { - border-color: #f3ebff; - } - - .lg\:border-pink-darkest { - border-color: #451225; - } - - .lg\:border-pink-darker { - border-color: #6f213f; - } - - .lg\:border-pink-dark { - border-color: #eb5286; - } - - .lg\:border-pink { - border-color: #f66d9b; - } - - .lg\:border-pink-light { - border-color: #fa7ea8; - } - - .lg\:border-pink-lighter { - border-color: #ffbbca; - } - - .lg\:border-pink-lightest { - border-color: #ffebef; - } - - .lg\:hover\:border-transparent:hover { - border-color: transparent; - } - - .lg\:hover\:border-black:hover { - border-color: #22292f; - } - - .lg\:hover\:border-grey-darkest:hover { - border-color: #3d4852; - } - - .lg\:hover\:border-grey-darker:hover { - border-color: #606f7b; - } - - .lg\:hover\:border-grey-dark:hover { - border-color: #8795a1; - } - - .lg\:hover\:border-grey:hover { - border-color: #b8c2cc; - } - - .lg\:hover\:border-grey-light:hover { - border-color: #dae1e7; - } - - .lg\:hover\:border-grey-lighter:hover { - border-color: #f1f5f8; - } - - .lg\:hover\:border-grey-lightest:hover { - border-color: #f8fafc; - } - - .lg\:hover\:border-white:hover { - border-color: #fff; - } - - .lg\:hover\:border-red-darkest:hover { - border-color: #3b0d0c; - } - - .lg\:hover\:border-red-darker:hover { - border-color: #621b18; - } - - .lg\:hover\:border-red-dark:hover { - border-color: #cc1f1a; - } - - .lg\:hover\:border-red:hover { - border-color: #e3342f; - } - - .lg\:hover\:border-red-light:hover { - border-color: #ef5753; - } - - .lg\:hover\:border-red-lighter:hover { - border-color: #f9acaa; - } - - .lg\:hover\:border-red-lightest:hover { - border-color: #fcebea; - } - - .lg\:hover\:border-orange-darkest:hover { - border-color: #462a16; - } - - .lg\:hover\:border-orange-darker:hover { - border-color: #613b1f; - } - - .lg\:hover\:border-orange-dark:hover { - border-color: #de751f; - } - - .lg\:hover\:border-orange:hover { - border-color: #f6993f; - } - - .lg\:hover\:border-orange-light:hover { - border-color: #faad63; - } - - .lg\:hover\:border-orange-lighter:hover { - border-color: #fcd9b6; - } - - .lg\:hover\:border-orange-lightest:hover { - border-color: #fff5eb; - } - - .lg\:hover\:border-yellow-darkest:hover { - border-color: #453411; - } - - .lg\:hover\:border-yellow-darker:hover { - border-color: #684f1d; - } - - .lg\:hover\:border-yellow-dark:hover { - border-color: #f2d024; - } - - .lg\:hover\:border-yellow:hover { - border-color: #ffed4a; - } - - .lg\:hover\:border-yellow-light:hover { - border-color: #fff382; - } - - .lg\:hover\:border-yellow-lighter:hover { - border-color: #fff9c2; - } - - .lg\:hover\:border-yellow-lightest:hover { - border-color: #fcfbeb; - } - - .lg\:hover\:border-green-darkest:hover { - border-color: #0f2f21; - } - - .lg\:hover\:border-green-darker:hover { - border-color: #1a4731; - } - - .lg\:hover\:border-green-dark:hover { - border-color: #1f9d55; - } - - .lg\:hover\:border-green:hover { - border-color: #38c172; - } - - .lg\:hover\:border-green-light:hover { - border-color: #51d88a; - } - - .lg\:hover\:border-green-lighter:hover { - border-color: #a2f5bf; - } - - .lg\:hover\:border-green-lightest:hover { - border-color: #e3fcec; - } - - .lg\:hover\:border-teal-darkest:hover { - border-color: #0d3331; - } - - .lg\:hover\:border-teal-darker:hover { - border-color: #20504f; - } - - .lg\:hover\:border-teal-dark:hover { - border-color: #38a89d; - } - - .lg\:hover\:border-teal:hover { - border-color: #4dc0b5; - } - - .lg\:hover\:border-teal-light:hover { - border-color: #64d5ca; - } - - .lg\:hover\:border-teal-lighter:hover { - border-color: #a0f0ed; - } - - .lg\:hover\:border-teal-lightest:hover { - border-color: #e8fffe; - } - - .lg\:hover\:border-blue-darkest:hover { - border-color: #12283a; - } - - .lg\:hover\:border-blue-darker:hover { - border-color: #1c3d5a; - } - - .lg\:hover\:border-blue-dark:hover { - border-color: #2779bd; - } - - .lg\:hover\:border-blue:hover { - border-color: #3490dc; - } - - .lg\:hover\:border-blue-light:hover { - border-color: #6cb2eb; - } - - .lg\:hover\:border-blue-lighter:hover { - border-color: #bcdefa; - } - - .lg\:hover\:border-blue-lightest:hover { - border-color: #eff8ff; - } - - .lg\:hover\:border-indigo-darkest:hover { - border-color: #191e38; - } - - .lg\:hover\:border-indigo-darker:hover { - border-color: #2f365f; - } - - .lg\:hover\:border-indigo-dark:hover { - border-color: #5661b3; - } - - .lg\:hover\:border-indigo:hover { - border-color: #6574cd; - } - - .lg\:hover\:border-indigo-light:hover { - border-color: #7886d7; - } - - .lg\:hover\:border-indigo-lighter:hover { - border-color: #b2b7ff; - } - - .lg\:hover\:border-indigo-lightest:hover { - border-color: #e6e8ff; - } - - .lg\:hover\:border-purple-darkest:hover { - border-color: #21183c; - } - - .lg\:hover\:border-purple-darker:hover { - border-color: #382b5f; - } - - .lg\:hover\:border-purple-dark:hover { - border-color: #794acf; - } - - .lg\:hover\:border-purple:hover { - border-color: #9561e2; - } - - .lg\:hover\:border-purple-light:hover { - border-color: #a779e9; - } - - .lg\:hover\:border-purple-lighter:hover { - border-color: #d6bbfc; - } - - .lg\:hover\:border-purple-lightest:hover { - border-color: #f3ebff; - } - - .lg\:hover\:border-pink-darkest:hover { - border-color: #451225; - } - - .lg\:hover\:border-pink-darker:hover { - border-color: #6f213f; - } - - .lg\:hover\:border-pink-dark:hover { - border-color: #eb5286; - } - - .lg\:hover\:border-pink:hover { - border-color: #f66d9b; - } - - .lg\:hover\:border-pink-light:hover { - border-color: #fa7ea8; - } - - .lg\:hover\:border-pink-lighter:hover { - border-color: #ffbbca; - } - - .lg\:hover\:border-pink-lightest:hover { - border-color: #ffebef; - } - - .lg\:focus\:border-transparent:focus { - border-color: transparent; - } - - .lg\:focus\:border-black:focus { - border-color: #22292f; - } - - .lg\:focus\:border-grey-darkest:focus { - border-color: #3d4852; - } - - .lg\:focus\:border-grey-darker:focus { - border-color: #606f7b; - } - - .lg\:focus\:border-grey-dark:focus { - border-color: #8795a1; - } - - .lg\:focus\:border-grey:focus { - border-color: #b8c2cc; - } - - .lg\:focus\:border-grey-light:focus { - border-color: #dae1e7; - } - - .lg\:focus\:border-grey-lighter:focus { - border-color: #f1f5f8; - } - - .lg\:focus\:border-grey-lightest:focus { - border-color: #f8fafc; - } - - .lg\:focus\:border-white:focus { - border-color: #fff; - } - - .lg\:focus\:border-red-darkest:focus { - border-color: #3b0d0c; - } - - .lg\:focus\:border-red-darker:focus { - border-color: #621b18; - } - - .lg\:focus\:border-red-dark:focus { - border-color: #cc1f1a; - } - - .lg\:focus\:border-red:focus { - border-color: #e3342f; - } - - .lg\:focus\:border-red-light:focus { - border-color: #ef5753; - } - - .lg\:focus\:border-red-lighter:focus { - border-color: #f9acaa; - } - - .lg\:focus\:border-red-lightest:focus { - border-color: #fcebea; - } - - .lg\:focus\:border-orange-darkest:focus { - border-color: #462a16; - } - - .lg\:focus\:border-orange-darker:focus { - border-color: #613b1f; - } - - .lg\:focus\:border-orange-dark:focus { - border-color: #de751f; - } - - .lg\:focus\:border-orange:focus { - border-color: #f6993f; - } - - .lg\:focus\:border-orange-light:focus { - border-color: #faad63; - } - - .lg\:focus\:border-orange-lighter:focus { - border-color: #fcd9b6; - } - - .lg\:focus\:border-orange-lightest:focus { - border-color: #fff5eb; - } - - .lg\:focus\:border-yellow-darkest:focus { - border-color: #453411; - } - - .lg\:focus\:border-yellow-darker:focus { - border-color: #684f1d; - } - - .lg\:focus\:border-yellow-dark:focus { - border-color: #f2d024; - } - - .lg\:focus\:border-yellow:focus { - border-color: #ffed4a; - } - - .lg\:focus\:border-yellow-light:focus { - border-color: #fff382; - } - - .lg\:focus\:border-yellow-lighter:focus { - border-color: #fff9c2; - } - - .lg\:focus\:border-yellow-lightest:focus { - border-color: #fcfbeb; - } - - .lg\:focus\:border-green-darkest:focus { - border-color: #0f2f21; - } - - .lg\:focus\:border-green-darker:focus { - border-color: #1a4731; - } - - .lg\:focus\:border-green-dark:focus { - border-color: #1f9d55; - } - - .lg\:focus\:border-green:focus { - border-color: #38c172; - } - - .lg\:focus\:border-green-light:focus { - border-color: #51d88a; - } - - .lg\:focus\:border-green-lighter:focus { - border-color: #a2f5bf; - } - - .lg\:focus\:border-green-lightest:focus { - border-color: #e3fcec; - } - - .lg\:focus\:border-teal-darkest:focus { - border-color: #0d3331; - } - - .lg\:focus\:border-teal-darker:focus { - border-color: #20504f; - } - - .lg\:focus\:border-teal-dark:focus { - border-color: #38a89d; - } - - .lg\:focus\:border-teal:focus { - border-color: #4dc0b5; - } - - .lg\:focus\:border-teal-light:focus { - border-color: #64d5ca; - } - - .lg\:focus\:border-teal-lighter:focus { - border-color: #a0f0ed; - } - - .lg\:focus\:border-teal-lightest:focus { - border-color: #e8fffe; - } - - .lg\:focus\:border-blue-darkest:focus { - border-color: #12283a; - } - - .lg\:focus\:border-blue-darker:focus { - border-color: #1c3d5a; - } - - .lg\:focus\:border-blue-dark:focus { - border-color: #2779bd; - } - - .lg\:focus\:border-blue:focus { - border-color: #3490dc; - } - - .lg\:focus\:border-blue-light:focus { - border-color: #6cb2eb; - } - - .lg\:focus\:border-blue-lighter:focus { - border-color: #bcdefa; - } - - .lg\:focus\:border-blue-lightest:focus { - border-color: #eff8ff; - } - - .lg\:focus\:border-indigo-darkest:focus { - border-color: #191e38; - } - - .lg\:focus\:border-indigo-darker:focus { - border-color: #2f365f; - } - - .lg\:focus\:border-indigo-dark:focus { - border-color: #5661b3; - } - - .lg\:focus\:border-indigo:focus { - border-color: #6574cd; - } - - .lg\:focus\:border-indigo-light:focus { - border-color: #7886d7; - } - - .lg\:focus\:border-indigo-lighter:focus { - border-color: #b2b7ff; - } - - .lg\:focus\:border-indigo-lightest:focus { - border-color: #e6e8ff; - } - - .lg\:focus\:border-purple-darkest:focus { - border-color: #21183c; - } - - .lg\:focus\:border-purple-darker:focus { - border-color: #382b5f; - } - - .lg\:focus\:border-purple-dark:focus { - border-color: #794acf; - } - - .lg\:focus\:border-purple:focus { - border-color: #9561e2; - } - - .lg\:focus\:border-purple-light:focus { - border-color: #a779e9; - } - - .lg\:focus\:border-purple-lighter:focus { - border-color: #d6bbfc; - } - - .lg\:focus\:border-purple-lightest:focus { - border-color: #f3ebff; - } - - .lg\:focus\:border-pink-darkest:focus { - border-color: #451225; - } - - .lg\:focus\:border-pink-darker:focus { - border-color: #6f213f; - } - - .lg\:focus\:border-pink-dark:focus { - border-color: #eb5286; - } - - .lg\:focus\:border-pink:focus { - border-color: #f66d9b; - } - - .lg\:focus\:border-pink-light:focus { - border-color: #fa7ea8; - } - - .lg\:focus\:border-pink-lighter:focus { - border-color: #ffbbca; - } - - .lg\:focus\:border-pink-lightest:focus { - border-color: #ffebef; - } - - .lg\:rounded-none { - border-radius: 0; - } - - .lg\:rounded-sm { - border-radius: .125rem; - } - - .lg\:rounded { - border-radius: .25rem; - } - - .lg\:rounded-lg { - border-radius: .5rem; - } - - .lg\:rounded-full { - border-radius: 9999px; - } - - .lg\:rounded-t-none { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - - .lg\:rounded-r-none { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - - .lg\:rounded-b-none { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - } - - .lg\:rounded-l-none { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - } - - .lg\:rounded-t-sm { - border-top-left-radius: .125rem; - border-top-right-radius: .125rem; - } - - .lg\:rounded-r-sm { - border-top-right-radius: .125rem; - border-bottom-right-radius: .125rem; - } - - .lg\:rounded-b-sm { - border-bottom-right-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .lg\:rounded-l-sm { - border-top-left-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .lg\:rounded-t { - border-top-left-radius: .25rem; - border-top-right-radius: .25rem; - } - - .lg\:rounded-r { - border-top-right-radius: .25rem; - border-bottom-right-radius: .25rem; - } - - .lg\:rounded-b { - border-bottom-right-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .lg\:rounded-l { - border-top-left-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .lg\:rounded-t-lg { - border-top-left-radius: .5rem; - border-top-right-radius: .5rem; - } - - .lg\:rounded-r-lg { - border-top-right-radius: .5rem; - border-bottom-right-radius: .5rem; - } - - .lg\:rounded-b-lg { - border-bottom-right-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .lg\:rounded-l-lg { - border-top-left-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .lg\:rounded-t-full { - border-top-left-radius: 9999px; - border-top-right-radius: 9999px; - } - - .lg\:rounded-r-full { - border-top-right-radius: 9999px; - border-bottom-right-radius: 9999px; - } - - .lg\:rounded-b-full { - border-bottom-right-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .lg\:rounded-l-full { - border-top-left-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .lg\:rounded-tl-none { - border-top-left-radius: 0; - } - - .lg\:rounded-tr-none { - border-top-right-radius: 0; - } - - .lg\:rounded-br-none { - border-bottom-right-radius: 0; - } - - .lg\:rounded-bl-none { - border-bottom-left-radius: 0; - } - - .lg\:rounded-tl-sm { - border-top-left-radius: .125rem; - } - - .lg\:rounded-tr-sm { - border-top-right-radius: .125rem; - } - - .lg\:rounded-br-sm { - border-bottom-right-radius: .125rem; - } - - .lg\:rounded-bl-sm { - border-bottom-left-radius: .125rem; - } - - .lg\:rounded-tl { - border-top-left-radius: .25rem; - } - - .lg\:rounded-tr { - border-top-right-radius: .25rem; - } - - .lg\:rounded-br { - border-bottom-right-radius: .25rem; - } - - .lg\:rounded-bl { - border-bottom-left-radius: .25rem; - } - - .lg\:rounded-tl-lg { - border-top-left-radius: .5rem; - } - - .lg\:rounded-tr-lg { - border-top-right-radius: .5rem; - } - - .lg\:rounded-br-lg { - border-bottom-right-radius: .5rem; - } - - .lg\:rounded-bl-lg { - border-bottom-left-radius: .5rem; - } - - .lg\:rounded-tl-full { - border-top-left-radius: 9999px; - } - - .lg\:rounded-tr-full { - border-top-right-radius: 9999px; - } - - .lg\:rounded-br-full { - border-bottom-right-radius: 9999px; - } - - .lg\:rounded-bl-full { - border-bottom-left-radius: 9999px; - } - - .lg\:border-solid { - border-style: solid; - } - - .lg\:border-dashed { - border-style: dashed; - } - - .lg\:border-dotted { - border-style: dotted; - } - - .lg\:border-none { - border-style: none; - } - - .lg\:border-0 { - border-width: 0; - } - - .lg\:border-2 { - border-width: 2px; - } - - .lg\:border-4 { - border-width: 4px; - } - - .lg\:border-8 { - border-width: 8px; - } - - .lg\:border { - border-width: 1px; - } - - .lg\:border-t-0 { - border-top-width: 0; - } - - .lg\:border-r-0 { - border-right-width: 0; - } - - .lg\:border-b-0 { - border-bottom-width: 0; - } - - .lg\:border-l-0 { - border-left-width: 0; - } - - .lg\:border-t-2 { - border-top-width: 2px; - } - - .lg\:border-r-2 { - border-right-width: 2px; - } - - .lg\:border-b-2 { - border-bottom-width: 2px; - } - - .lg\:border-l-2 { - border-left-width: 2px; - } - - .lg\:border-t-4 { - border-top-width: 4px; - } - - .lg\:border-r-4 { - border-right-width: 4px; - } - - .lg\:border-b-4 { - border-bottom-width: 4px; - } - - .lg\:border-l-4 { - border-left-width: 4px; - } - - .lg\:border-t-8 { - border-top-width: 8px; - } - - .lg\:border-r-8 { - border-right-width: 8px; - } - - .lg\:border-b-8 { - border-bottom-width: 8px; - } - - .lg\:border-l-8 { - border-left-width: 8px; - } - - .lg\:border-t { - border-top-width: 1px; - } - - .lg\:border-r { - border-right-width: 1px; - } - - .lg\:border-b { - border-bottom-width: 1px; - } - - .lg\:border-l { - border-left-width: 1px; - } - - .lg\:cursor-auto { - cursor: auto; - } - - .lg\:cursor-default { - cursor: default; - } - - .lg\:cursor-pointer { - cursor: pointer; - } - - .lg\:cursor-wait { - cursor: wait; - } - - .lg\:cursor-move { - cursor: move; - } - - .lg\:cursor-not-allowed { - cursor: not-allowed; - } - - .lg\:block { - display: block; - } - - .lg\:inline-block { - display: inline-block; - } - - .lg\:inline { - display: inline; - } - - .lg\:table { - display: table; - } - - .lg\:table-row { - display: table-row; - } - - .lg\:table-cell { - display: table-cell; - } - - .lg\:hidden { - display: none; - } - - .lg\:flex { - display: flex; - } - - .lg\:inline-flex { - display: inline-flex; - } - - .lg\:flex-row { - flex-direction: row; - } - - .lg\:flex-row-reverse { - flex-direction: row-reverse; - } - - .lg\:flex-col { - flex-direction: column; - } - - .lg\:flex-col-reverse { - flex-direction: column-reverse; - } - - .lg\:flex-wrap { - flex-wrap: wrap; - } - - .lg\:flex-wrap-reverse { - flex-wrap: wrap-reverse; - } - - .lg\:flex-no-wrap { - flex-wrap: nowrap; - } - - .lg\:items-start { - align-items: flex-start; - } - - .lg\:items-end { - align-items: flex-end; - } - - .lg\:items-center { - align-items: center; - } - - .lg\:items-baseline { - align-items: baseline; - } - - .lg\:items-stretch { - align-items: stretch; - } - - .lg\:self-auto { - align-self: auto; - } - - .lg\:self-start { - align-self: flex-start; - } - - .lg\:self-end { - align-self: flex-end; - } - - .lg\:self-center { - align-self: center; - } - - .lg\:self-stretch { - align-self: stretch; - } - - .lg\:justify-start { - justify-content: flex-start; - } - - .lg\:justify-end { - justify-content: flex-end; - } - - .lg\:justify-center { - justify-content: center; - } - - .lg\:justify-between { - justify-content: space-between; - } - - .lg\:justify-around { - justify-content: space-around; - } - - .lg\:content-center { - align-content: center; - } - - .lg\:content-start { - align-content: flex-start; - } - - .lg\:content-end { - align-content: flex-end; - } - - .lg\:content-between { - align-content: space-between; - } - - .lg\:content-around { - align-content: space-around; - } - - .lg\:flex-1 { - flex: 1 1 0%; - } - - .lg\:flex-auto { - flex: 1 1 auto; - } - - .lg\:flex-initial { - flex: 0 1 auto; - } - - .lg\:flex-none { - flex: none; - } - - .lg\:flex-grow { - flex-grow: 1; - } - - .lg\:flex-shrink { - flex-shrink: 1; - } - - .lg\:flex-no-grow { - flex-grow: 0; - } - - .lg\:flex-no-shrink { - flex-shrink: 0; - } - - .lg\:float-right { - float: right; - } - - .lg\:float-left { - float: left; - } - - .lg\:float-none { - float: none; - } - - .lg\:clearfix:after { - content: ""; - display: table; - clear: both; - } - - .lg\:font-sans { - font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; - } - - .lg\:font-serif { - font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; - } - - .lg\:font-mono { - font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; - } - - .lg\:font-hairline { - font-weight: 100; - } - - .lg\:font-thin { - font-weight: 200; - } - - .lg\:font-light { - font-weight: 300; - } - - .lg\:font-normal { - font-weight: 400; - } - - .lg\:font-medium { - font-weight: 500; - } - - .lg\:font-semibold { - font-weight: 600; - } - - .lg\:font-bold { - font-weight: 700; - } - - .lg\:font-extrabold { - font-weight: 800; - } - - .lg\:font-black { - font-weight: 900; - } - - .lg\:hover\:font-hairline:hover { - font-weight: 100; - } - - .lg\:hover\:font-thin:hover { - font-weight: 200; - } - - .lg\:hover\:font-light:hover { - font-weight: 300; - } - - .lg\:hover\:font-normal:hover { - font-weight: 400; - } - - .lg\:hover\:font-medium:hover { - font-weight: 500; - } - - .lg\:hover\:font-semibold:hover { - font-weight: 600; - } - - .lg\:hover\:font-bold:hover { - font-weight: 700; - } - - .lg\:hover\:font-extrabold:hover { - font-weight: 800; - } - - .lg\:hover\:font-black:hover { - font-weight: 900; - } - - .lg\:focus\:font-hairline:focus { - font-weight: 100; - } - - .lg\:focus\:font-thin:focus { - font-weight: 200; - } - - .lg\:focus\:font-light:focus { - font-weight: 300; - } - - .lg\:focus\:font-normal:focus { - font-weight: 400; - } - - .lg\:focus\:font-medium:focus { - font-weight: 500; - } - - .lg\:focus\:font-semibold:focus { - font-weight: 600; - } - - .lg\:focus\:font-bold:focus { - font-weight: 700; - } - - .lg\:focus\:font-extrabold:focus { - font-weight: 800; - } - - .lg\:focus\:font-black:focus { - font-weight: 900; - } - - .lg\:h-1 { - height: .25rem; - } - - .lg\:h-2 { - height: .5rem; - } - - .lg\:h-3 { - height: .75rem; - } - - .lg\:h-4 { - height: 1rem; - } - - .lg\:h-5 { - height: 1.25rem; - } - - .lg\:h-6 { - height: 1.5rem; - } - - .lg\:h-8 { - height: 2rem; - } - - .lg\:h-10 { - height: 2.5rem; - } - - .lg\:h-12 { - height: 3rem; - } - - .lg\:h-16 { - height: 4rem; - } - - .lg\:h-24 { - height: 6rem; - } - - .lg\:h-32 { - height: 8rem; - } - - .lg\:h-48 { - height: 12rem; - } - - .lg\:h-64 { - height: 16rem; - } - - .lg\:h-auto { - height: auto; - } - - .lg\:h-px { - height: 1px; - } - - .lg\:h-full { - height: 100%; - } - - .lg\:h-screen { - height: 100vh; - } - - .lg\:leading-none { - line-height: 1; - } - - .lg\:leading-tight { - line-height: 1.25; - } - - .lg\:leading-normal { - line-height: 1.5; - } - - .lg\:leading-loose { - line-height: 2; - } - - .lg\:m-0 { - margin: 0; - } - - .lg\:m-1 { - margin: .25rem; - } - - .lg\:m-2 { - margin: .5rem; - } - - .lg\:m-3 { - margin: .75rem; - } - - .lg\:m-4 { - margin: 1rem; - } - - .lg\:m-5 { - margin: 1.25rem; - } - - .lg\:m-6 { - margin: 1.5rem; - } - - .lg\:m-8 { - margin: 2rem; - } - - .lg\:m-10 { - margin: 2.5rem; - } - - .lg\:m-12 { - margin: 3rem; - } - - .lg\:m-16 { - margin: 4rem; - } - - .lg\:m-20 { - margin: 5rem; - } - - .lg\:m-24 { - margin: 6rem; - } - - .lg\:m-32 { - margin: 8rem; - } - - .lg\:m-auto { - margin: auto; - } - - .lg\:m-px { - margin: 1px; - } - - .lg\:my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .lg\:mx-0 { - margin-left: 0; - margin-right: 0; - } - - .lg\:my-1 { - margin-top: .25rem; - margin-bottom: .25rem; - } - - .lg\:mx-1 { - margin-left: .25rem; - margin-right: .25rem; - } - - .lg\:my-2 { - margin-top: .5rem; - margin-bottom: .5rem; - } - - .lg\:mx-2 { - margin-left: .5rem; - margin-right: .5rem; - } - - .lg\:my-3 { - margin-top: .75rem; - margin-bottom: .75rem; - } - - .lg\:mx-3 { - margin-left: .75rem; - margin-right: .75rem; - } - - .lg\:my-4 { - margin-top: 1rem; - margin-bottom: 1rem; - } - - .lg\:mx-4 { - margin-left: 1rem; - margin-right: 1rem; - } - - .lg\:my-5 { - margin-top: 1.25rem; - margin-bottom: 1.25rem; - } - - .lg\:mx-5 { - margin-left: 1.25rem; - margin-right: 1.25rem; - } - - .lg\:my-6 { - margin-top: 1.5rem; - margin-bottom: 1.5rem; - } - - .lg\:mx-6 { - margin-left: 1.5rem; - margin-right: 1.5rem; - } - - .lg\:my-8 { - margin-top: 2rem; - margin-bottom: 2rem; - } - - .lg\:mx-8 { - margin-left: 2rem; - margin-right: 2rem; - } - - .lg\:my-10 { - margin-top: 2.5rem; - margin-bottom: 2.5rem; - } - - .lg\:mx-10 { - margin-left: 2.5rem; - margin-right: 2.5rem; - } - - .lg\:my-12 { - margin-top: 3rem; - margin-bottom: 3rem; - } - - .lg\:mx-12 { - margin-left: 3rem; - margin-right: 3rem; - } - - .lg\:my-16 { - margin-top: 4rem; - margin-bottom: 4rem; - } - - .lg\:mx-16 { - margin-left: 4rem; - margin-right: 4rem; - } - - .lg\:my-20 { - margin-top: 5rem; - margin-bottom: 5rem; - } - - .lg\:mx-20 { - margin-left: 5rem; - margin-right: 5rem; - } - - .lg\:my-24 { - margin-top: 6rem; - margin-bottom: 6rem; - } - - .lg\:mx-24 { - margin-left: 6rem; - margin-right: 6rem; - } - - .lg\:my-32 { - margin-top: 8rem; - margin-bottom: 8rem; - } - - .lg\:mx-32 { - margin-left: 8rem; - margin-right: 8rem; - } - - .lg\:my-auto { - margin-top: auto; - margin-bottom: auto; - } - - .lg\:mx-auto { - margin-left: auto; - margin-right: auto; - } - - .lg\:my-px { - margin-top: 1px; - margin-bottom: 1px; - } - - .lg\:mx-px { - margin-left: 1px; - margin-right: 1px; - } - - .lg\:mt-0 { - margin-top: 0; - } - - .lg\:mr-0 { - margin-right: 0; - } - - .lg\:mb-0 { - margin-bottom: 0; - } - - .lg\:ml-0 { - margin-left: 0; - } - - .lg\:mt-1 { - margin-top: .25rem; - } - - .lg\:mr-1 { - margin-right: .25rem; - } - - .lg\:mb-1 { - margin-bottom: .25rem; - } - - .lg\:ml-1 { - margin-left: .25rem; - } - - .lg\:mt-2 { - margin-top: .5rem; - } - - .lg\:mr-2 { - margin-right: .5rem; - } - - .lg\:mb-2 { - margin-bottom: .5rem; - } - - .lg\:ml-2 { - margin-left: .5rem; - } - - .lg\:mt-3 { - margin-top: .75rem; - } - - .lg\:mr-3 { - margin-right: .75rem; - } - - .lg\:mb-3 { - margin-bottom: .75rem; - } - - .lg\:ml-3 { - margin-left: .75rem; - } - - .lg\:mt-4 { - margin-top: 1rem; - } - - .lg\:mr-4 { - margin-right: 1rem; - } - - .lg\:mb-4 { - margin-bottom: 1rem; - } - - .lg\:ml-4 { - margin-left: 1rem; - } - - .lg\:mt-5 { - margin-top: 1.25rem; - } - - .lg\:mr-5 { - margin-right: 1.25rem; - } - - .lg\:mb-5 { - margin-bottom: 1.25rem; - } - - .lg\:ml-5 { - margin-left: 1.25rem; - } - - .lg\:mt-6 { - margin-top: 1.5rem; - } - - .lg\:mr-6 { - margin-right: 1.5rem; - } - - .lg\:mb-6 { - margin-bottom: 1.5rem; - } - - .lg\:ml-6 { - margin-left: 1.5rem; - } - - .lg\:mt-8 { - margin-top: 2rem; - } - - .lg\:mr-8 { - margin-right: 2rem; - } - - .lg\:mb-8 { - margin-bottom: 2rem; - } - - .lg\:ml-8 { - margin-left: 2rem; - } - - .lg\:mt-10 { - margin-top: 2.5rem; - } - - .lg\:mr-10 { - margin-right: 2.5rem; - } - - .lg\:mb-10 { - margin-bottom: 2.5rem; - } - - .lg\:ml-10 { - margin-left: 2.5rem; - } - - .lg\:mt-12 { - margin-top: 3rem; - } - - .lg\:mr-12 { - margin-right: 3rem; - } - - .lg\:mb-12 { - margin-bottom: 3rem; - } - - .lg\:ml-12 { - margin-left: 3rem; - } - - .lg\:mt-16 { - margin-top: 4rem; - } - - .lg\:mr-16 { - margin-right: 4rem; - } - - .lg\:mb-16 { - margin-bottom: 4rem; - } - - .lg\:ml-16 { - margin-left: 4rem; - } - - .lg\:mt-20 { - margin-top: 5rem; - } - - .lg\:mr-20 { - margin-right: 5rem; - } - - .lg\:mb-20 { - margin-bottom: 5rem; - } - - .lg\:ml-20 { - margin-left: 5rem; - } - - .lg\:mt-24 { - margin-top: 6rem; - } - - .lg\:mr-24 { - margin-right: 6rem; - } - - .lg\:mb-24 { - margin-bottom: 6rem; - } - - .lg\:ml-24 { - margin-left: 6rem; - } - - .lg\:mt-32 { - margin-top: 8rem; - } - - .lg\:mr-32 { - margin-right: 8rem; - } - - .lg\:mb-32 { - margin-bottom: 8rem; - } - - .lg\:ml-32 { - margin-left: 8rem; - } - - .lg\:mt-auto { - margin-top: auto; - } - - .lg\:mr-auto { - margin-right: auto; - } - - .lg\:mb-auto { - margin-bottom: auto; - } - - .lg\:ml-auto { - margin-left: auto; - } - - .lg\:mt-px { - margin-top: 1px; - } - - .lg\:mr-px { - margin-right: 1px; - } - - .lg\:mb-px { - margin-bottom: 1px; - } - - .lg\:ml-px { - margin-left: 1px; - } - - .lg\:max-h-full { - max-height: 100%; - } - - .lg\:max-h-screen { - max-height: 100vh; - } - - .lg\:max-w-xs { - max-width: 20rem; - } - - .lg\:max-w-sm { - max-width: 30rem; - } - - .lg\:max-w-md { - max-width: 40rem; - } - - .lg\:max-w-lg { - max-width: 50rem; - } - - .lg\:max-w-xl { - max-width: 60rem; - } - - .lg\:max-w-2xl { - max-width: 70rem; - } - - .lg\:max-w-3xl { - max-width: 80rem; - } - - .lg\:max-w-4xl { - max-width: 90rem; - } - - .lg\:max-w-5xl { - max-width: 100rem; - } - - .lg\:max-w-full { - max-width: 100%; - } - - .lg\:min-h-0 { - min-height: 0; - } - - .lg\:min-h-full { - min-height: 100%; - } - - .lg\:min-h-screen { - min-height: 100vh; - } - - .lg\:min-w-0 { - min-width: 0; - } - - .lg\:min-w-full { - min-width: 100%; - } - - .lg\:-m-0 { - margin: 0; - } - - .lg\:-m-1 { - margin: -0.25rem; - } - - .lg\:-m-2 { - margin: -0.5rem; - } - - .lg\:-m-3 { - margin: -0.75rem; - } - - .lg\:-m-4 { - margin: -1rem; - } - - .lg\:-m-5 { - margin: -1.25rem; - } - - .lg\:-m-6 { - margin: -1.5rem; - } - - .lg\:-m-8 { - margin: -2rem; - } - - .lg\:-m-10 { - margin: -2.5rem; - } - - .lg\:-m-12 { - margin: -3rem; - } - - .lg\:-m-16 { - margin: -4rem; - } - - .lg\:-m-20 { - margin: -5rem; - } - - .lg\:-m-24 { - margin: -6rem; - } - - .lg\:-m-32 { - margin: -8rem; - } - - .lg\:-m-px { - margin: -1px; - } - - .lg\:-my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .lg\:-mx-0 { - margin-left: 0; - margin-right: 0; - } - - .lg\:-my-1 { - margin-top: -0.25rem; - margin-bottom: -0.25rem; - } - - .lg\:-mx-1 { - margin-left: -0.25rem; - margin-right: -0.25rem; - } - - .lg\:-my-2 { - margin-top: -0.5rem; - margin-bottom: -0.5rem; - } - - .lg\:-mx-2 { - margin-left: -0.5rem; - margin-right: -0.5rem; - } - - .lg\:-my-3 { - margin-top: -0.75rem; - margin-bottom: -0.75rem; - } - - .lg\:-mx-3 { - margin-left: -0.75rem; - margin-right: -0.75rem; - } - - .lg\:-my-4 { - margin-top: -1rem; - margin-bottom: -1rem; - } - - .lg\:-mx-4 { - margin-left: -1rem; - margin-right: -1rem; - } - - .lg\:-my-5 { - margin-top: -1.25rem; - margin-bottom: -1.25rem; - } - - .lg\:-mx-5 { - margin-left: -1.25rem; - margin-right: -1.25rem; - } - - .lg\:-my-6 { - margin-top: -1.5rem; - margin-bottom: -1.5rem; - } - - .lg\:-mx-6 { - margin-left: -1.5rem; - margin-right: -1.5rem; - } - - .lg\:-my-8 { - margin-top: -2rem; - margin-bottom: -2rem; - } - - .lg\:-mx-8 { - margin-left: -2rem; - margin-right: -2rem; - } - - .lg\:-my-10 { - margin-top: -2.5rem; - margin-bottom: -2.5rem; - } - - .lg\:-mx-10 { - margin-left: -2.5rem; - margin-right: -2.5rem; - } - - .lg\:-my-12 { - margin-top: -3rem; - margin-bottom: -3rem; - } - - .lg\:-mx-12 { - margin-left: -3rem; - margin-right: -3rem; - } - - .lg\:-my-16 { - margin-top: -4rem; - margin-bottom: -4rem; - } - - .lg\:-mx-16 { - margin-left: -4rem; - margin-right: -4rem; - } - - .lg\:-my-20 { - margin-top: -5rem; - margin-bottom: -5rem; - } - - .lg\:-mx-20 { - margin-left: -5rem; - margin-right: -5rem; - } - - .lg\:-my-24 { - margin-top: -6rem; - margin-bottom: -6rem; - } - - .lg\:-mx-24 { - margin-left: -6rem; - margin-right: -6rem; - } - - .lg\:-my-32 { - margin-top: -8rem; - margin-bottom: -8rem; - } - - .lg\:-mx-32 { - margin-left: -8rem; - margin-right: -8rem; - } - - .lg\:-my-px { - margin-top: -1px; - margin-bottom: -1px; - } - - .lg\:-mx-px { - margin-left: -1px; - margin-right: -1px; - } - - .lg\:-mt-0 { - margin-top: 0; - } - - .lg\:-mr-0 { - margin-right: 0; - } - - .lg\:-mb-0 { - margin-bottom: 0; - } - - .lg\:-ml-0 { - margin-left: 0; - } - - .lg\:-mt-1 { - margin-top: -0.25rem; - } - - .lg\:-mr-1 { - margin-right: -0.25rem; - } - - .lg\:-mb-1 { - margin-bottom: -0.25rem; - } - - .lg\:-ml-1 { - margin-left: -0.25rem; - } - - .lg\:-mt-2 { - margin-top: -0.5rem; - } - - .lg\:-mr-2 { - margin-right: -0.5rem; - } - - .lg\:-mb-2 { - margin-bottom: -0.5rem; - } - - .lg\:-ml-2 { - margin-left: -0.5rem; - } - - .lg\:-mt-3 { - margin-top: -0.75rem; - } - - .lg\:-mr-3 { - margin-right: -0.75rem; - } - - .lg\:-mb-3 { - margin-bottom: -0.75rem; - } - - .lg\:-ml-3 { - margin-left: -0.75rem; - } - - .lg\:-mt-4 { - margin-top: -1rem; - } - - .lg\:-mr-4 { - margin-right: -1rem; - } - - .lg\:-mb-4 { - margin-bottom: -1rem; - } - - .lg\:-ml-4 { - margin-left: -1rem; - } - - .lg\:-mt-5 { - margin-top: -1.25rem; - } - - .lg\:-mr-5 { - margin-right: -1.25rem; - } - - .lg\:-mb-5 { - margin-bottom: -1.25rem; - } - - .lg\:-ml-5 { - margin-left: -1.25rem; - } - - .lg\:-mt-6 { - margin-top: -1.5rem; - } - - .lg\:-mr-6 { - margin-right: -1.5rem; - } - - .lg\:-mb-6 { - margin-bottom: -1.5rem; - } - - .lg\:-ml-6 { - margin-left: -1.5rem; - } - - .lg\:-mt-8 { - margin-top: -2rem; - } - - .lg\:-mr-8 { - margin-right: -2rem; - } - - .lg\:-mb-8 { - margin-bottom: -2rem; - } - - .lg\:-ml-8 { - margin-left: -2rem; - } - - .lg\:-mt-10 { - margin-top: -2.5rem; - } - - .lg\:-mr-10 { - margin-right: -2.5rem; - } - - .lg\:-mb-10 { - margin-bottom: -2.5rem; - } - - .lg\:-ml-10 { - margin-left: -2.5rem; - } - - .lg\:-mt-12 { - margin-top: -3rem; - } - - .lg\:-mr-12 { - margin-right: -3rem; - } - - .lg\:-mb-12 { - margin-bottom: -3rem; - } - - .lg\:-ml-12 { - margin-left: -3rem; - } - - .lg\:-mt-16 { - margin-top: -4rem; - } - - .lg\:-mr-16 { - margin-right: -4rem; - } - - .lg\:-mb-16 { - margin-bottom: -4rem; - } - - .lg\:-ml-16 { - margin-left: -4rem; - } - - .lg\:-mt-20 { - margin-top: -5rem; - } - - .lg\:-mr-20 { - margin-right: -5rem; - } - - .lg\:-mb-20 { - margin-bottom: -5rem; - } - - .lg\:-ml-20 { - margin-left: -5rem; - } - - .lg\:-mt-24 { - margin-top: -6rem; - } - - .lg\:-mr-24 { - margin-right: -6rem; - } - - .lg\:-mb-24 { - margin-bottom: -6rem; - } - - .lg\:-ml-24 { - margin-left: -6rem; - } - - .lg\:-mt-32 { - margin-top: -8rem; - } - - .lg\:-mr-32 { - margin-right: -8rem; - } - - .lg\:-mb-32 { - margin-bottom: -8rem; - } - - .lg\:-ml-32 { - margin-left: -8rem; - } - - .lg\:-mt-px { - margin-top: -1px; - } - - .lg\:-mr-px { - margin-right: -1px; - } - - .lg\:-mb-px { - margin-bottom: -1px; - } - - .lg\:-ml-px { - margin-left: -1px; - } - - .lg\:opacity-0 { - opacity: 0; - } - - .lg\:opacity-25 { - opacity: .25; - } - - .lg\:opacity-50 { - opacity: .5; - } - - .lg\:opacity-75 { - opacity: .75; - } - - .lg\:opacity-100 { - opacity: 1; - } - - .lg\:overflow-auto { - overflow: auto; - } - - .lg\:overflow-hidden { - overflow: hidden; - } - - .lg\:overflow-visible { - overflow: visible; - } - - .lg\:overflow-scroll { - overflow: scroll; - } - - .lg\:overflow-x-auto { - overflow-x: auto; - } - - .lg\:overflow-y-auto { - overflow-y: auto; - } - - .lg\:overflow-x-hidden { - overflow-x: hidden; - } - - .lg\:overflow-y-hidden { - overflow-y: hidden; - } - - .lg\:overflow-x-visible { - overflow-x: visible; - } - - .lg\:overflow-y-visible { - overflow-y: visible; - } - - .lg\:overflow-x-scroll { - overflow-x: scroll; - } - - .lg\:overflow-y-scroll { - overflow-y: scroll; - } - - .lg\:scrolling-touch { - -webkit-overflow-scrolling: touch; - } - - .lg\:scrolling-auto { - -webkit-overflow-scrolling: auto; - } - - .lg\:p-0 { - padding: 0; - } - - .lg\:p-1 { - padding: .25rem; - } - - .lg\:p-2 { - padding: .5rem; - } - - .lg\:p-3 { - padding: .75rem; - } - - .lg\:p-4 { - padding: 1rem; - } - - .lg\:p-5 { - padding: 1.25rem; - } - - .lg\:p-6 { - padding: 1.5rem; - } - - .lg\:p-8 { - padding: 2rem; - } - - .lg\:p-10 { - padding: 2.5rem; - } - - .lg\:p-12 { - padding: 3rem; - } - - .lg\:p-16 { - padding: 4rem; - } - - .lg\:p-20 { - padding: 5rem; - } - - .lg\:p-24 { - padding: 6rem; - } - - .lg\:p-32 { - padding: 8rem; - } - - .lg\:p-px { - padding: 1px; - } - - .lg\:py-0 { - padding-top: 0; - padding-bottom: 0; - } - - .lg\:px-0 { - padding-left: 0; - padding-right: 0; - } - - .lg\:py-1 { - padding-top: .25rem; - padding-bottom: .25rem; - } - - .lg\:px-1 { - padding-left: .25rem; - padding-right: .25rem; - } - - .lg\:py-2 { - padding-top: .5rem; - padding-bottom: .5rem; - } - - .lg\:px-2 { - padding-left: .5rem; - padding-right: .5rem; - } - - .lg\:py-3 { - padding-top: .75rem; - padding-bottom: .75rem; - } - - .lg\:px-3 { - padding-left: .75rem; - padding-right: .75rem; - } - - .lg\:py-4 { - padding-top: 1rem; - padding-bottom: 1rem; - } - - .lg\:px-4 { - padding-left: 1rem; - padding-right: 1rem; - } - - .lg\:py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; - } - - .lg\:px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; - } - - .lg\:py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; - } - - .lg\:px-6 { - padding-left: 1.5rem; - padding-right: 1.5rem; - } - - .lg\:py-8 { - padding-top: 2rem; - padding-bottom: 2rem; - } - - .lg\:px-8 { - padding-left: 2rem; - padding-right: 2rem; - } - - .lg\:py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; - } - - .lg\:px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; - } - - .lg\:py-12 { - padding-top: 3rem; - padding-bottom: 3rem; - } - - .lg\:px-12 { - padding-left: 3rem; - padding-right: 3rem; - } - - .lg\:py-16 { - padding-top: 4rem; - padding-bottom: 4rem; - } - - .lg\:px-16 { - padding-left: 4rem; - padding-right: 4rem; - } - - .lg\:py-20 { - padding-top: 5rem; - padding-bottom: 5rem; - } - - .lg\:px-20 { - padding-left: 5rem; - padding-right: 5rem; - } - - .lg\:py-24 { - padding-top: 6rem; - padding-bottom: 6rem; - } - - .lg\:px-24 { - padding-left: 6rem; - padding-right: 6rem; - } - - .lg\:py-32 { - padding-top: 8rem; - padding-bottom: 8rem; - } - - .lg\:px-32 { - padding-left: 8rem; - padding-right: 8rem; - } - - .lg\:py-px { - padding-top: 1px; - padding-bottom: 1px; - } - - .lg\:px-px { - padding-left: 1px; - padding-right: 1px; - } - - .lg\:pt-0 { - padding-top: 0; - } - - .lg\:pr-0 { - padding-right: 0; - } - - .lg\:pb-0 { - padding-bottom: 0; - } - - .lg\:pl-0 { - padding-left: 0; - } - - .lg\:pt-1 { - padding-top: .25rem; - } - - .lg\:pr-1 { - padding-right: .25rem; - } - - .lg\:pb-1 { - padding-bottom: .25rem; - } - - .lg\:pl-1 { - padding-left: .25rem; - } - - .lg\:pt-2 { - padding-top: .5rem; - } - - .lg\:pr-2 { - padding-right: .5rem; - } - - .lg\:pb-2 { - padding-bottom: .5rem; - } - - .lg\:pl-2 { - padding-left: .5rem; - } - - .lg\:pt-3 { - padding-top: .75rem; - } - - .lg\:pr-3 { - padding-right: .75rem; - } - - .lg\:pb-3 { - padding-bottom: .75rem; - } - - .lg\:pl-3 { - padding-left: .75rem; - } - - .lg\:pt-4 { - padding-top: 1rem; - } - - .lg\:pr-4 { - padding-right: 1rem; - } - - .lg\:pb-4 { - padding-bottom: 1rem; - } - - .lg\:pl-4 { - padding-left: 1rem; - } - - .lg\:pt-5 { - padding-top: 1.25rem; - } - - .lg\:pr-5 { - padding-right: 1.25rem; - } - - .lg\:pb-5 { - padding-bottom: 1.25rem; - } - - .lg\:pl-5 { - padding-left: 1.25rem; - } - - .lg\:pt-6 { - padding-top: 1.5rem; - } - - .lg\:pr-6 { - padding-right: 1.5rem; - } - - .lg\:pb-6 { - padding-bottom: 1.5rem; - } - - .lg\:pl-6 { - padding-left: 1.5rem; - } - - .lg\:pt-8 { - padding-top: 2rem; - } - - .lg\:pr-8 { - padding-right: 2rem; - } - - .lg\:pb-8 { - padding-bottom: 2rem; - } - - .lg\:pl-8 { - padding-left: 2rem; - } - - .lg\:pt-10 { - padding-top: 2.5rem; - } - - .lg\:pr-10 { - padding-right: 2.5rem; - } - - .lg\:pb-10 { - padding-bottom: 2.5rem; - } - - .lg\:pl-10 { - padding-left: 2.5rem; - } - - .lg\:pt-12 { - padding-top: 3rem; - } - - .lg\:pr-12 { - padding-right: 3rem; - } - - .lg\:pb-12 { - padding-bottom: 3rem; - } - - .lg\:pl-12 { - padding-left: 3rem; - } - - .lg\:pt-16 { - padding-top: 4rem; - } - - .lg\:pr-16 { - padding-right: 4rem; - } - - .lg\:pb-16 { - padding-bottom: 4rem; - } - - .lg\:pl-16 { - padding-left: 4rem; - } - - .lg\:pt-20 { - padding-top: 5rem; - } - - .lg\:pr-20 { - padding-right: 5rem; - } - - .lg\:pb-20 { - padding-bottom: 5rem; - } - - .lg\:pl-20 { - padding-left: 5rem; - } - - .lg\:pt-24 { - padding-top: 6rem; - } - - .lg\:pr-24 { - padding-right: 6rem; - } - - .lg\:pb-24 { - padding-bottom: 6rem; - } - - .lg\:pl-24 { - padding-left: 6rem; - } - - .lg\:pt-32 { - padding-top: 8rem; - } - - .lg\:pr-32 { - padding-right: 8rem; - } - - .lg\:pb-32 { - padding-bottom: 8rem; - } - - .lg\:pl-32 { - padding-left: 8rem; - } - - .lg\:pt-px { - padding-top: 1px; - } - - .lg\:pr-px { - padding-right: 1px; - } - - .lg\:pb-px { - padding-bottom: 1px; - } - - .lg\:pl-px { - padding-left: 1px; - } - - .lg\:pointer-events-none { - pointer-events: none; - } - - .lg\:pointer-events-auto { - pointer-events: auto; - } - - .lg\:static { - position: static; - } - - .lg\:fixed { - position: fixed; - } - - .lg\:absolute { - position: absolute; - } - - .lg\:relative { - position: relative; - } - - .lg\:sticky { - position: -webkit-sticky; - position: sticky; - } - - .lg\:pin-none { - top: auto; - right: auto; - bottom: auto; - left: auto; - } - - .lg\:pin { - top: 0; - right: 0; - bottom: 0; - left: 0; - } - - .lg\:pin-y { - top: 0; - bottom: 0; - } - - .lg\:pin-x { - right: 0; - left: 0; - } - - .lg\:pin-t { - top: 0; - } - - .lg\:pin-r { - right: 0; - } - - .lg\:pin-b { - bottom: 0; - } - - .lg\:pin-l { - left: 0; - } - - .lg\:resize-none { - resize: none; - } - - .lg\:resize-y { - resize: vertical; - } - - .lg\:resize-x { - resize: horizontal; - } - - .lg\:resize { - resize: both; - } - - .lg\:shadow { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .lg\:shadow-md { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .lg\:shadow-lg { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .lg\:shadow-inner { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .lg\:shadow-outline { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .lg\:shadow-none { - box-shadow: none; - } - - .lg\:hover\:shadow:hover { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .lg\:hover\:shadow-md:hover { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .lg\:hover\:shadow-lg:hover { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .lg\:hover\:shadow-inner:hover { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .lg\:hover\:shadow-outline:hover { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .lg\:hover\:shadow-none:hover { - box-shadow: none; - } - - .lg\:focus\:shadow:focus { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .lg\:focus\:shadow-md:focus { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .lg\:focus\:shadow-lg:focus { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .lg\:focus\:shadow-inner:focus { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .lg\:focus\:shadow-outline:focus { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .lg\:focus\:shadow-none:focus { - box-shadow: none; - } - - .lg\:table-auto { - table-layout: auto; - } - - .lg\:table-fixed { - table-layout: fixed; - } - - .lg\:text-left { - text-align: left; - } - - .lg\:text-center { - text-align: center; - } - - .lg\:text-right { - text-align: right; - } - - .lg\:text-justify { - text-align: justify; - } - - .lg\:text-transparent { - color: transparent; - } - - .lg\:text-black { - color: #22292f; - } - - .lg\:text-grey-darkest { - color: #3d4852; - } - - .lg\:text-grey-darker { - color: #606f7b; - } - - .lg\:text-grey-dark { - color: #8795a1; - } - - .lg\:text-grey { - color: #b8c2cc; - } - - .lg\:text-grey-light { - color: #dae1e7; - } - - .lg\:text-grey-lighter { - color: #f1f5f8; - } - - .lg\:text-grey-lightest { - color: #f8fafc; - } - - .lg\:text-white { - color: #fff; - } - - .lg\:text-red-darkest { - color: #3b0d0c; - } - - .lg\:text-red-darker { - color: #621b18; - } - - .lg\:text-red-dark { - color: #cc1f1a; - } - - .lg\:text-red { - color: #e3342f; - } - - .lg\:text-red-light { - color: #ef5753; - } - - .lg\:text-red-lighter { - color: #f9acaa; - } - - .lg\:text-red-lightest { - color: #fcebea; - } - - .lg\:text-orange-darkest { - color: #462a16; - } - - .lg\:text-orange-darker { - color: #613b1f; - } - - .lg\:text-orange-dark { - color: #de751f; - } - - .lg\:text-orange { - color: #f6993f; - } - - .lg\:text-orange-light { - color: #faad63; - } - - .lg\:text-orange-lighter { - color: #fcd9b6; - } - - .lg\:text-orange-lightest { - color: #fff5eb; - } - - .lg\:text-yellow-darkest { - color: #453411; - } - - .lg\:text-yellow-darker { - color: #684f1d; - } - - .lg\:text-yellow-dark { - color: #f2d024; - } - - .lg\:text-yellow { - color: #ffed4a; - } - - .lg\:text-yellow-light { - color: #fff382; - } - - .lg\:text-yellow-lighter { - color: #fff9c2; - } - - .lg\:text-yellow-lightest { - color: #fcfbeb; - } - - .lg\:text-green-darkest { - color: #0f2f21; - } - - .lg\:text-green-darker { - color: #1a4731; - } - - .lg\:text-green-dark { - color: #1f9d55; - } - - .lg\:text-green { - color: #38c172; - } - - .lg\:text-green-light { - color: #51d88a; - } - - .lg\:text-green-lighter { - color: #a2f5bf; - } - - .lg\:text-green-lightest { - color: #e3fcec; - } - - .lg\:text-teal-darkest { - color: #0d3331; - } - - .lg\:text-teal-darker { - color: #20504f; - } - - .lg\:text-teal-dark { - color: #38a89d; - } - - .lg\:text-teal { - color: #4dc0b5; - } - - .lg\:text-teal-light { - color: #64d5ca; - } - - .lg\:text-teal-lighter { - color: #a0f0ed; - } - - .lg\:text-teal-lightest { - color: #e8fffe; - } - - .lg\:text-blue-darkest { - color: #12283a; - } - - .lg\:text-blue-darker { - color: #1c3d5a; - } - - .lg\:text-blue-dark { - color: #2779bd; - } - - .lg\:text-blue { - color: #3490dc; - } - - .lg\:text-blue-light { - color: #6cb2eb; - } - - .lg\:text-blue-lighter { - color: #bcdefa; - } - - .lg\:text-blue-lightest { - color: #eff8ff; - } - - .lg\:text-indigo-darkest { - color: #191e38; - } - - .lg\:text-indigo-darker { - color: #2f365f; - } - - .lg\:text-indigo-dark { - color: #5661b3; - } - - .lg\:text-indigo { - color: #6574cd; - } - - .lg\:text-indigo-light { - color: #7886d7; - } - - .lg\:text-indigo-lighter { - color: #b2b7ff; - } - - .lg\:text-indigo-lightest { - color: #e6e8ff; - } - - .lg\:text-purple-darkest { - color: #21183c; - } - - .lg\:text-purple-darker { - color: #382b5f; - } - - .lg\:text-purple-dark { - color: #794acf; - } - - .lg\:text-purple { - color: #9561e2; - } - - .lg\:text-purple-light { - color: #a779e9; - } - - .lg\:text-purple-lighter { - color: #d6bbfc; - } - - .lg\:text-purple-lightest { - color: #f3ebff; - } - - .lg\:text-pink-darkest { - color: #451225; - } - - .lg\:text-pink-darker { - color: #6f213f; - } - - .lg\:text-pink-dark { - color: #eb5286; - } - - .lg\:text-pink { - color: #f66d9b; - } - - .lg\:text-pink-light { - color: #fa7ea8; - } - - .lg\:text-pink-lighter { - color: #ffbbca; - } - - .lg\:text-pink-lightest { - color: #ffebef; - } - - .lg\:hover\:text-transparent:hover { - color: transparent; - } - - .lg\:hover\:text-black:hover { - color: #22292f; - } - - .lg\:hover\:text-grey-darkest:hover { - color: #3d4852; - } - - .lg\:hover\:text-grey-darker:hover { - color: #606f7b; - } - - .lg\:hover\:text-grey-dark:hover { - color: #8795a1; - } - - .lg\:hover\:text-grey:hover { - color: #b8c2cc; - } - - .lg\:hover\:text-grey-light:hover { - color: #dae1e7; - } - - .lg\:hover\:text-grey-lighter:hover { - color: #f1f5f8; - } - - .lg\:hover\:text-grey-lightest:hover { - color: #f8fafc; - } - - .lg\:hover\:text-white:hover { - color: #fff; - } - - .lg\:hover\:text-red-darkest:hover { - color: #3b0d0c; - } - - .lg\:hover\:text-red-darker:hover { - color: #621b18; - } - - .lg\:hover\:text-red-dark:hover { - color: #cc1f1a; - } - - .lg\:hover\:text-red:hover { - color: #e3342f; - } - - .lg\:hover\:text-red-light:hover { - color: #ef5753; - } - - .lg\:hover\:text-red-lighter:hover { - color: #f9acaa; - } - - .lg\:hover\:text-red-lightest:hover { - color: #fcebea; - } - - .lg\:hover\:text-orange-darkest:hover { - color: #462a16; - } - - .lg\:hover\:text-orange-darker:hover { - color: #613b1f; - } - - .lg\:hover\:text-orange-dark:hover { - color: #de751f; - } - - .lg\:hover\:text-orange:hover { - color: #f6993f; - } - - .lg\:hover\:text-orange-light:hover { - color: #faad63; - } - - .lg\:hover\:text-orange-lighter:hover { - color: #fcd9b6; - } - - .lg\:hover\:text-orange-lightest:hover { - color: #fff5eb; - } - - .lg\:hover\:text-yellow-darkest:hover { - color: #453411; - } - - .lg\:hover\:text-yellow-darker:hover { - color: #684f1d; - } - - .lg\:hover\:text-yellow-dark:hover { - color: #f2d024; - } - - .lg\:hover\:text-yellow:hover { - color: #ffed4a; - } - - .lg\:hover\:text-yellow-light:hover { - color: #fff382; - } - - .lg\:hover\:text-yellow-lighter:hover { - color: #fff9c2; - } - - .lg\:hover\:text-yellow-lightest:hover { - color: #fcfbeb; - } - - .lg\:hover\:text-green-darkest:hover { - color: #0f2f21; - } - - .lg\:hover\:text-green-darker:hover { - color: #1a4731; - } - - .lg\:hover\:text-green-dark:hover { - color: #1f9d55; - } - - .lg\:hover\:text-green:hover { - color: #38c172; - } - - .lg\:hover\:text-green-light:hover { - color: #51d88a; - } - - .lg\:hover\:text-green-lighter:hover { - color: #a2f5bf; - } - - .lg\:hover\:text-green-lightest:hover { - color: #e3fcec; - } - - .lg\:hover\:text-teal-darkest:hover { - color: #0d3331; - } - - .lg\:hover\:text-teal-darker:hover { - color: #20504f; - } - - .lg\:hover\:text-teal-dark:hover { - color: #38a89d; - } - - .lg\:hover\:text-teal:hover { - color: #4dc0b5; - } - - .lg\:hover\:text-teal-light:hover { - color: #64d5ca; - } - - .lg\:hover\:text-teal-lighter:hover { - color: #a0f0ed; - } - - .lg\:hover\:text-teal-lightest:hover { - color: #e8fffe; - } - - .lg\:hover\:text-blue-darkest:hover { - color: #12283a; - } - - .lg\:hover\:text-blue-darker:hover { - color: #1c3d5a; - } - - .lg\:hover\:text-blue-dark:hover { - color: #2779bd; - } - - .lg\:hover\:text-blue:hover { - color: #3490dc; - } - - .lg\:hover\:text-blue-light:hover { - color: #6cb2eb; - } - - .lg\:hover\:text-blue-lighter:hover { - color: #bcdefa; - } - - .lg\:hover\:text-blue-lightest:hover { - color: #eff8ff; - } - - .lg\:hover\:text-indigo-darkest:hover { - color: #191e38; - } - - .lg\:hover\:text-indigo-darker:hover { - color: #2f365f; - } - - .lg\:hover\:text-indigo-dark:hover { - color: #5661b3; - } - - .lg\:hover\:text-indigo:hover { - color: #6574cd; - } - - .lg\:hover\:text-indigo-light:hover { - color: #7886d7; - } - - .lg\:hover\:text-indigo-lighter:hover { - color: #b2b7ff; - } - - .lg\:hover\:text-indigo-lightest:hover { - color: #e6e8ff; - } - - .lg\:hover\:text-purple-darkest:hover { - color: #21183c; - } - - .lg\:hover\:text-purple-darker:hover { - color: #382b5f; - } - - .lg\:hover\:text-purple-dark:hover { - color: #794acf; - } - - .lg\:hover\:text-purple:hover { - color: #9561e2; - } - - .lg\:hover\:text-purple-light:hover { - color: #a779e9; - } - - .lg\:hover\:text-purple-lighter:hover { - color: #d6bbfc; - } - - .lg\:hover\:text-purple-lightest:hover { - color: #f3ebff; - } - - .lg\:hover\:text-pink-darkest:hover { - color: #451225; - } - - .lg\:hover\:text-pink-darker:hover { - color: #6f213f; - } - - .lg\:hover\:text-pink-dark:hover { - color: #eb5286; - } - - .lg\:hover\:text-pink:hover { - color: #f66d9b; - } - - .lg\:hover\:text-pink-light:hover { - color: #fa7ea8; - } - - .lg\:hover\:text-pink-lighter:hover { - color: #ffbbca; - } - - .lg\:hover\:text-pink-lightest:hover { - color: #ffebef; - } - - .lg\:focus\:text-transparent:focus { - color: transparent; - } - - .lg\:focus\:text-black:focus { - color: #22292f; - } - - .lg\:focus\:text-grey-darkest:focus { - color: #3d4852; - } - - .lg\:focus\:text-grey-darker:focus { - color: #606f7b; - } - - .lg\:focus\:text-grey-dark:focus { - color: #8795a1; - } - - .lg\:focus\:text-grey:focus { - color: #b8c2cc; - } - - .lg\:focus\:text-grey-light:focus { - color: #dae1e7; - } - - .lg\:focus\:text-grey-lighter:focus { - color: #f1f5f8; - } - - .lg\:focus\:text-grey-lightest:focus { - color: #f8fafc; - } - - .lg\:focus\:text-white:focus { - color: #fff; - } - - .lg\:focus\:text-red-darkest:focus { - color: #3b0d0c; - } - - .lg\:focus\:text-red-darker:focus { - color: #621b18; - } - - .lg\:focus\:text-red-dark:focus { - color: #cc1f1a; - } - - .lg\:focus\:text-red:focus { - color: #e3342f; - } - - .lg\:focus\:text-red-light:focus { - color: #ef5753; - } - - .lg\:focus\:text-red-lighter:focus { - color: #f9acaa; - } - - .lg\:focus\:text-red-lightest:focus { - color: #fcebea; - } - - .lg\:focus\:text-orange-darkest:focus { - color: #462a16; - } - - .lg\:focus\:text-orange-darker:focus { - color: #613b1f; - } - - .lg\:focus\:text-orange-dark:focus { - color: #de751f; - } - - .lg\:focus\:text-orange:focus { - color: #f6993f; - } - - .lg\:focus\:text-orange-light:focus { - color: #faad63; - } - - .lg\:focus\:text-orange-lighter:focus { - color: #fcd9b6; - } - - .lg\:focus\:text-orange-lightest:focus { - color: #fff5eb; - } - - .lg\:focus\:text-yellow-darkest:focus { - color: #453411; - } - - .lg\:focus\:text-yellow-darker:focus { - color: #684f1d; - } - - .lg\:focus\:text-yellow-dark:focus { - color: #f2d024; - } - - .lg\:focus\:text-yellow:focus { - color: #ffed4a; - } - - .lg\:focus\:text-yellow-light:focus { - color: #fff382; - } - - .lg\:focus\:text-yellow-lighter:focus { - color: #fff9c2; - } - - .lg\:focus\:text-yellow-lightest:focus { - color: #fcfbeb; - } - - .lg\:focus\:text-green-darkest:focus { - color: #0f2f21; - } - - .lg\:focus\:text-green-darker:focus { - color: #1a4731; - } - - .lg\:focus\:text-green-dark:focus { - color: #1f9d55; - } - - .lg\:focus\:text-green:focus { - color: #38c172; - } - - .lg\:focus\:text-green-light:focus { - color: #51d88a; - } - - .lg\:focus\:text-green-lighter:focus { - color: #a2f5bf; - } - - .lg\:focus\:text-green-lightest:focus { - color: #e3fcec; - } - - .lg\:focus\:text-teal-darkest:focus { - color: #0d3331; - } - - .lg\:focus\:text-teal-darker:focus { - color: #20504f; - } - - .lg\:focus\:text-teal-dark:focus { - color: #38a89d; - } - - .lg\:focus\:text-teal:focus { - color: #4dc0b5; - } - - .lg\:focus\:text-teal-light:focus { - color: #64d5ca; - } - - .lg\:focus\:text-teal-lighter:focus { - color: #a0f0ed; - } - - .lg\:focus\:text-teal-lightest:focus { - color: #e8fffe; - } - - .lg\:focus\:text-blue-darkest:focus { - color: #12283a; - } - - .lg\:focus\:text-blue-darker:focus { - color: #1c3d5a; - } - - .lg\:focus\:text-blue-dark:focus { - color: #2779bd; - } - - .lg\:focus\:text-blue:focus { - color: #3490dc; - } - - .lg\:focus\:text-blue-light:focus { - color: #6cb2eb; - } - - .lg\:focus\:text-blue-lighter:focus { - color: #bcdefa; - } - - .lg\:focus\:text-blue-lightest:focus { - color: #eff8ff; - } - - .lg\:focus\:text-indigo-darkest:focus { - color: #191e38; - } - - .lg\:focus\:text-indigo-darker:focus { - color: #2f365f; - } - - .lg\:focus\:text-indigo-dark:focus { - color: #5661b3; - } - - .lg\:focus\:text-indigo:focus { - color: #6574cd; - } - - .lg\:focus\:text-indigo-light:focus { - color: #7886d7; - } - - .lg\:focus\:text-indigo-lighter:focus { - color: #b2b7ff; - } - - .lg\:focus\:text-indigo-lightest:focus { - color: #e6e8ff; - } - - .lg\:focus\:text-purple-darkest:focus { - color: #21183c; - } - - .lg\:focus\:text-purple-darker:focus { - color: #382b5f; - } - - .lg\:focus\:text-purple-dark:focus { - color: #794acf; - } - - .lg\:focus\:text-purple:focus { - color: #9561e2; - } - - .lg\:focus\:text-purple-light:focus { - color: #a779e9; - } - - .lg\:focus\:text-purple-lighter:focus { - color: #d6bbfc; - } - - .lg\:focus\:text-purple-lightest:focus { - color: #f3ebff; - } - - .lg\:focus\:text-pink-darkest:focus { - color: #451225; - } - - .lg\:focus\:text-pink-darker:focus { - color: #6f213f; - } - - .lg\:focus\:text-pink-dark:focus { - color: #eb5286; - } - - .lg\:focus\:text-pink:focus { - color: #f66d9b; - } - - .lg\:focus\:text-pink-light:focus { - color: #fa7ea8; - } - - .lg\:focus\:text-pink-lighter:focus { - color: #ffbbca; - } - - .lg\:focus\:text-pink-lightest:focus { - color: #ffebef; - } - - .lg\:text-xs { - font-size: .75rem; - } - - .lg\:text-sm { - font-size: .875rem; - } - - .lg\:text-base { - font-size: 1rem; - } - - .lg\:text-lg { - font-size: 1.125rem; - } - - .lg\:text-xl { - font-size: 1.25rem; - } - - .lg\:text-2xl { - font-size: 1.5rem; - } - - .lg\:text-3xl { - font-size: 1.875rem; - } - - .lg\:text-4xl { - font-size: 2.25rem; - } - - .lg\:text-5xl { - font-size: 3rem; - } - - .lg\:italic { - font-style: italic; - } - - .lg\:roman { - font-style: normal; - } - - .lg\:uppercase { - text-transform: uppercase; - } - - .lg\:lowercase { - text-transform: lowercase; - } - - .lg\:capitalize { - text-transform: capitalize; - } - - .lg\:normal-case { - text-transform: none; - } - - .lg\:underline { - text-decoration: underline; - } - - .lg\:line-through { - text-decoration: line-through; - } - - .lg\:no-underline { - text-decoration: none; - } - - .lg\:antialiased { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .lg\:subpixel-antialiased { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .lg\:hover\:italic:hover { - font-style: italic; - } - - .lg\:hover\:roman:hover { - font-style: normal; - } - - .lg\:hover\:uppercase:hover { - text-transform: uppercase; - } - - .lg\:hover\:lowercase:hover { - text-transform: lowercase; - } - - .lg\:hover\:capitalize:hover { - text-transform: capitalize; - } - - .lg\:hover\:normal-case:hover { - text-transform: none; - } - - .lg\:hover\:underline:hover { - text-decoration: underline; - } - - .lg\:hover\:line-through:hover { - text-decoration: line-through; - } - - .lg\:hover\:no-underline:hover { - text-decoration: none; - } - - .lg\:hover\:antialiased:hover { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .lg\:hover\:subpixel-antialiased:hover { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .lg\:focus\:italic:focus { - font-style: italic; - } - - .lg\:focus\:roman:focus { - font-style: normal; - } - - .lg\:focus\:uppercase:focus { - text-transform: uppercase; - } - - .lg\:focus\:lowercase:focus { - text-transform: lowercase; - } - - .lg\:focus\:capitalize:focus { - text-transform: capitalize; - } - - .lg\:focus\:normal-case:focus { - text-transform: none; - } - - .lg\:focus\:underline:focus { - text-decoration: underline; - } - - .lg\:focus\:line-through:focus { - text-decoration: line-through; - } - - .lg\:focus\:no-underline:focus { - text-decoration: none; - } - - .lg\:focus\:antialiased:focus { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .lg\:focus\:subpixel-antialiased:focus { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .lg\:tracking-tight { - letter-spacing: -0.05em; - } - - .lg\:tracking-normal { - letter-spacing: 0; - } - - .lg\:tracking-wide { - letter-spacing: .05em; - } - - .lg\:select-none { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } - - .lg\:select-text { - -webkit-user-select: text; - -moz-user-select: text; - -ms-user-select: text; - user-select: text; - } - - .lg\:align-baseline { - vertical-align: baseline; - } - - .lg\:align-top { - vertical-align: top; - } - - .lg\:align-middle { - vertical-align: middle; - } - - .lg\:align-bottom { - vertical-align: bottom; - } - - .lg\:align-text-top { - vertical-align: text-top; - } - - .lg\:align-text-bottom { - vertical-align: text-bottom; - } - - .lg\:visible { - visibility: visible; - } - - .lg\:invisible { - visibility: hidden; - } - - .lg\:whitespace-normal { - white-space: normal; - } - - .lg\:whitespace-no-wrap { - white-space: nowrap; - } - - .lg\:whitespace-pre { - white-space: pre; - } - - .lg\:whitespace-pre-line { - white-space: pre-line; - } - - .lg\:whitespace-pre-wrap { - white-space: pre-wrap; - } - - .lg\:break-words { - word-wrap: break-word; - } - - .lg\:break-normal { - word-wrap: normal; - } - - .lg\:truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - .lg\:w-1 { - width: .25rem; - } - - .lg\:w-2 { - width: .5rem; - } - - .lg\:w-3 { - width: .75rem; - } - - .lg\:w-4 { - width: 1rem; - } - - .lg\:w-5 { - width: 1.25rem; - } - - .lg\:w-6 { - width: 1.5rem; - } - - .lg\:w-8 { - width: 2rem; - } - - .lg\:w-10 { - width: 2.5rem; - } - - .lg\:w-12 { - width: 3rem; - } - - .lg\:w-16 { - width: 4rem; - } - - .lg\:w-24 { - width: 6rem; - } - - .lg\:w-32 { - width: 8rem; - } - - .lg\:w-48 { - width: 12rem; - } - - .lg\:w-64 { - width: 16rem; - } - - .lg\:w-auto { - width: auto; - } - - .lg\:w-px { - width: 1px; - } - - .lg\:w-1\/2 { - width: 50%; - } - - .lg\:w-1\/3 { - width: 33.33333%; - } - - .lg\:w-2\/3 { - width: 66.66667%; - } - - .lg\:w-1\/4 { - width: 25%; - } - - .lg\:w-3\/4 { - width: 75%; - } - - .lg\:w-1\/5 { - width: 20%; - } - - .lg\:w-2\/5 { - width: 40%; - } - - .lg\:w-3\/5 { - width: 60%; - } - - .lg\:w-4\/5 { - width: 80%; - } - - .lg\:w-1\/6 { - width: 16.66667%; - } - - .lg\:w-5\/6 { - width: 83.33333%; - } - - .lg\:w-full { - width: 100%; - } - - .lg\:w-screen { - width: 100vw; - } - - .lg\:z-0 { - z-index: 0; - } - - .lg\:z-10 { - z-index: 10; - } - - .lg\:z-20 { - z-index: 20; - } - - .lg\:z-30 { - z-index: 30; - } - - .lg\:z-40 { - z-index: 40; - } - - .lg\:z-50 { - z-index: 50; - } - - .lg\:z-auto { - z-index: auto; - } -} - -@media (min-width: 1200px) { - .xl\:list-reset { - list-style: none; - padding: 0; - } - - .xl\:appearance-none { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - } - - .xl\:bg-fixed { - background-attachment: fixed; - } - - .xl\:bg-local { - background-attachment: local; - } - - .xl\:bg-scroll { - background-attachment: scroll; - } - - .xl\:bg-transparent { - background-color: transparent; - } - - .xl\:bg-black { - background-color: #22292f; - } - - .xl\:bg-grey-darkest { - background-color: #3d4852; - } - - .xl\:bg-grey-darker { - background-color: #606f7b; - } - - .xl\:bg-grey-dark { - background-color: #8795a1; - } - - .xl\:bg-grey { - background-color: #b8c2cc; - } - - .xl\:bg-grey-light { - background-color: #dae1e7; - } - - .xl\:bg-grey-lighter { - background-color: #f1f5f8; - } - - .xl\:bg-grey-lightest { - background-color: #f8fafc; - } - - .xl\:bg-white { - background-color: #fff; - } - - .xl\:bg-red-darkest { - background-color: #3b0d0c; - } - - .xl\:bg-red-darker { - background-color: #621b18; - } - - .xl\:bg-red-dark { - background-color: #cc1f1a; - } - - .xl\:bg-red { - background-color: #e3342f; - } - - .xl\:bg-red-light { - background-color: #ef5753; - } - - .xl\:bg-red-lighter { - background-color: #f9acaa; - } - - .xl\:bg-red-lightest { - background-color: #fcebea; - } - - .xl\:bg-orange-darkest { - background-color: #462a16; - } - - .xl\:bg-orange-darker { - background-color: #613b1f; - } - - .xl\:bg-orange-dark { - background-color: #de751f; - } - - .xl\:bg-orange { - background-color: #f6993f; - } - - .xl\:bg-orange-light { - background-color: #faad63; - } - - .xl\:bg-orange-lighter { - background-color: #fcd9b6; - } - - .xl\:bg-orange-lightest { - background-color: #fff5eb; - } - - .xl\:bg-yellow-darkest { - background-color: #453411; - } - - .xl\:bg-yellow-darker { - background-color: #684f1d; - } - - .xl\:bg-yellow-dark { - background-color: #f2d024; - } - - .xl\:bg-yellow { - background-color: #ffed4a; - } - - .xl\:bg-yellow-light { - background-color: #fff382; - } - - .xl\:bg-yellow-lighter { - background-color: #fff9c2; - } - - .xl\:bg-yellow-lightest { - background-color: #fcfbeb; - } - - .xl\:bg-green-darkest { - background-color: #0f2f21; - } - - .xl\:bg-green-darker { - background-color: #1a4731; - } - - .xl\:bg-green-dark { - background-color: #1f9d55; - } - - .xl\:bg-green { - background-color: #38c172; - } - - .xl\:bg-green-light { - background-color: #51d88a; - } - - .xl\:bg-green-lighter { - background-color: #a2f5bf; - } - - .xl\:bg-green-lightest { - background-color: #e3fcec; - } - - .xl\:bg-teal-darkest { - background-color: #0d3331; - } - - .xl\:bg-teal-darker { - background-color: #20504f; - } - - .xl\:bg-teal-dark { - background-color: #38a89d; - } - - .xl\:bg-teal { - background-color: #4dc0b5; - } - - .xl\:bg-teal-light { - background-color: #64d5ca; - } - - .xl\:bg-teal-lighter { - background-color: #a0f0ed; - } - - .xl\:bg-teal-lightest { - background-color: #e8fffe; - } - - .xl\:bg-blue-darkest { - background-color: #12283a; - } - - .xl\:bg-blue-darker { - background-color: #1c3d5a; - } - - .xl\:bg-blue-dark { - background-color: #2779bd; - } - - .xl\:bg-blue { - background-color: #3490dc; - } - - .xl\:bg-blue-light { - background-color: #6cb2eb; - } - - .xl\:bg-blue-lighter { - background-color: #bcdefa; - } - - .xl\:bg-blue-lightest { - background-color: #eff8ff; - } - - .xl\:bg-indigo-darkest { - background-color: #191e38; - } - - .xl\:bg-indigo-darker { - background-color: #2f365f; - } - - .xl\:bg-indigo-dark { - background-color: #5661b3; - } - - .xl\:bg-indigo { - background-color: #6574cd; - } - - .xl\:bg-indigo-light { - background-color: #7886d7; - } - - .xl\:bg-indigo-lighter { - background-color: #b2b7ff; - } - - .xl\:bg-indigo-lightest { - background-color: #e6e8ff; - } - - .xl\:bg-purple-darkest { - background-color: #21183c; - } - - .xl\:bg-purple-darker { - background-color: #382b5f; - } - - .xl\:bg-purple-dark { - background-color: #794acf; - } - - .xl\:bg-purple { - background-color: #9561e2; - } - - .xl\:bg-purple-light { - background-color: #a779e9; - } - - .xl\:bg-purple-lighter { - background-color: #d6bbfc; - } - - .xl\:bg-purple-lightest { - background-color: #f3ebff; - } - - .xl\:bg-pink-darkest { - background-color: #451225; - } - - .xl\:bg-pink-darker { - background-color: #6f213f; - } - - .xl\:bg-pink-dark { - background-color: #eb5286; - } - - .xl\:bg-pink { - background-color: #f66d9b; - } - - .xl\:bg-pink-light { - background-color: #fa7ea8; - } - - .xl\:bg-pink-lighter { - background-color: #ffbbca; - } - - .xl\:bg-pink-lightest { - background-color: #ffebef; - } - - .xl\:hover\:bg-transparent:hover { - background-color: transparent; - } - - .xl\:hover\:bg-black:hover { - background-color: #22292f; - } - - .xl\:hover\:bg-grey-darkest:hover { - background-color: #3d4852; - } - - .xl\:hover\:bg-grey-darker:hover { - background-color: #606f7b; - } - - .xl\:hover\:bg-grey-dark:hover { - background-color: #8795a1; - } - - .xl\:hover\:bg-grey:hover { - background-color: #b8c2cc; - } - - .xl\:hover\:bg-grey-light:hover { - background-color: #dae1e7; - } - - .xl\:hover\:bg-grey-lighter:hover { - background-color: #f1f5f8; - } - - .xl\:hover\:bg-grey-lightest:hover { - background-color: #f8fafc; - } - - .xl\:hover\:bg-white:hover { - background-color: #fff; - } - - .xl\:hover\:bg-red-darkest:hover { - background-color: #3b0d0c; - } - - .xl\:hover\:bg-red-darker:hover { - background-color: #621b18; - } - - .xl\:hover\:bg-red-dark:hover { - background-color: #cc1f1a; - } - - .xl\:hover\:bg-red:hover { - background-color: #e3342f; - } - - .xl\:hover\:bg-red-light:hover { - background-color: #ef5753; - } - - .xl\:hover\:bg-red-lighter:hover { - background-color: #f9acaa; - } - - .xl\:hover\:bg-red-lightest:hover { - background-color: #fcebea; - } - - .xl\:hover\:bg-orange-darkest:hover { - background-color: #462a16; - } - - .xl\:hover\:bg-orange-darker:hover { - background-color: #613b1f; - } - - .xl\:hover\:bg-orange-dark:hover { - background-color: #de751f; - } - - .xl\:hover\:bg-orange:hover { - background-color: #f6993f; - } - - .xl\:hover\:bg-orange-light:hover { - background-color: #faad63; - } - - .xl\:hover\:bg-orange-lighter:hover { - background-color: #fcd9b6; - } - - .xl\:hover\:bg-orange-lightest:hover { - background-color: #fff5eb; - } - - .xl\:hover\:bg-yellow-darkest:hover { - background-color: #453411; - } - - .xl\:hover\:bg-yellow-darker:hover { - background-color: #684f1d; - } - - .xl\:hover\:bg-yellow-dark:hover { - background-color: #f2d024; - } - - .xl\:hover\:bg-yellow:hover { - background-color: #ffed4a; - } - - .xl\:hover\:bg-yellow-light:hover { - background-color: #fff382; - } - - .xl\:hover\:bg-yellow-lighter:hover { - background-color: #fff9c2; - } - - .xl\:hover\:bg-yellow-lightest:hover { - background-color: #fcfbeb; - } - - .xl\:hover\:bg-green-darkest:hover { - background-color: #0f2f21; - } - - .xl\:hover\:bg-green-darker:hover { - background-color: #1a4731; - } - - .xl\:hover\:bg-green-dark:hover { - background-color: #1f9d55; - } - - .xl\:hover\:bg-green:hover { - background-color: #38c172; - } - - .xl\:hover\:bg-green-light:hover { - background-color: #51d88a; - } - - .xl\:hover\:bg-green-lighter:hover { - background-color: #a2f5bf; - } - - .xl\:hover\:bg-green-lightest:hover { - background-color: #e3fcec; - } - - .xl\:hover\:bg-teal-darkest:hover { - background-color: #0d3331; - } - - .xl\:hover\:bg-teal-darker:hover { - background-color: #20504f; - } - - .xl\:hover\:bg-teal-dark:hover { - background-color: #38a89d; - } - - .xl\:hover\:bg-teal:hover { - background-color: #4dc0b5; - } - - .xl\:hover\:bg-teal-light:hover { - background-color: #64d5ca; - } - - .xl\:hover\:bg-teal-lighter:hover { - background-color: #a0f0ed; - } - - .xl\:hover\:bg-teal-lightest:hover { - background-color: #e8fffe; - } - - .xl\:hover\:bg-blue-darkest:hover { - background-color: #12283a; - } - - .xl\:hover\:bg-blue-darker:hover { - background-color: #1c3d5a; - } - - .xl\:hover\:bg-blue-dark:hover { - background-color: #2779bd; - } - - .xl\:hover\:bg-blue:hover { - background-color: #3490dc; - } - - .xl\:hover\:bg-blue-light:hover { - background-color: #6cb2eb; - } - - .xl\:hover\:bg-blue-lighter:hover { - background-color: #bcdefa; - } - - .xl\:hover\:bg-blue-lightest:hover { - background-color: #eff8ff; - } - - .xl\:hover\:bg-indigo-darkest:hover { - background-color: #191e38; - } - - .xl\:hover\:bg-indigo-darker:hover { - background-color: #2f365f; - } - - .xl\:hover\:bg-indigo-dark:hover { - background-color: #5661b3; - } - - .xl\:hover\:bg-indigo:hover { - background-color: #6574cd; - } - - .xl\:hover\:bg-indigo-light:hover { - background-color: #7886d7; - } - - .xl\:hover\:bg-indigo-lighter:hover { - background-color: #b2b7ff; - } - - .xl\:hover\:bg-indigo-lightest:hover { - background-color: #e6e8ff; - } - - .xl\:hover\:bg-purple-darkest:hover { - background-color: #21183c; - } - - .xl\:hover\:bg-purple-darker:hover { - background-color: #382b5f; - } - - .xl\:hover\:bg-purple-dark:hover { - background-color: #794acf; - } - - .xl\:hover\:bg-purple:hover { - background-color: #9561e2; - } - - .xl\:hover\:bg-purple-light:hover { - background-color: #a779e9; - } - - .xl\:hover\:bg-purple-lighter:hover { - background-color: #d6bbfc; - } - - .xl\:hover\:bg-purple-lightest:hover { - background-color: #f3ebff; - } - - .xl\:hover\:bg-pink-darkest:hover { - background-color: #451225; - } - - .xl\:hover\:bg-pink-darker:hover { - background-color: #6f213f; - } - - .xl\:hover\:bg-pink-dark:hover { - background-color: #eb5286; - } - - .xl\:hover\:bg-pink:hover { - background-color: #f66d9b; - } - - .xl\:hover\:bg-pink-light:hover { - background-color: #fa7ea8; - } - - .xl\:hover\:bg-pink-lighter:hover { - background-color: #ffbbca; - } - - .xl\:hover\:bg-pink-lightest:hover { - background-color: #ffebef; - } - - .xl\:focus\:bg-transparent:focus { - background-color: transparent; - } - - .xl\:focus\:bg-black:focus { - background-color: #22292f; - } - - .xl\:focus\:bg-grey-darkest:focus { - background-color: #3d4852; - } - - .xl\:focus\:bg-grey-darker:focus { - background-color: #606f7b; - } - - .xl\:focus\:bg-grey-dark:focus { - background-color: #8795a1; - } - - .xl\:focus\:bg-grey:focus { - background-color: #b8c2cc; - } - - .xl\:focus\:bg-grey-light:focus { - background-color: #dae1e7; - } - - .xl\:focus\:bg-grey-lighter:focus { - background-color: #f1f5f8; - } - - .xl\:focus\:bg-grey-lightest:focus { - background-color: #f8fafc; - } - - .xl\:focus\:bg-white:focus { - background-color: #fff; - } - - .xl\:focus\:bg-red-darkest:focus { - background-color: #3b0d0c; - } - - .xl\:focus\:bg-red-darker:focus { - background-color: #621b18; - } - - .xl\:focus\:bg-red-dark:focus { - background-color: #cc1f1a; - } - - .xl\:focus\:bg-red:focus { - background-color: #e3342f; - } - - .xl\:focus\:bg-red-light:focus { - background-color: #ef5753; - } - - .xl\:focus\:bg-red-lighter:focus { - background-color: #f9acaa; - } - - .xl\:focus\:bg-red-lightest:focus { - background-color: #fcebea; - } - - .xl\:focus\:bg-orange-darkest:focus { - background-color: #462a16; - } - - .xl\:focus\:bg-orange-darker:focus { - background-color: #613b1f; - } - - .xl\:focus\:bg-orange-dark:focus { - background-color: #de751f; - } - - .xl\:focus\:bg-orange:focus { - background-color: #f6993f; - } - - .xl\:focus\:bg-orange-light:focus { - background-color: #faad63; - } - - .xl\:focus\:bg-orange-lighter:focus { - background-color: #fcd9b6; - } - - .xl\:focus\:bg-orange-lightest:focus { - background-color: #fff5eb; - } - - .xl\:focus\:bg-yellow-darkest:focus { - background-color: #453411; - } - - .xl\:focus\:bg-yellow-darker:focus { - background-color: #684f1d; - } - - .xl\:focus\:bg-yellow-dark:focus { - background-color: #f2d024; - } - - .xl\:focus\:bg-yellow:focus { - background-color: #ffed4a; - } - - .xl\:focus\:bg-yellow-light:focus { - background-color: #fff382; - } - - .xl\:focus\:bg-yellow-lighter:focus { - background-color: #fff9c2; - } - - .xl\:focus\:bg-yellow-lightest:focus { - background-color: #fcfbeb; - } - - .xl\:focus\:bg-green-darkest:focus { - background-color: #0f2f21; - } - - .xl\:focus\:bg-green-darker:focus { - background-color: #1a4731; - } - - .xl\:focus\:bg-green-dark:focus { - background-color: #1f9d55; - } - - .xl\:focus\:bg-green:focus { - background-color: #38c172; - } - - .xl\:focus\:bg-green-light:focus { - background-color: #51d88a; - } - - .xl\:focus\:bg-green-lighter:focus { - background-color: #a2f5bf; - } - - .xl\:focus\:bg-green-lightest:focus { - background-color: #e3fcec; - } - - .xl\:focus\:bg-teal-darkest:focus { - background-color: #0d3331; - } - - .xl\:focus\:bg-teal-darker:focus { - background-color: #20504f; - } - - .xl\:focus\:bg-teal-dark:focus { - background-color: #38a89d; - } - - .xl\:focus\:bg-teal:focus { - background-color: #4dc0b5; - } - - .xl\:focus\:bg-teal-light:focus { - background-color: #64d5ca; - } - - .xl\:focus\:bg-teal-lighter:focus { - background-color: #a0f0ed; - } - - .xl\:focus\:bg-teal-lightest:focus { - background-color: #e8fffe; - } - - .xl\:focus\:bg-blue-darkest:focus { - background-color: #12283a; - } - - .xl\:focus\:bg-blue-darker:focus { - background-color: #1c3d5a; - } - - .xl\:focus\:bg-blue-dark:focus { - background-color: #2779bd; - } - - .xl\:focus\:bg-blue:focus { - background-color: #3490dc; - } - - .xl\:focus\:bg-blue-light:focus { - background-color: #6cb2eb; - } - - .xl\:focus\:bg-blue-lighter:focus { - background-color: #bcdefa; - } - - .xl\:focus\:bg-blue-lightest:focus { - background-color: #eff8ff; - } - - .xl\:focus\:bg-indigo-darkest:focus { - background-color: #191e38; - } - - .xl\:focus\:bg-indigo-darker:focus { - background-color: #2f365f; - } - - .xl\:focus\:bg-indigo-dark:focus { - background-color: #5661b3; - } - - .xl\:focus\:bg-indigo:focus { - background-color: #6574cd; - } - - .xl\:focus\:bg-indigo-light:focus { - background-color: #7886d7; - } - - .xl\:focus\:bg-indigo-lighter:focus { - background-color: #b2b7ff; - } - - .xl\:focus\:bg-indigo-lightest:focus { - background-color: #e6e8ff; - } - - .xl\:focus\:bg-purple-darkest:focus { - background-color: #21183c; - } - - .xl\:focus\:bg-purple-darker:focus { - background-color: #382b5f; - } - - .xl\:focus\:bg-purple-dark:focus { - background-color: #794acf; - } - - .xl\:focus\:bg-purple:focus { - background-color: #9561e2; - } - - .xl\:focus\:bg-purple-light:focus { - background-color: #a779e9; - } - - .xl\:focus\:bg-purple-lighter:focus { - background-color: #d6bbfc; - } - - .xl\:focus\:bg-purple-lightest:focus { - background-color: #f3ebff; - } - - .xl\:focus\:bg-pink-darkest:focus { - background-color: #451225; - } - - .xl\:focus\:bg-pink-darker:focus { - background-color: #6f213f; - } - - .xl\:focus\:bg-pink-dark:focus { - background-color: #eb5286; - } - - .xl\:focus\:bg-pink:focus { - background-color: #f66d9b; - } - - .xl\:focus\:bg-pink-light:focus { - background-color: #fa7ea8; - } - - .xl\:focus\:bg-pink-lighter:focus { - background-color: #ffbbca; - } - - .xl\:focus\:bg-pink-lightest:focus { - background-color: #ffebef; - } - - .xl\:bg-bottom { - background-position: bottom; - } - - .xl\:bg-center { - background-position: center; - } - - .xl\:bg-left { - background-position: left; - } - - .xl\:bg-left-bottom { - background-position: left bottom; - } - - .xl\:bg-left-top { - background-position: left top; - } - - .xl\:bg-right { - background-position: right; - } - - .xl\:bg-right-bottom { - background-position: right bottom; - } - - .xl\:bg-right-top { - background-position: right top; - } - - .xl\:bg-top { - background-position: top; - } - - .xl\:bg-repeat { - background-repeat: repeat; - } - - .xl\:bg-no-repeat { - background-repeat: no-repeat; - } - - .xl\:bg-repeat-x { - background-repeat: repeat-x; - } - - .xl\:bg-repeat-y { - background-repeat: repeat-y; - } - - .xl\:bg-auto { - background-size: auto; - } - - .xl\:bg-cover { - background-size: cover; - } - - .xl\:bg-contain { - background-size: contain; - } - - .xl\:border-transparent { - border-color: transparent; - } - - .xl\:border-black { - border-color: #22292f; - } - - .xl\:border-grey-darkest { - border-color: #3d4852; - } - - .xl\:border-grey-darker { - border-color: #606f7b; - } - - .xl\:border-grey-dark { - border-color: #8795a1; - } - - .xl\:border-grey { - border-color: #b8c2cc; - } - - .xl\:border-grey-light { - border-color: #dae1e7; - } - - .xl\:border-grey-lighter { - border-color: #f1f5f8; - } - - .xl\:border-grey-lightest { - border-color: #f8fafc; - } - - .xl\:border-white { - border-color: #fff; - } - - .xl\:border-red-darkest { - border-color: #3b0d0c; - } - - .xl\:border-red-darker { - border-color: #621b18; - } - - .xl\:border-red-dark { - border-color: #cc1f1a; - } - - .xl\:border-red { - border-color: #e3342f; - } - - .xl\:border-red-light { - border-color: #ef5753; - } - - .xl\:border-red-lighter { - border-color: #f9acaa; - } - - .xl\:border-red-lightest { - border-color: #fcebea; - } - - .xl\:border-orange-darkest { - border-color: #462a16; - } - - .xl\:border-orange-darker { - border-color: #613b1f; - } - - .xl\:border-orange-dark { - border-color: #de751f; - } - - .xl\:border-orange { - border-color: #f6993f; - } - - .xl\:border-orange-light { - border-color: #faad63; - } - - .xl\:border-orange-lighter { - border-color: #fcd9b6; - } - - .xl\:border-orange-lightest { - border-color: #fff5eb; - } - - .xl\:border-yellow-darkest { - border-color: #453411; - } - - .xl\:border-yellow-darker { - border-color: #684f1d; - } - - .xl\:border-yellow-dark { - border-color: #f2d024; - } - - .xl\:border-yellow { - border-color: #ffed4a; - } - - .xl\:border-yellow-light { - border-color: #fff382; - } - - .xl\:border-yellow-lighter { - border-color: #fff9c2; - } - - .xl\:border-yellow-lightest { - border-color: #fcfbeb; - } - - .xl\:border-green-darkest { - border-color: #0f2f21; - } - - .xl\:border-green-darker { - border-color: #1a4731; - } - - .xl\:border-green-dark { - border-color: #1f9d55; - } - - .xl\:border-green { - border-color: #38c172; - } - - .xl\:border-green-light { - border-color: #51d88a; - } - - .xl\:border-green-lighter { - border-color: #a2f5bf; - } - - .xl\:border-green-lightest { - border-color: #e3fcec; - } - - .xl\:border-teal-darkest { - border-color: #0d3331; - } - - .xl\:border-teal-darker { - border-color: #20504f; - } - - .xl\:border-teal-dark { - border-color: #38a89d; - } - - .xl\:border-teal { - border-color: #4dc0b5; - } - - .xl\:border-teal-light { - border-color: #64d5ca; - } - - .xl\:border-teal-lighter { - border-color: #a0f0ed; - } - - .xl\:border-teal-lightest { - border-color: #e8fffe; - } - - .xl\:border-blue-darkest { - border-color: #12283a; - } - - .xl\:border-blue-darker { - border-color: #1c3d5a; - } - - .xl\:border-blue-dark { - border-color: #2779bd; - } - - .xl\:border-blue { - border-color: #3490dc; - } - - .xl\:border-blue-light { - border-color: #6cb2eb; - } - - .xl\:border-blue-lighter { - border-color: #bcdefa; - } - - .xl\:border-blue-lightest { - border-color: #eff8ff; - } - - .xl\:border-indigo-darkest { - border-color: #191e38; - } - - .xl\:border-indigo-darker { - border-color: #2f365f; - } - - .xl\:border-indigo-dark { - border-color: #5661b3; - } - - .xl\:border-indigo { - border-color: #6574cd; - } - - .xl\:border-indigo-light { - border-color: #7886d7; - } - - .xl\:border-indigo-lighter { - border-color: #b2b7ff; - } - - .xl\:border-indigo-lightest { - border-color: #e6e8ff; - } - - .xl\:border-purple-darkest { - border-color: #21183c; - } - - .xl\:border-purple-darker { - border-color: #382b5f; - } - - .xl\:border-purple-dark { - border-color: #794acf; - } - - .xl\:border-purple { - border-color: #9561e2; - } - - .xl\:border-purple-light { - border-color: #a779e9; - } - - .xl\:border-purple-lighter { - border-color: #d6bbfc; - } - - .xl\:border-purple-lightest { - border-color: #f3ebff; - } - - .xl\:border-pink-darkest { - border-color: #451225; - } - - .xl\:border-pink-darker { - border-color: #6f213f; - } - - .xl\:border-pink-dark { - border-color: #eb5286; - } - - .xl\:border-pink { - border-color: #f66d9b; - } - - .xl\:border-pink-light { - border-color: #fa7ea8; - } - - .xl\:border-pink-lighter { - border-color: #ffbbca; - } - - .xl\:border-pink-lightest { - border-color: #ffebef; - } - - .xl\:hover\:border-transparent:hover { - border-color: transparent; - } - - .xl\:hover\:border-black:hover { - border-color: #22292f; - } - - .xl\:hover\:border-grey-darkest:hover { - border-color: #3d4852; - } - - .xl\:hover\:border-grey-darker:hover { - border-color: #606f7b; - } - - .xl\:hover\:border-grey-dark:hover { - border-color: #8795a1; - } - - .xl\:hover\:border-grey:hover { - border-color: #b8c2cc; - } - - .xl\:hover\:border-grey-light:hover { - border-color: #dae1e7; - } - - .xl\:hover\:border-grey-lighter:hover { - border-color: #f1f5f8; - } - - .xl\:hover\:border-grey-lightest:hover { - border-color: #f8fafc; - } - - .xl\:hover\:border-white:hover { - border-color: #fff; - } - - .xl\:hover\:border-red-darkest:hover { - border-color: #3b0d0c; - } - - .xl\:hover\:border-red-darker:hover { - border-color: #621b18; - } - - .xl\:hover\:border-red-dark:hover { - border-color: #cc1f1a; - } - - .xl\:hover\:border-red:hover { - border-color: #e3342f; - } - - .xl\:hover\:border-red-light:hover { - border-color: #ef5753; - } - - .xl\:hover\:border-red-lighter:hover { - border-color: #f9acaa; - } - - .xl\:hover\:border-red-lightest:hover { - border-color: #fcebea; - } - - .xl\:hover\:border-orange-darkest:hover { - border-color: #462a16; - } - - .xl\:hover\:border-orange-darker:hover { - border-color: #613b1f; - } - - .xl\:hover\:border-orange-dark:hover { - border-color: #de751f; - } - - .xl\:hover\:border-orange:hover { - border-color: #f6993f; - } - - .xl\:hover\:border-orange-light:hover { - border-color: #faad63; - } - - .xl\:hover\:border-orange-lighter:hover { - border-color: #fcd9b6; - } - - .xl\:hover\:border-orange-lightest:hover { - border-color: #fff5eb; - } - - .xl\:hover\:border-yellow-darkest:hover { - border-color: #453411; - } - - .xl\:hover\:border-yellow-darker:hover { - border-color: #684f1d; - } - - .xl\:hover\:border-yellow-dark:hover { - border-color: #f2d024; - } - - .xl\:hover\:border-yellow:hover { - border-color: #ffed4a; - } - - .xl\:hover\:border-yellow-light:hover { - border-color: #fff382; - } - - .xl\:hover\:border-yellow-lighter:hover { - border-color: #fff9c2; - } - - .xl\:hover\:border-yellow-lightest:hover { - border-color: #fcfbeb; - } - - .xl\:hover\:border-green-darkest:hover { - border-color: #0f2f21; - } - - .xl\:hover\:border-green-darker:hover { - border-color: #1a4731; - } - - .xl\:hover\:border-green-dark:hover { - border-color: #1f9d55; - } - - .xl\:hover\:border-green:hover { - border-color: #38c172; - } - - .xl\:hover\:border-green-light:hover { - border-color: #51d88a; - } - - .xl\:hover\:border-green-lighter:hover { - border-color: #a2f5bf; - } - - .xl\:hover\:border-green-lightest:hover { - border-color: #e3fcec; - } - - .xl\:hover\:border-teal-darkest:hover { - border-color: #0d3331; - } - - .xl\:hover\:border-teal-darker:hover { - border-color: #20504f; - } - - .xl\:hover\:border-teal-dark:hover { - border-color: #38a89d; - } - - .xl\:hover\:border-teal:hover { - border-color: #4dc0b5; - } - - .xl\:hover\:border-teal-light:hover { - border-color: #64d5ca; - } - - .xl\:hover\:border-teal-lighter:hover { - border-color: #a0f0ed; - } - - .xl\:hover\:border-teal-lightest:hover { - border-color: #e8fffe; - } - - .xl\:hover\:border-blue-darkest:hover { - border-color: #12283a; - } - - .xl\:hover\:border-blue-darker:hover { - border-color: #1c3d5a; - } - - .xl\:hover\:border-blue-dark:hover { - border-color: #2779bd; - } - - .xl\:hover\:border-blue:hover { - border-color: #3490dc; - } - - .xl\:hover\:border-blue-light:hover { - border-color: #6cb2eb; - } - - .xl\:hover\:border-blue-lighter:hover { - border-color: #bcdefa; - } - - .xl\:hover\:border-blue-lightest:hover { - border-color: #eff8ff; - } - - .xl\:hover\:border-indigo-darkest:hover { - border-color: #191e38; - } - - .xl\:hover\:border-indigo-darker:hover { - border-color: #2f365f; - } - - .xl\:hover\:border-indigo-dark:hover { - border-color: #5661b3; - } - - .xl\:hover\:border-indigo:hover { - border-color: #6574cd; - } - - .xl\:hover\:border-indigo-light:hover { - border-color: #7886d7; - } - - .xl\:hover\:border-indigo-lighter:hover { - border-color: #b2b7ff; - } - - .xl\:hover\:border-indigo-lightest:hover { - border-color: #e6e8ff; - } - - .xl\:hover\:border-purple-darkest:hover { - border-color: #21183c; - } - - .xl\:hover\:border-purple-darker:hover { - border-color: #382b5f; - } - - .xl\:hover\:border-purple-dark:hover { - border-color: #794acf; - } - - .xl\:hover\:border-purple:hover { - border-color: #9561e2; - } - - .xl\:hover\:border-purple-light:hover { - border-color: #a779e9; - } - - .xl\:hover\:border-purple-lighter:hover { - border-color: #d6bbfc; - } - - .xl\:hover\:border-purple-lightest:hover { - border-color: #f3ebff; - } - - .xl\:hover\:border-pink-darkest:hover { - border-color: #451225; - } - - .xl\:hover\:border-pink-darker:hover { - border-color: #6f213f; - } - - .xl\:hover\:border-pink-dark:hover { - border-color: #eb5286; - } - - .xl\:hover\:border-pink:hover { - border-color: #f66d9b; - } - - .xl\:hover\:border-pink-light:hover { - border-color: #fa7ea8; - } - - .xl\:hover\:border-pink-lighter:hover { - border-color: #ffbbca; - } - - .xl\:hover\:border-pink-lightest:hover { - border-color: #ffebef; - } - - .xl\:focus\:border-transparent:focus { - border-color: transparent; - } - - .xl\:focus\:border-black:focus { - border-color: #22292f; - } - - .xl\:focus\:border-grey-darkest:focus { - border-color: #3d4852; - } - - .xl\:focus\:border-grey-darker:focus { - border-color: #606f7b; - } - - .xl\:focus\:border-grey-dark:focus { - border-color: #8795a1; - } - - .xl\:focus\:border-grey:focus { - border-color: #b8c2cc; - } - - .xl\:focus\:border-grey-light:focus { - border-color: #dae1e7; - } - - .xl\:focus\:border-grey-lighter:focus { - border-color: #f1f5f8; - } - - .xl\:focus\:border-grey-lightest:focus { - border-color: #f8fafc; - } - - .xl\:focus\:border-white:focus { - border-color: #fff; - } - - .xl\:focus\:border-red-darkest:focus { - border-color: #3b0d0c; - } - - .xl\:focus\:border-red-darker:focus { - border-color: #621b18; - } - - .xl\:focus\:border-red-dark:focus { - border-color: #cc1f1a; - } - - .xl\:focus\:border-red:focus { - border-color: #e3342f; - } - - .xl\:focus\:border-red-light:focus { - border-color: #ef5753; - } - - .xl\:focus\:border-red-lighter:focus { - border-color: #f9acaa; - } - - .xl\:focus\:border-red-lightest:focus { - border-color: #fcebea; - } - - .xl\:focus\:border-orange-darkest:focus { - border-color: #462a16; - } - - .xl\:focus\:border-orange-darker:focus { - border-color: #613b1f; - } - - .xl\:focus\:border-orange-dark:focus { - border-color: #de751f; - } - - .xl\:focus\:border-orange:focus { - border-color: #f6993f; - } - - .xl\:focus\:border-orange-light:focus { - border-color: #faad63; - } - - .xl\:focus\:border-orange-lighter:focus { - border-color: #fcd9b6; - } - - .xl\:focus\:border-orange-lightest:focus { - border-color: #fff5eb; - } - - .xl\:focus\:border-yellow-darkest:focus { - border-color: #453411; - } - - .xl\:focus\:border-yellow-darker:focus { - border-color: #684f1d; - } - - .xl\:focus\:border-yellow-dark:focus { - border-color: #f2d024; - } - - .xl\:focus\:border-yellow:focus { - border-color: #ffed4a; - } - - .xl\:focus\:border-yellow-light:focus { - border-color: #fff382; - } - - .xl\:focus\:border-yellow-lighter:focus { - border-color: #fff9c2; - } - - .xl\:focus\:border-yellow-lightest:focus { - border-color: #fcfbeb; - } - - .xl\:focus\:border-green-darkest:focus { - border-color: #0f2f21; - } - - .xl\:focus\:border-green-darker:focus { - border-color: #1a4731; - } - - .xl\:focus\:border-green-dark:focus { - border-color: #1f9d55; - } - - .xl\:focus\:border-green:focus { - border-color: #38c172; - } - - .xl\:focus\:border-green-light:focus { - border-color: #51d88a; - } - - .xl\:focus\:border-green-lighter:focus { - border-color: #a2f5bf; - } - - .xl\:focus\:border-green-lightest:focus { - border-color: #e3fcec; - } - - .xl\:focus\:border-teal-darkest:focus { - border-color: #0d3331; - } - - .xl\:focus\:border-teal-darker:focus { - border-color: #20504f; - } - - .xl\:focus\:border-teal-dark:focus { - border-color: #38a89d; - } - - .xl\:focus\:border-teal:focus { - border-color: #4dc0b5; - } - - .xl\:focus\:border-teal-light:focus { - border-color: #64d5ca; - } - - .xl\:focus\:border-teal-lighter:focus { - border-color: #a0f0ed; - } - - .xl\:focus\:border-teal-lightest:focus { - border-color: #e8fffe; - } - - .xl\:focus\:border-blue-darkest:focus { - border-color: #12283a; - } - - .xl\:focus\:border-blue-darker:focus { - border-color: #1c3d5a; - } - - .xl\:focus\:border-blue-dark:focus { - border-color: #2779bd; - } - - .xl\:focus\:border-blue:focus { - border-color: #3490dc; - } - - .xl\:focus\:border-blue-light:focus { - border-color: #6cb2eb; - } - - .xl\:focus\:border-blue-lighter:focus { - border-color: #bcdefa; - } - - .xl\:focus\:border-blue-lightest:focus { - border-color: #eff8ff; - } - - .xl\:focus\:border-indigo-darkest:focus { - border-color: #191e38; - } - - .xl\:focus\:border-indigo-darker:focus { - border-color: #2f365f; - } - - .xl\:focus\:border-indigo-dark:focus { - border-color: #5661b3; - } - - .xl\:focus\:border-indigo:focus { - border-color: #6574cd; - } - - .xl\:focus\:border-indigo-light:focus { - border-color: #7886d7; - } - - .xl\:focus\:border-indigo-lighter:focus { - border-color: #b2b7ff; - } - - .xl\:focus\:border-indigo-lightest:focus { - border-color: #e6e8ff; - } - - .xl\:focus\:border-purple-darkest:focus { - border-color: #21183c; - } - - .xl\:focus\:border-purple-darker:focus { - border-color: #382b5f; - } - - .xl\:focus\:border-purple-dark:focus { - border-color: #794acf; - } - - .xl\:focus\:border-purple:focus { - border-color: #9561e2; - } - - .xl\:focus\:border-purple-light:focus { - border-color: #a779e9; - } - - .xl\:focus\:border-purple-lighter:focus { - border-color: #d6bbfc; - } - - .xl\:focus\:border-purple-lightest:focus { - border-color: #f3ebff; - } - - .xl\:focus\:border-pink-darkest:focus { - border-color: #451225; - } - - .xl\:focus\:border-pink-darker:focus { - border-color: #6f213f; - } - - .xl\:focus\:border-pink-dark:focus { - border-color: #eb5286; - } - - .xl\:focus\:border-pink:focus { - border-color: #f66d9b; - } - - .xl\:focus\:border-pink-light:focus { - border-color: #fa7ea8; - } - - .xl\:focus\:border-pink-lighter:focus { - border-color: #ffbbca; - } - - .xl\:focus\:border-pink-lightest:focus { - border-color: #ffebef; - } - - .xl\:rounded-none { - border-radius: 0; - } - - .xl\:rounded-sm { - border-radius: .125rem; - } - - .xl\:rounded { - border-radius: .25rem; - } - - .xl\:rounded-lg { - border-radius: .5rem; - } - - .xl\:rounded-full { - border-radius: 9999px; - } - - .xl\:rounded-t-none { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - - .xl\:rounded-r-none { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - - .xl\:rounded-b-none { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - } - - .xl\:rounded-l-none { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - } - - .xl\:rounded-t-sm { - border-top-left-radius: .125rem; - border-top-right-radius: .125rem; - } - - .xl\:rounded-r-sm { - border-top-right-radius: .125rem; - border-bottom-right-radius: .125rem; - } - - .xl\:rounded-b-sm { - border-bottom-right-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .xl\:rounded-l-sm { - border-top-left-radius: .125rem; - border-bottom-left-radius: .125rem; - } - - .xl\:rounded-t { - border-top-left-radius: .25rem; - border-top-right-radius: .25rem; - } - - .xl\:rounded-r { - border-top-right-radius: .25rem; - border-bottom-right-radius: .25rem; - } - - .xl\:rounded-b { - border-bottom-right-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .xl\:rounded-l { - border-top-left-radius: .25rem; - border-bottom-left-radius: .25rem; - } - - .xl\:rounded-t-lg { - border-top-left-radius: .5rem; - border-top-right-radius: .5rem; - } - - .xl\:rounded-r-lg { - border-top-right-radius: .5rem; - border-bottom-right-radius: .5rem; - } - - .xl\:rounded-b-lg { - border-bottom-right-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .xl\:rounded-l-lg { - border-top-left-radius: .5rem; - border-bottom-left-radius: .5rem; - } - - .xl\:rounded-t-full { - border-top-left-radius: 9999px; - border-top-right-radius: 9999px; - } - - .xl\:rounded-r-full { - border-top-right-radius: 9999px; - border-bottom-right-radius: 9999px; - } - - .xl\:rounded-b-full { - border-bottom-right-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .xl\:rounded-l-full { - border-top-left-radius: 9999px; - border-bottom-left-radius: 9999px; - } - - .xl\:rounded-tl-none { - border-top-left-radius: 0; - } - - .xl\:rounded-tr-none { - border-top-right-radius: 0; - } - - .xl\:rounded-br-none { - border-bottom-right-radius: 0; - } - - .xl\:rounded-bl-none { - border-bottom-left-radius: 0; - } - - .xl\:rounded-tl-sm { - border-top-left-radius: .125rem; - } - - .xl\:rounded-tr-sm { - border-top-right-radius: .125rem; - } - - .xl\:rounded-br-sm { - border-bottom-right-radius: .125rem; - } - - .xl\:rounded-bl-sm { - border-bottom-left-radius: .125rem; - } - - .xl\:rounded-tl { - border-top-left-radius: .25rem; - } - - .xl\:rounded-tr { - border-top-right-radius: .25rem; - } - - .xl\:rounded-br { - border-bottom-right-radius: .25rem; - } - - .xl\:rounded-bl { - border-bottom-left-radius: .25rem; - } - - .xl\:rounded-tl-lg { - border-top-left-radius: .5rem; - } - - .xl\:rounded-tr-lg { - border-top-right-radius: .5rem; - } - - .xl\:rounded-br-lg { - border-bottom-right-radius: .5rem; - } - - .xl\:rounded-bl-lg { - border-bottom-left-radius: .5rem; - } - - .xl\:rounded-tl-full { - border-top-left-radius: 9999px; - } - - .xl\:rounded-tr-full { - border-top-right-radius: 9999px; - } - - .xl\:rounded-br-full { - border-bottom-right-radius: 9999px; - } - - .xl\:rounded-bl-full { - border-bottom-left-radius: 9999px; - } - - .xl\:border-solid { - border-style: solid; - } - - .xl\:border-dashed { - border-style: dashed; - } - - .xl\:border-dotted { - border-style: dotted; - } - - .xl\:border-none { - border-style: none; - } - - .xl\:border-0 { - border-width: 0; - } - - .xl\:border-2 { - border-width: 2px; - } - - .xl\:border-4 { - border-width: 4px; - } - - .xl\:border-8 { - border-width: 8px; - } - - .xl\:border { - border-width: 1px; - } - - .xl\:border-t-0 { - border-top-width: 0; - } - - .xl\:border-r-0 { - border-right-width: 0; - } - - .xl\:border-b-0 { - border-bottom-width: 0; - } - - .xl\:border-l-0 { - border-left-width: 0; - } - - .xl\:border-t-2 { - border-top-width: 2px; - } - - .xl\:border-r-2 { - border-right-width: 2px; - } - - .xl\:border-b-2 { - border-bottom-width: 2px; - } - - .xl\:border-l-2 { - border-left-width: 2px; - } - - .xl\:border-t-4 { - border-top-width: 4px; - } - - .xl\:border-r-4 { - border-right-width: 4px; - } - - .xl\:border-b-4 { - border-bottom-width: 4px; - } - - .xl\:border-l-4 { - border-left-width: 4px; - } - - .xl\:border-t-8 { - border-top-width: 8px; - } - - .xl\:border-r-8 { - border-right-width: 8px; - } - - .xl\:border-b-8 { - border-bottom-width: 8px; - } - - .xl\:border-l-8 { - border-left-width: 8px; - } - - .xl\:border-t { - border-top-width: 1px; - } - - .xl\:border-r { - border-right-width: 1px; - } - - .xl\:border-b { - border-bottom-width: 1px; - } - - .xl\:border-l { - border-left-width: 1px; - } - - .xl\:cursor-auto { - cursor: auto; - } - - .xl\:cursor-default { - cursor: default; - } - - .xl\:cursor-pointer { - cursor: pointer; - } - - .xl\:cursor-wait { - cursor: wait; - } - - .xl\:cursor-move { - cursor: move; - } - - .xl\:cursor-not-allowed { - cursor: not-allowed; - } - - .xl\:block { - display: block; - } - - .xl\:inline-block { - display: inline-block; - } - - .xl\:inline { - display: inline; - } - - .xl\:table { - display: table; - } - - .xl\:table-row { - display: table-row; - } - - .xl\:table-cell { - display: table-cell; - } - - .xl\:hidden { - display: none; - } - - .xl\:flex { - display: flex; - } - - .xl\:inline-flex { - display: inline-flex; - } - - .xl\:flex-row { - flex-direction: row; - } - - .xl\:flex-row-reverse { - flex-direction: row-reverse; - } - - .xl\:flex-col { - flex-direction: column; - } - - .xl\:flex-col-reverse { - flex-direction: column-reverse; - } - - .xl\:flex-wrap { - flex-wrap: wrap; - } - - .xl\:flex-wrap-reverse { - flex-wrap: wrap-reverse; - } - - .xl\:flex-no-wrap { - flex-wrap: nowrap; - } - - .xl\:items-start { - align-items: flex-start; - } - - .xl\:items-end { - align-items: flex-end; - } - - .xl\:items-center { - align-items: center; - } - - .xl\:items-baseline { - align-items: baseline; - } - - .xl\:items-stretch { - align-items: stretch; - } - - .xl\:self-auto { - align-self: auto; - } - - .xl\:self-start { - align-self: flex-start; - } - - .xl\:self-end { - align-self: flex-end; - } - - .xl\:self-center { - align-self: center; - } - - .xl\:self-stretch { - align-self: stretch; - } - - .xl\:justify-start { - justify-content: flex-start; - } - - .xl\:justify-end { - justify-content: flex-end; - } - - .xl\:justify-center { - justify-content: center; - } - - .xl\:justify-between { - justify-content: space-between; - } - - .xl\:justify-around { - justify-content: space-around; - } - - .xl\:content-center { - align-content: center; - } - - .xl\:content-start { - align-content: flex-start; - } - - .xl\:content-end { - align-content: flex-end; - } - - .xl\:content-between { - align-content: space-between; - } - - .xl\:content-around { - align-content: space-around; - } - - .xl\:flex-1 { - flex: 1 1 0%; - } - - .xl\:flex-auto { - flex: 1 1 auto; - } - - .xl\:flex-initial { - flex: 0 1 auto; - } - - .xl\:flex-none { - flex: none; - } - - .xl\:flex-grow { - flex-grow: 1; - } - - .xl\:flex-shrink { - flex-shrink: 1; - } - - .xl\:flex-no-grow { - flex-grow: 0; - } - - .xl\:flex-no-shrink { - flex-shrink: 0; - } - - .xl\:float-right { - float: right; - } - - .xl\:float-left { - float: left; - } - - .xl\:float-none { - float: none; - } - - .xl\:clearfix:after { - content: ""; - display: table; - clear: both; - } - - .xl\:font-sans { - font-family: system-ui, BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; - } - - .xl\:font-serif { - font-family: Constantia, Lucida Bright, Lucidabright, Lucida Serif, Lucida, DejaVu Serif, Bitstream Vera Serif, Liberation Serif, Georgia, serif; - } - - .xl\:font-mono { - font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; - } - - .xl\:font-hairline { - font-weight: 100; - } - - .xl\:font-thin { - font-weight: 200; - } - - .xl\:font-light { - font-weight: 300; - } - - .xl\:font-normal { - font-weight: 400; - } - - .xl\:font-medium { - font-weight: 500; - } - - .xl\:font-semibold { - font-weight: 600; - } - - .xl\:font-bold { - font-weight: 700; - } - - .xl\:font-extrabold { - font-weight: 800; - } - - .xl\:font-black { - font-weight: 900; - } - - .xl\:hover\:font-hairline:hover { - font-weight: 100; - } - - .xl\:hover\:font-thin:hover { - font-weight: 200; - } - - .xl\:hover\:font-light:hover { - font-weight: 300; - } - - .xl\:hover\:font-normal:hover { - font-weight: 400; - } - - .xl\:hover\:font-medium:hover { - font-weight: 500; - } - - .xl\:hover\:font-semibold:hover { - font-weight: 600; - } - - .xl\:hover\:font-bold:hover { - font-weight: 700; - } - - .xl\:hover\:font-extrabold:hover { - font-weight: 800; - } - - .xl\:hover\:font-black:hover { - font-weight: 900; - } - - .xl\:focus\:font-hairline:focus { - font-weight: 100; - } - - .xl\:focus\:font-thin:focus { - font-weight: 200; - } - - .xl\:focus\:font-light:focus { - font-weight: 300; - } - - .xl\:focus\:font-normal:focus { - font-weight: 400; - } - - .xl\:focus\:font-medium:focus { - font-weight: 500; - } - - .xl\:focus\:font-semibold:focus { - font-weight: 600; - } - - .xl\:focus\:font-bold:focus { - font-weight: 700; - } - - .xl\:focus\:font-extrabold:focus { - font-weight: 800; - } - - .xl\:focus\:font-black:focus { - font-weight: 900; - } - - .xl\:h-1 { - height: .25rem; - } - - .xl\:h-2 { - height: .5rem; - } - - .xl\:h-3 { - height: .75rem; - } - - .xl\:h-4 { - height: 1rem; - } - - .xl\:h-5 { - height: 1.25rem; - } - - .xl\:h-6 { - height: 1.5rem; - } - - .xl\:h-8 { - height: 2rem; - } - - .xl\:h-10 { - height: 2.5rem; - } - - .xl\:h-12 { - height: 3rem; - } - - .xl\:h-16 { - height: 4rem; - } - - .xl\:h-24 { - height: 6rem; - } - - .xl\:h-32 { - height: 8rem; - } - - .xl\:h-48 { - height: 12rem; - } - - .xl\:h-64 { - height: 16rem; - } - - .xl\:h-auto { - height: auto; - } - - .xl\:h-px { - height: 1px; - } - - .xl\:h-full { - height: 100%; - } - - .xl\:h-screen { - height: 100vh; - } - - .xl\:leading-none { - line-height: 1; - } - - .xl\:leading-tight { - line-height: 1.25; - } - - .xl\:leading-normal { - line-height: 1.5; - } - - .xl\:leading-loose { - line-height: 2; - } - - .xl\:m-0 { - margin: 0; - } - - .xl\:m-1 { - margin: .25rem; - } - - .xl\:m-2 { - margin: .5rem; - } - - .xl\:m-3 { - margin: .75rem; - } - - .xl\:m-4 { - margin: 1rem; - } - - .xl\:m-5 { - margin: 1.25rem; - } - - .xl\:m-6 { - margin: 1.5rem; - } - - .xl\:m-8 { - margin: 2rem; - } - - .xl\:m-10 { - margin: 2.5rem; - } - - .xl\:m-12 { - margin: 3rem; - } - - .xl\:m-16 { - margin: 4rem; - } - - .xl\:m-20 { - margin: 5rem; - } - - .xl\:m-24 { - margin: 6rem; - } - - .xl\:m-32 { - margin: 8rem; - } - - .xl\:m-auto { - margin: auto; - } - - .xl\:m-px { - margin: 1px; - } - - .xl\:my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .xl\:mx-0 { - margin-left: 0; - margin-right: 0; - } - - .xl\:my-1 { - margin-top: .25rem; - margin-bottom: .25rem; - } - - .xl\:mx-1 { - margin-left: .25rem; - margin-right: .25rem; - } - - .xl\:my-2 { - margin-top: .5rem; - margin-bottom: .5rem; - } - - .xl\:mx-2 { - margin-left: .5rem; - margin-right: .5rem; - } - - .xl\:my-3 { - margin-top: .75rem; - margin-bottom: .75rem; - } - - .xl\:mx-3 { - margin-left: .75rem; - margin-right: .75rem; - } - - .xl\:my-4 { - margin-top: 1rem; - margin-bottom: 1rem; - } - - .xl\:mx-4 { - margin-left: 1rem; - margin-right: 1rem; - } - - .xl\:my-5 { - margin-top: 1.25rem; - margin-bottom: 1.25rem; - } - - .xl\:mx-5 { - margin-left: 1.25rem; - margin-right: 1.25rem; - } - - .xl\:my-6 { - margin-top: 1.5rem; - margin-bottom: 1.5rem; - } - - .xl\:mx-6 { - margin-left: 1.5rem; - margin-right: 1.5rem; - } - - .xl\:my-8 { - margin-top: 2rem; - margin-bottom: 2rem; - } - - .xl\:mx-8 { - margin-left: 2rem; - margin-right: 2rem; - } - - .xl\:my-10 { - margin-top: 2.5rem; - margin-bottom: 2.5rem; - } - - .xl\:mx-10 { - margin-left: 2.5rem; - margin-right: 2.5rem; - } - - .xl\:my-12 { - margin-top: 3rem; - margin-bottom: 3rem; - } - - .xl\:mx-12 { - margin-left: 3rem; - margin-right: 3rem; - } - - .xl\:my-16 { - margin-top: 4rem; - margin-bottom: 4rem; - } - - .xl\:mx-16 { - margin-left: 4rem; - margin-right: 4rem; - } - - .xl\:my-20 { - margin-top: 5rem; - margin-bottom: 5rem; - } - - .xl\:mx-20 { - margin-left: 5rem; - margin-right: 5rem; - } - - .xl\:my-24 { - margin-top: 6rem; - margin-bottom: 6rem; - } - - .xl\:mx-24 { - margin-left: 6rem; - margin-right: 6rem; - } - - .xl\:my-32 { - margin-top: 8rem; - margin-bottom: 8rem; - } - - .xl\:mx-32 { - margin-left: 8rem; - margin-right: 8rem; - } - - .xl\:my-auto { - margin-top: auto; - margin-bottom: auto; - } - - .xl\:mx-auto { - margin-left: auto; - margin-right: auto; - } - - .xl\:my-px { - margin-top: 1px; - margin-bottom: 1px; - } - - .xl\:mx-px { - margin-left: 1px; - margin-right: 1px; - } - - .xl\:mt-0 { - margin-top: 0; - } - - .xl\:mr-0 { - margin-right: 0; - } - - .xl\:mb-0 { - margin-bottom: 0; - } - - .xl\:ml-0 { - margin-left: 0; - } - - .xl\:mt-1 { - margin-top: .25rem; - } - - .xl\:mr-1 { - margin-right: .25rem; - } - - .xl\:mb-1 { - margin-bottom: .25rem; - } - - .xl\:ml-1 { - margin-left: .25rem; - } - - .xl\:mt-2 { - margin-top: .5rem; - } - - .xl\:mr-2 { - margin-right: .5rem; - } - - .xl\:mb-2 { - margin-bottom: .5rem; - } - - .xl\:ml-2 { - margin-left: .5rem; - } - - .xl\:mt-3 { - margin-top: .75rem; - } - - .xl\:mr-3 { - margin-right: .75rem; - } - - .xl\:mb-3 { - margin-bottom: .75rem; - } - - .xl\:ml-3 { - margin-left: .75rem; - } - - .xl\:mt-4 { - margin-top: 1rem; - } - - .xl\:mr-4 { - margin-right: 1rem; - } - - .xl\:mb-4 { - margin-bottom: 1rem; - } - - .xl\:ml-4 { - margin-left: 1rem; - } - - .xl\:mt-5 { - margin-top: 1.25rem; - } - - .xl\:mr-5 { - margin-right: 1.25rem; - } - - .xl\:mb-5 { - margin-bottom: 1.25rem; - } - - .xl\:ml-5 { - margin-left: 1.25rem; - } - - .xl\:mt-6 { - margin-top: 1.5rem; - } - - .xl\:mr-6 { - margin-right: 1.5rem; - } - - .xl\:mb-6 { - margin-bottom: 1.5rem; - } - - .xl\:ml-6 { - margin-left: 1.5rem; - } - - .xl\:mt-8 { - margin-top: 2rem; - } - - .xl\:mr-8 { - margin-right: 2rem; - } - - .xl\:mb-8 { - margin-bottom: 2rem; - } - - .xl\:ml-8 { - margin-left: 2rem; - } - - .xl\:mt-10 { - margin-top: 2.5rem; - } - - .xl\:mr-10 { - margin-right: 2.5rem; - } - - .xl\:mb-10 { - margin-bottom: 2.5rem; - } - - .xl\:ml-10 { - margin-left: 2.5rem; - } - - .xl\:mt-12 { - margin-top: 3rem; - } - - .xl\:mr-12 { - margin-right: 3rem; - } - - .xl\:mb-12 { - margin-bottom: 3rem; - } - - .xl\:ml-12 { - margin-left: 3rem; - } - - .xl\:mt-16 { - margin-top: 4rem; - } - - .xl\:mr-16 { - margin-right: 4rem; - } - - .xl\:mb-16 { - margin-bottom: 4rem; - } - - .xl\:ml-16 { - margin-left: 4rem; - } - - .xl\:mt-20 { - margin-top: 5rem; - } - - .xl\:mr-20 { - margin-right: 5rem; - } - - .xl\:mb-20 { - margin-bottom: 5rem; - } - - .xl\:ml-20 { - margin-left: 5rem; - } - - .xl\:mt-24 { - margin-top: 6rem; - } - - .xl\:mr-24 { - margin-right: 6rem; - } - - .xl\:mb-24 { - margin-bottom: 6rem; - } - - .xl\:ml-24 { - margin-left: 6rem; - } - - .xl\:mt-32 { - margin-top: 8rem; - } - - .xl\:mr-32 { - margin-right: 8rem; - } - - .xl\:mb-32 { - margin-bottom: 8rem; - } - - .xl\:ml-32 { - margin-left: 8rem; - } - - .xl\:mt-auto { - margin-top: auto; - } - - .xl\:mr-auto { - margin-right: auto; - } - - .xl\:mb-auto { - margin-bottom: auto; - } - - .xl\:ml-auto { - margin-left: auto; - } - - .xl\:mt-px { - margin-top: 1px; - } - - .xl\:mr-px { - margin-right: 1px; - } - - .xl\:mb-px { - margin-bottom: 1px; - } - - .xl\:ml-px { - margin-left: 1px; - } - - .xl\:max-h-full { - max-height: 100%; - } - - .xl\:max-h-screen { - max-height: 100vh; - } - - .xl\:max-w-xs { - max-width: 20rem; - } - - .xl\:max-w-sm { - max-width: 30rem; - } - - .xl\:max-w-md { - max-width: 40rem; - } - - .xl\:max-w-lg { - max-width: 50rem; - } - - .xl\:max-w-xl { - max-width: 60rem; - } - - .xl\:max-w-2xl { - max-width: 70rem; - } - - .xl\:max-w-3xl { - max-width: 80rem; - } - - .xl\:max-w-4xl { - max-width: 90rem; - } - - .xl\:max-w-5xl { - max-width: 100rem; - } - - .xl\:max-w-full { - max-width: 100%; - } - - .xl\:min-h-0 { - min-height: 0; - } - - .xl\:min-h-full { - min-height: 100%; - } - - .xl\:min-h-screen { - min-height: 100vh; - } - - .xl\:min-w-0 { - min-width: 0; - } - - .xl\:min-w-full { - min-width: 100%; - } - - .xl\:-m-0 { - margin: 0; - } - - .xl\:-m-1 { - margin: -0.25rem; - } - - .xl\:-m-2 { - margin: -0.5rem; - } - - .xl\:-m-3 { - margin: -0.75rem; - } - - .xl\:-m-4 { - margin: -1rem; - } - - .xl\:-m-5 { - margin: -1.25rem; - } - - .xl\:-m-6 { - margin: -1.5rem; - } - - .xl\:-m-8 { - margin: -2rem; - } - - .xl\:-m-10 { - margin: -2.5rem; - } - - .xl\:-m-12 { - margin: -3rem; - } - - .xl\:-m-16 { - margin: -4rem; - } - - .xl\:-m-20 { - margin: -5rem; - } - - .xl\:-m-24 { - margin: -6rem; - } - - .xl\:-m-32 { - margin: -8rem; - } - - .xl\:-m-px { - margin: -1px; - } - - .xl\:-my-0 { - margin-top: 0; - margin-bottom: 0; - } - - .xl\:-mx-0 { - margin-left: 0; - margin-right: 0; - } - - .xl\:-my-1 { - margin-top: -0.25rem; - margin-bottom: -0.25rem; - } - - .xl\:-mx-1 { - margin-left: -0.25rem; - margin-right: -0.25rem; - } - - .xl\:-my-2 { - margin-top: -0.5rem; - margin-bottom: -0.5rem; - } - - .xl\:-mx-2 { - margin-left: -0.5rem; - margin-right: -0.5rem; - } - - .xl\:-my-3 { - margin-top: -0.75rem; - margin-bottom: -0.75rem; - } - - .xl\:-mx-3 { - margin-left: -0.75rem; - margin-right: -0.75rem; - } - - .xl\:-my-4 { - margin-top: -1rem; - margin-bottom: -1rem; - } - - .xl\:-mx-4 { - margin-left: -1rem; - margin-right: -1rem; - } - - .xl\:-my-5 { - margin-top: -1.25rem; - margin-bottom: -1.25rem; - } - - .xl\:-mx-5 { - margin-left: -1.25rem; - margin-right: -1.25rem; - } - - .xl\:-my-6 { - margin-top: -1.5rem; - margin-bottom: -1.5rem; - } - - .xl\:-mx-6 { - margin-left: -1.5rem; - margin-right: -1.5rem; - } - - .xl\:-my-8 { - margin-top: -2rem; - margin-bottom: -2rem; - } - - .xl\:-mx-8 { - margin-left: -2rem; - margin-right: -2rem; - } - - .xl\:-my-10 { - margin-top: -2.5rem; - margin-bottom: -2.5rem; - } - - .xl\:-mx-10 { - margin-left: -2.5rem; - margin-right: -2.5rem; - } - - .xl\:-my-12 { - margin-top: -3rem; - margin-bottom: -3rem; - } - - .xl\:-mx-12 { - margin-left: -3rem; - margin-right: -3rem; - } - - .xl\:-my-16 { - margin-top: -4rem; - margin-bottom: -4rem; - } - - .xl\:-mx-16 { - margin-left: -4rem; - margin-right: -4rem; - } - - .xl\:-my-20 { - margin-top: -5rem; - margin-bottom: -5rem; - } - - .xl\:-mx-20 { - margin-left: -5rem; - margin-right: -5rem; - } - - .xl\:-my-24 { - margin-top: -6rem; - margin-bottom: -6rem; - } - - .xl\:-mx-24 { - margin-left: -6rem; - margin-right: -6rem; - } - - .xl\:-my-32 { - margin-top: -8rem; - margin-bottom: -8rem; - } - - .xl\:-mx-32 { - margin-left: -8rem; - margin-right: -8rem; - } - - .xl\:-my-px { - margin-top: -1px; - margin-bottom: -1px; - } - - .xl\:-mx-px { - margin-left: -1px; - margin-right: -1px; - } - - .xl\:-mt-0 { - margin-top: 0; - } - - .xl\:-mr-0 { - margin-right: 0; - } - - .xl\:-mb-0 { - margin-bottom: 0; - } - - .xl\:-ml-0 { - margin-left: 0; - } - - .xl\:-mt-1 { - margin-top: -0.25rem; - } - - .xl\:-mr-1 { - margin-right: -0.25rem; - } - - .xl\:-mb-1 { - margin-bottom: -0.25rem; - } - - .xl\:-ml-1 { - margin-left: -0.25rem; - } - - .xl\:-mt-2 { - margin-top: -0.5rem; - } - - .xl\:-mr-2 { - margin-right: -0.5rem; - } - - .xl\:-mb-2 { - margin-bottom: -0.5rem; - } - - .xl\:-ml-2 { - margin-left: -0.5rem; - } - - .xl\:-mt-3 { - margin-top: -0.75rem; - } - - .xl\:-mr-3 { - margin-right: -0.75rem; - } - - .xl\:-mb-3 { - margin-bottom: -0.75rem; - } - - .xl\:-ml-3 { - margin-left: -0.75rem; - } - - .xl\:-mt-4 { - margin-top: -1rem; - } - - .xl\:-mr-4 { - margin-right: -1rem; - } - - .xl\:-mb-4 { - margin-bottom: -1rem; - } - - .xl\:-ml-4 { - margin-left: -1rem; - } - - .xl\:-mt-5 { - margin-top: -1.25rem; - } - - .xl\:-mr-5 { - margin-right: -1.25rem; - } - - .xl\:-mb-5 { - margin-bottom: -1.25rem; - } - - .xl\:-ml-5 { - margin-left: -1.25rem; - } - - .xl\:-mt-6 { - margin-top: -1.5rem; - } - - .xl\:-mr-6 { - margin-right: -1.5rem; - } - - .xl\:-mb-6 { - margin-bottom: -1.5rem; - } - - .xl\:-ml-6 { - margin-left: -1.5rem; - } - - .xl\:-mt-8 { - margin-top: -2rem; - } - - .xl\:-mr-8 { - margin-right: -2rem; - } - - .xl\:-mb-8 { - margin-bottom: -2rem; - } - - .xl\:-ml-8 { - margin-left: -2rem; - } - - .xl\:-mt-10 { - margin-top: -2.5rem; - } - - .xl\:-mr-10 { - margin-right: -2.5rem; - } - - .xl\:-mb-10 { - margin-bottom: -2.5rem; - } - - .xl\:-ml-10 { - margin-left: -2.5rem; - } - - .xl\:-mt-12 { - margin-top: -3rem; - } - - .xl\:-mr-12 { - margin-right: -3rem; - } - - .xl\:-mb-12 { - margin-bottom: -3rem; - } - - .xl\:-ml-12 { - margin-left: -3rem; - } - - .xl\:-mt-16 { - margin-top: -4rem; - } - - .xl\:-mr-16 { - margin-right: -4rem; - } - - .xl\:-mb-16 { - margin-bottom: -4rem; - } - - .xl\:-ml-16 { - margin-left: -4rem; - } - - .xl\:-mt-20 { - margin-top: -5rem; - } - - .xl\:-mr-20 { - margin-right: -5rem; - } - - .xl\:-mb-20 { - margin-bottom: -5rem; - } - - .xl\:-ml-20 { - margin-left: -5rem; - } - - .xl\:-mt-24 { - margin-top: -6rem; - } - - .xl\:-mr-24 { - margin-right: -6rem; - } - - .xl\:-mb-24 { - margin-bottom: -6rem; - } - - .xl\:-ml-24 { - margin-left: -6rem; - } - - .xl\:-mt-32 { - margin-top: -8rem; - } - - .xl\:-mr-32 { - margin-right: -8rem; - } - - .xl\:-mb-32 { - margin-bottom: -8rem; - } - - .xl\:-ml-32 { - margin-left: -8rem; - } - - .xl\:-mt-px { - margin-top: -1px; - } - - .xl\:-mr-px { - margin-right: -1px; - } - - .xl\:-mb-px { - margin-bottom: -1px; - } - - .xl\:-ml-px { - margin-left: -1px; - } - - .xl\:opacity-0 { - opacity: 0; - } - - .xl\:opacity-25 { - opacity: .25; - } - - .xl\:opacity-50 { - opacity: .5; - } - - .xl\:opacity-75 { - opacity: .75; - } - - .xl\:opacity-100 { - opacity: 1; - } - - .xl\:overflow-auto { - overflow: auto; - } - - .xl\:overflow-hidden { - overflow: hidden; - } - - .xl\:overflow-visible { - overflow: visible; - } - - .xl\:overflow-scroll { - overflow: scroll; - } - - .xl\:overflow-x-auto { - overflow-x: auto; - } - - .xl\:overflow-y-auto { - overflow-y: auto; - } - - .xl\:overflow-x-hidden { - overflow-x: hidden; - } - - .xl\:overflow-y-hidden { - overflow-y: hidden; - } - - .xl\:overflow-x-visible { - overflow-x: visible; - } - - .xl\:overflow-y-visible { - overflow-y: visible; - } - - .xl\:overflow-x-scroll { - overflow-x: scroll; - } - - .xl\:overflow-y-scroll { - overflow-y: scroll; - } - - .xl\:scrolling-touch { - -webkit-overflow-scrolling: touch; - } - - .xl\:scrolling-auto { - -webkit-overflow-scrolling: auto; - } - - .xl\:p-0 { - padding: 0; - } - - .xl\:p-1 { - padding: .25rem; - } - - .xl\:p-2 { - padding: .5rem; - } - - .xl\:p-3 { - padding: .75rem; - } - - .xl\:p-4 { - padding: 1rem; - } - - .xl\:p-5 { - padding: 1.25rem; - } - - .xl\:p-6 { - padding: 1.5rem; - } - - .xl\:p-8 { - padding: 2rem; - } - - .xl\:p-10 { - padding: 2.5rem; - } - - .xl\:p-12 { - padding: 3rem; - } - - .xl\:p-16 { - padding: 4rem; - } - - .xl\:p-20 { - padding: 5rem; - } - - .xl\:p-24 { - padding: 6rem; - } - - .xl\:p-32 { - padding: 8rem; - } - - .xl\:p-px { - padding: 1px; - } - - .xl\:py-0 { - padding-top: 0; - padding-bottom: 0; - } - - .xl\:px-0 { - padding-left: 0; - padding-right: 0; - } - - .xl\:py-1 { - padding-top: .25rem; - padding-bottom: .25rem; - } - - .xl\:px-1 { - padding-left: .25rem; - padding-right: .25rem; - } - - .xl\:py-2 { - padding-top: .5rem; - padding-bottom: .5rem; - } - - .xl\:px-2 { - padding-left: .5rem; - padding-right: .5rem; - } - - .xl\:py-3 { - padding-top: .75rem; - padding-bottom: .75rem; - } - - .xl\:px-3 { - padding-left: .75rem; - padding-right: .75rem; - } - - .xl\:py-4 { - padding-top: 1rem; - padding-bottom: 1rem; - } - - .xl\:px-4 { - padding-left: 1rem; - padding-right: 1rem; - } - - .xl\:py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; - } - - .xl\:px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; - } - - .xl\:py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; - } - - .xl\:px-6 { - padding-left: 1.5rem; - padding-right: 1.5rem; - } - - .xl\:py-8 { - padding-top: 2rem; - padding-bottom: 2rem; - } - - .xl\:px-8 { - padding-left: 2rem; - padding-right: 2rem; - } - - .xl\:py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; - } - - .xl\:px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; - } - - .xl\:py-12 { - padding-top: 3rem; - padding-bottom: 3rem; - } - - .xl\:px-12 { - padding-left: 3rem; - padding-right: 3rem; - } - - .xl\:py-16 { - padding-top: 4rem; - padding-bottom: 4rem; - } - - .xl\:px-16 { - padding-left: 4rem; - padding-right: 4rem; - } - - .xl\:py-20 { - padding-top: 5rem; - padding-bottom: 5rem; - } - - .xl\:px-20 { - padding-left: 5rem; - padding-right: 5rem; - } - - .xl\:py-24 { - padding-top: 6rem; - padding-bottom: 6rem; - } - - .xl\:px-24 { - padding-left: 6rem; - padding-right: 6rem; - } - - .xl\:py-32 { - padding-top: 8rem; - padding-bottom: 8rem; - } - - .xl\:px-32 { - padding-left: 8rem; - padding-right: 8rem; - } - - .xl\:py-px { - padding-top: 1px; - padding-bottom: 1px; - } - - .xl\:px-px { - padding-left: 1px; - padding-right: 1px; - } - - .xl\:pt-0 { - padding-top: 0; - } - - .xl\:pr-0 { - padding-right: 0; - } - - .xl\:pb-0 { - padding-bottom: 0; - } - - .xl\:pl-0 { - padding-left: 0; - } - - .xl\:pt-1 { - padding-top: .25rem; - } - - .xl\:pr-1 { - padding-right: .25rem; - } - - .xl\:pb-1 { - padding-bottom: .25rem; - } - - .xl\:pl-1 { - padding-left: .25rem; - } - - .xl\:pt-2 { - padding-top: .5rem; - } - - .xl\:pr-2 { - padding-right: .5rem; - } - - .xl\:pb-2 { - padding-bottom: .5rem; - } - - .xl\:pl-2 { - padding-left: .5rem; - } - - .xl\:pt-3 { - padding-top: .75rem; - } - - .xl\:pr-3 { - padding-right: .75rem; - } - - .xl\:pb-3 { - padding-bottom: .75rem; - } - - .xl\:pl-3 { - padding-left: .75rem; - } - - .xl\:pt-4 { - padding-top: 1rem; - } - - .xl\:pr-4 { - padding-right: 1rem; - } - - .xl\:pb-4 { - padding-bottom: 1rem; - } - - .xl\:pl-4 { - padding-left: 1rem; - } - - .xl\:pt-5 { - padding-top: 1.25rem; - } - - .xl\:pr-5 { - padding-right: 1.25rem; - } - - .xl\:pb-5 { - padding-bottom: 1.25rem; - } - - .xl\:pl-5 { - padding-left: 1.25rem; - } - - .xl\:pt-6 { - padding-top: 1.5rem; - } - - .xl\:pr-6 { - padding-right: 1.5rem; - } - - .xl\:pb-6 { - padding-bottom: 1.5rem; - } - - .xl\:pl-6 { - padding-left: 1.5rem; - } - - .xl\:pt-8 { - padding-top: 2rem; - } - - .xl\:pr-8 { - padding-right: 2rem; - } - - .xl\:pb-8 { - padding-bottom: 2rem; - } - - .xl\:pl-8 { - padding-left: 2rem; - } - - .xl\:pt-10 { - padding-top: 2.5rem; - } - - .xl\:pr-10 { - padding-right: 2.5rem; - } - - .xl\:pb-10 { - padding-bottom: 2.5rem; - } - - .xl\:pl-10 { - padding-left: 2.5rem; - } - - .xl\:pt-12 { - padding-top: 3rem; - } - - .xl\:pr-12 { - padding-right: 3rem; - } - - .xl\:pb-12 { - padding-bottom: 3rem; - } - - .xl\:pl-12 { - padding-left: 3rem; - } - - .xl\:pt-16 { - padding-top: 4rem; - } - - .xl\:pr-16 { - padding-right: 4rem; - } - - .xl\:pb-16 { - padding-bottom: 4rem; - } - - .xl\:pl-16 { - padding-left: 4rem; - } - - .xl\:pt-20 { - padding-top: 5rem; - } - - .xl\:pr-20 { - padding-right: 5rem; - } - - .xl\:pb-20 { - padding-bottom: 5rem; - } - - .xl\:pl-20 { - padding-left: 5rem; - } - - .xl\:pt-24 { - padding-top: 6rem; - } - - .xl\:pr-24 { - padding-right: 6rem; - } - - .xl\:pb-24 { - padding-bottom: 6rem; - } - - .xl\:pl-24 { - padding-left: 6rem; - } - - .xl\:pt-32 { - padding-top: 8rem; - } - - .xl\:pr-32 { - padding-right: 8rem; - } - - .xl\:pb-32 { - padding-bottom: 8rem; - } - - .xl\:pl-32 { - padding-left: 8rem; - } - - .xl\:pt-px { - padding-top: 1px; - } - - .xl\:pr-px { - padding-right: 1px; - } - - .xl\:pb-px { - padding-bottom: 1px; - } - - .xl\:pl-px { - padding-left: 1px; - } - - .xl\:pointer-events-none { - pointer-events: none; - } - - .xl\:pointer-events-auto { - pointer-events: auto; - } - - .xl\:static { - position: static; - } - - .xl\:fixed { - position: fixed; - } - - .xl\:absolute { - position: absolute; - } - - .xl\:relative { - position: relative; - } - - .xl\:sticky { - position: -webkit-sticky; - position: sticky; - } - - .xl\:pin-none { - top: auto; - right: auto; - bottom: auto; - left: auto; - } - - .xl\:pin { - top: 0; - right: 0; - bottom: 0; - left: 0; - } - - .xl\:pin-y { - top: 0; - bottom: 0; - } - - .xl\:pin-x { - right: 0; - left: 0; - } - - .xl\:pin-t { - top: 0; - } - - .xl\:pin-r { - right: 0; - } - - .xl\:pin-b { - bottom: 0; - } - - .xl\:pin-l { - left: 0; - } - - .xl\:resize-none { - resize: none; - } - - .xl\:resize-y { - resize: vertical; - } - - .xl\:resize-x { - resize: horizontal; - } - - .xl\:resize { - resize: both; - } - - .xl\:shadow { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .xl\:shadow-md { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .xl\:shadow-lg { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .xl\:shadow-inner { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .xl\:shadow-outline { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .xl\:shadow-none { - box-shadow: none; - } - - .xl\:hover\:shadow:hover { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .xl\:hover\:shadow-md:hover { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .xl\:hover\:shadow-lg:hover { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .xl\:hover\:shadow-inner:hover { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .xl\:hover\:shadow-outline:hover { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .xl\:hover\:shadow-none:hover { - box-shadow: none; - } - - .xl\:focus\:shadow:focus { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1); - } - - .xl\:focus\:shadow-md:focus { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08); - } - - .xl\:focus\:shadow-lg:focus { - box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08); - } - - .xl\:focus\:shadow-inner:focus { - box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06); - } - - .xl\:focus\:shadow-outline:focus { - box-shadow: 0 0 0 3px rgba(52, 144, 220, .5); - } - - .xl\:focus\:shadow-none:focus { - box-shadow: none; - } - - .xl\:table-auto { - table-layout: auto; - } - - .xl\:table-fixed { - table-layout: fixed; - } - - .xl\:text-left { - text-align: left; - } - - .xl\:text-center { - text-align: center; - } - - .xl\:text-right { - text-align: right; - } - - .xl\:text-justify { - text-align: justify; - } - - .xl\:text-transparent { - color: transparent; - } - - .xl\:text-black { - color: #22292f; - } - - .xl\:text-grey-darkest { - color: #3d4852; - } - - .xl\:text-grey-darker { - color: #606f7b; - } - - .xl\:text-grey-dark { - color: #8795a1; - } - - .xl\:text-grey { - color: #b8c2cc; - } - - .xl\:text-grey-light { - color: #dae1e7; - } - - .xl\:text-grey-lighter { - color: #f1f5f8; - } - - .xl\:text-grey-lightest { - color: #f8fafc; - } - - .xl\:text-white { - color: #fff; - } - - .xl\:text-red-darkest { - color: #3b0d0c; - } - - .xl\:text-red-darker { - color: #621b18; - } - - .xl\:text-red-dark { - color: #cc1f1a; - } - - .xl\:text-red { - color: #e3342f; - } - - .xl\:text-red-light { - color: #ef5753; - } - - .xl\:text-red-lighter { - color: #f9acaa; - } - - .xl\:text-red-lightest { - color: #fcebea; - } - - .xl\:text-orange-darkest { - color: #462a16; - } - - .xl\:text-orange-darker { - color: #613b1f; - } - - .xl\:text-orange-dark { - color: #de751f; - } - - .xl\:text-orange { - color: #f6993f; - } - - .xl\:text-orange-light { - color: #faad63; - } - - .xl\:text-orange-lighter { - color: #fcd9b6; - } - - .xl\:text-orange-lightest { - color: #fff5eb; - } - - .xl\:text-yellow-darkest { - color: #453411; - } - - .xl\:text-yellow-darker { - color: #684f1d; - } - - .xl\:text-yellow-dark { - color: #f2d024; - } - - .xl\:text-yellow { - color: #ffed4a; - } - - .xl\:text-yellow-light { - color: #fff382; - } - - .xl\:text-yellow-lighter { - color: #fff9c2; - } - - .xl\:text-yellow-lightest { - color: #fcfbeb; - } - - .xl\:text-green-darkest { - color: #0f2f21; - } - - .xl\:text-green-darker { - color: #1a4731; - } - - .xl\:text-green-dark { - color: #1f9d55; - } - - .xl\:text-green { - color: #38c172; - } - - .xl\:text-green-light { - color: #51d88a; - } - - .xl\:text-green-lighter { - color: #a2f5bf; - } - - .xl\:text-green-lightest { - color: #e3fcec; - } - - .xl\:text-teal-darkest { - color: #0d3331; - } - - .xl\:text-teal-darker { - color: #20504f; - } - - .xl\:text-teal-dark { - color: #38a89d; - } - - .xl\:text-teal { - color: #4dc0b5; - } - - .xl\:text-teal-light { - color: #64d5ca; - } - - .xl\:text-teal-lighter { - color: #a0f0ed; - } - - .xl\:text-teal-lightest { - color: #e8fffe; - } - - .xl\:text-blue-darkest { - color: #12283a; - } - - .xl\:text-blue-darker { - color: #1c3d5a; - } - - .xl\:text-blue-dark { - color: #2779bd; - } - - .xl\:text-blue { - color: #3490dc; - } - - .xl\:text-blue-light { - color: #6cb2eb; - } - - .xl\:text-blue-lighter { - color: #bcdefa; - } - - .xl\:text-blue-lightest { - color: #eff8ff; - } - - .xl\:text-indigo-darkest { - color: #191e38; - } - - .xl\:text-indigo-darker { - color: #2f365f; - } - - .xl\:text-indigo-dark { - color: #5661b3; - } - - .xl\:text-indigo { - color: #6574cd; - } - - .xl\:text-indigo-light { - color: #7886d7; - } - - .xl\:text-indigo-lighter { - color: #b2b7ff; - } - - .xl\:text-indigo-lightest { - color: #e6e8ff; - } - - .xl\:text-purple-darkest { - color: #21183c; - } - - .xl\:text-purple-darker { - color: #382b5f; - } - - .xl\:text-purple-dark { - color: #794acf; - } - - .xl\:text-purple { - color: #9561e2; - } - - .xl\:text-purple-light { - color: #a779e9; - } - - .xl\:text-purple-lighter { - color: #d6bbfc; - } - - .xl\:text-purple-lightest { - color: #f3ebff; - } - - .xl\:text-pink-darkest { - color: #451225; - } - - .xl\:text-pink-darker { - color: #6f213f; - } - - .xl\:text-pink-dark { - color: #eb5286; - } - - .xl\:text-pink { - color: #f66d9b; - } - - .xl\:text-pink-light { - color: #fa7ea8; - } - - .xl\:text-pink-lighter { - color: #ffbbca; - } - - .xl\:text-pink-lightest { - color: #ffebef; - } - - .xl\:hover\:text-transparent:hover { - color: transparent; - } - - .xl\:hover\:text-black:hover { - color: #22292f; - } - - .xl\:hover\:text-grey-darkest:hover { - color: #3d4852; - } - - .xl\:hover\:text-grey-darker:hover { - color: #606f7b; - } - - .xl\:hover\:text-grey-dark:hover { - color: #8795a1; - } - - .xl\:hover\:text-grey:hover { - color: #b8c2cc; - } - - .xl\:hover\:text-grey-light:hover { - color: #dae1e7; - } - - .xl\:hover\:text-grey-lighter:hover { - color: #f1f5f8; - } - - .xl\:hover\:text-grey-lightest:hover { - color: #f8fafc; - } - - .xl\:hover\:text-white:hover { - color: #fff; - } - - .xl\:hover\:text-red-darkest:hover { - color: #3b0d0c; - } - - .xl\:hover\:text-red-darker:hover { - color: #621b18; - } - - .xl\:hover\:text-red-dark:hover { - color: #cc1f1a; - } - - .xl\:hover\:text-red:hover { - color: #e3342f; - } - - .xl\:hover\:text-red-light:hover { - color: #ef5753; - } - - .xl\:hover\:text-red-lighter:hover { - color: #f9acaa; - } - - .xl\:hover\:text-red-lightest:hover { - color: #fcebea; - } - - .xl\:hover\:text-orange-darkest:hover { - color: #462a16; - } - - .xl\:hover\:text-orange-darker:hover { - color: #613b1f; - } - - .xl\:hover\:text-orange-dark:hover { - color: #de751f; - } - - .xl\:hover\:text-orange:hover { - color: #f6993f; - } - - .xl\:hover\:text-orange-light:hover { - color: #faad63; - } - - .xl\:hover\:text-orange-lighter:hover { - color: #fcd9b6; - } - - .xl\:hover\:text-orange-lightest:hover { - color: #fff5eb; - } - - .xl\:hover\:text-yellow-darkest:hover { - color: #453411; - } - - .xl\:hover\:text-yellow-darker:hover { - color: #684f1d; - } - - .xl\:hover\:text-yellow-dark:hover { - color: #f2d024; - } - - .xl\:hover\:text-yellow:hover { - color: #ffed4a; - } - - .xl\:hover\:text-yellow-light:hover { - color: #fff382; - } - - .xl\:hover\:text-yellow-lighter:hover { - color: #fff9c2; - } - - .xl\:hover\:text-yellow-lightest:hover { - color: #fcfbeb; - } - - .xl\:hover\:text-green-darkest:hover { - color: #0f2f21; - } - - .xl\:hover\:text-green-darker:hover { - color: #1a4731; - } - - .xl\:hover\:text-green-dark:hover { - color: #1f9d55; - } - - .xl\:hover\:text-green:hover { - color: #38c172; - } - - .xl\:hover\:text-green-light:hover { - color: #51d88a; - } - - .xl\:hover\:text-green-lighter:hover { - color: #a2f5bf; - } - - .xl\:hover\:text-green-lightest:hover { - color: #e3fcec; - } - - .xl\:hover\:text-teal-darkest:hover { - color: #0d3331; - } - - .xl\:hover\:text-teal-darker:hover { - color: #20504f; - } - - .xl\:hover\:text-teal-dark:hover { - color: #38a89d; - } - - .xl\:hover\:text-teal:hover { - color: #4dc0b5; - } - - .xl\:hover\:text-teal-light:hover { - color: #64d5ca; - } - - .xl\:hover\:text-teal-lighter:hover { - color: #a0f0ed; - } - - .xl\:hover\:text-teal-lightest:hover { - color: #e8fffe; - } - - .xl\:hover\:text-blue-darkest:hover { - color: #12283a; - } - - .xl\:hover\:text-blue-darker:hover { - color: #1c3d5a; - } - - .xl\:hover\:text-blue-dark:hover { - color: #2779bd; - } - - .xl\:hover\:text-blue:hover { - color: #3490dc; - } - - .xl\:hover\:text-blue-light:hover { - color: #6cb2eb; - } - - .xl\:hover\:text-blue-lighter:hover { - color: #bcdefa; - } - - .xl\:hover\:text-blue-lightest:hover { - color: #eff8ff; - } - - .xl\:hover\:text-indigo-darkest:hover { - color: #191e38; - } - - .xl\:hover\:text-indigo-darker:hover { - color: #2f365f; - } - - .xl\:hover\:text-indigo-dark:hover { - color: #5661b3; - } - - .xl\:hover\:text-indigo:hover { - color: #6574cd; - } - - .xl\:hover\:text-indigo-light:hover { - color: #7886d7; - } - - .xl\:hover\:text-indigo-lighter:hover { - color: #b2b7ff; - } - - .xl\:hover\:text-indigo-lightest:hover { - color: #e6e8ff; - } - - .xl\:hover\:text-purple-darkest:hover { - color: #21183c; - } - - .xl\:hover\:text-purple-darker:hover { - color: #382b5f; - } - - .xl\:hover\:text-purple-dark:hover { - color: #794acf; - } - - .xl\:hover\:text-purple:hover { - color: #9561e2; - } - - .xl\:hover\:text-purple-light:hover { - color: #a779e9; - } - - .xl\:hover\:text-purple-lighter:hover { - color: #d6bbfc; - } - - .xl\:hover\:text-purple-lightest:hover { - color: #f3ebff; - } - - .xl\:hover\:text-pink-darkest:hover { - color: #451225; - } - - .xl\:hover\:text-pink-darker:hover { - color: #6f213f; - } - - .xl\:hover\:text-pink-dark:hover { - color: #eb5286; - } - - .xl\:hover\:text-pink:hover { - color: #f66d9b; - } - - .xl\:hover\:text-pink-light:hover { - color: #fa7ea8; - } - - .xl\:hover\:text-pink-lighter:hover { - color: #ffbbca; - } - - .xl\:hover\:text-pink-lightest:hover { - color: #ffebef; - } - - .xl\:focus\:text-transparent:focus { - color: transparent; - } - - .xl\:focus\:text-black:focus { - color: #22292f; - } - - .xl\:focus\:text-grey-darkest:focus { - color: #3d4852; - } - - .xl\:focus\:text-grey-darker:focus { - color: #606f7b; - } - - .xl\:focus\:text-grey-dark:focus { - color: #8795a1; - } - - .xl\:focus\:text-grey:focus { - color: #b8c2cc; - } - - .xl\:focus\:text-grey-light:focus { - color: #dae1e7; - } - - .xl\:focus\:text-grey-lighter:focus { - color: #f1f5f8; - } - - .xl\:focus\:text-grey-lightest:focus { - color: #f8fafc; - } - - .xl\:focus\:text-white:focus { - color: #fff; - } - - .xl\:focus\:text-red-darkest:focus { - color: #3b0d0c; - } - - .xl\:focus\:text-red-darker:focus { - color: #621b18; - } - - .xl\:focus\:text-red-dark:focus { - color: #cc1f1a; - } - - .xl\:focus\:text-red:focus { - color: #e3342f; - } - - .xl\:focus\:text-red-light:focus { - color: #ef5753; - } - - .xl\:focus\:text-red-lighter:focus { - color: #f9acaa; - } - - .xl\:focus\:text-red-lightest:focus { - color: #fcebea; - } - - .xl\:focus\:text-orange-darkest:focus { - color: #462a16; - } - - .xl\:focus\:text-orange-darker:focus { - color: #613b1f; - } - - .xl\:focus\:text-orange-dark:focus { - color: #de751f; - } - - .xl\:focus\:text-orange:focus { - color: #f6993f; - } - - .xl\:focus\:text-orange-light:focus { - color: #faad63; - } - - .xl\:focus\:text-orange-lighter:focus { - color: #fcd9b6; - } - - .xl\:focus\:text-orange-lightest:focus { - color: #fff5eb; - } - - .xl\:focus\:text-yellow-darkest:focus { - color: #453411; - } - - .xl\:focus\:text-yellow-darker:focus { - color: #684f1d; - } - - .xl\:focus\:text-yellow-dark:focus { - color: #f2d024; - } - - .xl\:focus\:text-yellow:focus { - color: #ffed4a; - } - - .xl\:focus\:text-yellow-light:focus { - color: #fff382; - } - - .xl\:focus\:text-yellow-lighter:focus { - color: #fff9c2; - } - - .xl\:focus\:text-yellow-lightest:focus { - color: #fcfbeb; - } - - .xl\:focus\:text-green-darkest:focus { - color: #0f2f21; - } - - .xl\:focus\:text-green-darker:focus { - color: #1a4731; - } - - .xl\:focus\:text-green-dark:focus { - color: #1f9d55; - } - - .xl\:focus\:text-green:focus { - color: #38c172; - } - - .xl\:focus\:text-green-light:focus { - color: #51d88a; - } - - .xl\:focus\:text-green-lighter:focus { - color: #a2f5bf; - } - - .xl\:focus\:text-green-lightest:focus { - color: #e3fcec; - } - - .xl\:focus\:text-teal-darkest:focus { - color: #0d3331; - } - - .xl\:focus\:text-teal-darker:focus { - color: #20504f; - } - - .xl\:focus\:text-teal-dark:focus { - color: #38a89d; - } - - .xl\:focus\:text-teal:focus { - color: #4dc0b5; - } - - .xl\:focus\:text-teal-light:focus { - color: #64d5ca; - } - - .xl\:focus\:text-teal-lighter:focus { - color: #a0f0ed; - } - - .xl\:focus\:text-teal-lightest:focus { - color: #e8fffe; - } - - .xl\:focus\:text-blue-darkest:focus { - color: #12283a; - } - - .xl\:focus\:text-blue-darker:focus { - color: #1c3d5a; - } - - .xl\:focus\:text-blue-dark:focus { - color: #2779bd; - } - - .xl\:focus\:text-blue:focus { - color: #3490dc; - } - - .xl\:focus\:text-blue-light:focus { - color: #6cb2eb; - } - - .xl\:focus\:text-blue-lighter:focus { - color: #bcdefa; - } - - .xl\:focus\:text-blue-lightest:focus { - color: #eff8ff; - } - - .xl\:focus\:text-indigo-darkest:focus { - color: #191e38; - } - - .xl\:focus\:text-indigo-darker:focus { - color: #2f365f; - } - - .xl\:focus\:text-indigo-dark:focus { - color: #5661b3; - } - - .xl\:focus\:text-indigo:focus { - color: #6574cd; - } - - .xl\:focus\:text-indigo-light:focus { - color: #7886d7; - } - - .xl\:focus\:text-indigo-lighter:focus { - color: #b2b7ff; - } - - .xl\:focus\:text-indigo-lightest:focus { - color: #e6e8ff; - } - - .xl\:focus\:text-purple-darkest:focus { - color: #21183c; - } - - .xl\:focus\:text-purple-darker:focus { - color: #382b5f; - } - - .xl\:focus\:text-purple-dark:focus { - color: #794acf; - } - - .xl\:focus\:text-purple:focus { - color: #9561e2; - } - - .xl\:focus\:text-purple-light:focus { - color: #a779e9; - } - - .xl\:focus\:text-purple-lighter:focus { - color: #d6bbfc; - } - - .xl\:focus\:text-purple-lightest:focus { - color: #f3ebff; - } - - .xl\:focus\:text-pink-darkest:focus { - color: #451225; - } - - .xl\:focus\:text-pink-darker:focus { - color: #6f213f; - } - - .xl\:focus\:text-pink-dark:focus { - color: #eb5286; - } - - .xl\:focus\:text-pink:focus { - color: #f66d9b; - } - - .xl\:focus\:text-pink-light:focus { - color: #fa7ea8; - } - - .xl\:focus\:text-pink-lighter:focus { - color: #ffbbca; - } - - .xl\:focus\:text-pink-lightest:focus { - color: #ffebef; - } - - .xl\:text-xs { - font-size: .75rem; - } - - .xl\:text-sm { - font-size: .875rem; - } - - .xl\:text-base { - font-size: 1rem; - } - - .xl\:text-lg { - font-size: 1.125rem; - } - - .xl\:text-xl { - font-size: 1.25rem; - } - - .xl\:text-2xl { - font-size: 1.5rem; - } - - .xl\:text-3xl { - font-size: 1.875rem; - } - - .xl\:text-4xl { - font-size: 2.25rem; - } - - .xl\:text-5xl { - font-size: 3rem; - } - - .xl\:italic { - font-style: italic; - } - - .xl\:roman { - font-style: normal; - } - - .xl\:uppercase { - text-transform: uppercase; - } - - .xl\:lowercase { - text-transform: lowercase; - } - - .xl\:capitalize { - text-transform: capitalize; - } - - .xl\:normal-case { - text-transform: none; - } - - .xl\:underline { - text-decoration: underline; - } - - .xl\:line-through { - text-decoration: line-through; - } - - .xl\:no-underline { - text-decoration: none; - } - - .xl\:antialiased { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .xl\:subpixel-antialiased { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .xl\:hover\:italic:hover { - font-style: italic; - } - - .xl\:hover\:roman:hover { - font-style: normal; - } - - .xl\:hover\:uppercase:hover { - text-transform: uppercase; - } - - .xl\:hover\:lowercase:hover { - text-transform: lowercase; - } - - .xl\:hover\:capitalize:hover { - text-transform: capitalize; - } - - .xl\:hover\:normal-case:hover { - text-transform: none; - } - - .xl\:hover\:underline:hover { - text-decoration: underline; - } - - .xl\:hover\:line-through:hover { - text-decoration: line-through; - } - - .xl\:hover\:no-underline:hover { - text-decoration: none; - } - - .xl\:hover\:antialiased:hover { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .xl\:hover\:subpixel-antialiased:hover { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .xl\:focus\:italic:focus { - font-style: italic; - } - - .xl\:focus\:roman:focus { - font-style: normal; - } - - .xl\:focus\:uppercase:focus { - text-transform: uppercase; - } - - .xl\:focus\:lowercase:focus { - text-transform: lowercase; - } - - .xl\:focus\:capitalize:focus { - text-transform: capitalize; - } - - .xl\:focus\:normal-case:focus { - text-transform: none; - } - - .xl\:focus\:underline:focus { - text-decoration: underline; - } - - .xl\:focus\:line-through:focus { - text-decoration: line-through; - } - - .xl\:focus\:no-underline:focus { - text-decoration: none; - } - - .xl\:focus\:antialiased:focus { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - - .xl\:focus\:subpixel-antialiased:focus { - -webkit-font-smoothing: auto; - -moz-osx-font-smoothing: auto; - } - - .xl\:tracking-tight { - letter-spacing: -0.05em; - } - - .xl\:tracking-normal { - letter-spacing: 0; - } - - .xl\:tracking-wide { - letter-spacing: .05em; - } - - .xl\:select-none { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } - - .xl\:select-text { - -webkit-user-select: text; - -moz-user-select: text; - -ms-user-select: text; - user-select: text; - } - - .xl\:align-baseline { - vertical-align: baseline; - } - - .xl\:align-top { - vertical-align: top; - } - - .xl\:align-middle { - vertical-align: middle; - } - - .xl\:align-bottom { - vertical-align: bottom; - } - - .xl\:align-text-top { - vertical-align: text-top; - } - - .xl\:align-text-bottom { - vertical-align: text-bottom; - } - - .xl\:visible { - visibility: visible; - } - - .xl\:invisible { - visibility: hidden; - } - - .xl\:whitespace-normal { - white-space: normal; - } - - .xl\:whitespace-no-wrap { - white-space: nowrap; - } - - .xl\:whitespace-pre { - white-space: pre; - } - - .xl\:whitespace-pre-line { - white-space: pre-line; - } - - .xl\:whitespace-pre-wrap { - white-space: pre-wrap; - } - - .xl\:break-words { - word-wrap: break-word; - } - - .xl\:break-normal { - word-wrap: normal; - } - - .xl\:truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - .xl\:w-1 { - width: .25rem; - } - - .xl\:w-2 { - width: .5rem; - } - - .xl\:w-3 { - width: .75rem; - } - - .xl\:w-4 { - width: 1rem; - } - - .xl\:w-5 { - width: 1.25rem; - } - - .xl\:w-6 { - width: 1.5rem; - } - - .xl\:w-8 { - width: 2rem; - } - - .xl\:w-10 { - width: 2.5rem; - } - - .xl\:w-12 { - width: 3rem; - } - - .xl\:w-16 { - width: 4rem; - } - - .xl\:w-24 { - width: 6rem; - } - - .xl\:w-32 { - width: 8rem; - } - - .xl\:w-48 { - width: 12rem; - } - - .xl\:w-64 { - width: 16rem; - } - - .xl\:w-auto { - width: auto; - } - - .xl\:w-px { - width: 1px; - } - - .xl\:w-1\/2 { - width: 50%; - } - - .xl\:w-1\/3 { - width: 33.33333%; - } - - .xl\:w-2\/3 { - width: 66.66667%; - } - - .xl\:w-1\/4 { - width: 25%; - } - - .xl\:w-3\/4 { - width: 75%; - } - - .xl\:w-1\/5 { - width: 20%; - } - - .xl\:w-2\/5 { - width: 40%; - } - - .xl\:w-3\/5 { - width: 60%; - } - - .xl\:w-4\/5 { - width: 80%; - } - - .xl\:w-1\/6 { - width: 16.66667%; - } - - .xl\:w-5\/6 { - width: 83.33333%; - } - - .xl\:w-full { - width: 100%; - } - - .xl\:w-screen { - width: 100vw; - } - - .xl\:z-0 { - z-index: 0; - } - - .xl\:z-10 { - z-index: 10; - } - - .xl\:z-20 { - z-index: 20; - } - - .xl\:z-30 { - z-index: 30; - } - - .xl\:z-40 { - z-index: 40; - } - - .xl\:z-50 { - z-index: 50; - } - - .xl\:z-auto { - z-index: auto; - } -} diff --git a/src/styles/index.css b/src/styles/index.css deleted file mode 100644 index 0594179..0000000 --- a/src/styles/index.css +++ /dev/null @@ -1,5 +0,0 @@ -@tailwind preflight; -@tailwind components; -@tailwind utilities; - -/* Your custom CSS here */ diff --git a/tailwind.config.js b/tailwind.config.js deleted file mode 100644 index d9c4e34..0000000 --- a/tailwind.config.js +++ /dev/null @@ -1,980 +0,0 @@ -/* - -Tailwind - The Utility-First CSS Framework - -A project by Adam Wathan (@adamwathan), Jonathan Reinink (@reinink), -David Hemphill (@davidhemphill) and Steve Schoger (@steveschoger). - -Welcome to the Tailwind config file. This is where you can customize -Tailwind specifically for your project. Don't be intimidated by the -length of this file. It's really just a big JavaScript object and -we've done our very best to explain each section. - -View the full documentation at https://tailwindcss.com. - - -|------------------------------------------------------------------------------- -| The default config -|------------------------------------------------------------------------------- -| -| This variable contains the default Tailwind config. You don't have -| to use it, but it can sometimes be helpful to have available. For -| example, you may choose to merge your custom configuration -| values with some of the Tailwind defaults. -| -*/ - -let defaultConfig = require('tailwindcss/defaultConfig')() - - -/* -|------------------------------------------------------------------------------- -| Colors https://tailwindcss.com/docs/colors -|------------------------------------------------------------------------------- -| -| Here you can specify the colors used in your project. To get you started, -| we've provided a generous palette of great looking colors that are perfect -| for prototyping, but don't hesitate to change them for your project. You -| own these colors, nothing will break if you change everything about them. -| -| We've used literal color names ("red", "blue", etc.) for the default -| palette, but if you'd rather use functional names like "primary" and -| "secondary", or even a numeric scale like "100" and "200", go for it. -| -*/ - -let colors = { - 'transparent': 'transparent', - - 'black': '#22292f', - 'grey-darkest': '#3d4852', - 'grey-darker': '#606f7b', - 'grey-dark': '#8795a1', - 'grey': '#b8c2cc', - 'grey-light': '#dae1e7', - 'grey-lighter': '#f1f5f8', - 'grey-lightest': '#f8fafc', - 'white': '#ffffff', - - 'red-darkest': '#3b0d0c', - 'red-darker': '#621b18', - 'red-dark': '#cc1f1a', - 'red': '#e3342f', - 'red-light': '#ef5753', - 'red-lighter': '#f9acaa', - 'red-lightest': '#fcebea', - - 'orange-darkest': '#462a16', - 'orange-darker': '#613b1f', - 'orange-dark': '#de751f', - 'orange': '#f6993f', - 'orange-light': '#faad63', - 'orange-lighter': '#fcd9b6', - 'orange-lightest': '#fff5eb', - - 'yellow-darkest': '#453411', - 'yellow-darker': '#684f1d', - 'yellow-dark': '#f2d024', - 'yellow': '#ffed4a', - 'yellow-light': '#fff382', - 'yellow-lighter': '#fff9c2', - 'yellow-lightest': '#fcfbeb', - - 'green-darkest': '#0f2f21', - 'green-darker': '#1a4731', - 'green-dark': '#1f9d55', - 'green': '#38c172', - 'green-light': '#51d88a', - 'green-lighter': '#a2f5bf', - 'green-lightest': '#e3fcec', - - 'teal-darkest': '#0d3331', - 'teal-darker': '#20504f', - 'teal-dark': '#38a89d', - 'teal': '#4dc0b5', - 'teal-light': '#64d5ca', - 'teal-lighter': '#a0f0ed', - 'teal-lightest': '#e8fffe', - - 'blue-darkest': '#12283a', - 'blue-darker': '#1c3d5a', - 'blue-dark': '#2779bd', - 'blue': '#3490dc', - 'blue-light': '#6cb2eb', - 'blue-lighter': '#bcdefa', - 'blue-lightest': '#eff8ff', - - 'indigo-darkest': '#191e38', - 'indigo-darker': '#2f365f', - 'indigo-dark': '#5661b3', - 'indigo': '#6574cd', - 'indigo-light': '#7886d7', - 'indigo-lighter': '#b2b7ff', - 'indigo-lightest': '#e6e8ff', - - 'purple-darkest': '#21183c', - 'purple-darker': '#382b5f', - 'purple-dark': '#794acf', - 'purple': '#9561e2', - 'purple-light': '#a779e9', - 'purple-lighter': '#d6bbfc', - 'purple-lightest': '#f3ebff', - - 'pink-darkest': '#451225', - 'pink-darker': '#6f213f', - 'pink-dark': '#eb5286', - 'pink': '#f66d9b', - 'pink-light': '#fa7ea8', - 'pink-lighter': '#ffbbca', - 'pink-lightest': '#ffebef', -} - -module.exports = { - - /* - |----------------------------------------------------------------------------- - | Colors https://tailwindcss.com/docs/colors - |----------------------------------------------------------------------------- - | - | The color palette defined above is also assigned to the "colors" key of - | your Tailwind config. This makes it easy to access them in your CSS - | using Tailwind's config helper. For example: - | - | .error { color: config('colors.red') } - | - */ - - colors: colors, - - - /* - |----------------------------------------------------------------------------- - | Screens https://tailwindcss.com/docs/responsive-design - |----------------------------------------------------------------------------- - | - | Screens in Tailwind are translated to CSS media queries. They define the - | responsive breakpoints for your project. By default Tailwind takes a - | "mobile first" approach, where each screen size represents a minimum - | viewport width. Feel free to have as few or as many screens as you - | want, naming them in whatever way you'd prefer for your project. - | - | Tailwind also allows for more complex screen definitions, which can be - | useful in certain situations. Be sure to see the full responsive - | documentation for a complete list of options. - | - | Class name: .{screen}:{utility} - | - */ - - screens: { - 'sm': '576px', - 'md': '768px', - 'lg': '992px', - 'xl': '1200px', - }, - - - /* - |----------------------------------------------------------------------------- - | Fonts https://tailwindcss.com/docs/fonts - |----------------------------------------------------------------------------- - | - | Here is where you define your project's font stack, or font families. - | Keep in mind that Tailwind doesn't actually load any fonts for you. - | If you're using custom fonts you'll need to import them prior to - | defining them here. - | - | By default we provide a native font stack that works remarkably well on - | any device or OS you're using, since it just uses the default fonts - | provided by the platform. - | - | Class name: .font-{name} - | CSS property: font-family - | - */ - - fonts: { - 'sans': [ - 'system-ui', - 'BlinkMacSystemFont', - '-apple-system', - 'Segoe UI', - 'Roboto', - 'Oxygen', - 'Ubuntu', - 'Cantarell', - 'Fira Sans', - 'Droid Sans', - 'Helvetica Neue', - 'sans-serif', - ], - 'serif': [ - 'Constantia', - 'Lucida Bright', - 'Lucidabright', - 'Lucida Serif', - 'Lucida', - 'DejaVu Serif', - 'Bitstream Vera Serif', - 'Liberation Serif', - 'Georgia', - 'serif', - ], - 'mono': [ - 'Menlo', - 'Monaco', - 'Consolas', - 'Liberation Mono', - 'Courier New', - 'monospace', - ], - }, - - - /* - |----------------------------------------------------------------------------- - | Text sizes https://tailwindcss.com/docs/text-sizing - |----------------------------------------------------------------------------- - | - | Here is where you define your text sizes. Name these in whatever way - | makes the most sense to you. We use size names by default, but - | you're welcome to use a numeric scale or even something else - | entirely. - | - | By default Tailwind uses the "rem" unit type for most measurements. - | This allows you to set a root font size which all other sizes are - | then based on. That said, you are free to use whatever units you - | prefer, be it rems, ems, pixels or other. - | - | Class name: .text-{size} - | CSS property: font-size - | - */ - - textSizes: { - 'xs': '.75rem', // 12px - 'sm': '.875rem', // 14px - 'base': '1rem', // 16px - 'lg': '1.125rem', // 18px - 'xl': '1.25rem', // 20px - '2xl': '1.5rem', // 24px - '3xl': '1.875rem', // 30px - '4xl': '2.25rem', // 36px - '5xl': '3rem', // 48px - }, - - - /* - |----------------------------------------------------------------------------- - | Font weights https://tailwindcss.com/docs/font-weight - |----------------------------------------------------------------------------- - | - | Here is where you define your font weights. We've provided a list of - | common font weight names with their respective numeric scale values - | to get you started. It's unlikely that your project will require - | all of these, so we recommend removing those you don't need. - | - | Class name: .font-{weight} - | CSS property: font-weight - | - */ - - fontWeights: { - 'hairline': 100, - 'thin': 200, - 'light': 300, - 'normal': 400, - 'medium': 500, - 'semibold': 600, - 'bold': 700, - 'extrabold': 800, - 'black': 900, - }, - - - /* - |----------------------------------------------------------------------------- - | Leading (line height) https://tailwindcss.com/docs/line-height - |----------------------------------------------------------------------------- - | - | Here is where you define your line height values, or as we call - | them in Tailwind, leadings. - | - | Class name: .leading-{size} - | CSS property: line-height - | - */ - - leading: { - 'none': 1, - 'tight': 1.25, - 'normal': 1.5, - 'loose': 2, - }, - - - /* - |----------------------------------------------------------------------------- - | Tracking (letter spacing) https://tailwindcss.com/docs/letter-spacing - |----------------------------------------------------------------------------- - | - | Here is where you define your letter spacing values, or as we call - | them in Tailwind, tracking. - | - | Class name: .tracking-{size} - | CSS property: letter-spacing - | - */ - - tracking: { - 'tight': '-0.05em', - 'normal': '0', - 'wide': '0.05em', - }, - - - /* - |----------------------------------------------------------------------------- - | Text colors https://tailwindcss.com/docs/text-color - |----------------------------------------------------------------------------- - | - | Here is where you define your text colors. By default these use the - | color palette we defined above, however you're welcome to set these - | independently if that makes sense for your project. - | - | Class name: .text-{color} - | CSS property: color - | - */ - - textColors: colors, - - - /* - |----------------------------------------------------------------------------- - | Background colors https://tailwindcss.com/docs/background-color - |----------------------------------------------------------------------------- - | - | Here is where you define your background colors. By default these use - | the color palette we defined above, however you're welcome to set - | these independently if that makes sense for your project. - | - | Class name: .bg-{color} - | CSS property: background-color - | - */ - - backgroundColors: colors, - - - /* - |----------------------------------------------------------------------------- - | Background sizes https://tailwindcss.com/docs/background-size - |----------------------------------------------------------------------------- - | - | Here is where you define your background sizes. We provide some common - | values that are useful in most projects, but feel free to add other sizes - | that are specific to your project here as well. - | - | Class name: .bg-{size} - | CSS property: background-size - | - */ - - backgroundSize: { - 'auto': 'auto', - 'cover': 'cover', - 'contain': 'contain', - }, - - - /* - |----------------------------------------------------------------------------- - | Border widths https://tailwindcss.com/docs/border-width - |----------------------------------------------------------------------------- - | - | Here is where you define your border widths. Take note that border - | widths require a special "default" value set as well. This is the - | width that will be used when you do not specify a border width. - | - | Class name: .border{-side?}{-width?} - | CSS property: border-width - | - */ - - borderWidths: { - default: '1px', - '0': '0', - '2': '2px', - '4': '4px', - '8': '8px', - }, - - - /* - |----------------------------------------------------------------------------- - | Border colors https://tailwindcss.com/docs/border-color - |----------------------------------------------------------------------------- - | - | Here is where you define your border colors. By default these use the - | color palette we defined above, however you're welcome to set these - | independently if that makes sense for your project. - | - | Take note that border colors require a special "default" value set - | as well. This is the color that will be used when you do not - | specify a border color. - | - | Class name: .border-{color} - | CSS property: border-color - | - */ - - borderColors: global.Object.assign({ default: colors['grey-light'] }, colors), - - - /* - |----------------------------------------------------------------------------- - | Border radius https://tailwindcss.com/docs/border-radius - |----------------------------------------------------------------------------- - | - | Here is where you define your border radius values. If a `default` radius - | is provided, it will be made available as the non-suffixed `.rounded` - | utility. - | - | If your scale includes a `0` value to reset already rounded corners, it's - | a good idea to put it first so other values are able to override it. - | - | Class name: .rounded{-side?}{-size?} - | CSS property: border-radius - | - */ - - borderRadius: { - 'none': '0', - 'sm': '.125rem', - default: '.25rem', - 'lg': '.5rem', - 'full': '9999px', - }, - - - /* - |----------------------------------------------------------------------------- - | Width https://tailwindcss.com/docs/width - |----------------------------------------------------------------------------- - | - | Here is where you define your width utility sizes. These can be - | percentage based, pixels, rems, or any other units. By default - | we provide a sensible rem based numeric scale, a percentage - | based fraction scale, plus some other common use-cases. You - | can, of course, modify these values as needed. - | - | - | It's also worth mentioning that Tailwind automatically escapes - | invalid CSS class name characters, which allows you to have - | awesome classes like .w-2/3. - | - | Class name: .w-{size} - | CSS property: width - | - */ - - width: { - 'auto': 'auto', - 'px': '1px', - '1': '0.25rem', - '2': '0.5rem', - '3': '0.75rem', - '4': '1rem', - '5': '1.25rem', - '6': '1.5rem', - '8': '2rem', - '10': '2.5rem', - '12': '3rem', - '16': '4rem', - '24': '6rem', - '32': '8rem', - '48': '12rem', - '64': '16rem', - '1/2': '50%', - '1/3': '33.33333%', - '2/3': '66.66667%', - '1/4': '25%', - '3/4': '75%', - '1/5': '20%', - '2/5': '40%', - '3/5': '60%', - '4/5': '80%', - '1/6': '16.66667%', - '5/6': '83.33333%', - 'full': '100%', - 'screen': '100vw', - }, - - - /* - |----------------------------------------------------------------------------- - | Height https://tailwindcss.com/docs/height - |----------------------------------------------------------------------------- - | - | Here is where you define your height utility sizes. These can be - | percentage based, pixels, rems, or any other units. By default - | we provide a sensible rem based numeric scale plus some other - | common use-cases. You can, of course, modify these values as - | needed. - | - | Class name: .h-{size} - | CSS property: height - | - */ - - height: { - 'auto': 'auto', - 'px': '1px', - '1': '0.25rem', - '2': '0.5rem', - '3': '0.75rem', - '4': '1rem', - '5': '1.25rem', - '6': '1.5rem', - '8': '2rem', - '10': '2.5rem', - '12': '3rem', - '16': '4rem', - '24': '6rem', - '32': '8rem', - '48': '12rem', - '64': '16rem', - 'full': '100%', - 'screen': '100vh', - }, - - - /* - |----------------------------------------------------------------------------- - | Minimum width https://tailwindcss.com/docs/min-width - |----------------------------------------------------------------------------- - | - | Here is where you define your minimum width utility sizes. These can - | be percentage based, pixels, rems, or any other units. We provide a - | couple common use-cases by default. You can, of course, modify - | these values as needed. - | - | Class name: .min-w-{size} - | CSS property: min-width - | - */ - - minWidth: { - '0': '0', - 'full': '100%', - }, - - - /* - |----------------------------------------------------------------------------- - | Minimum height https://tailwindcss.com/docs/min-height - |----------------------------------------------------------------------------- - | - | Here is where you define your minimum height utility sizes. These can - | be percentage based, pixels, rems, or any other units. We provide a - | few common use-cases by default. You can, of course, modify these - | values as needed. - | - | Class name: .min-h-{size} - | CSS property: min-height - | - */ - - minHeight: { - '0': '0', - 'full': '100%', - 'screen': '100vh', - }, - - - /* - |----------------------------------------------------------------------------- - | Maximum width https://tailwindcss.com/docs/max-width - |----------------------------------------------------------------------------- - | - | Here is where you define your maximum width utility sizes. These can - | be percentage based, pixels, rems, or any other units. By default - | we provide a sensible rem based scale and a "full width" size, - | which is basically a reset utility. You can, of course, - | modify these values as needed. - | - | Class name: .max-w-{size} - | CSS property: max-width - | - */ - - maxWidth: { - 'xs': '20rem', - 'sm': '30rem', - 'md': '40rem', - 'lg': '50rem', - 'xl': '60rem', - '2xl': '70rem', - '3xl': '80rem', - '4xl': '90rem', - '5xl': '100rem', - 'full': '100%', - }, - - - /* - |----------------------------------------------------------------------------- - | Maximum height https://tailwindcss.com/docs/max-height - |----------------------------------------------------------------------------- - | - | Here is where you define your maximum height utility sizes. These can - | be percentage based, pixels, rems, or any other units. We provide a - | couple common use-cases by default. You can, of course, modify - | these values as needed. - | - | Class name: .max-h-{size} - | CSS property: max-height - | - */ - - maxHeight: { - 'full': '100%', - 'screen': '100vh', - }, - - - /* - |----------------------------------------------------------------------------- - | Padding https://tailwindcss.com/docs/padding - |----------------------------------------------------------------------------- - | - | Here is where you define your padding utility sizes. These can be - | percentage based, pixels, rems, or any other units. By default we - | provide a sensible rem based numeric scale plus a couple other - | common use-cases like "1px". You can, of course, modify these - | values as needed. - | - | Class name: .p{side?}-{size} - | CSS property: padding - | - */ - - padding: { - 'px': '1px', - '0': '0', - '1': '0.25rem', - '2': '0.5rem', - '3': '0.75rem', - '4': '1rem', - '5': '1.25rem', - '6': '1.5rem', - '8': '2rem', - '10': '2.5rem', - '12': '3rem', - '16': '4rem', - '20': '5rem', - '24': '6rem', - '32': '8rem', - }, - - - /* - |----------------------------------------------------------------------------- - | Margin https://tailwindcss.com/docs/margin - |----------------------------------------------------------------------------- - | - | Here is where you define your margin utility sizes. These can be - | percentage based, pixels, rems, or any other units. By default we - | provide a sensible rem based numeric scale plus a couple other - | common use-cases like "1px". You can, of course, modify these - | values as needed. - | - | Class name: .m{side?}-{size} - | CSS property: margin - | - */ - - margin: { - 'auto': 'auto', - 'px': '1px', - '0': '0', - '1': '0.25rem', - '2': '0.5rem', - '3': '0.75rem', - '4': '1rem', - '5': '1.25rem', - '6': '1.5rem', - '8': '2rem', - '10': '2.5rem', - '12': '3rem', - '16': '4rem', - '20': '5rem', - '24': '6rem', - '32': '8rem', - }, - - - /* - |----------------------------------------------------------------------------- - | Negative margin https://tailwindcss.com/docs/negative-margin - |----------------------------------------------------------------------------- - | - | Here is where you define your negative margin utility sizes. These can - | be percentage based, pixels, rems, or any other units. By default we - | provide matching values to the padding scale since these utilities - | generally get used together. You can, of course, modify these - | values as needed. - | - | Class name: .-m{side?}-{size} - | CSS property: margin - | - */ - - negativeMargin: { - 'px': '1px', - '0': '0', - '1': '0.25rem', - '2': '0.5rem', - '3': '0.75rem', - '4': '1rem', - '5': '1.25rem', - '6': '1.5rem', - '8': '2rem', - '10': '2.5rem', - '12': '3rem', - '16': '4rem', - '20': '5rem', - '24': '6rem', - '32': '8rem', - }, - - - /* - |----------------------------------------------------------------------------- - | Shadows https://tailwindcss.com/docs/shadows - |----------------------------------------------------------------------------- - | - | Here is where you define your shadow utilities. As you can see from - | the defaults we provide, it's possible to apply multiple shadows - | per utility using comma separation. - | - | If a `default` shadow is provided, it will be made available as the non- - | suffixed `.shadow` utility. - | - | Class name: .shadow-{size?} - | CSS property: box-shadow - | - */ - - shadows: { - default: '0 2px 4px 0 rgba(0,0,0,0.10)', - 'md': '0 4px 8px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.08)', - 'lg': '0 15px 30px 0 rgba(0,0,0,0.11), 0 5px 15px 0 rgba(0,0,0,0.08)', - 'inner': 'inset 0 2px 4px 0 rgba(0,0,0,0.06)', - 'outline': '0 0 0 3px rgba(52,144,220,0.5)', - 'none': 'none', - }, - - - /* - |----------------------------------------------------------------------------- - | Z-index https://tailwindcss.com/docs/z-index - |----------------------------------------------------------------------------- - | - | Here is where you define your z-index utility values. By default we - | provide a sensible numeric scale. You can, of course, modify these - | values as needed. - | - | Class name: .z-{index} - | CSS property: z-index - | - */ - - zIndex: { - 'auto': 'auto', - '0': 0, - '10': 10, - '20': 20, - '30': 30, - '40': 40, - '50': 50, - }, - - - /* - |----------------------------------------------------------------------------- - | Opacity https://tailwindcss.com/docs/opacity - |----------------------------------------------------------------------------- - | - | Here is where you define your opacity utility values. By default we - | provide a sensible numeric scale. You can, of course, modify these - | values as needed. - | - | Class name: .opacity-{name} - | CSS property: opacity - | - */ - - opacity: { - '0': '0', - '25': '.25', - '50': '.5', - '75': '.75', - '100': '1', - }, - - - /* - |----------------------------------------------------------------------------- - | SVG fill https://tailwindcss.com/docs/svg - |----------------------------------------------------------------------------- - | - | Here is where you define your SVG fill colors. By default we just provide - | `fill-current` which sets the fill to the current text color. This lets you - | specify a fill color using existing text color utilities and helps keep the - | generated CSS file size down. - | - | Class name: .fill-{name} - | CSS property: fill - | - */ - - svgFill: { - 'current': 'currentColor', - }, - - - /* - |----------------------------------------------------------------------------- - | SVG stroke https://tailwindcss.com/docs/svg - |----------------------------------------------------------------------------- - | - | Here is where you define your SVG stroke colors. By default we just provide - | `stroke-current` which sets the stroke to the current text color. This lets - | you specify a stroke color using existing text color utilities and helps - | keep the generated CSS file size down. - | - | Class name: .stroke-{name} - | CSS property: stroke - | - */ - - svgStroke: { - 'current': 'currentColor', - }, - - - /* - |----------------------------------------------------------------------------- - | Modules https://tailwindcss.com/docs/configuration#modules - |----------------------------------------------------------------------------- - | - | Here is where you control which modules are generated and what variants are - | generated for each of those modules. - | - | Currently supported variants: - | - responsive - | - hover - | - focus - | - focus-within - | - active - | - group-hover - | - | To disable a module completely, use `false` instead of an array. - | - */ - - modules: { - appearance: ['responsive'], - backgroundAttachment: ['responsive'], - backgroundColors: ['responsive', 'hover', 'focus'], - backgroundPosition: ['responsive'], - backgroundRepeat: ['responsive'], - backgroundSize: ['responsive'], - borderCollapse: [], - borderColors: ['responsive', 'hover', 'focus'], - borderRadius: ['responsive'], - borderStyle: ['responsive'], - borderWidths: ['responsive'], - cursor: ['responsive'], - display: ['responsive'], - flexbox: ['responsive'], - float: ['responsive'], - fonts: ['responsive'], - fontWeights: ['responsive', 'hover', 'focus'], - height: ['responsive'], - leading: ['responsive'], - lists: ['responsive'], - margin: ['responsive'], - maxHeight: ['responsive'], - maxWidth: ['responsive'], - minHeight: ['responsive'], - minWidth: ['responsive'], - negativeMargin: ['responsive'], - objectFit: false, - objectPosition: false, - opacity: ['responsive'], - outline: ['focus'], - overflow: ['responsive'], - padding: ['responsive'], - pointerEvents: ['responsive'], - position: ['responsive'], - resize: ['responsive'], - shadows: ['responsive', 'hover', 'focus'], - svgFill: [], - svgStroke: [], - tableLayout: ['responsive'], - textAlign: ['responsive'], - textColors: ['responsive', 'hover', 'focus'], - textSizes: ['responsive'], - textStyle: ['responsive', 'hover', 'focus'], - tracking: ['responsive'], - userSelect: ['responsive'], - verticalAlign: ['responsive'], - visibility: ['responsive'], - whitespace: ['responsive'], - width: ['responsive'], - zIndex: ['responsive'], - }, - - - /* - |----------------------------------------------------------------------------- - | Plugins https://tailwindcss.com/docs/plugins - |----------------------------------------------------------------------------- - | - | Here is where you can register any plugins you'd like to use in your - | project. Tailwind's built-in `container` plugin is enabled by default to - | give you a Bootstrap-style responsive container component out of the box. - | - | Be sure to view the complete plugin documentation to learn more about how - | the plugin system works. - | - */ - - plugins: [ - require('tailwindcss/plugins/container')({ - // center: true, - // padding: '1rem', - }), - ], - - - /* - |----------------------------------------------------------------------------- - | Advanced Options https://tailwindcss.com/docs/configuration#options - |----------------------------------------------------------------------------- - | - | Here is where you can tweak advanced configuration options. We recommend - | leaving these options alone unless you absolutely need to change them. - | - */ - - options: { - prefix: '', - important: false, - separator: ':', - }, - -} From 24daa0b83fb6e36b44bcd76ad9fa52f2f78114b8 Mon Sep 17 00:00:00 2001 From: Justice Date: Wed, 24 Apr 2019 13:10:50 +0100 Subject: [PATCH 003/151] finished the Landing Page --- .babelrc | 26 ++ .eslintignore | 2 + .../LandingPage/components/LandingPage.css | 197 +++++++++++++++ .../LandingPage/components/LandingPage.js | 231 ++++++++++++++++++ .../components/LandingPage.test.js | 8 + .../components/LandingPageContent.js | 84 +++++++ components/LandingPage/components/index.js | 4 + components/LandingPage/index.js | 4 + components/Layout/components/Head.jsx | 32 +++ components/Layout/components/index.js | 4 + components/Layout/index.js | 4 + empty.js | 1 + jest.config.js | 25 ++ jest.setup.js | 4 + package.json | 7 + pages/index.js | 3 + static/community.svg | 1 + static/connected.svg | 1 + static/favicon.ico | Bin 0 -> 1150 bytes static/hangout.svg | 1 + static/logo-light.png | Bin 0 -> 2784 bytes static/logo.png | Bin 0 -> 2790 bytes static/smile.svg | 1 + 23 files changed, 640 insertions(+) create mode 100644 .babelrc create mode 100644 components/LandingPage/components/LandingPage.css create mode 100644 components/LandingPage/components/LandingPage.js create mode 100644 components/LandingPage/components/LandingPage.test.js create mode 100644 components/LandingPage/components/LandingPageContent.js create mode 100644 components/LandingPage/components/index.js create mode 100644 components/LandingPage/index.js create mode 100644 components/Layout/components/Head.jsx create mode 100644 components/Layout/components/index.js create mode 100644 components/Layout/index.js create mode 100644 empty.js create mode 100644 jest.config.js create mode 100644 jest.setup.js create mode 100644 static/community.svg create mode 100644 static/connected.svg create mode 100644 static/favicon.ico create mode 100644 static/hangout.svg create mode 100644 static/logo-light.png create mode 100644 static/logo.png create mode 100644 static/smile.svg diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..f45f640 --- /dev/null +++ b/.babelrc @@ -0,0 +1,26 @@ +{ + "env": { + "development": { + "presets": [ + "next/babel" + ] + }, + "production": { + "presets": [ + "next/babel" + ] + }, + "test": { + "presets": [ + [ + "next/babel", + { + "preset-env": { + "modules": "commonjs" + } + } + ] + ] + } + } +} diff --git a/.eslintignore b/.eslintignore index 5be912f..f1d08f7 100644 --- a/.eslintignore +++ b/.eslintignore @@ -8,5 +8,7 @@ /tests/fixtures/** /tests/performance/** /tmp/** +next.config.js + # Add any other files or folders that you want eslint to ignore diff --git a/components/LandingPage/components/LandingPage.css b/components/LandingPage/components/LandingPage.css new file mode 100644 index 0000000..0288b02 --- /dev/null +++ b/components/LandingPage/components/LandingPage.css @@ -0,0 +1,197 @@ +.LandingPage_layout { + overflow: auto; +} + +.layout_header-mobile { + display: flex; + justify-content: space-between; + background-color: #ffffff; + border-bottom: 0.4px solid #e8e8e8; + position: fixed; + width: 100%; + z-index: 1; + align-items: center; +} + +.layout_header-desktop { + display: none; +} + +.LandingPage_footer { + background: #001529; + color: #ffffff; + text-align: center; +} + +.LandingPage_footer > img { + width: 50%; + height: 50%; + margin-bottom: 1em; +} + +.LandingPage_footer > ul { + list-style-type: none; + padding: 0; +} + +.logo { + width: 120px; + height: 30px; +} +.layout_sider { + position: fixed; + height: calc(100vh - 64px); + z-index: 1; + margin-top: 64px; +} + +.ant-layout { + background: #ffffff; +} + +.ant-layout-sider-zero-width-trigger { + top: 12px; + position: fixed; + background-color: #1890ff; + left: 0; +} + +.ant-layout-sider-zero-width-trigger:hover { + background-color: #1890ff; +} + +.ant-divider-horizontal { + height: 0.1px; + margin: 0.4px 0; +} + +a { + color: #ffffff; +} +.LandingPage_content { + height: 100%; + margin-top: 64px; +} + +.LandingPage_hero { + padding: 24px; + background: #ffffff; + display: flex; + flex-direction: column; + justify-content: center; +} + +.LandingPage_hero > img { + width: 100%; + margin: 2em 0; +} +.LandingPage_content__text { + text-align: center; +} + +.LandingPage_button { + margin-bottom: 2em; +} + +.column-section > img { + width: 50%; + margin: 0 auto; +} + +@media screen and (min-width: 425px) and (max-width: 767px) { + .LandingPage_hero > img { + width: 65%; + margin: 2em auto; + } + + .column-section > img { + width: 30%; + margin-top: 0; + } +} + +@media screen and (min-width: 768px) { + .LandingPage_layout { + overflow: auto; + } + + .LandingPage_hero { + flex-direction: row; + align-items: center; + } + .LandingPage_content__text { + margin: 2em; + } + .LandingPage_hero > img { + width: 40%; + } + + .LandingPage_body > section { + padding: 0 6em; + } + + .reverse { + flex-direction: row-reverse; + } + + .column-section { + flex-direction: column; + } + + .column-section > div { + margin-bottom: 0; + } + + .column-section > img { + width: 20%; + margin-top: 0; + } + + .layout_sider { + display: none; + } + + .LandingPage_footer { + text-align: left; + display: flex; + justify-content: space-evenly; + padding: 5em 50px; + } + + .LandingPage_content { + height: 100%; + margin-top: 0; + } + + .LandingPage_footer > img { + width: 120px; + height: 30px; + margin-bottom: 0; + } + + .layout_header-mobile { + display: none; + } + .layout_header-desktop { + background-color: #ffffff; + display: flex; + justify-content: space-between; + align-items: center; + border-bottom: 1px solid #e8e8e8; + padding: 0 6em; + } + + .layout_header-list { + line-height: 63px; + } +} + +@media screen and (min-width: 1024px) { + .LandingPage_body > section { + padding: 0 12em; + } + + .layout_header-desktop { + padding: 0 12em; + } +} diff --git a/components/LandingPage/components/LandingPage.js b/components/LandingPage/components/LandingPage.js new file mode 100644 index 0000000..0f35093 --- /dev/null +++ b/components/LandingPage/components/LandingPage.js @@ -0,0 +1,231 @@ +import React from 'react'; +import 'antd/dist/antd.css'; +import { Layout, Menu, Icon, Button, Divider, Typography } from 'antd'; +import Link from 'next/link'; +import { Head } from '../../Layout'; +import './LandingPage.css'; +import LandingPageContent from './LandingPageContent'; + +const { Header, Content, Sider, Footer } = Layout; +const { Title, Paragraph } = Typography; + +/** + * Function for displaying the landing landing page + * + * @function + * @return {Object} The landing page + */ + +const LandingPage = () => ( + <> + + +
+ + + helpme logo + + + + +
+ +
+ + + helpme logo + + + + {/* navbar */} + + + + nav 1 + + + + + + nav 2 + + + + + + nav 3 + + + + + +
+ + + + { + // console.log(broken); + // }} + // onCollapse={(collapsed, type) => { + // console.log(collapsed, type); + // }} + > +
+ + + + + + nav 1 + + + + + + + + + nav 2 + + + + + + + + + nav 3 + + + + + + + + + nav 4 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); + +export default LandingPage; diff --git a/components/LandingPage/components/LandingPage.test.js b/components/LandingPage/components/LandingPage.test.js new file mode 100644 index 0000000..8efc9d1 --- /dev/null +++ b/components/LandingPage/components/LandingPage.test.js @@ -0,0 +1,8 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import LandingPage from './LandingPage'; + +it('renders without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); +}); diff --git a/components/LandingPage/components/LandingPageContent.js b/components/LandingPage/components/LandingPageContent.js new file mode 100644 index 0000000..c4c7cf2 --- /dev/null +++ b/components/LandingPage/components/LandingPageContent.js @@ -0,0 +1,84 @@ +import React from 'react'; +import { Button, Typography } from 'antd'; +import PropTypes from 'prop-types'; +import { normalize } from 'path'; +import Link from 'next/link'; + +const { Title, Paragraph } = Typography; + +/** + * Function used to generate section layout content for landing page + * + * @function + * @param {Number} level - The Number from 1-5 representing the header level h1-h5 + * @param {String} title- The Title of that Section + *@param {String} paragraphText- The Text of that section + * @param {Boolean} buttonIsPresent- If true, a button is shown on that section + * @param {String} buttonText- the text on the button + * @param {String} buttonLink- the link that the button leads to + * @param {String} imageLink- the link to an image in the section + * @param {Boolean} reverseSection - if true, the image and section position is swapped + * @param {Boolean} imageIsPresent - if true, the image is shown + * @param {Boolean} columnSection - if true, the section will be stacked + * @return {Object} The landing page content component which is used to populate the landing page + */ + +export default function LandingPageContent(props) { + const { + level, + title, + paragraphText, + buttonIsPresent, + buttonText, + buttonLink, + imageLink, + imageIsPresent, + reverseSection, + columnSection, + } = props; + + let className; + + // this helps to structure the section, the section can be normalize, reversed or columnized + if (!reverseSection && !columnSection) { + className = 'LandingPage_hero'; + } else if (reverseSection && !columnSection) { + className = 'LandingPage_hero reverse'; + } else if (columnSection) { + className = 'LandingPage_hero column-section'; + } + + return ( +
+
+ {title} + {paragraphText} + + {/* displays button in a section */} + {buttonIsPresent ? ( + + ) : null} +
+ + {/* displays image in a section */} + {imageIsPresent ? {`${title} : null} +
+ ); +} + +LandingPageContent.propTypes = { + level: PropTypes.number, + title: PropTypes.string, + paragraphText: PropTypes.string, + buttonIsPresent: PropTypes.bool, + buttonText: PropTypes.string, + buttonLink: PropTypes.string, + imageIsPresent: PropTypes.bool, + imageLink: PropTypes.string, + reverseSection: PropTypes.bool, + columnSection: PropTypes.bool, +}; diff --git a/components/LandingPage/components/index.js b/components/LandingPage/components/index.js new file mode 100644 index 0000000..b5dfa66 --- /dev/null +++ b/components/LandingPage/components/index.js @@ -0,0 +1,4 @@ +import React from 'react'; +import LandingPage from './LandingPage'; + +export default LandingPage; diff --git a/components/LandingPage/index.js b/components/LandingPage/index.js new file mode 100644 index 0000000..711de6a --- /dev/null +++ b/components/LandingPage/index.js @@ -0,0 +1,4 @@ +import React from 'react'; +import LandingPage from './components/index.js'; + +export default LandingPage; diff --git a/components/Layout/components/Head.jsx b/components/Layout/components/Head.jsx new file mode 100644 index 0000000..2197edd --- /dev/null +++ b/components/Layout/components/Head.jsx @@ -0,0 +1,32 @@ +import React from 'react'; +import Head from 'next/head'; +import PropTypes from 'prop-types'; + +/** + * Head function that is infused into all pages and controls page's title + * + * @function + * @param {String} title - The title of the currently viewed page + * @return {Object} head metadata which is inserted in every page + * + */ + +export default function Layout(props) { + const { title } = props; + + return ( + + + + + + + + {!title ? 'Helpme | Connect with Friends' : title} + + ); +} + +Head.propTypes = { + title: PropTypes.string, +}; diff --git a/components/Layout/components/index.js b/components/Layout/components/index.js new file mode 100644 index 0000000..dcdee6b --- /dev/null +++ b/components/Layout/components/index.js @@ -0,0 +1,4 @@ +import React from 'react'; +import Head from './Head'; + +export { Head }; diff --git a/components/Layout/index.js b/components/Layout/index.js new file mode 100644 index 0000000..f5638cf --- /dev/null +++ b/components/Layout/index.js @@ -0,0 +1,4 @@ +import React from 'react'; +import { Head } from './components/index'; + +export { Head }; diff --git a/empty.js b/empty.js new file mode 100644 index 0000000..7697c1c --- /dev/null +++ b/empty.js @@ -0,0 +1 @@ +//used to map css files so that jest test can ingnore css; diff --git a/jest.config.js b/jest.config.js new file mode 100644 index 0000000..95ae4e9 --- /dev/null +++ b/jest.config.js @@ -0,0 +1,25 @@ +const TEST_REGEX = '(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|js?|tsx?|ts?)$'; + +module.exports = { + setupFiles: ['/jest.setup.js'], + globals: { + jest: { + useBabelrc: true, + }, + }, + testRegex: TEST_REGEX, + transform: { + '^.+\\.jsx?$': 'babel-jest', + }, + testPathIgnorePatterns: ['/.next/', '/node_modules/'], + moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'], + collectCoverage: true, + moduleNameMapper: { + '\\.(css|jpg|png|scss|less|sass)$': '/empty.js', + }, +}; + +// module.exports = { +// setupFiles: ['/jest.setup.js'], +// testPathIgnorePatterns: ['/.next/', '/node_modules/'], +// }; diff --git a/jest.setup.js b/jest.setup.js new file mode 100644 index 0000000..135148a --- /dev/null +++ b/jest.setup.js @@ -0,0 +1,4 @@ +const Enzyme = require('enzyme'); +const Adapter = require('enzyme-adapter-react-16'); + +Enzyme.configure({ adapter: new Adapter() }); diff --git a/package.json b/package.json index 66fc680..4d488ad 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "description": "An App That connects depressed people to each other for comfort", "main": "index.js", "scripts": { + "test": "jest", "lint": "eslint pages", "dev": "next", "build": "next build", @@ -23,6 +24,7 @@ "babel-eslint": "^10.0.1", "chai": "^4.2.0", "enzyme": "^3.9.0", + "enzyme-adapter-react-16": "^1.12.1", "eslint": "^5.8.0", "eslint-config-airbnb": "^17.1.0", "eslint-config-standard": "^12.0.0", @@ -37,13 +39,18 @@ "sinon": "^7.3.1" }, "dependencies": { + "@babel/core": "^7.4.3", "@zeit/next-css": "^1.0.1", "antd": "^3.16.3", + "babel-jest": "^24.7.1", "dotenv": "^7.0.0", "express": "^4.16.4", "next": "^8.0.4", + "prop-types": "^15.7.2", "react": "^16.8.6", + "react-addons-test-utils": "^15.6.2", "react-dom": "^16.8.6", + "react-test-renderer": "^16.8.6", "redux": "^4.0.1", "redux-saga": "^1.0.2" } diff --git a/pages/index.js b/pages/index.js index e69de29..d7c5b25 100644 --- a/pages/index.js +++ b/pages/index.js @@ -0,0 +1,3 @@ +import LandingPage from '../components/LandingPage/index'; + +export default LandingPage; diff --git a/static/community.svg b/static/community.svg new file mode 100644 index 0000000..6835f53 --- /dev/null +++ b/static/community.svg @@ -0,0 +1 @@ +community \ No newline at end of file diff --git a/static/connected.svg b/static/connected.svg new file mode 100644 index 0000000..79b1740 --- /dev/null +++ b/static/connected.svg @@ -0,0 +1 @@ +connected \ No newline at end of file diff --git a/static/favicon.ico b/static/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..974a52a6eab147defe64ce73e3a88bfe41d50d82 GIT binary patch literal 1150 zcmd6k&ubGw7>3`7TCGKwS`+nPix_MM$?p7~}sQiz}9i2H!1)=ObY z`++HD8uNrit#?a<`tyH!%T9&`8*_=sFdWKW>Qj!nzg^ixM7cz`2j?7|ffaZU=cyf@ zzZ?l=CnFuV$uSRItWCpf)*m5n!8N!Fc^HL`e&ft_e}wT)`#g7XyB@~-^z6!x5Z(~) zaIlkKnRNv{70*2mUCW;PM~|AHQq4~e7(X>=3Q3tCnP3f$^#{o}WpB)Zpw=4T2~NXH z_S#_gYh6u0O1`Mfj%|ikDafWDC7;)d$!-X0c0Kgt-+;Xp`j?)@gF5FH>o?)LWNfW4 zy{@)!FR0i1dv2Vp!h?@b&g!!_8q{rX&U=*n37P7`&5-e@gSz$0p1Y6q;5tOhyvOq6 zahVS@GR4$ZybCZ76Q+2d{o49J8qt@Tn97-P;SRxDm@B1EIA$?@0Ou9h_ugd|Q~H&^ z8}x1;eDY3dDKlaJi#;%0O2@kKcjKPq8#u;KYt6sYuKe?{F_NWvOj_M0eT8pOSb^_N R@+7>wEiF-7?Qb~N`wawk5_JFo literal 0 HcmV?d00001 diff --git a/static/hangout.svg b/static/hangout.svg new file mode 100644 index 0000000..ecec6ed --- /dev/null +++ b/static/hangout.svg @@ -0,0 +1 @@ +hang out \ No newline at end of file diff --git a/static/logo-light.png b/static/logo-light.png new file mode 100644 index 0000000000000000000000000000000000000000..3286fe0142158e6fb0627861296f44cb76fcb5ba GIT binary patch literal 2784 zcmZ`)2{@E%8y-t2BU{T@e@lx)F@s|ihinO@IW>||GL})!gzU$XkTnzv6)9P=M~P!E zV;h;V%%9yH+hj?`K4uu_b)4Vj@B07u`sV%a`+1)Ce(vX;Yp#hxnHvl26W<4cKm<(A z8D0YK2Jk`fae*DhnvDi8ZYRA9dJss-L;iK_9>6&~E*a}Xib#@E5C|6pbslYW{?;A# zuC=+jxr_Y+w}S%%1AqfOJw3e*b}DCQSw)o%chsys+JK8#cK5c#th<{(&YBbH*QtKji z0gc^9XtY^S+|k<6LG0L$ceZuz)R0@rAP7W2aQCSn@NQ#c%gjzl~}=bJy518yE)9c5zo*7cdV_P0XzU41$1y*})BvT1X&BCXy!? zSl|W#1}3*{gB`R6n%hsAh?B_JJ#3Nm)6$7fZO)4Svqy#hq2*#$^0_p zhN+k0zV|_oDZ0*F>zu?q4)&gnI(}a6#g!A879x(W()XFh51HpvU<|%HOBlHNK6A8z)&>r1; zF5ml3AAWY6UHOKpH%gYCR4J+z4?Z_15%FhQSN@<|=t#UNY~ z`#Ax#m}fBSZz(Cm{&O{}!-;)W>mRCpnulzjLX$^ujE%+G)q%h&R^Jdc$%n7Zx~l9s z(t3@+|JxthrOr!>9Ovi@l}dPx0W~z$wG1<7U8Ymdw^H}pYj2eeujD8F7mz$6pT3ts zM;iAoIW^fsM|nTgTRfsto3s#tJbBnD(n9QOkIBg^q&TS< z`RPNJdDmeHM06M2{vAhH)_Q++^{99f(>{CZrD?*;koRiTnese8A*bcekYCeqT1l81 zTiPl6#);7{h1T|TQ#VF_lwJ6_hix1Ng6;(gtCA6rK z*Cv|V+s$iq!m0M@M|a_xs)gibLqw4wJ?Ia)|Bm~vd@w33!T`5^U2%V**3cew4UXHz)?HpjwmW7% zbx%-gZV1!G`?l=~!zCCQdcy!6q-X~}HtozShvq6(TFiE|AM7|s@xm0edq(lf@pmif zEeEgI9$fV1c`9ktbW(TUcuRGFav46soa257pV0Kd4g)J?fq;WBm*vlJVc4)J;$~SL z>N?-)*t~Rv&cDd2Q3bukt*A zMlUk_mK=|^$WI5m`=}CjSOi%}u+oHJ+X)v4jP~yrlj|k${{G->yroE|6yahuJ*Ff&k;q|qMmwi%CQi10 z*vvarYqI-=*jcWIo5BVhJ$f%gBU3`}cxI-KVcwj+R4?OWU+y^>82b59L+VEv0}L@2 z6DEWgv zk#EqtGJ`0~3B=$cWfzqwou${rGM>npj_b)n1uGmU_mErT!Z6n~2HRJArI)n#7xU|5 zTIeF$7yYzir(z+ z~wZzVPA2mZ^eS||(g9|ppTC_rO z%6zQc(g1YA4Kd=G&z3I74r!k!(77%iXSsz5Lf;J5;y>QP$>tMXq0Xh(7K){?N^if1 zM9Nmi-xkagk{AoXUgbW1+ymip7TUxg5pC_M?nl?e>JPq4jt+D>)97|rLq*={dDiR4 z|0b+eqlKm@RW>k`sMYnhmP*xu49Np&h4K!>7so5c1mtskErXm)RP~7h2?ru7&AK3^ z?&lJ?r5r-!kA2U-pvyrgRlDre05xDvRQGUnv;|}HvS^5z?IHe9 z0)L?mLzR8~we*X-Y=evt<(RxLDw>25@v*re3&rvzSpEjeC7S5+W~je#wzsbQZcji> Tiop@^PYf|JGB+&Jw+;CVtAUoi literal 0 HcmV?d00001 diff --git a/static/logo.png b/static/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..a0f6e592405984e315ce8d6f197a034e6437b143 GIT binary patch literal 2790 zcmXw42|QHm8y-utZ`qTqS<4_3MTIoX*cxHq)zzWL7kz2|wK=Xu|A&TmrPT#yo?DxxqLOv2IO1O{B& z!Ouik0PJp?3u)jY7-ZvY1B2D2i*4a|fHU7E4AK_%s897X3?=|`bMmlv3W-8fhMcJ^ zC(4jR&ZrZW?R0m}iOND}v(X^VW}4}V*@;jF!U<`RA|aDKmxo=-XP$C7QjG_K!u)^L5K&6 z*^yaXo{e8_S-8e22t#EPnHf%cs;21!hgBCZHZ0st9e zmd6!VZ~+zIVL4<#KGPUnVmAi`b;kyHuoHMYFzEtG521i7Dhmjq$xs!@Kuz%+I`IrE z@FY~ukU^f*!-0<2LY_2@Fu>v29tKG{Y@r;k7?jIn3wQYy$l+)xK$SD}t3lusJU&u4 zC+#%{Xn_DlnF1sUy-?#$)FGhglm(=r$)t62?eBkbC67X*BZE2c9CmX+Bcv{#0bC&< zAu^y&Z})OZog6|J2MmGOwGF00>fQqLQNhu`yCm!+?hZbc=%3ilGlrieD1*mBD>%Eiw<6&Jo~?lbKlntRNUm>eJtN%P;j>e7L+~&QIkn1Pzhb_| zG*d5>KGgm7{B7cW6EQck=2|3uBEo^6B2n<(!F;mBgHOTKo2k&86OFv8(xak6a2mUN(|f4c6!U zgz5XT2bP{+S~D@$E;A1?=~VWZia_KqU5TyCk?COLLihYr^XgpavGGM`;j2V({BgnU zrtPCbQ8N)sHWo;}(bwU4H_XTCXCzG3no7#sXrdOw^N_>tpPSfot8G)yihoY03P`p2 z+jAEsy%`+Kqu1736As3f>M0TG4z$Rx;C;-yzSxD=l+3 z3d{AGvkOn%{E}0fb@W@PX>#pcSzNM3eofsfHY}q8Z`^nh8)tZ07F)W{&X|*_9`ys& ziHm=16G}hZ$}&rNaHVCk1d$|Vce_BNFFxI@_i=ylw6Z`QBGl}INlIx!z_B$0`*l_G zz?5aZ<|9&xwX0hTgjVj#!O&6hc54Iq`DA<~-sQr*LEK!G zRgSxRPNUUuqDIq;-+VIvO0_HhTDjr-WH@P#X3V;^fx;Nr4#i%wQ}~%e?jU00O&iM_ ztG@@2)Q%TuOuVW#``Ou~v%W~s_e(MRI?PlJw!RU@GL=H3=t1udabMT3(23#_T1}sg z8V_4ETg!`Wo#Lod5k|h{nq|8aECaHOV(}-##^>|ilWRWZx5}Ez`HhF1+fn{BSGT5F zZMLt+N2rbdmso@U^6KjD9V^!|5#hn|iF=XiC)a;wT37U_&bzaZ$Wru;M1O-@-eJR~ zm*e*vcB5}B=^Q~U3+auHnYWj|AKII$bWt?c&%O{pB=OyfjnZj5sr@ll@oi`owz&KCX$hI6 z(^siqoCb8uSCS%@W7U$PVxQdR!#-G%RrR{^y#XG*_F%;h^FGMn)^!7IO@)(7@Jc2e zHtTy!=*Kc~8bFa|XN0mOqomhu6^!A^YkV?xQ}Bnyu2DtV8imf+GH$gQnWo%!lMafl z{%Ui?;&Sq4(;6IZW#IP@^N(z|IpHG=L~xV*>`_gjSI(x#k={zp-ldl*o*36135$m@ zmhY6RTLR1-=9lvD2jN5olaiX>`PnD$OY zizzp^KW+=G;=5S2AdYK6DruLBcZ^+#ek`){=El=hGqr?xI#T@GvQrdez+?z9UpP;j z=KE6;qth#E(xH6wdEh50a`vN;oeyTm&8lvED&vy)GAnIc9&}~*y2&JAu2*sIc3Img zB^$374J9~tSD4D-^24J8tj}ur<@T(0AGPWb5NiH1?-pv^B#Awh{W4NXu64oT3@OG& zQ)o7jZe4OcVr@D3>Y{9pOHl2Sm*63Ljf$uB_ zjJjyHw(O!*mbS=Y2Putxi>mdp5~<%c1X0NWvax}O4iag z*#R@=<)|WB->MyRJTXnX#!;}P>?GM1vF2gYPUah6F%Zj}GpVi-elrult9#Qvc%7}E zzpG!CA0wb+ruCG@9q^nR8#m5GM5Zu<_Z*v{j20wzxi!!oBv5s668H2!wGtKG@4a3O z5>DRQKxEVqr81@p5i-Sb??Ps*^OI*^knSY;Mc)@vEd7mAy7f0b>n4Xa9#0L)&ZK#G z>?L>gAENRHs6NSzs*RP{dLKHGcmGsVwQqRfQ$|-+zeK~*oR-L@exlXHK(1kZGh1L6 zB1>V(ek|bJ(>I5f|L8@NHs!NxEW{(iGw0X?MtyJ*XR^Ssmiley face \ No newline at end of file From e6f1ab55105b488882a239abd7399e2a05fe6d4e Mon Sep 17 00:00:00 2001 From: Justice Date: Wed, 24 Apr 2019 13:23:24 +0100 Subject: [PATCH 004/151] added next.config.js to .eslintignore --- jest.config.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/jest.config.js b/jest.config.js index 95ae4e9..98dae70 100644 --- a/jest.config.js +++ b/jest.config.js @@ -19,7 +19,4 @@ module.exports = { }, }; -// module.exports = { -// setupFiles: ['/jest.setup.js'], -// testPathIgnorePatterns: ['/.next/', '/node_modules/'], -// }; + From a1abd998a10d9eaa516470ccccb24190240228e2 Mon Sep 17 00:00:00 2001 From: Justice Date: Wed, 24 Apr 2019 16:19:14 +0100 Subject: [PATCH 005/151] fixed linting errors for the front page --- .../LandingPage/components/LandingPage.js | 231 ------------------ .../LandingPage/components/LandingPage.jsx | 228 +++++++++++++++++ ...ndingPage.test.js => LandingPage.test.jsx} | 0 ...gPageContent.js => LandingPageContent.jsx} | 4 +- components/LandingPage/components/index.js | 1 - components/LandingPage/index.js | 3 +- components/Layout/components/index.js | 3 +- components/Layout/index.js | 5 +- package.json | 3 +- 9 files changed, 236 insertions(+), 242 deletions(-) delete mode 100644 components/LandingPage/components/LandingPage.js create mode 100644 components/LandingPage/components/LandingPage.jsx rename components/LandingPage/components/{LandingPage.test.js => LandingPage.test.jsx} (100%) rename components/LandingPage/components/{LandingPageContent.js => LandingPageContent.jsx} (96%) diff --git a/components/LandingPage/components/LandingPage.js b/components/LandingPage/components/LandingPage.js deleted file mode 100644 index 0f35093..0000000 --- a/components/LandingPage/components/LandingPage.js +++ /dev/null @@ -1,231 +0,0 @@ -import React from 'react'; -import 'antd/dist/antd.css'; -import { Layout, Menu, Icon, Button, Divider, Typography } from 'antd'; -import Link from 'next/link'; -import { Head } from '../../Layout'; -import './LandingPage.css'; -import LandingPageContent from './LandingPageContent'; - -const { Header, Content, Sider, Footer } = Layout; -const { Title, Paragraph } = Typography; - -/** - * Function for displaying the landing landing page - * - * @function - * @return {Object} The landing page - */ - -const LandingPage = () => ( - <> - - -
- - - helpme logo - - - - -
- -
- - - helpme logo - - - - {/* navbar */} - - - - nav 1 - - - - - - nav 2 - - - - - - nav 3 - - - - - -
- - - - { - // console.log(broken); - // }} - // onCollapse={(collapsed, type) => { - // console.log(collapsed, type); - // }} - > -
- - - - - - nav 1 - - - - - - - - - nav 2 - - - - - - - - - nav 3 - - - - - - - - - nav 4 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -); - -export default LandingPage; diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx new file mode 100644 index 0000000..adea213 --- /dev/null +++ b/components/LandingPage/components/LandingPage.jsx @@ -0,0 +1,228 @@ +import React from 'react'; +import 'antd/dist/antd.css'; +import { + Layout, Menu, Icon, Button, Divider, Typography +} from 'antd'; +import Link from 'next/link'; +import { Head } from '../../Layout'; +import './LandingPage.css'; +import LandingPageContent from './LandingPageContent'; + +const { + Header, Content, Sider, Footer, +} = Layout; + +/** + * Function for displaying the landing landing page + * + * @function + * @return {Object} The landing page + */ + +const LandingPage = () => ( + <> + + +
+ + + helpme logo + + + + +
+ +
+ + + helpme logo + + + + {/* navbar */} + + + + nav 1 + + + + + + nav 2 + + + + + + nav 3 + + + + + +
+ + + + +
+ + + + + + nav 1 + + + + + + + + + nav 2 + + + + + + + + + nav 3 + + + + + + + + + nav 4 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); + +export default LandingPage; diff --git a/components/LandingPage/components/LandingPage.test.js b/components/LandingPage/components/LandingPage.test.jsx similarity index 100% rename from components/LandingPage/components/LandingPage.test.js rename to components/LandingPage/components/LandingPage.test.jsx diff --git a/components/LandingPage/components/LandingPageContent.js b/components/LandingPage/components/LandingPageContent.jsx similarity index 96% rename from components/LandingPage/components/LandingPageContent.js rename to components/LandingPage/components/LandingPageContent.jsx index c4c7cf2..98eb3a1 100644 --- a/components/LandingPage/components/LandingPageContent.js +++ b/components/LandingPage/components/LandingPageContent.jsx @@ -51,13 +51,13 @@ export default function LandingPageContent(props) { return (
- {title} + {title} {paragraphText} {/* displays button in a section */} {buttonIsPresent ? ( diff --git a/components/LandingPage/components/index.js b/components/LandingPage/components/index.js index b5dfa66..6bfc46c 100644 --- a/components/LandingPage/components/index.js +++ b/components/LandingPage/components/index.js @@ -1,4 +1,3 @@ -import React from 'react'; import LandingPage from './LandingPage'; export default LandingPage; diff --git a/components/LandingPage/index.js b/components/LandingPage/index.js index 711de6a..e5e516f 100644 --- a/components/LandingPage/index.js +++ b/components/LandingPage/index.js @@ -1,4 +1,3 @@ -import React from 'react'; -import LandingPage from './components/index.js'; +import LandingPage from './components/index'; export default LandingPage; diff --git a/components/Layout/components/index.js b/components/Layout/components/index.js index dcdee6b..7d60ee8 100644 --- a/components/Layout/components/index.js +++ b/components/Layout/components/index.js @@ -1,4 +1,3 @@ -import React from 'react'; import Head from './Head'; -export { Head }; +export default Head; diff --git a/components/Layout/index.js b/components/Layout/index.js index f5638cf..e25c530 100644 --- a/components/Layout/index.js +++ b/components/Layout/index.js @@ -1,4 +1,3 @@ -import React from 'react'; -import { Head } from './components/index'; +import Head from './components/index'; -export { Head }; +export default Head; diff --git a/package.json b/package.json index 4d488ad..1e46783 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "main": "index.js", "scripts": { "test": "jest", - "lint": "eslint pages", + "lint": "eslint pages components --fix", "dev": "next", "build": "next build", "start": "next start" @@ -42,6 +42,7 @@ "@babel/core": "^7.4.3", "@zeit/next-css": "^1.0.1", "antd": "^3.16.3", + "auth0-js": "^9.10.2", "babel-jest": "^24.7.1", "dotenv": "^7.0.0", "express": "^4.16.4", From d8e3395309322c6b463c0c5f77413139a722ba4c Mon Sep 17 00:00:00 2001 From: uimarshall Date: Wed, 24 Apr 2019 22:26:27 +0100 Subject: [PATCH 006/151] deletes hound.yml and make changes to travis.yml --- .hound.yml | 4 ---- .travis.yml | 3 +++ 2 files changed, 3 insertions(+), 4 deletions(-) delete mode 100644 .hound.yml diff --git a/.hound.yml b/.hound.yml deleted file mode 100644 index cd9b2c9..0000000 --- a/.hound.yml +++ /dev/null @@ -1,4 +0,0 @@ -eslint: - enabled: true - config_file: .eslintrc - ignore_file: .eslintignore diff --git a/.travis.yml b/.travis.yml index 2197832..dff50cd 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,3 +1,6 @@ language: node_js node_js: - "node" +script: + - npm run lint + - npm test From 501acefab3c12041e85b4d346969efe2e42c86fb Mon Sep 17 00:00:00 2001 From: Justice Date: Thu, 25 Apr 2019 08:23:38 +0100 Subject: [PATCH 007/151] fixed Landing page Bug reported by travis ci --- .../LandingPage/components/LandingPage.jsx | 412 +++++++++--------- .../components/LandingPage.test.jsx | 2 +- components/LandingPage/components/index.js | 1 + 3 files changed, 204 insertions(+), 211 deletions(-) diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index adea213..6422d95 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -1,16 +1,12 @@ import React from 'react'; import 'antd/dist/antd.css'; -import { - Layout, Menu, Icon, Button, Divider, Typography -} from 'antd'; +import { Layout, Menu, Icon, Button, Divider, Typography } from 'antd'; import Link from 'next/link'; -import { Head } from '../../Layout'; +import Head from '../../Layout'; import './LandingPage.css'; import LandingPageContent from './LandingPageContent'; -const { - Header, Content, Sider, Footer, -} = Layout; +const { Header, Content, Sider, Footer } = Layout; /** * Function for displaying the landing landing page @@ -20,209 +16,205 @@ const { */ const LandingPage = () => ( - <> - - -
- - - helpme logo - - - - -
- -
- - - helpme logo - - - - {/* navbar */} - - - - nav 1 - - - - - - nav 2 - - - - - - nav 3 - - - - - -
- - - - -
- - - - - - nav 1 - - - - - - - - - nav 2 - - - - - - - - - nav 3 - - - - - - - - - nav 4 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + <> + + +
+ + + helpme logo + + + + +
+ +
+ + + helpme logo + + + + {/* navbar */} + + + + nav 1 + + + + + + nav 2 + + + + + + nav 3 + + + + + +
+ + + + +
+ + + + + + nav 1 + + + + + + + + + nav 2 + + + + + + + + + nav 3 + + + + + + + + + nav 4 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); export default LandingPage; diff --git a/components/LandingPage/components/LandingPage.test.jsx b/components/LandingPage/components/LandingPage.test.jsx index 8efc9d1..298dac0 100644 --- a/components/LandingPage/components/LandingPage.test.jsx +++ b/components/LandingPage/components/LandingPage.test.jsx @@ -1,6 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import LandingPage from './LandingPage'; +import LandingPage from './index'; it('renders without crashing', () => { const div = document.createElement('div'); diff --git a/components/LandingPage/components/index.js b/components/LandingPage/components/index.js index 6bfc46c..7b923f9 100644 --- a/components/LandingPage/components/index.js +++ b/components/LandingPage/components/index.js @@ -1,3 +1,4 @@ + import LandingPage from './LandingPage'; export default LandingPage; From d375028ed990a74511cecb437a3be30497416112 Mon Sep 17 00:00:00 2001 From: Justice Date: Fri, 26 Apr 2019 10:57:36 +0100 Subject: [PATCH 008/151] fixed Landing page linting --- .../LandingPage/components/LandingPage.jsx | 2 +- empty.js | 2 +- jest.config.js | 16 +++++++--------- package.json | 6 +++--- 4 files changed, 12 insertions(+), 14 deletions(-) diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index 6422d95..de5fc18 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -9,7 +9,7 @@ import LandingPageContent from './LandingPageContent'; const { Header, Content, Sider, Footer } = Layout; /** - * Function for displaying the landing landing page + * Function for displaying the landing page * * @function * @return {Object} The landing page diff --git a/empty.js b/empty.js index 7697c1c..16f0846 100644 --- a/empty.js +++ b/empty.js @@ -1 +1 @@ -//used to map css files so that jest test can ingnore css; +// used to map css files so that jest test can ingnore css; diff --git a/jest.config.js b/jest.config.js index 98dae70..22c4ee7 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,22 +1,20 @@ const TEST_REGEX = '(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|js?|tsx?|ts?)$'; module.exports = { - setupFiles: ['/jest.setup.js'], + collectCoverage: true, globals: { jest: { useBabelrc: true, }, }, - testRegex: TEST_REGEX, - transform: { - '^.+\\.jsx?$': 'babel-jest', - }, - testPathIgnorePatterns: ['/.next/', '/node_modules/'], moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'], - collectCoverage: true, moduleNameMapper: { '\\.(css|jpg|png|scss|less|sass)$': '/empty.js', }, + setupFiles: ['/jest.setup.js'], + testPathIgnorePatterns: ['/.next/', '/node_modules/'], + testRegex: TEST_REGEX, + transform: { + '^.+\\.jsx?$': 'babel-jest', + }, }; - - diff --git a/package.json b/package.json index 1e46783..851cbec 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "main": "index.js", "scripts": { "test": "jest", - "lint": "eslint pages components --fix", + "lint": "eslint . --fix", "dev": "next", "build": "next build", "start": "next start" @@ -23,8 +23,6 @@ "devDependencies": { "babel-eslint": "^10.0.1", "chai": "^4.2.0", - "enzyme": "^3.9.0", - "enzyme-adapter-react-16": "^1.12.1", "eslint": "^5.8.0", "eslint-config-airbnb": "^17.1.0", "eslint-config-standard": "^12.0.0", @@ -45,6 +43,8 @@ "auth0-js": "^9.10.2", "babel-jest": "^24.7.1", "dotenv": "^7.0.0", + "enzyme": "^3.9.0", + "enzyme-adapter-react-16": "^1.12.1", "express": "^4.16.4", "next": "^8.0.4", "prop-types": "^15.7.2", From 976ce3cfa2132faa1eb89b9d4042231b2754393f Mon Sep 17 00:00:00 2001 From: uimarshall Date: Sat, 27 Apr 2019 13:01:18 +0100 Subject: [PATCH 009/151] add basic expess server set up and database set up in mlab --- config/keys.js | 3 ++ package.json | 114 ++++++++++++++++++++++++------------------------ server/index.js | 28 ++++++++++++ 3 files changed, 89 insertions(+), 56 deletions(-) create mode 100644 config/keys.js create mode 100644 server/index.js diff --git a/config/keys.js b/config/keys.js new file mode 100644 index 0000000..ea0b581 --- /dev/null +++ b/config/keys.js @@ -0,0 +1,3 @@ +module.exports = { + mongoURI: 'mongodb://enyehelpme:enyehelpme123@ds147946.mlab.com:47946/helpme_db', +}; diff --git a/package.json b/package.json index 851cbec..c514133 100644 --- a/package.json +++ b/package.json @@ -1,58 +1,60 @@ { - "name": "HelpMe", - "version": "1.0.0", - "description": "An App That connects depressed people to each other for comfort", - "main": "index.js", - "scripts": { - "test": "jest", - "lint": "eslint . --fix", - "dev": "next", - "build": "next build", - "start": "next start" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/team-helpme/helpme.git" - }, - "author": "Uche Nnadi, Justice Otuya, Marshall Akpan, Daniel Damilare", - "license": "ISC", - "bugs": { - "url": "https://github.com/team-helpme/helpme/issues" - }, - "homepage": "https://github.com/team-helpme/helpme#readme", - "devDependencies": { - "babel-eslint": "^10.0.1", - "chai": "^4.2.0", - "eslint": "^5.8.0", - "eslint-config-airbnb": "^17.1.0", - "eslint-config-standard": "^12.0.0", - "eslint-plugin-import": "^2.14.0", - "eslint-plugin-jsx-a11y": "^6.2.1", - "eslint-plugin-node": "^7.0.1", - "eslint-plugin-promise": "^4.0.1", - "eslint-plugin-react": "^7.11.1", - "eslint-plugin-standard": "^4.0.0", - "jest": "^24.7.1", - "mocha": "^6.1.2", - "sinon": "^7.3.1" - }, - "dependencies": { - "@babel/core": "^7.4.3", - "@zeit/next-css": "^1.0.1", - "antd": "^3.16.3", - "auth0-js": "^9.10.2", - "babel-jest": "^24.7.1", - "dotenv": "^7.0.0", - "enzyme": "^3.9.0", - "enzyme-adapter-react-16": "^1.12.1", - "express": "^4.16.4", - "next": "^8.0.4", - "prop-types": "^15.7.2", - "react": "^16.8.6", - "react-addons-test-utils": "^15.6.2", - "react-dom": "^16.8.6", - "react-test-renderer": "^16.8.6", - "redux": "^4.0.1", - "redux-saga": "^1.0.2" - } + "name": "HelpMe", + "version": "1.0.0", + "description": "An App That connects depressed people to each other for comfort", + "main": "index.js", + "scripts": { + "test": "jest", + "lint": "eslint . --fix", + "dev": "node server/index.js", + "build": "next build", + "start": "next start" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/team-helpme/helpme.git" + }, + "author": "Uche Nnadi, Justice Otuya, Marshall Akpan, Daniel Damilare", + "license": "ISC", + "bugs": { + "url": "https://github.com/team-helpme/helpme/issues" + }, + "homepage": "https://github.com/team-helpme/helpme#readme", + "devDependencies": { + "babel-eslint": "^10.0.1", + "chai": "^4.2.0", + "eslint": "^5.8.0", + "eslint-config-airbnb": "^17.1.0", + "eslint-config-standard": "^12.0.0", + "eslint-plugin-import": "^2.14.0", + "eslint-plugin-jsx-a11y": "^6.2.1", + "eslint-plugin-node": "^7.0.1", + "eslint-plugin-promise": "^4.0.1", + "eslint-plugin-react": "^7.11.1", + "eslint-plugin-standard": "^4.0.0", + "jest": "^24.7.1", + "mocha": "^6.1.2", + "sinon": "^7.3.1" + }, + "dependencies": { + "@babel/core": "^7.4.3", + "@zeit/next-css": "^1.0.1", + "antd": "^3.16.3", + "auth0-js": "^9.10.2", + "babel-jest": "^24.7.1", + "body-parser": "^1.19.0", + "dotenv": "^7.0.0", + "enzyme": "^3.9.0", + "enzyme-adapter-react-16": "^1.12.1", + "express": "^4.16.4", + "mongoose": "^5.5.4", + "next": "^8.0.4", + "prop-types": "^15.7.2", + "react": "^16.8.6", + "react-addons-test-utils": "^15.6.2", + "react-dom": "^16.8.6", + "react-test-renderer": "^16.8.6", + "redux": "^4.0.1", + "redux-saga": "^1.0.2" + } } diff --git a/server/index.js b/server/index.js new file mode 100644 index 0000000..67caddb --- /dev/null +++ b/server/index.js @@ -0,0 +1,28 @@ +const express = require('express'); +const next = require('next'); +const bodyParser = require('body-parser'); + +const PORT = process.env.PORT || 3000; +const dev = process.env.NODE_DEV !== 'production'; +const nextApp = next({ dev }); +const handle = nextApp.getRequestHandler(); +const mongoose = require('mongoose'); + +// Configure DB +const db = require('../config/keys').mongoURI; + +nextApp.prepare().then(() => { + // express code here + const app = express(); + app.use(bodyParser.json()); + app.use(bodyParser.urlencoded({ extended: true })); + + app.get( + '*', + (req, res) => handle(req, res) // next should handle all other routes except the ones specified. + ); + app.listen(PORT, err => { + if (err) throw err; + console.log(`Server ready at http://localhost:${PORT}`); + }); +}); From 08ade0b4336e974cc56b77b63ab54b2b4e112eba Mon Sep 17 00:00:00 2001 From: uimarshall Date: Sat, 27 Apr 2019 22:00:14 +0100 Subject: [PATCH 010/151] remove Uche Nnadi as author in package.json file --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index c514133..b0c24e7 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "type": "git", "url": "git+https://github.com/team-helpme/helpme.git" }, - "author": "Uche Nnadi, Justice Otuya, Marshall Akpan, Daniel Damilare", + "author": "Justice Otuya, Marshall Akpan, Daniel Damilare", "license": "ISC", "bugs": { "url": "https://github.com/team-helpme/helpme/issues" From ad478aa76ea332b9627c7eb2c789a5c31dc9b2cd Mon Sep 17 00:00:00 2001 From: uimarshall Date: Thu, 2 May 2019 17:48:20 +0100 Subject: [PATCH 011/151] creates the user model and tests for basic crud operation --- models/User.js | 27 ++++++++++++++++++++++++++ test/connection.js | 26 +++++++++++++++++++++++++ test/deleting_record_test.js | 32 +++++++++++++++++++++++++++++++ test/finding_records_test.js | 36 +++++++++++++++++++++++++++++++++++ test/package.json | 4 ++++ test/saving_records_test.js | 20 +++++++++++++++++++ test/updating_records_test.js | 32 +++++++++++++++++++++++++++++++ 7 files changed, 177 insertions(+) create mode 100644 models/User.js create mode 100644 test/connection.js create mode 100644 test/deleting_record_test.js create mode 100644 test/finding_records_test.js create mode 100644 test/package.json create mode 100644 test/saving_records_test.js create mode 100644 test/updating_records_test.js diff --git a/models/User.js b/models/User.js new file mode 100644 index 0000000..edfb852 --- /dev/null +++ b/models/User.js @@ -0,0 +1,27 @@ +const mongoose = require("mongoose"); +const Schema = mongoose.Schema; +const UserSchema = new Schema({ + name: { + type: String, + required: true + }, + email: { + type: String, + required: true + }, + password: { + type: String, + required: true + }, + // If there is an associated avatar it will show || a placeholder avatar + avatar: { + type: String + }, + date: { + type: Date, + default: Date.now + } +}); + +const User = mongoose.model("users", UserSchema); +module.exports = User; diff --git a/test/connection.js b/test/connection.js new file mode 100644 index 0000000..4abedf7 --- /dev/null +++ b/test/connection.js @@ -0,0 +1,26 @@ +const mongoose = require('mongoose'); +// Use es6 global promise to override mongoose promise because of deprecation +mongoose.Promise = global.Promise; +// Connect to the db before tests run +before(done => { + // connect to db + const db = require('../config/keys').mongoURI; + mongoose.connect(db); + mongoose.connection + .once('open', () => { + console.log('Connection made'); + done(); + }) + .on('error', error => { + console.log('Connection error:', error); + }); +}); + +// Using Another mocha 'hook' to drop the db before each test +// Drop the users collection before each test +beforeEach(done => { + // Drop the collection + mongoose.connection.collections.users.drop(() => { + done(); + }); +}); diff --git a/test/deleting_record_test.js b/test/deleting_record_test.js new file mode 100644 index 0000000..aafeedd --- /dev/null +++ b/test/deleting_record_test.js @@ -0,0 +1,32 @@ +const assert = require('assert'); +const User = require('../models/User'); + +// Describe tests +describe('Deleting records', () => { + // before each test, run this hook so that we can hv a data in db + let newUser; + beforeEach(done => { + // Create a new instance of 'User' model or record + newUser = new User({ + name: 'Ekpenyong', + email: 'ekpe@gmail.com', + password: 'pass123', + }); + + newUser.save().then(() => { + // done after the asynchronous req is complete + done(); + }); + }); + // Create tests + it('Delete one record from the database', done => { + // find frm the 'User' coll where name='Ekpenyong' + User.findOneAndRemove({ name: 'Ekpenyong' }).then(() => { + // check if the 'name' is removed & return null as result or response frm promise interface + User.findOne({ name: 'Ekpenyong' }).then(result => { + assert(result === null); + done(); + }); + }); + }); +}); diff --git a/test/finding_records_test.js b/test/finding_records_test.js new file mode 100644 index 0000000..2a04993 --- /dev/null +++ b/test/finding_records_test.js @@ -0,0 +1,36 @@ +const assert = require('assert'); +const User = require('../models/User'); +// Describe tests +describe('Finding records', () => { + // before each test, run this hook so that we can have data in db + let newUser; + beforeEach(done => { + // Create a new instance of 'Clients' model or record + newUser = new User({ + name: 'Rooney', + email: 'rud@gmail.com', + password: 'pass123', + }); + + newUser.save().then(() => { + assert(newUser.isNew === false); + // done after the asynchronous req is complete + done(); + }); + }); + // Create tests + it('Finds one record in the database', done => { + User.findOne({ name: 'Rooney' }).then(result => { + assert(result.name === 'Rooney'); + done(); + }); + }); + + // Find by id + it('Finds record by id in the database', done => { + User.findOne({ _id: newUser._id }).then(result => { + assert(result._id.toString() === newUser._id.toString()); + done(); + }); + }); +}); diff --git a/test/package.json b/test/package.json new file mode 100644 index 0000000..b4bc8fc --- /dev/null +++ b/test/package.json @@ -0,0 +1,4 @@ +{ + "main": "connection.js", + "test": "mocha" +} diff --git a/test/saving_records_test.js b/test/saving_records_test.js new file mode 100644 index 0000000..e738b7c --- /dev/null +++ b/test/saving_records_test.js @@ -0,0 +1,20 @@ +const assert = require('assert'); +const User = require('../models/User'); +// Describe tests +describe('Saving records', () => { + // Create tests + it('Saves a record to the database', done => { + // Create a new instance of 'Clients' model or record + const newUser = new User({ + name: 'Rod', + email: 'gaby@gmail.com', + password: 'pass123', + }); + newUser.save().then(() => { + // 'isNew' returns a Boolean, if it returns true it means the data has not been saved to the db + assert(newUser.isNew === false); + // done after the asynchronous req is complete + done(); + }); + }); +}); diff --git a/test/updating_records_test.js b/test/updating_records_test.js new file mode 100644 index 0000000..15215bc --- /dev/null +++ b/test/updating_records_test.js @@ -0,0 +1,32 @@ +const assert = require('assert'); +const User = require('../models/User'); + +// Describe tests +describe('Updating records', () => { + // before each test, run this hook so that we can hv a data in db + let newUser; + beforeEach(done => { + // Create a new instance of 'User' model or record + newUser = new User({ + name: 'Clem', + email: 'cle@gmail.com', + password: 'pass123', + }); + newUser.save().then(() => { + // done after the asynchronous req is complete + done(); + }); + }); + // Create tests + it('Updates one record in the database', done => { + // find frm the 'User' coll and update where name='Ekpenyong' + // the 2nd argument is what we want to update to + User.findOneAndUpdate({ name: 'Clem' }, { name: 'Rooney' }).then(() => { + // find frm d User coll an 'id supplied by mongo' == a particular record's id + User.findOne({ _id: newUser._id }).then(res => { + assert(res.name === 'Rooney'); + done(); + }); + }); + }); +}); From f521f699f744d7a2e4ab7366356c788e8bb3e669 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Thu, 2 May 2019 17:51:28 +0100 Subject: [PATCH 012/151] deleted test/package.json --- test/package.json | 4 ---- 1 file changed, 4 deletions(-) delete mode 100644 test/package.json diff --git a/test/package.json b/test/package.json deleted file mode 100644 index b4bc8fc..0000000 --- a/test/package.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "main": "connection.js", - "test": "mocha" -} From a55ecf85e53728a1c24cdb38920dd7cda4823fd6 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Sat, 4 May 2019 12:05:53 +0100 Subject: [PATCH 013/151] add jest-mongodb-config file for jest testing --- jest-mongodb-config.js | 12 ++++++++++++ package.json | 1 + server/index.js | 1 + test/saving_records_test.js | 1 + 4 files changed, 15 insertions(+) create mode 100644 jest-mongodb-config.js diff --git a/jest-mongodb-config.js b/jest-mongodb-config.js new file mode 100644 index 0000000..235f5d7 --- /dev/null +++ b/jest-mongodb-config.js @@ -0,0 +1,12 @@ +module.exports = { + mongodbMemoryServerOptions: { + instance: { + dbName: 'jest', + }, + binary: { + version: '3.6.10', + skipMD5: true, + }, + autoStart: false, + }, +}; diff --git a/package.json b/package.json index b0c24e7..b76590c 100644 --- a/package.json +++ b/package.json @@ -38,6 +38,7 @@ }, "dependencies": { "@babel/core": "^7.4.3", + "@shelf/jest-mongodb": "^1.0.1", "@zeit/next-css": "^1.0.1", "antd": "^3.16.3", "auth0-js": "^9.10.2", diff --git a/server/index.js b/server/index.js index 67caddb..5160d21 100644 --- a/server/index.js +++ b/server/index.js @@ -14,6 +14,7 @@ const db = require('../config/keys').mongoURI; nextApp.prepare().then(() => { // express code here const app = express(); + // bodyParser Middleware app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); diff --git a/test/saving_records_test.js b/test/saving_records_test.js index e738b7c..0c0d6cb 100644 --- a/test/saving_records_test.js +++ b/test/saving_records_test.js @@ -1,5 +1,6 @@ const assert = require('assert'); const User = require('../models/User'); + // Describe tests describe('Saving records', () => { // Create tests From 45222d28b347a802655d798ed4bde20b24034067 Mon Sep 17 00:00:00 2001 From: cimthog Date: Sat, 4 May 2019 17:25:45 +0100 Subject: [PATCH 014/151] created the profile model and routes for creating and updating profile --- package.json | 2 +- server/api.js | 7 +++++ server/index.js | 3 ++ server/models/profile.js | 59 ++++++++++++++++++++++++++++++++++++++++ server/routes/profile.js | 33 ++++++++++++++++++++++ 5 files changed, 103 insertions(+), 1 deletion(-) create mode 100644 server/api.js create mode 100644 server/models/profile.js create mode 100644 server/routes/profile.js diff --git a/package.json b/package.json index c514133..61dcb92 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "devDependencies": { "babel-eslint": "^10.0.1", "chai": "^4.2.0", - "eslint": "^5.8.0", + "eslint": "^5.16.0", "eslint-config-airbnb": "^17.1.0", "eslint-config-standard": "^12.0.0", "eslint-plugin-import": "^2.14.0", diff --git a/server/api.js b/server/api.js new file mode 100644 index 0000000..4cb509c --- /dev/null +++ b/server/api.js @@ -0,0 +1,7 @@ +import { Router } from 'express'; + +const Profile = require('./routes/profile'); + +Router.use('/profile', Profile); + +module.exports = Router; diff --git a/server/index.js b/server/index.js index 67caddb..8b7403a 100644 --- a/server/index.js +++ b/server/index.js @@ -1,6 +1,7 @@ const express = require('express'); const next = require('next'); const bodyParser = require('body-parser'); +const api = require('./api'); const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; @@ -17,6 +18,8 @@ nextApp.prepare().then(() => { app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); + app.use('/api', api); + app.get( '*', (req, res) => handle(req, res) // next should handle all other routes except the ones specified. diff --git a/server/models/profile.js b/server/models/profile.js new file mode 100644 index 0000000..558b39a --- /dev/null +++ b/server/models/profile.js @@ -0,0 +1,59 @@ +import { Schema, model } from 'mongoose'; + +const profileSchema = new Schema({ + city: { + required: true, + type: String, + }, + country: { + required: true, + type: String, + }, + email: { + lowercase: true, + required: true, + type: String, + unique: true, + }, + firstName: { + required: true, + type: String, + }, + followers: { + default: 0, + type: Number, + }, + following: { + default: 0, + type: Number, + }, + groups: { + default: 0, + type: Number, + }, + image: { + contentType: String, + data: Buffer, + }, + lastName: { + required: true, + type: String, + }, +}); + +const Profile = model('Profile', profileSchema); +module.exports = Profile; + +module.exports.createProfile = (newProfile, callback) => { + newProfile.save(callback); +}; + +module.exports.updateProfile = (newProfile, callback) => { + Profile.findOneAndUpdate({ + firstName: newProfile.firstName, + }, + newProfile, + { + new: true, + }, callback); +}; diff --git a/server/routes/profile.js b/server/routes/profile.js new file mode 100644 index 0000000..610021f --- /dev/null +++ b/server/routes/profile.js @@ -0,0 +1,33 @@ +import { Router as router } from 'express'; + +const Profile = require('../models/profile'); + +router.post('/create', (req, res) => { + const profile = new Profile({ + city: req.body.city, + country: req.body.country, + email: req.body.email, + firstName: req.body.first_name, + lastName: req.body.last_name, + }); + Profile.createProfile(profile, err => { + if (err) throw err; + res.status(200).json('Profile saved'); + }); +}); + +router.post('/update', (req, res) => { + const profile = new Profile({ + city: req.body.city, + country: req.body.country, + email: req.body.email, + firstName: req.body.first_name, + lastName: req.body.last_name, + }); + Profile.updateProfile(profile, err => { + if (err) throw err; + res.status(200).json('Profile Updated'); + }); +}); + +module.exports = router; From 86c7285017721b89b60c727179290807d4828e8e Mon Sep 17 00:00:00 2001 From: uimarshall Date: Sat, 4 May 2019 20:06:48 +0100 Subject: [PATCH 015/151] creates the user api-routes --- package.json | 2 ++ routes/api/users.js | 46 +++++++++++++++++++++++++++++++++++++++++++++ server/index.js | 4 ++++ 3 files changed, 52 insertions(+) create mode 100644 routes/api/users.js diff --git a/package.json b/package.json index b0c24e7..02d9553 100644 --- a/package.json +++ b/package.json @@ -42,11 +42,13 @@ "antd": "^3.16.3", "auth0-js": "^9.10.2", "babel-jest": "^24.7.1", + "bcryptjs": "^2.4.3", "body-parser": "^1.19.0", "dotenv": "^7.0.0", "enzyme": "^3.9.0", "enzyme-adapter-react-16": "^1.12.1", "express": "^4.16.4", + "gravatar": "^1.8.0", "mongoose": "^5.5.4", "next": "^8.0.4", "prop-types": "^15.7.2", diff --git a/routes/api/users.js b/routes/api/users.js new file mode 100644 index 0000000..662e12b --- /dev/null +++ b/routes/api/users.js @@ -0,0 +1,46 @@ +const express = require("express"); +const gravatar = require("gravatar"); +const bcrypt = require("bcryptjs"); +const router = express.Router(); + +// Bring in the User Model +const User = require("../../models/User"); + + + +// User Registration Route +// Check if the email coming in matches what is in the DB +router.post("/register", (req, res) => { + User.findOne({ email: req.body.email }).then(user => { + if (user) { + return res.status(400).json({ email: "Email already exist" }); + } else { + const avatar = gravatar.url(req.body.email, { + s: "200", //Size + r: "pg", //Rating + d: "mm" //Default + }); + const newUser = new User({ + //create new user + name: req.body.name, + email: req.body.email, + avatar: avatar, + password: req.body.password + }); + + // Hash Password + bcrypt.genSalt(10, (err, salt) => { + bcrypt.hash(newUser.password, salt, (err, hash) => { + if (err) throw err; + newUser.password = hash; + newUser + .save() + .then(userCreated => res.json(userCreated)) + .catch(err => console.log(err)); + }); + }); + } + }); +}); + +module.exports = router; diff --git a/server/index.js b/server/index.js index 67caddb..9d9c680 100644 --- a/server/index.js +++ b/server/index.js @@ -1,6 +1,7 @@ const express = require('express'); const next = require('next'); const bodyParser = require('body-parser'); +const users = require('../routes/api/users'); const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; @@ -17,6 +18,9 @@ nextApp.prepare().then(() => { app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); + // Routes Middleware + app.use('/api/users', users); + app.get( '*', (req, res) => handle(req, res) // next should handle all other routes except the ones specified. From cc6171cfd8699107ef436f070ae8d55840e434cb Mon Sep 17 00:00:00 2001 From: uimarshall Date: Thu, 9 May 2019 01:40:41 +0100 Subject: [PATCH 016/151] make module.exports = User = mongoose.model('users', UserSchema); into one line --- models/User.js | 48 ++++++++++++++++++++++++------------------------ 1 file changed, 24 insertions(+), 24 deletions(-) diff --git a/models/User.js b/models/User.js index edfb852..3118dc6 100644 --- a/models/User.js +++ b/models/User.js @@ -1,27 +1,27 @@ -const mongoose = require("mongoose"); -const Schema = mongoose.Schema; +const mongoose = require('mongoose'); + +const { Schema } = mongoose; const UserSchema = new Schema({ - name: { - type: String, - required: true - }, - email: { - type: String, - required: true - }, - password: { - type: String, - required: true - }, - // If there is an associated avatar it will show || a placeholder avatar - avatar: { - type: String - }, - date: { - type: Date, - default: Date.now - } + name: { + type: String, + required: true, + }, + email: { + type: String, + required: true, + }, + password: { + type: String, + required: true, + }, + // If there is an associated avatar it will show || a placeholder avatar + avatar: { + type: String, + }, + date: { + type: Date, + default: Date.now, + }, }); -const User = mongoose.model("users", UserSchema); -module.exports = User; +module.exports = User = mongoose.model('users', UserSchema); From cf2e827a459d5b3d37df29803eff4ebe629055b3 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Thu, 9 May 2019 10:17:15 +0100 Subject: [PATCH 017/151] modified User.js to create a new PR --- models/User.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/models/User.js b/models/User.js index 3118dc6..6b7ba03 100644 --- a/models/User.js +++ b/models/User.js @@ -14,7 +14,7 @@ const UserSchema = new Schema({ type: String, required: true, }, - // If there is an associated avatar it will show || a placeholder avatar + // If there is an associated avatar it will show a placeholder avatar for images avatar: { type: String, }, From 78a5a1d5f0ef25fef74874684ed62f5a86e5c9d8 Mon Sep 17 00:00:00 2001 From: cimthog Date: Sat, 11 May 2019 20:27:17 +0100 Subject: [PATCH 018/151] created user profile routes --- .eslintrc.json | 3 +- jest.config.js | 1 + package.json | 11 ++-- server/api.js | 4 +- server/controller/profile.contoller.js | 54 +++++++++++++++++++ server/index.js | 18 +++++-- .../models/{profile.js => profile.model.js} | 17 +----- server/routes/profile.js | 34 ++---------- server/start.js | 7 +++ tests/profile.test.js | 1 + 10 files changed, 97 insertions(+), 53 deletions(-) create mode 100644 server/controller/profile.contoller.js rename server/models/{profile.js => profile.model.js} (66%) create mode 100644 server/start.js create mode 100644 tests/profile.test.js diff --git a/.eslintrc.json b/.eslintrc.json index 73d11d8..8fb3f49 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -8,7 +8,8 @@ "browser": true, "commonjs": true, "es6": true, - "node": true + "node": true, + "jest": true }, "parser": "babel-eslint", "parserOptions":{ diff --git a/jest.config.js b/jest.config.js index 22c4ee7..b2bf984 100644 --- a/jest.config.js +++ b/jest.config.js @@ -4,6 +4,7 @@ module.exports = { collectCoverage: true, globals: { jest: { + preset: '@shelf/jest-mongodb', useBabelrc: true, }, }, diff --git a/package.json b/package.json index 61dcb92..19e8983 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "scripts": { "test": "jest", "lint": "eslint . --fix", - "dev": "node server/index.js", + "dev": "node server/start.js", "build": "next build", "start": "next start" }, @@ -21,6 +21,9 @@ }, "homepage": "https://github.com/team-helpme/helpme#readme", "devDependencies": { + "@babel/core": "^7.4.4", + "@babel/preset-env": "^7.4.4", + "@babel/register": "^7.4.4", "babel-eslint": "^10.0.1", "chai": "^4.2.0", "eslint": "^5.16.0", @@ -32,21 +35,23 @@ "eslint-plugin-promise": "^4.0.1", "eslint-plugin-react": "^7.11.1", "eslint-plugin-standard": "^4.0.0", - "jest": "^24.7.1", + "jest": "^24.8.0", "mocha": "^6.1.2", "sinon": "^7.3.1" }, "dependencies": { - "@babel/core": "^7.4.3", + "@shelf/jest-mongodb": "^1.0.1", "@zeit/next-css": "^1.0.1", "antd": "^3.16.3", "auth0-js": "^9.10.2", "babel-jest": "^24.7.1", + "@babel/register": "^7.4.4", "body-parser": "^1.19.0", "dotenv": "^7.0.0", "enzyme": "^3.9.0", "enzyme-adapter-react-16": "^1.12.1", "express": "^4.16.4", + "mongodb": "^3.2.3", "mongoose": "^5.5.4", "next": "^8.0.4", "prop-types": "^15.7.2", diff --git a/server/api.js b/server/api.js index 4cb509c..4056609 100644 --- a/server/api.js +++ b/server/api.js @@ -1,4 +1,6 @@ -import { Router } from 'express'; +const express = require('express'); + +const Router = express.Router(); const Profile = require('./routes/profile'); diff --git a/server/controller/profile.contoller.js b/server/controller/profile.contoller.js new file mode 100644 index 0000000..7371df4 --- /dev/null +++ b/server/controller/profile.contoller.js @@ -0,0 +1,54 @@ +import Profile from '../models/profile.model'; + +// Create and Save a new Profile +// eslint-disable-next-line consistent-return +exports.create = (req, res) => { + // Validate request + if (!req.body.city || !req.body.country || !req.body.email || !req.body.first_name || !req.body.last_name) { + return res.status(400).send({ + message: 'Please ensure you fill all fields', + }); + } + + // Create a Profile + const profile = new Profile({ + city: req.body.city, + country: req.body.country, + email: req.body.email, + firstName: req.body.first_name, + lastName: req.body.last_name, + }); + + // Save Profile in the database + profile.save() + .then(data => { + res.status(200).send({ + message: 'profile successfully created', + profile: data, + }); + }).catch(err => { + res.status(500).send({ + message: err.message || 'Some error occurred while creating the Profile.', + }); + }); +}; + +// // Find a single profile with a profileId +// exports.findOne = (req, res) => { + +// }; + +// Update a profile identified by the profileId in the request +exports.update = (req, res) => { + // Validate Request + if (!req.body.content) { + return res.status(400).send({ + message: 'Profile content can not be empty', + }); + } + + // Find note and update it with the request body + Profile.findByIdAndUpdate(req.params.profileId, { + + }); +}; diff --git a/server/index.js b/server/index.js index 8b7403a..dc45df8 100644 --- a/server/index.js +++ b/server/index.js @@ -1,16 +1,27 @@ const express = require('express'); const next = require('next'); const bodyParser = require('body-parser'); -const api = require('./api'); const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; const nextApp = next({ dev }); const handle = nextApp.getRequestHandler(); -const mongoose = require('mongoose'); +const { MongoClient } = require('mongodb'); +const api = require('./api'); // Configure DB -const db = require('../config/keys').mongoURI; +const uri = require('../config/keys').mongoURI; + +const client = new MongoClient(uri, { useNewUrlParser: true }); +client.connect(err => { + if (err) { + console.log('Error occurred while connecting to MongoDB Atlas...\n', err); + } + console.log('Connected...'); + const collection = client.db('test').collection('devices'); + // perform actions on the collection object + client.close(); +}); nextApp.prepare().then(() => { // express code here @@ -22,6 +33,7 @@ nextApp.prepare().then(() => { app.get( '*', + // eslint-disable-next-line max-len (req, res) => handle(req, res) // next should handle all other routes except the ones specified. ); app.listen(PORT, err => { diff --git a/server/models/profile.js b/server/models/profile.model.js similarity index 66% rename from server/models/profile.js rename to server/models/profile.model.js index 558b39a..d2054d5 100644 --- a/server/models/profile.js +++ b/server/models/profile.model.js @@ -41,19 +41,4 @@ const profileSchema = new Schema({ }, }); -const Profile = model('Profile', profileSchema); -module.exports = Profile; - -module.exports.createProfile = (newProfile, callback) => { - newProfile.save(callback); -}; - -module.exports.updateProfile = (newProfile, callback) => { - Profile.findOneAndUpdate({ - firstName: newProfile.firstName, - }, - newProfile, - { - new: true, - }, callback); -}; +module.exports = model('Profile', profileSchema); diff --git a/server/routes/profile.js b/server/routes/profile.js index 610021f..cf382f2 100644 --- a/server/routes/profile.js +++ b/server/routes/profile.js @@ -1,33 +1,9 @@ -import { Router as router } from 'express'; +const express = require('express'); -const Profile = require('../models/profile'); +const router = express.Router(); +const Profile = require('../controller/profile.contoller'); -router.post('/create', (req, res) => { - const profile = new Profile({ - city: req.body.city, - country: req.body.country, - email: req.body.email, - firstName: req.body.first_name, - lastName: req.body.last_name, - }); - Profile.createProfile(profile, err => { - if (err) throw err; - res.status(200).json('Profile saved'); - }); -}); - -router.post('/update', (req, res) => { - const profile = new Profile({ - city: req.body.city, - country: req.body.country, - email: req.body.email, - firstName: req.body.first_name, - lastName: req.body.last_name, - }); - Profile.updateProfile(profile, err => { - if (err) throw err; - res.status(200).json('Profile Updated'); - }); -}); +router.post('/create', Profile.create); +router.post('/profile/:profileId', Profile.update); module.exports = router; diff --git a/server/start.js b/server/start.js new file mode 100644 index 0000000..194a247 --- /dev/null +++ b/server/start.js @@ -0,0 +1,7 @@ +// Transpile all code following this line with babel and use '@babel/preset-env' (aka ES6) preset. +require('@babel/register')({ + presets: ['@babel/preset-env'], +}); + +// Import the rest of our application. +module.exports = require('./index.js'); diff --git a/tests/profile.test.js b/tests/profile.test.js new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/tests/profile.test.js @@ -0,0 +1 @@ + From 8c6102be2e40f49d82d48e10f053bee53f476963 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Mon, 13 May 2019 08:36:46 +0100 Subject: [PATCH 019/151] added ds_store to gitignore --- .gitignore | 2 +- components/Layout/components/PageLayout.jsx | 59 +++++++++++++++++++++ 2 files changed, 60 insertions(+), 1 deletion(-) create mode 100644 components/Layout/components/PageLayout.jsx diff --git a/.gitignore b/.gitignore index 188d7f4..65611f7 100644 --- a/.gitignore +++ b/.gitignore @@ -40,7 +40,7 @@ build/Release node_modules/ jspm_packages/ package-lock.json - +.DS_Store # TypeScript v1 declaration files typings/ diff --git a/components/Layout/components/PageLayout.jsx b/components/Layout/components/PageLayout.jsx new file mode 100644 index 0000000..c49a588 --- /dev/null +++ b/components/Layout/components/PageLayout.jsx @@ -0,0 +1,59 @@ +/* eslint-disable react/require-default-props */ +import React from 'react'; +import { Layout } from 'antd'; +import PropTypes from 'prop-types'; +import NavHeader from './NavHeader'; +import Sidebar from './Sidebar'; +import PageFooter from './PageFooter'; +import './PageLayout.css'; + +const { Content } = Layout; + +/** + * Function for displaying the landing page + * + * @function + * @param {Function} title controls the title of the page + * @param {Function} isAuthenticated controls if user is authrnticated or not + * @param {Function} children other pages who are children of this layout + * @param {Function} footerPresent displays footer if true + * @param {Function} siderIsPresent displays side for mobile pages + * @return {Object} controlvhe over all layout of the webpage + */ +export default function PageLayout(props) { + const { + title, + isAuthenticated, + children, + footerPresent, + siderIsPresent, + } = props; + + return ( + <> + + + + + + + {children} + + + + + {footerPresent ? : null} + + ); +} + +PageLayout.propTypes = { + children: PropTypes.node, + footerPresent: PropTypes.bool, + isAuthenticated: PropTypes.bool, + siderIsPresent: PropTypes.bool, + title: PropTypes.string, +}; From 27e3f21fc6ff78606b444b24e5a962cb1f9b724e Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Mon, 13 May 2019 11:25:39 +0100 Subject: [PATCH 020/151] refactored the landing page --- .../LandingPage/components/LandingPage.css | 88 +----- .../LandingPage/components/LandingPage.jsx | 266 +++++------------- .../components/LandingPage.test.jsx | 8 +- .../components/LandingPageContent.jsx | 1 - components/LandingPage/constants.js | 32 +++ components/Layout/components/Head.jsx | 32 --- components/Layout/components/NavHeader.jsx | 133 +++++++++ components/Layout/components/PageFooter.jsx | 63 +++++ components/Layout/components/PageLayout.css | 105 +++++++ components/Layout/components/PageLayout.jsx | 17 +- .../Layout/components/PageLayout.test.jsx | 28 ++ components/Layout/components/Sidebar.jsx | 55 ++++ components/Layout/components/index.js | 4 +- components/Layout/constants.js | 2 + components/Layout/index.js | 4 +- server/index.js | 9 +- 16 files changed, 508 insertions(+), 339 deletions(-) create mode 100644 components/LandingPage/constants.js delete mode 100644 components/Layout/components/Head.jsx create mode 100644 components/Layout/components/NavHeader.jsx create mode 100644 components/Layout/components/PageFooter.jsx create mode 100644 components/Layout/components/PageLayout.css create mode 100644 components/Layout/components/PageLayout.test.jsx create mode 100644 components/Layout/components/Sidebar.jsx create mode 100644 components/Layout/constants.js diff --git a/components/LandingPage/components/LandingPage.css b/components/LandingPage/components/LandingPage.css index 0288b02..46ec66d 100644 --- a/components/LandingPage/components/LandingPage.css +++ b/components/LandingPage/components/LandingPage.css @@ -1,22 +1,3 @@ -.LandingPage_layout { - overflow: auto; -} - -.layout_header-mobile { - display: flex; - justify-content: space-between; - background-color: #ffffff; - border-bottom: 0.4px solid #e8e8e8; - position: fixed; - width: 100%; - z-index: 1; - align-items: center; -} - -.layout_header-desktop { - display: none; -} - .LandingPage_footer { background: #001529; color: #ffffff; @@ -34,45 +15,6 @@ padding: 0; } -.logo { - width: 120px; - height: 30px; -} -.layout_sider { - position: fixed; - height: calc(100vh - 64px); - z-index: 1; - margin-top: 64px; -} - -.ant-layout { - background: #ffffff; -} - -.ant-layout-sider-zero-width-trigger { - top: 12px; - position: fixed; - background-color: #1890ff; - left: 0; -} - -.ant-layout-sider-zero-width-trigger:hover { - background-color: #1890ff; -} - -.ant-divider-horizontal { - height: 0.1px; - margin: 0.4px 0; -} - -a { - color: #ffffff; -} -.LandingPage_content { - height: 100%; - margin-top: 64px; -} - .LandingPage_hero { padding: 24px; background: #ffffff; @@ -111,9 +53,7 @@ a { } @media screen and (min-width: 768px) { - .LandingPage_layout { - overflow: auto; - } + .LandingPage_hero { flex-direction: row; @@ -127,7 +67,7 @@ a { } .LandingPage_body > section { - padding: 0 6em; + margin: 0 6em; } .reverse { @@ -147,9 +87,7 @@ a { margin-top: 0; } - .layout_sider { - display: none; - } + .LandingPage_footer { text-align: left; @@ -169,29 +107,17 @@ a { margin-bottom: 0; } - .layout_header-mobile { - display: none; - } - .layout_header-desktop { - background-color: #ffffff; - display: flex; - justify-content: space-between; - align-items: center; - border-bottom: 1px solid #e8e8e8; - padding: 0 6em; - } - .layout_header-list { - line-height: 63px; - } } @media screen and (min-width: 1024px) { .LandingPage_body > section { - padding: 0 12em; + /* padding: 0 3em; */ } .layout_header-desktop { - padding: 0 12em; + padding: 0 6em; } + + } diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index de5fc18..8ae4207 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -1,12 +1,14 @@ import React from 'react'; import 'antd/dist/antd.css'; -import { Layout, Menu, Icon, Button, Divider, Typography } from 'antd'; -import Link from 'next/link'; -import Head from '../../Layout'; +import { Layout, Divider } from 'antd'; import './LandingPage.css'; import LandingPageContent from './LandingPageContent'; +import PageLayout from '../../Layout'; +import { + pageTitle, landingPageMainContentTitle, landingPageMainContentButtonText, landingPageMainContentParagraphText, landingPageLevel2ParagraphText, landingPageLevel2ButtonText, landingPageLevel3ContentTitle, landingPageLevel3ParagraphText, landingPageLevel4ContentTitle, landingPageLevel4ParagraphText, landingPageLevel5ParagraphText, landingPageLevel5ContentTitle, landingPageLevel5ButtonText +} from '../constants'; -const { Header, Content, Sider, Footer } = Layout; +const { Content } = Layout; /** * Function for displaying the landing page @@ -16,205 +18,63 @@ const { Header, Content, Sider, Footer } = Layout; */ const LandingPage = () => ( - <> - - -
- - - helpme logo - - - - -
- -
- - - helpme logo - - - - {/* navbar */} - - - - nav 1 - - - - - - nav 2 - - - - - - nav 3 - - - - - -
- - - - -
- - - - - - nav 1 - - - - - - - - - nav 2 - - - - - - - - - nav 3 - - - - - - - - - nav 4 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + ); export default LandingPage; diff --git a/components/LandingPage/components/LandingPage.test.jsx b/components/LandingPage/components/LandingPage.test.jsx index 298dac0..23bbbe2 100644 --- a/components/LandingPage/components/LandingPage.test.jsx +++ b/components/LandingPage/components/LandingPage.test.jsx @@ -2,7 +2,9 @@ import React from 'react'; import ReactDOM from 'react-dom'; import LandingPage from './index'; -it('renders without crashing', () => { - const div = document.createElement('div'); - ReactDOM.render(, div); +describe('LandingPage', () => { + it('should renders without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); }); diff --git a/components/LandingPage/components/LandingPageContent.jsx b/components/LandingPage/components/LandingPageContent.jsx index 98eb3a1..765bf5e 100644 --- a/components/LandingPage/components/LandingPageContent.jsx +++ b/components/LandingPage/components/LandingPageContent.jsx @@ -69,7 +69,6 @@ export default function LandingPageContent(props) {
); } - LandingPageContent.propTypes = { level: PropTypes.number, title: PropTypes.string, diff --git a/components/LandingPage/constants.js b/components/LandingPage/constants.js new file mode 100644 index 0000000..4fdff2f --- /dev/null +++ b/components/LandingPage/constants.js @@ -0,0 +1,32 @@ +/* eslint-disable max-len */ +const pageTitle = 'Home | Welcome to Help me'; // the title of the landing page +const landingPageMainContentTitle = 'Help me Title'; +const landingPageMainContentParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro vero'; +const landingPageMainContentButtonText = 'Lets begin this Journey'; +const landingPageLevel2ContentTitle = 'Title2'; +const landingPageLevel2ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro veroDeleniti porro vero'; +const landingPageLevel2ButtonText = 'Lets begin this Journey'; +const landingPageLevel3ContentTitle = 'Lorem Ipsum dolor sit a '; +const landingPageLevel3ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; +const landingPageLevel4ContentTitle = 'Title 2'; +const landingPageLevel4ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; +const landingPageLevel5ContentTitle = 'Lorem Ipsum dolor sit a '; +const landingPageLevel5ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero v Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; +const landingPageLevel5ButtonText = 'Create an Account'; + +export { + pageTitle, + landingPageMainContentTitle, + landingPageMainContentParagraphText, + landingPageMainContentButtonText, + landingPageLevel2ContentTitle, + landingPageLevel2ParagraphText, + landingPageLevel2ButtonText, + landingPageLevel3ContentTitle, + landingPageLevel3ParagraphText, + landingPageLevel4ContentTitle, + landingPageLevel4ParagraphText, + landingPageLevel5ContentTitle, + landingPageLevel5ParagraphText, + landingPageLevel5ButtonText +}; diff --git a/components/Layout/components/Head.jsx b/components/Layout/components/Head.jsx deleted file mode 100644 index 2197edd..0000000 --- a/components/Layout/components/Head.jsx +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react'; -import Head from 'next/head'; -import PropTypes from 'prop-types'; - -/** - * Head function that is infused into all pages and controls page's title - * - * @function - * @param {String} title - The title of the currently viewed page - * @return {Object} head metadata which is inserted in every page - * - */ - -export default function Layout(props) { - const { title } = props; - - return ( - - - - - - - - {!title ? 'Helpme | Connect with Friends' : title} - - ); -} - -Head.propTypes = { - title: PropTypes.string, -}; diff --git a/components/Layout/components/NavHeader.jsx b/components/Layout/components/NavHeader.jsx new file mode 100644 index 0000000..648af20 --- /dev/null +++ b/components/Layout/components/NavHeader.jsx @@ -0,0 +1,133 @@ +import React from 'react'; +import Head from 'next/head'; +import 'antd/dist/antd.css'; +import { + Layout, Menu, Icon, Button, Typography, Input +} from 'antd'; +import Link from 'next/link'; +import PropTypes from 'prop-types'; +import { headerTitle } from '../constants'; + +const { Header } = Layout; +const { Search } = Input; +/** + * Head function that is infused into all pages and controls page's title + * + * @function + * @param {String} title - The title of the currently viewed page + * @return {Object} head metadata which is inserted in every page + * + */ + +function NavHeader(props) { + const { title } = props; + let isAuthenticated; + + // fake Authentication for development + console.log(global.location); + if (global.location !== undefined && global.location.pathname === '/') { + isAuthenticated = false; + } else { + isAuthenticated = true; + } + + return ( + <> + {/* head parametes */ console.log(isAuthenticated)} + + + + + + + + {!title ? headerTitle : title} + + + {/* navheader for mobile */} +
+ + + helpme logo + + + + {/* hide when authenticated */} + {isAuthenticated ? null : ( + + )} +
+ + {/* header for desktop */} +
+ + + helpme logo + + + + {isAuthenticated ? ( + <> + {/* search */} + console.log(value)} + style={{ width: 200 }} + /> + + {/* navbar for authenticated desktop */} + + + + Home + + + + + + Forum + + + + + + Dairy + + + + + + + ) : ( + + )} +
+ + ); +} + +Head.propTypes = { + title: PropTypes.string, +}; + +export default NavHeader; diff --git a/components/Layout/components/PageFooter.jsx b/components/Layout/components/PageFooter.jsx new file mode 100644 index 0000000..b8385cc --- /dev/null +++ b/components/Layout/components/PageFooter.jsx @@ -0,0 +1,63 @@ +import React from 'react'; +import Link from 'next/link'; +import { Layout } from 'antd'; + +const { Content, Footer } = Layout; + +/** + * footer function that is infused into all pages + * + * @function + * + * @return {Object} footer + * + */ + +export default function PageFooter() { + return ( + + + + + + ); +} diff --git a/components/Layout/components/PageLayout.css b/components/Layout/components/PageLayout.css new file mode 100644 index 0000000..64765be --- /dev/null +++ b/components/Layout/components/PageLayout.css @@ -0,0 +1,105 @@ + +.PageLayout_body { + /* overflow: auto; */ +} + +.PageLayout_content { + height: 100%; + margin-top: 64px; + /* overflow: auto; */ +} + +.layout_header-mobile { + display: flex; + justify-content: space-between; + background-color: #ffffff; + border-bottom: 0.4px solid #e8e8e8; + position: fixed; + width: 100%; + z-index: 1; + align-items: center; +} + +.layout_header-desktop { + display: none; +} + +.layout_sider { + position: fixed; + height: calc(100vh - 64px); + z-index: 1; + margin-top: 64px; +} + +.ant-layout { + background: #ffffff; +} + +.ant-layout-sider-zero-width-trigger { + top: 12px; + position: fixed; + background-color: #1890ff; + left: 0; +} + +.ant-layout-sider-zero-width-trigger:hover { + background-color: #1890ff; +} + +/* .ant-divider-horizontal { + height: 1px; + margin: 0.4px 0; +} */ + +a { + color: #ffffff; +} + +.ant-divider-horizontal { + margin: 0.2px; +} + +.logo { + width: 120px; + height: 30px; +} + +@media screen and (min-width: 768px) { + .PageLayout_body { + /* overflow: auto; */ +background: #E6ECF0; + } + .PageLayout_content { + margin-top: 63px; + background-color: #e8e8e8 +} +.layout_sider { + display: none; + } + +.layout_header-mobile { + display: none; + } + .layout_header-desktop { + background-color: #ffffff; + display: flex; + justify-content: space-between; + align-items: center; + border-bottom: 1px solid #e8e8e8; + position: fixed; + width: 100%; + z-index: 3; + padding: 0 1em; + } + + .layout_header-list { + line-height: 63px; + } +} + + +@media screen and (min-width: 1024px) { + .layout_header-desktop { + padding: 0 6em; + } +} diff --git a/components/Layout/components/PageLayout.jsx b/components/Layout/components/PageLayout.jsx index c49a588..72358a9 100644 --- a/components/Layout/components/PageLayout.jsx +++ b/components/Layout/components/PageLayout.jsx @@ -6,6 +6,7 @@ import NavHeader from './NavHeader'; import Sidebar from './Sidebar'; import PageFooter from './PageFooter'; import './PageLayout.css'; +import { headerTitle } from '../constants'; const { Content } = Layout; @@ -20,28 +21,20 @@ const { Content } = Layout; * @param {Function} siderIsPresent displays side for mobile pages * @return {Object} controlvhe over all layout of the webpage */ + export default function PageLayout(props) { const { - title, - isAuthenticated, - children, - footerPresent, - siderIsPresent, + title, isAuthenticated, children, footerPresent, siderIsPresent, } = props; return ( <> - + - - {children} - + {children} diff --git a/components/Layout/components/PageLayout.test.jsx b/components/Layout/components/PageLayout.test.jsx new file mode 100644 index 0000000..075aa0d --- /dev/null +++ b/components/Layout/components/PageLayout.test.jsx @@ -0,0 +1,28 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import NavHeader from './NavHeader'; +import PageFooter from './PageFooter'; +import Sidebar from './Sidebar'; +import PageLayout from './index'; + +describe('PageLayout , NavHeader, PageFooter,Sidebar and PageLayout', () => { + it('NavHeader should render without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); + + it('PageFooter should render without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); + + it('Sidebar should render without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); + + it('PageLayout should render without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); +}); diff --git a/components/Layout/components/Sidebar.jsx b/components/Layout/components/Sidebar.jsx new file mode 100644 index 0000000..0825df3 --- /dev/null +++ b/components/Layout/components/Sidebar.jsx @@ -0,0 +1,55 @@ +import React from 'react'; +import { Layout, Menu, Icon } from 'antd'; +import Link from 'next/link'; +import PropTypes from 'prop-types'; + +const { Sider } = Layout; + +/** + * HFunction that controls the sidebar which displays on mobile + * @function + * @param {boolean} siderIsPresent shows sidebar if true + * @return {Object} Side Bar + */ + +export default function Sidebar(props) { + const { siderIsPresent } = props; + + return siderIsPresent ? ( + +
+ + + + + + Home + + + + + + + + + Forum + + + + + + + + + Dairy + + + + + + ) : null; +} + +Sider.propTypes = { + siderIsPresent: PropTypes.bool, +}; diff --git a/components/Layout/components/index.js b/components/Layout/components/index.js index 7d60ee8..6b80de7 100644 --- a/components/Layout/components/index.js +++ b/components/Layout/components/index.js @@ -1,3 +1,3 @@ -import Head from './Head'; +import PageLayout from './PageLayout'; -export default Head; +export default PageLayout; diff --git a/components/Layout/constants.js b/components/Layout/constants.js new file mode 100644 index 0000000..f896e18 --- /dev/null +++ b/components/Layout/constants.js @@ -0,0 +1,2 @@ +// eslint-disable-next-line import/prefer-default-export +export const headerTitle = 'Helpme | Connect with Friends'; // title of the header diff --git a/components/Layout/index.js b/components/Layout/index.js index e25c530..0728d99 100644 --- a/components/Layout/index.js +++ b/components/Layout/index.js @@ -1,3 +1,3 @@ -import Head from './components/index'; +import PageLayout from './components/index'; -export default Head; +export default PageLayout; diff --git a/server/index.js b/server/index.js index 67caddb..e6e11dd 100644 --- a/server/index.js +++ b/server/index.js @@ -6,10 +6,12 @@ const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; const nextApp = next({ dev }); const handle = nextApp.getRequestHandler(); -const mongoose = require('mongoose'); + +// i need to comment the db declaration below else lint will not pass my code, +// i don't want to delete it as i am not the one who coded it comment by @justiceotuya // Configure DB -const db = require('../config/keys').mongoURI; +// const db = require('../config/keys').mongoURI; nextApp.prepare().then(() => { // express code here @@ -17,9 +19,10 @@ nextApp.prepare().then(() => { app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); + // next should handle all other routes except the ones specified. app.get( '*', - (req, res) => handle(req, res) // next should handle all other routes except the ones specified. + (req, res) => handle(req, res) ); app.listen(PORT, err => { if (err) throw err; From 3c1c139a9cb1521e448c59f7bbf5178d18203556 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Tue, 14 May 2019 23:52:43 +0100 Subject: [PATCH 021/151] refactored landing page and layout --- .../LandingPage/components/LandingPage.css | 10 --- .../LandingPage/components/LandingPage.jsx | 81 +++++-------------- components/LandingPage/constants.js | 64 +++++++++++++++ components/Layout/components/NavHeader.jsx | 31 +++---- components/Layout/components/PageFooter.jsx | 36 +-------- components/Layout/components/Sidebar.jsx | 39 +++------ components/Layout/constants.js | 2 - components/Layout/constants.jsx | 81 +++++++++++++++++++ server/index.js | 1 + 9 files changed, 195 insertions(+), 150 deletions(-) delete mode 100644 components/Layout/constants.js create mode 100644 components/Layout/constants.jsx diff --git a/components/LandingPage/components/LandingPage.css b/components/LandingPage/components/LandingPage.css index 46ec66d..7fd293e 100644 --- a/components/LandingPage/components/LandingPage.css +++ b/components/LandingPage/components/LandingPage.css @@ -53,8 +53,6 @@ } @media screen and (min-width: 768px) { - - .LandingPage_hero { flex-direction: row; align-items: center; @@ -87,8 +85,6 @@ margin-top: 0; } - - .LandingPage_footer { text-align: left; display: flex; @@ -107,17 +103,11 @@ margin-bottom: 0; } - } @media screen and (min-width: 1024px) { - .LandingPage_body > section { - /* padding: 0 3em; */ - } - .layout_header-desktop { padding: 0 6em; } - } diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index 8ae4207..6fbbd6b 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -4,76 +4,39 @@ import { Layout, Divider } from 'antd'; import './LandingPage.css'; import LandingPageContent from './LandingPageContent'; import PageLayout from '../../Layout'; -import { - pageTitle, landingPageMainContentTitle, landingPageMainContentButtonText, landingPageMainContentParagraphText, landingPageLevel2ParagraphText, landingPageLevel2ButtonText, landingPageLevel3ContentTitle, landingPageLevel3ParagraphText, landingPageLevel4ContentTitle, landingPageLevel4ParagraphText, landingPageLevel5ParagraphText, landingPageLevel5ContentTitle, landingPageLevel5ButtonText -} from '../constants'; - -const { Content } = Layout; +import { landingPageContents, pageTitle } from '../constants'; /** * Function for displaying the landing page - * * @function * @return {Object} The landing page */ const LandingPage = () => ( - - - - - - - + { + landingPageContents.map(landingPageContent => ( + + )) + } - ); diff --git a/components/LandingPage/constants.js b/components/LandingPage/constants.js index 4fdff2f..f64ce8f 100644 --- a/components/LandingPage/constants.js +++ b/components/LandingPage/constants.js @@ -1,21 +1,85 @@ /* eslint-disable max-len */ const pageTitle = 'Home | Welcome to Help me'; // the title of the landing page + const landingPageMainContentTitle = 'Help me Title'; + const landingPageMainContentParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro vero'; + const landingPageMainContentButtonText = 'Lets begin this Journey'; + const landingPageLevel2ContentTitle = 'Title2'; + const landingPageLevel2ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro veroDeleniti porro vero'; + const landingPageLevel2ButtonText = 'Lets begin this Journey'; + const landingPageLevel3ContentTitle = 'Lorem Ipsum dolor sit a '; + const landingPageLevel3ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; + const landingPageLevel4ContentTitle = 'Title 2'; + const landingPageLevel4ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; + const landingPageLevel5ContentTitle = 'Lorem Ipsum dolor sit a '; + const landingPageLevel5ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero v Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; + const landingPageLevel5ButtonText = 'Create an Account'; +const landingPageContents = [ + { + buttonIsPresent: true, + buttonLink: '/signup', + buttonText: landingPageMainContentButtonText, + imageIsPresent: true, + imageLink: '../../../static/connected.svg', + level: 1, + paragraphText: landingPageMainContentParagraphText, + title: landingPageMainContentTitle, + }, + { + buttonIsPresent: false, + columnSection: true, + imageIsPresent: true, + imageLink: '../../../static/smile.svg', + level: 2, + paragraphText: landingPageLevel2ParagraphText, + title: landingPageLevel2ButtonText, + + }, + { + buttonIsPresent: false, + imageIsPresent: true, + imageLink: '../../../static/community.svg', + level: 3, + paragraphText: landingPageLevel3ParagraphText, + reverseSection: true, + title: landingPageLevel3ContentTitle, + }, + { + buttonIsPresent: false, + imageIsPresent: false, + level: 2, + paragraphText: landingPageLevel4ParagraphText, + title: landingPageLevel4ContentTitle, + }, + { + buttonIsPresent: true, + buttonLink: '/signup', + buttonText: landingPageLevel5ButtonText, + imageIsPresent: true, + imageLink: '../../../static/hangout.svg', + level: 3, + paragraphText: landingPageLevel5ParagraphText, + reverseSection: false, + title: landingPageLevel5ContentTitle, + }, +]; + export { pageTitle, + landingPageContents, landingPageMainContentTitle, landingPageMainContentParagraphText, landingPageMainContentButtonText, diff --git a/components/Layout/components/NavHeader.jsx b/components/Layout/components/NavHeader.jsx index 648af20..bc2b5dd 100644 --- a/components/Layout/components/NavHeader.jsx +++ b/components/Layout/components/NavHeader.jsx @@ -6,7 +6,7 @@ import { } from 'antd'; import Link from 'next/link'; import PropTypes from 'prop-types'; -import { headerTitle } from '../constants'; +import { headerTitle, menuItems } from '../constants'; const { Header } = Layout; const { Search } = Input; @@ -24,7 +24,6 @@ function NavHeader(props) { let isAuthenticated; // fake Authentication for development - console.log(global.location); if (global.location !== undefined && global.location.pathname === '/') { isAuthenticated = false; } else { @@ -33,7 +32,7 @@ function NavHeader(props) { return ( <> - {/* head parametes */ console.log(isAuthenticated)} + {/* head parametes */} @@ -89,23 +88,15 @@ function NavHeader(props) { defaultSelectedKeys={['1']} className="layout_header-list" > - - - Home - - - - - - Forum - - - - - - Dairy - - + { + menuItems.map(menuItem => ( + + + {menuItem.text} + + + )) + } - ) : null} + { + isButtonPresent ? ( + + ) : null + }
{/* displays image in a section */} - {imageIsPresent ? {`${title} : null} + {isImagePresent ? {`${title} : null} ); } @@ -73,10 +75,10 @@ LandingPageContent.propTypes = { level: PropTypes.number, title: PropTypes.string, paragraphText: PropTypes.string, - buttonIsPresent: PropTypes.bool, + isButtonPresent: PropTypes.bool, buttonText: PropTypes.string, buttonLink: PropTypes.string, - imageIsPresent: PropTypes.bool, + isImagePresent: PropTypes.bool, imageLink: PropTypes.string, reverseSection: PropTypes.bool, columnSection: PropTypes.bool, diff --git a/components/LandingPage/constants.js b/components/LandingPage/constants.js index f64ce8f..88ba3d4 100644 --- a/components/LandingPage/constants.js +++ b/components/LandingPage/constants.js @@ -29,19 +29,19 @@ const landingPageLevel5ButtonText = 'Create an Account'; const landingPageContents = [ { - buttonIsPresent: true, - buttonLink: '/signup', - buttonText: landingPageMainContentButtonText, - imageIsPresent: true, - imageLink: '../../../static/connected.svg', level: 1, - paragraphText: landingPageMainContentParagraphText, title: landingPageMainContentTitle, + paragraphText: landingPageMainContentParagraphText, + buttonText: landingPageMainContentButtonText, + isImagePresent: true, + imageLink: '../../../static/connected.svg', + buttonLink: '/signup', + isButtonPresent: true, }, { - buttonIsPresent: false, + isButtonPresent: false, columnSection: true, - imageIsPresent: true, + isImagePresent: true, imageLink: '../../../static/smile.svg', level: 2, paragraphText: landingPageLevel2ParagraphText, @@ -49,31 +49,31 @@ const landingPageContents = [ }, { - buttonIsPresent: false, - imageIsPresent: true, - imageLink: '../../../static/community.svg', level: 3, + title: landingPageLevel3ContentTitle, paragraphText: landingPageLevel3ParagraphText, + imageLink: '../../../static/community.svg', reverseSection: true, - title: landingPageLevel3ContentTitle, + isButtonPresent: false, + isImagePresent: true, }, { - buttonIsPresent: false, - imageIsPresent: false, level: 2, - paragraphText: landingPageLevel4ParagraphText, title: landingPageLevel4ContentTitle, + paragraphText: landingPageLevel4ParagraphText, + isImagePresent: false, + isButtonPresent: false, }, { - buttonIsPresent: true, - buttonLink: '/signup', - buttonText: landingPageLevel5ButtonText, - imageIsPresent: true, - imageLink: '../../../static/hangout.svg', level: 3, + title: landingPageLevel5ContentTitle, paragraphText: landingPageLevel5ParagraphText, + isImagePresent: true, + imageLink: '../../../static/hangout.svg', reverseSection: false, - title: landingPageLevel5ContentTitle, + isButtonPresent: true, + buttonText: landingPageLevel5ButtonText, + buttonLink: '/signup', }, ]; diff --git a/components/Layout/components/FooterListCreator.jsx b/components/Layout/components/FooterListCreator.jsx new file mode 100644 index 0000000..7495f87 --- /dev/null +++ b/components/Layout/components/FooterListCreator.jsx @@ -0,0 +1,21 @@ +import React from 'react'; +import Link from 'next/link'; + +const FooterListCreator = props => { + const { list } = props; + return ( +
    + { + list.map(link => ( + +
  • + {link.text} +
    • + + )) + } +
+ ); +}; + +export default FooterListCreator; diff --git a/components/Layout/components/PageFooter.jsx b/components/Layout/components/PageFooter.jsx index 23fea1a..bbe3a2b 100644 --- a/components/Layout/components/PageFooter.jsx +++ b/components/Layout/components/PageFooter.jsx @@ -1,8 +1,8 @@ import React from 'react'; import Link from 'next/link'; import { Layout } from 'antd'; -import { footerFirstColumn, footerSecondColumn, footerListCreator } from '../constants'; - +import { footerFirstColumn, footerSecondColumn } from '../constants'; +import FooterListCreator from './FooterListCreator'; const { Content, Footer } = Layout; /** @@ -24,8 +24,12 @@ export default function PageFooter() { helpme logo - {footerListCreator(footerFirstColumn)} - {footerListCreator(footerSecondColumn)} + + diff --git a/components/Layout/components/PageLayout.jsx b/components/Layout/components/PageLayout.jsx index 72358a9..329776d 100644 --- a/components/Layout/components/PageLayout.jsx +++ b/components/Layout/components/PageLayout.jsx @@ -17,14 +17,14 @@ const { Content } = Layout; * @param {Function} title controls the title of the page * @param {Function} isAuthenticated controls if user is authrnticated or not * @param {Function} children other pages who are children of this layout - * @param {Function} footerPresent displays footer if true - * @param {Function} siderIsPresent displays side for mobile pages + * @param {Function} isFooterPresent displays footer if true + * @param {Function} isSiderPresent displays side for mobile pages * @return {Object} controlvhe over all layout of the webpage */ export default function PageLayout(props) { const { - title, isAuthenticated, children, footerPresent, siderIsPresent, + title, isAuthenticated, children, isFooterPresent, isSiderPresent, } = props; return ( @@ -33,20 +33,20 @@ export default function PageLayout(props) { - + {children} - {footerPresent ? : null} + {isFooterPresent ? : null} ); } PageLayout.propTypes = { children: PropTypes.node, - footerPresent: PropTypes.bool, + isFooterPresent: PropTypes.bool, isAuthenticated: PropTypes.bool, - siderIsPresent: PropTypes.bool, + isSiderPresent: PropTypes.bool, title: PropTypes.string, }; diff --git a/components/Layout/constants.jsx b/components/Layout/constants.js similarity index 74% rename from components/Layout/constants.jsx rename to components/Layout/constants.js index fa975f9..09707e9 100644 --- a/components/Layout/constants.jsx +++ b/components/Layout/constants.js @@ -1,21 +1,18 @@ // eslint-disable-next-line import/prefer-default-export -import React from 'react'; -import Link from 'next/link'; - const headerTitle = 'Helpme | Connect with Friends'; // title of the header const menuItems = [ { - href: '/', key: 1, + href: '/', text: 'Home', }, { - href: '/forum', key: 2, + href: '/forum', text: 'Forum', }, { - href: '/Dairy', key: 3, + href: '/Dairy', text: 'Dairy', }, ]; @@ -43,39 +40,25 @@ const footerSecondColumn = [ }, ]; -const footerListCreator = list => ( -
    - { - list.map(link => ( - -
  • - {link.text} -
    • - - )) - } -
-); - const sideBarMenuItems = [ { - href: '/#', key: 1, - text: 'Home', + href: '/#', type: 'user', + text: 'Home', }, { - href: '/forum', key: 2, - text: 'Forum', + href: '/forum', type: 'video-camera', + text: 'Forum', }, { - href: '/dairy', key: 3, - text: 'Dairy', + href: '/dairy', type: 'upload', + text: 'Dairy', }, ]; export { - headerTitle, menuItems, footerFirstColumn, footerSecondColumn, footerListCreator, sideBarMenuItems + headerTitle, menuItems, footerFirstColumn, footerSecondColumn, sideBarMenuItems }; From 76496641032fc04f81e4e2d7d8214511984d5120 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 15 May 2019 02:17:01 +0100 Subject: [PATCH 023/151] made changes to file --- components/LandingPage/constants.js | 40 ++++++++++++++--------------- components/Layout/constants.js | 18 ++++++------- 2 files changed, 29 insertions(+), 29 deletions(-) diff --git a/components/LandingPage/constants.js b/components/LandingPage/constants.js index 88ba3d4..ff34531 100644 --- a/components/LandingPage/constants.js +++ b/components/LandingPage/constants.js @@ -29,51 +29,51 @@ const landingPageLevel5ButtonText = 'Create an Account'; const landingPageContents = [ { - level: 1, - title: landingPageMainContentTitle, - paragraphText: landingPageMainContentParagraphText, + buttonLink: '/signup', buttonText: landingPageMainContentButtonText, - isImagePresent: true, imageLink: '../../../static/connected.svg', - buttonLink: '/signup', isButtonPresent: true, + isImagePresent: true, + level: 1, + paragraphText: landingPageMainContentParagraphText, + title: landingPageMainContentTitle, }, { - isButtonPresent: false, columnSection: true, - isImagePresent: true, imageLink: '../../../static/smile.svg', + isButtonPresent: false, + isImagePresent: true, level: 2, paragraphText: landingPageLevel2ParagraphText, title: landingPageLevel2ButtonText, }, { - level: 3, - title: landingPageLevel3ContentTitle, - paragraphText: landingPageLevel3ParagraphText, imageLink: '../../../static/community.svg', - reverseSection: true, isButtonPresent: false, isImagePresent: true, + level: 3, + paragraphText: landingPageLevel3ParagraphText, + reverseSection: true, + title: landingPageLevel3ContentTitle, }, { + isButtonPresent: false, + isImagePresent: false, level: 2, - title: landingPageLevel4ContentTitle, paragraphText: landingPageLevel4ParagraphText, - isImagePresent: false, - isButtonPresent: false, + title: landingPageLevel4ContentTitle, }, { + buttonLink: '/signup', + buttonText: landingPageLevel5ButtonText, + imageLink: '../../../static/hangout.svg', + isButtonPresent: true, + isImagePresent: true, level: 3, - title: landingPageLevel5ContentTitle, paragraphText: landingPageLevel5ParagraphText, - isImagePresent: true, - imageLink: '../../../static/hangout.svg', reverseSection: false, - isButtonPresent: true, - buttonText: landingPageLevel5ButtonText, - buttonLink: '/signup', + title: landingPageLevel5ContentTitle, }, ]; diff --git a/components/Layout/constants.js b/components/Layout/constants.js index 09707e9..4fedfdc 100644 --- a/components/Layout/constants.js +++ b/components/Layout/constants.js @@ -3,16 +3,16 @@ const headerTitle = 'Helpme | Connect with Friends'; // title of the header const menuItems = [ { - key: 1, href: '/', + key: 1, text: 'Home', }, { - key: 2, href: '/forum', + key: 2, text: 'Forum', }, { - key: 3, href: '/Dairy', + key: 3, text: 'Dairy', }, ]; @@ -42,20 +42,20 @@ const footerSecondColumn = [ const sideBarMenuItems = [ { - key: 1, href: '/#', - type: 'user', + key: 1, text: 'Home', + type: 'user', }, { - key: 2, href: '/forum', - type: 'video-camera', + key: 2, text: 'Forum', + type: 'video-camera', }, { - key: 3, href: '/dairy', - type: 'upload', + key: 3, text: 'Dairy', + type: 'upload', }, ]; From 474bbe7ede401bd5295f01f8188084e0c9f648ed Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 15 May 2019 06:55:09 +0100 Subject: [PATCH 024/151] made changes to file --- .../LandingPage/components/LandingPage.jsx | 76 +++++++++---------- components/LandingPage/constants.js | 15 +--- .../Layout/components/FooterListCreator.jsx | 25 ++++-- components/Layout/components/NavHeader.jsx | 34 ++++----- components/Layout/components/PageFooter.jsx | 5 +- components/Layout/components/PageLayout.jsx | 9 +-- components/Layout/components/Sidebar.jsx | 38 +++++----- 7 files changed, 92 insertions(+), 110 deletions(-) diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index 4fa3f10..9458729 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -15,45 +15,45 @@ import { landingPageContents, pageTitle } from '../constants'; */ const LandingPage = () => ( - - { - landingPageContents.map(test => { - const { - paragraphText, - isButtonPresent, - columnSection, - isImagePresent, - imageLink, - level, - title, - reverseSection, - buttonText, - buttonLink, - } = test; + + { + landingPageContents.map(landingPageContent => { + const { + paragraphText, + isButtonPresent, + columnSection, + isImagePresent, + imageLink, + level, + title, + reverseSection, + buttonText, + buttonLink, + } = landingPageContent; - return ( - - ); - }) - } - + return ( + + ); + }) + } + ); export default LandingPage; diff --git a/components/LandingPage/constants.js b/components/LandingPage/constants.js index ff34531..035adee 100644 --- a/components/LandingPage/constants.js +++ b/components/LandingPage/constants.js @@ -79,18 +79,5 @@ const landingPageContents = [ export { pageTitle, - landingPageContents, - landingPageMainContentTitle, - landingPageMainContentParagraphText, - landingPageMainContentButtonText, - landingPageLevel2ContentTitle, - landingPageLevel2ParagraphText, - landingPageLevel2ButtonText, - landingPageLevel3ContentTitle, - landingPageLevel3ParagraphText, - landingPageLevel4ContentTitle, - landingPageLevel4ParagraphText, - landingPageLevel5ContentTitle, - landingPageLevel5ParagraphText, - landingPageLevel5ButtonText + landingPageContents }; diff --git a/components/Layout/components/FooterListCreator.jsx b/components/Layout/components/FooterListCreator.jsx index 7495f87..042c6bf 100644 --- a/components/Layout/components/FooterListCreator.jsx +++ b/components/Layout/components/FooterListCreator.jsx @@ -1,21 +1,30 @@ import React from 'react'; import Link from 'next/link'; +import PropTypes from 'prop-types'; const FooterListCreator = props => { const { list } = props; return (
    { - list.map(link => ( - -
  • - {link.text} -
    • - - )) + list.map(link => { + const { href, text } = link; + return ( + +
  • + {text} +
    • + + ); + }) }
); }; - export default FooterListCreator; +FooterListCreator.propTypes = { + list: PropTypes.arrayOf(PropTypes.shape({ + href: PropTypes.string.isRequired, + text: PropTypes.string.isRequired, + })).isRequired, +}; diff --git a/components/Layout/components/NavHeader.jsx b/components/Layout/components/NavHeader.jsx index bc2b5dd..5fcadb7 100644 --- a/components/Layout/components/NavHeader.jsx +++ b/components/Layout/components/NavHeader.jsx @@ -2,7 +2,7 @@ import React from 'react'; import Head from 'next/head'; import 'antd/dist/antd.css'; import { - Layout, Menu, Icon, Button, Typography, Input + Layout, Menu, Button, Input } from 'antd'; import Link from 'next/link'; import PropTypes from 'prop-types'; @@ -10,19 +10,16 @@ import { headerTitle, menuItems } from '../constants'; const { Header } = Layout; const { Search } = Input; + /** * Head function that is infused into all pages and controls page's title - * * @function * @param {String} title - The title of the currently viewed page * @return {Object} head metadata which is inserted in every page - * */ - function NavHeader(props) { const { title } = props; let isAuthenticated; - // fake Authentication for development if (global.location !== undefined && global.location.pathname === '/') { isAuthenticated = false; @@ -45,7 +42,6 @@ function NavHeader(props) { /> {!title ? headerTitle : title} - {/* navheader for mobile */}
@@ -53,7 +49,6 @@ function NavHeader(props) { helpme logo - {/* hide when authenticated */} {isAuthenticated ? null : ( )}
- {/* header for desktop */}
@@ -71,7 +65,6 @@ function NavHeader(props) { helpme logo - {isAuthenticated ? ( <> {/* search */} @@ -80,7 +73,6 @@ function NavHeader(props) { onSearch={value => console.log(value)} style={{ width: 200 }} /> - {/* navbar for authenticated desktop */} { - menuItems.map(menuItem => ( - - - {menuItem.text} - - - )) + menuItems.map(menuItem => { + const { key, href, text } = menuItem; + return ( + + + {text} + + + ); + }) } - + Or + register now! + + + + + ); + } +} + +const Login = Form.create({ name: 'normal_login' })(NormalLoginForm); +export default Login; diff --git a/components/Authentication/components/index.js b/components/Authentication/components/index.js new file mode 100644 index 0000000..dbe484f --- /dev/null +++ b/components/Authentication/components/index.js @@ -0,0 +1,3 @@ +import Login from './Login'; + +export default Login; diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js new file mode 100644 index 0000000..9b2e1c2 --- /dev/null +++ b/components/Authentication/constants.js @@ -0,0 +1,7 @@ +const loginUsernameInputError = 'Please input your username!'; +const loginPasswordInputError = 'Please input your Password!'; + +export { + loginUsernameInputError, + loginPasswordInputError +}; diff --git a/components/Authentication/index.js b/components/Authentication/index.js new file mode 100644 index 0000000..902f460 --- /dev/null +++ b/components/Authentication/index.js @@ -0,0 +1,3 @@ +import Login from './components'; + +export default Login; diff --git a/pages/login.js b/pages/login.js new file mode 100644 index 0000000..be5c45a --- /dev/null +++ b/pages/login.js @@ -0,0 +1,3 @@ +import Login from '../components/Authentication'; + +export default Login; From 972f579068dfa2f3199f2d25cc2b01feba944aa6 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 15 May 2019 07:31:35 +0100 Subject: [PATCH 028/151] finished login page --- static/login.svg | 1 + 1 file changed, 1 insertion(+) create mode 100644 static/login.svg diff --git a/static/login.svg b/static/login.svg new file mode 100644 index 0000000..956800b --- /dev/null +++ b/static/login.svg @@ -0,0 +1 @@ +press play \ No newline at end of file From 7bbd73c328952381932c11c249c145c32b02ad6b Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 15 May 2019 07:44:03 +0100 Subject: [PATCH 029/151] finished login page --- .babelrc | 9 +++++++++ components/Authentication/components/Login.jsx | 18 +++++++++++++----- package.json | 1 + 3 files changed, 23 insertions(+), 5 deletions(-) diff --git a/.babelrc b/.babelrc index f45f640..083ffc7 100644 --- a/.babelrc +++ b/.babelrc @@ -3,11 +3,17 @@ "development": { "presets": [ "next/babel" + ], + "plugins": [ + "inline-react-svg" ] }, "production": { "presets": [ "next/babel" + ], + "plugins": [ + "inline-react-svg" ] }, "test": { @@ -20,6 +26,9 @@ } } ] + ], + "plugins": [ + "inline-react-svg" ] } } diff --git a/components/Authentication/components/Login.jsx b/components/Authentication/components/Login.jsx index 8d00dfc..c51aa23 100644 --- a/components/Authentication/components/Login.jsx +++ b/components/Authentication/components/Login.jsx @@ -1,3 +1,4 @@ +/* eslint-disable react/jsx-no-literals */ import React from 'react'; import { Form, @@ -35,11 +36,11 @@ class NormalLoginForm extends React.Component { // handles the submitting of the login form handleSubmit = e => { + const { validateFields } = this.props.form; e.preventDefault(); // validate error and simulate api response with settimeout - this.props.form.validateFields((err, values) => { + validateFields((err, values) => { if (!err) { - console.log('Received values of form: ', values); setTimeout(() => { Router.push('/timeline'); }, 1000); @@ -49,6 +50,7 @@ class NormalLoginForm extends React.Component { render() { const { getFieldDecorator } = this.props.form; + const { loading } = this.state; return (
@@ -63,7 +65,10 @@ class NormalLoginForm extends React.Component { { getFieldDecorator('username', { - rules: [{ required: true, message: loginUsernameInputError }], + rules: [{ + message: loginUsernameInputError, + required: true, + }], })( } placeholder="Username" /> ) @@ -72,7 +77,10 @@ class NormalLoginForm extends React.Component { {getFieldDecorator('password', { - rules: [{ required: true, message: loginPasswordInputError }], + rules: [{ + message: loginPasswordInputError, + required: true, + }], })( } type="password" placeholder="Password" /> )} @@ -80,7 +88,7 @@ class NormalLoginForm extends React.Component { Forgot password - Or diff --git a/package.json b/package.json index c514133..0793f0e 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,7 @@ "antd": "^3.16.3", "auth0-js": "^9.10.2", "babel-jest": "^24.7.1", + "babel-plugin-inline-react-svg": "^1.1.0", "body-parser": "^1.19.0", "dotenv": "^7.0.0", "enzyme": "^3.9.0", From 325d9f07d9d7b9e96d2f19570418c2dd099de7d0 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 15 May 2019 13:37:18 +0100 Subject: [PATCH 030/151] finished login --- components/Authentication/components/Login.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/components/Authentication/components/Login.jsx b/components/Authentication/components/Login.jsx index c51aa23..d543344 100644 --- a/components/Authentication/components/Login.jsx +++ b/components/Authentication/components/Login.jsx @@ -23,7 +23,6 @@ const { Title, Paragraph } = Typography; * @function * @return {Object} the login page */ - class NormalLoginForm extends React.Component { state = { iconLoading: false, // loading icon when code is accessing network From adc1db597ee9dd15fd53f03d822e1bfb86524391 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 15 May 2019 15:35:50 +0100 Subject: [PATCH 031/151] finised the signup page --- .../components/Authentication.test.jsx | 7 +- .../Authentication/components/SignUp.jsx | 168 ++++++++++++++++++ components/Authentication/components/index.js | 3 +- components/Authentication/constants.js | 13 +- components/Authentication/index.js | 4 +- pages/login.js | 2 +- pages/signup.js | 3 + static/register.svg | 1 + 8 files changed, 195 insertions(+), 6 deletions(-) create mode 100644 components/Authentication/components/SignUp.jsx create mode 100644 pages/signup.js create mode 100644 static/register.svg diff --git a/components/Authentication/components/Authentication.test.jsx b/components/Authentication/components/Authentication.test.jsx index e250aaa..982502d 100644 --- a/components/Authentication/components/Authentication.test.jsx +++ b/components/Authentication/components/Authentication.test.jsx @@ -1,10 +1,15 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import Login from './index'; +import { Login, SignUp } from './index'; describe('Login', () => { it('renders without crashing', () => { const div = document.createElement('div'); ReactDOM.render(, div); }); + + it('renders without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); }); diff --git a/components/Authentication/components/SignUp.jsx b/components/Authentication/components/SignUp.jsx new file mode 100644 index 0000000..b54f537 --- /dev/null +++ b/components/Authentication/components/SignUp.jsx @@ -0,0 +1,168 @@ +import React from 'react'; +import { + Form, + Input, + Icon, + Checkbox, + Button, + AutoComplete, + Typography +} from 'antd'; +import 'antd/dist/antd.css'; +import './Authentication.css'; +import Router from 'next/router'; +import RegistrationImage from '../../../static/register.svg'; +import { + signupNameInputError, + signupEmailInputError, + signupValidEmailError, + signupPasswordInputError, + signupConfirmPasswordInputError +} from '../constants'; + +/** + * function that is used to display the registration Page + * @function + * @return {Object} the registtration page + */ +class RegistrationForm extends React.Component { + state = { + // confirmDirty: false, + autoCompleteResult: [], + iconLoading: false, + loading: false, + }; + + enterLoading = () => { + this.setState({ loading: true }); + } + + handleSubmit = e => { + e.preventDefault(); + // This function after validation, if the target field is not in visible area of form, form will be automatically scrolled to the target field area. + this.props.form.validateFieldsAndScroll((err, values) => { + if (!err) { + console.log('Received values of form: ', values); + setTimeout(() => { + Router.push('/timeline'); + }, 1000); + } + }); + } + + handleConfirmBlur = e => { + const { value } = e.target; + this.setState({ confirmDirty: this.state.confirmDirty || !!value }); + console.log('dirty state', this.state.confirmDirty); + console.log('value', !!value); + } + + compareToFirstPassword = (rule, value, callback) => { + const { form } = this.props; + if (value && value !== form.getFieldValue('password')) { + callback('The Two passwords that you enter is inconsistent!'); + } else { + callback(); + } + } + + validateToNextPassword = (rule, value, callback) => { + const { form } = this.props; + if (value && this.state.confirmDirty) { + form.validateFields(['confirm'], { force: true }); // Validate the specified fields and get theirs values and errors. If you don't specify the parameter of fieldNames, you will validate all fields. + } + callback(); + } + + render() { + const { getFieldDecorator } = this.props.form; + return ( +
+
+ +
+ +
+
+ + Name  + + )} + > + {getFieldDecorator('name', { + rules: [{ required: true, message: signupNameInputError, whitespace: true }], + })( + + )} + + + + {getFieldDecorator('email', { + rules: [{ + type: 'email', message: signupValidEmailError, + }, { + required: true, message: signupEmailInputError, + }], + })( + + )} + + + + {getFieldDecorator('password', { + rules: [{ + required: true, message: signupPasswordInputError, + }, { + validator: this.validateToNextPassword, + }], + })( + + )} + + + + {getFieldDecorator('confirm', { + rules: [{ + required: true, message: signupConfirmPasswordInputError, + }, { + validator: this.compareToFirstPassword, + }], + })( + + )} + + + + {getFieldDecorator('agreement', { + valuePropName: 'checked', + })( + + I have read the + agreement + + )} + + + +
+ already have an account, please + login + +
+
+
+ ); + } +} + +const Signup = Form.create({ name: 'register' })(RegistrationForm); + +export default Signup; diff --git a/components/Authentication/components/index.js b/components/Authentication/components/index.js index dbe484f..f1e8d33 100644 --- a/components/Authentication/components/index.js +++ b/components/Authentication/components/index.js @@ -1,3 +1,4 @@ import Login from './Login'; +import SignUp from './SignUp'; -export default Login; +export { Login, SignUp }; diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index 9b2e1c2..3f72007 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -1,7 +1,18 @@ const loginUsernameInputError = 'Please input your username!'; const loginPasswordInputError = 'Please input your Password!'; +const signupNameInputError = 'Please input your name!'; +const signupEmailInputError = 'Please input your E-mail!'; +const signupValidEmailError = 'The input is not a valid E-mail!'; +const signupPasswordInputError = 'Please input your password!'; +const signupConfirmPasswordInputError = 'Please confirm your password!'; + export { loginUsernameInputError, - loginPasswordInputError + loginPasswordInputError, + signupNameInputError, + signupEmailInputError, + signupValidEmailError, + signupPasswordInputError, + signupConfirmPasswordInputError }; diff --git a/components/Authentication/index.js b/components/Authentication/index.js index 902f460..76dd08f 100644 --- a/components/Authentication/index.js +++ b/components/Authentication/index.js @@ -1,3 +1,3 @@ -import Login from './components'; +import { Login, SignUp } from './components'; -export default Login; +export { Login, SignUp }; diff --git a/pages/login.js b/pages/login.js index be5c45a..e893e6c 100644 --- a/pages/login.js +++ b/pages/login.js @@ -1,3 +1,3 @@ -import Login from '../components/Authentication'; +import {Login} from '../components/Authentication'; export default Login; diff --git a/pages/signup.js b/pages/signup.js new file mode 100644 index 0000000..2bed551 --- /dev/null +++ b/pages/signup.js @@ -0,0 +1,3 @@ +import { SignUp } from '../components/Authentication'; + +export default SignUp; diff --git a/static/register.svg b/static/register.svg new file mode 100644 index 0000000..cfe3649 --- /dev/null +++ b/static/register.svg @@ -0,0 +1 @@ +mobile login \ No newline at end of file From 191d4250f40f04d7413d21b9256858886d838acd Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 15 May 2019 17:09:20 +0100 Subject: [PATCH 032/151] changed constants to capital letters --- components/Authentication/constants.js | 28 +++++----- .../LandingPage/components/LandingPage.jsx | 34 +++++------ components/LandingPage/constants.js | 56 +++++++++---------- components/Layout/components/NavHeader.jsx | 6 +- components/Layout/components/PageFooter.jsx | 6 +- components/Layout/constants.js | 12 ++-- pages/login.js | 2 +- 7 files changed, 72 insertions(+), 72 deletions(-) diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index 3f72007..2a5e639 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -1,18 +1,18 @@ -const loginUsernameInputError = 'Please input your username!'; -const loginPasswordInputError = 'Please input your Password!'; +const LOGIN_USERNAME_INPUT_ERROR = 'Please input your username!'; +const LOGIN_PASSWORD_INPUT_ERROR = 'Please input your Password!'; -const signupNameInputError = 'Please input your name!'; -const signupEmailInputError = 'Please input your E-mail!'; -const signupValidEmailError = 'The input is not a valid E-mail!'; -const signupPasswordInputError = 'Please input your password!'; -const signupConfirmPasswordInputError = 'Please confirm your password!'; +const SIGNUP_NAME_INPUT_ERROR = 'Please input your name!'; +const SIGNUP_EMAIL_INPUT_ERROR = 'Please input your E-mail!'; +const SIGNUP_VALID_EMAIL_ERROR = 'The input is not a valid E-mail!'; +const SIGNUP_PASSWORD_INPUT_ERROR = 'Please input your password!'; +const SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR = 'Please confirm your password!'; export { - loginUsernameInputError, - loginPasswordInputError, - signupNameInputError, - signupEmailInputError, - signupValidEmailError, - signupPasswordInputError, - signupConfirmPasswordInputError + LOGIN_USERNAME_INPUT_ERROR, + LOGIN_PASSWORD_INPUT_ERROR, + SIGNUP_NAME_INPUT_ERROR, + SIGNUP_EMAIL_INPUT_ERROR, + SIGNUP_VALID_EMAIL_ERROR, + SIGNUP_PASSWORD_INPUT_ERROR, + SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR }; diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index 9458729..ea0a9dc 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -5,7 +5,7 @@ import './LandingPage.css'; import Paragraph from 'antd/lib/typography/Paragraph'; import LandingPageContent from './LandingPageContent'; import PageLayout from '../../Layout'; -import { landingPageContents, pageTitle } from '../constants'; +import { LANDING_PAGE_CONTENTS, pageTitle } from '../constants'; /** * Function for displaying the landing page @@ -16,13 +16,13 @@ import { landingPageContents, pageTitle } from '../constants'; const LandingPage = () => ( { - landingPageContents.map(landingPageContent => { + LANDING_PAGE_CONTENTS.map(landingPageContent => { const { paragraphText, isButtonPresent, @@ -38,17 +38,17 @@ const LandingPage = () => ( return ( ); }) diff --git a/components/LandingPage/constants.js b/components/LandingPage/constants.js index 18cd54b..4044417 100644 --- a/components/LandingPage/constants.js +++ b/components/LandingPage/constants.js @@ -1,40 +1,40 @@ /* eslint-disable max-len */ -const pageTitle = 'Home | Welcome to Help me'; // the title of the landing page +const PAGE_TITLE = 'Home | Welcome to Help me'; // the title of the landing page -const landingPageMainContentTitle = 'Help me Title'; +const LANDING_PAGE_MAIN_CONTENT_TITLE = 'Help me Title'; -const landingPageMainContentParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro vero'; +const LANDING_PAGE_MAIN_CONTENT_PARAGRAPH_TEXT = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro vero'; -const landingPageMainContentButtonText = 'Lets begin this Journey'; +const LANDING_PAGE_MAIN_CONTENT_BUTTON_TEXT = 'Lets begin this Journey'; -const landingPageLevel2ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro veroDeleniti porro vero'; +const LANDING_PAGE_LEVEL_2_PARAGRAPH_TEXT = 'Lorem ipsum dolor sit amet consectetur adipisicing elit.Deleniti porro veroDeleniti porro vero'; -const landingPageLevel2ButtonText = 'Lets begin this Journey'; +const LANDING_PAGE_LEVEL_2_BUTTON_TEXT = 'Lets begin this Journey'; -const landingPageLevel3ContentTitle = 'Lorem Ipsum dolor sit a '; +const LANDING_PAGE_LEVEL_3_CONTENT_TITLE = 'Lorem Ipsum dolor sit a '; -const landingPageLevel3ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; +const LANDING_PAGE_LEVEL_3_PARAGRAPH_TEXT = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; -const landingPageLevel4ContentTitle = 'Title 2'; +const LANDING_PAGE_LEVEL_4_CONTENT_TITLE = 'Title 2'; -const landingPageLevel4ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; +const LANDING_PAGE_LEVEL_4_PARAGRAPH_TEXT = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; -const landingPageLevel5ContentTitle = 'Lorem Ipsum dolor sit a '; +const LANDING_PAGE_LEVEL_5_CONTENT_TITLE = 'Lorem Ipsum dolor sit a '; -const landingPageLevel5ParagraphText = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero v Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; +const LANDING_PAGE_LEVEL_5_PARAGRAPH_TEXT = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero v Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti porro vero'; -const landingPageLevel5ButtonText = 'Create an Account'; +const LANDING_PAGE_LEVEL_5_BUTTON_TEXT = 'Create an Account'; -const landingPageContents = [ +const LANDING_PAGE_CONTENTS = [ { buttonLink: '/signup', - buttonText: landingPageMainContentButtonText, + buttonText: LANDING_PAGE_MAIN_CONTENT_BUTTON_TEXT, imageLink: '../../../static/connected.svg', isButtonPresent: true, isImagePresent: true, level: 1, - paragraphText: landingPageMainContentParagraphText, - title: landingPageMainContentTitle, + paragraphText: LANDING_PAGE_MAIN_CONTENT_PARAGRAPH_TEXT, + title: LANDING_PAGE_MAIN_CONTENT_TITLE, }, { columnSection: true, @@ -42,8 +42,8 @@ const landingPageContents = [ isButtonPresent: false, isImagePresent: true, level: 2, - paragraphText: landingPageLevel2ParagraphText, - title: landingPageLevel2ButtonText, + paragraphText: LANDING_PAGE_LEVEL_2_PARAGRAPH_TEXT, + title: LANDING_PAGE_LEVEL_2_BUTTON_TEXT, }, { @@ -51,31 +51,31 @@ const landingPageContents = [ isButtonPresent: false, isImagePresent: true, level: 3, - paragraphText: landingPageLevel3ParagraphText, + paragraphText: LANDING_PAGE_LEVEL_3_PARAGRAPH_TEXT, reverseSection: true, - title: landingPageLevel3ContentTitle, + title: LANDING_PAGE_LEVEL_3_CONTENT_TITLE, }, { isButtonPresent: false, isImagePresent: false, level: 2, - paragraphText: landingPageLevel4ParagraphText, - title: landingPageLevel4ContentTitle, + paragraphText: LANDING_PAGE_LEVEL_4_PARAGRAPH_TEXT, + title: LANDING_PAGE_LEVEL_4_CONTENT_TITLE, }, { buttonLink: '/signup', - buttonText: landingPageLevel5ButtonText, + buttonText: LANDING_PAGE_LEVEL_5_BUTTON_TEXT, imageLink: '../../../static/hangout.svg', isButtonPresent: true, isImagePresent: true, level: 3, - paragraphText: landingPageLevel5ParagraphText, + paragraphText: LANDING_PAGE_LEVEL_5_PARAGRAPH_TEXT, reverseSection: false, - title: landingPageLevel5ContentTitle, + title: LANDING_PAGE_LEVEL_5_CONTENT_TITLE, }, ]; export { - pageTitle, - landingPageContents + PAGE_TITLE, + LANDING_PAGE_CONTENTS }; diff --git a/components/Layout/components/NavHeader.jsx b/components/Layout/components/NavHeader.jsx index 5fcadb7..5e88ca9 100644 --- a/components/Layout/components/NavHeader.jsx +++ b/components/Layout/components/NavHeader.jsx @@ -6,7 +6,7 @@ import { } from 'antd'; import Link from 'next/link'; import PropTypes from 'prop-types'; -import { headerTitle, menuItems } from '../constants'; +import { HEADER_TITLE, MENU_ITEMS } from '../constants'; const { Header } = Layout; const { Search } = Input; @@ -40,7 +40,7 @@ function NavHeader(props) { rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" /> - {!title ? headerTitle : title} + {!title ? HEADER_TITLE : title} {/* navheader for mobile */}
@@ -81,7 +81,7 @@ function NavHeader(props) { className="layout_header-list" > { - menuItems.map(menuItem => { + MENU_ITEMS.map(menuItem => { const { key, href, text } = menuItem; return ( diff --git a/components/Layout/components/PageFooter.jsx b/components/Layout/components/PageFooter.jsx index 4ad1d61..6aa9689 100644 --- a/components/Layout/components/PageFooter.jsx +++ b/components/Layout/components/PageFooter.jsx @@ -1,7 +1,7 @@ import React from 'react'; import Link from 'next/link'; import { Layout } from 'antd'; -import { footerFirstColumn, footerSecondColumn } from '../constants'; +import { FOOTER_FIRST_COLUMN, FOOTER_SECOND_COLUMN } from '../constants'; import FooterListCreator from './FooterListCreator'; const { Content, Footer } = Layout; @@ -22,10 +22,10 @@ export default function PageFooter() { diff --git a/components/Layout/constants.js b/components/Layout/constants.js index 4fedfdc..2919101 100644 --- a/components/Layout/constants.js +++ b/components/Layout/constants.js @@ -1,7 +1,7 @@ // eslint-disable-next-line import/prefer-default-export -const headerTitle = 'Helpme | Connect with Friends'; // title of the header +const HEADER_TITLE = 'Helpme | Connect with Friends'; // title of the header -const menuItems = [ +const MENU_ITEMS = [ { href: '/', key: 1, @@ -17,7 +17,7 @@ const menuItems = [ }, ]; -const footerFirstColumn = [ +const FOOTER_FIRST_COLUMN = [ { href: '/#', text: 'Home', @@ -30,7 +30,7 @@ const footerFirstColumn = [ }, ]; -const footerSecondColumn = [ +const FOOTER_SECOND_COLUMN = [ { href: '/about-us', text: 'Security & Privacy', @@ -40,7 +40,7 @@ const footerSecondColumn = [ }, ]; -const sideBarMenuItems = [ +const SIDEBAR_MENU_ITEMS = [ { href: '/#', key: 1, @@ -60,5 +60,5 @@ const sideBarMenuItems = [ ]; export { - headerTitle, menuItems, footerFirstColumn, footerSecondColumn, sideBarMenuItems + HEADER_TITLE, MENU_ITEMS, FOOTER_FIRST_COLUMN, FOOTER_SECOND_COLUMN, SIDEBAR_MENU_ITEMS }; diff --git a/pages/login.js b/pages/login.js index e893e6c..34ebdaf 100644 --- a/pages/login.js +++ b/pages/login.js @@ -1,3 +1,3 @@ -import {Login} from '../components/Authentication'; +import { Login } from '../components/Authentication'; export default Login; From 59c1b6516dfad74dbf135d40d4d9a106f7c58b9f Mon Sep 17 00:00:00 2001 From: cimthog Date: Thu, 16 May 2019 15:24:53 +0100 Subject: [PATCH 033/151] finished CRUD operation for profile model --- server/controller/profile.contoller.js | 83 +++++++++++++++++++++++--- server/index.js | 20 +++---- server/routes/profile.js | 10 +++- 3 files changed, 93 insertions(+), 20 deletions(-) diff --git a/server/controller/profile.contoller.js b/server/controller/profile.contoller.js index 7371df4..818544a 100644 --- a/server/controller/profile.contoller.js +++ b/server/controller/profile.contoller.js @@ -33,22 +33,91 @@ exports.create = (req, res) => { }); }; -// // Find a single profile with a profileId -// exports.findOne = (req, res) => { +// Find a single profile with a profileId +exports.findOne = (req, res) => { + Profile.findById(req.params.profileId) + .then(profile => { + if (!profile) { + return res.status(404).send({ + message: `Profile not found with id ${req.params.profileId}`, + }); + } + res.send(profile); + }).catch(err => { + if (err.kind === 'ObjectId') { + return res.status(404).send({ + message: `Profile not found with id ${req.params.profileId}`, + }); + } + }); +}; -// }; +// Retrieve and return all notes from the database. +exports.findAll = (req, res) => { + Profile.find() + .then(notes => { + res.send(notes); + }).catch(err => { + res.status(500).send({ + message: err.message || 'Some error occurred while retrieving profiles.', + }); + }); +}; // Update a profile identified by the profileId in the request exports.update = (req, res) => { // Validate Request - if (!req.body.content) { + if (!req.body.city || !req.body.country || !req.body.email || !req.body.first_name || !req.body.last_name) { return res.status(400).send({ - message: 'Profile content can not be empty', + message: 'Details cannot be empty', }); } - // Find note and update it with the request body + // Find Profile and update it with the request body Profile.findByIdAndUpdate(req.params.profileId, { + city: req.body.city, + country: req.body.country, + email: req.body.email, + firstName: req.body.first_name, + lastName: req.body.last_name, + }, { new: true }) + .then(profile => { + if (!profile) { + return res.status(404).send({ + message: `Profile not found with id ${req.params.profileId}`, + }); + } + res.send(profile); + }).catch(err => { + if (err.kind === 'ObjectId') { + return res.status(404).send({ + message: `Profile not found with id ${req.params.profileId}`, + }); + } + return res.status(500).send({ + message: `Error updating profile with id ${req.params.profileId}`, + }); + }); +}; - }); +// Delete a profile with the specified profileId in the request +exports.delete = (req, res) => { + Profile.findByIdAndRemove(req.params.profileId) + .then(profile => { + if (!profile) { + return res.status(404).send({ + message: `Profile not found with id ${req.params.profileId}`, + }); + } + res.send({ message: 'Profile deleted successfully!' }); + }).catch(err => { + if (err.kind === 'ObjectId' || err.name === 'NotFound') { + return res.status(404).send({ + message: `Profile not found with id ${req.params.profileId}`, + }); + } + return res.status(500).send({ + message: `Could not delete profile with id ${req.params.profileId}`, + }); + }); }; diff --git a/server/index.js b/server/index.js index dc45df8..4f57b57 100644 --- a/server/index.js +++ b/server/index.js @@ -6,22 +6,18 @@ const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; const nextApp = next({ dev }); const handle = nextApp.getRequestHandler(); -const { MongoClient } = require('mongodb'); +const mongoose = require('mongoose'); + const api = require('./api'); // Configure DB -const uri = require('../config/keys').mongoURI; +const db = require('../config/keys').mongoURI; -const client = new MongoClient(uri, { useNewUrlParser: true }); -client.connect(err => { - if (err) { - console.log('Error occurred while connecting to MongoDB Atlas...\n', err); - } - console.log('Connected...'); - const collection = client.db('test').collection('devices'); - // perform actions on the collection object - client.close(); -}); +// Connect to MongoDB +mongoose + .connect(db, { useNewUrlParser: true }) // Let us remove that nasty deprecation warrning :) + .then(() => console.log('MongoDB Connected')) + .catch(err => console.log(err)); nextApp.prepare().then(() => { // express code here diff --git a/server/routes/profile.js b/server/routes/profile.js index cf382f2..ca1b6c1 100644 --- a/server/routes/profile.js +++ b/server/routes/profile.js @@ -3,7 +3,15 @@ const express = require('express'); const router = express.Router(); const Profile = require('../controller/profile.contoller'); +// Create a new Profile router.post('/create', Profile.create); -router.post('/profile/:profileId', Profile.update); +// Retrieve all profiles +router.get('/all', Profile.findAll); +// Retrieve a single Profile with profileId +router.get('/profile/:profileId', Profile.findOne); +// Update a Profile with profileId +router.put('/profile/:profileId', Profile.update); +// Delete a Profile with profileId +router.delete('/profile/:profileId', Profile.delete); module.exports = router; From a546e931dd759d00b4e192da2787f7a9311fd7a5 Mon Sep 17 00:00:00 2001 From: cimthog Date: Fri, 17 May 2019 00:47:27 +0100 Subject: [PATCH 034/151] made few changes --- server/controller/profile.contoller.js | 2 +- server/routes/profile.js | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/server/controller/profile.contoller.js b/server/controller/profile.contoller.js index 818544a..5b7dae0 100644 --- a/server/controller/profile.contoller.js +++ b/server/controller/profile.contoller.js @@ -52,7 +52,7 @@ exports.findOne = (req, res) => { }); }; -// Retrieve and return all notes from the database. +// Retrieve and return all profiles from the database. exports.findAll = (req, res) => { Profile.find() .then(notes => { diff --git a/server/routes/profile.js b/server/routes/profile.js index ca1b6c1..2031ea3 100644 --- a/server/routes/profile.js +++ b/server/routes/profile.js @@ -8,10 +8,10 @@ router.post('/create', Profile.create); // Retrieve all profiles router.get('/all', Profile.findAll); // Retrieve a single Profile with profileId -router.get('/profile/:profileId', Profile.findOne); +router.get('/:profileId', Profile.findOne); // Update a Profile with profileId -router.put('/profile/:profileId', Profile.update); +router.put('/:profileId', Profile.update); // Delete a Profile with profileId -router.delete('/profile/:profileId', Profile.delete); +router.delete('/:profileId', Profile.delete); module.exports = router; From 06e4274677646e7bbbbaf271e22b9196732c324e Mon Sep 17 00:00:00 2001 From: cimthog Date: Fri, 17 May 2019 00:59:40 +0100 Subject: [PATCH 035/151] removed unnecessary console.log --- server/controller/profile.contoller.js | 6 ++++-- server/index.js | 7 +++---- 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/server/controller/profile.contoller.js b/server/controller/profile.contoller.js index 5b7dae0..21f184a 100644 --- a/server/controller/profile.contoller.js +++ b/server/controller/profile.contoller.js @@ -4,7 +4,8 @@ import Profile from '../models/profile.model'; // eslint-disable-next-line consistent-return exports.create = (req, res) => { // Validate request - if (!req.body.city || !req.body.country || !req.body.email || !req.body.first_name || !req.body.last_name) { + if (!req.body.city || !req.body.country || !req.body.email + || !req.body.first_name || !req.body.last_name) { return res.status(400).send({ message: 'Please ensure you fill all fields', }); @@ -67,7 +68,8 @@ exports.findAll = (req, res) => { // Update a profile identified by the profileId in the request exports.update = (req, res) => { // Validate Request - if (!req.body.city || !req.body.country || !req.body.email || !req.body.first_name || !req.body.last_name) { + if (!req.body.city || !req.body.country || !req.body.email + || !req.body.first_name || !req.body.last_name) { return res.status(400).send({ message: 'Details cannot be empty', }); diff --git a/server/index.js b/server/index.js index 4f57b57..89391fa 100644 --- a/server/index.js +++ b/server/index.js @@ -15,9 +15,9 @@ const db = require('../config/keys').mongoURI; // Connect to MongoDB mongoose - .connect(db, { useNewUrlParser: true }) // Let us remove that nasty deprecation warrning :) - .then(() => console.log('MongoDB Connected')) - .catch(err => console.log(err)); + .connect(db, { useNewUrlParser: true }) + .then() + .catch(); nextApp.prepare().then(() => { // express code here @@ -34,6 +34,5 @@ nextApp.prepare().then(() => { ); app.listen(PORT, err => { if (err) throw err; - console.log(`Server ready at http://localhost:${PORT}`); }); }); From 25351ecc904a99357eee73e88fc2bc6d358ceb37 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Fri, 17 May 2019 12:42:41 +0100 Subject: [PATCH 036/151] fixed errors in the login and signup pages" --- .../components/Authentication.test.jsx | 3 +- .../Authentication/components/Login.jsx | 62 +++----- .../components/LoginInputItemGenerator.jsx | 31 ++++ .../Authentication/components/SignUp.jsx | 138 +++++++++--------- .../components/SignupInputItemGenerator.jsx | 40 +++++ components/Authentication/constants.js | 42 +++++- 6 files changed, 205 insertions(+), 111 deletions(-) create mode 100644 components/Authentication/components/LoginInputItemGenerator.jsx create mode 100644 components/Authentication/components/SignupInputItemGenerator.jsx diff --git a/components/Authentication/components/Authentication.test.jsx b/components/Authentication/components/Authentication.test.jsx index 982502d..5382b5d 100644 --- a/components/Authentication/components/Authentication.test.jsx +++ b/components/Authentication/components/Authentication.test.jsx @@ -1,8 +1,9 @@ import React from 'react'; import ReactDOM from 'react-dom'; import { Login, SignUp } from './index'; +import LoginInputItemGenerator from './LoginInputItemGenerator'; -describe('Login', () => { +describe('Authenticcation', () => { it('renders without crashing', () => { const div = document.createElement('div'); ReactDOM.render(, div); diff --git a/components/Authentication/components/Login.jsx b/components/Authentication/components/Login.jsx index d543344..268b0b7 100644 --- a/components/Authentication/components/Login.jsx +++ b/components/Authentication/components/Login.jsx @@ -1,20 +1,11 @@ /* eslint-disable react/jsx-no-literals */ import React from 'react'; -import { - Form, - Icon, - Input, - Button, - Typography -} from 'antd'; +import { Form, Button, Typography } from 'antd'; import 'antd/dist/antd.css'; import './Authentication.css'; import Router from 'next/router'; import LoginImage from '../../../static/login.svg'; -import { - loginUsernameInputError, - loginPasswordInputError -} from '../constants'; +import LoginInputItemGenerator from './LoginInputItemGenerator'; const { Title, Paragraph } = Typography; @@ -29,15 +20,29 @@ class NormalLoginForm extends React.Component { loading: false, } + /** + * function that is used to animate signup loading + * @function + * @return {Object} sets loading state to true + */ enterLoading = () => { this.setState({ loading: true }); } - // handles the submitting of the login form + /** + * function that is used to handle submit + * @function + * @return {Object} returns the user values + */ handleSubmit = e => { const { validateFields } = this.props.form; e.preventDefault(); - // validate error and simulate api response with settimeout + + /** + * function that is used to handle submit, This function helps to Validate the specified fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. + * @function + * @return {Object} returns the values of the form + */ validateFields((err, values) => { if (!err) { setTimeout(() => { @@ -50,6 +55,7 @@ class NormalLoginForm extends React.Component { render() { const { getFieldDecorator } = this.props.form; const { loading } = this.state; + return (
@@ -60,37 +66,15 @@ class NormalLoginForm extends React.Component {
Welcome Login to continue - - - { - getFieldDecorator('username', { - rules: [{ - message: loginUsernameInputError, - required: true, - }], - })( - } placeholder="Username" /> - ) - } - - - - {getFieldDecorator('password', { - rules: [{ - message: loginPasswordInputError, - required: true, - }], - })( - } type="password" placeholder="Password" /> - )} - - + {/* inputs for username and password */} + {LoginInputItemGenerator(getFieldDecorator)} + {/* buttons */} Forgot password - Or + or register now!
diff --git a/components/Authentication/components/LoginInputItemGenerator.jsx b/components/Authentication/components/LoginInputItemGenerator.jsx new file mode 100644 index 0000000..34a1b3f --- /dev/null +++ b/components/Authentication/components/LoginInputItemGenerator.jsx @@ -0,0 +1,31 @@ +import React from 'react'; +import { Form, Icon, Input } from 'antd'; + +import { + LOGIN_INPUTS +} from '../constants'; + +const LoginInputItemGenerator = decorator => LOGIN_INPUTS.map(input => { + const { + className, + field, + iconType, + placeholder, + rules, + inputType, + } = input; + + return ( + + { + decorator(field, { + rules, + })( + } placeholder={placeholder} type={inputType} /> + ) + } + + ); +}); + +export default LoginInputItemGenerator; diff --git a/components/Authentication/components/SignUp.jsx b/components/Authentication/components/SignUp.jsx index b54f537..f3e858d 100644 --- a/components/Authentication/components/SignUp.jsx +++ b/components/Authentication/components/SignUp.jsx @@ -12,37 +12,51 @@ import 'antd/dist/antd.css'; import './Authentication.css'; import Router from 'next/router'; import RegistrationImage from '../../../static/register.svg'; +import { FormItemGenerator, FormPasswordFieldGenerator } from './SignupInputItemGenerator'; import { - signupNameInputError, - signupEmailInputError, - signupValidEmailError, - signupPasswordInputError, - signupConfirmPasswordInputError + SIGNUP_PASSWORD_INPUT_ERROR, SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR, PASSWORD_COMPARE_ERROR_TEXT } from '../constants'; /** * function that is used to display the registration Page * @function - * @return {Object} the registtration page + * @return {Object} the registration page */ class RegistrationForm extends React.Component { state = { - // confirmDirty: false, + confirmDirty: false, autoCompleteResult: [], iconLoading: false, loading: false, + isAgreementChecked: false, }; + /** + * function that is used to animate signup loading + * @function + * @return {Object} sets loading state to true + */ enterLoading = () => { this.setState({ loading: true }); } + /** + * function that is used to handle submit + * @function + * @return {Object} returns the user values + */ handleSubmit = e => { e.preventDefault(); - // This function after validation, if the target field is not in visible area of form, form will be automatically scrolled to the target field area. - this.props.form.validateFieldsAndScroll((err, values) => { - if (!err) { - console.log('Received values of form: ', values); + const { validateFieldsAndScroll } = this.props.form; + const { isAgreementChecked } = this.state; + /** + * function that is used to handle submit, This function helps to Validate the specified fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. + * @function + * @return {Object} returns the values of the form + */ + validateFieldsAndScroll((err, values) => { + if (!err && isAgreementChecked === true) { + this.enterLoading(); setTimeout(() => { Router.push('/timeline'); }, 1000); @@ -50,30 +64,45 @@ class RegistrationForm extends React.Component { }); } + /** + * function that is used to handle checkbox agreement + * @function + * @return {Boolean} controls the state of of the checkbox + */ + handleCheckBox = e => { + this.setState({ + isAgreementChecked: e.target.checked, + }); + } + + /** + * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; + * @function + * @return {Object} sets the state of confirmDirty + */ handleConfirmBlur = e => { const { value } = e.target; - this.setState({ confirmDirty: this.state.confirmDirty || !!value }); - console.log('dirty state', this.state.confirmDirty); - console.log('value', !!value); + const { confirmDirty } = this.state; + this.setState({ confirmDirty: confirmDirty || !!value }); } + /** + * function that is used to also handle password validation, this compares the two password field; + * @function + * @param {Array} rule the validation rule for the input field + * @param {String} value the value passed on the input field + * @param {function} callback error message to display + * @return {function} error message to display + */ compareToFirstPassword = (rule, value, callback) => { const { form } = this.props; if (value && value !== form.getFieldValue('password')) { - callback('The Two passwords that you enter is inconsistent!'); + callback(PASSWORD_COMPARE_ERROR_TEXT); } else { callback(); } } - validateToNextPassword = (rule, value, callback) => { - const { form } = this.props; - if (value && this.state.confirmDirty) { - form.validateFields(['confirm'], { force: true }); // Validate the specified fields and get theirs values and errors. If you don't specify the parameter of fieldNames, you will validate all fields. - } - callback(); - } - render() { const { getFieldDecorator } = this.props.form; return ( @@ -84,54 +113,21 @@ class RegistrationForm extends React.Component {
- - Name  - - )} - > - {getFieldDecorator('name', { - rules: [{ required: true, message: signupNameInputError, whitespace: true }], - })( - - )} - - - - {getFieldDecorator('email', { - rules: [{ - type: 'email', message: signupValidEmailError, - }, { - required: true, message: signupEmailInputError, - }], - })( - - )} - - - {getFieldDecorator('password', { - rules: [{ - required: true, message: signupPasswordInputError, - }, { - validator: this.validateToNextPassword, - }], - })( - - )} - + { + FormItemGenerator(getFieldDecorator) + } + { + FormPasswordFieldGenerator(getFieldDecorator, this.FormPasswordFieldGenerator, + 'Password', 'password', SIGNUP_PASSWORD_INPUT_ERROR) + } {getFieldDecorator('confirm', { rules: [{ - required: true, message: signupConfirmPasswordInputError, + required: true, message: SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR, }, { validator: this.compareToFirstPassword, }], @@ -144,17 +140,19 @@ class RegistrationForm extends React.Component { {getFieldDecorator('agreement', { valuePropName: 'checked', })( - + I have read the - agreement + agreement )} - -
- already have an account, please - login + + {/*
*/} +
+ already have an account, please + login +
diff --git a/components/Authentication/components/SignupInputItemGenerator.jsx b/components/Authentication/components/SignupInputItemGenerator.jsx new file mode 100644 index 0000000..23d4f64 --- /dev/null +++ b/components/Authentication/components/SignupInputItemGenerator.jsx @@ -0,0 +1,40 @@ +import React from 'react'; +import { Form, Input } from 'antd'; +import { + SIGNUP_INPUTS, SIGNUP_PASSWORD_INPUT_ERROR +} from '../constants'; + +const FormItemGenerator = decorator => SIGNUP_INPUTS.map(input => { + const { + label, field, rules, type, + } = input; + return ( + + { + decorator(field, { + rules, + })( + + ) + } + + ); +}); + +const FormPasswordFieldGenerator = (decorator, validator, label, ruleType, message) => ( + + { + decorator(ruleType, { + rules: [{ + required: true, message: { message }, + }, { + validator: { validator }, + }], + })( + + )} + + +); + +export { FormItemGenerator, FormPasswordFieldGenerator }; diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index 2a5e639..0f82711 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -6,13 +6,53 @@ const SIGNUP_EMAIL_INPUT_ERROR = 'Please input your E-mail!'; const SIGNUP_VALID_EMAIL_ERROR = 'The input is not a valid E-mail!'; const SIGNUP_PASSWORD_INPUT_ERROR = 'Please input your password!'; const SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR = 'Please confirm your password!'; +const PASSWORD_COMPARE_ERROR_TEXT = 'The Two passwords that you enter is inconsistent!'; + +const LOGIN_INPUTS = [ + { + className: 'form_icon', + field: 'username', + iconType: 'user', + placeholder: 'Username', + rules: [{ + message: LOGIN_USERNAME_INPUT_ERROR, + required: true, + }], + }, { + className: 'form_icon', + field: 'password', + iconType: 'lock', + inputType: 'password', + placeholder: 'Username', + rules: [{ + message: LOGIN_PASSWORD_INPUT_ERROR, + required: true, + }], + }, +]; + +const SIGNUP_INPUTS = [ + { + field: 'name', + label: 'Name', + rules: [{ message: SIGNUP_NAME_INPUT_ERROR, required: true, whitespace: true }], + }, + { + field: 'email', + label: 'E-mail', + rules: [{ message: SIGNUP_VALID_EMAIL_ERROR, type: 'email' }, + { message: SIGNUP_EMAIL_INPUT_ERROR, required: true }], + }, +]; export { + LOGIN_INPUTS, + SIGNUP_INPUTS, LOGIN_USERNAME_INPUT_ERROR, LOGIN_PASSWORD_INPUT_ERROR, SIGNUP_NAME_INPUT_ERROR, SIGNUP_EMAIL_INPUT_ERROR, SIGNUP_VALID_EMAIL_ERROR, SIGNUP_PASSWORD_INPUT_ERROR, - SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR + SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR, PASSWORD_COMPARE_ERROR_TEXT }; From 1dfd1ea04992a8b7bc8da42e67fc97345317bbe7 Mon Sep 17 00:00:00 2001 From: cimthog Date: Fri, 17 May 2019 14:45:38 +0100 Subject: [PATCH 037/151] resolved eslint confilicts --- server/controller/profile.contoller.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/server/controller/profile.contoller.js b/server/controller/profile.contoller.js index 21f184a..61aceea 100644 --- a/server/controller/profile.contoller.js +++ b/server/controller/profile.contoller.js @@ -1,7 +1,6 @@ import Profile from '../models/profile.model'; // Create and Save a new Profile -// eslint-disable-next-line consistent-return exports.create = (req, res) => { // Validate request if (!req.body.city || !req.body.country || !req.body.email @@ -10,7 +9,6 @@ exports.create = (req, res) => { message: 'Please ensure you fill all fields', }); } - // Create a Profile const profile = new Profile({ city: req.body.city, @@ -32,6 +30,7 @@ exports.create = (req, res) => { message: err.message || 'Some error occurred while creating the Profile.', }); }); + return null; }; // Find a single profile with a profileId @@ -43,14 +42,16 @@ exports.findOne = (req, res) => { message: `Profile not found with id ${req.params.profileId}`, }); } - res.send(profile); + return res.send(profile); }).catch(err => { if (err.kind === 'ObjectId') { return res.status(404).send({ message: `Profile not found with id ${req.params.profileId}`, }); } + return null; }); + return null; }; // Retrieve and return all profiles from the database. @@ -89,7 +90,7 @@ exports.update = (req, res) => { message: `Profile not found with id ${req.params.profileId}`, }); } - res.send(profile); + return res.send(profile); }).catch(err => { if (err.kind === 'ObjectId') { return res.status(404).send({ @@ -100,6 +101,7 @@ exports.update = (req, res) => { message: `Error updating profile with id ${req.params.profileId}`, }); }); + return null; }; // Delete a profile with the specified profileId in the request @@ -111,7 +113,7 @@ exports.delete = (req, res) => { message: `Profile not found with id ${req.params.profileId}`, }); } - res.send({ message: 'Profile deleted successfully!' }); + return res.send({ message: 'Profile deleted successfully!' }); }).catch(err => { if (err.kind === 'ObjectId' || err.name === 'NotFound') { return res.status(404).send({ From 7f30d4659f92602263704a749d13eae89f373121 Mon Sep 17 00:00:00 2001 From: cimthog Date: Fri, 17 May 2019 14:50:34 +0100 Subject: [PATCH 038/151] removed empty test file --- tests/profile.test.js | 1 - 1 file changed, 1 deletion(-) delete mode 100644 tests/profile.test.js diff --git a/tests/profile.test.js b/tests/profile.test.js deleted file mode 100644 index 8b13789..0000000 --- a/tests/profile.test.js +++ /dev/null @@ -1 +0,0 @@ - From 247a07a5538f0fcbad1a572b7413bfd87ebd0f42 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Fri, 17 May 2019 17:31:37 +0100 Subject: [PATCH 039/151] modified User model and remove test folder --- jest-mongodb-config.js | 12 ------------ jest.config.js | 1 + models/User.js | 24 ++++++++++++----------- test/connection.js | 26 ------------------------- test/deleting_record_test.js | 32 ------------------------------- test/finding_records_test.js | 36 ----------------------------------- test/saving_records_test.js | 21 -------------------- test/updating_records_test.js | 32 ------------------------------- 8 files changed, 14 insertions(+), 170 deletions(-) delete mode 100644 jest-mongodb-config.js delete mode 100644 test/connection.js delete mode 100644 test/deleting_record_test.js delete mode 100644 test/finding_records_test.js delete mode 100644 test/saving_records_test.js delete mode 100644 test/updating_records_test.js diff --git a/jest-mongodb-config.js b/jest-mongodb-config.js deleted file mode 100644 index 235f5d7..0000000 --- a/jest-mongodb-config.js +++ /dev/null @@ -1,12 +0,0 @@ -module.exports = { - mongodbMemoryServerOptions: { - instance: { - dbName: 'jest', - }, - binary: { - version: '3.6.10', - skipMD5: true, - }, - autoStart: false, - }, -}; diff --git a/jest.config.js b/jest.config.js index 22c4ee7..886259c 100644 --- a/jest.config.js +++ b/jest.config.js @@ -18,3 +18,4 @@ module.exports = { '^.+\\.jsx?$': 'babel-jest', }, }; + diff --git a/models/User.js b/models/User.js index 6b7ba03..8c9b3da 100644 --- a/models/User.js +++ b/models/User.js @@ -2,26 +2,28 @@ const mongoose = require('mongoose'); const { Schema } = mongoose; const UserSchema = new Schema({ - name: { + // If there is an associated avatar it will show a placeholder avatar for images + avatar: { type: String, - required: true, + }, + date: { + default: Date.now, + type: Date, }, email: { + required: true, type: String, + }, + + name: { required: true, + type: String, }, + password: { - type: String, required: true, - }, - // If there is an associated avatar it will show a placeholder avatar for images - avatar: { type: String, }, - date: { - type: Date, - default: Date.now, - }, }); -module.exports = User = mongoose.model('users', UserSchema); +module.exports = mongoose.model('users', UserSchema); diff --git a/test/connection.js b/test/connection.js deleted file mode 100644 index 4abedf7..0000000 --- a/test/connection.js +++ /dev/null @@ -1,26 +0,0 @@ -const mongoose = require('mongoose'); -// Use es6 global promise to override mongoose promise because of deprecation -mongoose.Promise = global.Promise; -// Connect to the db before tests run -before(done => { - // connect to db - const db = require('../config/keys').mongoURI; - mongoose.connect(db); - mongoose.connection - .once('open', () => { - console.log('Connection made'); - done(); - }) - .on('error', error => { - console.log('Connection error:', error); - }); -}); - -// Using Another mocha 'hook' to drop the db before each test -// Drop the users collection before each test -beforeEach(done => { - // Drop the collection - mongoose.connection.collections.users.drop(() => { - done(); - }); -}); diff --git a/test/deleting_record_test.js b/test/deleting_record_test.js deleted file mode 100644 index aafeedd..0000000 --- a/test/deleting_record_test.js +++ /dev/null @@ -1,32 +0,0 @@ -const assert = require('assert'); -const User = require('../models/User'); - -// Describe tests -describe('Deleting records', () => { - // before each test, run this hook so that we can hv a data in db - let newUser; - beforeEach(done => { - // Create a new instance of 'User' model or record - newUser = new User({ - name: 'Ekpenyong', - email: 'ekpe@gmail.com', - password: 'pass123', - }); - - newUser.save().then(() => { - // done after the asynchronous req is complete - done(); - }); - }); - // Create tests - it('Delete one record from the database', done => { - // find frm the 'User' coll where name='Ekpenyong' - User.findOneAndRemove({ name: 'Ekpenyong' }).then(() => { - // check if the 'name' is removed & return null as result or response frm promise interface - User.findOne({ name: 'Ekpenyong' }).then(result => { - assert(result === null); - done(); - }); - }); - }); -}); diff --git a/test/finding_records_test.js b/test/finding_records_test.js deleted file mode 100644 index 2a04993..0000000 --- a/test/finding_records_test.js +++ /dev/null @@ -1,36 +0,0 @@ -const assert = require('assert'); -const User = require('../models/User'); -// Describe tests -describe('Finding records', () => { - // before each test, run this hook so that we can have data in db - let newUser; - beforeEach(done => { - // Create a new instance of 'Clients' model or record - newUser = new User({ - name: 'Rooney', - email: 'rud@gmail.com', - password: 'pass123', - }); - - newUser.save().then(() => { - assert(newUser.isNew === false); - // done after the asynchronous req is complete - done(); - }); - }); - // Create tests - it('Finds one record in the database', done => { - User.findOne({ name: 'Rooney' }).then(result => { - assert(result.name === 'Rooney'); - done(); - }); - }); - - // Find by id - it('Finds record by id in the database', done => { - User.findOne({ _id: newUser._id }).then(result => { - assert(result._id.toString() === newUser._id.toString()); - done(); - }); - }); -}); diff --git a/test/saving_records_test.js b/test/saving_records_test.js deleted file mode 100644 index 0c0d6cb..0000000 --- a/test/saving_records_test.js +++ /dev/null @@ -1,21 +0,0 @@ -const assert = require('assert'); -const User = require('../models/User'); - -// Describe tests -describe('Saving records', () => { - // Create tests - it('Saves a record to the database', done => { - // Create a new instance of 'Clients' model or record - const newUser = new User({ - name: 'Rod', - email: 'gaby@gmail.com', - password: 'pass123', - }); - newUser.save().then(() => { - // 'isNew' returns a Boolean, if it returns true it means the data has not been saved to the db - assert(newUser.isNew === false); - // done after the asynchronous req is complete - done(); - }); - }); -}); diff --git a/test/updating_records_test.js b/test/updating_records_test.js deleted file mode 100644 index 15215bc..0000000 --- a/test/updating_records_test.js +++ /dev/null @@ -1,32 +0,0 @@ -const assert = require('assert'); -const User = require('../models/User'); - -// Describe tests -describe('Updating records', () => { - // before each test, run this hook so that we can hv a data in db - let newUser; - beforeEach(done => { - // Create a new instance of 'User' model or record - newUser = new User({ - name: 'Clem', - email: 'cle@gmail.com', - password: 'pass123', - }); - newUser.save().then(() => { - // done after the asynchronous req is complete - done(); - }); - }); - // Create tests - it('Updates one record in the database', done => { - // find frm the 'User' coll and update where name='Ekpenyong' - // the 2nd argument is what we want to update to - User.findOneAndUpdate({ name: 'Clem' }, { name: 'Rooney' }).then(() => { - // find frm d User coll an 'id supplied by mongo' == a particular record's id - User.findOne({ _id: newUser._id }).then(res => { - assert(res.name === 'Rooney'); - done(); - }); - }); - }); -}); From b1770c4e7a8c8791ea83fb3eef0683d7d22a9654 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Fri, 17 May 2019 22:56:39 +0100 Subject: [PATCH 040/151] changed booleans to question format, added propTypes checking to LoginInputItemGenerator.jsx and fixed comments indentation --- components/Authentication/components/Login.jsx | 16 +++++++++------- .../components/LoginInputItemGenerator.jsx | 18 +++++++++++++++++- .../Authentication/components/SignUp.jsx | 16 ++++++++-------- 3 files changed, 34 insertions(+), 16 deletions(-) diff --git a/components/Authentication/components/Login.jsx b/components/Authentication/components/Login.jsx index 268b0b7..054f93f 100644 --- a/components/Authentication/components/Login.jsx +++ b/components/Authentication/components/Login.jsx @@ -10,7 +10,7 @@ import LoginInputItemGenerator from './LoginInputItemGenerator'; const { Title, Paragraph } = Typography; /** - * function that is used to display the Login Page + * function that is used to display the Login Page * @function * @return {Object} the login page */ @@ -21,7 +21,7 @@ class NormalLoginForm extends React.Component { } /** - * function that is used to animate signup loading + * function that is used to animate signup loading * @function * @return {Object} sets loading state to true */ @@ -30,7 +30,7 @@ class NormalLoginForm extends React.Component { } /** - * function that is used to handle submit + * function that is used to handle submit * @function * @return {Object} returns the user values */ @@ -39,10 +39,12 @@ class NormalLoginForm extends React.Component { e.preventDefault(); /** - * function that is used to handle submit, This function helps to Validate the specified fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. - * @function - * @return {Object} returns the values of the form - */ + * function that is used to handle submit, This function helps to Validate the + * specified fields and get theirs values and errors., if the target field is not in + * visible area of form, form will be automatically scrolled to the target field area. + * @function + * @return {Object} returns the values of the form + */ validateFields((err, values) => { if (!err) { setTimeout(() => { diff --git a/components/Authentication/components/LoginInputItemGenerator.jsx b/components/Authentication/components/LoginInputItemGenerator.jsx index 34a1b3f..ce3fc49 100644 --- a/components/Authentication/components/LoginInputItemGenerator.jsx +++ b/components/Authentication/components/LoginInputItemGenerator.jsx @@ -1,5 +1,8 @@ import React from 'react'; -import { Form, Icon, Input } from 'antd'; +import { + Form, Icon, Input, message +} from 'antd'; +import PropTypes from 'prop-types'; import { LOGIN_INPUTS @@ -29,3 +32,16 @@ const LoginInputItemGenerator = decorator => LOGIN_INPUTS.map(input => { }); export default LoginInputItemGenerator; + +LoginInputItemGenerator.propTypes = { + className: PropTypes.string, + field: PropTypes.string, + iconType: PropTypes.string, + inputType: PropTypes.string, + placeholder: PropTypes.string, + rules: PropTypes.arrayOf(PropTypes.shape({ + message: PropTypes.string.isRequired, + required: PropTypes.bool.isRequired, + })).isRequired, + +}; diff --git a/components/Authentication/components/SignUp.jsx b/components/Authentication/components/SignUp.jsx index f3e858d..eec8627 100644 --- a/components/Authentication/components/SignUp.jsx +++ b/components/Authentication/components/SignUp.jsx @@ -24,10 +24,10 @@ import { */ class RegistrationForm extends React.Component { state = { - confirmDirty: false, + isConfirmedDirty: false, autoCompleteResult: [], - iconLoading: false, - loading: false, + isIconLoading: false, + isLoading: false, isAgreementChecked: false, }; @@ -37,7 +37,7 @@ class RegistrationForm extends React.Component { * @return {Object} sets loading state to true */ enterLoading = () => { - this.setState({ loading: true }); + this.setState({ isLoading: true }); } /** @@ -78,12 +78,12 @@ class RegistrationForm extends React.Component { /** * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; * @function - * @return {Object} sets the state of confirmDirty + * @return {Object} sets the state of isConfirmedDirty */ handleConfirmBlur = e => { const { value } = e.target; - const { confirmDirty } = this.state; - this.setState({ confirmDirty: confirmDirty || !!value }); + const { isConfirmedDirty } = this.state; + this.setState({ isConfirmedDirty: isConfirmedDirty || !!value }); } /** @@ -147,7 +147,7 @@ class RegistrationForm extends React.Component { )} - + {/*
*/}
already have an account, please From e7b11dbc3f93bcedf9df7646bf6320d80cbb6c44 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Sat, 18 May 2019 04:03:48 +0100 Subject: [PATCH 041/151] fix doc indent --- .../Authentication/components/SignUp.jsx | 32 ++++++++++--------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/components/Authentication/components/SignUp.jsx b/components/Authentication/components/SignUp.jsx index eec8627..96e4342 100644 --- a/components/Authentication/components/SignUp.jsx +++ b/components/Authentication/components/SignUp.jsx @@ -41,7 +41,7 @@ class RegistrationForm extends React.Component { } /** - * function that is used to handle submit + * function that is used to handle submit * @function * @return {Object} returns the user values */ @@ -49,11 +49,13 @@ class RegistrationForm extends React.Component { e.preventDefault(); const { validateFieldsAndScroll } = this.props.form; const { isAgreementChecked } = this.state; + /** - * function that is used to handle submit, This function helps to Validate the specified fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. - * @function - * @return {Object} returns the values of the form - */ + * function that is used to handle submit, This function helps to Validate the specified + * fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. + * @function + * @return {Object} returns the values of the form + */ validateFieldsAndScroll((err, values) => { if (!err && isAgreementChecked === true) { this.enterLoading(); @@ -65,7 +67,7 @@ class RegistrationForm extends React.Component { } /** - * function that is used to handle checkbox agreement + * function that is used to handle checkbox agreement * @function * @return {Boolean} controls the state of of the checkbox */ @@ -76,7 +78,7 @@ class RegistrationForm extends React.Component { } /** - * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; + * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; * @function * @return {Object} sets the state of isConfirmedDirty */ @@ -87,13 +89,13 @@ class RegistrationForm extends React.Component { } /** - * function that is used to also handle password validation, this compares the two password field; - * @function - * @param {Array} rule the validation rule for the input field - * @param {String} value the value passed on the input field - * @param {function} callback error message to display - * @return {function} error message to display - */ + * function that is used to also handle password validation, this compares the two password field; + * @function + * @param {Array} rule the validation rule for the input field + * @param {String} value the value passed on the input field + * @param {function} callback error message to display + * @return {function} error message to display + */ compareToFirstPassword = (rule, value, callback) => { const { form } = this.props; if (value && value !== form.getFieldValue('password')) { @@ -123,7 +125,7 @@ class RegistrationForm extends React.Component { } {getFieldDecorator('confirm', { rules: [{ From 38f6aa6aefba22218277dbaa3640ac3217881a49 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Tue, 21 May 2019 15:58:58 +0100 Subject: [PATCH 042/151] created user registration route in the user-api-routes --- package.json | 2 ++ routes/api/users.js | 45 +++++++++++++++++++++++++++++++++++++++++++++ server/index.js | 16 ++++++++++------ 3 files changed, 57 insertions(+), 6 deletions(-) create mode 100644 routes/api/users.js diff --git a/package.json b/package.json index b76590c..cc75bb2 100644 --- a/package.json +++ b/package.json @@ -43,11 +43,13 @@ "antd": "^3.16.3", "auth0-js": "^9.10.2", "babel-jest": "^24.7.1", + "bcryptjs": "^2.4.3", "body-parser": "^1.19.0", "dotenv": "^7.0.0", "enzyme": "^3.9.0", "enzyme-adapter-react-16": "^1.12.1", "express": "^4.16.4", + "gravatar": "^1.8.0", "mongoose": "^5.5.4", "next": "^8.0.4", "prop-types": "^15.7.2", diff --git a/routes/api/users.js b/routes/api/users.js new file mode 100644 index 0000000..7b28a03 --- /dev/null +++ b/routes/api/users.js @@ -0,0 +1,45 @@ +const express = require('express'); +const gravatar = require('gravatar'); +const bcrypt = require('bcryptjs'); + +const router = express.Router(); + +// Bring in the User Model +const User = require('../../models/User'); + +// User Registration Route + +router.post('/register', async (req, res, next) => { + try { + // Check if the email coming in matches what is in the DB + const user = await User.findOne({ email: req.body.email }); + if (user) { + return res.status(400).json({ email: 'Email already exist' }); + } + const avatar = gravatar.url(req.body.email, { + d: 'mm', // Default + r: 'pg', // Rating + s: '200', // Size + }); + const newUser = new User({ + // create new user + avatar, + email: req.body.email, + name: req.body.name, + password: req.body.password, + }); + + // Hash Password + bcrypt.genSalt(10, (err, salt) => { + bcrypt.hash(newUser.password, salt, hash => { + if (err) throw err; + newUser.password = hash; + }); + }); + const userCreated = await newUser.save(); + return res.json(userCreated); + } catch (err) { + return next(err); + } +}); +module.exports = router; diff --git a/server/index.js b/server/index.js index e59a927..96a5767 100644 --- a/server/index.js +++ b/server/index.js @@ -1,6 +1,8 @@ const express = require('express'); +const mongoose = require('mongoose'); const next = require('next'); const bodyParser = require('body-parser'); +const users = require('../routes/api/users'); const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; @@ -11,20 +13,22 @@ const handle = nextApp.getRequestHandler(); // i don't want to delete it as i am not the one who coded it comment by @justiceotuya // Configure DB -// const db = require('../config/keys').mongoURI; +const db = require('../config/keys').mongoURI; +// Connect to MongoDB +mongoose.connect(db); nextApp.prepare().then(() => { // express code here const app = express(); // bodyParser Middleware app.use(bodyParser.json()); - app.use(bodyParser.urlencoded({ extended: true })); + app.use(bodyParser.urlencoded({ extended: false })); + + // Routes Middleware + app.use('/api/users', users); // next should handle all other routes except the ones specified. - app.get( - '*', - (req, res) => handle(req, res) - ); + app.get('*', (req, res) => handle(req, res)); app.listen(PORT, err => { if (err) throw err; // eslint-disable-next-line no-console From eb6e66343fdc653773021206edc9e30d92e14b7d Mon Sep 17 00:00:00 2001 From: uimarshall Date: Tue, 21 May 2019 16:40:33 +0100 Subject: [PATCH 043/151] fixed linting errors --- server/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/server/index.js b/server/index.js index 7bb8cc8..5b4aed4 100644 --- a/server/index.js +++ b/server/index.js @@ -35,7 +35,8 @@ nextApp.prepare().then(() => { app.get( '*', - (req, res) => handle(req, res) // next should handle all other routes except the ones specified. + // next should handle all other routes except the ones specified. + (req, res) => handle(req, res) ); app.listen(PORT, err => { From c8a4a943cf1522cb4ab6349c62ff432ecfd63b0e Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Tue, 21 May 2019 19:07:27 +0100 Subject: [PATCH 044/151] refactored the forms --- .../components/LoginInputItemGenerator.jsx | 26 +++- .../Authentication/components/SignUp.jsx | 138 ++++++------------ .../components/SignupInputItemGenerator.jsx | 91 ++++++++---- components/Authentication/constants.js | 105 +++++++++---- 4 files changed, 205 insertions(+), 155 deletions(-) diff --git a/components/Authentication/components/LoginInputItemGenerator.jsx b/components/Authentication/components/LoginInputItemGenerator.jsx index ce3fc49..31fd12d 100644 --- a/components/Authentication/components/LoginInputItemGenerator.jsx +++ b/components/Authentication/components/LoginInputItemGenerator.jsx @@ -8,10 +8,23 @@ import { LOGIN_INPUTS } from '../constants'; -const LoginInputItemGenerator = decorator => LOGIN_INPUTS.map(input => { +/** +* function that is used to also handle password validation, this compares the two password field; +* @function +* @param {string} className class of the input field +* @param {string} id id of the input field +* @param {string} iconType preceding icon of the input field +* @param {function} decorator a Two-way binding for form +* @param {string} placeholder placeholder of the input field +* @param {Object[]} rules rules for input validation +* @param {string} inputType type of the input element +* @return {function} input item of the form +*/ + +const LOGIN_INPUT_ITEM_GENERATOR = decorator => LOGIN_INPUTS.map(input => { const { className, - field, + id, iconType, placeholder, rules, @@ -19,9 +32,9 @@ const LoginInputItemGenerator = decorator => LOGIN_INPUTS.map(input => { } = input; return ( - + { - decorator(field, { + decorator(id, { rules, })( } placeholder={placeholder} type={inputType} /> @@ -31,9 +44,9 @@ const LoginInputItemGenerator = decorator => LOGIN_INPUTS.map(input => { ); }); -export default LoginInputItemGenerator; +export default LOGIN_INPUT_ITEM_GENERATOR; -LoginInputItemGenerator.propTypes = { +LOGIN_INPUT_ITEM_GENERATOR.propTypes = { className: PropTypes.string, field: PropTypes.string, iconType: PropTypes.string, @@ -43,5 +56,4 @@ LoginInputItemGenerator.propTypes = { message: PropTypes.string.isRequired, required: PropTypes.bool.isRequired, })).isRequired, - }; diff --git a/components/Authentication/components/SignUp.jsx b/components/Authentication/components/SignUp.jsx index 96e4342..4bed489 100644 --- a/components/Authentication/components/SignUp.jsx +++ b/components/Authentication/components/SignUp.jsx @@ -1,21 +1,15 @@ import React from 'react'; import { - Form, - Input, - Icon, - Checkbox, - Button, - AutoComplete, - Typography + Form } from 'antd'; import 'antd/dist/antd.css'; import './Authentication.css'; import Router from 'next/router'; import RegistrationImage from '../../../static/register.svg'; -import { FormItemGenerator, FormPasswordFieldGenerator } from './SignupInputItemGenerator'; import { - SIGNUP_PASSWORD_INPUT_ERROR, SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR, PASSWORD_COMPARE_ERROR_TEXT + SIGNUP_INPUTS } from '../constants'; +import SIGNUP_INPUT_GENERATOR from './SignupInputItemGenerator'; /** * function that is used to display the registration Page @@ -24,10 +18,10 @@ import { */ class RegistrationForm extends React.Component { state = { - isConfirmedDirty: false, + confirmDirty: false, autoCompleteResult: [], - isIconLoading: false, - isLoading: false, + iconLoading: false, + loading: false, isAgreementChecked: false, }; @@ -37,27 +31,26 @@ class RegistrationForm extends React.Component { * @return {Object} sets loading state to true */ enterLoading = () => { - this.setState({ isLoading: true }); + this.setState({ loading: true }); } /** - * function that is used to handle submit - * @function - * @return {Object} returns the user values - */ + * function that is used to handle submit + * @function + * @return {Object} returns the user values + */ handleSubmit = e => { e.preventDefault(); const { validateFieldsAndScroll } = this.props.form; - const { isAgreementChecked } = this.state; - /** - * function that is used to handle submit, This function helps to Validate the specified - * fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. - * @function - * @return {Object} returns the values of the form - */ + * function that is used to handle submit, This function helps to Validate the specified + * fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. + * @function + * @return {Object} returns the values of the form + */ validateFieldsAndScroll((err, values) => { - if (!err && isAgreementChecked === true) { + if (!err && values.agreement) { + console.log('Received values of form: ', values); this.enterLoading(); setTimeout(() => { Router.push('/timeline'); @@ -67,44 +60,45 @@ class RegistrationForm extends React.Component { } /** - * function that is used to handle checkbox agreement - * @function - * @return {Boolean} controls the state of of the checkbox - */ - handleCheckBox = e => { - this.setState({ - isAgreementChecked: e.target.checked, - }); - } - - /** - * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; - * @function - * @return {Object} sets the state of isConfirmedDirty - */ + * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; + * @function + * @return {Object} sets the state of isConfirmedDirty + */ handleConfirmBlur = e => { const { value } = e.target; - const { isConfirmedDirty } = this.state; - this.setState({ isConfirmedDirty: isConfirmedDirty || !!value }); + this.setState({ confirmDirty: this.state.confirmDirty || !!value }); + console.log('dirty state', this.state.confirmDirty); + console.log('value', !!value); } /** - * function that is used to also handle password validation, this compares the two password field; - * @function - * @param {Array} rule the validation rule for the input field - * @param {String} value the value passed on the input field - * @param {function} callback error message to display - * @return {function} error message to display - */ +* function that is used to also handle password validation, this compares the two password field; +* @function +* @param {Array} rule the validation rule for the input field +* @param {String} value the value passed on the input field +* @param {function} callback error message to display +* @return {function} error message to display +*/ compareToFirstPassword = (rule, value, callback) => { const { form } = this.props; if (value && value !== form.getFieldValue('password')) { - callback(PASSWORD_COMPARE_ERROR_TEXT); + callback('The Two passwords that you enter is inconsistent!'); } else { callback(); } } + /** +* function that is used to handle checkbox agreement +* @function +* @return {Boolean} controls the state of of the checkbox +*/ + handleCheckBox = e => { + this.setState({ + isAgreementChecked: e.target.checked, + }); + } + render() { const { getFieldDecorator } = this.props.form; return ( @@ -115,47 +109,12 @@ class RegistrationForm extends React.Component {
- - { - FormItemGenerator(getFieldDecorator) - } { - FormPasswordFieldGenerator(getFieldDecorator, this.FormPasswordFieldGenerator, - 'Password', 'password', SIGNUP_PASSWORD_INPUT_ERROR) + SIGNUP_INPUTS.map(input => { + const { actions = {}, items } = input; + return SIGNUP_INPUT_GENERATOR(actions, items, getFieldDecorator); + }) } - - - {getFieldDecorator('confirm', { - rules: [{ - required: true, message: SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR, - }, { - validator: this.compareToFirstPassword, - }], - })( - - )} - - - - {getFieldDecorator('agreement', { - valuePropName: 'checked', - })( - - I have read the - agreement - - )} - - - - {/*
*/} -
- already have an account, please - login -
-
@@ -164,5 +123,4 @@ class RegistrationForm extends React.Component { } const Signup = Form.create({ name: 'register' })(RegistrationForm); - export default Signup; diff --git a/components/Authentication/components/SignupInputItemGenerator.jsx b/components/Authentication/components/SignupInputItemGenerator.jsx index 23d4f64..89a7411 100644 --- a/components/Authentication/components/SignupInputItemGenerator.jsx +++ b/components/Authentication/components/SignupInputItemGenerator.jsx @@ -1,40 +1,73 @@ import React from 'react'; -import { Form, Input } from 'antd'; -import { - SIGNUP_INPUTS, SIGNUP_PASSWORD_INPUT_ERROR -} from '../constants'; +import { Form } from 'antd'; +import PropTypes from 'prop-types'; -const FormItemGenerator = decorator => SIGNUP_INPUTS.map(input => { +/** +* function that is used to also handle password validation, this compares the two password field; +* @function +* @param {function} actions actions attached to the input field for validation +* @param {Object} items the values passed on to the input field +* @param {function} decorator a Two-way binding for form +* @param {*} fieldChildren html element that complements the field +* @param {string} label label for the input field +* @param {string} id id of the input field +* @param {Object[]} rules rules for input validation +* @param {Boolean} hasOnBlur check if the input has an onChange function attached ot it +* @param {Boolean} hasOnChange check if the input has an onChange function attached ot it +* @param {function} valuePropName Props of checkbox +* @param {Boolean} isButton check if the form element is a button +* @param {Boolean} hasFieldChildren check if the input children +* @param {function} FieldType type of html form element +* @return {function} input item of the form +*/ +const SIGNUP_INPUT_GENERATOR = (actions, items, decorator) => { const { - label, field, rules, type, - } = input; + fieldChildren, label, id, rules, hasOnBlur, hasOnChange, valuePropName, isButton, hasFieldChildren, FieldType, + } = items; + const { onBlur, onChange } = actions; + const actionProps = { + onBlur: hasOnBlur && onBlur, + onChange: hasOnChange && onChange, + }; + return ( - + { - decorator(field, { - rules, - })( - + isButton ? ( + <> + Register +
+ {'already have an account, please '} + login +
+ ) + : decorator(id, { rules }, { valuePropName })( + + {hasFieldChildren ? fieldChildren : null} + + ) } ); -}); - -const FormPasswordFieldGenerator = (decorator, validator, label, ruleType, message) => ( - - { - decorator(ruleType, { - rules: [{ - required: true, message: { message }, - }, { - validator: { validator }, - }], - })( - - )} +}; - -); +export default SIGNUP_INPUT_GENERATOR; -export { FormItemGenerator, FormPasswordFieldGenerator }; +SIGNUP_INPUT_GENERATOR.propTypes = { + fieldChildren: PropTypes.instanceOf('span'), + FieldType: PropTypes.elementType, + hasFieldChildren: PropTypes.bool, + hasOnBlur: PropTypes.bool, + hasOnChange: PropTypes.bool, + id: PropTypes.string, + rules: PropTypes.arrayOf(PropTypes.shape({ + message: PropTypes.string.isRequired, + required: PropTypes.bool.isRequired, + type: PropTypes.string.isRequired, + whitespace: PropTypes.bool.isRequired, + })).isRequired, + isButton: PropTypes.bool, + label: PropTypes.string, + valuePropName: PropTypes.string, +}; diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index 0f82711..48a869c 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -1,31 +1,25 @@ -const LOGIN_USERNAME_INPUT_ERROR = 'Please input your username!'; -const LOGIN_PASSWORD_INPUT_ERROR = 'Please input your Password!'; - -const SIGNUP_NAME_INPUT_ERROR = 'Please input your name!'; -const SIGNUP_EMAIL_INPUT_ERROR = 'Please input your E-mail!'; -const SIGNUP_VALID_EMAIL_ERROR = 'The input is not a valid E-mail!'; -const SIGNUP_PASSWORD_INPUT_ERROR = 'Please input your password!'; -const SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR = 'Please confirm your password!'; -const PASSWORD_COMPARE_ERROR_TEXT = 'The Two passwords that you enter is inconsistent!'; +import { + Input, Checkbox, Button +} from 'antd'; const LOGIN_INPUTS = [ { className: 'form_icon', - field: 'username', iconType: 'user', + id: 'username', placeholder: 'Username', rules: [{ - message: LOGIN_USERNAME_INPUT_ERROR, + message: 'Please input your username!', required: true, }], }, { className: 'form_icon', - field: 'password', iconType: 'lock', + id: 'password', inputType: 'password', - placeholder: 'Username', + placeholder: 'Password', rules: [{ - message: LOGIN_PASSWORD_INPUT_ERROR, + message: 'Please input your Password!', required: true, }], }, @@ -33,26 +27,79 @@ const LOGIN_INPUTS = [ const SIGNUP_INPUTS = [ { - field: 'name', - label: 'Name', - rules: [{ message: SIGNUP_NAME_INPUT_ERROR, required: true, whitespace: true }], + items: { + FieldType: Input, + hasFieldChildren: false, + id: 'name', + label: 'Name', + rules: [{ message: 'Please input your name!', required: true, whitespace: true }], + }, + }, + + { + items: { + FieldType: Input, + hasFieldChildren: false, + label: 'E-mail', + id: 'email', + rules: [{ type: 'email', message: 'The input is not a valid E-mail!' }, { + required: true, message: 'Please input your E-mail!', + }], + }, }, + + { + items: { + FieldType: Input, + hasFieldChildren: false, + label: 'Password', + id: 'password', + rules: [{ required: true, message: 'The input is not a valid E-mail!' }, + // { validator: validateToNextPassword } + ], + }, + }, + { - field: 'email', - label: 'E-mail', - rules: [{ message: SIGNUP_VALID_EMAIL_ERROR, type: 'email' }, - { message: SIGNUP_EMAIL_INPUT_ERROR, required: true }], + items: { + FieldType: Input, + hasFieldChildren: false, + label: 'Confirm Password', + id: 'confirm', + rules: [{ required: true, message: 'Please confirm your password!' }, + // { validator: compareToFirstPassword }, + ], + }, }, + + { + items: { + FieldType: Checkbox, + hasFieldChildren: true, + id: 'agreement', + valuePropName: 'checked', + fieldChildren: ( + I have read and accepted the + agreement + ), + rules: [{ required: true, message: 'Please accept the agreement ' }, + ], + + }, + }, + + { + items: { + isButton: true, + FieldType: Button, + hasFieldChildren: true, + id: 'submit', + }, + }, + ]; export { LOGIN_INPUTS, - SIGNUP_INPUTS, - LOGIN_USERNAME_INPUT_ERROR, - LOGIN_PASSWORD_INPUT_ERROR, - SIGNUP_NAME_INPUT_ERROR, - SIGNUP_EMAIL_INPUT_ERROR, - SIGNUP_VALID_EMAIL_ERROR, - SIGNUP_PASSWORD_INPUT_ERROR, - SIGNUP_CONFIRM_PASSWORD_INPUT_ERROR, PASSWORD_COMPARE_ERROR_TEXT + SIGNUP_INPUTS }; From 11bc109ac0de23815d1744bf3694f9d4a649c08a Mon Sep 17 00:00:00 2001 From: uimarshall Date: Tue, 21 May 2019 21:46:53 +0100 Subject: [PATCH 045/151] remove duplicate lines of code in server/index.js and destructure req.body in routes/api/users.js --- routes/api/users.js | 7 ++++--- server/index.js | 9 --------- 2 files changed, 4 insertions(+), 12 deletions(-) diff --git a/routes/api/users.js b/routes/api/users.js index ab14b19..e5c035a 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -20,12 +20,13 @@ router.post('/register', async (req, res, next) => { r: 'pg', // Rating s: '200', // Size }); + const { email, name, password } = req.body; const newUser = new User({ // create new user avatar, - email: req.body.email, - name: req.body.name, - password: req.body.password, + email, + name, + password, }); // Hash Password diff --git a/server/index.js b/server/index.js index 5b4aed4..f19487f 100644 --- a/server/index.js +++ b/server/index.js @@ -30,15 +30,6 @@ nextApp.prepare().then(() => { // next should handle all other routes except the ones specified. app.get('*', (req, res) => handle(req, res)); - // Routes Middleware - app.use('/api/users', users); - - app.get( - '*', - // next should handle all other routes except the ones specified. - (req, res) => handle(req, res) - ); - app.listen(PORT, err => { if (err) throw err; // eslint-disable-next-line no-console From ed0535d02e1209fd24c5903691a8c2c64176b47d Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Tue, 21 May 2019 21:48:41 +0100 Subject: [PATCH 046/151] refactored the forms --- .../components/SignupInputItemGenerator.jsx | 53 +++++++++++++++---- components/Authentication/constants.js | 40 ++++++-------- 2 files changed, 58 insertions(+), 35 deletions(-) diff --git a/components/Authentication/components/SignupInputItemGenerator.jsx b/components/Authentication/components/SignupInputItemGenerator.jsx index 89a7411..f1a2062 100644 --- a/components/Authentication/components/SignupInputItemGenerator.jsx +++ b/components/Authentication/components/SignupInputItemGenerator.jsx @@ -1,5 +1,7 @@ import React from 'react'; -import { Form } from 'antd'; +import { + Form, Input, Checkbox, Button +} from 'antd'; import PropTypes from 'prop-types'; /** @@ -8,7 +10,6 @@ import PropTypes from 'prop-types'; * @param {function} actions actions attached to the input field for validation * @param {Object} items the values passed on to the input field * @param {function} decorator a Two-way binding for form -* @param {*} fieldChildren html element that complements the field * @param {string} label label for the input field * @param {string} id id of the input field * @param {Object[]} rules rules for input validation @@ -22,7 +23,7 @@ import PropTypes from 'prop-types'; */ const SIGNUP_INPUT_GENERATOR = (actions, items, decorator) => { const { - fieldChildren, label, id, rules, hasOnBlur, hasOnChange, valuePropName, isButton, hasFieldChildren, FieldType, + label, id, rules, hasOnBlur, hasOnChange, valuePropName, isButton, hasFieldChildren, FieldType, } = items; const { onBlur, onChange } = actions; const actionProps = { @@ -30,22 +31,53 @@ const SIGNUP_INPUT_GENERATOR = (actions, items, decorator) => { onChange: hasOnChange && onChange, }; + let Field; + let fieldChildren; + + switch (FieldType) { + case 'input': + Field = Input; + break; + case 'checkbox': + Field = Checkbox; + break; + case 'button': + Field = Button; + break; + default: + Field = null; + break; + } + + if (isButton && hasFieldChildren) { + fieldChildren = ( +
+ already have an account, please + login +
+ ); + } else if (FieldType === 'checkbox' && hasFieldChildren) { + fieldChildren = ( + + I have read and accepted the + agreement + + ); + } + return ( { isButton ? ( <> - Register -
- {'already have an account, please '} - login -
+ Register + {fieldChildren} ) : decorator(id, { rules }, { valuePropName })( - + {hasFieldChildren ? fieldChildren : null} - + ) } @@ -55,7 +87,6 @@ const SIGNUP_INPUT_GENERATOR = (actions, items, decorator) => { export default SIGNUP_INPUT_GENERATOR; SIGNUP_INPUT_GENERATOR.propTypes = { - fieldChildren: PropTypes.instanceOf('span'), FieldType: PropTypes.elementType, hasFieldChildren: PropTypes.bool, hasOnBlur: PropTypes.bool, diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index 48a869c..adf355c 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -1,7 +1,3 @@ -import { - Input, Checkbox, Button -} from 'antd'; - const LOGIN_INPUTS = [ { className: 'form_icon', @@ -28,7 +24,7 @@ const LOGIN_INPUTS = [ const SIGNUP_INPUTS = [ { items: { - FieldType: Input, + FieldType: 'input', hasFieldChildren: false, id: 'name', label: 'Name', @@ -38,23 +34,23 @@ const SIGNUP_INPUTS = [ { items: { - FieldType: Input, + FieldType: 'input', hasFieldChildren: false, - label: 'E-mail', id: 'email', - rules: [{ type: 'email', message: 'The input is not a valid E-mail!' }, { - required: true, message: 'Please input your E-mail!', + label: 'E-mail', + rules: [{ message: 'The input is not a valid E-mail!', type: 'email' }, { + message: 'Please input your E-mail!', required: true, }], }, }, { items: { - FieldType: Input, + FieldType: 'input', hasFieldChildren: false, - label: 'Password', id: 'password', - rules: [{ required: true, message: 'The input is not a valid E-mail!' }, + label: 'Password', + rules: [{ message: 'The input is not a valid E-mail!', required: true }, // { validator: validateToNextPassword } ], }, @@ -62,11 +58,11 @@ const SIGNUP_INPUTS = [ { items: { - FieldType: Input, + FieldType: 'input', hasFieldChildren: false, - label: 'Confirm Password', id: 'confirm', - rules: [{ required: true, message: 'Please confirm your password!' }, + label: 'Confirm Password', + rules: [{ message: 'Please confirm your password!', required: true }, // { validator: compareToFirstPassword }, ], }, @@ -74,26 +70,22 @@ const SIGNUP_INPUTS = [ { items: { - FieldType: Checkbox, + FieldType: 'checkbox', hasFieldChildren: true, id: 'agreement', - valuePropName: 'checked', - fieldChildren: ( - I have read and accepted the - agreement - ), - rules: [{ required: true, message: 'Please accept the agreement ' }, + rules: [{ message: 'Please accept the agreement ', required: true }, ], + valuePropName: 'checked', }, }, { items: { - isButton: true, - FieldType: Button, + FieldType: 'button', hasFieldChildren: true, id: 'submit', + isButton: true, }, }, From f1129a6baab480cffddec0b8ec4094aa07325a0a Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 08:19:35 +0100 Subject: [PATCH 047/151] fixed minor indentation and naming issue --- .../components/LoginInputItemGenerator.jsx | 6 +-- .../Authentication/components/SignUp.jsx | 48 +++++++++---------- .../components/SignupInputItemGenerator.jsx | 6 +-- 3 files changed, 29 insertions(+), 31 deletions(-) diff --git a/components/Authentication/components/LoginInputItemGenerator.jsx b/components/Authentication/components/LoginInputItemGenerator.jsx index 31fd12d..f2e04a4 100644 --- a/components/Authentication/components/LoginInputItemGenerator.jsx +++ b/components/Authentication/components/LoginInputItemGenerator.jsx @@ -21,7 +21,7 @@ import { * @return {function} input item of the form */ -const LOGIN_INPUT_ITEM_GENERATOR = decorator => LOGIN_INPUTS.map(input => { +const LoginInputItemGenerator = decorator => LOGIN_INPUTS.map(input => { const { className, id, @@ -44,9 +44,9 @@ const LOGIN_INPUT_ITEM_GENERATOR = decorator => LOGIN_INPUTS.map(input => { ); }); -export default LOGIN_INPUT_ITEM_GENERATOR; +export default LoginInputItemGenerator; -LOGIN_INPUT_ITEM_GENERATOR.propTypes = { +LoginInputItemGenerator.propTypes = { className: PropTypes.string, field: PropTypes.string, iconType: PropTypes.string, diff --git a/components/Authentication/components/SignUp.jsx b/components/Authentication/components/SignUp.jsx index 4bed489..6cb0d24 100644 --- a/components/Authentication/components/SignUp.jsx +++ b/components/Authentication/components/SignUp.jsx @@ -9,7 +9,7 @@ import RegistrationImage from '../../../static/register.svg'; import { SIGNUP_INPUTS } from '../constants'; -import SIGNUP_INPUT_GENERATOR from './SignupInputItemGenerator'; +import SignupInputGenerator from './SignupInputItemGenerator'; /** * function that is used to display the registration Page @@ -35,22 +35,22 @@ class RegistrationForm extends React.Component { } /** - * function that is used to handle submit - * @function - * @return {Object} returns the user values - */ + * function that is used to handle submit + * @function + * @return {Object} returns the user values + */ handleSubmit = e => { e.preventDefault(); const { validateFieldsAndScroll } = this.props.form; + /** - * function that is used to handle submit, This function helps to Validate the specified - * fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. - * @function - * @return {Object} returns the values of the form - */ + * function that is used to handle submit, This function helps to Validate the specified + * fields and get theirs values and errors., if the target field is not in visible area of form, form will be automatically scrolled to the target field area. + * @function + * @return {Object} returns the values of the form + */ validateFieldsAndScroll((err, values) => { if (!err && values.agreement) { - console.log('Received values of form: ', values); this.enterLoading(); setTimeout(() => { Router.push('/timeline'); @@ -60,25 +60,23 @@ class RegistrationForm extends React.Component { } /** - * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; - * @function - * @return {Object} sets the state of isConfirmedDirty - */ + * function that is used to handle password validation, this fires when the first password field has been filled and has lost focus. this will help in comparing the password in that field to the next input field; + * @function + * @return {Object} sets the state of isConfirmedDirty + */ handleConfirmBlur = e => { const { value } = e.target; this.setState({ confirmDirty: this.state.confirmDirty || !!value }); - console.log('dirty state', this.state.confirmDirty); - console.log('value', !!value); } /** -* function that is used to also handle password validation, this compares the two password field; -* @function -* @param {Array} rule the validation rule for the input field -* @param {String} value the value passed on the input field -* @param {function} callback error message to display -* @return {function} error message to display -*/ + * function that is used to also handle password validation, this compares the two password field; + * @function + * @param {Array} rule the validation rule for the input field + * @param {String} value the value passed on the input field + * @param {function} callback error message to display + * @return {function} error message to display + */ compareToFirstPassword = (rule, value, callback) => { const { form } = this.props; if (value && value !== form.getFieldValue('password')) { @@ -112,7 +110,7 @@ class RegistrationForm extends React.Component { { SIGNUP_INPUTS.map(input => { const { actions = {}, items } = input; - return SIGNUP_INPUT_GENERATOR(actions, items, getFieldDecorator); + return SignupInputGenerator(actions, items, getFieldDecorator); }) } diff --git a/components/Authentication/components/SignupInputItemGenerator.jsx b/components/Authentication/components/SignupInputItemGenerator.jsx index f1a2062..1cb35e9 100644 --- a/components/Authentication/components/SignupInputItemGenerator.jsx +++ b/components/Authentication/components/SignupInputItemGenerator.jsx @@ -21,7 +21,7 @@ import PropTypes from 'prop-types'; * @param {function} FieldType type of html form element * @return {function} input item of the form */ -const SIGNUP_INPUT_GENERATOR = (actions, items, decorator) => { +const SignupInputGenerator = (actions, items, decorator) => { const { label, id, rules, hasOnBlur, hasOnChange, valuePropName, isButton, hasFieldChildren, FieldType, } = items; @@ -84,9 +84,9 @@ const SIGNUP_INPUT_GENERATOR = (actions, items, decorator) => { ); }; -export default SIGNUP_INPUT_GENERATOR; +export default SignupInputGenerator; -SIGNUP_INPUT_GENERATOR.propTypes = { +SignupInputGenerator.propTypes = { FieldType: PropTypes.elementType, hasFieldChildren: PropTypes.bool, hasOnBlur: PropTypes.bool, From 61ef2d32ac52eb0a48410df2655bcaa4b5121c95 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Wed, 22 May 2019 09:52:51 +0100 Subject: [PATCH 048/151] put destructuring on line 13 in routes/api/users.js and modified error message for already used email --- routes/api/users.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/routes/api/users.js b/routes/api/users.js index e5c035a..6c44f99 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -10,17 +10,18 @@ const User = require('../../models/User'); // User Registration Route router.post('/register', async (req, res, next) => { try { + const { email, name, password } = req.body; // Check if the email coming in matches what is in the DB - const user = await User.findOne({ email: req.body.email }); + const user = await User.findOne({ email }); if (user) { - return res.status(400).json({ email: 'Email already exist' }); + return res.status(400).json({ message: `${email} already exist` }); } - const avatar = gravatar.url(req.body.email, { + const avatar = gravatar.url(email, { d: 'mm', // Default r: 'pg', // Rating s: '200', // Size }); - const { email, name, password } = req.body; + const newUser = new User({ // create new user avatar, From 6483de41d2d88bbd6cd5418643f977e8a1d31c31 Mon Sep 17 00:00:00 2001 From: cimthog Date: Wed, 22 May 2019 10:55:31 +0100 Subject: [PATCH 049/151] fixed path --- models/profile.model.js | 46 +++++++++++++++ routes/api/profile.js | 122 ++++++++++++++++++++++++++++++++++++++++ server/index.js | 13 +++++ 3 files changed, 181 insertions(+) create mode 100644 models/profile.model.js create mode 100644 routes/api/profile.js diff --git a/models/profile.model.js b/models/profile.model.js new file mode 100644 index 0000000..14a3a48 --- /dev/null +++ b/models/profile.model.js @@ -0,0 +1,46 @@ +const mongoose = require('mongoose'); + +const { Schema } = mongoose; + +const profileSchema = new Schema({ + city: { + required: true, + type: String, + }, + country: { + required: true, + type: String, + }, + email: { + lowercase: true, + required: true, + type: String, + unique: true, + }, + firstName: { + required: true, + type: String, + }, + followers: { + default: 0, + type: Number, + }, + following: { + default: 0, + type: Number, + }, + groups: { + default: 0, + type: Number, + }, + image: { + contentType: String, + data: Buffer, + }, + lastName: { + required: true, + type: String, + }, +}); + +module.exports = mongoose.model('Profile', profileSchema); diff --git a/routes/api/profile.js b/routes/api/profile.js new file mode 100644 index 0000000..c450e4b --- /dev/null +++ b/routes/api/profile.js @@ -0,0 +1,122 @@ +const express = require('express'); + +const router = express.Router(); +const Profile = require('../../models/profile.model'); + +// Create a new Profile +router.post('/new', async (req, res) => { + const { + city, country, email, firstName, lastName, + } = req.body; + + // Validate request + if (!city || !country || !email || !firstName || !lastName) { + return res.json({ + message: 'Please ensure you fill all fields', + }); + } + // create new profile + const profile = new Profile({ + city, + country, + email, + firstName, + lastName, + }); + // Save Profile in the database + try { + const newProfile = await profile.save(); + return res.json({ + message: 'profile successfully created', + profile: newProfile, + }); + } catch (err) { + return err; + } +}); + +// Retrieve all profiles +router.get('/all', async (req, res) => { + try { + const profiles = await Profile.find(); + if (!profiles) { + return res.status(404).json({ + message: 'No Profile found', + }); + } + return res.json(profiles); + } catch (err) { + return err; + } +}); + +// Retrieve a single Profile with profileId +router.get('/:profileId', async (req, res) => { + const { profileId } = req.params; + try { + const profile = await Profile.findById(profileId); + if (!profile) { + return res.status(404).json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.json(profile); + } catch (err) { + if (err.kind === 'ObjectId') { + return res.json({ + message: `Profile not found with id ${profileId}`, + }); + } + } + return null; +}); +// Update a Profile with profileId +router.put('/:profileId', async (req, res) => { + const { + city, country, email, firstName, lastName, + } = req.body; + const { profileId } = req.params; + const profile = new Profile({ + city, + country, + email, + firstName, + lastName, + }); + try { + const updatedProfile = await Profile.findByIdAndUpdate(profileId, profile, { new: true }); + if (!updatedProfile) { + return res.json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.json(updatedProfile); + } catch (err) { + if (err.kind === 'ObjectId') { + return res.status(404).json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.status(500).json({ + message: `Error updating profile with id ${profileId}`, + }); + } +}); + +// Delete a Profile with profileId +router.delete('/:profileId', async (req, res) => { + const { profileId } = req.params; + try { + const profile = await Profile.findByIdAndDelete(profileId); + if (!profile) { + return res.json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.json({ message: 'Profile deleted successfully!' }); + } catch (err) { + return err; + } +}); + +module.exports = router; diff --git a/server/index.js b/server/index.js index 89391fa..fc41ccc 100644 --- a/server/index.js +++ b/server/index.js @@ -1,6 +1,8 @@ const express = require('express'); const next = require('next'); const bodyParser = require('body-parser'); +const mongoose = require('mongoose'); +const api = require('../routes/api/profile'); const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; @@ -13,11 +15,15 @@ const api = require('./api'); // Configure DB const db = require('../config/keys').mongoURI; +<<<<<<< HEAD // Connect to MongoDB mongoose .connect(db, { useNewUrlParser: true }) .then() .catch(); +======= +mongoose.connect(db, { useNewUrlParser: true }); +>>>>>>> b3ad535... refactored code nextApp.prepare().then(() => { // express code here @@ -25,8 +31,15 @@ nextApp.prepare().then(() => { app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); +<<<<<<< HEAD app.use('/api', api); +======= + // Routes middleware + app.use('/api/profile', api); + + // next should handle all other routes except the ones specified. +>>>>>>> b3ad535... refactored code app.get( '*', // eslint-disable-next-line max-len From e64dbd3540ffdbbef05426c1a93c29b98d6fe416 Mon Sep 17 00:00:00 2001 From: cimthog Date: Wed, 22 May 2019 10:55:31 +0100 Subject: [PATCH 050/151] merged files --- server/index.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/server/index.js b/server/index.js index fc41ccc..7cefe87 100644 --- a/server/index.js +++ b/server/index.js @@ -15,6 +15,7 @@ const api = require('./api'); // Configure DB const db = require('../config/keys').mongoURI; +<<<<<<< HEAD <<<<<<< HEAD // Connect to MongoDB mongoose @@ -24,6 +25,9 @@ mongoose ======= mongoose.connect(db, { useNewUrlParser: true }); >>>>>>> b3ad535... refactored code +======= +mongoose.connect(db, { useNewUrlParser: true }); +>>>>>>> b3ad535... refactored code nextApp.prepare().then(() => { // express code here @@ -31,10 +35,13 @@ nextApp.prepare().then(() => { app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); +<<<<<<< HEAD <<<<<<< HEAD app.use('/api', api); ======= +======= +>>>>>>> b3ad535... refactored code // Routes middleware app.use('/api/profile', api); From ba40879abb5a74afc4706248fa9b77c1dae9bbeb Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 11:42:14 +0100 Subject: [PATCH 051/151] added forget password page --- .../components/Authentication.test.jsx | 8 +- .../components/PasswordReset.jsx | 112 ++++++++++++++++++ components/Authentication/components/index.js | 3 +- components/Authentication/index.js | 4 +- .../LandingPage/components/LandingPage.jsx | 6 +- components/Layout/components/PageLayout.jsx | 4 +- pages/password_reset.js | 3 + static/forgot_password.svg | 1 + 8 files changed, 130 insertions(+), 11 deletions(-) create mode 100644 components/Authentication/components/PasswordReset.jsx create mode 100644 pages/password_reset.js create mode 100644 static/forgot_password.svg diff --git a/components/Authentication/components/Authentication.test.jsx b/components/Authentication/components/Authentication.test.jsx index 5382b5d..c8d062d 100644 --- a/components/Authentication/components/Authentication.test.jsx +++ b/components/Authentication/components/Authentication.test.jsx @@ -1,7 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import { Login, SignUp } from './index'; -import LoginInputItemGenerator from './LoginInputItemGenerator'; +import { Login, SignUp, PasswordReset } from './index'; describe('Authenticcation', () => { it('renders without crashing', () => { @@ -13,4 +12,9 @@ describe('Authenticcation', () => { const div = document.createElement('div'); ReactDOM.render(, div); }); + + it('renders without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); }); diff --git a/components/Authentication/components/PasswordReset.jsx b/components/Authentication/components/PasswordReset.jsx new file mode 100644 index 0000000..ef2643f --- /dev/null +++ b/components/Authentication/components/PasswordReset.jsx @@ -0,0 +1,112 @@ + +import React from 'react'; +import { + Form, + Input, + Button, + Typography, + notification +} from 'antd'; +import 'antd/dist/antd.css'; +import './Authentication.css'; +import Router from 'next/router'; +import ForgotPassword from '../../../static/forgot_password.svg'; + +import { + forgetPasswordNotificationTitle, + forgetPasswordNotificationDescription, + forgetPasswordEmailInputError, forgetPasswordEmailInputInstruction +} from '../constants'; + +const { Title, Paragraph } = Typography; + +/** + * function that is used to display the forget password Page + * + * @function + * @return {Object} the forget password page + */ +class PasswordResetForm extends React.Component { + state = { + loading: false, + iconLoading: false, + }; + + enterLoading = () => { + this.setState({ loading: true }); + } + + handleSubmit = e => { + e.preventDefault(); + // This function after validation, if the target field is not in visible area of form, form will be automatically scrolled to the target field area. + this.props.form.validateFieldsAndScroll((err, values) => { + if (!err) { + setTimeout(() => { + this.setState({ loading: false, values }); + this.openNotificationWithIcon('success', values.email); + }, 1000); + console.log('Received values of form: ', values.email); + } + }); + } + + close = () => { + Router.push('/login'); + }; + + openNotificationWithIcon = (type, email) => { + notification[type]({ + description: `${forgetPasswordNotificationDescription} ${email}`, + duration: 0, + message: + forgetPasswordNotificationTitle, + onClose: this.close, + }); + }; + + render() { + const { getFieldDecorator } = this.props.form; + return ( +
+
+ +
+ +
+
+ + {getFieldDecorator('email', { + rules: [{ + type: 'email', + message: forgetPasswordEmailInputError, + }, { + required: true, + message: forgetPasswordEmailInputInstruction, + }], + })( + + )} + + + + +
+ remember your password? + {' '} + login + +
+
+
+ ); + } +} + +const PasswordReset = Form.create({ name: 'register' })(PasswordResetForm); + +export default PasswordReset; diff --git a/components/Authentication/components/index.js b/components/Authentication/components/index.js index f1e8d33..d9e7d73 100644 --- a/components/Authentication/components/index.js +++ b/components/Authentication/components/index.js @@ -1,4 +1,5 @@ import Login from './Login'; import SignUp from './SignUp'; +import PasswordReset from './PasswordReset'; -export { Login, SignUp }; +export { Login, SignUp, PasswordReset }; diff --git a/components/Authentication/index.js b/components/Authentication/index.js index 76dd08f..19bb4b3 100644 --- a/components/Authentication/index.js +++ b/components/Authentication/index.js @@ -1,3 +1,3 @@ -import { Login, SignUp } from './components'; +import { Login, SignUp, PasswordReset } from './components'; -export { Login, SignUp }; +export { Login, SignUp, PasswordReset }; diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index ea0a9dc..198b63f 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -1,11 +1,9 @@ import React from 'react'; import 'antd/dist/antd.css'; -import { Layout, Divider } from 'antd'; import './LandingPage.css'; -import Paragraph from 'antd/lib/typography/Paragraph'; import LandingPageContent from './LandingPageContent'; import PageLayout from '../../Layout'; -import { LANDING_PAGE_CONTENTS, pageTitle } from '../constants'; +import { LANDING_PAGE_CONTENTS, PAGE_TITLE } from '../constants'; /** * Function for displaying the landing page @@ -19,7 +17,7 @@ const LandingPage = () => ( IsSiderPresent={false} isFooterPresent isAuthenticated={false} - title={pageTitle} + title={PAGE_TITLE} > { LANDING_PAGE_CONTENTS.map(landingPageContent => { diff --git a/components/Layout/components/PageLayout.jsx b/components/Layout/components/PageLayout.jsx index b8c2b22..2b7bc5d 100644 --- a/components/Layout/components/PageLayout.jsx +++ b/components/Layout/components/PageLayout.jsx @@ -6,7 +6,7 @@ import NavHeader from './NavHeader'; import Sidebar from './Sidebar'; import PageFooter from './PageFooter'; import './PageLayout.css'; -import { headerTitle } from '../constants'; +import { HEADER_TITLE } from '../constants'; const { Content } = Layout; /** @@ -26,7 +26,7 @@ export default function PageLayout(props) { return ( <> - + diff --git a/pages/password_reset.js b/pages/password_reset.js new file mode 100644 index 0000000..46dfd5e --- /dev/null +++ b/pages/password_reset.js @@ -0,0 +1,3 @@ +import { PasswordReset } from '../components/Authentication'; + +export default PasswordReset; diff --git a/static/forgot_password.svg b/static/forgot_password.svg new file mode 100644 index 0000000..ca51e0d --- /dev/null +++ b/static/forgot_password.svg @@ -0,0 +1 @@ +forgot password \ No newline at end of file From d6f70cd4896cdf4d677a3ad9d9788d3063cec6ff Mon Sep 17 00:00:00 2001 From: cimthog Date: Wed, 22 May 2019 11:50:08 +0100 Subject: [PATCH 052/151] removed conflicting file --- server/api.js | 9 -- server/controller/profile.contoller.js | 127 ------------------------- server/index.js | 30 ++---- server/models/profile.model.js | 44 --------- server/routes/profile.js | 17 ---- server/start.js | 7 -- 6 files changed, 6 insertions(+), 228 deletions(-) delete mode 100644 server/api.js delete mode 100644 server/controller/profile.contoller.js delete mode 100644 server/models/profile.model.js delete mode 100644 server/routes/profile.js delete mode 100644 server/start.js diff --git a/server/api.js b/server/api.js deleted file mode 100644 index 4056609..0000000 --- a/server/api.js +++ /dev/null @@ -1,9 +0,0 @@ -const express = require('express'); - -const Router = express.Router(); - -const Profile = require('./routes/profile'); - -Router.use('/profile', Profile); - -module.exports = Router; diff --git a/server/controller/profile.contoller.js b/server/controller/profile.contoller.js deleted file mode 100644 index 61aceea..0000000 --- a/server/controller/profile.contoller.js +++ /dev/null @@ -1,127 +0,0 @@ -import Profile from '../models/profile.model'; - -// Create and Save a new Profile -exports.create = (req, res) => { - // Validate request - if (!req.body.city || !req.body.country || !req.body.email - || !req.body.first_name || !req.body.last_name) { - return res.status(400).send({ - message: 'Please ensure you fill all fields', - }); - } - // Create a Profile - const profile = new Profile({ - city: req.body.city, - country: req.body.country, - email: req.body.email, - firstName: req.body.first_name, - lastName: req.body.last_name, - }); - - // Save Profile in the database - profile.save() - .then(data => { - res.status(200).send({ - message: 'profile successfully created', - profile: data, - }); - }).catch(err => { - res.status(500).send({ - message: err.message || 'Some error occurred while creating the Profile.', - }); - }); - return null; -}; - -// Find a single profile with a profileId -exports.findOne = (req, res) => { - Profile.findById(req.params.profileId) - .then(profile => { - if (!profile) { - return res.status(404).send({ - message: `Profile not found with id ${req.params.profileId}`, - }); - } - return res.send(profile); - }).catch(err => { - if (err.kind === 'ObjectId') { - return res.status(404).send({ - message: `Profile not found with id ${req.params.profileId}`, - }); - } - return null; - }); - return null; -}; - -// Retrieve and return all profiles from the database. -exports.findAll = (req, res) => { - Profile.find() - .then(notes => { - res.send(notes); - }).catch(err => { - res.status(500).send({ - message: err.message || 'Some error occurred while retrieving profiles.', - }); - }); -}; - -// Update a profile identified by the profileId in the request -exports.update = (req, res) => { - // Validate Request - if (!req.body.city || !req.body.country || !req.body.email - || !req.body.first_name || !req.body.last_name) { - return res.status(400).send({ - message: 'Details cannot be empty', - }); - } - - // Find Profile and update it with the request body - Profile.findByIdAndUpdate(req.params.profileId, { - city: req.body.city, - country: req.body.country, - email: req.body.email, - firstName: req.body.first_name, - lastName: req.body.last_name, - }, { new: true }) - .then(profile => { - if (!profile) { - return res.status(404).send({ - message: `Profile not found with id ${req.params.profileId}`, - }); - } - return res.send(profile); - }).catch(err => { - if (err.kind === 'ObjectId') { - return res.status(404).send({ - message: `Profile not found with id ${req.params.profileId}`, - }); - } - return res.status(500).send({ - message: `Error updating profile with id ${req.params.profileId}`, - }); - }); - return null; -}; - -// Delete a profile with the specified profileId in the request -exports.delete = (req, res) => { - Profile.findByIdAndRemove(req.params.profileId) - .then(profile => { - if (!profile) { - return res.status(404).send({ - message: `Profile not found with id ${req.params.profileId}`, - }); - } - return res.send({ message: 'Profile deleted successfully!' }); - }).catch(err => { - if (err.kind === 'ObjectId' || err.name === 'NotFound') { - return res.status(404).send({ - message: `Profile not found with id ${req.params.profileId}`, - }); - } - return res.status(500).send({ - message: `Could not delete profile with id ${req.params.profileId}`, - }); - }); -}; diff --git a/server/index.js b/server/index.js index 7cefe87..d1b0bde 100644 --- a/server/index.js +++ b/server/index.js @@ -8,51 +8,33 @@ const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; const nextApp = next({ dev }); const handle = nextApp.getRequestHandler(); -const mongoose = require('mongoose'); -const api = require('./api'); +// i need to comment the db declaration below else lint will not pass my code, +// i don't want to delete it as i am not the one who coded it comment by @justiceotuya // Configure DB const db = require('../config/keys').mongoURI; -<<<<<<< HEAD -<<<<<<< HEAD -// Connect to MongoDB -mongoose - .connect(db, { useNewUrlParser: true }) - .then() - .catch(); -======= -mongoose.connect(db, { useNewUrlParser: true }); ->>>>>>> b3ad535... refactored code -======= mongoose.connect(db, { useNewUrlParser: true }); ->>>>>>> b3ad535... refactored code nextApp.prepare().then(() => { // express code here const app = express(); + // bodyParser Middleware app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); -<<<<<<< HEAD -<<<<<<< HEAD - app.use('/api', api); - -======= -======= ->>>>>>> b3ad535... refactored code // Routes middleware app.use('/api/profile', api); // next should handle all other routes except the ones specified. ->>>>>>> b3ad535... refactored code app.get( '*', - // eslint-disable-next-line max-len - (req, res) => handle(req, res) // next should handle all other routes except the ones specified. + (req, res) => handle(req, res) ); app.listen(PORT, err => { if (err) throw err; + // eslint-disable-next-line no-console + console.log(`Server ready at http://localhost:${PORT}`); }); }); diff --git a/server/models/profile.model.js b/server/models/profile.model.js deleted file mode 100644 index d2054d5..0000000 --- a/server/models/profile.model.js +++ /dev/null @@ -1,44 +0,0 @@ -import { Schema, model } from 'mongoose'; - -const profileSchema = new Schema({ - city: { - required: true, - type: String, - }, - country: { - required: true, - type: String, - }, - email: { - lowercase: true, - required: true, - type: String, - unique: true, - }, - firstName: { - required: true, - type: String, - }, - followers: { - default: 0, - type: Number, - }, - following: { - default: 0, - type: Number, - }, - groups: { - default: 0, - type: Number, - }, - image: { - contentType: String, - data: Buffer, - }, - lastName: { - required: true, - type: String, - }, -}); - -module.exports = model('Profile', profileSchema); diff --git a/server/routes/profile.js b/server/routes/profile.js deleted file mode 100644 index 2031ea3..0000000 --- a/server/routes/profile.js +++ /dev/null @@ -1,17 +0,0 @@ -const express = require('express'); - -const router = express.Router(); -const Profile = require('../controller/profile.contoller'); - -// Create a new Profile -router.post('/create', Profile.create); -// Retrieve all profiles -router.get('/all', Profile.findAll); -// Retrieve a single Profile with profileId -router.get('/:profileId', Profile.findOne); -// Update a Profile with profileId -router.put('/:profileId', Profile.update); -// Delete a Profile with profileId -router.delete('/:profileId', Profile.delete); - -module.exports = router; diff --git a/server/start.js b/server/start.js deleted file mode 100644 index 194a247..0000000 --- a/server/start.js +++ /dev/null @@ -1,7 +0,0 @@ -// Transpile all code following this line with babel and use '@babel/preset-env' (aka ES6) preset. -require('@babel/register')({ - presets: ['@babel/preset-env'], -}); - -// Import the rest of our application. -module.exports = require('./index.js'); From a4a46ebd01105ffa15a0d44ca9e4c5170da5101d Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 12:31:34 +0100 Subject: [PATCH 053/151] added forget password page --- .../components/PasswordReset.jsx | 76 +++++++++++++------ components/Authentication/constants.js | 11 ++- 2 files changed, 61 insertions(+), 26 deletions(-) diff --git a/components/Authentication/components/PasswordReset.jsx b/components/Authentication/components/PasswordReset.jsx index ef2643f..f07f1f1 100644 --- a/components/Authentication/components/PasswordReset.jsx +++ b/components/Authentication/components/PasswordReset.jsx @@ -1,11 +1,10 @@ - +/* eslint-disable react/jsx-no-literals */ import React from 'react'; import { Form, Input, Button, - Typography, - notification + notification, Icon } from 'antd'; import 'antd/dist/antd.css'; import './Authentication.css'; @@ -13,59 +12,89 @@ import Router from 'next/router'; import ForgotPassword from '../../../static/forgot_password.svg'; import { - forgetPasswordNotificationTitle, - forgetPasswordNotificationDescription, - forgetPasswordEmailInputError, forgetPasswordEmailInputInstruction + FORGET_PASSWORD_NOTIFICATION_TITLE, + FORGET_PASSWORD_NOTIFICATION_DESCRIPTION, + FORGET_PASSWORD_EMAIL_INPUT_ERROR, + FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION } from '../constants'; -const { Title, Paragraph } = Typography; - /** * function that is used to display the forget password Page - * * @function * @return {Object} the forget password page */ class PasswordResetForm extends React.Component { state = { loading: false, - iconLoading: false, }; + /** + * function that is used to animate signup loading + * @function + * @return {Object} sets loading state to true + */ enterLoading = () => { this.setState({ loading: true }); } + /** + * function that is used to handle submit + * @function + * @return {Object} returns the user values + */ handleSubmit = e => { + const { validateFieldsAndScroll, resetFields } = this.props.form; e.preventDefault(); - // This function after validation, if the target field is not in visible area of form, form will be automatically scrolled to the target field area. - this.props.form.validateFieldsAndScroll((err, values) => { - if (!err) { + + /** + * function that is used to handle submit, This function helps to Validate the + * specified fields and get theirs values and errors., if the target field is not in + * visible area of form, form will be automatically scrolled to the target field area. + * @function + * @return {Object} returns the values of the form + */ + validateFieldsAndScroll((err, values) => { + if (!err && values !== '') { + this.setState({ loading: true }); setTimeout(() => { - this.setState({ loading: false, values }); this.openNotificationWithIcon('success', values.email); + this.setState({ loading: false, values }); + // resets the value on the input field + resetFields(); }, 1000); - console.log('Received values of form: ', values.email); } }); } + /** + * function that is used to close the message and redirect to the login page + * @function + * @return {Object} returns the values of the form + */ close = () => { Router.push('/login'); }; + /** + * function that is used to close the message and redirect to the login page + * @function + * @param {String} type this is the type of message (success, warning or failure) + * @param {String} email the email to whose password is been rest + * @return {Object} returns a messeage toast which prompt users + */ openNotificationWithIcon = (type, email) => { notification[type]({ - description: `${forgetPasswordNotificationDescription} ${email}`, + description: `${FORGET_PASSWORD_NOTIFICATION_DESCRIPTION} ${email}`, duration: 0, message: - forgetPasswordNotificationTitle, + FORGET_PASSWORD_NOTIFICATION_TITLE, onClose: this.close, }); }; render() { const { getFieldDecorator } = this.props.form; + const { loading } = this.state; return (
@@ -77,27 +106,24 @@ class PasswordResetForm extends React.Component { className="password-form" onSubmit={this.handleSubmit} > - + {getFieldDecorator('email', { rules: [{ + message: FORGET_PASSWORD_EMAIL_INPUT_ERROR, type: 'email', - message: forgetPasswordEmailInputError, }, { + message: FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION, required: true, - message: forgetPasswordEmailInputInstruction, }], })( - + } /> )} - +
remember your password? - {' '} login diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index adf355c..69c25e6 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -1,3 +1,8 @@ +const FORGET_PASSWORD_NOTIFICATION_TITLE = 'Link Sent'; +const FORGET_PASSWORD_NOTIFICATION_DESCRIPTION = 'The resent link has been sent to'; +const FORGET_PASSWORD_EMAIL_INPUT_ERROR = 'The input is not a valid E-mail !'; +const FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION = 'Please input your E-mail so that we can send your reset link!'; + const LOGIN_INPUTS = [ { className: 'form_icon', @@ -93,5 +98,9 @@ const SIGNUP_INPUTS = [ export { LOGIN_INPUTS, - SIGNUP_INPUTS + SIGNUP_INPUTS, + FORGET_PASSWORD_NOTIFICATION_TITLE, + FORGET_PASSWORD_NOTIFICATION_DESCRIPTION, + FORGET_PASSWORD_EMAIL_INPUT_ERROR, + FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION }; From 51192ade125cb1368f0483292fb69ad0fa740d76 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 12:34:33 +0100 Subject: [PATCH 054/151] added forget password page --- components/Authentication/constants.js | 1 + 1 file changed, 1 insertion(+) diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index 69c25e6..5860893 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -1,6 +1,7 @@ const FORGET_PASSWORD_NOTIFICATION_TITLE = 'Link Sent'; const FORGET_PASSWORD_NOTIFICATION_DESCRIPTION = 'The resent link has been sent to'; const FORGET_PASSWORD_EMAIL_INPUT_ERROR = 'The input is not a valid E-mail !'; +// eslint-disable-next-line max-len const FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION = 'Please input your E-mail so that we can send your reset link!'; const LOGIN_INPUTS = [ From a8ff5f49a18e20d96911b9b4fb16f1cfabd11cf8 Mon Sep 17 00:00:00 2001 From: cimthog Date: Wed, 22 May 2019 13:13:56 +0100 Subject: [PATCH 055/151] resolve conflicts --- models/profile.model.js | 46 +++++++++++++++ routes/api/profile.js | 122 ++++++++++++++++++++++++++++++++++++++++ server/index.js | 4 +- 3 files changed, 171 insertions(+), 1 deletion(-) create mode 100644 models/profile.model.js create mode 100644 routes/api/profile.js diff --git a/models/profile.model.js b/models/profile.model.js new file mode 100644 index 0000000..14a3a48 --- /dev/null +++ b/models/profile.model.js @@ -0,0 +1,46 @@ +const mongoose = require('mongoose'); + +const { Schema } = mongoose; + +const profileSchema = new Schema({ + city: { + required: true, + type: String, + }, + country: { + required: true, + type: String, + }, + email: { + lowercase: true, + required: true, + type: String, + unique: true, + }, + firstName: { + required: true, + type: String, + }, + followers: { + default: 0, + type: Number, + }, + following: { + default: 0, + type: Number, + }, + groups: { + default: 0, + type: Number, + }, + image: { + contentType: String, + data: Buffer, + }, + lastName: { + required: true, + type: String, + }, +}); + +module.exports = mongoose.model('Profile', profileSchema); diff --git a/routes/api/profile.js b/routes/api/profile.js new file mode 100644 index 0000000..5f5e994 --- /dev/null +++ b/routes/api/profile.js @@ -0,0 +1,122 @@ +const express = require('express'); + +const router = express.Router(); +const Profile = require('../../models/profile.model'); + +// Create a new Profile +router.post('/new', async (req, res) => { + const { + city, country, email, firstName, lastName, + } = req.body; + + // Validate request + if (!city || !country || !email || !firstName || !lastName) { + return res.json({ + message: 'Please ensure you fill all fields', + }); + } + // create new profile + const profile = new Profile({ + city, + country, + email, + firstName, + lastName, + }); + // Save Profile in the database + try { + const newProfile = await profile.save(); + return res.json({ + message: 'profile successfully created', + profile: newProfile, + }); + } catch (err) { + return err; + } +}); + +// Retrieve all profiles +router.get('/all', async (req, res) => { + try { + const profiles = await Profile.find(); + if (!profiles) { + return res.status(404).json({ + message: 'No Profile found', + }); + } + return res.json(profiles); + } catch (err) { + return err; + } +}); + +// Retrieve a single Profile with profileId +router.get('/:profileId', async (req, res) => { + const { profileId } = req.params; + try { + const profile = await Profile.findById(profileId); + if (!profile) { + return res.status(404).json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.json(profile); + } catch (err) { + if (err.kind === 'ObjectId') { + return res.json({ + message: `Profile not found with id ${profileId}`, + }); + } + } + return null; +}); +// Update a Profile with profileId +router.put('/:profileId', async (req, res) => { + const { + city, country, email, firstName, lastName, + } = req.body; + const { profileId } = req.params; + const profile = new Profile({ + city, + country, + email, + firstName, + lastName, + }); + try { + const updatedProfile = await Profile.findByIdAndUpdate(profileId, profile, { new: true }); + if (!updatedProfile) { + return res.json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.json(updatedProfile); + } catch (err) { + if (err.kind === 'ObjectId') { + return res.status(404).json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.status(500).json({ + message: `Error updating profile with id ${profileId}`, + }); + } +}); + +// Delete a Profile with profileId +router.delete('/:profileId', async (req, res) => { + const { profileId } = req.params; + try { + const profile = await Profile.findByIdAndDelete(profileId); + if (!profile) { + return res.json({ + message: `Profile not found with id ${profileId}`, + }); + } + return res.json({ message: 'Profile deleted successfully!' }); + } catch (err) { + return err; + } +}); + +module.exports = router; diff --git a/server/index.js b/server/index.js index f19487f..f2bb0a4 100644 --- a/server/index.js +++ b/server/index.js @@ -3,6 +3,7 @@ const mongoose = require('mongoose'); const next = require('next'); const bodyParser = require('body-parser'); const users = require('../routes/api/users'); +const profile = require('../routes/api/profile'); const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; @@ -15,7 +16,7 @@ const handle = nextApp.getRequestHandler(); // Configure DB const db = require('../config/keys').mongoURI; // Connect to MongoDB -mongoose.connect(db); +mongoose.connect(db, { useNewUrlParser: true }); nextApp.prepare().then(() => { // express code here @@ -26,6 +27,7 @@ nextApp.prepare().then(() => { // Routes Middleware app.use('/api/users', users); + app.use('/api/profile', profile); // next should handle all other routes except the ones specified. app.get('*', (req, res) => handle(req, res)); From 81359aa473bd5ffc99a91f8b8d3b1ababfb0e867 Mon Sep 17 00:00:00 2001 From: cimthog Date: Wed, 22 May 2019 13:26:02 +0100 Subject: [PATCH 056/151] resolved conflicts --- routes/api/profile.js | 4 ---- server/index.js | 5 ----- 2 files changed, 9 deletions(-) diff --git a/routes/api/profile.js b/routes/api/profile.js index ed2b732..5f5e994 100644 --- a/routes/api/profile.js +++ b/routes/api/profile.js @@ -23,11 +23,7 @@ router.post('/new', async (req, res) => { firstName, lastName, }); -<<<<<<< HEAD // Save Profile in the database -======= - // Save Profile in the database ->>>>>>> d6f70cd4896cdf4d677a3ad9d9788d3063cec6ff try { const newProfile = await profile.save(); return res.json({ diff --git a/server/index.js b/server/index.js index 513b322..922cf8e 100644 --- a/server/index.js +++ b/server/index.js @@ -2,13 +2,8 @@ const express = require('express'); const mongoose = require('mongoose'); const next = require('next'); const bodyParser = require('body-parser'); -<<<<<<< HEAD const users = require('../routes/api/users'); const profile = require('../routes/api/profile'); -======= -const mongoose = require('mongoose'); -const api = require('../routes/api/profile'); ->>>>>>> d6f70cd4896cdf4d677a3ad9d9788d3063cec6ff const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; From 1bfba616ddb69fc5786d90469ac1640286502b3d Mon Sep 17 00:00:00 2001 From: cimthog Date: Wed, 22 May 2019 13:32:12 +0100 Subject: [PATCH 057/151] resolved conflicts --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b759a88..e317d20 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "scripts": { "test": "jest", "lint": "eslint . --fix", - "dev": "node server/start.js", + "dev": "node server/index.js", "build": "next build", "start": "next start" }, From 353f44ba6645f5b1ebc8ff7bb3a13cdc4ca4cabe Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 21:09:57 +0100 Subject: [PATCH 058/151] fixed duplicate comment --- .gitignore | 3 +++ components/Authentication/components/PasswordReset.jsx | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/.gitignore b/.gitignore index 65611f7..31d9de1 100644 --- a/.gitignore +++ b/.gitignore @@ -84,3 +84,6 @@ typings/ # DynamoDB Local files .dynamodb/ + +# dummy data +data diff --git a/components/Authentication/components/PasswordReset.jsx b/components/Authentication/components/PasswordReset.jsx index f07f1f1..f038d54 100644 --- a/components/Authentication/components/PasswordReset.jsx +++ b/components/Authentication/components/PasswordReset.jsx @@ -76,7 +76,7 @@ class PasswordResetForm extends React.Component { }; /** - * function that is used to close the message and redirect to the login page + * function that is used to show info on successful password change * @function * @param {String} type this is the type of message (success, warning or failure) * @param {String} email the email to whose password is been rest From eb327a3ba417fab34e0cfd7686d6e3e714c1c789 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 21:21:49 +0100 Subject: [PATCH 059/151] moved strings to constatnt file --- components/Authentication/components/PasswordReset.jsx | 8 +++++--- components/Authentication/constants.js | 7 +++++-- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/components/Authentication/components/PasswordReset.jsx b/components/Authentication/components/PasswordReset.jsx index f038d54..56fb31e 100644 --- a/components/Authentication/components/PasswordReset.jsx +++ b/components/Authentication/components/PasswordReset.jsx @@ -15,7 +15,9 @@ import { FORGET_PASSWORD_NOTIFICATION_TITLE, FORGET_PASSWORD_NOTIFICATION_DESCRIPTION, FORGET_PASSWORD_EMAIL_INPUT_ERROR, - FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION + FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION, + PASSWORD_CHANGE_TEXT, + REMEMBER_PASSWORD_TEXT } from '../constants'; /** @@ -121,9 +123,9 @@ class PasswordResetForm extends React.Component { - +
- remember your password? + {REMEMBER_PASSWORD_TEXT} login diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index 5860893..c6e85ec 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -3,7 +3,8 @@ const FORGET_PASSWORD_NOTIFICATION_DESCRIPTION = 'The resent link has been sent const FORGET_PASSWORD_EMAIL_INPUT_ERROR = 'The input is not a valid E-mail !'; // eslint-disable-next-line max-len const FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION = 'Please input your E-mail so that we can send your reset link!'; - +const PASSWORD_CHANGE_TEXT = 'Request for Password Change'; +const REMEMBER_PASSWORD_TEXT = 'remember your password? '; const LOGIN_INPUTS = [ { className: 'form_icon', @@ -103,5 +104,7 @@ export { FORGET_PASSWORD_NOTIFICATION_TITLE, FORGET_PASSWORD_NOTIFICATION_DESCRIPTION, FORGET_PASSWORD_EMAIL_INPUT_ERROR, - FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION + FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION, + PASSWORD_CHANGE_TEXT, + REMEMBER_PASSWORD_TEXT }; From 82865ccf79877914315e3257831c8f91af15cfc6 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 21:22:43 +0100 Subject: [PATCH 060/151] moved strings to constatnt file --- components/Authentication/constants.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index c6e85ec..a28b0b6 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -83,7 +83,6 @@ const SIGNUP_INPUTS = [ rules: [{ message: 'Please accept the agreement ', required: true }, ], valuePropName: 'checked', - }, }, @@ -95,7 +94,6 @@ const SIGNUP_INPUTS = [ isButton: true, }, }, - ]; export { From 224bda6035cf057004f325dd794b6c0e5105d910 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 22 May 2019 21:34:56 +0100 Subject: [PATCH 061/151] made minor changes as regards to inline styles --- components/Authentication/components/Authentication.css | 3 +++ components/Authentication/components/PasswordReset.jsx | 5 ++--- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/components/Authentication/components/Authentication.css b/components/Authentication/components/Authentication.css index b37fad3..0490402 100644 --- a/components/Authentication/components/Authentication.css +++ b/components/Authentication/components/Authentication.css @@ -116,3 +116,6 @@ place-items: center; } } +.input-icon{ + color: rgba(0,0,0,.25); +} diff --git a/components/Authentication/components/PasswordReset.jsx b/components/Authentication/components/PasswordReset.jsx index 56fb31e..e2cb4d0 100644 --- a/components/Authentication/components/PasswordReset.jsx +++ b/components/Authentication/components/PasswordReset.jsx @@ -88,8 +88,7 @@ class PasswordResetForm extends React.Component { notification[type]({ description: `${FORGET_PASSWORD_NOTIFICATION_DESCRIPTION} ${email}`, duration: 0, - message: - FORGET_PASSWORD_NOTIFICATION_TITLE, + message: FORGET_PASSWORD_NOTIFICATION_TITLE, onClose: this.close, }); }; @@ -118,7 +117,7 @@ class PasswordResetForm extends React.Component { required: true, }], })( - } /> + } /> )} From 7f292448c786351b91b6f59f585d605d680e6ae6 Mon Sep 17 00:00:00 2001 From: cimthog Date: Wed, 22 May 2019 23:36:49 +0100 Subject: [PATCH 062/151] created a function for validation --- package.json | 3 ++- routes/api/profile.js | 20 +++++++++++++++---- server/index.js | 2 -- validation/is_empty.js | 6 ++++++ validation/profile.js | 45 ++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 69 insertions(+), 7 deletions(-) create mode 100644 validation/is_empty.js create mode 100644 validation/profile.js diff --git a/package.json b/package.json index e317d20..48a7b83 100644 --- a/package.json +++ b/package.json @@ -62,6 +62,7 @@ "react-dom": "^16.8.6", "react-test-renderer": "^16.8.6", "redux": "^4.0.1", - "redux-saga": "^1.0.2" + "redux-saga": "^1.0.2", + "validator": "^10.11.0" } } diff --git a/routes/api/profile.js b/routes/api/profile.js index 5f5e994..cd354b8 100644 --- a/routes/api/profile.js +++ b/routes/api/profile.js @@ -1,8 +1,11 @@ const express = require('express'); const router = express.Router(); + const Profile = require('../../models/profile.model'); +const validateInput = require('../../validation/profile'); + // Create a new Profile router.post('/new', async (req, res) => { const { @@ -10,10 +13,11 @@ router.post('/new', async (req, res) => { } = req.body; // Validate request - if (!city || !country || !email || !firstName || !lastName) { - return res.json({ - message: 'Please ensure you fill all fields', - }); + const { errors, isValid } = validateInput(req.body); + + // Check Validation + if (!isValid) { + return res.status(400).json(errors); } // create new profile const profile = new Profile({ @@ -76,6 +80,14 @@ router.put('/:profileId', async (req, res) => { city, country, email, firstName, lastName, } = req.body; const { profileId } = req.params; + + // Validate request + const { errors, isValid } = validateInput(req.body); + + // Check Validation + if (!isValid) { + return res.status(400).json(errors); + } const profile = new Profile({ city, country, diff --git a/server/index.js b/server/index.js index 922cf8e..f2bb0a4 100644 --- a/server/index.js +++ b/server/index.js @@ -18,8 +18,6 @@ const db = require('../config/keys').mongoURI; // Connect to MongoDB mongoose.connect(db, { useNewUrlParser: true }); -mongoose.connect(db, { useNewUrlParser: true }); - nextApp.prepare().then(() => { // express code here const app = express(); diff --git a/validation/is_empty.js b/validation/is_empty.js new file mode 100644 index 0000000..fb37b82 --- /dev/null +++ b/validation/is_empty.js @@ -0,0 +1,6 @@ +const isEmpty = value => value === undefined + || value === null + || (typeof value === 'object' && Object.keys(value).length === 0) + || (typeof value === 'string' && value.trim().length === 0); + +module.exports = isEmpty; diff --git a/validation/profile.js b/validation/profile.js new file mode 100644 index 0000000..a5363f3 --- /dev/null +++ b/validation/profile.js @@ -0,0 +1,45 @@ +const Validator = require('validator'); + +const isEmpty = require('./is_empty'); + +module.exports = function validateInput(data) { + const errors = {}; + + let { + city, country, email, firstName, lastName, + } = data; + city = !isEmpty(city) ? city : ''; + country = !isEmpty(country) ? country : ''; + email = !isEmpty(email) ? email : ''; + firstName = !isEmpty(firstName) ? firstName : ''; + lastName = !isEmpty(lastName) ? lastName : ''; + + if (Validator.isEmpty(country)) { + errors.country = 'Country field is required'; + } + + if (Validator.isEmpty(city)) { + errors.city = 'City field is required'; + } + + if (!Validator.isEmail(email)) { + errors.email = 'Email is invalid'; + } + + if (Validator.isEmpty(email)) { + errors.email = 'Email field is required'; + } + + if (Validator.isEmpty(lastName)) { + errors.password = 'Last Name field is required'; + } + + if (Validator.isEmpty(firstName)) { + errors.password = 'First Name field is required'; + } + + return { + errors, + isValid: isEmpty(errors), + }; +}; From 86016a84132ad1923ab766f0563d50661c721623 Mon Sep 17 00:00:00 2001 From: cimthog Date: Fri, 24 May 2019 14:25:20 +0100 Subject: [PATCH 063/151] check for empty entries in a better way --- routes/api/profile.js | 5 ----- validation/profile.js | 13 ++++++------- 2 files changed, 6 insertions(+), 12 deletions(-) diff --git a/routes/api/profile.js b/routes/api/profile.js index cd354b8..6ba0778 100644 --- a/routes/api/profile.js +++ b/routes/api/profile.js @@ -104,11 +104,6 @@ router.put('/:profileId', async (req, res) => { } return res.json(updatedProfile); } catch (err) { - if (err.kind === 'ObjectId') { - return res.status(404).json({ - message: `Profile not found with id ${profileId}`, - }); - } return res.status(500).json({ message: `Error updating profile with id ${profileId}`, }); diff --git a/validation/profile.js b/validation/profile.js index a5363f3..99dbe91 100644 --- a/validation/profile.js +++ b/validation/profile.js @@ -5,14 +5,13 @@ const isEmpty = require('./is_empty'); module.exports = function validateInput(data) { const errors = {}; - let { - city, country, email, firstName, lastName, + const { + city = '', + country = '', + email = '', + firstName = '', + lastName = '', } = data; - city = !isEmpty(city) ? city : ''; - country = !isEmpty(country) ? country : ''; - email = !isEmpty(email) ? email : ''; - firstName = !isEmpty(firstName) ? firstName : ''; - lastName = !isEmpty(lastName) ? lastName : ''; if (Validator.isEmpty(country)) { errors.country = 'Country field is required'; From 70a416b58ad75f0931db1934f12c65ebf04b168f Mon Sep 17 00:00:00 2001 From: uimarshall Date: Fri, 24 May 2019 15:08:07 +0100 Subject: [PATCH 064/151] implements auth0 and user login, logout route --- config/passport.js | 31 ++++++++++++++++++++++ lib/middleware/secure.js | 8 ++++++ package.json | 3 +++ routes/api/users.js | 56 ++++++++++++++++++++++++++++++++++++++++ server/index.js | 23 +++++++++++++++++ 5 files changed, 121 insertions(+) create mode 100644 config/passport.js create mode 100644 lib/middleware/secure.js diff --git a/config/passport.js b/config/passport.js new file mode 100644 index 0000000..f3bc6ae --- /dev/null +++ b/config/passport.js @@ -0,0 +1,31 @@ +const passport = require('passport'); +const Auth0Strategy = require('passport-auth0'); +const dotenv = require('dotenv'); + +dotenv.config(); + +// Configure Passport to use Auth0 +const strategy = new Auth0Strategy( + { + callbackURL: process.env.AUTH0_CALLBACK_URL || 'http://localhost:3000/api/users/callback', + clientID: process.env.AUTH0_CLIENT_ID, + clientSecret: process.env.AUTH0_CLIENT_SECRET, + domain: process.env.AUTH0_DOMAIN, + }, + (accessToken, refreshToken, extraParams, profile, done) => + // accessToken is the token to call Auth0 API (not needed in the most cases) + // extraParams.id_token has the JSON Web Token + // profile has all the information from the user + done(null, profile) +); + +passport.use(strategy); + +// You can use this section to keep a smaller payload +passport.serializeUser((user, done) => { + done(null, user); +}); + +passport.deserializeUser((user, done) => { + done(null, user); +}); diff --git a/lib/middleware/secure.js b/lib/middleware/secure.js new file mode 100644 index 0000000..a68538e --- /dev/null +++ b/lib/middleware/secure.js @@ -0,0 +1,8 @@ +// middleware to protect routes and ensure they are only accessible if logged in. +module.exports = () => function secured(req, res, next) { + if (req.user) { + return next(); + } + req.session.returnTo = req.originalUrl; + res.redirect('/login'); +}; diff --git a/package.json b/package.json index 048f9a3..ea3ff85 100644 --- a/package.json +++ b/package.json @@ -50,9 +50,12 @@ "enzyme": "^3.9.0", "enzyme-adapter-react-16": "^1.12.1", "express": "^4.16.4", + "express-session": "^1.16.1", "gravatar": "^1.8.0", "mongoose": "^5.5.4", "next": "^8.0.4", + "passport": "^0.4.0", + "passport-auth0": "^1.1.0", "prop-types": "^15.7.2", "react": "^16.8.6", "react-addons-test-utils": "^15.6.2", diff --git a/routes/api/users.js b/routes/api/users.js index 6c44f99..7e0edf1 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -1,7 +1,13 @@ const express = require('express'); const gravatar = require('gravatar'); const bcrypt = require('bcryptjs'); +const passport = require('passport'); +const dotenv = require('dotenv'); +const util = require('util'); +const { URL } = require('url'); +const querystring = require('querystring'); +dotenv.config(); const router = express.Router(); // Bring in the User Model @@ -44,4 +50,54 @@ router.post('/register', async (req, res, next) => { } }); +// Perform the login, after login Auth0 will redirect to callback +router.get( + '/login', + passport.authenticate('auth0', { + scope: 'openid email profile', + }), + (req, res) => { + res.redirect('/'); + } +); + +// Perform the final stage of authentication and redirect to previously requested URL or '/user' +router.get('/callback', (req, res, next) => { + passport.authenticate('auth0', (err, user, info) => { + if (err) { + return next(err); + } + if (!user) { + return res.redirect('/login'); + } + req.logIn(user, err => { + if (err) { + return next(err); + } + const { returnTo } = req.session; + delete req.session.returnTo; + res.redirect(returnTo || '/user'); + }); + })(req, res, next); +}); + +// Perform session logout and redirect to homepage +router.get('/logout', (req, res) => { + req.logout(); + + let returnTo = `${req.protocol}://${req.hostname}`; + const port = req.connection.localPort; + if (port !== undefined && port !== 80 && port !== 443) { + returnTo += `:${port}`; + } + const logoutURL = new URL(util.format('https://%s/logout', process.env.AUTH0_DOMAIN)); + const searchString = querystring.stringify({ + client_id: process.env.AUTH0_CLIENT_ID, + returnTo, + }); + logoutURL.search = searchString; + + res.redirect(logoutURL); +}); + module.exports = router; diff --git a/server/index.js b/server/index.js index f19487f..0d0a65e 100644 --- a/server/index.js +++ b/server/index.js @@ -1,6 +1,9 @@ const express = require('express'); const mongoose = require('mongoose'); const next = require('next'); +const dotenv = require('dotenv'); +const passport = require('passport'); +const session = require('express-session'); const bodyParser = require('body-parser'); const users = require('../routes/api/users'); @@ -9,6 +12,10 @@ const dev = process.env.NODE_DEV !== 'production'; const nextApp = next({ dev }); const handle = nextApp.getRequestHandler(); +// Load Environment variables +dotenv.config(); +require('../config/passport'); + // i need to comment the db declaration below else lint will not pass my code, // i don't want to delete it as i am not the one who coded it comment by @justiceotuya @@ -24,6 +31,22 @@ nextApp.prepare().then(() => { app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); + // config express-session + const sess = { + secret: 'CHANGE THIS TO A RANDOM SECRET', + cookie: {}, + resave: false, + saveUninitialized: true, + }; + + if (app.get('env') === 'production') { + sess.cookie.secure = true; // serve secure cookies, requires https + } + // Tell express app to use passport & session + app.use(passport.initialize()); + app.use(passport.session()); + app.use(session(sess)); + // Routes Middleware app.use('/api/users', users); From 7c1ba038f0e22236756026bd17f38934370d4864 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Fri, 24 May 2019 15:37:23 +0100 Subject: [PATCH 065/151] implements auth0 and user login, logout route --- config/passport.js | 1 + lib/middleware/secure.js | 2 +- routes/api/users.js | 3 ++- server/index.js | 2 +- 4 files changed, 5 insertions(+), 3 deletions(-) diff --git a/config/passport.js b/config/passport.js index f3bc6ae..faf12e2 100644 --- a/config/passport.js +++ b/config/passport.js @@ -16,6 +16,7 @@ const strategy = new Auth0Strategy( // accessToken is the token to call Auth0 API (not needed in the most cases) // extraParams.id_token has the JSON Web Token // profile has all the information from the user + done(null, profile) ); diff --git a/lib/middleware/secure.js b/lib/middleware/secure.js index a68538e..aedf4e7 100644 --- a/lib/middleware/secure.js +++ b/lib/middleware/secure.js @@ -1,5 +1,5 @@ // middleware to protect routes and ensure they are only accessible if logged in. -module.exports = () => function secured(req, res, next) { +module.exports = () => async (req, res, next) => { if (req.user) { return next(); } diff --git a/routes/api/users.js b/routes/api/users.js index 7e0edf1..18b892b 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -63,7 +63,8 @@ router.get( // Perform the final stage of authentication and redirect to previously requested URL or '/user' router.get('/callback', (req, res, next) => { - passport.authenticate('auth0', (err, user, info) => { + passport.authenticate('auth0', (err, user) => { + // console.log(info); if (err) { return next(err); } diff --git a/server/index.js b/server/index.js index 0d0a65e..c287bc7 100644 --- a/server/index.js +++ b/server/index.js @@ -33,9 +33,9 @@ nextApp.prepare().then(() => { // config express-session const sess = { - secret: 'CHANGE THIS TO A RANDOM SECRET', cookie: {}, resave: false, + secret: 'CHANGE THIS TO A RANDOM SECRET', saveUninitialized: true, }; From 6b343d818e76d369c48b3d1afb0eb46657e95f88 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Sat, 25 May 2019 00:36:54 +0100 Subject: [PATCH 066/151] fixed some linting issues --- config/passport.js | 11 ++++++----- lib/middleware/secure.js | 3 ++- routes/api/users.js | 9 ++++++--- server/index.js | 2 +- 4 files changed, 15 insertions(+), 10 deletions(-) diff --git a/config/passport.js b/config/passport.js index faf12e2..c45bbeb 100644 --- a/config/passport.js +++ b/config/passport.js @@ -12,12 +12,13 @@ const strategy = new Auth0Strategy( clientSecret: process.env.AUTH0_CLIENT_SECRET, domain: process.env.AUTH0_DOMAIN, }, - (accessToken, refreshToken, extraParams, profile, done) => - // accessToken is the token to call Auth0 API (not needed in the most cases) - // extraParams.id_token has the JSON Web Token - // profile has all the information from the user + (accessToken, refreshToken, extraParams, profile, done) => { + // accessToken is the token to call Auth0 API (not needed in the most cases) + // extraParams.id_token has the JSON Web Token + // profile has all the information from the user - done(null, profile) + done(null, profile); + } ); passport.use(strategy); diff --git a/lib/middleware/secure.js b/lib/middleware/secure.js index aedf4e7..fdcfd97 100644 --- a/lib/middleware/secure.js +++ b/lib/middleware/secure.js @@ -1,5 +1,6 @@ // middleware to protect routes and ensure they are only accessible if logged in. -module.exports = () => async (req, res, next) => { +module.exports = () => function secured(req, res, next) { + // eslint-disable-next-line no-unused-vars if (req.user) { return next(); } diff --git a/routes/api/users.js b/routes/api/users.js index 18b892b..c4d18fa 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -63,17 +63,20 @@ router.get( // Perform the final stage of authentication and redirect to previously requested URL or '/user' router.get('/callback', (req, res, next) => { + // eslint-disable-next-line no-unused-vars passport.authenticate('auth0', (err, user) => { // console.log(info); + if (err) { return next(err); } + if (!user) { return res.redirect('/login'); } - req.logIn(user, err => { - if (err) { - return next(err); + req.logIn(user, error => { + if (error) { + return next(error); } const { returnTo } = req.session; delete req.session.returnTo; diff --git a/server/index.js b/server/index.js index c287bc7..dd5eb91 100644 --- a/server/index.js +++ b/server/index.js @@ -35,8 +35,8 @@ nextApp.prepare().then(() => { const sess = { cookie: {}, resave: false, - secret: 'CHANGE THIS TO A RANDOM SECRET', saveUninitialized: true, + secret: process.env.SESSION_SECRET, }; if (app.get('env') === 'production') { From ad9d2cbff84dda78f1ff8990809806bfd5f91a67 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Sat, 25 May 2019 19:30:23 +0100 Subject: [PATCH 067/151] resolve linting issues --- lib/middleware/secure.js | 12 ++++++++---- routes/api/users.js | 36 ++++++++++++++++++------------------ 2 files changed, 26 insertions(+), 22 deletions(-) diff --git a/lib/middleware/secure.js b/lib/middleware/secure.js index fdcfd97..7c4efd3 100644 --- a/lib/middleware/secure.js +++ b/lib/middleware/secure.js @@ -1,9 +1,13 @@ // middleware to protect routes and ensure they are only accessible if logged in. -module.exports = () => function secured(req, res, next) { +module.exports = () => (req, res, next) => { // eslint-disable-next-line no-unused-vars - if (req.user) { + const { user, session, originalUrl } = req; + const { redirect } = res; + + if (user) { return next(); } - req.session.returnTo = req.originalUrl; - res.redirect('/login'); + + session.returnTo = originalUrl; + return redirect('/login'); }; diff --git a/routes/api/users.js b/routes/api/users.js index c4d18fa..cc22db1 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -62,28 +62,28 @@ router.get( ); // Perform the final stage of authentication and redirect to previously requested URL or '/user' -router.get('/callback', (req, res, next) => { +router.get('/callback', (req, res, next) => (passport.authenticate('auth0', (err, user) => { // eslint-disable-next-line no-unused-vars - passport.authenticate('auth0', (err, user) => { - // console.log(info); - if (err) { - return next(err); - } + // console.log(info); - if (!user) { - return res.redirect('/login'); + if (err) { + return next(err); + } + + if (!user) { + return res.redirect('/login'); + } + + return req.logIn(user, error => { + if (error) { + return next(error); } - req.logIn(user, error => { - if (error) { - return next(error); - } - const { returnTo } = req.session; - delete req.session.returnTo; - res.redirect(returnTo || '/user'); - }); - })(req, res, next); -}); + const { returnTo } = req.session; + delete req.session.returnTo; + return res.redirect(returnTo || '/user'); + }); +}))(req, res, next)); // Perform session logout and redirect to homepage router.get('/logout', (req, res) => { From f40793600fa4a91af30031c836c316933acf8e94 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Sat, 25 May 2019 21:49:51 +0100 Subject: [PATCH 068/151] modified the code to give space to if statement blocks --- routes/api/users.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/routes/api/users.js b/routes/api/users.js index cc22db1..dacdfd8 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -19,9 +19,11 @@ router.post('/register', async (req, res, next) => { const { email, name, password } = req.body; // Check if the email coming in matches what is in the DB const user = await User.findOne({ email }); + if (user) { return res.status(400).json({ message: `${email} already exist` }); } + const avatar = gravatar.url(email, { d: 'mm', // Default r: 'pg', // Rating @@ -62,7 +64,7 @@ router.get( ); // Perform the final stage of authentication and redirect to previously requested URL or '/user' -router.get('/callback', (req, res, next) => (passport.authenticate('auth0', (err, user) => { +router.get('/callback', (req, res, next) => passport.authenticate('auth0', (err, user) => { // eslint-disable-next-line no-unused-vars // console.log(info); @@ -79,11 +81,12 @@ router.get('/callback', (req, res, next) => (passport.authenticate('auth0', (err if (error) { return next(error); } + const { returnTo } = req.session; delete req.session.returnTo; return res.redirect(returnTo || '/user'); }); -}))(req, res, next)); +})(req, res, next)); // Perform session logout and redirect to homepage router.get('/logout', (req, res) => { @@ -91,9 +94,11 @@ router.get('/logout', (req, res) => { let returnTo = `${req.protocol}://${req.hostname}`; const port = req.connection.localPort; + if (port !== undefined && port !== 80 && port !== 443) { returnTo += `:${port}`; } + const logoutURL = new URL(util.format('https://%s/logout', process.env.AUTH0_DOMAIN)); const searchString = querystring.stringify({ client_id: process.env.AUTH0_CLIENT_ID, From 96a213a76f4052424dd47273eed219091bbc3ebc Mon Sep 17 00:00:00 2001 From: cimthog Date: Sun, 26 May 2019 18:24:47 +0100 Subject: [PATCH 069/151] checked if user exists when creating profile --- routes/api/profile.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/routes/api/profile.js b/routes/api/profile.js index 6ba0778..7f9cc83 100644 --- a/routes/api/profile.js +++ b/routes/api/profile.js @@ -19,6 +19,14 @@ router.post('/new', async (req, res) => { if (!isValid) { return res.status(400).json(errors); } + + // check if user profile exists + + const user = await Profile.findOne({ email }); + + if (user) { + return res.status(400).json({ message: `${email} already exist` }); + } // create new profile const profile = new Profile({ city, @@ -74,6 +82,7 @@ router.get('/:profileId', async (req, res) => { } return null; }); + // Update a Profile with profileId router.put('/:profileId', async (req, res) => { const { From a4f8f76762c22288e031c7cb9fc4ffd44bfc6e9d Mon Sep 17 00:00:00 2001 From: uimarshall Date: Mon, 27 May 2019 07:47:01 +0100 Subject: [PATCH 070/151] destructure process.env in config/passport.js and routes/api/users.js --- config/passport.js | 12 ++++++++---- routes/api/users.js | 7 ++++--- 2 files changed, 12 insertions(+), 7 deletions(-) diff --git a/config/passport.js b/config/passport.js index c45bbeb..653d5b7 100644 --- a/config/passport.js +++ b/config/passport.js @@ -5,12 +5,16 @@ const dotenv = require('dotenv'); dotenv.config(); // Configure Passport to use Auth0 +const { + AUTH0_CALLBACK_URL, AUTH0_CLIENT_ID, AUTH0_CLIENT_SECRET, AUTH0_DOMAIN, +} = process.env; const strategy = new Auth0Strategy( + { - callbackURL: process.env.AUTH0_CALLBACK_URL || 'http://localhost:3000/api/users/callback', - clientID: process.env.AUTH0_CLIENT_ID, - clientSecret: process.env.AUTH0_CLIENT_SECRET, - domain: process.env.AUTH0_DOMAIN, + callbackURL: AUTH0_CALLBACK_URL || 'http://localhost:3000/api/users/callback', + clientID: AUTH0_CLIENT_ID, + clientSecret: AUTH0_CLIENT_SECRET, + domain: AUTH0_DOMAIN, }, (accessToken, refreshToken, extraParams, profile, done) => { // accessToken is the token to call Auth0 API (not needed in the most cases) diff --git a/routes/api/users.js b/routes/api/users.js index dacdfd8..a7ffd5b 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -98,10 +98,11 @@ router.get('/logout', (req, res) => { if (port !== undefined && port !== 80 && port !== 443) { returnTo += `:${port}`; } - - const logoutURL = new URL(util.format('https://%s/logout', process.env.AUTH0_DOMAIN)); + + const { AUTH0_CLIENT_ID, AUTH0_DOMAIN } = process.env; + const logoutURL = new URL(util.format('https://%s/logout', AUTH0_DOMAIN)); const searchString = querystring.stringify({ - client_id: process.env.AUTH0_CLIENT_ID, + client_id: AUTH0_CLIENT_ID, returnTo, }); logoutURL.search = searchString; From 7aee434f0b0ddf18a3632d717f64d19f2c4d8022 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Tue, 28 May 2019 14:45:01 +0100 Subject: [PATCH 071/151] adds user input validations --- routes/api/users.js | 13 +++++++++- validation/login.js | 29 ++++++++++++++++++++++ validation/register.js | 55 ++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 96 insertions(+), 1 deletion(-) create mode 100644 validation/login.js create mode 100644 validation/register.js diff --git a/routes/api/users.js b/routes/api/users.js index 6c44f99..d3c61f1 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -6,15 +6,26 @@ const router = express.Router(); // Bring in the User Model const User = require('../../models/User'); +// Import Input Validation +const validateRegInput = require('../../validation/register'); +// const validateLoginInput = require('../../validation/login'); // User Registration Route router.post('/register', async (req, res, next) => { try { + // Validate everything coming the request body + const { errors, isValid } = validateRegInput(req.body); + // Check Validation + if (!isValid) { + return res.status(400).json(errors); + } const { email, name, password } = req.body; // Check if the email coming in matches what is in the DB const user = await User.findOne({ email }); if (user) { - return res.status(400).json({ message: `${email} already exist` }); + errors.email = 'Email already exist'; + return res.status(400).json(errors); + // return res.status(400).json({ message: `${email} already exist` }); } const avatar = gravatar.url(email, { d: 'mm', // Default diff --git a/validation/login.js b/validation/login.js new file mode 100644 index 0000000..3b35cdc --- /dev/null +++ b/validation/login.js @@ -0,0 +1,29 @@ +const Validator = require('validator'); +const isEmpty = require('./is_empty'); + +module.exports = function validateLoginInput(data) { + const errors = {}; + + // Validate Email + let checkemail = data.email; + checkemail = !isEmpty(checkemail) ? checkemail : ''; + // Validate Password + let checkpassword = data.password; + + checkpassword = !isEmpty(checkpassword) ? checkpassword : ''; + + if (!Validator.isEmail(checkemail)) { + errors.email = 'Email is invalid'; + } + if (Validator.isEmpty(checkemail)) { + errors.email = 'Email field is required'; + } + if (Validator.isEmpty(checkpassword)) { + errors.password = 'Password field is required'; + } + + return { + errors, + isValid: isEmpty(errors), + }; +}; diff --git a/validation/register.js b/validation/register.js new file mode 100644 index 0000000..36deea1 --- /dev/null +++ b/validation/register.js @@ -0,0 +1,55 @@ +const Validator = require('validator'); +const isEmpty = require('./is_empty'); + +module.exports = function validateRegInput(data) { + const errors = {}; + /* Check if data.name is not empty and return the name or Check that it is not null, + then validate it using the 'validator' which only validates string */ + + /* Assign 'data' pty in a func to variable to avoid Assignment + to property of function parameter 'data' no-param-reassign */ + let checkname = data.name; + checkname = !isEmpty(checkname) ? checkname : ''; + // Validate Email + let checkemail = data.email; + checkemail = !isEmpty(checkemail) ? checkemail : ''; + // Validate Password + let checkpassword = data.password; + + checkpassword = !isEmpty(checkpassword) ? checkpassword : ''; + // Validate Confirm password + let checkpassword2 = data.confirmPassword; + checkpassword2 = !isEmpty(checkpassword2) ? checkpassword2 : ''; + if (!Validator.isLength(checkname, { max: 50, min: 2 })) { + errors.name = 'Name must be between 2 and 50 characters long!'; + } + if (Validator.isEmpty(checkname)) { + errors.name = 'Name field is required'; + } + if (Validator.isEmpty(checkemail)) { + errors.email = 'Email field is required'; + } + if (!Validator.isEmail(checkemail)) { + errors.email = 'Email is invalid'; + } + if (Validator.isEmpty(checkpassword)) { + errors.password = 'Password field is required'; + } + if (!Validator.isLength(checkpassword, { max: 30, min: 6 })) { + errors.password = 'Password must be at least 6 characters'; + } + if (Validator.isEmpty(checkpassword2)) { + errors.confirmPassword = 'Confirm Password field is required'; + } + if (!Validator.equals(checkpassword, checkpassword2)) { + errors.password = 'Passwords must match'; + } + + // If everything passes then it returns empty error, hence is valid + // Else the error is populated and returned + return { + errors, + // isValid checks if errors is empty,if so,it means user input is valid + isValid: isEmpty(errors), + }; +}; From 9450e28861d750923452828bbb54bf4886f1c2a5 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Tue, 28 May 2019 17:27:50 +0100 Subject: [PATCH 072/151] create Post model --- models/Post.js | 55 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 55 insertions(+) create mode 100644 models/Post.js diff --git a/models/Post.js b/models/Post.js new file mode 100644 index 0000000..62ad838 --- /dev/null +++ b/models/Post.js @@ -0,0 +1,55 @@ +const mongoose = require('mongoose'); + +const { Schema } = mongoose; +const PostSchema = new Schema({ + avatar: { + type: String, + }, + // The comments should be linked to a user + comments: [ + { + avatar: { + type: String, + }, + name: { + type: String, + }, + text: { + required: true, + type: String, + }, + user: { + ref: 'users', + type: Schema.Types.ObjectId, + }, + }, + ], + date: { + default: Date.now, + type: Date, + }, + + // The 'likes' should be linked to a user + likes: [ + { + user: { + ref: 'users', + type: Schema.Types.ObjectId, + }, + }, + ], + name: { + type: String, + }, + text: { + required: true, + type: String, + }, + + // The post will refernce a user through 'user id' + user: { + ref: 'users', + type: Schema.Types.ObjectId, + }, +}); +module.exports = mongoose.model('post', PostSchema); From b2a22d0b7c5ee79c9e579f541abac95903610e4f Mon Sep 17 00:00:00 2001 From: uimarshall Date: Tue, 28 May 2019 21:47:55 +0100 Subject: [PATCH 073/151] clean up code, pads if statement and change variables naming to camel case --- routes/api/users.js | 8 +++++--- validation/register.js | 32 ++++++++++++++++---------------- 2 files changed, 21 insertions(+), 19 deletions(-) diff --git a/routes/api/users.js b/routes/api/users.js index d3c61f1..d5aa121 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -8,7 +8,6 @@ const router = express.Router(); const User = require('../../models/User'); // Import Input Validation const validateRegInput = require('../../validation/register'); -// const validateLoginInput = require('../../validation/login'); // User Registration Route router.post('/register', async (req, res, next) => { @@ -16,17 +15,20 @@ router.post('/register', async (req, res, next) => { // Validate everything coming the request body const { errors, isValid } = validateRegInput(req.body); // Check Validation + if (!isValid) { return res.status(400).json(errors); } + const { email, name, password } = req.body; // Check if the email coming in matches what is in the DB const user = await User.findOne({ email }); + if (user) { - errors.email = 'Email already exist'; + errors.email = `${email} already exist`; return res.status(400).json(errors); - // return res.status(400).json({ message: `${email} already exist` }); } + const avatar = gravatar.url(email, { d: 'mm', // Default r: 'pg', // Rating diff --git a/validation/register.js b/validation/register.js index 36deea1..d4048b1 100644 --- a/validation/register.js +++ b/validation/register.js @@ -8,40 +8,40 @@ module.exports = function validateRegInput(data) { /* Assign 'data' pty in a func to variable to avoid Assignment to property of function parameter 'data' no-param-reassign */ - let checkname = data.name; - checkname = !isEmpty(checkname) ? checkname : ''; + let checkName = data.name; + checkName = !isEmpty(checkName) ? checkName : ''; // Validate Email - let checkemail = data.email; - checkemail = !isEmpty(checkemail) ? checkemail : ''; + let checkEmail = data.email; + checkEmail = !isEmpty(checkEmail) ? checkEmail : ''; // Validate Password - let checkpassword = data.password; + let checkPassword = data.password; - checkpassword = !isEmpty(checkpassword) ? checkpassword : ''; + checkPassword = !isEmpty(checkPassword) ? checkPassword : ''; // Validate Confirm password - let checkpassword2 = data.confirmPassword; - checkpassword2 = !isEmpty(checkpassword2) ? checkpassword2 : ''; - if (!Validator.isLength(checkname, { max: 50, min: 2 })) { + let checkPassword2 = data.confirmPassword; + checkPassword2 = !isEmpty(checkPassword2) ? checkPassword2 : ''; + if (!Validator.isLength(checkName, { max: 50, min: 2 })) { errors.name = 'Name must be between 2 and 50 characters long!'; } - if (Validator.isEmpty(checkname)) { + if (Validator.isEmpty(checkName)) { errors.name = 'Name field is required'; } - if (Validator.isEmpty(checkemail)) { + if (Validator.isEmpty(checkEmail)) { errors.email = 'Email field is required'; } - if (!Validator.isEmail(checkemail)) { + if (!Validator.isEmail(checkEmail)) { errors.email = 'Email is invalid'; } - if (Validator.isEmpty(checkpassword)) { + if (Validator.isEmpty(checkPassword)) { errors.password = 'Password field is required'; } - if (!Validator.isLength(checkpassword, { max: 30, min: 6 })) { + if (!Validator.isLength(checkPassword, { max: 30, min: 6 })) { errors.password = 'Password must be at least 6 characters'; } - if (Validator.isEmpty(checkpassword2)) { + if (Validator.isEmpty(checkPassword2)) { errors.confirmPassword = 'Confirm Password field is required'; } - if (!Validator.equals(checkpassword, checkpassword2)) { + if (!Validator.equals(checkPassword, checkPassword2)) { errors.password = 'Passwords must match'; } From e3a29628921c0fd9d09168f612391e36536cfe9d Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 29 May 2019 00:27:02 +0100 Subject: [PATCH 074/151] fixed glithes in landing page --- .../Authentication/components/Login.jsx | 3 +- .../LandingPage/components/LandingPage.jsx | 2 +- .../components/LandingPage.test.jsx | 2 +- .../components/LandingPageContent.jsx | 1 - components/Layout/components/PageLayout.css | 4 ++ components/Layout/components/PageLayout.jsx | 2 +- components/Layout/components/Sidebar.jsx | 61 ++++++++++--------- 7 files changed, 41 insertions(+), 34 deletions(-) diff --git a/components/Authentication/components/Login.jsx b/components/Authentication/components/Login.jsx index 054f93f..5c64a45 100644 --- a/components/Authentication/components/Login.jsx +++ b/components/Authentication/components/Login.jsx @@ -47,6 +47,7 @@ class NormalLoginForm extends React.Component { */ validateFields((err, values) => { if (!err) { + this.enterLoading(); setTimeout(() => { Router.push('/timeline'); }, 1000); @@ -73,7 +74,7 @@ class NormalLoginForm extends React.Component { {/* buttons */} Forgot password - or diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index 198b63f..12abba5 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -14,7 +14,7 @@ import { LANDING_PAGE_CONTENTS, PAGE_TITLE } from '../constants'; const LandingPage = () => ( { - it('should renders without crashing', () => { + it('LandingPage should renders without crashing', () => { const div = document.createElement('div'); ReactDOM.render(, div); }); diff --git a/components/LandingPage/components/LandingPageContent.jsx b/components/LandingPage/components/LandingPageContent.jsx index 0cbcb9e..b339fa1 100644 --- a/components/LandingPage/components/LandingPageContent.jsx +++ b/components/LandingPage/components/LandingPageContent.jsx @@ -1,7 +1,6 @@ import React from 'react'; import { Button, Typography } from 'antd'; import PropTypes from 'prop-types'; -import { normalize } from 'path'; import Link from 'next/link'; const { Title, Paragraph } = Typography; diff --git a/components/Layout/components/PageLayout.css b/components/Layout/components/PageLayout.css index 4bc2549..8cf8e9a 100644 --- a/components/Layout/components/PageLayout.css +++ b/components/Layout/components/PageLayout.css @@ -3,6 +3,10 @@ margin-top: 64px; } +.PageLayout_content_sidebar{ +height: calc(100vh - 64px); +} + .layout_header-mobile { display: flex; justify-content: space-between; diff --git a/components/Layout/components/PageLayout.jsx b/components/Layout/components/PageLayout.jsx index 2b7bc5d..8312099 100644 --- a/components/Layout/components/PageLayout.jsx +++ b/components/Layout/components/PageLayout.jsx @@ -28,7 +28,7 @@ export default function PageLayout(props) { - + {children} diff --git a/components/Layout/components/Sidebar.jsx b/components/Layout/components/Sidebar.jsx index e1d164a..d497241 100644 --- a/components/Layout/components/Sidebar.jsx +++ b/components/Layout/components/Sidebar.jsx @@ -2,43 +2,46 @@ import React from 'react'; import { Layout, Menu, Icon } from 'antd'; import Link from 'next/link'; import PropTypes from 'prop-types'; -import { sideBarMenuItems } from '../constants'; +import { SIDEBAR_MENU_ITEMS } from '../constants'; const { Sider } = Layout; /** * Function that controls the sidebar which displays on mobile * @function - * @param {boolean} IsSiderPresent shows sidebar if true + * @param {boolean} isSiderPresent shows sidebar if true * @return {Object} Side Bar */ export default function Sidebar(props) { - const { IsSiderPresent } = props; - return IsSiderPresent ? ( - -
- - { - sideBarMenuItems.map(sideBarItem => { - const { - key, href, type, text, - } = sideBarItem; - return ( - - - - - {text} - - - - ); - }) - } - - - ) : null; + const { isSiderPresent } = props; + return ( + isSiderPresent + ? ( + +
+ + { + SIDEBAR_MENU_ITEMS.map(sideBarItem => { + const { + key, href, type, text, + } = sideBarItem; + return ( + + + + + {text} + + + + ); + }) + } + + + ) : null + ); } -Sider.propTypes = { - IsSiderPresent: PropTypes.bool, +Sidebar.propTypes = { + isSiderPresent: PropTypes.bool, }; From 127e3ba7f9de471c13cd11e7a4e4417e66e3fb42 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 29 May 2019 00:36:35 +0100 Subject: [PATCH 075/151] Created the TimeLine Page --- components/TimeLine/components/TimeLine.css | 271 ++++++++++++++++++++ components/TimeLine/components/TimeLine.jsx | 181 +++++++++++++ components/TimeLine/components/index.js | 3 + components/TimeLine/constant.js | 64 +++++ components/TimeLine/index.js | 3 + pages/timeline.js | 4 + 6 files changed, 526 insertions(+) create mode 100644 components/TimeLine/components/TimeLine.css create mode 100644 components/TimeLine/components/TimeLine.jsx create mode 100644 components/TimeLine/components/index.js create mode 100644 components/TimeLine/constant.js create mode 100644 components/TimeLine/index.js create mode 100644 pages/timeline.js diff --git a/components/TimeLine/components/TimeLine.css b/components/TimeLine/components/TimeLine.css new file mode 100644 index 0000000..41cc22d --- /dev/null +++ b/components/TimeLine/components/TimeLine.css @@ -0,0 +1,271 @@ +.create-icon-container{ + height: 50px; + width: 50px; + background-color: #1890ff; + border-radius: 50%; + position: fixed; + bottom: 20px; + right: 20px; + display: grid; + place-items: center; + z-index:10 +} + +.create-icon{ + color: #ffffff; + font-size: 1.5em; +} + +.create-post-icon{ + font-size: 32px; + color: #1890ff; + display: inline +} + +.modal-footer{ + display: flex; + justify-content: space-between; + align-content: center; +} + +.compose-textarea{ + margin: 20px 0 0 0; +} + +.ant-input:hover{ + outline: none; + border-color: none; +} + +.post-container{ + padding: 12px; + display: flex; + background: #ffffff; + max-width: 580px; + margin: 0 auto; +} + +.user-avatar{ + height: 50px; + margin-right: 12px; + width: 50px; + border-radius: 50%; + box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, .1), -1px -1px 2px 0px rgba(0, 0, 0, .1); +} +.user-post-details{ + display: flex; + justify-content: space-between; +} +.user-name{ + font-weight: bold; + margin-bottom: 0; +} + +.user-followers-stat{ + display: flex; + justify-content: center; + margin: 1em; +} + +.users-follow-number > h3, .users-follow-number > p { + margin-bottom: 0; +} + +.create-post-modal{ + top: 20px; + height: 100%; + padding-right: 0; + padding-left: 0; +} +.user-time-posted{ + font-weight: 100; + margin-bottom: 0; +} + +.post-image{ + width:100%; + max-height:300px; + object-fit: cover; +margin:0 auto; +margin-bottom: 16px; +} +.user-post{ + margin-top:4px; +} + + + +.divider-height{ + height: 50px +} + +.post-reaction{ + display: flex; + justify-content:flex-start; + align-items: center} + +.post-reaction > .message-icon{ + margin-right:24px +} + +.post-reaction > .like-icon{ + margin-right:8px +} + +.liked{ + color: #1890ff +} +.post-reaction > *:active { + color:#1890ff; + transform: scale(1.5); + transition: all .2s; +} + +.comment-post-button{ + margin-top: 8px; +} + +.TimeLine_profile-info, +.TimeLine-post-component, +.TimeLine_popular-topic, +.TimeLine_online-friends{ + background: #ffffff; +display: none; +} + +.TimeLine_popular-topic > li{ +list-style-type: none; +} + +.TimeLine_popular-topic li > a{ + color:#1890ff +} + + + +.avartar-online{ + height: 35px; + width: 35px; +} + +.TimeLine_online-friends li{position: relative} +.TimeLine_online-friends li::after{ + content: ""; + display: block; + width: 10px; + height: 10px; + background-color: greenyellow; + border-radius: 50%; + position: absolute; + left: 30px; + top: 20px; + } + + .hide{ + display: none; + } + + .show{ + display: block + } + + .skeleton-section{ + padding: 1em; + background-color: #ffffff; + } + + .TimeLine_content{ + text-align: justify; + } + +@media screen and (max-width:767px){ + .TimeLine_content{ + max-width: 458px; + margin: 0 auto; + } +} + +@media screen and (min-width: 768px) { + +.create-icon-container{ + display: none +} + +.user-post-details{ + justify-content: flex-start; + +} + +.user-name{ + margin-right: 1em; +} + .TimeLine_content{ + margin: 1em; + display: grid; + grid-template-columns: 1fr 3fr; + /* grid-template-columns: 1fr 3fr; */ + grid-template-rows:350px repeat(2, minmax(auto, 310px)) auto; + grid-gap: 1em; +} + +.TimeLine-post-component{ + background-color: #ffffff; + padding: 12px; +} + +ul{ + padding: 0; +} +li{ + list-style-type: none; + margin-bottom: .5rem; +} +.TimeLine_profile-info { + grid-row: 1/2; + text-align: center; +} + +.TimeLine_popular-topic{ + grid-row: 2/3; + +} +.TimeLine_online-friends{ + grid-row:3/4; + +} + +.TimeLine_profile-info, +.TimeLine-post-component, +.TimeLine_popular-topic, +.TimeLine_online-friends{ + background: #ffffff; +display: block; +padding: 1em 24px; +} +.TimeLine_post{ +grid-row: 1/3; + grid-column: 2/3; + } + +.post-container{ + max-width: 100%; + padding: 1em 24px; +} + +} + +@media screen and (min-width: 1024px) { + .TimeLine_content{ + grid-template-columns: minmax(200px, 1fr) 3fr minmax(200px, 1fr); + grid-template-rows: 350px minmax(auto, 310px) auto; + margin: 1em 6em; +} + + +.TimeLine_online-friends{ + grid-row:1/2; + grid-column: 3/4; + background-color: #ffffff; + padding: 1em; +} +} diff --git a/components/TimeLine/components/TimeLine.jsx b/components/TimeLine/components/TimeLine.jsx new file mode 100644 index 0000000..e31472c --- /dev/null +++ b/components/TimeLine/components/TimeLine.jsx @@ -0,0 +1,181 @@ +/* eslint-disable no-tabs */ +import React from 'react'; +import { + Icon, Divider +} from 'antd'; +import PageLayout from '../../Layout'; +import './TimeLine.css'; +import CreatePostModal from './CreatePostModal'; +import { CreatePostComponent } from './CreatePostComponent'; +// dummy data to be replaced with api data, commented so that test can pass, will be removed when api is ready +import data from '../../../data/data.json'; +import { + CREATEPOST_PLACEHOLDER, TIMELINE_TITLE +} from '../constant'; +import TimeLineProfileInfo from './TimeLineProfileInfo'; +import TimeLinePopularTopic from './TimeLinePopularTopic'; +import TimeLineOnlineFriends from './TimeLineOnlineFriends'; +import TimeLinePosts from './TimeLinePosts'; + +/**Helper function that is used to render the TimeLine Component + * @class TimeLine + * @extends {React.Component} + * @return {Object} returns the TimeLine component + */ +class TimeLine extends React.Component { + constructor(props) { + super(props); + this.state = { + profileData: '', + visible: false, + like: false, + likeCount: 0, + comment: false, + activeComment: '', + activeLikeButton: '', + statusValue: '', + commentValue:'' + }; + this.handleOk = this.handleOk.bind(this); + this.handleLikeButton = this.handleLikeButton.bind(this); + this.handleStatusValue = this.handleStatusValue.bind(this); + this.handleCommentValue = this.handleCommentValue.bind(this); + } + + componentDidMount() { + this.setState({ profileData: data }); + } + + /** + * Helper function that handels the visibility of a modal + * @function + * @return {Object} returns 'true' to show the modal + */ + + modalHandler = () => { + this.setState({ + visible: !this.state.visible, + }); + }; + + /** + * Helper function that is used to handle the data from post component, it also closes the post modal + * @function + * @return {Object} returns 'false' to close the modal post component + */ + handleOk = e => { + const {visible} = this.state; + // close the modal; + if (visible){ + this.setState({ + visible: false + }) + console.log('handle ok', this.state.status) + } + + // make an api call + }; + + /** + * Helper function that is used to hable clicking on the like button + * @function + * @param {Number} id the id of the liked post + * @return {Object} changes the state of the like component + */ + handleLikeButton = id => { + this.setState({ + like: !this.state.like, + }); + }; + + handleComment = id => { + this.setState({ + comment: !this.state.comment, + activeComment: id, + }); + }; + + handleCommentValue = e => { + this.setState({ + commentValue:e.target.value + }) + console.log(e.target.value) + } + + handleStatusValue = e => { + this.setState({ + statusValue:e.target.value + }) + console.log(e.target.value) + } + + render() { + const { profileData } = this.state; + return ( + 0} + isFooterPresent={false} + isAuthenticated + title={TIMELINE_TITLE} + > +
+ +
+ {/* edit component for mobile */} +
+ +
+ + +
+ + {/* profile info desktop */} + + {/* popular topics aside */} + + {/* online friends aside tab */} + + + {/* main timeline */} +
+ {/* create post component */} +
+ +
+ + + +
+ {/* timeline posts */} + +
+
+
+ + ); + } +} +export default TimeLine; diff --git a/components/TimeLine/components/index.js b/components/TimeLine/components/index.js new file mode 100644 index 0000000..8122e27 --- /dev/null +++ b/components/TimeLine/components/index.js @@ -0,0 +1,3 @@ +import TimeLine from './TimeLine'; + +export default TimeLine; diff --git a/components/TimeLine/constant.js b/components/TimeLine/constant.js new file mode 100644 index 0000000..2c722d9 --- /dev/null +++ b/components/TimeLine/constant.js @@ -0,0 +1,64 @@ +const POPULAR_TOPIC = [ + { + link: '#', + text: 'Lorem, ipsum.', + }, + { + link: '#', + text: 'Quaerat, fuga!', + }, + { + link: '#', + text: 'Nemo, odit.', + }, + { + link: '#', + text: 'Aspernatur, harum?', + }, + { + link: '#', + text: 'Pariatur, libero!', + }, + { + link: '#', + text: 'Voluptatem, rerum!', + }, + { + link: '#', + text: 'Placeat, illo!', + }, + { + link: '#', + text: 'Voluptatem, nesciunt?', + }, +]; + +const LOADING_SKELETON = [{ + active: true, + avatar: true, + id: 1, + loading: true, + paragraph: { rows: 7 }, + title: true, +}, +{ + active: true, + avatar: true, + id: 2, + loading: true, + paragraph: { rows: 7 }, + title: true, +}]; + +// eslint-disable-next-line max-len +const USERS_BIO = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellen dusharum odit inventore, iste dignissimos laudantium! Veniam.'; + +const CREATEPOST_PLACEHOLDER = 'What is on your mind?'; +const COMMENT_PLACEHOLDER = 'Write your reply'; +const TIMELINE_TITLE = 'Timeline | Find friends'; + +export { + POPULAR_TOPIC, USERS_BIO, + CREATEPOST_PLACEHOLDER, + LOADING_SKELETON, TIMELINE_TITLE, COMMENT_PLACEHOLDER +}; diff --git a/components/TimeLine/index.js b/components/TimeLine/index.js new file mode 100644 index 0000000..4d1aaa2 --- /dev/null +++ b/components/TimeLine/index.js @@ -0,0 +1,3 @@ +import TimeLine from './components/index'; + +export default TimeLine; diff --git a/pages/timeline.js b/pages/timeline.js new file mode 100644 index 0000000..5178032 --- /dev/null +++ b/pages/timeline.js @@ -0,0 +1,4 @@ +import TimeLine from '../components/TimeLine'; +import '../components/TimeLine/components/TimeLine.css'; + +export default TimeLine; From 862d057f690a0590b3e98cdfb33718f44790ecd5 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 29 May 2019 08:58:37 +0100 Subject: [PATCH 076/151] minor fix --- components/TimeLine/components/TimeLine.css | 1 - components/TimeLine/components/TimeLine.jsx | 87 ++++++++++----------- 2 files changed, 42 insertions(+), 46 deletions(-) diff --git a/components/TimeLine/components/TimeLine.css b/components/TimeLine/components/TimeLine.css index 41cc22d..81f26e4 100644 --- a/components/TimeLine/components/TimeLine.css +++ b/components/TimeLine/components/TimeLine.css @@ -203,7 +203,6 @@ list-style-type: none; margin: 1em; display: grid; grid-template-columns: 1fr 3fr; - /* grid-template-columns: 1fr 3fr; */ grid-template-rows:350px repeat(2, minmax(auto, 310px)) auto; grid-gap: 1em; } diff --git a/components/TimeLine/components/TimeLine.jsx b/components/TimeLine/components/TimeLine.jsx index e31472c..51ff1c2 100644 --- a/components/TimeLine/components/TimeLine.jsx +++ b/components/TimeLine/components/TimeLine.jsx @@ -17,7 +17,7 @@ import TimeLinePopularTopic from './TimeLinePopularTopic'; import TimeLineOnlineFriends from './TimeLineOnlineFriends'; import TimeLinePosts from './TimeLinePosts'; -/**Helper function that is used to render the TimeLine Component +/** Helper function that is used to render the TimeLine Component * @class TimeLine * @extends {React.Component} * @return {Object} returns the TimeLine component @@ -34,12 +34,12 @@ class TimeLine extends React.Component { activeComment: '', activeLikeButton: '', statusValue: '', - commentValue:'' + commentValue: '', }; this.handleOk = this.handleOk.bind(this); this.handleLikeButton = this.handleLikeButton.bind(this); this.handleStatusValue = this.handleStatusValue.bind(this); - this.handleCommentValue = this.handleCommentValue.bind(this); + this.handleCommentValue = this.handleCommentValue.bind(this); } componentDidMount() { @@ -51,7 +51,6 @@ class TimeLine extends React.Component { * @function * @return {Object} returns 'true' to show the modal */ - modalHandler = () => { this.setState({ visible: !this.state.visible, @@ -64,13 +63,12 @@ class TimeLine extends React.Component { * @return {Object} returns 'false' to close the modal post component */ handleOk = e => { - const {visible} = this.state; + const { visible } = this.state; // close the modal; - if (visible){ + if (visible) { this.setState({ - visible: false - }) - console.log('handle ok', this.state.status) + visible: false, + }); } // make an api call @@ -95,28 +93,28 @@ class TimeLine extends React.Component { }); }; - handleCommentValue = e => { + handleCommentValue = e => { this.setState({ - commentValue:e.target.value - }) - console.log(e.target.value) + commentValue: e.target.value, + }); } handleStatusValue = e => { this.setState({ - statusValue:e.target.value - }) - console.log(e.target.value) + statusValue: e.target.value, + }); } render() { - const { profileData } = this.state; + const { + profileData, visible, statusValue, like, likeCount, activeComment, activeLikeButton, commentValue, + } = this.state; return ( 0} - isFooterPresent={false} - isAuthenticated - title={TIMELINE_TITLE} + isSiderPresent={profileData.length > 0} + isFooterPresent={false} + isAuthenticated + title={TIMELINE_TITLE} >
@@ -127,11 +125,11 @@ class TimeLine extends React.Component {
@@ -147,30 +145,29 @@ class TimeLine extends React.Component { {/* create post component */}
-
- {/* timeline posts */} - +
+ {/* timeline posts */} +
From 8683b2c391456d09751c6863b830291e3e5c1fbd Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 29 May 2019 09:02:45 +0100 Subject: [PATCH 077/151] fix indent --- components/Layout/components/PageLayout.css | 91 ++++++++++----------- 1 file changed, 45 insertions(+), 46 deletions(-) diff --git a/components/Layout/components/PageLayout.css b/components/Layout/components/PageLayout.css index 8cf8e9a..79ece55 100644 --- a/components/Layout/components/PageLayout.css +++ b/components/Layout/components/PageLayout.css @@ -1,51 +1,51 @@ .PageLayout_content { - height: 100%; + height: 100%; margin-top: 64px; } -.PageLayout_content_sidebar{ -height: calc(100vh - 64px); +.PageLayout_content_sidebar { + height: calc(100vh - 64px); } .layout_header-mobile { - display: flex; - justify-content: space-between; - background-color: #ffffff; - border-bottom: 0.4px solid #e8e8e8; - position: fixed; - width: 100%; - z-index: 1; - align-items: center; + display: flex; + justify-content: space-between; + background-color: #ffffff; + border-bottom: 0.4px solid #e8e8e8; + position: fixed; + width: 100%; + z-index: 1; + align-items: center; } .layout_header-desktop { - display: none; + display: none; } .layout_sider { - position: fixed; - height: calc(100vh - 64px); - z-index: 1; - margin-top: 64px; + position: fixed; + height: calc(100vh - 64px); + z-index: 1; + margin-top: 64px; } .ant-layout { - background: #ffffff; + background: #ffffff; } .ant-layout-sider-zero-width-trigger { - top: 12px; - position: fixed; - background-color: #1890ff; - left: 0; + top: 12px; + position: fixed; + background-color: #1890ff; + left: 0; } .ant-layout-sider-zero-width-trigger:hover { - background-color: #1890ff; + background-color: #1890ff; } a { - color: #ffffff; + color: #ffffff; } .ant-divider-horizontal { @@ -53,45 +53,44 @@ a { } .logo { - width: 120px; - height: 30px; + width: 120px; + height: 30px; } @media screen and (min-width: 768px) { .PageLayout_body { - /* overflow: auto; */ -background: #E6ECF0; - } + background: #E6ECF0; + } .PageLayout_content { - margin-top: 63px; - background-color: #e8e8e8 + margin-top: 63px; + background-color: #e8e8e8 } .layout_sider { - display: none; + display: none; } .layout_header-mobile { - display: none; - } - .layout_header-desktop { - background-color: #ffffff; - display: flex; - justify-content: space-between; - align-items: center; + display: none; + } + .layout_header-desktop { + background-color: #ffffff; + display: flex; + justify-content: space-between; + align-items: center; border-bottom: 1px solid #e8e8e8; position: fixed; width: 100%; z-index: 3; - padding: 0 1em; - } + padding: 0 1em; + } - .layout_header-list { - line-height: 63px; - } + .layout_header-list { + line-height: 63px; + } } @media screen and (min-width: 1024px) { - .layout_header-desktop { - padding: 0 6em; - } + .layout_header-desktop { + padding: 0 6em; + } } From 6bfc564315cea53512ec93ea00e1a412ad585427 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 29 May 2019 19:07:00 +0100 Subject: [PATCH 078/151] move all strings to constant file and seperated module imports from created imports --- .../Authentication/components/Login.jsx | 27 ++++++++---- .../components/PasswordReset.jsx | 11 ++--- .../Authentication/components/SignUp.jsx | 5 ++- .../components/SignupInputItemGenerator.jsx | 42 +++++++++++-------- components/Authentication/constants.js | 22 +++++++++- .../LandingPage/components/LandingPage.jsx | 3 +- components/Layout/components/NavHeader.jsx | 5 ++- components/Layout/components/PageFooter.jsx | 1 + components/Layout/components/PageLayout.jsx | 1 + components/Layout/components/Sidebar.jsx | 1 + 10 files changed, 82 insertions(+), 36 deletions(-) diff --git a/components/Authentication/components/Login.jsx b/components/Authentication/components/Login.jsx index 5c64a45..08ec933 100644 --- a/components/Authentication/components/Login.jsx +++ b/components/Authentication/components/Login.jsx @@ -1,11 +1,20 @@ /* eslint-disable react/jsx-no-literals */ import React from 'react'; import { Form, Button, Typography } from 'antd'; -import 'antd/dist/antd.css'; -import './Authentication.css'; import Router from 'next/router'; + +import './Authentication.css'; +import 'antd/dist/antd.css'; import LoginImage from '../../../static/login.svg'; import LoginInputItemGenerator from './LoginInputItemGenerator'; +import { + WELCOME, + LOGIN_TO_CONTINUE, + FORGOT_PASSWORD, + LOGIN, + OR, + REGISTER_NOW +} from '../constants'; const { Title, Paragraph } = Typography; @@ -67,18 +76,20 @@ class NormalLoginForm extends React.Component {
- Welcome - Login to continue + {WELCOME} + {LOGIN_TO_CONTINUE} {/* inputs for username and password */} {LoginInputItemGenerator(getFieldDecorator)} {/* buttons */} - Forgot password + {FORGOT_PASSWORD} - or - register now! + {OR} + + {REGISTER_NOW} +
diff --git a/components/Authentication/components/PasswordReset.jsx b/components/Authentication/components/PasswordReset.jsx index e2cb4d0..59d59b0 100644 --- a/components/Authentication/components/PasswordReset.jsx +++ b/components/Authentication/components/PasswordReset.jsx @@ -6,18 +6,19 @@ import { Button, notification, Icon } from 'antd'; -import 'antd/dist/antd.css'; -import './Authentication.css'; import Router from 'next/router'; -import ForgotPassword from '../../../static/forgot_password.svg'; +import './Authentication.css'; +import 'antd/dist/antd.css'; +import ForgotPassword from '../../../static/forgot_password.svg'; import { FORGET_PASSWORD_NOTIFICATION_TITLE, FORGET_PASSWORD_NOTIFICATION_DESCRIPTION, FORGET_PASSWORD_EMAIL_INPUT_ERROR, FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION, PASSWORD_CHANGE_TEXT, - REMEMBER_PASSWORD_TEXT + REMEMBER_PASSWORD_TEXT, + LOGIN } from '../constants'; /** @@ -125,7 +126,7 @@ class PasswordResetForm extends React.Component {
{REMEMBER_PASSWORD_TEXT} - login + {LOGIN}
diff --git a/components/Authentication/components/SignUp.jsx b/components/Authentication/components/SignUp.jsx index 6cb0d24..d859e54 100644 --- a/components/Authentication/components/SignUp.jsx +++ b/components/Authentication/components/SignUp.jsx @@ -2,9 +2,10 @@ import React from 'react'; import { Form } from 'antd'; -import 'antd/dist/antd.css'; -import './Authentication.css'; import Router from 'next/router'; + +import './Authentication.css'; +import 'antd/dist/antd.css'; import RegistrationImage from '../../../static/register.svg'; import { SIGNUP_INPUTS diff --git a/components/Authentication/components/SignupInputItemGenerator.jsx b/components/Authentication/components/SignupInputItemGenerator.jsx index 1cb35e9..bf7ce95 100644 --- a/components/Authentication/components/SignupInputItemGenerator.jsx +++ b/components/Authentication/components/SignupInputItemGenerator.jsx @@ -4,6 +4,12 @@ import { } from 'antd'; import PropTypes from 'prop-types'; +import { + READ_ACCEPTED_AGREEMENT, + AGREEMENT, + REGISTER, LOGIN, ALREADY_HAVE_ACCOUNT +} from '../constants'; + /** * function that is used to also handle password validation, this compares the two password field; * @function @@ -35,32 +41,34 @@ const SignupInputGenerator = (actions, items, decorator) => { let fieldChildren; switch (FieldType) { - case 'input': - Field = Input; - break; - case 'checkbox': - Field = Checkbox; - break; - case 'button': - Field = Button; - break; - default: - Field = null; - break; + case 'input': + Field = Input; + break; + case 'checkbox': + Field = Checkbox; + break; + case 'button': + Field = Button; + break; + default: + Field = null; + break; } if (isButton && hasFieldChildren) { fieldChildren = (
- already have an account, please - login + {ALREADY_HAVE_ACCOUNT} + {LOGIN}
); } else if (FieldType === 'checkbox' && hasFieldChildren) { fieldChildren = ( - I have read and accepted the - agreement + {READ_ACCEPTED_AGREEMENT} + + {AGREEMENT} + ); } @@ -70,7 +78,7 @@ const SignupInputGenerator = (actions, items, decorator) => { { isButton ? ( <> - Register + {REGISTER} {fieldChildren} ) diff --git a/components/Authentication/constants.js b/components/Authentication/constants.js index a28b0b6..1e93304 100644 --- a/components/Authentication/constants.js +++ b/components/Authentication/constants.js @@ -5,6 +5,16 @@ const FORGET_PASSWORD_EMAIL_INPUT_ERROR = 'The input is not a valid E-mail !'; const FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION = 'Please input your E-mail so that we can send your reset link!'; const PASSWORD_CHANGE_TEXT = 'Request for Password Change'; const REMEMBER_PASSWORD_TEXT = 'remember your password? '; +const WELCOME = 'Welcome'; +const LOGIN_TO_CONTINUE = 'Login to continue'; +const FORGOT_PASSWORD = 'Forgot password'; +const REGISTER_NOW = ' register now!'; +const LOGIN = 'login'; +const OR = 'or'; +const READ_ACCEPTED_AGREEMENT = 'I have read and accepted the '; +const AGREEMENT = 'agreement'; +const REGISTER = 'Register'; +const ALREADY_HAVE_ACCOUNT = 'already have an account, please '; const LOGIN_INPUTS = [ { className: 'form_icon', @@ -104,5 +114,15 @@ export { FORGET_PASSWORD_EMAIL_INPUT_ERROR, FORGET_PASSWORD_EMAIL_INPUT_INSTRUCTION, PASSWORD_CHANGE_TEXT, - REMEMBER_PASSWORD_TEXT + REMEMBER_PASSWORD_TEXT, + WELCOME, + LOGIN_TO_CONTINUE, + FORGOT_PASSWORD, + LOGIN, + OR, + REGISTER_NOW, + READ_ACCEPTED_AGREEMENT, + AGREEMENT, + REGISTER, + ALREADY_HAVE_ACCOUNT }; diff --git a/components/LandingPage/components/LandingPage.jsx b/components/LandingPage/components/LandingPage.jsx index 12abba5..eec24ec 100644 --- a/components/LandingPage/components/LandingPage.jsx +++ b/components/LandingPage/components/LandingPage.jsx @@ -1,6 +1,7 @@ import React from 'react'; -import 'antd/dist/antd.css'; + import './LandingPage.css'; +import 'antd/dist/antd.css'; import LandingPageContent from './LandingPageContent'; import PageLayout from '../../Layout'; import { LANDING_PAGE_CONTENTS, PAGE_TITLE } from '../constants'; diff --git a/components/Layout/components/NavHeader.jsx b/components/Layout/components/NavHeader.jsx index 5e88ca9..21c39a5 100644 --- a/components/Layout/components/NavHeader.jsx +++ b/components/Layout/components/NavHeader.jsx @@ -1,12 +1,13 @@ import React from 'react'; import Head from 'next/head'; -import 'antd/dist/antd.css'; import { Layout, Menu, Button, Input } from 'antd'; import Link from 'next/link'; import PropTypes from 'prop-types'; -import { HEADER_TITLE, MENU_ITEMS } from '../constants'; + +import 'antd/dist/antd.css'; +import { HEADER_TITLE, MENU_ITEMS } from '../constants'; const { Header } = Layout; const { Search } = Input; diff --git a/components/Layout/components/PageFooter.jsx b/components/Layout/components/PageFooter.jsx index 6aa9689..5fd49ac 100644 --- a/components/Layout/components/PageFooter.jsx +++ b/components/Layout/components/PageFooter.jsx @@ -1,6 +1,7 @@ import React from 'react'; import Link from 'next/link'; import { Layout } from 'antd'; + import { FOOTER_FIRST_COLUMN, FOOTER_SECOND_COLUMN } from '../constants'; import FooterListCreator from './FooterListCreator'; diff --git a/components/Layout/components/PageLayout.jsx b/components/Layout/components/PageLayout.jsx index 8312099..2b9972c 100644 --- a/components/Layout/components/PageLayout.jsx +++ b/components/Layout/components/PageLayout.jsx @@ -2,6 +2,7 @@ import React from 'react'; import { Layout } from 'antd'; import PropTypes from 'prop-types'; + import NavHeader from './NavHeader'; import Sidebar from './Sidebar'; import PageFooter from './PageFooter'; diff --git a/components/Layout/components/Sidebar.jsx b/components/Layout/components/Sidebar.jsx index d497241..3968b67 100644 --- a/components/Layout/components/Sidebar.jsx +++ b/components/Layout/components/Sidebar.jsx @@ -2,6 +2,7 @@ import React from 'react'; import { Layout, Menu, Icon } from 'antd'; import Link from 'next/link'; import PropTypes from 'prop-types'; + import { SIDEBAR_MENU_ITEMS } from '../constants'; const { Sider } = Layout; From e31541b393bdc91996a955af3d893033575f3c23 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Wed, 29 May 2019 19:32:23 +0100 Subject: [PATCH 079/151] removed trailing spaces --- components/TimeLine/components/TimeLine.css | 271 ++++++++++---------- components/TimeLine/components/TimeLine.jsx | 1 + 2 files changed, 139 insertions(+), 133 deletions(-) diff --git a/components/TimeLine/components/TimeLine.css b/components/TimeLine/components/TimeLine.css index 81f26e4..5fad9db 100644 --- a/components/TimeLine/components/TimeLine.css +++ b/components/TimeLine/components/TimeLine.css @@ -1,4 +1,4 @@ -.create-icon-container{ +.create-icon-container { height: 50px; width: 50px; background-color: #1890ff; @@ -8,36 +8,36 @@ right: 20px; display: grid; place-items: center; - z-index:10 + z-index: 10 } -.create-icon{ +.create-icon { color: #ffffff; font-size: 1.5em; } -.create-post-icon{ +.create-post-icon { font-size: 32px; color: #1890ff; display: inline } -.modal-footer{ +.modal-footer { display: flex; justify-content: space-between; align-content: center; } -.compose-textarea{ +.compose-textarea { margin: 20px 0 0 0; } -.ant-input:hover{ +.ant-input:hover { outline: none; border-color: none; } -.post-container{ +.post-container { padding: 12px; display: flex; background: #ffffff; @@ -45,226 +45,231 @@ margin: 0 auto; } -.user-avatar{ +.user-avatar { height: 50px; margin-right: 12px; width: 50px; border-radius: 50%; - box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, .1), -1px -1px 2px 0px rgba(0, 0, 0, .1); + box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, .1), -1px -1px 2px 0px rgba(0, 0, 0, .1); } -.user-post-details{ + +.user-post-details { display: flex; justify-content: space-between; } -.user-name{ + +.user-name { font-weight: bold; margin-bottom: 0; } -.user-followers-stat{ +.user-followers-stat { display: flex; justify-content: center; margin: 1em; } -.users-follow-number > h3, .users-follow-number > p { +.users-follow-number>h3, +.users-follow-number>p { margin-bottom: 0; } -.create-post-modal{ +.create-post-modal { top: 20px; height: 100%; padding-right: 0; padding-left: 0; } -.user-time-posted{ + +.user-time-posted { font-weight: 100; margin-bottom: 0; } -.post-image{ - width:100%; - max-height:300px; +.post-image { + width: 100%; + max-height: 300px; object-fit: cover; -margin:0 auto; -margin-bottom: 16px; -} -.user-post{ - margin-top:4px; + margin: 0 auto; + margin-bottom: 16px; } +.user-post { + margin-top: 4px; +} - -.divider-height{ +.divider-height { height: 50px } -.post-reaction{ +.post-reaction { display: flex; - justify-content:flex-start; - align-items: center} + justify-content: flex-start; + align-items: center +} -.post-reaction > .message-icon{ - margin-right:24px +.post-reaction>.message-icon { + margin-right: 24px } -.post-reaction > .like-icon{ - margin-right:8px +.post-reaction>.like-icon { + margin-right: 8px } -.liked{ +.liked { color: #1890ff } -.post-reaction > *:active { - color:#1890ff; + +.post-reaction>*:active { + color: #1890ff; transform: scale(1.5); transition: all .2s; } -.comment-post-button{ +.comment-post-button { margin-top: 8px; } .TimeLine_profile-info, .TimeLine-post-component, .TimeLine_popular-topic, -.TimeLine_online-friends{ - background: #ffffff; -display: none; +.TimeLine_online-friends { + background: #ffffff; + display: none; } -.TimeLine_popular-topic > li{ -list-style-type: none; +.TimeLine_popular-topic>li { + list-style-type: none; } -.TimeLine_popular-topic li > a{ - color:#1890ff +.TimeLine_popular-topic li>a { + color: #1890ff } - - -.avartar-online{ +.avartar-online { height: 35px; width: 35px; } -.TimeLine_online-friends li{position: relative} -.TimeLine_online-friends li::after{ - content: ""; - display: block; - width: 10px; - height: 10px; - background-color: greenyellow; - border-radius: 50%; - position: absolute; - left: 30px; - top: 20px; - } +.TimeLine_online-friends li { + position: relative +} - .hide{ - display: none; - } +.TimeLine_online-friends li::after { + content: ""; + display: block; + width: 10px; + height: 10px; + background-color: greenyellow; + border-radius: 50%; + position: absolute; + left: 30px; + top: 20px; +} - .show{ - display: block - } +.hide { + display: none; +} - .skeleton-section{ - padding: 1em; - background-color: #ffffff; - } +.show { + display: block +} - .TimeLine_content{ - text-align: justify; - } +.skeleton-section { + padding: 1em; + background-color: #ffffff; +} -@media screen and (max-width:767px){ - .TimeLine_content{ +.TimeLine_content { + text-align: justify; +} + +@media screen and (max-width:767px) { + .TimeLine_content { max-width: 458px; margin: 0 auto; } } @media screen and (min-width: 768px) { + .create-icon-container { + display: none + } -.create-icon-container{ - display: none -} - -.user-post-details{ - justify-content: flex-start; + .user-post-details { + justify-content: flex-start; + } -} + .user-name { + margin-right: 1em; + } -.user-name{ - margin-right: 1em; -} - .TimeLine_content{ - margin: 1em; + .TimeLine_content { + margin: 1em; display: grid; grid-template-columns: 1fr 3fr; - grid-template-rows:350px repeat(2, minmax(auto, 310px)) auto; + grid-template-rows: 350px repeat(2, minmax(auto, 310px)) auto; grid-gap: 1em; -} + } -.TimeLine-post-component{ - background-color: #ffffff; - padding: 12px; -} + .TimeLine-post-component { + background-color: #ffffff; + padding: 12px; + } -ul{ - padding: 0; -} -li{ - list-style-type: none; - margin-bottom: .5rem; -} -.TimeLine_profile-info { + ul { + padding: 0; + } + + li { + list-style-type: none; + margin-bottom: .5rem; + } + + .TimeLine_profile-info { grid-row: 1/2; - text-align: center; -} + text-align: center; + } -.TimeLine_popular-topic{ - grid-row: 2/3; + .TimeLine_popular-topic { + grid-row: 2/3; + } -} -.TimeLine_online-friends{ - grid-row:3/4; + .TimeLine_online-friends { + grid-row: 3/4; + } -} + .TimeLine_profile-info, + .TimeLine-post-component, + .TimeLine_popular-topic, + .TimeLine_online-friends { + background: #ffffff; + display: block; + padding: 1em 24px; + } -.TimeLine_profile-info, -.TimeLine-post-component, -.TimeLine_popular-topic, -.TimeLine_online-friends{ - background: #ffffff; -display: block; -padding: 1em 24px; -} -.TimeLine_post{ -grid-row: 1/3; + .TimeLine_post { + grid-row: 1/3; grid-column: 2/3; } -.post-container{ - max-width: 100%; - padding: 1em 24px; -} - + .post-container { + max-width: 100%; + padding: 1em 24px; + } } @media screen and (min-width: 1024px) { - .TimeLine_content{ - grid-template-columns: minmax(200px, 1fr) 3fr minmax(200px, 1fr); + .TimeLine_content { + grid-template-columns: minmax(200px, 1fr) 3fr minmax(200px, 1fr); grid-template-rows: 350px minmax(auto, 310px) auto; margin: 1em 6em; -} - + } -.TimeLine_online-friends{ - grid-row:1/2; - grid-column: 3/4; - background-color: #ffffff; - padding: 1em; -} + .TimeLine_online-friends { + grid-row: 1/2; + grid-column: 3/4; + background-color: #ffffff; + padding: 1em; + } } diff --git a/components/TimeLine/components/TimeLine.jsx b/components/TimeLine/components/TimeLine.jsx index 51ff1c2..51d1995 100644 --- a/components/TimeLine/components/TimeLine.jsx +++ b/components/TimeLine/components/TimeLine.jsx @@ -3,6 +3,7 @@ import React from 'react'; import { Icon, Divider } from 'antd'; + import PageLayout from '../../Layout'; import './TimeLine.css'; import CreatePostModal from './CreatePostModal'; From 774fa8bd97382999e0e9ef53056a20b75c39bcbe Mon Sep 17 00:00:00 2001 From: uimarshall Date: Thu, 30 May 2019 09:10:58 +0100 Subject: [PATCH 080/151] pads if statement and change variables naming to camel case in validation/login.js --- validation/login.js | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/validation/login.js b/validation/login.js index 3b35cdc..f0ac540 100644 --- a/validation/login.js +++ b/validation/login.js @@ -5,20 +5,22 @@ module.exports = function validateLoginInput(data) { const errors = {}; // Validate Email - let checkemail = data.email; - checkemail = !isEmpty(checkemail) ? checkemail : ''; + let checkEmail = data.email; + checkEmail = !isEmpty(checkEmail) ? checkEmail : ''; // Validate Password - let checkpassword = data.password; + let checkPassword = data.password; - checkpassword = !isEmpty(checkpassword) ? checkpassword : ''; + checkPassword = !isEmpty(checkPassword) ? checkPassword : ''; - if (!Validator.isEmail(checkemail)) { + if (!Validator.isEmail(checkEmail)) { errors.email = 'Email is invalid'; } - if (Validator.isEmpty(checkemail)) { + + if (Validator.isEmpty(checkEmail)) { errors.email = 'Email field is required'; } - if (Validator.isEmpty(checkpassword)) { + + if (Validator.isEmpty(checkPassword)) { errors.password = 'Password field is required'; } From 30e264627ede42bbcedd855397a74a27b64a9431 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Thu, 30 May 2019 09:34:42 +0100 Subject: [PATCH 081/151] removed trailing spaces --- components/TimeLine/components/TimeLine.jsx | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/components/TimeLine/components/TimeLine.jsx b/components/TimeLine/components/TimeLine.jsx index 51d1995..58beacd 100644 --- a/components/TimeLine/components/TimeLine.jsx +++ b/components/TimeLine/components/TimeLine.jsx @@ -87,6 +87,12 @@ class TimeLine extends React.Component { }); }; + /** + * Helper function that is used to handle clicking on the comment button + * @function + * @param {Number} id the id of the commented post + * @return {Object} changes the state of the like component + */ handleComment = id => { this.setState({ comment: !this.state.comment, @@ -94,12 +100,22 @@ class TimeLine extends React.Component { }); }; + /** + * Helper function that is used to handle comment value + * @function + * @return {Object} changes the state of the comment value + */ handleCommentValue = e => { this.setState({ commentValue: e.target.value, }); } + /** + * Helper function that is used to handle status value + * @function + * @return {Object} changes the state of the status value + */ handleStatusValue = e => { this.setState({ statusValue: e.target.value, From 01abf1894f912938c3f925ee0818fe85aecf8041 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Thu, 30 May 2019 10:41:46 +0100 Subject: [PATCH 082/151] removed bindings so as to implement es6 class structure --- components/TimeLine/components/TimeLine.jsx | 40 ++++++++++----------- 1 file changed, 18 insertions(+), 22 deletions(-) diff --git a/components/TimeLine/components/TimeLine.jsx b/components/TimeLine/components/TimeLine.jsx index 58beacd..60a84e0 100644 --- a/components/TimeLine/components/TimeLine.jsx +++ b/components/TimeLine/components/TimeLine.jsx @@ -9,7 +9,7 @@ import './TimeLine.css'; import CreatePostModal from './CreatePostModal'; import { CreatePostComponent } from './CreatePostComponent'; // dummy data to be replaced with api data, commented so that test can pass, will be removed when api is ready -import data from '../../../data/data.json'; +// import data from '../../../data/data.json'; import { CREATEPOST_PLACEHOLDER, TIMELINE_TITLE } from '../constant'; @@ -24,24 +24,17 @@ import TimeLinePosts from './TimeLinePosts'; * @return {Object} returns the TimeLine component */ class TimeLine extends React.Component { - constructor(props) { - super(props); - this.state = { - profileData: '', - visible: false, - like: false, - likeCount: 0, - comment: false, - activeComment: '', - activeLikeButton: '', - statusValue: '', - commentValue: '', - }; - this.handleOk = this.handleOk.bind(this); - this.handleLikeButton = this.handleLikeButton.bind(this); - this.handleStatusValue = this.handleStatusValue.bind(this); - this.handleCommentValue = this.handleCommentValue.bind(this); - } + state = { + activeComment: '', + activeLikeButton: '', + comment: false, + commentValue: '', + like: false, + likeCount: 0, + profileData: '', + statusValue: '', + visible: false, + }; componentDidMount() { this.setState({ profileData: data }); @@ -53,8 +46,9 @@ class TimeLine extends React.Component { * @return {Object} returns 'true' to show the modal */ modalHandler = () => { + const { visible } = this.state; this.setState({ - visible: !this.state.visible, + visible, }); }; @@ -82,8 +76,9 @@ class TimeLine extends React.Component { * @return {Object} changes the state of the like component */ handleLikeButton = id => { + const { like } = this.state; this.setState({ - like: !this.state.like, + like: !like, }); }; @@ -94,9 +89,10 @@ class TimeLine extends React.Component { * @return {Object} changes the state of the like component */ handleComment = id => { + const { comment } = this.state; this.setState({ - comment: !this.state.comment, activeComment: id, + comment: !comment, }); }; From f68ec7de7d06fa8855a85ad84b047971dcc3da60 Mon Sep 17 00:00:00 2001 From: uimarshall Date: Thu, 30 May 2019 17:16:48 +0100 Subject: [PATCH 083/151] adds userInview to conditioner render user using auth0 --- lib/middleware/userInViews.js | 5 +++++ routes/api/users.js | 2 +- server/index.js | 2 ++ 3 files changed, 8 insertions(+), 1 deletion(-) create mode 100644 lib/middleware/userInViews.js diff --git a/lib/middleware/userInViews.js b/lib/middleware/userInViews.js new file mode 100644 index 0000000..db3476c --- /dev/null +++ b/lib/middleware/userInViews.js @@ -0,0 +1,5 @@ +// the user object is necessary in order to customize the view. +module.exports = () => (req, res, next) => { + res.locals.user = req.user; + next(); +}; diff --git a/routes/api/users.js b/routes/api/users.js index 07af471..0b946b9 100644 --- a/routes/api/users.js +++ b/routes/api/users.js @@ -95,7 +95,7 @@ router.get('/callback', (req, res, next) => passport.authenticate('auth0', (err, const { returnTo } = req.session; delete req.session.returnTo; - return res.redirect(returnTo || '/user'); + return res.redirect(returnTo || '/'); }); })(req, res, next)); diff --git a/server/index.js b/server/index.js index 3671a98..addb9a9 100644 --- a/server/index.js +++ b/server/index.js @@ -7,6 +7,7 @@ const session = require('express-session'); const bodyParser = require('body-parser'); const users = require('../routes/api/users'); const profile = require('../routes/api/profile'); +const userInViews = require('../lib/middleware/userInViews'); const PORT = process.env.PORT || 3000; const dev = process.env.NODE_DEV !== 'production'; @@ -49,6 +50,7 @@ nextApp.prepare().then(() => { app.use(session(sess)); // Routes Middleware + app.use(userInViews()); app.use('/api/users', users); app.use('/api/profile', profile); From 74fb73e2bbecfa9742c1e9d2be0639102108bff4 Mon Sep 17 00:00:00 2001 From: Justice Otuya Date: Thu, 30 May 2019 18:24:25 +0100 Subject: [PATCH 084/151] finished the ui of the timeline --- .../components/CreatePostComponent.jsx | 106 ++++++++++++++++++ .../TimeLine/components/CreatePostModal.jsx | 37 ++++++ components/TimeLine/components/TimeLine.jsx | 48 ++++---- .../components/TimeLineOnlineFriends.jsx | 28 +++++ .../components/TimeLinePopularTopic.jsx | 26 +++++ .../TimeLine/components/TimeLinePosts.jsx | 100 +++++++++++++++++ .../components/TimeLineProfileInfo.jsx | 39 +++++++ components/TimeLine/constant.js | 21 +++- 8 files changed, 379 insertions(+), 26 deletions(-) create mode 100644 components/TimeLine/components/CreatePostComponent.jsx create mode 100644 components/TimeLine/components/CreatePostModal.jsx create mode 100644 components/TimeLine/components/TimeLineOnlineFriends.jsx create mode 100644 components/TimeLine/components/TimeLinePopularTopic.jsx create mode 100644 components/TimeLine/components/TimeLinePosts.jsx create mode 100644 components/TimeLine/components/TimeLineProfileInfo.jsx diff --git a/components/TimeLine/components/CreatePostComponent.jsx b/components/TimeLine/components/CreatePostComponent.jsx new file mode 100644 index 0000000..2800498 --- /dev/null +++ b/components/TimeLine/components/CreatePostComponent.jsx @@ -0,0 +1,106 @@ +import React from 'react'; +import { + Icon, Button, Upload, Input +} from 'antd'; +import PropTypes from 'prop-types'; + +import './TimeLine.css'; +import { POST } from '../constant'; + +const { TextArea } = Input; + +/** + * Helper function that is used for creating the input part of the post *component + * @function + * @param {String} InputPlaceholder - the placeholder for the input component + * @param {integer} rowHeight - the minimum amount of rows that the input component will initially contain + * @return {Object} the input part of the createpost component + */ +const CreatePostInput = props => { + const { + InputPlaceholder, rowHeight, handleOnChange, postValue, textValue, + } = props; + return ( +