diff --git a/neon-html/.editorconfig b/neon-html/.editorconfig new file mode 100644 index 0000000..205b32c --- /dev/null +++ b/neon-html/.editorconfig @@ -0,0 +1,13 @@ +# editorconfig.org + +root = true + +[*] +charset = utf-8 +indent_size = 2 +indent_style = space +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false \ No newline at end of file diff --git a/neon-html/.gitignore b/neon-html/.gitignore new file mode 100644 index 0000000..d4eda9d --- /dev/null +++ b/neon-html/.gitignore @@ -0,0 +1,29 @@ +## Node.js +lib-cov +*.seed +*.log +*.csv +*.dat +*.out +*.pid +*.gz +pids +logs +results +npm-debug.log +node_modules + +## OS X +.DS_Store +.AppleDouble +.LSOverride +Icon +._* +.Spotlight-V100 +.Trashes + +## Windows +Thumbs.db +ehthumbs.db +Desktop.ini +$RECYCLE.BIN/ diff --git a/neon-html/CHANGELOG.md b/neon-html/CHANGELOG.md new file mode 100644 index 0000000..fc7ddfb --- /dev/null +++ b/neon-html/CHANGELOG.md @@ -0,0 +1,5 @@ +# CHANGELOG.md + +## [1.0.0] - 2022-07-28 + +First release diff --git a/neon-html/README.md b/neon-html/README.md new file mode 100644 index 0000000..b8da68b --- /dev/null +++ b/neon-html/README.md @@ -0,0 +1,16 @@ +# Neon HTML + +HTML landing page template designed by Cruip. + +This HTML template is shipped with the (Tailwind CLI tool)[https://tailwindcss.com/docs/installation]. + +* [Getting started](#getting-started) + +## Getting started + +* First, ensure that node.js & npm are both installed. If not, choose your OS and installation method from [this page](https://nodejs.org/en/download/package-manager/) and follow the instructions. +* Next, use your command line to enter your project directory. +* This template comes with a ready-to-use package file called `package.json`. You just need to run `npm install` to install all of the dependencies into your project. +* When `npm` has finished with the install, run `npm run build` to recompile the `style.css` file in the root directory. + +You're ready to go! The most useful task for rapid development is `npm run dev`, which rebuild the CSS every time you make a change in the HML or JS files. diff --git a/neon-html/css/additional-styles/custom-fonts.css b/neon-html/css/additional-styles/custom-fonts.css new file mode 100644 index 0000000..025291d --- /dev/null +++ b/neon-html/css/additional-styles/custom-fonts.css @@ -0,0 +1,35 @@ +@font-face { + font-family: 'Uncut Sans'; + font-weight: 700; + font-style: normal; + font-display: fallback; + src: url('fonts/Uncut-Sans-Bold.woff2') format('woff2'), + url('fonts/Uncut-Sans-Bold.woff') format('woff'); +} + +@font-face { + font-family: 'Uncut Sans'; + font-weight: 700; + font-style: italic; + font-display: fallback; + src: url('fonts/Uncut-Sans-BoldOblique.woff2') format('woff2'), + url('fonts/Uncut-Sans-BoldOblique.woff') format('woff'); +} + +@font-face { + font-family: 'Uncut Sans'; + font-weight: 600; + font-style: normal; + font-display: fallback; + src: url('fonts/Uncut-Sans-Semibold.woff2') format('woff2'), + url('fonts/Uncut-Sans-Semibold.woff') format('woff'); +} + +@font-face { + font-family: 'Uncut Sans'; + font-weight: 500; + font-style: normal; + font-display: fallback; + src: url('fonts/Uncut-Sans-Medium.woff2') format('woff2'), + url('fonts/Uncut-Sans-Medium.woff') format('woff'); +} \ No newline at end of file diff --git a/neon-html/css/additional-styles/range-slider.css b/neon-html/css/additional-styles/range-slider.css new file mode 100644 index 0000000..6a10824 --- /dev/null +++ b/neon-html/css/additional-styles/range-slider.css @@ -0,0 +1,57 @@ +/* Range slider */ +:root { + --range-thumb-size: 36px; +} + +input[type=range] { + appearance: none; + background: #ccc; + border-radius: 3px; + height: 6px; + margin-top: (--range-thumb-size - 6px) * 0.5; + margin-bottom: (--range-thumb-size - 6px) * 0.5; + --thumb-size: #{--range-thumb-size}; +} + +input[type=range]::-webkit-slider-thumb { + appearance: none; + -webkit-appearance: none; + background-color: #000; + background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"); + background-position: center; + background-repeat: no-repeat; + border: 0; + border-radius: 50%; + cursor: pointer; + height: --range-thumb-size; + width: --range-thumb-size; +} + +input[type=range]::-moz-range-thumb { + background-color: #000; + background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"); + background-position: center; + background-repeat: no-repeat; + border: 0; + border: none; + border-radius: 50%; + cursor: pointer; + height: --range-thumb-size; + width: --range-thumb-size; +} + +input[type=range]::-ms-thumb { + background-color: #000; + background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"); + background-position: center; + background-repeat: no-repeat; + border: 0; + border-radius: 50%; + cursor: pointer; + height: --range-thumb-size; + width: --range-thumb-size; +} + +input[type=range]::-moz-focus-outer { + border: 0; +} \ No newline at end of file diff --git a/neon-html/css/additional-styles/theme.css b/neon-html/css/additional-styles/theme.css new file mode 100644 index 0000000..abe92ed --- /dev/null +++ b/neon-html/css/additional-styles/theme.css @@ -0,0 +1,54 @@ +.form-input:focus, +.form-textarea:focus, +.form-multiselect:focus, +.form-select:focus, +.form-checkbox:focus, +.form-radio:focus { + @apply ring-0; +} + +/* Hamburger button */ +.hamburger svg>*:nth-child(1), +.hamburger svg>*:nth-child(2), +.hamburger svg>*:nth-child(3) { + transform-origin: center; + transform: rotate(0deg); +} + +.hamburger svg>*:nth-child(1) { + transition: y 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), opacity 0.1s ease-in; +} + +.hamburger svg>*:nth-child(2) { + transition: transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); +} + +.hamburger svg>*:nth-child(3) { + transition: y 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), width 0.1s 0.25s ease-in; +} + +.hamburger.active svg>*:nth-child(1) { + opacity: 0; + y: 11; + transform: rotate(225deg); + transition: y 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.1s 0.12s ease-out; +} + +.hamburger.active svg>*:nth-child(2) { + transform: rotate(225deg); + transition: transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); +} + +.hamburger.active svg>*:nth-child(3) { + y: 11; + transform: rotate(135deg); + transition: y 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), width 0.1s ease-out; +} + +/* Custom AOS distance */ +@media screen { + html:not(.no-js) [data-aos=zoom-out] { + -webkit-transform: scale(1.05); + transform: scale(1.05) + } +} \ No newline at end of file diff --git a/neon-html/css/additional-styles/toggle-switch.css b/neon-html/css/additional-styles/toggle-switch.css new file mode 100644 index 0000000..5793e25 --- /dev/null +++ b/neon-html/css/additional-styles/toggle-switch.css @@ -0,0 +1,16 @@ +/* Switch element */ +.form-switch { + @apply relative select-none w-12 my-2; +} + +.form-switch label { + @apply block overflow-hidden cursor-pointer rounded-full h-4; +} + +.form-switch label>span:first-child { + @apply absolute block rounded-full w-8 h-8 right-1/2 -left-2 -top-2 transition-all duration-150 ease-out; +} + +.form-switch input[type="checkbox"]:checked+label>span:first-child { + @apply bg-blue-200 border-blue-600 left-6; +} diff --git a/neon-html/css/additional-styles/utility-patterns.css b/neon-html/css/additional-styles/utility-patterns.css new file mode 100644 index 0000000..bbace67 --- /dev/null +++ b/neon-html/css/additional-styles/utility-patterns.css @@ -0,0 +1,96 @@ +/* Typography */ +.h1 { + @apply text-6xl font-bold; +} + +.h2 { + @apply text-4xl font-bold; +} + +.h3 { + @apply text-3xl font-bold; +} + +.h4 { + @apply text-2xl font-bold; +} + +@screen md { + .h1 { + @apply text-7xl; + } + + .h2 { + @apply text-5xl; + } +} + +/* Buttons */ +.btn, +.btn-sm { + @apply font-medium inline-flex items-center justify-center rounded leading-normal transition duration-150 ease-in-out; +} + +.btn { + @apply px-6 py-3; +} + +.btn-sm { + @apply px-4 py-2; +} + +/* Forms */ +input[type="search"]::-webkit-search-decoration, +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-results-button, +input[type="search"]::-webkit-search-results-decoration { + -webkit-appearance: none; +} + +.form-input, +.form-textarea, +.form-multiselect, +.form-select, +.form-checkbox, +.form-radio { + @apply bg-gray-800 border border-gray-700 focus:border-blue-500; +} + +.form-input, +.form-textarea, +.form-multiselect, +.form-select, +.form-checkbox { + @apply rounded-sm; +} + +.form-input, +.form-textarea, +.form-multiselect, +.form-select { + @apply py-3 px-4; +} + +.form-input, +.form-textarea { + @apply placeholder-gray-500 leading-snug; +} + +.form-select { + @apply pr-10; +} + +.form-checkbox, +.form-radio { + @apply text-blue-600 rounded-sm; +} + +/* Chrome, Safari and Opera */ +.no-scrollbar::-webkit-scrollbar { + display: none; +} + +.no-scrollbar { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ +} \ No newline at end of file diff --git a/neon-html/css/style.css b/neon-html/css/style.css new file mode 100644 index 0000000..c3c3369 --- /dev/null +++ b/neon-html/css/style.css @@ -0,0 +1,25 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=fallback'); +@import 'additional-styles/custom-fonts'; + +@import 'tailwindcss/base'; +@import 'tailwindcss/components'; + +/* Additional styles */ +@import 'additional-styles/utility-patterns.css'; +@import 'additional-styles/range-slider.css'; +@import 'additional-styles/toggle-switch.css'; +@import 'additional-styles/theme.css'; + +@import 'tailwindcss/utilities'; + +/* Additional Tailwind directives: https://tailwindcss.com/docs/functions-and-directives/#responsive */ +@layer utilities { + .rtl { + direction: rtl; + } +} + +/* See Alpine.js: https://github.com/alpinejs/alpine#x-cloak */ +[x-cloak=""] { + display: none; +} diff --git a/neon-html/css/vendors/aos.css b/neon-html/css/vendors/aos.css new file mode 100644 index 0000000..2e1a9be --- /dev/null +++ b/neon-html/css/vendors/aos.css @@ -0,0 +1 @@ +[data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos]{transition-duration:50ms}[data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate{transition-delay:50ms}[data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos]{transition-duration:.1s}[data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate{transition-delay:.1s}[data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos]{transition-duration:.15s}[data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate{transition-delay:.15s}[data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos]{transition-duration:.2s}[data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate{transition-delay:.2s}[data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos]{transition-duration:.25s}[data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate{transition-delay:.25s}[data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos]{transition-duration:.3s}[data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate{transition-delay:.3s}[data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos]{transition-duration:.35s}[data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate{transition-delay:.35s}[data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{transition-duration:.4s}[data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate{transition-delay:.4s}[data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos]{transition-duration:.45s}[data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate{transition-delay:.45s}[data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos]{transition-duration:.5s}[data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate{transition-delay:.5s}[data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos]{transition-duration:.55s}[data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate{transition-delay:.55s}[data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos]{transition-duration:.6s}[data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate{transition-delay:.6s}[data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos]{transition-duration:.65s}[data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate{transition-delay:.65s}[data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos]{transition-duration:.7s}[data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate{transition-delay:.7s}[data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos]{transition-duration:.75s}[data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="750"].aos-animate,body[data-aos-delay="750"] [data-aos].aos-animate{transition-delay:.75s}[data-aos][data-aos][data-aos-duration="800"],body[data-aos-duration="800"] [data-aos]{transition-duration:.8s}[data-aos][data-aos][data-aos-delay="800"],body[data-aos-delay="800"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="800"].aos-animate,body[data-aos-delay="800"] [data-aos].aos-animate{transition-delay:.8s}[data-aos][data-aos][data-aos-duration="850"],body[data-aos-duration="850"] [data-aos]{transition-duration:.85s}[data-aos][data-aos][data-aos-delay="850"],body[data-aos-delay="850"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="850"].aos-animate,body[data-aos-delay="850"] [data-aos].aos-animate{transition-delay:.85s}[data-aos][data-aos][data-aos-duration="900"],body[data-aos-duration="900"] [data-aos]{transition-duration:.9s}[data-aos][data-aos][data-aos-delay="900"],body[data-aos-delay="900"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="900"].aos-animate,body[data-aos-delay="900"] [data-aos].aos-animate{transition-delay:.9s}[data-aos][data-aos][data-aos-duration="950"],body[data-aos-duration="950"] [data-aos]{transition-duration:.95s}[data-aos][data-aos][data-aos-delay="950"],body[data-aos-delay="950"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="950"].aos-animate,body[data-aos-delay="950"] [data-aos].aos-animate{transition-delay:.95s}[data-aos][data-aos][data-aos-duration="1000"],body[data-aos-duration="1000"] [data-aos]{transition-duration:1s}[data-aos][data-aos][data-aos-delay="1000"],body[data-aos-delay="1000"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1000"].aos-animate,body[data-aos-delay="1000"] [data-aos].aos-animate{transition-delay:1s}[data-aos][data-aos][data-aos-duration="1050"],body[data-aos-duration="1050"] [data-aos]{transition-duration:1.05s}[data-aos][data-aos][data-aos-delay="1050"],body[data-aos-delay="1050"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1050"].aos-animate,body[data-aos-delay="1050"] [data-aos].aos-animate{transition-delay:1.05s}[data-aos][data-aos][data-aos-duration="1100"],body[data-aos-duration="1100"] [data-aos]{transition-duration:1.1s}[data-aos][data-aos][data-aos-delay="1100"],body[data-aos-delay="1100"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1100"].aos-animate,body[data-aos-delay="1100"] [data-aos].aos-animate{transition-delay:1.1s}[data-aos][data-aos][data-aos-duration="1150"],body[data-aos-duration="1150"] [data-aos]{transition-duration:1.15s}[data-aos][data-aos][data-aos-delay="1150"],body[data-aos-delay="1150"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1150"].aos-animate,body[data-aos-delay="1150"] [data-aos].aos-animate{transition-delay:1.15s}[data-aos][data-aos][data-aos-duration="1200"],body[data-aos-duration="1200"] [data-aos]{transition-duration:1.2s}[data-aos][data-aos][data-aos-delay="1200"],body[data-aos-delay="1200"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1200"].aos-animate,body[data-aos-delay="1200"] [data-aos].aos-animate{transition-delay:1.2s}[data-aos][data-aos][data-aos-duration="1250"],body[data-aos-duration="1250"] [data-aos]{transition-duration:1.25s}[data-aos][data-aos][data-aos-delay="1250"],body[data-aos-delay="1250"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1250"].aos-animate,body[data-aos-delay="1250"] [data-aos].aos-animate{transition-delay:1.25s}[data-aos][data-aos][data-aos-duration="1300"],body[data-aos-duration="1300"] [data-aos]{transition-duration:1.3s}[data-aos][data-aos][data-aos-delay="1300"],body[data-aos-delay="1300"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1300"].aos-animate,body[data-aos-delay="1300"] [data-aos].aos-animate{transition-delay:1.3s}[data-aos][data-aos][data-aos-duration="1350"],body[data-aos-duration="1350"] [data-aos]{transition-duration:1.35s}[data-aos][data-aos][data-aos-delay="1350"],body[data-aos-delay="1350"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1350"].aos-animate,body[data-aos-delay="1350"] [data-aos].aos-animate{transition-delay:1.35s}[data-aos][data-aos][data-aos-duration="1400"],body[data-aos-duration="1400"] [data-aos]{transition-duration:1.4s}[data-aos][data-aos][data-aos-delay="1400"],body[data-aos-delay="1400"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1400"].aos-animate,body[data-aos-delay="1400"] [data-aos].aos-animate{transition-delay:1.4s}[data-aos][data-aos][data-aos-duration="1450"],body[data-aos-duration="1450"] [data-aos]{transition-duration:1.45s}[data-aos][data-aos][data-aos-delay="1450"],body[data-aos-delay="1450"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1450"].aos-animate,body[data-aos-delay="1450"] [data-aos].aos-animate{transition-delay:1.45s}[data-aos][data-aos][data-aos-duration="1500"],body[data-aos-duration="1500"] [data-aos]{transition-duration:1.5s}[data-aos][data-aos][data-aos-delay="1500"],body[data-aos-delay="1500"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1500"].aos-animate,body[data-aos-delay="1500"] [data-aos].aos-animate{transition-delay:1.5s}[data-aos][data-aos][data-aos-duration="1550"],body[data-aos-duration="1550"] [data-aos]{transition-duration:1.55s}[data-aos][data-aos][data-aos-delay="1550"],body[data-aos-delay="1550"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1550"].aos-animate,body[data-aos-delay="1550"] [data-aos].aos-animate{transition-delay:1.55s}[data-aos][data-aos][data-aos-duration="1600"],body[data-aos-duration="1600"] [data-aos]{transition-duration:1.6s}[data-aos][data-aos][data-aos-delay="1600"],body[data-aos-delay="1600"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1600"].aos-animate,body[data-aos-delay="1600"] [data-aos].aos-animate{transition-delay:1.6s}[data-aos][data-aos][data-aos-duration="1650"],body[data-aos-duration="1650"] [data-aos]{transition-duration:1.65s}[data-aos][data-aos][data-aos-delay="1650"],body[data-aos-delay="1650"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1650"].aos-animate,body[data-aos-delay="1650"] [data-aos].aos-animate{transition-delay:1.65s}[data-aos][data-aos][data-aos-duration="1700"],body[data-aos-duration="1700"] [data-aos]{transition-duration:1.7s}[data-aos][data-aos][data-aos-delay="1700"],body[data-aos-delay="1700"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1700"].aos-animate,body[data-aos-delay="1700"] [data-aos].aos-animate{transition-delay:1.7s}[data-aos][data-aos][data-aos-duration="1750"],body[data-aos-duration="1750"] [data-aos]{transition-duration:1.75s}[data-aos][data-aos][data-aos-delay="1750"],body[data-aos-delay="1750"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1750"].aos-animate,body[data-aos-delay="1750"] [data-aos].aos-animate{transition-delay:1.75s}[data-aos][data-aos][data-aos-duration="1800"],body[data-aos-duration="1800"] [data-aos]{transition-duration:1.8s}[data-aos][data-aos][data-aos-delay="1800"],body[data-aos-delay="1800"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1800"].aos-animate,body[data-aos-delay="1800"] [data-aos].aos-animate{transition-delay:1.8s}[data-aos][data-aos][data-aos-duration="1850"],body[data-aos-duration="1850"] [data-aos]{transition-duration:1.85s}[data-aos][data-aos][data-aos-delay="1850"],body[data-aos-delay="1850"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1850"].aos-animate,body[data-aos-delay="1850"] [data-aos].aos-animate{transition-delay:1.85s}[data-aos][data-aos][data-aos-duration="1900"],body[data-aos-duration="1900"] [data-aos]{transition-duration:1.9s}[data-aos][data-aos][data-aos-delay="1900"],body[data-aos-delay="1900"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1900"].aos-animate,body[data-aos-delay="1900"] [data-aos].aos-animate{transition-delay:1.9s}[data-aos][data-aos][data-aos-duration="1950"],body[data-aos-duration="1950"] [data-aos]{transition-duration:1.95s}[data-aos][data-aos][data-aos-delay="1950"],body[data-aos-delay="1950"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1950"].aos-animate,body[data-aos-delay="1950"] [data-aos].aos-animate{transition-delay:1.95s}[data-aos][data-aos][data-aos-duration="2000"],body[data-aos-duration="2000"] [data-aos]{transition-duration:2s}[data-aos][data-aos][data-aos-delay="2000"],body[data-aos-delay="2000"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2000"].aos-animate,body[data-aos-delay="2000"] [data-aos].aos-animate{transition-delay:2s}[data-aos][data-aos][data-aos-duration="2050"],body[data-aos-duration="2050"] [data-aos]{transition-duration:2.05s}[data-aos][data-aos][data-aos-delay="2050"],body[data-aos-delay="2050"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2050"].aos-animate,body[data-aos-delay="2050"] [data-aos].aos-animate{transition-delay:2.05s}[data-aos][data-aos][data-aos-duration="2100"],body[data-aos-duration="2100"] [data-aos]{transition-duration:2.1s}[data-aos][data-aos][data-aos-delay="2100"],body[data-aos-delay="2100"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2100"].aos-animate,body[data-aos-delay="2100"] [data-aos].aos-animate{transition-delay:2.1s}[data-aos][data-aos][data-aos-duration="2150"],body[data-aos-duration="2150"] [data-aos]{transition-duration:2.15s}[data-aos][data-aos][data-aos-delay="2150"],body[data-aos-delay="2150"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2150"].aos-animate,body[data-aos-delay="2150"] [data-aos].aos-animate{transition-delay:2.15s}[data-aos][data-aos][data-aos-duration="2200"],body[data-aos-duration="2200"] [data-aos]{transition-duration:2.2s}[data-aos][data-aos][data-aos-delay="2200"],body[data-aos-delay="2200"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2200"].aos-animate,body[data-aos-delay="2200"] [data-aos].aos-animate{transition-delay:2.2s}[data-aos][data-aos][data-aos-duration="2250"],body[data-aos-duration="2250"] [data-aos]{transition-duration:2.25s}[data-aos][data-aos][data-aos-delay="2250"],body[data-aos-delay="2250"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2250"].aos-animate,body[data-aos-delay="2250"] [data-aos].aos-animate{transition-delay:2.25s}[data-aos][data-aos][data-aos-duration="2300"],body[data-aos-duration="2300"] [data-aos]{transition-duration:2.3s}[data-aos][data-aos][data-aos-delay="2300"],body[data-aos-delay="2300"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2300"].aos-animate,body[data-aos-delay="2300"] [data-aos].aos-animate{transition-delay:2.3s}[data-aos][data-aos][data-aos-duration="2350"],body[data-aos-duration="2350"] [data-aos]{transition-duration:2.35s}[data-aos][data-aos][data-aos-delay="2350"],body[data-aos-delay="2350"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2350"].aos-animate,body[data-aos-delay="2350"] [data-aos].aos-animate{transition-delay:2.35s}[data-aos][data-aos][data-aos-duration="2400"],body[data-aos-duration="2400"] [data-aos]{transition-duration:2.4s}[data-aos][data-aos][data-aos-delay="2400"],body[data-aos-delay="2400"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2400"].aos-animate,body[data-aos-delay="2400"] [data-aos].aos-animate{transition-delay:2.4s}[data-aos][data-aos][data-aos-duration="2450"],body[data-aos-duration="2450"] [data-aos]{transition-duration:2.45s}[data-aos][data-aos][data-aos-delay="2450"],body[data-aos-delay="2450"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2450"].aos-animate,body[data-aos-delay="2450"] [data-aos].aos-animate{transition-delay:2.45s}[data-aos][data-aos][data-aos-duration="2500"],body[data-aos-duration="2500"] [data-aos]{transition-duration:2.5s}[data-aos][data-aos][data-aos-delay="2500"],body[data-aos-delay="2500"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2500"].aos-animate,body[data-aos-delay="2500"] [data-aos].aos-animate{transition-delay:2.5s}[data-aos][data-aos][data-aos-duration="2550"],body[data-aos-duration="2550"] [data-aos]{transition-duration:2.55s}[data-aos][data-aos][data-aos-delay="2550"],body[data-aos-delay="2550"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2550"].aos-animate,body[data-aos-delay="2550"] [data-aos].aos-animate{transition-delay:2.55s}[data-aos][data-aos][data-aos-duration="2600"],body[data-aos-duration="2600"] [data-aos]{transition-duration:2.6s}[data-aos][data-aos][data-aos-delay="2600"],body[data-aos-delay="2600"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2600"].aos-animate,body[data-aos-delay="2600"] [data-aos].aos-animate{transition-delay:2.6s}[data-aos][data-aos][data-aos-duration="2650"],body[data-aos-duration="2650"] [data-aos]{transition-duration:2.65s}[data-aos][data-aos][data-aos-delay="2650"],body[data-aos-delay="2650"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2650"].aos-animate,body[data-aos-delay="2650"] [data-aos].aos-animate{transition-delay:2.65s}[data-aos][data-aos][data-aos-duration="2700"],body[data-aos-duration="2700"] [data-aos]{transition-duration:2.7s}[data-aos][data-aos][data-aos-delay="2700"],body[data-aos-delay="2700"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2700"].aos-animate,body[data-aos-delay="2700"] [data-aos].aos-animate{transition-delay:2.7s}[data-aos][data-aos][data-aos-duration="2750"],body[data-aos-duration="2750"] [data-aos]{transition-duration:2.75s}[data-aos][data-aos][data-aos-delay="2750"],body[data-aos-delay="2750"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2750"].aos-animate,body[data-aos-delay="2750"] [data-aos].aos-animate{transition-delay:2.75s}[data-aos][data-aos][data-aos-duration="2800"],body[data-aos-duration="2800"] [data-aos]{transition-duration:2.8s}[data-aos][data-aos][data-aos-delay="2800"],body[data-aos-delay="2800"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2800"].aos-animate,body[data-aos-delay="2800"] [data-aos].aos-animate{transition-delay:2.8s}[data-aos][data-aos][data-aos-duration="2850"],body[data-aos-duration="2850"] [data-aos]{transition-duration:2.85s}[data-aos][data-aos][data-aos-delay="2850"],body[data-aos-delay="2850"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2850"].aos-animate,body[data-aos-delay="2850"] [data-aos].aos-animate{transition-delay:2.85s}[data-aos][data-aos][data-aos-duration="2900"],body[data-aos-duration="2900"] [data-aos]{transition-duration:2.9s}[data-aos][data-aos][data-aos-delay="2900"],body[data-aos-delay="2900"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2900"].aos-animate,body[data-aos-delay="2900"] [data-aos].aos-animate{transition-delay:2.9s}[data-aos][data-aos][data-aos-duration="2950"],body[data-aos-duration="2950"] [data-aos]{transition-duration:2.95s}[data-aos][data-aos][data-aos-delay="2950"],body[data-aos-delay="2950"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2950"].aos-animate,body[data-aos-delay="2950"] [data-aos].aos-animate{transition-delay:2.95s}[data-aos][data-aos][data-aos-duration="3000"],body[data-aos-duration="3000"] [data-aos]{transition-duration:3s}[data-aos][data-aos][data-aos-delay="3000"],body[data-aos-delay="3000"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="3000"].aos-animate,body[data-aos-delay="3000"] [data-aos].aos-animate{transition-delay:3s}[data-aos]{pointer-events:none}[data-aos].aos-animate{pointer-events:auto}[data-aos][data-aos][data-aos-easing=linear],body[data-aos-easing=linear] [data-aos]{transition-timing-function:cubic-bezier(.25,.25,.75,.75)}[data-aos][data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos]{transition-timing-function:ease}[data-aos][data-aos][data-aos-easing=ease-in],body[data-aos-easing=ease-in] [data-aos]{transition-timing-function:ease-in}[data-aos][data-aos][data-aos-easing=ease-out],body[data-aos-easing=ease-out] [data-aos]{transition-timing-function:ease-out}[data-aos][data-aos][data-aos-easing=ease-in-out],body[data-aos-easing=ease-in-out] [data-aos]{transition-timing-function:ease-in-out}[data-aos][data-aos][data-aos-easing=ease-in-back],body[data-aos-easing=ease-in-back] [data-aos]{transition-timing-function:cubic-bezier(.6,-.28,.735,.045)}[data-aos][data-aos][data-aos-easing=ease-out-back],body[data-aos-easing=ease-out-back] [data-aos]{transition-timing-function:cubic-bezier(.175,.885,.32,1.275)}[data-aos][data-aos][data-aos-easing=ease-in-out-back],body[data-aos-easing=ease-in-out-back] [data-aos]{transition-timing-function:cubic-bezier(.68,-.55,.265,1.55)}[data-aos][data-aos][data-aos-easing=ease-in-sine],body[data-aos-easing=ease-in-sine] [data-aos]{transition-timing-function:cubic-bezier(.47,0,.745,.715)}[data-aos][data-aos][data-aos-easing=ease-out-sine],body[data-aos-easing=ease-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.39,.575,.565,1)}[data-aos][data-aos][data-aos-easing=ease-in-out-sine],body[data-aos-easing=ease-in-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.445,.05,.55,.95)}[data-aos][data-aos][data-aos-easing=ease-in-quad],body[data-aos-easing=ease-in-quad] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quad],body[data-aos-easing=ease-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quad],body[data-aos-easing=ease-in-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-cubic],body[data-aos-easing=ease-in-cubic] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-cubic],body[data-aos-easing=ease-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-cubic],body[data-aos-easing=ease-in-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-quart],body[data-aos-easing=ease-in-quart] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quart],body[data-aos-easing=ease-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quart],body[data-aos-easing=ease-in-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}@media screen{html:not(.no-js) [data-aos^=fade][data-aos^=fade]{opacity:0;transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}html:not(.no-js) [data-aos^=fade][data-aos^=fade].aos-animate{opacity:1;-webkit-transform:none;transform:none}html:not(.no-js) [data-aos=fade-up]{-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}html:not(.no-js) [data-aos=fade-down]{-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}html:not(.no-js) [data-aos=fade-right]{-webkit-transform:translate3d(-100px,0,0);transform:translate3d(-100px,0,0)}html:not(.no-js) [data-aos=fade-left]{-webkit-transform:translate3d(100px,0,0);transform:translate3d(100px,0,0)}html:not(.no-js) [data-aos=fade-up-right]{-webkit-transform:translate3d(-100px,100px,0);transform:translate3d(-100px,100px,0)}html:not(.no-js) [data-aos=fade-up-left]{-webkit-transform:translate3d(100px,100px,0);transform:translate3d(100px,100px,0)}html:not(.no-js) [data-aos=fade-down-right]{-webkit-transform:translate3d(-100px,-100px,0);transform:translate3d(-100px,-100px,0)}html:not(.no-js) [data-aos=fade-down-left]{-webkit-transform:translate3d(100px,-100px,0);transform:translate3d(100px,-100px,0)}html:not(.no-js) [data-aos^=zoom][data-aos^=zoom]{opacity:0;transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}html:not(.no-js) [data-aos^=zoom][data-aos^=zoom].aos-animate{opacity:1;-webkit-transform:translateZ(0) scale(1);transform:translateZ(0) scale(1)}html:not(.no-js) [data-aos=zoom-in]{-webkit-transform:scale(.6);transform:scale(.6)}html:not(.no-js) [data-aos=zoom-in-up]{-webkit-transform:translate3d(0,100px,0) scale(.6);transform:translate3d(0,100px,0) scale(.6)}html:not(.no-js) [data-aos=zoom-in-down]{-webkit-transform:translate3d(0,-100px,0) scale(.6);transform:translate3d(0,-100px,0) scale(.6)}html:not(.no-js) [data-aos=zoom-in-right]{-webkit-transform:translate3d(-100px,0,0) scale(.6);transform:translate3d(-100px,0,0) scale(.6)}html:not(.no-js) [data-aos=zoom-in-left]{-webkit-transform:translate3d(100px,0,0) scale(.6);transform:translate3d(100px,0,0) scale(.6)}html:not(.no-js) [data-aos=zoom-out]{-webkit-transform:scale(1.2);transform:scale(1.2)}html:not(.no-js) [data-aos=zoom-out-up]{-webkit-transform:translate3d(0,100px,0) scale(1.2);transform:translate3d(0,100px,0) scale(1.2)}html:not(.no-js) [data-aos=zoom-out-down]{-webkit-transform:translate3d(0,-100px,0) scale(1.2);transform:translate3d(0,-100px,0) scale(1.2)}html:not(.no-js) [data-aos=zoom-out-right]{-webkit-transform:translate3d(-100px,0,0) scale(1.2);transform:translate3d(-100px,0,0) scale(1.2)}html:not(.no-js) [data-aos=zoom-out-left]{-webkit-transform:translate3d(100px,0,0) scale(1.2);transform:translate3d(100px,0,0) scale(1.2)}html:not(.no-js) [data-aos^=slide][data-aos^=slide]{transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;visibility:hidden}html:not(.no-js) [data-aos^=slide][data-aos^=slide].aos-animate{visibility:visible;-webkit-transform:translateZ(0);transform:translateZ(0)}html:not(.no-js) [data-aos=slide-up]{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}html:not(.no-js) [data-aos=slide-down]{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}html:not(.no-js) [data-aos=slide-right]{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}html:not(.no-js) [data-aos=slide-left]{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}html:not(.no-js) [data-aos^=flip][data-aos^=flip]{-webkit-backface-visibility:hidden;backface-visibility:hidden;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}html:not(.no-js) [data-aos=flip-left]{-webkit-transform:perspective(2500px) rotateY(-100deg);transform:perspective(2500px) rotateY(-100deg)}html:not(.no-js) [data-aos=flip-left].aos-animate{-webkit-transform:perspective(2500px) rotateY(0);transform:perspective(2500px) rotateY(0)}html:not(.no-js) [data-aos=flip-right]{-webkit-transform:perspective(2500px) rotateY(100deg);transform:perspective(2500px) rotateY(100deg)}html:not(.no-js) [data-aos=flip-right].aos-animate{-webkit-transform:perspective(2500px) rotateY(0);transform:perspective(2500px) rotateY(0)}html:not(.no-js) [data-aos=flip-up]{-webkit-transform:perspective(2500px) rotateX(-100deg);transform:perspective(2500px) rotateX(-100deg)}html:not(.no-js) [data-aos=flip-up].aos-animate{-webkit-transform:perspective(2500px) rotateX(0);transform:perspective(2500px) rotateX(0)}html:not(.no-js) [data-aos=flip-down]{-webkit-transform:perspective(2500px) rotateX(100deg);transform:perspective(2500px) rotateX(100deg)}html:not(.no-js) [data-aos=flip-down].aos-animate{-webkit-transform:perspective(2500px) rotateX(0);transform:perspective(2500px) rotateX(0)}} \ No newline at end of file diff --git a/neon-html/fonts/Uncut-Sans-Bold.woff b/neon-html/fonts/Uncut-Sans-Bold.woff new file mode 100755 index 0000000..09f0baf Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-Bold.woff differ diff --git a/neon-html/fonts/Uncut-Sans-Bold.woff2 b/neon-html/fonts/Uncut-Sans-Bold.woff2 new file mode 100755 index 0000000..d3588c9 Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-Bold.woff2 differ diff --git a/neon-html/fonts/Uncut-Sans-BoldOblique.woff b/neon-html/fonts/Uncut-Sans-BoldOblique.woff new file mode 100755 index 0000000..beff69d Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-BoldOblique.woff differ diff --git a/neon-html/fonts/Uncut-Sans-BoldOblique.woff2 b/neon-html/fonts/Uncut-Sans-BoldOblique.woff2 new file mode 100755 index 0000000..97d7448 Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-BoldOblique.woff2 differ diff --git a/neon-html/fonts/Uncut-Sans-Medium.woff b/neon-html/fonts/Uncut-Sans-Medium.woff new file mode 100755 index 0000000..f5f6cb4 Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-Medium.woff differ diff --git a/neon-html/fonts/Uncut-Sans-Medium.woff2 b/neon-html/fonts/Uncut-Sans-Medium.woff2 new file mode 100755 index 0000000..8022730 Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-Medium.woff2 differ diff --git a/neon-html/fonts/Uncut-Sans-Semibold.woff b/neon-html/fonts/Uncut-Sans-Semibold.woff new file mode 100755 index 0000000..e250fa8 Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-Semibold.woff differ diff --git a/neon-html/fonts/Uncut-Sans-Semibold.woff2 b/neon-html/fonts/Uncut-Sans-Semibold.woff2 new file mode 100755 index 0000000..8f8c55a Binary files /dev/null and b/neon-html/fonts/Uncut-Sans-Semibold.woff2 differ diff --git a/neon-html/images/auth-illustration.svg b/neon-html/images/auth-illustration.svg new file mode 100644 index 0000000..7469cab --- /dev/null +++ b/neon-html/images/auth-illustration.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/neon-html/images/cta-illustration.svg b/neon-html/images/cta-illustration.svg new file mode 100644 index 0000000..adecd35 --- /dev/null +++ b/neon-html/images/cta-illustration.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/neon-html/images/features-02.png b/neon-html/images/features-02.png new file mode 100644 index 0000000..191010a Binary files /dev/null and b/neon-html/images/features-02.png differ diff --git a/neon-html/images/features-illustration.svg b/neon-html/images/features-illustration.svg new file mode 100644 index 0000000..d5419ff --- /dev/null +++ b/neon-html/images/features-illustration.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/neon-html/images/features.svg b/neon-html/images/features.svg new file mode 100644 index 0000000..098b9a6 --- /dev/null +++ b/neon-html/images/features.svg @@ -0,0 +1,206 @@ + + + + Illustration + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/neon-html/images/hero-illustration.svg b/neon-html/images/hero-illustration.svg new file mode 100644 index 0000000..cb4cb09 --- /dev/null +++ b/neon-html/images/hero-illustration.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/neon-html/images/joakim.jpg b/neon-html/images/joakim.jpg new file mode 100644 index 0000000..bbc5e6a Binary files /dev/null and b/neon-html/images/joakim.jpg differ diff --git a/neon-html/images/peter.jpg b/neon-html/images/peter.jpg new file mode 100644 index 0000000..77f5ef7 Binary files /dev/null and b/neon-html/images/peter.jpg differ diff --git a/neon-html/images/pricing-illustration.svg b/neon-html/images/pricing-illustration.svg new file mode 100644 index 0000000..0d07971 --- /dev/null +++ b/neon-html/images/pricing-illustration.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/neon-html/images/testimonial-01.jpg b/neon-html/images/testimonial-01.jpg new file mode 100644 index 0000000..47aaebc Binary files /dev/null and b/neon-html/images/testimonial-01.jpg differ diff --git a/neon-html/images/testimonial-02.jpg b/neon-html/images/testimonial-02.jpg new file mode 100644 index 0000000..94f95ed Binary files /dev/null and b/neon-html/images/testimonial-02.jpg differ diff --git a/neon-html/images/testimonial-03.jpg b/neon-html/images/testimonial-03.jpg new file mode 100644 index 0000000..f4c5f93 Binary files /dev/null and b/neon-html/images/testimonial-03.jpg differ diff --git a/neon-html/images/testimonial-04.jpg b/neon-html/images/testimonial-04.jpg new file mode 100644 index 0000000..9cddd93 Binary files /dev/null and b/neon-html/images/testimonial-04.jpg differ diff --git a/neon-html/images/testimonial-05.jpg b/neon-html/images/testimonial-05.jpg new file mode 100644 index 0000000..1555acf Binary files /dev/null and b/neon-html/images/testimonial-05.jpg differ diff --git a/neon-html/images/testimonial-06.jpg b/neon-html/images/testimonial-06.jpg new file mode 100644 index 0000000..864c789 Binary files /dev/null and b/neon-html/images/testimonial-06.jpg differ diff --git a/neon-html/images/testimonial-07.jpg b/neon-html/images/testimonial-07.jpg new file mode 100644 index 0000000..25c6a3e Binary files /dev/null and b/neon-html/images/testimonial-07.jpg differ diff --git a/neon-html/images/testimonial-08.jpg b/neon-html/images/testimonial-08.jpg new file mode 100644 index 0000000..07cc390 Binary files /dev/null and b/neon-html/images/testimonial-08.jpg differ diff --git a/neon-html/images/testimonial-09.jpg b/neon-html/images/testimonial-09.jpg new file mode 100644 index 0000000..24839ac Binary files /dev/null and b/neon-html/images/testimonial-09.jpg differ diff --git a/neon-html/index.html b/neon-html/index.html new file mode 100644 index 0000000..ccb7ea4 --- /dev/null +++ b/neon-html/index.html @@ -0,0 +1,385 @@ + + + + + + Opzkit + + + + + + + + +
+ + +
+
+
+ + + + + + +
+
+
+ + +
+ + +
+ + + + + + + +
+
+ + +
+ +

Opzkit builds software

+

+ Almost every business need software to be succesful. +
+ Despite the word soft, most software systems are hard to change and a huge bottleneck + to growth and innovation. +
+ Imagine a world where changes to software systems are easy, quick and cheap. +
+ Imagine that new needs and opportunities can be handled smoothly. +
+
+ + We help you reach your full potential. +
+ Because we know software. +

+
+
+ +
+
+
+ + +
+ + + + + + + +
+
+ + +
+

What we do?

+
+

+ DevOps and cloud-native technologies are our specialties. +

+
+
+ + +
+ + +
+
+

Expertise

+

We offer teams, specialists, or full project deliveries.

+
    +
  • + + + + We prefer to build systems with a micro-service approach, running everything on Kubernetes. +
  • +
  • + + + + When possible we use event driven architecture, often using RabbitMQ or Kafka. +
  • +
  • + + + + We target most parts of the software stack; infrastructure, backend and if necessary frontend. +
  • +
+
+
+ +
+ Features +
+
+
+
+
+ + + +
+ + + + + + + +
+
+ + +
+

What do our clients say?

+
+ + +
+ + +
+
+ Testimonial 01 +
+
+

bleeding edge features first.

+
+ +
+ + +
+
+ Testimonial 02 +
+
+

Neon has made a huge impact on compliance, while helping us become more transparent.

+
+ +
+ + +
+
+ Testimonial 03 +
+
+

GitHub provides tools that are, in a sense, invisible. You don’t have to waste time trying to get them to work.

+
+ +
+ + +
+
+ Testimonial 04 +
+
+

Neon is the tool devs. The more you can make work feel native for a developer, the more cool their experience.

+
+ +
+ + +
+
+ Testimonial 05 +
+
+

Neon comes into play during the entire software life cycle. It’s the de facto tool for anything related to our software.

+
+ +
+ + +
+
+ Testimonial 06 +
+
+

I have no tech skills and with Neon I can actually make good looking apps with ease.

+
+ +
+ + +
+
+ Testimonial 07 +
+
+

It's not just easier to get in touch with developers, it’s also easier to bring in other team members.

+
+ +
+ + +
+
+ Testimonial 08 +
+
+

Tools like Neon Advanced Security help keep our team lean. It makes us much more efficient.

+
+ +
+ + +
+
+ Testimonial 09 +
+
+

Neon enables speed and scale. We can work on bigger projects and finish them faster.

+
+ +
+ +
+ +
+
+
+ + +
+ + + + +
+
+ + +
+

Who we are

+
+

Consultants with long experience of software/systems development in a lot of different projects and environments. + Expect us to work hard, be honest and solve more problems whan we create. +

+
+
+ + +
+ + + + + + +
+ +
+
+ +
+ + +
+ + +
+
+
+ + +
+

Contact

+ + +
+

Email: start@opzkit.io

+ +
+ +
+
+
+ +
+ + + + + + + + \ No newline at end of file diff --git a/neon-html/js/main.js b/neon-html/js/main.js new file mode 100644 index 0000000..bc16fb6 --- /dev/null +++ b/neon-html/js/main.js @@ -0,0 +1,6 @@ +AOS.init({ + once: true, + disable: 'phone', + duration: 500, + easing: 'ease-out-cubic', +}); diff --git a/neon-html/js/vendors/alpinejs.min.js b/neon-html/js/vendors/alpinejs.min.js new file mode 100644 index 0000000..42ab077 --- /dev/null +++ b/neon-html/js/vendors/alpinejs.min.js @@ -0,0 +1,5 @@ +(()=>{var We=!1,Ge=!1,j=[];function Nt(e){nn(e)}function nn(e){j.includes(e)||j.push(e),on()}function he(e){let t=j.indexOf(e);t!==-1&&j.splice(t,1)}function on(){!Ge&&!We&&(We=!0,queueMicrotask(sn))}function sn(){We=!1,Ge=!0;for(let e=0;ee.effect(t,{scheduler:r=>{Je?Nt(r):r()}}),Ye=e.raw}function Ze(e){K=e}function Dt(e){let t=()=>{};return[n=>{let i=K(n);return e._x_effects||(e._x_effects=new Set,e._x_runEffects=()=>{e._x_effects.forEach(o=>o())}),e._x_effects.add(i),t=()=>{i!==void 0&&(e._x_effects.delete(i),Y(i))},i},()=>{t()}]}var $t=[],Lt=[],Ft=[];function jt(e){Ft.push(e)}function _e(e,t){typeof t=="function"?(e._x_cleanups||(e._x_cleanups=[]),e._x_cleanups.push(t)):(t=e,Lt.push(t))}function Kt(e){$t.push(e)}function Bt(e,t,r){e._x_attributeCleanups||(e._x_attributeCleanups={}),e._x_attributeCleanups[t]||(e._x_attributeCleanups[t]=[]),e._x_attributeCleanups[t].push(r)}function Qe(e,t){!e._x_attributeCleanups||Object.entries(e._x_attributeCleanups).forEach(([r,n])=>{(t===void 0||t.includes(r))&&(n.forEach(i=>i()),delete e._x_attributeCleanups[r])})}var et=new MutationObserver(Xe),tt=!1;function rt(){et.observe(document,{subtree:!0,childList:!0,attributes:!0,attributeOldValue:!0}),tt=!0}function cn(){an(),et.disconnect(),tt=!1}var ee=[],nt=!1;function an(){ee=ee.concat(et.takeRecords()),ee.length&&!nt&&(nt=!0,queueMicrotask(()=>{ln(),nt=!1}))}function ln(){Xe(ee),ee.length=0}function m(e){if(!tt)return e();cn();let t=e();return rt(),t}var it=!1,ge=[];function zt(){it=!0}function Vt(){it=!1,Xe(ge),ge=[]}function Xe(e){if(it){ge=ge.concat(e);return}let t=[],r=[],n=new Map,i=new Map;for(let o=0;os.nodeType===1&&t.push(s)),e[o].removedNodes.forEach(s=>s.nodeType===1&&r.push(s))),e[o].type==="attributes")){let s=e[o].target,a=e[o].attributeName,c=e[o].oldValue,l=()=>{n.has(s)||n.set(s,[]),n.get(s).push({name:a,value:s.getAttribute(a)})},u=()=>{i.has(s)||i.set(s,[]),i.get(s).push(a)};s.hasAttribute(a)&&c===null?l():s.hasAttribute(a)?(u(),l()):u()}i.forEach((o,s)=>{Qe(s,o)}),n.forEach((o,s)=>{$t.forEach(a=>a(s,o))});for(let o of r)if(!t.includes(o)&&(Lt.forEach(s=>s(o)),o._x_cleanups))for(;o._x_cleanups.length;)o._x_cleanups.pop()();t.forEach(o=>{o._x_ignoreSelf=!0,o._x_ignore=!0});for(let o of t)r.includes(o)||!o.isConnected||(delete o._x_ignoreSelf,delete o._x_ignore,Ft.forEach(s=>s(o)),o._x_ignore=!0,o._x_ignoreSelf=!0);t.forEach(o=>{delete o._x_ignoreSelf,delete o._x_ignore}),t=null,r=null,n=null,i=null}function xe(e){return P(N(e))}function C(e,t,r){return e._x_dataStack=[t,...N(r||e)],()=>{e._x_dataStack=e._x_dataStack.filter(n=>n!==t)}}function ot(e,t){let r=e._x_dataStack[0];Object.entries(t).forEach(([n,i])=>{r[n]=i})}function N(e){return e._x_dataStack?e._x_dataStack:typeof ShadowRoot=="function"&&e instanceof ShadowRoot?N(e.host):e.parentNode?N(e.parentNode):[]}function P(e){let t=new Proxy({},{ownKeys:()=>Array.from(new Set(e.flatMap(r=>Object.keys(r)))),has:(r,n)=>e.some(i=>i.hasOwnProperty(n)),get:(r,n)=>(e.find(i=>{if(i.hasOwnProperty(n)){let o=Object.getOwnPropertyDescriptor(i,n);if(o.get&&o.get._x_alreadyBound||o.set&&o.set._x_alreadyBound)return!0;if((o.get||o.set)&&o.enumerable){let s=o.get,a=o.set,c=o;s=s&&s.bind(t),a=a&&a.bind(t),s&&(s._x_alreadyBound=!0),a&&(a._x_alreadyBound=!0),Object.defineProperty(i,n,{...c,get:s,set:a})}return!0}return!1})||{})[n],set:(r,n,i)=>{let o=e.find(s=>s.hasOwnProperty(n));return o?o[n]=i:e[e.length-1][n]=i,!0}});return t}function ye(e){let t=n=>typeof n=="object"&&!Array.isArray(n)&&n!==null,r=(n,i="")=>{Object.entries(Object.getOwnPropertyDescriptors(n)).forEach(([o,{value:s,enumerable:a}])=>{if(a===!1||s===void 0)return;let c=i===""?o:`${i}.${o}`;typeof s=="object"&&s!==null&&s._x_interceptor?n[o]=s.initialize(e,c,o):t(s)&&s!==n&&!(s instanceof Element)&&r(s,c)})};return r(e)}function be(e,t=()=>{}){let r={initialValue:void 0,_x_interceptor:!0,initialize(n,i,o){return e(this.initialValue,()=>un(n,i),s=>st(n,i,s),i,o)}};return t(r),n=>{if(typeof n=="object"&&n!==null&&n._x_interceptor){let i=r.initialize.bind(r);r.initialize=(o,s,a)=>{let c=n.initialize(o,s,a);return r.initialValue=c,i(o,s,a)}}else r.initialValue=n;return r}}function un(e,t){return t.split(".").reduce((r,n)=>r[n],e)}function st(e,t,r){if(typeof t=="string"&&(t=t.split(".")),t.length===1)e[t[0]]=r;else{if(t.length===0)throw error;return e[t[0]]||(e[t[0]]={}),st(e[t[0]],t.slice(1),r)}}var Ht={};function x(e,t){Ht[e]=t}function te(e,t){return Object.entries(Ht).forEach(([r,n])=>{Object.defineProperty(e,`$${r}`,{get(){let[i,o]=at(t);return i={interceptor:be,...i},_e(t,o),n(t,i)},enumerable:!1})}),e}function qt(e,t,r,...n){try{return r(...n)}catch(i){J(i,e,t)}}function J(e,t,r=void 0){Object.assign(e,{el:t,expression:r}),console.warn(`Alpine Expression Error: ${e.message} + +${r?'Expression: "'+r+`" + +`:""}`,t),setTimeout(()=>{throw e},0)}var ve=!0;function Ut(e){let t=ve;ve=!1,e(),ve=t}function k(e,t,r={}){let n;return _(e,t)(i=>n=i,r),n}function _(...e){return Wt(...e)}var Wt=ct;function Gt(e){Wt=e}function ct(e,t){let r={};te(r,e);let n=[r,...N(e)];if(typeof t=="function")return fn(n,t);let i=dn(n,t,e);return qt.bind(null,e,t,i)}function fn(e,t){return(r=()=>{},{scope:n={},params:i=[]}={})=>{let o=t.apply(P([n,...e]),i);we(r,o)}}var lt={};function pn(e,t){if(lt[e])return lt[e];let r=Object.getPrototypeOf(async function(){}).constructor,n=/^[\n\s]*if.*\(.*\)/.test(e)||/^(let|const)\s/.test(e)?`(() => { ${e} })()`:e,o=(()=>{try{return new r(["__self","scope"],`with (scope) { __self.result = ${n} }; __self.finished = true; return __self.result;`)}catch(s){return J(s,t,e),Promise.resolve()}})();return lt[e]=o,o}function dn(e,t,r){let n=pn(t,r);return(i=()=>{},{scope:o={},params:s=[]}={})=>{n.result=void 0,n.finished=!1;let a=P([o,...e]);if(typeof n=="function"){let c=n(n,a).catch(l=>J(l,r,t));n.finished?(we(i,n.result,a,s,r),n.result=void 0):c.then(l=>{we(i,l,a,s,r)}).catch(l=>J(l,r,t)).finally(()=>n.result=void 0)}}}function we(e,t,r,n,i){if(ve&&typeof t=="function"){let o=t.apply(r,n);o instanceof Promise?o.then(s=>we(e,s,r,n)).catch(s=>J(s,i,t)):e(o)}else e(t)}var ut="x-";function E(e=""){return ut+e}function Yt(e){ut=e}var Jt={};function d(e,t){Jt[e]=t}function re(e,t,r){let n={};return Array.from(t).map(Zt((o,s)=>n[o]=s)).filter(Qt).map(hn(n,r)).sort(_n).map(o=>mn(e,o))}function Xt(e){return Array.from(e).map(Zt()).filter(t=>!Qt(t))}var ft=!1,ne=new Map,er=Symbol();function tr(e){ft=!0;let t=Symbol();er=t,ne.set(t,[]);let r=()=>{for(;ne.get(t).length;)ne.get(t).shift()();ne.delete(t)},n=()=>{ft=!1,r()};e(r),n()}function at(e){let t=[],r=a=>t.push(a),[n,i]=Dt(e);return t.push(i),[{Alpine:I,effect:n,cleanup:r,evaluateLater:_.bind(_,e),evaluate:k.bind(k,e)},()=>t.forEach(a=>a())]}function mn(e,t){let r=()=>{},n=Jt[t.type]||r,[i,o]=at(e);Bt(e,t.original,o);let s=()=>{e._x_ignore||e._x_ignoreSelf||(n.inline&&n.inline(e,t,i),n=n.bind(n,e,t,i),ft?ne.get(er).push(n):n())};return s.runCleanups=o,s}var Ee=(e,t)=>({name:r,value:n})=>(r.startsWith(e)&&(r=r.replace(e,t)),{name:r,value:n}),Se=e=>e;function Zt(e=()=>{}){return({name:t,value:r})=>{let{name:n,value:i}=rr.reduce((o,s)=>s(o),{name:t,value:r});return n!==t&&e(n,t),{name:n,value:i}}}var rr=[];function Z(e){rr.push(e)}function Qt({name:e}){return nr().test(e)}var nr=()=>new RegExp(`^${ut}([^:^.]+)\\b`);function hn(e,t){return({name:r,value:n})=>{let i=r.match(nr()),o=r.match(/:([a-zA-Z0-9\-:]+)/),s=r.match(/\.[^.\]]+(?=[^\]]*$)/g)||[],a=t||e[r]||r;return{type:i?i[1]:null,value:o?o[1]:null,modifiers:s.map(c=>c.replace(".","")),expression:n,original:a}}}var dt="DEFAULT",Ae=["ignore","ref","data","id","bind","init","for","mask","model","modelable","transition","show","if",dt,"teleport","element"];function _n(e,t){let r=Ae.indexOf(e.type)===-1?dt:e.type,n=Ae.indexOf(t.type)===-1?dt:t.type;return Ae.indexOf(r)-Ae.indexOf(n)}function B(e,t,r={}){e.dispatchEvent(new CustomEvent(t,{detail:r,bubbles:!0,composed:!0,cancelable:!0}))}var pt=[],mt=!1;function Te(e=()=>{}){return queueMicrotask(()=>{mt||setTimeout(()=>{Oe()})}),new Promise(t=>{pt.push(()=>{e(),t()})})}function Oe(){for(mt=!1;pt.length;)pt.shift()()}function ir(){mt=!0}function R(e,t){if(typeof ShadowRoot=="function"&&e instanceof ShadowRoot){Array.from(e.children).forEach(i=>R(i,t));return}let r=!1;if(t(e,()=>r=!0),r)return;let n=e.firstElementChild;for(;n;)R(n,t,!1),n=n.nextElementSibling}function O(e,...t){console.warn(`Alpine Warning: ${e}`,...t)}function sr(){document.body||O("Unable to initialize. Trying to load Alpine before `` is available. Did you forget to add `defer` in Alpine's ` + + + + + + \ No newline at end of file diff --git a/neon-html/signin.html b/neon-html/signin.html new file mode 100644 index 0000000..55a8912 --- /dev/null +++ b/neon-html/signin.html @@ -0,0 +1,140 @@ + + + + + + Neon HTML Demo - Sign in + + + + + + + + +
+ + +
+ +
+ +
+ + +
+ +
+ +
+
+
+ +
+

Welcome Back!

+
+ + +
+
+
+ + +
+
+
+ + Troubles? +
+ +
+
+
+ +
+
+ + +
+ +
Or
+ +
+ + + + +
+
+ Don't you have an account? Sign Up +
+
+ +
+
+
+ +
+ +
+ + + + +
+ +
+ + + + + + + + \ No newline at end of file diff --git a/neon-html/signup.html b/neon-html/signup.html new file mode 100644 index 0000000..53e13db --- /dev/null +++ b/neon-html/signup.html @@ -0,0 +1,151 @@ + + + + + + Neon HTML Demo - Sign up + + + + + + + + +
+ + +
+ +
+ +
+ + +
+ +
+ +
+
+
+ +
+

Sign Up

+
+ + +
+
+
+ + +
+
+
+ + +
+
+ + +
+
+
+ + +
+
+
+ +
+
+ + +
+ +
Or
+ +
+ + + + +
+ By filling out this form, I consent to the collection and use of my personal data. +
+ +
+
+ Already have an account? Sign In +
+
+ +
+
+
+ +
+ +
+ + + + +
+ +
+ + + + + + + + \ No newline at end of file diff --git a/neon-html/style.css b/neon-html/style.css new file mode 100644 index 0000000..f040834 --- /dev/null +++ b/neon-html/style.css @@ -0,0 +1,2581 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=fallback'); + +@font-face { + font-family: 'Uncut Sans'; + + font-weight: 700; + + font-style: normal; + + font-display: fallback; + + src: url('fonts/Uncut-Sans-Bold.woff2') format('woff2'), + url('fonts/Uncut-Sans-Bold.woff') format('woff'); +} + +@font-face { + font-family: 'Uncut Sans'; + + font-weight: 700; + + font-style: italic; + + font-display: fallback; + + src: url('fonts/Uncut-Sans-BoldOblique.woff2') format('woff2'), + url('fonts/Uncut-Sans-BoldOblique.woff') format('woff'); +} + +@font-face { + font-family: 'Uncut Sans'; + + font-weight: 600; + + font-style: normal; + + font-display: fallback; + + src: url('fonts/Uncut-Sans-Semibold.woff2') format('woff2'), + url('fonts/Uncut-Sans-Semibold.woff') format('woff'); +} + +@font-face { + font-family: 'Uncut Sans'; + + font-weight: 500; + + font-style: normal; + + font-display: fallback; + + src: url('fonts/Uncut-Sans-Medium.woff2') format('woff2'), + url('fonts/Uncut-Sans-Medium.woff') format('woff'); +} + +/* +! tailwindcss v3.1.6 | MIT License | https://tailwindcss.com +*/ + +/* +1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) +2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) +*/ + +*, +::before, +::after { + box-sizing: border-box; + /* 1 */ + border-width: 0; + /* 2 */ + border-style: solid; + /* 2 */ + border-color: #e5e7eb; + /* 2 */ +} + +::before, +::after { + --tw-content: ''; +} + +/* +1. Use a consistent sensible line-height in all browsers. +2. Prevent adjustments of font size after orientation changes in iOS. +3. Use a more readable tab size. +4. Use the user's configured `sans` font-family by default. +*/ + +html { + line-height: 1.5; + /* 1 */ + -webkit-text-size-adjust: 100%; + /* 2 */ + -moz-tab-size: 4; + /* 3 */ + -o-tab-size: 4; + tab-size: 4; + /* 3 */ + font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; + /* 4 */ +} + +/* +1. Remove the margin in all browsers. +2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. +*/ + +body { + margin: 0; + /* 1 */ + line-height: inherit; + /* 2 */ +} + +/* +1. Add the correct height in Firefox. +2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) +3. Ensure horizontal rules are visible by default. +*/ + +hr { + height: 0; + /* 1 */ + color: inherit; + /* 2 */ + border-top-width: 1px; + /* 3 */ +} + +/* +Add the correct text decoration in Chrome, Edge, and Safari. +*/ + +abbr:where([title]) { + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; +} + +/* +Remove the default font size and weight for headings. +*/ + +h1, +h2, +h3, +h4, +h5, +h6 { + font-size: inherit; + font-weight: inherit; +} + +/* +Reset links to optimize for opt-in styling instead of opt-out. +*/ + +a { + color: inherit; + text-decoration: inherit; +} + +/* +Add the correct font weight in Edge and Safari. +*/ + +b, +strong { + font-weight: bolder; +} + +/* +1. Use the user's configured `mono` font family by default. +2. Correct the odd `em` font sizing in all browsers. +*/ + +code, +kbd, +samp, +pre { + font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", 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; +} + +/* +1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) +2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) +3. Remove gaps between table borders by default. +*/ + +table { + text-indent: 0; + /* 1 */ + border-color: inherit; + /* 2 */ + border-collapse: collapse; + /* 3 */ +} + +/* +1. Change the font styles in all browsers. +2. Remove the margin in Firefox and Safari. +3. Remove default padding in all browsers. +*/ + +button, +input, +optgroup, +select, +textarea { + font-family: inherit; + /* 1 */ + font-size: 100%; + /* 1 */ + font-weight: inherit; + /* 1 */ + line-height: inherit; + /* 1 */ + color: inherit; + /* 1 */ + margin: 0; + /* 2 */ + padding: 0; + /* 3 */ +} + +/* +Remove the inheritance of text transform in Edge and Firefox. +*/ + +button, +select { + text-transform: none; +} + +/* +1. Correct the inability to style clickable types in iOS and Safari. +2. Remove default button styles. +*/ + +button, +[type='button'], +[type='reset'], +[type='submit'] { + -webkit-appearance: button; + /* 1 */ + background-color: transparent; + /* 2 */ + background-image: none; + /* 2 */ +} + +/* +Use the modern Firefox focus style for all focusable elements. +*/ + +:-moz-focusring { + outline: auto; +} + +/* +Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) +*/ + +:-moz-ui-invalid { + box-shadow: none; +} + +/* +Add the correct vertical alignment in Chrome and Firefox. +*/ + +progress { + vertical-align: baseline; +} + +/* +Correct the cursor style of increment and decrement buttons in Safari. +*/ + +::-webkit-inner-spin-button, +::-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. +*/ + +::-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 */ +} + +/* +Add the correct display in Chrome and Safari. +*/ + +summary { + display: list-item; +} + +/* +Removes the default spacing and border for appropriate elements. +*/ + +blockquote, +dl, +dd, +h1, +h2, +h3, +h4, +h5, +h6, +hr, +figure, +p, +pre { + margin: 0; +} + +fieldset { + margin: 0; + padding: 0; +} + +legend { + padding: 0; +} + +ol, +ul, +menu { + list-style: none; + margin: 0; + padding: 0; +} + +/* +Prevent resizing textareas horizontally by default. +*/ + +textarea { + resize: vertical; +} + +/* +1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) +2. Set the default placeholder color to the user's configured gray 400 color. +*/ + +input::-moz-placeholder, textarea::-moz-placeholder { + opacity: 1; + /* 1 */ + color: #9ca3af; + /* 2 */ +} + +input:-ms-input-placeholder, textarea:-ms-input-placeholder { + opacity: 1; + /* 1 */ + color: #9ca3af; + /* 2 */ +} + +input::placeholder, +textarea::placeholder { + opacity: 1; + /* 1 */ + color: #9ca3af; + /* 2 */ +} + +/* +Set the default cursor for buttons. +*/ + +button, +[role="button"] { + cursor: pointer; +} + +/* +Make sure disabled buttons don't get the pointer cursor. +*/ + +:disabled { + cursor: default; +} + +/* +1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) +2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) + This can trigger a poorly considered lint error in some tools but is included by design. +*/ + +img, +svg, +video, +canvas, +audio, +iframe, +embed, +object { + display: block; + /* 1 */ + vertical-align: middle; + /* 2 */ +} + +/* +Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) +*/ + +img, +video { + max-width: 100%; + height: auto; +} + +[type='text'],[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select{ + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background-color: #fff; + border-color: #6b7280; + border-width: 1px; + border-radius: 0px; + padding-top: 0.5rem; + padding-right: 0.75rem; + padding-bottom: 0.5rem; + padding-left: 0.75rem; + font-size: 1rem; + line-height: 1.5rem; + --tw-shadow: 0 0 #0000; +} + +[type='text']:focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus{ + outline: 2px solid transparent; + outline-offset: 2px; + --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/); + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: #2563eb; + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + border-color: #2563eb; +} + +input::-moz-placeholder, textarea::-moz-placeholder{ + color: #6b7280; + opacity: 1; +} + +input:-ms-input-placeholder, textarea:-ms-input-placeholder{ + color: #6b7280; + opacity: 1; +} + +input::placeholder,textarea::placeholder{ + color: #6b7280; + opacity: 1; +} + +::-webkit-datetime-edit-fields-wrapper{ + padding: 0; +} + +::-webkit-date-and-time-value{ + min-height: 1.5em; +} + +::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{ + padding-top: 0; + padding-bottom: 0; +} + +select{ + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e"); + background-position: right 0.5rem center; + background-repeat: no-repeat; + background-size: 1.5em 1.5em; + padding-right: 2.5rem; + -webkit-print-color-adjust: exact; + color-adjust: exact; +} + +[multiple]{ + background-image: initial; + background-position: initial; + background-repeat: unset; + background-size: initial; + padding-right: 0.75rem; + -webkit-print-color-adjust: unset; + color-adjust: unset; +} + +[type='checkbox'],[type='radio']{ + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + -webkit-print-color-adjust: exact; + color-adjust: exact; + display: inline-block; + vertical-align: middle; + background-origin: border-box; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + flex-shrink: 0; + height: 1rem; + width: 1rem; + color: #2563eb; + background-color: #fff; + border-color: #6b7280; + border-width: 1px; + --tw-shadow: 0 0 #0000; +} + +[type='checkbox']{ + border-radius: 0px; +} + +[type='radio']{ + border-radius: 100%; +} + +[type='checkbox']:focus,[type='radio']:focus{ + outline: 2px solid transparent; + outline-offset: 2px; + --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/); + --tw-ring-offset-width: 2px; + --tw-ring-offset-color: #fff; + --tw-ring-color: #2563eb; + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); +} + +[type='checkbox']:checked,[type='radio']:checked{ + border-color: transparent; + background-color: currentColor; + background-size: 100% 100%; + background-position: center; + background-repeat: no-repeat; +} + +[type='checkbox']:checked{ + background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e"); +} + +[type='radio']:checked{ + background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e"); +} + +[type='checkbox']:checked:hover,[type='checkbox']:checked:focus,[type='radio']:checked:hover,[type='radio']:checked:focus{ + border-color: transparent; + background-color: currentColor; +} + +[type='checkbox']:indeterminate{ + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e"); + border-color: transparent; + background-color: currentColor; + background-size: 100% 100%; + background-position: center; + background-repeat: no-repeat; +} + +[type='checkbox']:indeterminate:hover,[type='checkbox']:indeterminate:focus{ + border-color: transparent; + background-color: currentColor; +} + +[type='file']{ + background: unset; + border-color: inherit; + border-width: 0; + border-radius: 0; + padding: 0; + font-size: unset; + line-height: inherit; +} + +[type='file']:focus{ + outline: 1px auto -webkit-focus-ring-color; +} + +*, ::before, ::after{ + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgb(59 130 246 / 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; +} + +::-webkit-backdrop{ + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgb(59 130 246 / 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; +} + +::backdrop{ + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgb(59 130 246 / 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; +} + +.container{ + width: 100%; +} + +@media (min-width: 640px){ + .container{ + max-width: 640px; + } +} + +@media (min-width: 768px){ + .container{ + max-width: 768px; + } +} + +@media (min-width: 1024px){ + .container{ + max-width: 1024px; + } +} + +@media (min-width: 1280px){ + .container{ + max-width: 1280px; + } +} + +@media (min-width: 1536px){ + .container{ + max-width: 1536px; + } +} + +/* Additional styles */ + +/* Typography */ + +.h1{ + font-size: 3.75rem; + line-height: 1.166; + letter-spacing: -0.01em; + font-weight: 700; +} + +.h2{ + font-size: 2.25rem; + line-height: 1.277; + letter-spacing: -0.01em; + font-weight: 700; +} + +.h3{ + font-size: 1.875rem; + line-height: 1.333; + letter-spacing: -0.01em; + font-weight: 700; +} + +.h4{ + font-size: 1.5rem; + line-height: 1.415; + letter-spacing: -0.01em; + font-weight: 700; +} + +@media (min-width: 768px) { + .h1{ + font-size: 5rem; + line-height: 1; + letter-spacing: -0.01em; + } + + .h2{ + font-size: 3rem; + line-height: 1.2; + letter-spacing: -0.01em; + } +} + +/* Buttons */ + +.btn, +.btn-sm{ + display: inline-flex; + align-items: center; + justify-content: center; + border-radius: 0.25rem; + font-weight: 500; + line-height: 1.5; + transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; + transition-duration: 150ms; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); +} + +.btn{ + padding-left: 1.5rem; + padding-right: 1.5rem; + padding-top: 0.75rem; + padding-bottom: 0.75rem; +} + +.btn-sm{ + padding-left: 1rem; + padding-right: 1rem; + padding-top: 0.5rem; + padding-bottom: 0.5rem; +} + +/* Forms */ + +input[type="search"]::-webkit-search-decoration, +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-results-button, +input[type="search"]::-webkit-search-results-decoration { + -webkit-appearance: none; +} + +.form-input, +.form-textarea, +.form-multiselect, +.form-select, +.form-checkbox, +.form-radio{ + border-width: 1px; + --tw-border-opacity: 1; + border-color: rgb(55 65 81 / var(--tw-border-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); +} + +.form-input:focus, +.form-textarea:focus, +.form-multiselect:focus, +.form-select:focus, +.form-checkbox:focus, +.form-radio:focus{ + --tw-border-opacity: 1; + border-color: rgb(59 130 246 / var(--tw-border-opacity)); +} + +.form-input, +.form-textarea, +.form-multiselect, +.form-select, +.form-checkbox{ + border-radius: 0.125rem; +} + +.form-input, +.form-textarea, +.form-multiselect, +.form-select{ + padding-top: 0.75rem; + padding-bottom: 0.75rem; + padding-left: 1rem; + padding-right: 1rem; +} + +.form-input, +.form-textarea{ + line-height: 1.375; +} + +.form-input::-moz-placeholder, .form-textarea::-moz-placeholder{ + --tw-placeholder-opacity: 1; + color: rgb(107 114 128 / var(--tw-placeholder-opacity)); +} + +.form-input:-ms-input-placeholder, .form-textarea:-ms-input-placeholder{ + --tw-placeholder-opacity: 1; + color: rgb(107 114 128 / var(--tw-placeholder-opacity)); +} + +.form-input::placeholder, +.form-textarea::placeholder{ + --tw-placeholder-opacity: 1; + color: rgb(107 114 128 / var(--tw-placeholder-opacity)); +} + +.form-select{ + padding-right: 2.5rem; +} + +.form-checkbox, +.form-radio{ + border-radius: 0.125rem; + --tw-text-opacity: 1; + color: rgb(37 99 235 / var(--tw-text-opacity)); +} + +/* Chrome, Safari and Opera */ + +.no-scrollbar::-webkit-scrollbar { + display: none; +} + +.no-scrollbar { + -ms-overflow-style: none; + /* IE and Edge */ + scrollbar-width: none; + /* Firefox */ +} + +/* Range slider */ + +:root { + --range-thumb-size: 36px; +} + +input[type=range] { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #ccc; + border-radius: 3px; + height: 6px; + margin-top: (--range-thumb-size - 6px) * 0.5; + margin-bottom: (--range-thumb-size - 6px) * 0.5; + --thumb-size: #{--range-thumb-size}; +} + +input[type=range]::-webkit-slider-thumb { + appearance: none; + -webkit-appearance: none; + background-color: #000; + background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"); + background-position: center; + background-repeat: no-repeat; + border: 0; + border-radius: 50%; + cursor: pointer; + height: --range-thumb-size; + width: --range-thumb-size; +} + +input[type=range]::-moz-range-thumb { + background-color: #000; + background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"); + background-position: center; + background-repeat: no-repeat; + border: 0; + border: none; + border-radius: 50%; + cursor: pointer; + height: --range-thumb-size; + width: --range-thumb-size; +} + +input[type=range]::-ms-thumb { + background-color: #000; + background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"); + background-position: center; + background-repeat: no-repeat; + border: 0; + border-radius: 50%; + cursor: pointer; + height: --range-thumb-size; + width: --range-thumb-size; +} + +input[type=range]::-moz-focus-outer { + border: 0; +} + +/* Switch element */ + +.form-switch{ + position: relative; + margin-top: 0.5rem; + margin-bottom: 0.5rem; + width: 3rem; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.form-switch label{ + display: block; + height: 1rem; + cursor: pointer; + overflow: hidden; + border-radius: 9999px; +} + +.form-switch label>span:first-child{ + position: absolute; + right: 50%; + left: -0.5rem; + top: -0.5rem; + display: block; + height: 2rem; + width: 2rem; + border-radius: 9999px; + transition-property: all; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; + transition-timing-function: cubic-bezier(0, 0, 0.2, 1); +} + +.form-switch input[type="checkbox"]:checked+label>span:first-child{ + left: 1.5rem; + --tw-border-opacity: 1; + border-color: rgb(37 99 235 / var(--tw-border-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(191 219 254 / var(--tw-bg-opacity)); +} + +.form-input:focus, +.form-textarea:focus, +.form-multiselect:focus, +.form-select:focus, +.form-checkbox:focus, +.form-radio:focus{ + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +/* Hamburger button */ + +.hamburger svg>*:nth-child(1), +.hamburger svg>*:nth-child(2), +.hamburger svg>*:nth-child(3) { + transform-origin: center; + transform: rotate(0deg); +} + +.hamburger svg>*:nth-child(1) { + transition: y 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), opacity 0.1s ease-in; +} + +.hamburger svg>*:nth-child(2) { + transition: transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); +} + +.hamburger svg>*:nth-child(3) { + transition: y 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), width 0.1s 0.25s ease-in; +} + +.hamburger.active svg>*:nth-child(1) { + opacity: 0; + y: 11; + transform: rotate(225deg); + transition: y 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.1s 0.12s ease-out; +} + +.hamburger.active svg>*:nth-child(2) { + transform: rotate(225deg); + transition: transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); +} + +.hamburger.active svg>*:nth-child(3) { + y: 11; + transform: rotate(135deg); + transition: y 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), width 0.1s ease-out; +} + +/* Custom AOS distance */ + +@media screen { + html:not(.no-js) [data-aos=zoom-out] { + transform: scale(1.05) + } +} + +.pointer-events-none{ + pointer-events: none; +} + +.visible{ + visibility: visible; +} + +.invisible{ + visibility: hidden; +} + +.absolute{ + position: absolute; +} + +.relative{ + position: relative; +} + +.bottom-0{ + bottom: 0px; +} + +.left-0{ + left: 0px; +} + +.right-0{ + right: 0px; +} + +.left-1\/2{ + left: 50%; +} + +.top-0{ + top: 0px; +} + +.top-1\/2{ + top: 50%; +} + +.z-30{ + z-index: 30; +} + +.-z-10{ + z-index: -10; +} + +.z-10{ + z-index: 10; +} + +.order-1{ + order: 1; +} + +.col-span-2{ + grid-column: span 2 / span 2; +} + +.col-start-2{ + grid-column-start: 2; +} + +.-m-2\.5{ + margin: -0.625rem; +} + +.-m-2{ + margin: -0.5rem; +} + +.m-2\.5{ + margin: 0.625rem; +} + +.m-2{ + margin: 0.5rem; +} + +.mx-auto{ + margin-left: auto; + margin-right: auto; +} + +.my-6{ + margin-top: 1.5rem; + margin-bottom: 1.5rem; +} + +.mr-4{ + margin-right: 1rem; +} + +.ml-3{ + margin-left: 0.75rem; +} + +.ml-1{ + margin-left: 0.25rem; +} + +.mb-6{ + margin-bottom: 1.5rem; +} + +.mb-10{ + margin-bottom: 2.5rem; +} + +.mb-4{ + margin-bottom: 1rem; +} + +.mb-2{ + margin-bottom: 0.5rem; +} + +.ml-\[390px\]{ + margin-left: 390px; +} + +.mr-3{ + margin-right: 0.75rem; +} + +.mb-1{ + margin-bottom: 0.25rem; +} + +.mr-6{ + margin-right: 1.5rem; +} + +.-mt-4{ + margin-top: -1rem; +} + +.mr-2{ + margin-right: 0.5rem; +} + +.mb-3{ + margin-bottom: 0.75rem; +} + +.mb-16{ + margin-bottom: 4rem; +} + +.mt-8{ + margin-top: 2rem; +} + +.mb-8{ + margin-bottom: 2rem; +} + +.mt-6{ + margin-top: 1.5rem; +} + +.ml-2{ + margin-left: 0.5rem; +} + +.mt-2{ + margin-top: 0.5rem; +} + +.mt-4{ + margin-top: 1rem; +} + +.mt-1{ + margin-top: 0.25rem; +} + +.mt-0{ + margin-top: 0px; +} + +.block{ + display: block; +} + +.inline-block{ + display: inline-block; +} + +.inline{ + display: inline; +} + +.flex{ + display: flex; +} + +.inline-flex{ + display: inline-flex; +} + +.table{ + display: table; +} + +.grid{ + display: grid; +} + +.hidden{ + display: none; +} + +.h-16{ + height: 4rem; +} + +.h-8{ + height: 2rem; +} + +.h-\[10rem\]{ + height: 10rem; +} + +.h-3{ + height: 0.75rem; +} + +.h-full{ + height: 100%; +} + +.h-\[15rem\]{ + height: 15rem; +} + +.h-12{ + height: 3rem; +} + +.h-4{ + height: 1rem; +} + +.h-24{ + height: 6rem; +} + +.min-h-screen{ + min-height: 100vh; +} + +.w-full{ + width: 100%; +} + +.w-8{ + width: 2rem; +} + +.w-3{ + width: 0.75rem; +} + +.w-12{ + width: 3rem; +} + +.w-1\/3{ + width: 33.333333%; +} + +.w-4{ + width: 1rem; +} + +.max-w-6xl{ + max-width: 72rem; +} + +.max-w-none{ + max-width: none; +} + +.max-w-xl{ + max-width: 36rem; +} + +.max-w-xs{ + max-width: 20rem; +} + +.max-w-sm{ + max-width: 24rem; +} + +.max-w-full{ + max-width: 100%; +} + +.max-w-3xl{ + max-width: 48rem; +} + +.max-w-2xl{ + max-width: 42rem; +} + +.max-w-md{ + max-width: 28rem; +} + +.max-w-4xl{ + max-width: 56rem; +} + +.flex-1{ + flex: 1 1 0%; +} + +.flex-auto{ + flex: 1 1 auto; +} + +.shrink-0{ + flex-shrink: 0; +} + +.grow{ + flex-grow: 1; +} + +.-translate-x-1\/2{ + --tw-translate-x: -50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.-translate-y-1\/2{ + --tw-translate-y: -50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.rotate-2{ + --tw-rotate: 2deg; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.transform{ + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.resize{ + resize: both; +} + +.grid-cols-4{ + grid-template-columns: repeat(4, minmax(0, 1fr)); +} + +.grid-cols-1{ + grid-template-columns: repeat(1, minmax(0, 1fr)); +} + +.grid-cols-2{ + grid-template-columns: repeat(2, minmax(0, 1fr)); +} + +.flex-col{ + flex-direction: column; +} + +.flex-wrap{ + flex-wrap: wrap; +} + +.items-start{ + align-items: flex-start; +} + +.items-center{ + align-items: center; +} + +.items-baseline{ + align-items: baseline; +} + +.justify-end{ + justify-content: flex-end; +} + +.justify-center{ + justify-content: center; +} + +.justify-between{ + justify-content: space-between; +} + +.gap-2{ + gap: 0.5rem; +} + +.gap-8{ + gap: 2rem; +} + +.gap-12{ + gap: 3rem; +} + +.gap-6{ + gap: 1.5rem; +} + +.space-y-4 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(1rem * var(--tw-space-y-reverse)); +} + +.space-y-8 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(2rem * var(--tw-space-y-reverse)); +} + +.space-y-3 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.75rem * var(--tw-space-y-reverse)); +} + +.space-y-2 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); +} + +.space-x-4 > :not([hidden]) ~ :not([hidden]){ + --tw-space-x-reverse: 0; + margin-right: calc(1rem * var(--tw-space-x-reverse)); + margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); +} + +.space-y-reverse > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 1; +} + +.divide-y > :not([hidden]) ~ :not([hidden]){ + --tw-divide-y-reverse: 0; + border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); + border-bottom-width: calc(1px * var(--tw-divide-y-reverse)); +} + +.overflow-hidden{ + overflow: hidden; +} + +.rounded-full{ + border-radius: 9999px; +} + +.rounded{ + border-radius: 0.25rem; +} + +.rounded-md{ + border-radius: 0.375rem; +} + +.border-0{ + border-width: 0px; +} + +.border-2{ + border-width: 2px; +} + +.border-b{ + border-bottom-width: 1px; +} + +.border-t{ + border-top-width: 1px; +} + +.border-b-2{ + border-bottom-width: 2px; +} + +.border-gray-800{ + --tw-border-opacity: 1; + border-color: rgb(31 41 55 / var(--tw-border-opacity)); +} + +.border-gray-300{ + --tw-border-opacity: 1; + border-color: rgb(209 213 219 / var(--tw-border-opacity)); +} + +.border-gray-200{ + --tw-border-opacity: 1; + border-color: rgb(229 231 235 / var(--tw-border-opacity)); +} + +.border-transparent{ + border-color: transparent; +} + +.bg-gray-900{ + --tw-bg-opacity: 1; + background-color: rgb(17 24 39 / var(--tw-bg-opacity)); +} + +.bg-gray-800{ + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); +} + +.bg-emerald-200{ + --tw-bg-opacity: 1; + background-color: rgb(167 243 208 / var(--tw-bg-opacity)); +} + +.bg-gray-100{ + --tw-bg-opacity: 1; + background-color: rgb(243 244 246 / var(--tw-bg-opacity)); +} + +.bg-gray-200{ + --tw-bg-opacity: 1; + background-color: rgb(229 231 235 / var(--tw-bg-opacity)); +} + +.bg-gradient-to-t{ + background-image: linear-gradient(to top, var(--tw-gradient-stops)); +} + +.bg-gradient-to-b{ + background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); +} + +.bg-gradient-to-tr{ + background-image: linear-gradient(to top right, var(--tw-gradient-stops)); +} + +.from-blue-600{ + --tw-gradient-from: #2563eb; + --tw-gradient-to: rgb(37 99 235 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-gray-800{ + --tw-gradient-from: #1f2937; + --tw-gradient-to: rgb(31 41 55 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-gray-900{ + --tw-gradient-from: #111827; + --tw-gradient-to: rgb(17 24 39 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.from-pink-500{ + --tw-gradient-from: #ec4899; + --tw-gradient-to: rgb(236 72 153 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.via-gray-300{ + --tw-gradient-to: rgb(209 213 219 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #d1d5db, var(--tw-gradient-to); +} + +.to-blue-400{ + --tw-gradient-to: #60a5fa; +} + +.to-gray-900{ + --tw-gradient-to: #111827; +} + +.to-gray-700{ + --tw-gradient-to: #374151; +} + +.to-transparent{ + --tw-gradient-to: transparent; +} + +.to-purple-500{ + --tw-gradient-to: #a855f7; +} + +.to-pink-400{ + --tw-gradient-to: #f472b6; +} + +.fill-gray-500{ + fill: #6b7280; +} + +.fill-current{ + fill: currentColor; +} + +.fill-emerald-500{ + fill: #10b981; +} + +.fill-gray-400{ + fill: #9ca3af; +} + +.fill-white{ + fill: #fff; +} + +.fill-blue-500{ + fill: #3b82f6; +} + +.p-6{ + padding: 1.5rem; +} + +.px-4{ + padding-left: 1rem; + padding-right: 1rem; +} + +.px-3{ + padding-left: 0.75rem; + padding-right: 0.75rem; +} + +.py-2{ + padding-top: 0.5rem; + padding-bottom: 0.5rem; +} + +.py-1{ + padding-top: 0.25rem; + padding-bottom: 0.25rem; +} + +.py-6{ + padding-top: 1.5rem; + padding-bottom: 1.5rem; +} + +.py-12{ + padding-top: 3rem; + padding-bottom: 3rem; +} + +.py-1\.5{ + padding-top: 0.375rem; + padding-bottom: 0.375rem; +} + +.py-10{ + padding-top: 2.5rem; + padding-bottom: 2.5rem; +} + +.px-8{ + padding-left: 2rem; + padding-right: 2rem; +} + +.py-8{ + padding-top: 2rem; + padding-bottom: 2rem; +} + +.py-16{ + padding-top: 4rem; + padding-bottom: 4rem; +} + +.px-6{ + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +.px-0\.5{ + padding-left: 0.125rem; + padding-right: 0.125rem; +} + +.px-0{ + padding-left: 0px; + padding-right: 0px; +} + +.pt-32{ + padding-top: 8rem; +} + +.pb-12{ + padding-bottom: 3rem; +} + +.pb-16{ + padding-bottom: 4rem; +} + +.pt-4{ + padding-top: 1rem; +} + +.pt-12{ + padding-top: 3rem; +} + +.pl-3{ + padding-left: 0.75rem; +} + +.text-center{ + text-align: center; +} + +.font-inter{ + font-family: Inter, sans-serif; +} + +.font-uncut-sans{ + font-family: Uncut Sans, sans-serif; +} + +.text-sm{ + font-size: 0.875rem; + line-height: 1.5715; +} + +.text-xl{ + font-size: 1.25rem; + line-height: 1.5; + letter-spacing: -0.01em; +} + +.text-lg{ + font-size: 1.125rem; + line-height: 1.5; + letter-spacing: -0.01em; +} + +.text-4xl{ + font-size: 2.25rem; + line-height: 1.277; + letter-spacing: -0.01em; +} + +.text-3xl{ + font-size: 1.875rem; + line-height: 1.333; + letter-spacing: -0.01em; +} + +.text-xs{ + font-size: 0.75rem; + line-height: 1.5; +} + +.text-2xl{ + font-size: 1.5rem; + line-height: 1.415; + letter-spacing: -0.01em; +} + +.font-medium{ + font-weight: 500; +} + +.font-semibold{ + font-weight: 600; +} + +.font-bold{ + font-weight: 700; +} + +.uppercase{ + text-transform: uppercase; +} + +.italic{ + font-style: italic; +} + +.leading-7{ + line-height: 1.75rem; +} + +.tracking-tight{ + letter-spacing: -0.01em; +} + +.tracking-normal{ + letter-spacing: 0; +} + +.text-gray-100{ + --tw-text-opacity: 1; + color: rgb(243 244 246 / var(--tw-text-opacity)); +} + +.text-gray-400{ + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + +.text-white{ + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); +} + +.text-blue-200{ + --tw-text-opacity: 1; + color: rgb(191 219 254 / var(--tw-text-opacity)); +} + +.text-gray-300{ + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)); +} + +.text-blue-500{ + --tw-text-opacity: 1; + color: rgb(59 130 246 / var(--tw-text-opacity)); +} + +.text-gray-200{ + --tw-text-opacity: 1; + color: rgb(229 231 235 / var(--tw-text-opacity)); +} + +.text-emerald-500{ + --tw-text-opacity: 1; + color: rgb(16 185 129 / var(--tw-text-opacity)); +} + +.text-emerald-600{ + --tw-text-opacity: 1; + color: rgb(5 150 105 / var(--tw-text-opacity)); +} + +.text-gray-600{ + --tw-text-opacity: 1; + color: rgb(75 85 99 / var(--tw-text-opacity)); +} + +.text-pink-200{ + --tw-text-opacity: 1; + color: rgb(251 207 232 / var(--tw-text-opacity)); +} + +.text-pink-50{ + --tw-text-opacity: 1; + color: rgb(253 242 248 / var(--tw-text-opacity)); +} + +.text-pink-500{ + --tw-text-opacity: 1; + color: rgb(236 72 153 / var(--tw-text-opacity)); +} + +.text-gray-500{ + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); +} + +.text-gray-900{ + --tw-text-opacity: 1; + color: rgb(17 24 39 / var(--tw-text-opacity)); +} + +.text-gray-700{ + --tw-text-opacity: 1; + color: rgb(55 65 81 / var(--tw-text-opacity)); +} + +.text-indigo-600{ + --tw-text-opacity: 1; + color: rgb(79 70 229 / var(--tw-text-opacity)); +} + +.text-black{ + --tw-text-opacity: 1; + color: rgb(0 0 0 / var(--tw-text-opacity)); +} + +.underline{ + -webkit-text-decoration-line: underline; + text-decoration-line: underline; +} + +.antialiased{ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.opacity-60{ + opacity: 0.6; +} + +.shadow-lg{ + --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); + --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.shadow-sm{ + --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); + --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} + +.shadow-blue-500\/25{ + --tw-shadow-color: rgb(59 130 246 / 0.25); + --tw-shadow: var(--tw-shadow-colored); +} + +.filter{ + filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); +} + +.transition{ + transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} + +.transition-transform{ + transition-property: transform; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} + +.duration-150{ + transition-duration: 150ms; +} + +.ease-in-out{ + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); +} + +/* Additional Tailwind directives: https://tailwindcss.com/docs/functions-and-directives/#responsive */ + +/* See Alpine.js: https://github.com/alpinejs/alpine#x-cloak */ + +[x-cloak=""] { + display: none; +} + +.before\:absolute::before{ + content: var(--tw-content); + position: absolute; +} + +.before\:inset-0::before{ + content: var(--tw-content); + top: 0px; + right: 0px; + bottom: 0px; + left: 0px; +} + +.before\:-z-10::before{ + content: var(--tw-content); + z-index: -10; +} + +.before\:-m-0\.5::before{ + content: var(--tw-content); + margin: -0.125rem; +} + +.before\:-m-0::before{ + content: var(--tw-content); + margin: -0px; +} + +.before\:min-h-\[4rem\]::before{ + content: var(--tw-content); + min-height: 4rem; +} + +.before\:flex-1::before{ + content: var(--tw-content); + flex: 1 1 0%; +} + +.before\:rounded-full::before{ + content: var(--tw-content); + border-radius: 9999px; +} + +.before\:bg-gray-800::before{ + content: var(--tw-content); + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); +} + +.before\:bg-gradient-to-t::before{ + content: var(--tw-content); + background-image: linear-gradient(to top, var(--tw-gradient-stops)); +} + +.before\:from-gray-800::before{ + content: var(--tw-content); + --tw-gradient-from: #1f2937; + --tw-gradient-to: rgb(31 41 55 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + +.before\:via-gray-600::before{ + content: var(--tw-content); + --tw-gradient-to: rgb(75 85 99 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #4b5563, var(--tw-gradient-to); +} + +.before\:via-gray-300::before{ + content: var(--tw-content); + --tw-gradient-to: rgb(209 213 219 / 0); + --tw-gradient-stops: var(--tw-gradient-from), #d1d5db, var(--tw-gradient-to); +} + +.before\:to-gray-800::before{ + content: var(--tw-content); + --tw-gradient-to: #1f2937; +} + +.before\:content-\[\'\'\]::before{ + --tw-content: ''; + content: var(--tw-content); +} + +.after\:flex-1::after{ + content: var(--tw-content); + flex: 1 1 0%; +} + +.hover\:to-blue-500:hover{ + --tw-gradient-to: #3b82f6; +} + +.hover\:to-gray-800:hover{ + --tw-gradient-to: #1f2937; +} + +.hover\:to-pink-500:hover{ + --tw-gradient-to: #ec4899; +} + +.hover\:text-blue-500:hover{ + --tw-text-opacity: 1; + color: rgb(59 130 246 / var(--tw-text-opacity)); +} + +.hover\:text-blue-400:hover{ + --tw-text-opacity: 1; + color: rgb(96 165 250 / var(--tw-text-opacity)); +} + +.focus\:border-indigo-300:focus{ + --tw-border-opacity: 1; + border-color: rgb(165 180 252 / var(--tw-border-opacity)); +} + +.focus\:border-black:focus{ + --tw-border-opacity: 1; + border-color: rgb(0 0 0 / var(--tw-border-opacity)); +} + +.focus\:border-gray-300:focus{ + --tw-border-opacity: 1; + border-color: rgb(209 213 219 / var(--tw-border-opacity)); +} + +.focus\:border-gray-500:focus{ + --tw-border-opacity: 1; + border-color: rgb(107 114 128 / var(--tw-border-opacity)); +} + +.focus\:border-transparent:focus{ + border-color: transparent; +} + +.focus\:bg-white:focus{ + --tw-bg-opacity: 1; + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); +} + +.focus\:bg-gray-200:focus{ + --tw-bg-opacity: 1; + background-color: rgb(229 231 235 / var(--tw-bg-opacity)); +} + +.focus\:ring:focus{ + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus\:ring-0:focus{ + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus\:ring-1:focus{ + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.focus\:ring-indigo-200:focus{ + --tw-ring-opacity: 1; + --tw-ring-color: rgb(199 210 254 / var(--tw-ring-opacity)); +} + +.focus\:ring-black:focus{ + --tw-ring-opacity: 1; + --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity)); +} + +.focus\:ring-gray-500:focus{ + --tw-ring-opacity: 1; + --tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity)); +} + +.focus\:ring-opacity-50:focus{ + --tw-ring-opacity: 0.5; +} + +.focus\:ring-offset-0:focus{ + --tw-ring-offset-width: 0px; +} + +.focus\:ring-offset-2:focus{ + --tw-ring-offset-width: 2px; +} + +.group:hover .group-hover\:translate-x-0\.5{ + --tw-translate-x: 0.125rem; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.group:hover .group-hover\:translate-x-0{ + --tw-translate-x: 0px; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.group:hover .group-hover\:fill-gray-200{ + fill: #e5e7eb; +} + +.group:hover .group-hover\:text-gray-300{ + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)); +} + +@media (min-width: 640px){ + .sm\:col-span-12{ + grid-column: span 12 / span 12; + } + + .sm\:col-span-6{ + grid-column: span 6 / span 6; + } + + .sm\:flex{ + display: flex; + } + + .sm\:w-1\/2{ + width: 50%; + } + + .sm\:max-w-none{ + max-width: none; + } + + .sm\:grid-cols-2{ + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .sm\:grid-cols-12{ + grid-template-columns: repeat(12, minmax(0, 1fr)); + } + + .sm\:justify-center{ + justify-content: center; + } + + .sm\:gap-x-6{ + -moz-column-gap: 1.5rem; + column-gap: 1.5rem; + } + + .sm\:gap-y-8{ + row-gap: 2rem; + } + + .sm\:space-y-0 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); + } + + .sm\:space-x-4 > :not([hidden]) ~ :not([hidden]){ + --tw-space-x-reverse: 0; + margin-right: calc(1rem * var(--tw-space-x-reverse)); + margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); + } + + .sm\:px-6{ + padding-left: 1.5rem; + padding-right: 1.5rem; + } +} + +@media (min-width: 768px){ + .md\:order-none{ + order: 0; + } + + .md\:col-auto{ + grid-column: auto; + } + + .md\:col-span-3{ + grid-column: span 3 / span 3; + } + + .md\:mx-0{ + margin-left: 0px; + margin-right: 0px; + } + + .md\:h-20{ + height: 5rem; + } + + .md\:w-7\/12{ + width: 58.333333%; + } + + .md\:w-5\/12{ + width: 41.666667%; + } + + .md\:max-w-\[640px\]{ + max-width: 640px; + } + + .md\:max-w-5xl{ + max-width: 64rem; + } + + .md\:max-w-none{ + max-width: none; + } + + .md\:max-w-4xl{ + max-width: 56rem; + } + + .md\:grid-cols-5{ + grid-template-columns: repeat(5, minmax(0, 1fr)); + } + + .md\:grid-cols-3{ + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + + .md\:grid-cols-4{ + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + + .md\:grid-cols-2{ + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .md\:flex-row{ + flex-direction: row; + } + + .md\:items-center{ + align-items: center; + } + + .md\:justify-start{ + justify-content: flex-start; + } + + .md\:space-x-8 > :not([hidden]) ~ :not([hidden]){ + --tw-space-x-reverse: 0; + margin-right: calc(2rem * var(--tw-space-x-reverse)); + margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse))); + } + + .md\:space-y-0 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); + } + + .md\:py-20{ + padding-top: 5rem; + padding-bottom: 5rem; + } + + .md\:py-16{ + padding-top: 4rem; + padding-bottom: 4rem; + } + + .md\:px-12{ + padding-left: 3rem; + padding-right: 3rem; + } + + .md\:py-12{ + padding-top: 3rem; + padding-bottom: 3rem; + } + + .md\:pt-40{ + padding-top: 10rem; + } + + .md\:pb-20{ + padding-bottom: 5rem; + } + + .md\:pt-20{ + padding-top: 5rem; + } + + .md\:text-left{ + text-align: left; + } + + .md\:before\:min-h-\[5rem\]::before{ + content: var(--tw-content); + min-height: 5rem; + } +} + +@media (min-width: 1024px){ + .lg\:col-span-4{ + grid-column: span 4 / span 4; + } + + .lg\:col-span-2{ + grid-column: span 2 / span 2; + } + + .lg\:mr-16{ + margin-right: 4rem; + } + + .lg\:mb-0{ + margin-bottom: 0px; + } + + .lg\:block{ + display: block; + } + + .lg\:w-1\/2{ + width: 50%; + } + + .lg\:max-w-none{ + max-width: none; + } + + .lg\:max-w-xs{ + max-width: 20rem; + } + + .lg\:grid-cols-3{ + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + + .lg\:flex-row{ + flex-direction: row; + } + + .lg\:gap-16{ + gap: 4rem; + } + + .lg\:gap-6{ + gap: 1.5rem; + } + + .lg\:space-x-16 > :not([hidden]) ~ :not([hidden]){ + --tw-space-x-reverse: 0; + margin-right: calc(4rem * var(--tw-space-x-reverse)); + margin-left: calc(4rem * calc(1 - var(--tw-space-x-reverse))); + } + + .lg\:px-5{ + padding-left: 1.25rem; + padding-right: 1.25rem; + } + + .lg\:text-left{ + text-align: left; + } +} diff --git a/neon-html/tailwind.config.js b/neon-html/tailwind.config.js new file mode 100644 index 0000000..979ccf2 --- /dev/null +++ b/neon-html/tailwind.config.js @@ -0,0 +1,39 @@ +module.exports = { + content: [ + './**/*.html', + './js/**/*.js', + ], + theme: { + extend: { + fontFamily: { + inter: ['Inter', 'sans-serif'], + 'uncut-sans': ['Uncut Sans', 'sans-serif'], + }, + fontSize: { + xs: ['0.75rem', { lineHeight: '1.5' }], + sm: ['0.875rem', { lineHeight: '1.5715' }], + base: ['1rem', { lineHeight: '1.5', letterSpacing: '-0.01em' }], + lg: ['1.125rem', { lineHeight: '1.5', letterSpacing: '-0.01em' }], + xl: ['1.25rem', { lineHeight: '1.5', letterSpacing: '-0.01em' }], + '2xl': ['1.5rem', { lineHeight: '1.415', letterSpacing: '-0.01em' }], + '3xl': ['1.875rem', { lineHeight: '1.333', letterSpacing: '-0.01em' }], + '4xl': ['2.25rem', { lineHeight: '1.277', letterSpacing: '-0.01em' }], + '5xl': ['3rem', { lineHeight: '1.2', letterSpacing: '-0.01em' }], + '6xl': ['3.75rem', { lineHeight: '1.166', letterSpacing: '-0.01em' }], + '7xl': ['5rem', { lineHeight: '1', letterSpacing: '-0.01em' }], + }, + letterSpacing: { + tighter: '-0.02em', + tight: '-0.01em', + normal: '0', + wide: '0.01em', + wider: '0.02em', + widest: '0.4em', + }, + }, + }, + plugins: [ + // eslint-disable-next-line global-require + require('@tailwindcss/forms'), + ], +};