├── .gitignore ├── tailwind.css ├── screenshot.png ├── assets ├── img │ ├── logo-dark.png │ ├── logo-light.png │ ├── slider-card-1.jpg │ ├── slider-card-2.jpg │ ├── slider-card-3.jpg │ ├── slider-card-4.jpg │ ├── slider-card-5.jpg │ ├── slider-card-6.jpg │ ├── slider-card-7.jpg │ ├── view-card-1.jpg │ ├── view-card-2.jpg │ ├── view-card-3.jpg │ ├── view-card-4.jpg │ ├── slider-background-1.jpg │ ├── slider-background-2.jpg │ ├── slider-background-3.jpg │ └── slider-background-4.jpg ├── css │ ├── custom.css │ └── style.css └── js │ └── script.js ├── postcss.config.js ├── tailwind.config.js ├── package.json ├── README.md └── index.html /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ -------------------------------------------------------------------------------- /tailwind.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; -------------------------------------------------------------------------------- /screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/screenshot.png -------------------------------------------------------------------------------- /assets/img/logo-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/logo-dark.png -------------------------------------------------------------------------------- /assets/img/logo-light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/logo-light.png -------------------------------------------------------------------------------- /assets/img/slider-card-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-card-1.jpg -------------------------------------------------------------------------------- /assets/img/slider-card-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-card-2.jpg -------------------------------------------------------------------------------- /assets/img/slider-card-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-card-3.jpg -------------------------------------------------------------------------------- /assets/img/slider-card-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-card-4.jpg -------------------------------------------------------------------------------- /assets/img/slider-card-5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-card-5.jpg -------------------------------------------------------------------------------- /assets/img/slider-card-6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-card-6.jpg -------------------------------------------------------------------------------- /assets/img/slider-card-7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-card-7.jpg -------------------------------------------------------------------------------- /assets/img/view-card-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/view-card-1.jpg -------------------------------------------------------------------------------- /assets/img/view-card-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/view-card-2.jpg -------------------------------------------------------------------------------- /assets/img/view-card-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/view-card-3.jpg -------------------------------------------------------------------------------- /assets/img/view-card-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/view-card-4.jpg -------------------------------------------------------------------------------- /assets/img/slider-background-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-background-1.jpg -------------------------------------------------------------------------------- /assets/img/slider-background-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-background-2.jpg -------------------------------------------------------------------------------- /assets/img/slider-background-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-background-3.jpg -------------------------------------------------------------------------------- /assets/img/slider-background-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaos-seeker/zar-film/HEAD/assets/img/slider-background-4.jpg -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | }; 7 | -------------------------------------------------------------------------------- /tailwind.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | darkMode: 'class', 3 | content: ["./**/*.{html,js}"], 4 | theme: { 5 | extend: { 6 | container: { 7 | center: true, 8 | }, 9 | fontFamily: { 10 | 'sans': ['Vazirmatn, sans-serif'], 11 | }, 12 | }, 13 | }, 14 | plugins: [], 15 | }; 16 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "zarfilm", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "tw": "postcss ./tailwind.css -o ./assets/css/style.css --watch" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "devDependencies": { 13 | "autoprefixer": "^10.4.7", 14 | "postcss-cli": "^9.1.0", 15 | "tailwindcss": "^3.0.24" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 | --- 6 | 7 | # zarfilm website front-end ! 8 | ## [review online](https://sys113.github.io/zar-film/) 9 | --- 10 | ## tips 11 | 12 | * fully responsive for mobile, tablet, laptop and desktop! 13 | * light mode only set for header (i did not have enough time)! 14 | 15 | --- 16 | ## web development technologies 17 | * html 18 | * tailwindcss 19 | * java script (vanilla js , swiper(for slider) , sweet alert (for dom loaded alert)) 20 | 21 | --- 22 | ## contact me 23 | * *[email](mailto:051.SYS113@gmail.com)* 24 | * *[telegram](https://t.me/SYS113/)* 25 | * *[instagram](https://instagram.com/sys113/)* 26 | -------------------------------------------------------------------------------- /assets/css/custom.css: -------------------------------------------------------------------------------- 1 | /*? advanced search mobile drop down select */ 2 | 3 | * { 4 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 5 | -webkit-tap-highlight-color: transparent; 6 | -webkit-touch-callout: none; 7 | -webkit-user-select: none; 8 | -khtml-user-select: none; 9 | -moz-user-select: none; 10 | -ms-user-select: none; 11 | user-select: none; 12 | outline: none !important; 13 | } 14 | 15 | .select-selected { 16 | background-color: rgba(0, 0, 0, 0.8); 17 | border-radius: 10px; 18 | padding: 14px !important; 19 | overflow: hidden; 20 | font-size: 14px !important; 21 | } 22 | 23 | .select-selected:after { 24 | position: absolute; 25 | font-family: "FontAwesome"; 26 | content: "\f077"; 27 | font-size: 14px; 28 | padding: 4px 9px; 29 | background: #141415; 30 | top: 20%; 31 | left: 7px; 32 | display: flex; 33 | justify-content: center; 34 | align-items: center; 35 | border-radius: 50%; 36 | transition: transform 0.5s; 37 | } 38 | 39 | .select-selected.select-arrow-active:after { 40 | transform: rotate(180deg); 41 | } 42 | 43 | .select-items div, 44 | .select-selected { 45 | color: #ffffff; 46 | padding: 3px 8px; 47 | } 48 | 49 | .select-items { 50 | position: absolute; 51 | background-color: #040406; 52 | top: 110%; 53 | left: 0; 54 | right: 0; 55 | z-index: 99; 56 | border-radius: 10px; 57 | overflow: hidden; 58 | border: 1px solid rgb(46, 46, 46); 59 | } 60 | 61 | .select-items div { 62 | font-size: 13px !important; 63 | padding: 5px 10px; 64 | } 65 | 66 | .select-hide { 67 | display: none; 68 | } 69 | 70 | .select-items div:hover, 71 | .same-as-selected { 72 | background-color: #b86400; 73 | } 74 | 75 | .same-as-selected { 76 | border: 1px solid #c8730a !important; 77 | } 78 | 79 | /*? for sweetalert */ 80 | 81 | .swal-modal { 82 | background-color: #141923; 83 | } 84 | 85 | .swal-title { 86 | color: #DBDCDD; 87 | } 88 | 89 | .swal-text { 90 | color: #DBDCDD; 91 | text-align: center; 92 | } 93 | 94 | .swal-overlay { 95 | z-index: 40 !important; 96 | } 97 | 98 | .swal-footer { 99 | display: flex; 100 | justify-content: center; 101 | } 102 | 103 | .swal-button { 104 | background-color: #B2670E; 105 | border-radius: 10px; 106 | transition: 1s; 107 | } 108 | 109 | .swal-button--confirm:hover { 110 | background-color: #B2670E !important; 111 | } 112 | 113 | /*? for intro desktop background color */ 114 | 115 | @media screen and (min-width: 1024px) { 116 | .desktop-intro-bg-color { 117 | background: linear-gradient(270deg,#0a0d10 50%,rgba(10,13,16,0)); 118 | } 119 | } 120 | 121 | /*? intro desktop background image*/ 122 | 123 | .desktop-intro-bg-img { 124 | background: linear-gradient(270deg,#0a0d10 0.1%,rgba(10,13,16,0)); 125 | z-index: 10; 126 | } 127 | 128 | /*? select drop down desktop advanced search */ 129 | 130 | .search-advanced-desktop .select-selected { 131 | border-radius: 20px; 132 | width: 100%; 133 | } 134 | 135 | .search-advanced-desktop .select-selected:after { 136 | position: absolute; 137 | top: 24%; 138 | } 139 | 140 | .advanced-filter-dropdown .select-selected:after { 141 | position: absolute; 142 | top: 20%; 143 | } 144 | 145 | /*? after psudo for advanced-filter menu desktop */ 146 | 147 | .triangle::before{ 148 | border: 15px solid transparent; 149 | border-bottom-color: #0f121b; 150 | bottom: 100%; 151 | content: ""; 152 | display: block; 153 | left: 18%; 154 | position: absolute; 155 | z-index: 2; 156 | } 157 | 158 | /*? after psudo for advanced-category menu desktop */ 159 | 160 | .triangle::before{ 161 | border: 15px solid transparent; 162 | border-bottom-color: #0f121b; 163 | bottom: 100%; 164 | content: ""; 165 | display: block; 166 | left: 18%; 167 | position: absolute; 168 | z-index: 2; 169 | } 170 | 171 | /*? after for category menu desktop */ 172 | 173 | .desktop-category-menu::before{ 174 | left: 71%; 175 | } 176 | 177 | @media screen and (min-width: 1024px) { 178 | .desktop-category-menu::before{ 179 | left: 88%; 180 | } 181 | } 182 | 183 | /*? active style for desktop category item */ 184 | 185 | .desktop-category-menu .active { 186 | background-color: rgba(0, 0, 0, 0.8); 187 | color: white !important; 188 | } 189 | 190 | /*? show active desktop category content */ 191 | 192 | #desktop-category-content .active { 193 | display: grid !important; 194 | background-color: transparent; 195 | } 196 | 197 | /*? for toggle theme switch to moon */ 198 | 199 | .toggle-to-moon { 200 | right: 58px !important; 201 | } 202 | 203 | /*? for toggle switch active */ 204 | 205 | .circle-to-r { 206 | right: 3px !important; 207 | } 208 | 209 | .toggle-active-bg { 210 | background-color: #E88209 !important; 211 | } 212 | 213 | .circle-bg { 214 | background-color: #141822 !important; 215 | } -------------------------------------------------------------------------------- /assets/js/script.js: -------------------------------------------------------------------------------- 1 | 2 | //! element selector 3 | 4 | function $(e) { 5 | return document.querySelectorAll(e); 6 | } 7 | 8 | //! object for add cards to dom 9 | 10 | const cards = { 11 | mobileSliderCard: { 12 | one: { 13 | type: 'sub', 14 | image: 'assets/img/slider-card-1.jpg', 15 | }, 16 | two: { 17 | type: 'dub', 18 | image: 'assets/img/slider-card-2.jpg', 19 | }, 20 | tree: { 21 | type: 'sub', 22 | image: 'assets/img/slider-card-3.jpg', 23 | }, 24 | four: { 25 | type: 'dub', 26 | image: 'assets/img/slider-card-4.jpg', 27 | }, 28 | }, 29 | desktopSliderCard: { 30 | one: { 31 | type: 'sub', 32 | image: 'assets/img/slider-card-1.jpg', 33 | title: 'memory', 34 | }, 35 | two: { 36 | type: 'dub', 37 | image: 'assets/img/slider-card-2.jpg', 38 | title: 'the morthman', 39 | }, 40 | tree: { 41 | type: 'sub', 42 | image: 'assets/img/slider-card-3.jpg', 43 | title: 'bad guys', 44 | }, 45 | four: { 46 | type: 'dub', 47 | image: 'assets/img/slider-card-4.jpg', 48 | title: 'morbius', 49 | }, 50 | }, 51 | lastView: { 52 | one: { 53 | title: 'attack on titan', 54 | image: 'assets/img/view-card-4.jpg' 55 | }, 56 | two: { 57 | title: 'the end game', 58 | image: 'assets/img/view-card-3.jpg' 59 | }, 60 | tree: { 61 | title: 'boruto: naruto next generations', 62 | image: 'assets/img/view-card-2.jpg' 63 | }, 64 | four: { 65 | title: 'family guys', 66 | image: 'assets/img/view-card-1.jpg' 67 | }, 68 | }, 69 | lastUpdate: { 70 | one: { 71 | title: 'family guys', 72 | image: 'assets/img/view-card-1.jpg' 73 | }, 74 | two: { 75 | title: 'boruto: naruto next generations', 76 | image: 'assets/img/view-card-2.jpg' 77 | }, 78 | tree: { 79 | title: 'the end game', 80 | image: 'assets/img/view-card-3.jpg' 81 | }, 82 | four: { 83 | title: 'attack on titan', 84 | image: 'assets/img/view-card-4.jpg' 85 | }, 86 | five: { 87 | title: 'attack on titan', 88 | image: 'assets/img/view-card-4.jpg' 89 | }, 90 | six: { 91 | title: 'the end game', 92 | image: 'assets/img/view-card-3.jpg' 93 | }, 94 | seven: { 95 | title: 'boruto: naruto next generations', 96 | image: 'assets/img/view-card-2.jpg' 97 | }, 98 | eight: { 99 | title: 'family guys', 100 | image: 'assets/img/view-card-1.jpg' 101 | }, 102 | }, 103 | animation: { 104 | one: { 105 | type: 'sub', 106 | title: 'memory', 107 | image : 'assets/img/slider-card-1.jpg', 108 | }, 109 | two: { 110 | type: 'dub', 111 | title: 'the morthman', 112 | image : 'assets/img/slider-card-2.jpg', 113 | }, 114 | tree: { 115 | type: 'sub', 116 | title: 'bad guys', 117 | image : 'assets/img/slider-card-3.jpg', 118 | }, 119 | four: { 120 | type: 'dub', 121 | title: 'morbius', 122 | image : 'assets/img/slider-card-4.jpg', 123 | }, 124 | five: { 125 | type: 'sub', 126 | title: 'attack on titan', 127 | image : 'assets/img/slider-card-5.jpg', 128 | }, 129 | six: { 130 | type: 'dub', 131 | title: 'chip dale', 132 | image : 'assets/img/slider-card-6.jpg', 133 | }, 134 | seven: { 135 | type: 'sub', 136 | title: 'sonic 2', 137 | image : 'assets/img/slider-card-7.jpg', 138 | }, 139 | }, 140 | subTitleMovie: { 141 | one: { 142 | title: 'memory', 143 | image : 'assets/img/slider-card-1.jpg', 144 | }, 145 | two: { 146 | title: 'the morthman', 147 | image : 'assets/img/slider-card-2.jpg', 148 | }, 149 | tree: { 150 | title: 'bad guys', 151 | image : 'assets/img/slider-card-3.jpg', 152 | }, 153 | four: { 154 | title: 'morbius', 155 | image : 'assets/img/slider-card-4.jpg', 156 | }, 157 | five: { 158 | title: 'attack on titan', 159 | image : 'assets/img/slider-card-5.jpg', 160 | }, 161 | six: { 162 | title: 'chip dale', 163 | image : 'assets/img/slider-card-6.jpg', 164 | }, 165 | seven: { 166 | title: 'sonic 2', 167 | image : 'assets/img/slider-card-7.jpg', 168 | }, 169 | }, 170 | dubbedMovie: { 171 | one: { 172 | title: 'memory', 173 | image : 'assets/img/slider-card-1.jpg', 174 | }, 175 | two: { 176 | title: 'the morthman', 177 | image : 'assets/img/slider-card-2.jpg', 178 | }, 179 | tree: { 180 | title: 'bad guys', 181 | image : 'assets/img/slider-card-3.jpg', 182 | }, 183 | four: { 184 | title: 'morbius', 185 | image : 'assets/img/slider-card-4.jpg', 186 | }, 187 | five: { 188 | title: 'attack on titan', 189 | image : 'assets/img/slider-card-5.jpg', 190 | }, 191 | six: { 192 | title: 'chip dale', 193 | image : 'assets/img/slider-card-6.jpg', 194 | }, 195 | }, 196 | } 197 | 198 | //? add mobile slider cards to dom 199 | Object.keys(cards.mobileSliderCard).forEach(function(key) { 200 | tag = ` 201 |
202 | 203 | 204 | 205 |
206 | ${cards.mobileSliderCard[key].type === 'dub' ? `
دوبله
` : ''} 207 | ${cards.mobileSliderCard[key].type === 'sub' ? `
زیرنویس
` : ''} 208 |
209 | 210 |
211 |
212 |
86%
213 |
214 | 215 |
216 |
217 | 218 |
219 |
7.5
220 |
221 | 222 |
223 |
224 |
225 |
226 | `; 227 | const divTag = document.createElement('div'); 228 | divTag.classList.add(... ['swiper-slide','w-full']); 229 | divTag.innerHTML = tag; 230 | $('#mobile-card-slider')[0].appendChild(divTag); 231 | }); 232 | 233 | //? add desktop slider cards to dom 234 | Object.keys(cards.desktopSliderCard).forEach(function(key) { 235 | tag = ` 236 | 237 |
238 | 239 | 240 | 241 |
242 | ${cards.mobileSliderCard[key].type === 'dub' ? `
دوبله
` : ''} 243 | ${cards.mobileSliderCard[key].type === 'sub' ? `
زیرنویس
` : ''} 244 |
245 | 246 |
247 |
248 |
86%
249 |
250 | 251 |
252 |
253 | 254 |
255 |
7.5
256 |
257 | 258 |
259 |
260 |
261 |
262 | `; 263 | const divTag = document.createElement('div'); 264 | divTag.classList.add(... ['swiper-slide','w-1/3','swiper-slide-desktop']); 265 | divTag.innerHTML = tag; 266 | $('#desktop-card-slider')[0].appendChild(divTag); 267 | }); 268 | 269 | //? add last view card to dom 270 | Object.keys(cards.lastView).forEach(function(key) { 271 | tag = `
272 | 273 |
274 |
275 | 276 | 277 |
278 | 279 |
280 | ${cards.lastView[key].title} 281 |
`; 282 | const newTag = document.createElement('a'); 283 | newTag.setAttribute('href', "javascript:void(0)"); 284 | newTag.classList.add(... ['view-card','relative', 'overflow-hidden', 'flex', 'justify-center']); 285 | newTag.innerHTML = tag; 286 | $('#last-view')[0].appendChild(newTag); 287 | }); 288 | $('.view-card:last-child')[0].classList.add(... ['lg:hidden','xl:flex']); 289 | 290 | //? add last update card to dom 291 | Object.keys(cards.lastUpdate).forEach(function(key) { 292 | tag = `
293 | 294 | 295 | 296 |
297 |
298 | 299 |
300 |
86%
301 |
302 |
303 | 304 |
305 |
+ قسمت ۹
306 | فصل ۳ 307 |
308 | 309 |
310 | ${cards.lastUpdate[key].title} 311 |
`; 312 | const newTag = document.createElement('a'); 313 | newTag.setAttribute('href', "javascript:void(0)"); 314 | newTag.classList.add(... ['update-card','relative','mb-10','flex','justify-center']); 315 | newTag.innerHTML = tag; 316 | $('#last-update')[0].appendChild(newTag); 317 | }); 318 | for(let i = 5; i<= 6; i++){ 319 | $(`.update-card:nth-child(${i})`)[0].classList.add(... ['md:hidden','xl:flex']); 320 | } 321 | for(let i = 7; i <= 8; i++){ 322 | $(`.update-card:nth-child(${i})`)[0].classList.add(... ['md:hidden','lg:flex']); 323 | } 324 | 325 | //? add animation card to dom 326 | Object.keys(cards.animation).forEach(function(key) { 327 | tag = ` 328 |
329 | 330 | 331 | 332 |
333 | ${cards.animation[key].type === 'sub' ? '
زیرنویس
' : ''} 334 | ${cards.animation[key].type === 'dub' ? '
دوبله
' : ''} 335 |
336 | 337 |
338 | 339 |
340 |
86%
341 |
342 | 343 |
344 |
345 | 346 |
347 |
7.5
348 |
349 | 350 |
351 |
352 |
353 |
354 | 355 |
356 |
357 | WEBDL 1080p 358 |
359 |
اکشن
360 |
درام
361 |
تخیلی
362 |
363 | (2022) 364 |
365 |
366 | 367 | ${cards.animation[key].title}`; 368 | const newTag = document.createElement('a'); 369 | newTag.setAttribute('href', "javascript:void(0)"); 370 | newTag.classList.add(... ['animation-card', 'relative', 'pt-3', 'flex', 'min-w-[170px]']); 371 | newTag.innerHTML = tag; 372 | $('#animation-movie')[0].appendChild(newTag); 373 | }); 374 | $(`.animation-card:nth-child(5)`)[0].classList.add(... ['md:hidden','lg:flex']); 375 | $(`.animation-card:nth-child(6)`)[0].classList.add(... ['md:hidden','xl:flex']); 376 | $(`.animation-card:nth-child(7)`)[0].classList.add(... ['md:hidden','2xl:flex']); 377 | 378 | //? add persian subtitle movie card to dom 379 | Object.keys(cards.subTitleMovie).forEach(function(key) { 380 | tag = ` 381 |
382 | 383 | 384 | 385 |
386 |
زیرنویس
387 |
388 | 389 |
390 | 391 |
392 |
86%
393 |
394 | 395 |
396 |
397 | 398 |
399 |
7.5
400 |
401 | 402 |
403 |
404 |
405 |
406 | 407 |
408 |
409 | WEBDL 1080p 410 |
411 |
اکشن
412 |
درام
413 |
تخیلی
414 |
415 | (2022) 416 |
417 |
418 | 419 | ${cards.subTitleMovie[key].title}`; 420 | const newTag = document.createElement('a'); 421 | newTag.setAttribute('href', "javascript:void(0)"); 422 | newTag.classList.add(... ['persian-movie-sub-card', 'relative', 'pt-3', 'flex', 'min-w-[170px]']); 423 | newTag.innerHTML = tag; 424 | $('#subtitle-movie')[0].appendChild(newTag); 425 | }); 426 | $(`.persian-movie-sub-card:nth-child(5)`)[0].classList.add(... ['md:hidden','lg:flex']); 427 | $(`.persian-movie-sub-card:nth-child(6)`)[0].classList.add(... ['md:hidden','xl:flex']); 428 | $(`.persian-movie-sub-card:nth-child(7)`)[0].classList.add(... ['md:hidden','2xl:flex']); 429 | 430 | //? add persian dubbed movie card to dom 431 | Object.keys(cards.dubbedMovie).forEach(function(key) { 432 | tag = ` 433 |
434 | 435 | 436 | 437 |
438 |
دوبله
439 |
440 | 441 |
442 | 443 |
444 |
86%
445 |
446 | 447 |
448 |
449 | 450 |
451 |
7.5
452 |
453 | 454 |
455 |
456 |
457 |
458 | 459 |
460 |
461 | WEBDL 1080p 462 |
463 |
اکشن
464 |
درام
465 |
تخیلی
466 |
467 | (2022) 468 |
469 |
470 | 471 | ${cards.dubbedMovie[key].title}`; 472 | const newTag = document.createElement('a'); 473 | newTag.setAttribute('href', "javascript:void(0)"); 474 | newTag.classList.add(... ['persian-movie-dub-card', 'relative', 'pt-3', 'flex', 'min-w-[170px]']); 475 | newTag.innerHTML = tag; 476 | $('#dubbed-movie')[0].appendChild(newTag); 477 | }); 478 | $(`.persian-movie-dub-card:nth-child(4)`)[0].classList.add(... ['md:hidden','lg:flex']); 479 | $(`.persian-movie-dub-card:nth-child(5)`)[0].classList.add(... ['md:hidden','xl:flex']); 480 | $(`.persian-movie-dub-card:nth-child(6)`)[0].classList.add(... ['md:hidden','2xl:flex']); 481 | 482 | //! show alert dom loaded 483 | 484 | if (matchMedia("(min-width: 1001px)").matches) { 485 | swal({ 486 | title: "یک لحضه وایسا ...", 487 | text: "اینجا صرفا یک صفحه غیر رسمی از وب سایت زرفیلم هست!", 488 | icon: "warning", 489 | button: "بزن بریم!", 490 | }); 491 | } 492 | 493 | //! toggle switch change theme 494 | 495 | toggleAddClassWithBtnClick('#toggle-change-theme','#toggle-switch-circle',['toggle-to-moon']); 496 | toggleAddClassWithBtnClick('#toggle-change-theme','html',['dark']); 497 | 498 | //! change logo with theme status 499 | 500 | function logoImage(){ 501 | if(document.documentElement.classList.contains('dark')){ 502 | $('#logo')[0].src = 'assets/img/logo-light.png'; 503 | if (matchMedia("(min-width: 1001px)").matches) { 504 | swal({ 505 | title: "همم , یه چیزی ...", 506 | text: "راستش حسش نبود استایل های حالت لایت مود رو واسه کل سایت بزنم فقط واسه هدر حالت لایت مود زدم!", 507 | icon: "warning", 508 | button: "بزن بریم!", 509 | }); 510 | } 511 | } else { 512 | logo.src = 'assets/img/logo-dark.png'; 513 | } 514 | }; 515 | 516 | $('#toggle-change-theme')[0].addEventListener('click',()=>{ 517 | logoImage(); 518 | }); 519 | 520 | //! custom functions 521 | 522 | //? add style with click 523 | function addStyleWithClick(id,style){ 524 | const select = Array.from($(id)); 525 | const handleClick = (e) => { 526 | select.forEach(i => { 527 | i.classList.remove(style); 528 | }); 529 | e.currentTarget.classList.add(style); 530 | } 531 | select.forEach(i => { 532 | i.addEventListener('click', handleClick) 533 | }); 534 | } 535 | 536 | //? active tab and show tab content 537 | function activeTabAndContentWithClick(tab,content){ 538 | const selectTab = Array.from($(tab)); 539 | const selectContent = Array.from($(content)); 540 | selectTab.forEach(i => { 541 | i.addEventListener('mouseenter', (e) => { 542 | selectTab.forEach(i => { 543 | i.classList.remove('active'); 544 | }); 545 | selectContent.forEach(i => { 546 | i.classList.remove('active'); 547 | }); 548 | e.currentTarget.classList.add('active'); 549 | $(`#${e.currentTarget.id.replace('tab','content')}`)[0].classList.add('active'); 550 | }); 551 | }); 552 | } 553 | 554 | //? show and hide menu button click 555 | function toggleAddClassWithBtnClick(btn,menu,style) { 556 | $(btn)[0].addEventListener('click',()=>{ 557 | style.forEach((i)=>{ 558 | $(menu)[0].classList.toggle(i); 559 | }); 560 | }); 561 | } 562 | 563 | //! for mobile advanced search 564 | 565 | //? show and hide mobile advanced search menu 566 | const advancedSerachMenuMobile = ['#advanced-search-menu-btn-mobile','#advanced-search-menu-mobile-close-btn-top','#advanced-search-menu-mobile-close-btn-bottom']; 567 | advancedSerachMenuMobile.forEach((i)=> { 568 | toggleAddClassWithBtnClick(i,'#advanced-search-menu-mobile',['!visible','!opacity-100']); 569 | }); 570 | 571 | //? mobile advancedSearchMenu toggleSwitch persianDub 572 | toggleAddClassWithBtnClick('#xtw', '#xtwBorder',['toggle-active-bg' ,'!border-[#E88209]']); 573 | toggleAddClassWithBtnClick('#xtw', '#xtwCircle',['circle-to-r','circle-bg']); 574 | 575 | //? mobile advancedSearchMenu toggleSwitch subTitle 576 | toggleAddClassWithBtnClick('#rhp', '#rhpBorder',['toggle-active-bg' ,'!border-[#E88209]']); 577 | toggleAddClassWithBtnClick('#rhp', '#rhpCircle',['circle-to-r','circle-bg']); 578 | 579 | //! for mobile header bottom 580 | 581 | //? show and hide mobile bottom menu 582 | const showAndHideBottomMenu = ['#myn-btn', '#myn-close-btn']; 583 | showAndHideBottomMenu.forEach((i)=>{ 584 | toggleAddClassWithBtnClick(i,'#myn-btn',['!space-y-[10px]']); 585 | toggleAddClassWithBtnClick(i,'#myn-icon-one',['!stroke-[#eb8307]']); 586 | toggleAddClassWithBtnClick(i,'#myn-text',['hidden']); 587 | toggleAddClassWithBtnClick(i,'#myn-icon-two',['hidden']); 588 | toggleAddClassWithBtnClick(i,'#myn',['!right-0','!opacity-100']); 589 | }); 590 | 591 | //? mobile bottom menu show sub menu 592 | toggleAddClassWithBtnClick('#myn-show-sub-btn','#myn-chevron',['!rotate-180']); 593 | toggleAddClassWithBtnClick('#myn-show-sub-btn','#myn-sub-menu',['space-y-3','mt-5','mb-2','!h-auto']); 594 | 595 | //? show mobie bottom menu item list 596 | for(let i = 1; i <= 3; i++){ 597 | toggleAddClassWithBtnClick(`.myn-item-${i}-btn`,`.myn-item-${i}-list`,['!space-y-3','!mb-2','!mt-4','!h-auto','!opacity-100']); 598 | toggleAddClassWithBtnClick(`.myn-item-${i}-btn`,`.myn-item-${i}-chevron`,['!rotate-180']); 599 | } 600 | 601 | //! for advanced search desktop 602 | 603 | //? desktop advancedSearchMenu toggleSwitch subTitle 604 | toggleAddClassWithBtnClick('#sfr', '#sfrBorder',['toggle-active-bg' ,'!border-[#E88209]']); 605 | toggleAddClassWithBtnClick('#sfr', '#sfrCircle',['circle-to-r','circle-bg']); 606 | 607 | //? desktop advancedSearchMenu toggleSwitch persian dub 608 | toggleAddClassWithBtnClick('#sxa', '#sxaBorder',['toggle-active-bg' ,'!border-[#E88209]']); 609 | toggleAddClassWithBtnClick('#sxa', '#sxaCircle',['circle-to-r','circle-bg']); 610 | 611 | //? desktop advancedSearchMenu toggleSwitch online play 612 | toggleAddClassWithBtnClick('#umk', '#umkBorder',['toggle-active-bg' ,'!border-[#E88209]']); 613 | toggleAddClassWithBtnClick('#umk', '#umkCircle',['circle-to-r','circle-bg']); 614 | 615 | //! for advanced filter desktop 616 | 617 | //? desktop advancedfilterMenu toggleSwitch online play 618 | toggleAddClassWithBtnClick('#rja', '#rjaBorder',['toggle-active-bg' ,'!border-[#E88209]']); 619 | toggleAddClassWithBtnClick('#rja', '#rjaCircle',['circle-to-r','circle-bg']); 620 | 621 | //? desktop advancedSearchMenu toggleSwitch subTitle 622 | toggleAddClassWithBtnClick('#kil', '#kilBorder',['toggle-active-bg' ,'!border-[#E88209]']); 623 | toggleAddClassWithBtnClick('#kil', '#kilCircle',['circle-to-r','circle-bg']); 624 | 625 | //? desktop advancedSearchMenu toggleSwitch persian dub 626 | toggleAddClassWithBtnClick('#qwj', '#qwjBorder',['toggle-active-bg' ,'!border-[#E88209]']); 627 | toggleAddClassWithBtnClick('#qwj', '#qwjCircle',['circle-to-r','circle-bg']); 628 | 629 | //? desktop advancedSearchMenu toggleSwitch persian dub 630 | toggleAddClassWithBtnClick('#vix', '#vixBorder',['toggle-active-bg' ,'!border-[#E88209]']); 631 | toggleAddClassWithBtnClick('#vix', '#vixCircle',['circle-to-r','circle-bg']); 632 | 633 | //? add bg yellow with click advanced search base tab 634 | addStyleWithClick('#advanced-category-base > button','bg-[#EA8308]'); 635 | 636 | //? show and hide advanced filter desktop menu 637 | toggleAddClassWithBtnClick('#ias-btn','#ias-menu-desktop',['!visible','!opacity-100']); 638 | 639 | //? show desktop category menu with click button 640 | toggleAddClassWithBtnClick('.desktop-category-button','.desktop-category-menu',['!visible','!opacity-100']); 641 | 642 | //! for desktop category menu 643 | 644 | //? active category menu desktop item with click 645 | activeTabAndContentWithClick('#desktop-category-tab div','#desktop-category-content div'); 646 | 647 | //! for desktop top message 648 | 649 | //? hide top-message with click close btn 650 | addStyleWithClick('#top-message','hidden'); 651 | 652 | //! advanced dropDown 653 | 654 | //? search select items drop-down 655 | function advancedDropDown() { 656 | let x, i, j, l, ll, selElmnt, a, b, c; 657 | x = document.getElementsByClassName("custom-select"); 658 | for (i = 0; i < x.length; i++) { 659 | selElmnt = x[i].getElementsByTagName("select")[0]; 660 | ll = selElmnt.length; 661 | a = document.createElement("DIV"); 662 | a.setAttribute("class", "select-selected"); 663 | a.innerHTML = selElmnt.options[selElmnt.selectedIndex].innerHTML; 664 | x[i].appendChild(a); 665 | b = document.createElement("DIV"); 666 | b.setAttribute("class", "select-items select-hide"); 667 | for (j = 1; j < ll; j++) { 668 | c = document.createElement("DIV"); 669 | c.innerHTML = selElmnt.options[j].innerHTML; 670 | c.addEventListener("click", function(e) { 671 | var y, i, k, s, h, sl, yl; 672 | s = this.parentNode.parentNode.getElementsByTagName("select")[0]; 673 | sl = s.length; 674 | h = this.parentNode.previousSibling; 675 | for (i = 0; i < sl; i++) { 676 | if (s.options[i].innerHTML == this.innerHTML) { 677 | s.selectedIndex = i; 678 | h.innerHTML = this.innerHTML; 679 | y = this.parentNode.getElementsByClassName("same-as-selected"); 680 | yl = y.length; 681 | for (k = 0; k < yl; k++) { 682 | y[k].removeAttribute("class"); 683 | } 684 | this.setAttribute("class", "same-as-selected"); 685 | break; 686 | } 687 | } 688 | h.click(); 689 | }); 690 | b.appendChild(c); 691 | } 692 | x[i].appendChild(b); 693 | a.addEventListener("click", function(e) { 694 | e.stopPropagation(); 695 | closeAllSelect(this); 696 | this.nextSibling.classList.toggle("select-hide"); 697 | this.classList.toggle("select-arrow-active"); 698 | }); 699 | } 700 | function closeAllSelect(elmnt) { 701 | var x, y, i, xl, yl, arrNo = []; 702 | x = document.getElementsByClassName("select-items"); 703 | y = document.getElementsByClassName("select-selected"); 704 | xl = x.length; 705 | yl = y.length; 706 | for (i = 0; i < yl; i++) { 707 | if (elmnt == y[i]) { 708 | arrNo.push(i) 709 | } else { 710 | y[i].classList.remove("select-arrow-active"); 711 | } 712 | } 713 | for (i = 0; i < xl; i++) { 714 | if (arrNo.indexOf(i)) { 715 | x[i].classList.add("select-hide"); 716 | } 717 | } 718 | } 719 | document.addEventListener("click", closeAllSelect); 720 | } 721 | advancedDropDown(); 722 | 723 | //! card slider 724 | 725 | //? intro slider 726 | function cardSlider() { 727 | if(window.innerWidth < 768 ){ 728 | //? for mobile 729 | new Swiper(".swiper-mobile", { 730 | effect: 'cards', 731 | grabCursor: true, 732 | keyboard: true, 733 | centeredSlides: true, 734 | slidesPerView: 'auto', 735 | spaceBetween: 10, 736 | loop: true, 737 | autoplay: { 738 | delay: 2000, 739 | }, 740 | }); 741 | } else { 742 | //? for desktop 743 | const swiperDesktop = new Swiper('.swiper-desktop', { 744 | loop: true, 745 | autoplay: true, 746 | slidesPerView: 'auto', 747 | allowTouchMove: true, 748 | allowSlidePrev: false, 749 | disableOnInteraction: true, 750 | speed: 500, 751 | breakpoints: { 752 | 1024: { 753 | slidesPerView: 4, 754 | spaceBetween: 10, 755 | }, 756 | }, 757 | }); 758 | 759 | //? desktop change slide and change background 760 | swiperDesktop.on('slideChange',() => { 761 | // get active card image src 762 | let cardActiveImgSrc = $('.swiper-slide-active img')[0].src.split('/'); 763 | cardActiveImgSrc = cardActiveImgSrc[cardActiveImgSrc.length - 1]; 764 | cardActiveImgSrc = cardActiveImgSrc.replace('slider-card-',''); 765 | cardSlideActiveNumber = cardActiveImgSrc.replace('.jpg',''); 766 | // change intro bg image 767 | $('#intro-bg-img')[0].src = `assets/img/slider-background-${cardSlideActiveNumber}.jpg`; 768 | // change intro card title 769 | const cardTitle = $('.swiper-slide-active .card-title')[0].innerHTML; 770 | $('#card-slider-desktop-title')[0].innerHTML = cardTitle; 771 | }); 772 | } 773 | }; 774 | 775 | window.addEventListener('resize', cardSlider()); 776 | window.addEventListener('DOMContentLoaded', cardSlider()) -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | zar-film front-end! 14 | 15 | 16 |
17 | 18 |
19 |
20 |
21 | زرفیلم را در تلگرام دنبال کنید! 22 | عضویت 23 |
24 |
25 | 28 |
29 |
30 |
31 | 32 | 43 | 44 |
45 | 46 |
47 |
48 | 49 |
50 | 59 |
60 | 61 |
62 | 63 | 64 | 65 |
66 | 67 |
68 | 69 | 75 | 76 | 77 | 78 |
79 | 80 | 248 | 249 | 256 | 257 | 262 | 263 |
264 | 270 |
271 |
272 |
273 | 274 |
275 |
276 | 277 |
278 | 279 | 280 | 283 |
284 | 285 |
286 | 287 | ورود / عضویت 288 | 289 |
290 |
291 |
292 |
293 | 294 |
295 | 296 |
297 | 298 |
299 | 300 | 301 | 302 |
303 | 304 | 336 |
337 | 338 |
339 | 340 |
341 | 342 | 343 | 344 | 345 | 346 |
347 |
348 | 349 |
350 |
351 |
352 | 353 |
354 | 355 | 356 | خرید اشتراک 357 |
358 | 359 |
360 | 361 | 362 | 363 | دانلود اپلیکیشن 364 |
365 | 366 |
367 | 368 |
369 | 370 |
371 | 372 |
373 | 374 |
375 |
376 | 377 | دسته بندی ها 378 |
379 |
380 | 381 |
382 |
383 | 384 | 500 |
501 | 502 |
503 | 504 |
505 |
506 | 507 | تماس با ما 508 |
509 | 510 |
511 | 512 | 513 |
514 |
515 | 516 | تماس با ما 517 |
518 | 519 |
520 | 521 | 522 |
523 |
524 | 525 | تماس با ما 526 |
527 | 528 |
529 | 530 | 531 |
532 |
533 | 534 | تماس با ما 535 |
536 | 537 |
538 | 539 |
540 |
541 |
542 |
543 |
544 |
545 | 546 |
547 |
548 |
549 |
550 | 551 |
552 |
553 | 554 | 560 | 561 | 564 |
565 | 566 | 598 |
599 | 600 |
601 | 602 | دانلود اپلیکیشن 603 | 604 | 605 |
606 | 607 |
608 | 609 |
610 |
611 |
612 | 613 |
614 |
615 |

جستجوی پیشرفته

616 |
617 |
618 | 619 |
620 |
621 |
622 | 623 | 688 |
689 | 690 | 870 | 871 | 885 | 886 |
887 |
888 | 889 |
890 |
891 | 892 |
893 |
894 |
سریال های بروز شده
895 |
فهرستی از آخرین بروزسانی های وبسایت
896 |
897 |
898 | 899 |
900 |
901 |
902 | 903 |
904 | 905 |
906 |
907 | جدیدترین انیمیشن ها 908 |
909 | 910 |
مشاهده بیشتر
911 |
912 | 913 |
914 | 915 |
916 | 917 |
918 |
919 |
920 | 921 |
922 | 923 |
924 | 925 |
926 |
927 | فیلم های دوبله فارسی 928 | 929 |
مشاهده بیشتر
930 |
931 | 932 |
933 | 934 |
935 |
936 | 937 |
938 |
939 | 940 |
941 | 942 |
943 |
944 | فیلم های زیر نویس 945 |
946 | 947 |
مشاهده بیشتر
948 |
949 | 950 |
951 | 952 |
953 | 954 |
955 |
956 |
957 |
958 | 985 | 986 | 987 | 988 | 989 | 990 | -------------------------------------------------------------------------------- /assets/css/style.css: -------------------------------------------------------------------------------- 1 | /* 2 | ! tailwindcss v3.0.24 | MIT License | https://tailwindcss.com 3 | *//* 4 | 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 5 | 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) 6 | */ 7 | 8 | *, 9 | ::before, 10 | ::after { 11 | box-sizing: border-box; /* 1 */ 12 | border-width: 0; /* 2 */ 13 | border-style: solid; /* 2 */ 14 | border-color: #e5e7eb; /* 2 */ 15 | } 16 | 17 | ::before, 18 | ::after { 19 | --tw-content: ''; 20 | } 21 | 22 | /* 23 | 1. Use a consistent sensible line-height in all browsers. 24 | 2. Prevent adjustments of font size after orientation changes in iOS. 25 | 3. Use a more readable tab size. 26 | 4. Use the user's configured `sans` font-family by default. 27 | */ 28 | 29 | html { 30 | line-height: 1.5; /* 1 */ 31 | -webkit-text-size-adjust: 100%; /* 2 */ 32 | -moz-tab-size: 4; /* 3 */ 33 | -o-tab-size: 4; 34 | tab-size: 4; /* 3 */ 35 | font-family: Vazirmatn, sans-serif; /* 4 */ 36 | } 37 | 38 | /* 39 | 1. Remove the margin in all browsers. 40 | 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. 41 | */ 42 | 43 | body { 44 | margin: 0; /* 1 */ 45 | line-height: inherit; /* 2 */ 46 | } 47 | 48 | /* 49 | 1. Add the correct height in Firefox. 50 | 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) 51 | 3. Ensure horizontal rules are visible by default. 52 | */ 53 | 54 | hr { 55 | height: 0; /* 1 */ 56 | color: inherit; /* 2 */ 57 | border-top-width: 1px; /* 3 */ 58 | } 59 | 60 | /* 61 | Add the correct text decoration in Chrome, Edge, and Safari. 62 | */ 63 | 64 | abbr:where([title]) { 65 | -webkit-text-decoration: underline dotted; 66 | text-decoration: underline dotted; 67 | } 68 | 69 | /* 70 | Remove the default font size and weight for headings. 71 | */ 72 | 73 | h1, 74 | h2, 75 | h3, 76 | h4, 77 | h5, 78 | h6 { 79 | font-size: inherit; 80 | font-weight: inherit; 81 | } 82 | 83 | /* 84 | Reset links to optimize for opt-in styling instead of opt-out. 85 | */ 86 | 87 | a { 88 | color: inherit; 89 | text-decoration: inherit; 90 | } 91 | 92 | /* 93 | Add the correct font weight in Edge and Safari. 94 | */ 95 | 96 | b, 97 | strong { 98 | font-weight: bolder; 99 | } 100 | 101 | /* 102 | 1. Use the user's configured `mono` font family by default. 103 | 2. Correct the odd `em` font sizing in all browsers. 104 | */ 105 | 106 | code, 107 | kbd, 108 | samp, 109 | pre { 110 | font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */ 111 | font-size: 1em; /* 2 */ 112 | } 113 | 114 | /* 115 | Add the correct font size in all browsers. 116 | */ 117 | 118 | small { 119 | font-size: 80%; 120 | } 121 | 122 | /* 123 | Prevent `sub` and `sup` elements from affecting the line height in all browsers. 124 | */ 125 | 126 | sub, 127 | sup { 128 | font-size: 75%; 129 | line-height: 0; 130 | position: relative; 131 | vertical-align: baseline; 132 | } 133 | 134 | sub { 135 | bottom: -0.25em; 136 | } 137 | 138 | sup { 139 | top: -0.5em; 140 | } 141 | 142 | /* 143 | 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) 144 | 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) 145 | 3. Remove gaps between table borders by default. 146 | */ 147 | 148 | table { 149 | text-indent: 0; /* 1 */ 150 | border-color: inherit; /* 2 */ 151 | border-collapse: collapse; /* 3 */ 152 | } 153 | 154 | /* 155 | 1. Change the font styles in all browsers. 156 | 2. Remove the margin in Firefox and Safari. 157 | 3. Remove default padding in all browsers. 158 | */ 159 | 160 | button, 161 | input, 162 | optgroup, 163 | select, 164 | textarea { 165 | font-family: inherit; /* 1 */ 166 | font-size: 100%; /* 1 */ 167 | line-height: inherit; /* 1 */ 168 | color: inherit; /* 1 */ 169 | margin: 0; /* 2 */ 170 | padding: 0; /* 3 */ 171 | } 172 | 173 | /* 174 | Remove the inheritance of text transform in Edge and Firefox. 175 | */ 176 | 177 | button, 178 | select { 179 | text-transform: none; 180 | } 181 | 182 | /* 183 | 1. Correct the inability to style clickable types in iOS and Safari. 184 | 2. Remove default button styles. 185 | */ 186 | 187 | button, 188 | [type='button'], 189 | [type='reset'], 190 | [type='submit'] { 191 | -webkit-appearance: button; /* 1 */ 192 | background-color: transparent; /* 2 */ 193 | background-image: none; /* 2 */ 194 | } 195 | 196 | /* 197 | Use the modern Firefox focus style for all focusable elements. 198 | */ 199 | 200 | :-moz-focusring { 201 | outline: auto; 202 | } 203 | 204 | /* 205 | Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) 206 | */ 207 | 208 | :-moz-ui-invalid { 209 | box-shadow: none; 210 | } 211 | 212 | /* 213 | Add the correct vertical alignment in Chrome and Firefox. 214 | */ 215 | 216 | progress { 217 | vertical-align: baseline; 218 | } 219 | 220 | /* 221 | Correct the cursor style of increment and decrement buttons in Safari. 222 | */ 223 | 224 | ::-webkit-inner-spin-button, 225 | ::-webkit-outer-spin-button { 226 | height: auto; 227 | } 228 | 229 | /* 230 | 1. Correct the odd appearance in Chrome and Safari. 231 | 2. Correct the outline style in Safari. 232 | */ 233 | 234 | [type='search'] { 235 | -webkit-appearance: textfield; /* 1 */ 236 | outline-offset: -2px; /* 2 */ 237 | } 238 | 239 | /* 240 | Remove the inner padding in Chrome and Safari on macOS. 241 | */ 242 | 243 | ::-webkit-search-decoration { 244 | -webkit-appearance: none; 245 | } 246 | 247 | /* 248 | 1. Correct the inability to style clickable types in iOS and Safari. 249 | 2. Change font properties to `inherit` in Safari. 250 | */ 251 | 252 | ::-webkit-file-upload-button { 253 | -webkit-appearance: button; /* 1 */ 254 | font: inherit; /* 2 */ 255 | } 256 | 257 | /* 258 | Add the correct display in Chrome and Safari. 259 | */ 260 | 261 | summary { 262 | display: list-item; 263 | } 264 | 265 | /* 266 | Removes the default spacing and border for appropriate elements. 267 | */ 268 | 269 | blockquote, 270 | dl, 271 | dd, 272 | h1, 273 | h2, 274 | h3, 275 | h4, 276 | h5, 277 | h6, 278 | hr, 279 | figure, 280 | p, 281 | pre { 282 | margin: 0; 283 | } 284 | 285 | fieldset { 286 | margin: 0; 287 | padding: 0; 288 | } 289 | 290 | legend { 291 | padding: 0; 292 | } 293 | 294 | ol, 295 | ul, 296 | menu { 297 | list-style: none; 298 | margin: 0; 299 | padding: 0; 300 | } 301 | 302 | /* 303 | Prevent resizing textareas horizontally by default. 304 | */ 305 | 306 | textarea { 307 | resize: vertical; 308 | } 309 | 310 | /* 311 | 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 312 | 2. Set the default placeholder color to the user's configured gray 400 color. 313 | */ 314 | 315 | input::-moz-placeholder, textarea::-moz-placeholder { 316 | opacity: 1; /* 1 */ 317 | color: #9ca3af; /* 2 */ 318 | } 319 | 320 | input:-ms-input-placeholder, textarea:-ms-input-placeholder { 321 | opacity: 1; /* 1 */ 322 | color: #9ca3af; /* 2 */ 323 | } 324 | 325 | input::placeholder, 326 | textarea::placeholder { 327 | opacity: 1; /* 1 */ 328 | color: #9ca3af; /* 2 */ 329 | } 330 | 331 | /* 332 | Set the default cursor for buttons. 333 | */ 334 | 335 | button, 336 | [role="button"] { 337 | cursor: pointer; 338 | } 339 | 340 | /* 341 | Make sure disabled buttons don't get the pointer cursor. 342 | */ 343 | :disabled { 344 | cursor: default; 345 | } 346 | 347 | /* 348 | 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) 349 | 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) 350 | This can trigger a poorly considered lint error in some tools but is included by design. 351 | */ 352 | 353 | img, 354 | svg, 355 | video, 356 | canvas, 357 | audio, 358 | iframe, 359 | embed, 360 | object { 361 | display: block; /* 1 */ 362 | vertical-align: middle; /* 2 */ 363 | } 364 | 365 | /* 366 | Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) 367 | */ 368 | 369 | img, 370 | video { 371 | max-width: 100%; 372 | height: auto; 373 | } 374 | 375 | /* 376 | Ensure the default browser behavior of the `hidden` attribute. 377 | */ 378 | 379 | [hidden] { 380 | display: none; 381 | } 382 | 383 | *, ::before, ::after { 384 | --tw-translate-x: 0; 385 | --tw-translate-y: 0; 386 | --tw-rotate: 0; 387 | --tw-skew-x: 0; 388 | --tw-skew-y: 0; 389 | --tw-scale-x: 1; 390 | --tw-scale-y: 1; 391 | --tw-pan-x: ; 392 | --tw-pan-y: ; 393 | --tw-pinch-zoom: ; 394 | --tw-scroll-snap-strictness: proximity; 395 | --tw-ordinal: ; 396 | --tw-slashed-zero: ; 397 | --tw-numeric-figure: ; 398 | --tw-numeric-spacing: ; 399 | --tw-numeric-fraction: ; 400 | --tw-ring-inset: ; 401 | --tw-ring-offset-width: 0px; 402 | --tw-ring-offset-color: #fff; 403 | --tw-ring-color: rgb(59 130 246 / 0.5); 404 | --tw-ring-offset-shadow: 0 0 #0000; 405 | --tw-ring-shadow: 0 0 #0000; 406 | --tw-shadow: 0 0 #0000; 407 | --tw-shadow-colored: 0 0 #0000; 408 | --tw-blur: ; 409 | --tw-brightness: ; 410 | --tw-contrast: ; 411 | --tw-grayscale: ; 412 | --tw-hue-rotate: ; 413 | --tw-invert: ; 414 | --tw-saturate: ; 415 | --tw-sepia: ; 416 | --tw-drop-shadow: ; 417 | --tw-backdrop-blur: ; 418 | --tw-backdrop-brightness: ; 419 | --tw-backdrop-contrast: ; 420 | --tw-backdrop-grayscale: ; 421 | --tw-backdrop-hue-rotate: ; 422 | --tw-backdrop-invert: ; 423 | --tw-backdrop-opacity: ; 424 | --tw-backdrop-saturate: ; 425 | --tw-backdrop-sepia: ; 426 | } 427 | .container { 428 | width: 100%; 429 | margin-right: auto; 430 | margin-left: auto; 431 | } 432 | @media (min-width: 640px) { 433 | 434 | .container { 435 | max-width: 640px; 436 | } 437 | } 438 | @media (min-width: 768px) { 439 | 440 | .container { 441 | max-width: 768px; 442 | } 443 | } 444 | @media (min-width: 1024px) { 445 | 446 | .container { 447 | max-width: 1024px; 448 | } 449 | } 450 | @media (min-width: 1280px) { 451 | 452 | .container { 453 | max-width: 1280px; 454 | } 455 | } 456 | @media (min-width: 1536px) { 457 | 458 | .container { 459 | max-width: 1536px; 460 | } 461 | } 462 | .sr-only { 463 | position: absolute; 464 | width: 1px; 465 | height: 1px; 466 | padding: 0; 467 | margin: -1px; 468 | overflow: hidden; 469 | clip: rect(0, 0, 0, 0); 470 | white-space: nowrap; 471 | border-width: 0; 472 | } 473 | .not-sr-only { 474 | position: static; 475 | width: auto; 476 | height: auto; 477 | padding: 0; 478 | margin: 0; 479 | overflow: visible; 480 | clip: auto; 481 | white-space: normal; 482 | } 483 | .pointer-events-none { 484 | pointer-events: none; 485 | } 486 | .pointer-events-auto { 487 | pointer-events: auto; 488 | } 489 | .\!visible { 490 | visibility: visible !important; 491 | } 492 | .visible { 493 | visibility: visible; 494 | } 495 | .invisible { 496 | visibility: hidden; 497 | } 498 | .static { 499 | position: static; 500 | } 501 | .fixed { 502 | position: fixed; 503 | } 504 | .absolute { 505 | position: absolute; 506 | } 507 | .relative { 508 | position: relative; 509 | } 510 | .sticky { 511 | position: -webkit-sticky; 512 | position: sticky; 513 | } 514 | .-inset-1 { 515 | top: -0.25rem; 516 | right: -0.25rem; 517 | bottom: -0.25rem; 518 | left: -0.25rem; 519 | } 520 | .right-\[4px\] { 521 | right: 4px; 522 | } 523 | .top-\[73px\] { 524 | top: 73px; 525 | } 526 | .left-0 { 527 | left: 0px; 528 | } 529 | .right-\[30px\] { 530 | right: 30px; 531 | } 532 | .-right-2 { 533 | right: -0.5rem; 534 | } 535 | .-top-1 { 536 | top: -0.25rem; 537 | } 538 | .right-0 { 539 | right: 0px; 540 | } 541 | .bottom-0 { 542 | bottom: 0px; 543 | } 544 | .top-\[13px\] { 545 | top: 13px; 546 | } 547 | .top-0 { 548 | top: 0px; 549 | } 550 | .-right-72 { 551 | right: -18rem; 552 | } 553 | .right-48 { 554 | right: 12rem; 555 | } 556 | .right-\[17px\] { 557 | right: 17px; 558 | } 559 | .-top-10 { 560 | top: -2.5rem; 561 | } 562 | .top-32 { 563 | top: 8rem; 564 | } 565 | .bottom-20 { 566 | bottom: 5rem; 567 | } 568 | .-top-3 { 569 | top: -0.75rem; 570 | } 571 | .bottom-12 { 572 | bottom: 3rem; 573 | } 574 | .top-\[36\%\] { 575 | top: 36%; 576 | } 577 | .left-\[44\%\] { 578 | left: 44%; 579 | } 580 | .bottom-\[3px\] { 581 | bottom: 3px; 582 | } 583 | .left-\[30px\] { 584 | left: 30px; 585 | } 586 | .bottom-2 { 587 | bottom: 0.5rem; 588 | } 589 | .left-2 { 590 | left: 0.5rem; 591 | } 592 | .-bottom-3 { 593 | bottom: -0.75rem; 594 | } 595 | .right-2 { 596 | right: 0.5rem; 597 | } 598 | .-bottom-9 { 599 | bottom: -2.25rem; 600 | } 601 | .left-3 { 602 | left: 0.75rem; 603 | } 604 | .left-1\/2 { 605 | left: 50%; 606 | } 607 | .bottom-10 { 608 | bottom: 2.5rem; 609 | } 610 | .\!right-0 { 611 | right: 0px !important; 612 | } 613 | .isolate { 614 | isolation: isolate; 615 | } 616 | .isolation-auto { 617 | isolation: auto; 618 | } 619 | .z-50 { 620 | z-index: 50; 621 | } 622 | .z-20 { 623 | z-index: 20; 624 | } 625 | .z-10 { 626 | z-index: 10; 627 | } 628 | .z-40 { 629 | z-index: 40; 630 | } 631 | .z-\[60\] { 632 | z-index: 60; 633 | } 634 | .float-right { 635 | float: right; 636 | } 637 | .float-left { 638 | float: left; 639 | } 640 | .float-none { 641 | float: none; 642 | } 643 | .clear-left { 644 | clear: left; 645 | } 646 | .clear-right { 647 | clear: right; 648 | } 649 | .clear-both { 650 | clear: both; 651 | } 652 | .clear-none { 653 | clear: none; 654 | } 655 | .m-0 { 656 | margin: 0px; 657 | } 658 | .m-2\.5 { 659 | margin: 0.625rem; 660 | } 661 | .m-2 { 662 | margin: 0.5rem; 663 | } 664 | .mr-4 { 665 | margin-right: 1rem; 666 | } 667 | .mr-6 { 668 | margin-right: 1.5rem; 669 | } 670 | .mr-1 { 671 | margin-right: 0.25rem; 672 | } 673 | .mt-4 { 674 | margin-top: 1rem; 675 | } 676 | .-mr-2 { 677 | margin-right: -0.5rem; 678 | } 679 | .mt-5 { 680 | margin-top: 1.25rem; 681 | } 682 | .-mt-9 { 683 | margin-top: -2.25rem; 684 | } 685 | .mt-14 { 686 | margin-top: 3.5rem; 687 | } 688 | .mb-4 { 689 | margin-bottom: 1rem; 690 | } 691 | .ml-1 { 692 | margin-left: 0.25rem; 693 | } 694 | .mb-2\.5 { 695 | margin-bottom: 0.625rem; 696 | } 697 | .mb-2 { 698 | margin-bottom: 0.5rem; 699 | } 700 | .mt-7 { 701 | margin-top: 1.75rem; 702 | } 703 | .mb-6 { 704 | margin-bottom: 1.5rem; 705 | } 706 | .mt-10 { 707 | margin-top: 2.5rem; 708 | } 709 | .mt-16 { 710 | margin-top: 4rem; 711 | } 712 | .mb-10 { 713 | margin-bottom: 2.5rem; 714 | } 715 | .\!mb-2 { 716 | margin-bottom: 0.5rem !important; 717 | } 718 | .\!mt-4 { 719 | margin-top: 1rem !important; 720 | } 721 | .mt-2 { 722 | margin-top: 0.5rem; 723 | } 724 | .box-border { 725 | box-sizing: border-box; 726 | } 727 | .box-content { 728 | box-sizing: content-box; 729 | } 730 | .block { 731 | display: block; 732 | } 733 | .inline-block { 734 | display: inline-block; 735 | } 736 | .inline { 737 | display: inline; 738 | } 739 | .flex { 740 | display: flex; 741 | } 742 | .\!flex { 743 | display: flex !important; 744 | } 745 | .inline-flex { 746 | display: inline-flex; 747 | } 748 | .table { 749 | display: table; 750 | } 751 | .inline-table { 752 | display: inline-table; 753 | } 754 | .table-caption { 755 | display: table-caption; 756 | } 757 | .table-cell { 758 | display: table-cell; 759 | } 760 | .table-column { 761 | display: table-column; 762 | } 763 | .table-column-group { 764 | display: table-column-group; 765 | } 766 | .table-footer-group { 767 | display: table-footer-group; 768 | } 769 | .table-header-group { 770 | display: table-header-group; 771 | } 772 | .table-row-group { 773 | display: table-row-group; 774 | } 775 | .table-row { 776 | display: table-row; 777 | } 778 | .flow-root { 779 | display: flow-root; 780 | } 781 | .grid { 782 | display: grid; 783 | } 784 | .inline-grid { 785 | display: inline-grid; 786 | } 787 | .contents { 788 | display: contents; 789 | } 790 | .list-item { 791 | display: list-item; 792 | } 793 | .hidden { 794 | display: none; 795 | } 796 | .\!hidden { 797 | display: none !important; 798 | } 799 | .h-10 { 800 | height: 2.5rem; 801 | } 802 | .h-4 { 803 | height: 1rem; 804 | } 805 | .h-12 { 806 | height: 3rem; 807 | } 808 | .h-full { 809 | height: 100%; 810 | } 811 | .h-5 { 812 | height: 1.25rem; 813 | } 814 | .h-16 { 815 | height: 4rem; 816 | } 817 | .h-9 { 818 | height: 2.25rem; 819 | } 820 | .h-7 { 821 | height: 1.75rem; 822 | } 823 | .h-6 { 824 | height: 1.5rem; 825 | } 826 | .h-\[225px\] { 827 | height: 225px; 828 | } 829 | .h-\[45px\] { 830 | height: 45px; 831 | } 832 | .h-\[25px\] { 833 | height: 25px; 834 | } 835 | .h-\[41px\] { 836 | height: 41px; 837 | } 838 | .h-\[70px\] { 839 | height: 70px; 840 | } 841 | .h-1\.5 { 842 | height: 0.375rem; 843 | } 844 | .h-1 { 845 | height: 0.25rem; 846 | } 847 | .h-14 { 848 | height: 3.5rem; 849 | } 850 | .h-8 { 851 | height: 2rem; 852 | } 853 | .h-0 { 854 | height: 0px; 855 | } 856 | .h-32 { 857 | height: 8rem; 858 | } 859 | .h-20 { 860 | height: 5rem; 861 | } 862 | .h-3 { 863 | height: 0.75rem; 864 | } 865 | .h-\[100px\] { 866 | height: 100px; 867 | } 868 | .h-\[90\%\] { 869 | height: 90%; 870 | } 871 | .h-40 { 872 | height: 10rem; 873 | } 874 | .h-0\.5 { 875 | height: 0.125rem; 876 | } 877 | .h-3\.5 { 878 | height: 0.875rem; 879 | } 880 | .h-\[190px\] { 881 | height: 190px; 882 | } 883 | .h-\[87\%\] { 884 | height: 87%; 885 | } 886 | .\!h-auto { 887 | height: auto !important; 888 | } 889 | .h-\[calc\(100\%-theme\(\'spacing\.1\'\)\)\] { 890 | height: calc(100% - 0.25rem); 891 | } 892 | .h-\[calc\(100\%-theme\(\"spacing\.1\"\)\)\] { 893 | height: calc(100% - 0.25rem); 894 | } 895 | .max-h-\[25rem\] { 896 | max-height: 25rem; 897 | } 898 | .min-h-screen { 899 | min-height: 100vh; 900 | } 901 | .w-full { 902 | width: 100%; 903 | } 904 | .w-\[97\%\] { 905 | width: 97%; 906 | } 907 | .w-\[3\%\] { 908 | width: 3%; 909 | } 910 | .w-4 { 911 | width: 1rem; 912 | } 913 | .w-5 { 914 | width: 1.25rem; 915 | } 916 | .w-\[90px\] { 917 | width: 90px; 918 | } 919 | .w-7 { 920 | width: 1.75rem; 921 | } 922 | .w-6 { 923 | width: 1.5rem; 924 | } 925 | .w-\[700px\] { 926 | width: 700px; 927 | } 928 | .\!w-\[21\%\] { 929 | width: 21% !important; 930 | } 931 | .w-\[90\%\] { 932 | width: 90%; 933 | } 934 | .w-\[25px\] { 935 | width: 25px; 936 | } 937 | .w-1\.5 { 938 | width: 0.375rem; 939 | } 940 | .w-1 { 941 | width: 0.25rem; 942 | } 943 | .w-14 { 944 | width: 3.5rem; 945 | } 946 | .w-8 { 947 | width: 2rem; 948 | } 949 | .w-64 { 950 | width: 16rem; 951 | } 952 | .w-10 { 953 | width: 2.5rem; 954 | } 955 | .w-screen { 956 | width: 100vw; 957 | } 958 | .w-3\/4 { 959 | width: 75%; 960 | } 961 | .w-\[35\%\] { 962 | width: 35%; 963 | } 964 | .w-32 { 965 | width: 8rem; 966 | } 967 | .w-20 { 968 | width: 5rem; 969 | } 970 | .w-\[65\%\] { 971 | width: 65%; 972 | } 973 | .w-12 { 974 | width: 3rem; 975 | } 976 | .w-56 { 977 | width: 14rem; 978 | } 979 | .w-80 { 980 | width: 20rem; 981 | } 982 | .w-\[40px\] { 983 | width: 40px; 984 | } 985 | .w-3 { 986 | width: 0.75rem; 987 | } 988 | .w-5\/12 { 989 | width: 41.666667%; 990 | } 991 | .w-2\/12 { 992 | width: 16.666667%; 993 | } 994 | .w-60 { 995 | width: 15rem; 996 | } 997 | .w-1\/3 { 998 | width: 33.333333%; 999 | } 1000 | .w-36 { 1001 | width: 9rem; 1002 | } 1003 | .w-\[165px\] { 1004 | width: 165px; 1005 | } 1006 | .w-16 { 1007 | width: 4rem; 1008 | } 1009 | .w-40 { 1010 | width: 10rem; 1011 | } 1012 | .w-\[110px\] { 1013 | width: 110px; 1014 | } 1015 | .w-3\.5 { 1016 | width: 0.875rem; 1017 | } 1018 | .w-\[200px\] { 1019 | width: 200px; 1020 | } 1021 | .w-\[280px\] { 1022 | width: 280px; 1023 | } 1024 | .w-\[170px\] { 1025 | width: 170px; 1026 | } 1027 | .min-w-\[170px\] { 1028 | min-width: 170px; 1029 | } 1030 | .flex-1 { 1031 | flex: 1 1 0%; 1032 | } 1033 | .flex-shrink { 1034 | flex-shrink: 1; 1035 | } 1036 | .shrink { 1037 | flex-shrink: 1; 1038 | } 1039 | .flex-grow { 1040 | flex-grow: 1; 1041 | } 1042 | .grow { 1043 | flex-grow: 1; 1044 | } 1045 | .table-auto { 1046 | table-layout: auto; 1047 | } 1048 | .table-fixed { 1049 | table-layout: fixed; 1050 | } 1051 | .border-collapse { 1052 | border-collapse: collapse; 1053 | } 1054 | .border-separate { 1055 | border-collapse: separate; 1056 | } 1057 | .\!rotate-180 { 1058 | --tw-rotate: 180deg !important; 1059 | 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)) !important; 1060 | } 1061 | .transform { 1062 | 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)); 1063 | } 1064 | .\!transform { 1065 | 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)) !important; 1066 | } 1067 | .transform-cpu { 1068 | 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)); 1069 | } 1070 | .transform-gpu { 1071 | transform: translate3d(var(--tw-translate-x), var(--tw-translate-y), 0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); 1072 | } 1073 | .transform-none { 1074 | transform: none; 1075 | } 1076 | .cursor-pointer { 1077 | cursor: pointer; 1078 | } 1079 | .touch-auto { 1080 | touch-action: auto; 1081 | } 1082 | .touch-none { 1083 | touch-action: none; 1084 | } 1085 | .touch-pan-x { 1086 | --tw-pan-x: pan-x; 1087 | touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); 1088 | } 1089 | .touch-pan-left { 1090 | --tw-pan-x: pan-left; 1091 | touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); 1092 | } 1093 | .touch-pan-right { 1094 | --tw-pan-x: pan-right; 1095 | touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); 1096 | } 1097 | .touch-pan-y { 1098 | --tw-pan-y: pan-y; 1099 | touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); 1100 | } 1101 | .touch-pan-up { 1102 | --tw-pan-y: pan-up; 1103 | touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); 1104 | } 1105 | .touch-pan-down { 1106 | --tw-pan-y: pan-down; 1107 | touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); 1108 | } 1109 | .touch-pinch-zoom { 1110 | --tw-pinch-zoom: pinch-zoom; 1111 | touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); 1112 | } 1113 | .touch-manipulation { 1114 | touch-action: manipulation; 1115 | } 1116 | .select-none { 1117 | -webkit-user-select: none; 1118 | -moz-user-select: none; 1119 | -ms-user-select: none; 1120 | user-select: none; 1121 | } 1122 | .select-text { 1123 | -webkit-user-select: text; 1124 | -moz-user-select: text; 1125 | -ms-user-select: text; 1126 | user-select: text; 1127 | } 1128 | .select-all { 1129 | -webkit-user-select: all; 1130 | -moz-user-select: all; 1131 | user-select: all; 1132 | } 1133 | .select-auto { 1134 | -webkit-user-select: auto; 1135 | -moz-user-select: auto; 1136 | -ms-user-select: auto; 1137 | user-select: auto; 1138 | } 1139 | .resize-none { 1140 | resize: none; 1141 | } 1142 | .resize-y { 1143 | resize: vertical; 1144 | } 1145 | .resize-x { 1146 | resize: horizontal; 1147 | } 1148 | .resize { 1149 | resize: both; 1150 | } 1151 | .snap-none { 1152 | -ms-scroll-snap-type: none; 1153 | scroll-snap-type: none; 1154 | } 1155 | .snap-x { 1156 | -ms-scroll-snap-type: x var(--tw-scroll-snap-strictness); 1157 | scroll-snap-type: x var(--tw-scroll-snap-strictness); 1158 | } 1159 | .snap-y { 1160 | -ms-scroll-snap-type: y var(--tw-scroll-snap-strictness); 1161 | scroll-snap-type: y var(--tw-scroll-snap-strictness); 1162 | } 1163 | .snap-both { 1164 | -ms-scroll-snap-type: both var(--tw-scroll-snap-strictness); 1165 | scroll-snap-type: both var(--tw-scroll-snap-strictness); 1166 | } 1167 | .snap-mandatory { 1168 | --tw-scroll-snap-strictness: mandatory; 1169 | } 1170 | .snap-proximity { 1171 | --tw-scroll-snap-strictness: proximity; 1172 | } 1173 | .snap-start { 1174 | scroll-snap-align: start; 1175 | } 1176 | .snap-end { 1177 | scroll-snap-align: end; 1178 | } 1179 | .snap-center { 1180 | scroll-snap-align: center; 1181 | } 1182 | .snap-align-none { 1183 | scroll-snap-align: none; 1184 | } 1185 | .snap-normal { 1186 | scroll-snap-stop: normal; 1187 | } 1188 | .snap-always { 1189 | scroll-snap-stop: always; 1190 | } 1191 | .list-inside { 1192 | list-style-position: inside; 1193 | } 1194 | .list-outside { 1195 | list-style-position: outside; 1196 | } 1197 | .list-disc { 1198 | list-style-type: disc; 1199 | } 1200 | .appearance-none { 1201 | -webkit-appearance: none; 1202 | -moz-appearance: none; 1203 | appearance: none; 1204 | } 1205 | .break-before-auto { 1206 | -moz-column-break-before: auto; 1207 | break-before: auto; 1208 | } 1209 | .break-before-avoid { 1210 | -moz-column-break-before: avoid; 1211 | break-before: avoid; 1212 | } 1213 | .break-before-all { 1214 | -moz-column-break-before: all; 1215 | break-before: all; 1216 | } 1217 | .break-before-avoid-page { 1218 | -moz-column-break-before: avoid; 1219 | break-before: avoid-page; 1220 | } 1221 | .break-before-page { 1222 | -moz-column-break-before: page; 1223 | break-before: page; 1224 | } 1225 | .break-before-left { 1226 | -moz-column-break-before: left; 1227 | break-before: left; 1228 | } 1229 | .break-before-right { 1230 | -moz-column-break-before: right; 1231 | break-before: right; 1232 | } 1233 | .break-before-column { 1234 | -moz-column-break-before: column; 1235 | break-before: column; 1236 | } 1237 | .break-inside-auto { 1238 | -moz-column-break-inside: auto; 1239 | break-inside: auto; 1240 | } 1241 | .break-inside-avoid { 1242 | -moz-column-break-inside: avoid; 1243 | break-inside: avoid; 1244 | } 1245 | .break-inside-avoid-page { 1246 | break-inside: avoid-page; 1247 | } 1248 | .break-inside-avoid-column { 1249 | -moz-column-break-inside: avoid; 1250 | break-inside: avoid-column; 1251 | } 1252 | .break-after-auto { 1253 | -moz-column-break-after: auto; 1254 | break-after: auto; 1255 | } 1256 | .break-after-avoid { 1257 | -moz-column-break-after: avoid; 1258 | break-after: avoid; 1259 | } 1260 | .break-after-all { 1261 | -moz-column-break-after: all; 1262 | break-after: all; 1263 | } 1264 | .break-after-avoid-page { 1265 | -moz-column-break-after: avoid; 1266 | break-after: avoid-page; 1267 | } 1268 | .break-after-page { 1269 | -moz-column-break-after: page; 1270 | break-after: page; 1271 | } 1272 | .break-after-left { 1273 | -moz-column-break-after: left; 1274 | break-after: left; 1275 | } 1276 | .break-after-right { 1277 | -moz-column-break-after: right; 1278 | break-after: right; 1279 | } 1280 | .break-after-column { 1281 | -moz-column-break-after: column; 1282 | break-after: column; 1283 | } 1284 | .grid-flow-row { 1285 | grid-auto-flow: row; 1286 | } 1287 | .grid-flow-col { 1288 | grid-auto-flow: column; 1289 | } 1290 | .grid-flow-row-dense { 1291 | grid-auto-flow: row dense; 1292 | } 1293 | .grid-flow-col-dense { 1294 | grid-auto-flow: column dense; 1295 | } 1296 | .grid-cols-3 { 1297 | grid-template-columns: repeat(3, minmax(0, 1fr)); 1298 | } 1299 | .grid-cols-4 { 1300 | grid-template-columns: repeat(4, minmax(0, 1fr)); 1301 | } 1302 | .flex-row { 1303 | flex-direction: row; 1304 | } 1305 | .flex-row-reverse { 1306 | flex-direction: row-reverse; 1307 | } 1308 | .flex-col { 1309 | flex-direction: column; 1310 | } 1311 | .flex-col-reverse { 1312 | flex-direction: column-reverse; 1313 | } 1314 | .flex-wrap { 1315 | flex-wrap: wrap; 1316 | } 1317 | .flex-wrap-reverse { 1318 | flex-wrap: wrap-reverse; 1319 | } 1320 | .flex-nowrap { 1321 | flex-wrap: nowrap; 1322 | } 1323 | .place-content-center { 1324 | place-content: center; 1325 | } 1326 | .place-content-start { 1327 | place-content: start; 1328 | } 1329 | .place-content-end { 1330 | place-content: end; 1331 | } 1332 | .place-content-between { 1333 | place-content: space-between; 1334 | } 1335 | .place-content-around { 1336 | place-content: space-around; 1337 | } 1338 | .place-content-evenly { 1339 | place-content: space-evenly; 1340 | } 1341 | .place-content-stretch { 1342 | place-content: stretch; 1343 | } 1344 | .place-items-start { 1345 | place-items: start; 1346 | } 1347 | .place-items-end { 1348 | place-items: end; 1349 | } 1350 | .place-items-center { 1351 | place-items: center; 1352 | } 1353 | .place-items-stretch { 1354 | place-items: stretch; 1355 | } 1356 | .content-center { 1357 | align-content: center; 1358 | } 1359 | .content-start { 1360 | align-content: flex-start; 1361 | } 1362 | .content-end { 1363 | align-content: flex-end; 1364 | } 1365 | .content-between { 1366 | align-content: space-between; 1367 | } 1368 | .content-around { 1369 | align-content: space-around; 1370 | } 1371 | .content-evenly { 1372 | align-content: space-evenly; 1373 | } 1374 | .items-start { 1375 | align-items: flex-start; 1376 | } 1377 | .items-end { 1378 | align-items: flex-end; 1379 | } 1380 | .items-center { 1381 | align-items: center; 1382 | } 1383 | .items-baseline { 1384 | align-items: baseline; 1385 | } 1386 | .items-stretch { 1387 | align-items: stretch; 1388 | } 1389 | .justify-start { 1390 | justify-content: flex-start; 1391 | } 1392 | .justify-end { 1393 | justify-content: flex-end; 1394 | } 1395 | .justify-center { 1396 | justify-content: center; 1397 | } 1398 | .justify-between { 1399 | justify-content: space-between; 1400 | } 1401 | .justify-around { 1402 | justify-content: space-around; 1403 | } 1404 | .justify-evenly { 1405 | justify-content: space-evenly; 1406 | } 1407 | .justify-items-start { 1408 | justify-items: start; 1409 | } 1410 | .justify-items-end { 1411 | justify-items: end; 1412 | } 1413 | .justify-items-center { 1414 | justify-items: center; 1415 | } 1416 | .justify-items-stretch { 1417 | justify-items: stretch; 1418 | } 1419 | .gap-4 { 1420 | gap: 1rem; 1421 | } 1422 | .gap-1 { 1423 | gap: 0.25rem; 1424 | } 1425 | .gap-6 { 1426 | gap: 1.5rem; 1427 | } 1428 | .gap-3 { 1429 | gap: 0.75rem; 1430 | } 1431 | .gap-2 { 1432 | gap: 0.5rem; 1433 | } 1434 | .gap-1\.5 { 1435 | gap: 0.375rem; 1436 | } 1437 | .gap-y-6 { 1438 | row-gap: 1.5rem; 1439 | } 1440 | .space-y-0\.5 > :not([hidden]) ~ :not([hidden]) { 1441 | --tw-space-y-reverse: 0; 1442 | margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse))); 1443 | margin-bottom: calc(0.125rem * var(--tw-space-y-reverse)); 1444 | } 1445 | .space-y-0 > :not([hidden]) ~ :not([hidden]) { 1446 | --tw-space-y-reverse: 0; 1447 | margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); 1448 | margin-bottom: calc(0px * var(--tw-space-y-reverse)); 1449 | } 1450 | .space-y-3 > :not([hidden]) ~ :not([hidden]) { 1451 | --tw-space-y-reverse: 0; 1452 | margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); 1453 | margin-bottom: calc(0.75rem * var(--tw-space-y-reverse)); 1454 | } 1455 | .space-y-\[5px\] > :not([hidden]) ~ :not([hidden]) { 1456 | --tw-space-y-reverse: 0; 1457 | margin-top: calc(5px * calc(1 - var(--tw-space-y-reverse))); 1458 | margin-bottom: calc(5px * var(--tw-space-y-reverse)); 1459 | } 1460 | .space-y-6 > :not([hidden]) ~ :not([hidden]) { 1461 | --tw-space-y-reverse: 0; 1462 | margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse))); 1463 | margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)); 1464 | } 1465 | .space-y-4 > :not([hidden]) ~ :not([hidden]) { 1466 | --tw-space-y-reverse: 0; 1467 | margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); 1468 | margin-bottom: calc(1rem * var(--tw-space-y-reverse)); 1469 | } 1470 | .space-y-2 > :not([hidden]) ~ :not([hidden]) { 1471 | --tw-space-y-reverse: 0; 1472 | margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); 1473 | margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); 1474 | } 1475 | .\!space-y-3 > :not([hidden]) ~ :not([hidden]) { 1476 | --tw-space-y-reverse: 0 !important; 1477 | margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))) !important; 1478 | margin-bottom: calc(0.75rem * var(--tw-space-y-reverse)) !important; 1479 | } 1480 | .space-y-reverse > :not([hidden]) ~ :not([hidden]) { 1481 | --tw-space-y-reverse: 1; 1482 | } 1483 | .space-x-reverse > :not([hidden]) ~ :not([hidden]) { 1484 | --tw-space-x-reverse: 1; 1485 | } 1486 | .divide-x > :not([hidden]) ~ :not([hidden]) { 1487 | --tw-divide-x-reverse: 0; 1488 | border-right-width: calc(1px * var(--tw-divide-x-reverse)); 1489 | border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); 1490 | } 1491 | .divide-y > :not([hidden]) ~ :not([hidden]) { 1492 | --tw-divide-y-reverse: 0; 1493 | border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); 1494 | border-bottom-width: calc(1px * var(--tw-divide-y-reverse)); 1495 | } 1496 | .divide-y-reverse > :not([hidden]) ~ :not([hidden]) { 1497 | --tw-divide-y-reverse: 1; 1498 | } 1499 | .divide-x-reverse > :not([hidden]) ~ :not([hidden]) { 1500 | --tw-divide-x-reverse: 1; 1501 | } 1502 | .divide-solid > :not([hidden]) ~ :not([hidden]) { 1503 | border-style: solid; 1504 | } 1505 | .divide-dashed > :not([hidden]) ~ :not([hidden]) { 1506 | border-style: dashed; 1507 | } 1508 | .divide-dotted > :not([hidden]) ~ :not([hidden]) { 1509 | border-style: dotted; 1510 | } 1511 | .divide-double > :not([hidden]) ~ :not([hidden]) { 1512 | border-style: double; 1513 | } 1514 | .divide-none > :not([hidden]) ~ :not([hidden]) { 1515 | border-style: none; 1516 | } 1517 | .place-self-auto { 1518 | place-self: auto; 1519 | } 1520 | .place-self-start { 1521 | place-self: start; 1522 | } 1523 | .place-self-end { 1524 | place-self: end; 1525 | } 1526 | .place-self-center { 1527 | place-self: center; 1528 | } 1529 | .place-self-stretch { 1530 | place-self: stretch; 1531 | } 1532 | .self-auto { 1533 | align-self: auto; 1534 | } 1535 | .self-start { 1536 | align-self: flex-start; 1537 | } 1538 | .self-end { 1539 | align-self: flex-end; 1540 | } 1541 | .self-center { 1542 | align-self: center; 1543 | } 1544 | .self-stretch { 1545 | align-self: stretch; 1546 | } 1547 | .self-baseline { 1548 | align-self: baseline; 1549 | } 1550 | .justify-self-auto { 1551 | justify-self: auto; 1552 | } 1553 | .justify-self-start { 1554 | justify-self: start; 1555 | } 1556 | .justify-self-end { 1557 | justify-self: end; 1558 | } 1559 | .justify-self-center { 1560 | justify-self: center; 1561 | } 1562 | .justify-self-stretch { 1563 | justify-self: stretch; 1564 | } 1565 | .overflow-auto { 1566 | overflow: auto; 1567 | } 1568 | .overflow-hidden { 1569 | overflow: hidden; 1570 | } 1571 | .overflow-clip { 1572 | overflow: clip; 1573 | } 1574 | .overflow-visible { 1575 | overflow: visible; 1576 | } 1577 | .overflow-scroll { 1578 | overflow: scroll; 1579 | } 1580 | .overflow-x-auto { 1581 | overflow-x: auto; 1582 | } 1583 | .overflow-y-auto { 1584 | overflow-y: auto; 1585 | } 1586 | .overflow-x-hidden { 1587 | overflow-x: hidden; 1588 | } 1589 | .overflow-y-hidden { 1590 | overflow-y: hidden; 1591 | } 1592 | .overflow-x-clip { 1593 | overflow-x: clip; 1594 | } 1595 | .overflow-y-clip { 1596 | overflow-y: clip; 1597 | } 1598 | .overflow-x-visible { 1599 | overflow-x: visible; 1600 | } 1601 | .overflow-y-visible { 1602 | overflow-y: visible; 1603 | } 1604 | .overflow-x-scroll { 1605 | overflow-x: scroll; 1606 | } 1607 | .overflow-y-scroll { 1608 | overflow-y: scroll; 1609 | } 1610 | .overscroll-auto { 1611 | -ms-scroll-chaining: chained; 1612 | overscroll-behavior: auto; 1613 | } 1614 | .overscroll-contain { 1615 | -ms-scroll-chaining: none; 1616 | overscroll-behavior: contain; 1617 | } 1618 | .overscroll-none { 1619 | -ms-scroll-chaining: none; 1620 | overscroll-behavior: none; 1621 | } 1622 | .overscroll-y-auto { 1623 | overscroll-behavior-y: auto; 1624 | } 1625 | .overscroll-y-contain { 1626 | overscroll-behavior-y: contain; 1627 | } 1628 | .overscroll-y-none { 1629 | overscroll-behavior-y: none; 1630 | } 1631 | .overscroll-x-auto { 1632 | overscroll-behavior-x: auto; 1633 | } 1634 | .overscroll-x-contain { 1635 | overscroll-behavior-x: contain; 1636 | } 1637 | .overscroll-x-none { 1638 | overscroll-behavior-x: none; 1639 | } 1640 | .scroll-auto { 1641 | scroll-behavior: auto; 1642 | } 1643 | .scroll-smooth { 1644 | scroll-behavior: smooth; 1645 | } 1646 | .truncate { 1647 | overflow: hidden; 1648 | text-overflow: ellipsis; 1649 | white-space: nowrap; 1650 | } 1651 | .overflow-ellipsis { 1652 | text-overflow: ellipsis; 1653 | } 1654 | .text-ellipsis { 1655 | text-overflow: ellipsis; 1656 | } 1657 | .text-clip { 1658 | text-overflow: clip; 1659 | } 1660 | .whitespace-normal { 1661 | white-space: normal; 1662 | } 1663 | .whitespace-nowrap { 1664 | white-space: nowrap; 1665 | } 1666 | .whitespace-pre { 1667 | white-space: pre; 1668 | } 1669 | .whitespace-pre-line { 1670 | white-space: pre-line; 1671 | } 1672 | .whitespace-pre-wrap { 1673 | white-space: pre-wrap; 1674 | } 1675 | .break-normal { 1676 | overflow-wrap: normal; 1677 | word-break: normal; 1678 | } 1679 | .break-words { 1680 | overflow-wrap: break-word; 1681 | } 1682 | .break-all { 1683 | word-break: break-all; 1684 | } 1685 | .rounded-lg { 1686 | border-radius: 0.5rem; 1687 | } 1688 | .rounded-xl { 1689 | border-radius: 0.75rem; 1690 | } 1691 | .rounded-full { 1692 | border-radius: 9999px; 1693 | } 1694 | .rounded-\[20px\] { 1695 | border-radius: 20px; 1696 | } 1697 | .rounded-md { 1698 | border-radius: 0.375rem; 1699 | } 1700 | .rounded-2xl { 1701 | border-radius: 1rem; 1702 | } 1703 | .rounded-3xl { 1704 | border-radius: 1.5rem; 1705 | } 1706 | .rounded-\[30px\] { 1707 | border-radius: 30px; 1708 | } 1709 | .rounded-\[10px\] { 1710 | border-radius: 10px; 1711 | } 1712 | .rounded-\[15px\] { 1713 | border-radius: 15px; 1714 | } 1715 | .rounded { 1716 | border-radius: 0.25rem; 1717 | } 1718 | .rounded-b-\[40px\] { 1719 | border-bottom-right-radius: 40px; 1720 | border-bottom-left-radius: 40px; 1721 | } 1722 | .rounded-t { 1723 | border-top-left-radius: 0.25rem; 1724 | border-top-right-radius: 0.25rem; 1725 | } 1726 | .rounded-r { 1727 | border-top-right-radius: 0.25rem; 1728 | border-bottom-right-radius: 0.25rem; 1729 | } 1730 | .rounded-b { 1731 | border-bottom-right-radius: 0.25rem; 1732 | border-bottom-left-radius: 0.25rem; 1733 | } 1734 | .rounded-l { 1735 | border-top-left-radius: 0.25rem; 1736 | border-bottom-left-radius: 0.25rem; 1737 | } 1738 | .rounded-tl { 1739 | border-top-left-radius: 0.25rem; 1740 | } 1741 | .rounded-tr { 1742 | border-top-right-radius: 0.25rem; 1743 | } 1744 | .rounded-br { 1745 | border-bottom-right-radius: 0.25rem; 1746 | } 1747 | .rounded-bl { 1748 | border-bottom-left-radius: 0.25rem; 1749 | } 1750 | .border { 1751 | border-width: 1px; 1752 | } 1753 | .border-\[1px\] { 1754 | border-width: 1px; 1755 | } 1756 | .border-2 { 1757 | border-width: 2px; 1758 | } 1759 | .border-4 { 1760 | border-width: 4px; 1761 | } 1762 | .border-\[5px\] { 1763 | border-width: 5px; 1764 | } 1765 | .border-x { 1766 | border-left-width: 1px; 1767 | border-right-width: 1px; 1768 | } 1769 | .border-y { 1770 | border-top-width: 1px; 1771 | border-bottom-width: 1px; 1772 | } 1773 | .border-l { 1774 | border-left-width: 1px; 1775 | } 1776 | .border-r-2 { 1777 | border-right-width: 2px; 1778 | } 1779 | .border-t { 1780 | border-top-width: 1px; 1781 | } 1782 | .border-r { 1783 | border-right-width: 1px; 1784 | } 1785 | .border-b { 1786 | border-bottom-width: 1px; 1787 | } 1788 | .border-solid { 1789 | border-style: solid; 1790 | } 1791 | .border-dashed { 1792 | border-style: dashed; 1793 | } 1794 | .border-dotted { 1795 | border-style: dotted; 1796 | } 1797 | .border-double { 1798 | border-style: double; 1799 | } 1800 | .border-hidden { 1801 | border-style: hidden; 1802 | } 1803 | .border-none { 1804 | border-style: none; 1805 | } 1806 | .border-slate-200 { 1807 | --tw-border-opacity: 1; 1808 | border-color: rgb(226 232 240 / var(--tw-border-opacity)); 1809 | } 1810 | .border-\[\#989898\] { 1811 | --tw-border-opacity: 1; 1812 | border-color: rgb(152 152 152 / var(--tw-border-opacity)); 1813 | } 1814 | .border-\[\#eb8307\] { 1815 | --tw-border-opacity: 1; 1816 | border-color: rgb(235 131 7 / var(--tw-border-opacity)); 1817 | } 1818 | .border-transparent { 1819 | border-color: transparent; 1820 | } 1821 | .border-\[\#efefef\] { 1822 | --tw-border-opacity: 1; 1823 | border-color: rgb(239 239 239 / var(--tw-border-opacity)); 1824 | } 1825 | .border-\[\#eee\] { 1826 | --tw-border-opacity: 1; 1827 | border-color: rgb(238 238 238 / var(--tw-border-opacity)); 1828 | } 1829 | .border-\[\#141822\] { 1830 | --tw-border-opacity: 1; 1831 | border-color: rgb(20 24 34 / var(--tw-border-opacity)); 1832 | } 1833 | .border-\[\#646464\] { 1834 | --tw-border-opacity: 1; 1835 | border-color: rgb(100 100 100 / var(--tw-border-opacity)); 1836 | } 1837 | .border-orange-400 { 1838 | --tw-border-opacity: 1; 1839 | border-color: rgb(251 146 60 / var(--tw-border-opacity)); 1840 | } 1841 | .border-black { 1842 | --tw-border-opacity: 1; 1843 | border-color: rgb(0 0 0 / var(--tw-border-opacity)); 1844 | } 1845 | .border-gray-300 { 1846 | --tw-border-opacity: 1; 1847 | border-color: rgb(209 213 219 / var(--tw-border-opacity)); 1848 | } 1849 | .\!border-\[\#E88209\] { 1850 | --tw-border-opacity: 1 !important; 1851 | border-color: rgb(232 130 9 / var(--tw-border-opacity)) !important; 1852 | } 1853 | .bg-\[\#000101\] { 1854 | --tw-bg-opacity: 1; 1855 | background-color: rgb(0 1 1 / var(--tw-bg-opacity)); 1856 | } 1857 | .bg-amber-700 { 1858 | --tw-bg-opacity: 1; 1859 | background-color: rgb(180 83 9 / var(--tw-bg-opacity)); 1860 | } 1861 | .bg-amber-800 { 1862 | --tw-bg-opacity: 1; 1863 | background-color: rgb(146 64 14 / var(--tw-bg-opacity)); 1864 | } 1865 | .bg-black { 1866 | --tw-bg-opacity: 1; 1867 | background-color: rgb(0 0 0 / var(--tw-bg-opacity)); 1868 | } 1869 | .bg-\[\#279a2d\] { 1870 | --tw-bg-opacity: 1; 1871 | background-color: rgb(39 154 45 / var(--tw-bg-opacity)); 1872 | } 1873 | .bg-\[\#141923\] { 1874 | --tw-bg-opacity: 1; 1875 | background-color: rgb(20 25 35 / var(--tw-bg-opacity)); 1876 | } 1877 | .bg-\[\#06070A\] { 1878 | --tw-bg-opacity: 1; 1879 | background-color: rgb(6 7 10 / var(--tw-bg-opacity)); 1880 | } 1881 | .bg-\[\#232428\] { 1882 | --tw-bg-opacity: 1; 1883 | background-color: rgb(35 36 40 / var(--tw-bg-opacity)); 1884 | } 1885 | .bg-\[\#151A23\] { 1886 | --tw-bg-opacity: 1; 1887 | background-color: rgb(21 26 35 / var(--tw-bg-opacity)); 1888 | } 1889 | .bg-transparent { 1890 | background-color: transparent; 1891 | } 1892 | .bg-\[\#DD7D08\] { 1893 | --tw-bg-opacity: 1; 1894 | background-color: rgb(221 125 8 / var(--tw-bg-opacity)); 1895 | } 1896 | .bg-\[\#E4810D\] { 1897 | --tw-bg-opacity: 1; 1898 | background-color: rgb(228 129 13 / var(--tw-bg-opacity)); 1899 | } 1900 | .bg-\[\#07090B\] { 1901 | --tw-bg-opacity: 1; 1902 | background-color: rgb(7 9 11 / var(--tw-bg-opacity)); 1903 | } 1904 | .bg-\[\#E7830A\] { 1905 | --tw-bg-opacity: 1; 1906 | background-color: rgb(231 131 10 / var(--tw-bg-opacity)); 1907 | } 1908 | .bg-\[\#eb8307\] { 1909 | --tw-bg-opacity: 1; 1910 | background-color: rgb(235 131 7 / var(--tw-bg-opacity)); 1911 | } 1912 | .bg-\[\#D97706\] { 1913 | --tw-bg-opacity: 1; 1914 | background-color: rgb(217 119 6 / var(--tw-bg-opacity)); 1915 | } 1916 | .bg-\[rgba\(20\2c 24\2c 33\2c \.9\)\] { 1917 | background-color: rgba(20,24,33,.9); 1918 | } 1919 | .bg-\[\#1b2230\] { 1920 | --tw-bg-opacity: 1; 1921 | background-color: rgb(27 34 48 / var(--tw-bg-opacity)); 1922 | } 1923 | .bg-\[\#E88209\] { 1924 | --tw-bg-opacity: 1; 1925 | background-color: rgb(232 130 9 / var(--tw-bg-opacity)); 1926 | } 1927 | .bg-slate-700 { 1928 | --tw-bg-opacity: 1; 1929 | background-color: rgb(51 65 85 / var(--tw-bg-opacity)); 1930 | } 1931 | .bg-\[\#279B2C\] { 1932 | --tw-bg-opacity: 1; 1933 | background-color: rgb(39 155 44 / var(--tw-bg-opacity)); 1934 | } 1935 | .bg-\[\#0F141A\] { 1936 | --tw-bg-opacity: 1; 1937 | background-color: rgb(15 20 26 / var(--tw-bg-opacity)); 1938 | } 1939 | .bg-\[\#090c10\] { 1940 | --tw-bg-opacity: 1; 1941 | background-color: rgb(9 12 16 / var(--tw-bg-opacity)); 1942 | } 1943 | .bg-white { 1944 | --tw-bg-opacity: 1; 1945 | background-color: rgb(255 255 255 / var(--tw-bg-opacity)); 1946 | } 1947 | .bg-\[\#141415\] { 1948 | --tw-bg-opacity: 1; 1949 | background-color: rgb(20 20 21 / var(--tw-bg-opacity)); 1950 | } 1951 | .bg-\[\#e98308\] { 1952 | --tw-bg-opacity: 1; 1953 | background-color: rgb(233 131 8 / var(--tw-bg-opacity)); 1954 | } 1955 | .bg-\[\#646464\] { 1956 | --tw-bg-opacity: 1; 1957 | background-color: rgb(100 100 100 / var(--tw-bg-opacity)); 1958 | } 1959 | .\!bg-black { 1960 | --tw-bg-opacity: 1 !important; 1961 | background-color: rgb(0 0 0 / var(--tw-bg-opacity)) !important; 1962 | } 1963 | .bg-\[\#6E6E70\] { 1964 | --tw-bg-opacity: 1; 1965 | background-color: rgb(110 110 112 / var(--tw-bg-opacity)); 1966 | } 1967 | .bg-\[\#EA8308\] { 1968 | --tw-bg-opacity: 1; 1969 | background-color: rgb(234 131 8 / var(--tw-bg-opacity)); 1970 | } 1971 | .bg-\[\#141516\] { 1972 | --tw-bg-opacity: 1; 1973 | background-color: rgb(20 21 22 / var(--tw-bg-opacity)); 1974 | } 1975 | .bg-\[\#191107\] { 1976 | --tw-bg-opacity: 1; 1977 | background-color: rgb(25 17 7 / var(--tw-bg-opacity)); 1978 | } 1979 | .bg-\[\#141414\] { 1980 | --tw-bg-opacity: 1; 1981 | background-color: rgb(20 20 20 / var(--tw-bg-opacity)); 1982 | } 1983 | .bg-\[\#E98308\] { 1984 | --tw-bg-opacity: 1; 1985 | background-color: rgb(233 131 8 / var(--tw-bg-opacity)); 1986 | } 1987 | .bg-\[\#141821\] { 1988 | --tw-bg-opacity: 1; 1989 | background-color: rgb(20 24 33 / var(--tw-bg-opacity)); 1990 | } 1991 | .bg-\[\#279A2D\] { 1992 | --tw-bg-opacity: 1; 1993 | background-color: rgb(39 154 45 / var(--tw-bg-opacity)); 1994 | } 1995 | .bg-\[\#EB8307\] { 1996 | --tw-bg-opacity: 1; 1997 | background-color: rgb(235 131 7 / var(--tw-bg-opacity)); 1998 | } 1999 | .bg-\[\#DE8214\] { 2000 | --tw-bg-opacity: 1; 2001 | background-color: rgb(222 130 20 / var(--tw-bg-opacity)); 2002 | } 2003 | .bg-\[rgb\(255\2c 0\2c 0\)\] { 2004 | --tw-bg-opacity: 1; 2005 | background-color: rgb(255 0 0 / var(--tw-bg-opacity)); 2006 | } 2007 | .bg-opacity-60 { 2008 | --tw-bg-opacity: 0.6; 2009 | } 2010 | .bg-opacity-90 { 2011 | --tw-bg-opacity: 0.9; 2012 | } 2013 | .bg-opacity-40 { 2014 | --tw-bg-opacity: 0.4; 2015 | } 2016 | .bg-opacity-5 { 2017 | --tw-bg-opacity: 0.05; 2018 | } 2019 | .bg-opacity-70 { 2020 | --tw-bg-opacity: 0.7; 2021 | } 2022 | .bg-opacity-80 { 2023 | --tw-bg-opacity: 0.8; 2024 | } 2025 | .bg-opacity-30 { 2026 | --tw-bg-opacity: 0.3; 2027 | } 2028 | .bg-\[url\(\'\.\.\.\'\)\] { 2029 | background-image: url('...'); 2030 | } 2031 | .bg-\[url\(\"\.\.\.\"\)\] { 2032 | background-image: url("..."); 2033 | } 2034 | .bg-\[url\(\'\.\.\.\'\)\2c url\(\'\.\.\.\'\)\] { 2035 | background-image: url('...'),url('...'); 2036 | } 2037 | .bg-\[url\(\"\.\.\.\"\)\2c url\(\"\.\.\.\"\)\] { 2038 | background-image: url("..."),url("..."); 2039 | } 2040 | .decoration-slice { 2041 | -webkit-box-decoration-break: slice; 2042 | box-decoration-break: slice; 2043 | } 2044 | .decoration-clone { 2045 | -webkit-box-decoration-break: clone; 2046 | box-decoration-break: clone; 2047 | } 2048 | .box-decoration-slice { 2049 | -webkit-box-decoration-break: slice; 2050 | box-decoration-break: slice; 2051 | } 2052 | .box-decoration-clone { 2053 | -webkit-box-decoration-break: clone; 2054 | box-decoration-break: clone; 2055 | } 2056 | .bg-fixed { 2057 | background-attachment: fixed; 2058 | } 2059 | .bg-local { 2060 | background-attachment: local; 2061 | } 2062 | .bg-scroll { 2063 | background-attachment: scroll; 2064 | } 2065 | .bg-clip-border { 2066 | background-clip: border-box; 2067 | } 2068 | .bg-clip-padding { 2069 | background-clip: padding-box; 2070 | } 2071 | .bg-clip-content { 2072 | background-clip: content-box; 2073 | } 2074 | .bg-clip-text { 2075 | -webkit-background-clip: text; 2076 | background-clip: text; 2077 | } 2078 | .bg-repeat { 2079 | background-repeat: repeat; 2080 | } 2081 | .bg-no-repeat { 2082 | background-repeat: no-repeat; 2083 | } 2084 | .bg-repeat-x { 2085 | background-repeat: repeat-x; 2086 | } 2087 | .bg-repeat-y { 2088 | background-repeat: repeat-y; 2089 | } 2090 | .bg-repeat-round { 2091 | background-repeat: round; 2092 | } 2093 | .bg-repeat-space { 2094 | background-repeat: space; 2095 | } 2096 | .bg-origin-border { 2097 | background-origin: border-box; 2098 | } 2099 | .bg-origin-padding { 2100 | background-origin: padding-box; 2101 | } 2102 | .bg-origin-content { 2103 | background-origin: content-box; 2104 | } 2105 | .fill-white { 2106 | fill: #fff; 2107 | } 2108 | .fill-\[\#cbcaca\] { 2109 | fill: #cbcaca; 2110 | } 2111 | .fill-\[\#DD7D08\] { 2112 | fill: #DD7D08; 2113 | } 2114 | .fill-\[\#141923\] { 2115 | fill: #141923; 2116 | } 2117 | .fill-transparent { 2118 | fill: transparent; 2119 | } 2120 | .fill-\[\#E79C42\] { 2121 | fill: #E79C42; 2122 | } 2123 | .fill-\[\#0f0f11\] { 2124 | fill: #0f0f11; 2125 | } 2126 | .fill-\[\#D97706\] { 2127 | fill: #D97706; 2128 | } 2129 | .fill-\[\#bada55\] { 2130 | fill: #bada55; 2131 | } 2132 | .fill-\[\#bada55\]\/50 { 2133 | fill: rgb(186 218 85 / 0.5); 2134 | } 2135 | .stroke-slate-200 { 2136 | stroke: #e2e8f0; 2137 | } 2138 | .stroke-\[\#cbcaca\] { 2139 | stroke: #cbcaca; 2140 | } 2141 | .stroke-white { 2142 | stroke: #fff; 2143 | } 2144 | .stroke-\[\#141923\] { 2145 | stroke: #141923; 2146 | } 2147 | .stroke-\[\#e5e5e5\] { 2148 | stroke: #e5e5e5; 2149 | } 2150 | .stroke-\[\#efefef\] { 2151 | stroke: #efefef; 2152 | } 2153 | .stroke-\[\#eee\] { 2154 | stroke: #eee; 2155 | } 2156 | .stroke-\[\#E79C42\] { 2157 | stroke: #E79C42; 2158 | } 2159 | .stroke-orange-400 { 2160 | stroke: #fb923c; 2161 | } 2162 | .object-contain { 2163 | -o-object-fit: contain; 2164 | object-fit: contain; 2165 | } 2166 | .object-cover { 2167 | -o-object-fit: cover; 2168 | object-fit: cover; 2169 | } 2170 | .object-fill { 2171 | -o-object-fit: fill; 2172 | object-fit: fill; 2173 | } 2174 | .object-none { 2175 | -o-object-fit: none; 2176 | object-fit: none; 2177 | } 2178 | .object-scale-down { 2179 | -o-object-fit: scale-down; 2180 | object-fit: scale-down; 2181 | } 2182 | .p-1 { 2183 | padding: 0.25rem; 2184 | } 2185 | .p-2\.5 { 2186 | padding: 0.625rem; 2187 | } 2188 | .p-2 { 2189 | padding: 0.5rem; 2190 | } 2191 | .p-4 { 2192 | padding: 1rem; 2193 | } 2194 | .p-3 { 2195 | padding: 0.75rem; 2196 | } 2197 | .p-\[7px\] { 2198 | padding: 7px; 2199 | } 2200 | .p-1\.5 { 2201 | padding: 0.375rem; 2202 | } 2203 | .p-0\.5 { 2204 | padding: 0.125rem; 2205 | } 2206 | .p-0 { 2207 | padding: 0px; 2208 | } 2209 | .p-3\.5 { 2210 | padding: 0.875rem; 2211 | } 2212 | .p-5 { 2213 | padding: 1.25rem; 2214 | } 2215 | .px-3 { 2216 | padding-left: 0.75rem; 2217 | padding-right: 0.75rem; 2218 | } 2219 | .py-0\.5 { 2220 | padding-top: 0.125rem; 2221 | padding-bottom: 0.125rem; 2222 | } 2223 | .py-0 { 2224 | padding-top: 0px; 2225 | padding-bottom: 0px; 2226 | } 2227 | .px-2 { 2228 | padding-left: 0.5rem; 2229 | padding-right: 0.5rem; 2230 | } 2231 | .py-1 { 2232 | padding-top: 0.25rem; 2233 | padding-bottom: 0.25rem; 2234 | } 2235 | .px-\[7px\] { 2236 | padding-left: 7px; 2237 | padding-right: 7px; 2238 | } 2239 | .py-2 { 2240 | padding-top: 0.5rem; 2241 | padding-bottom: 0.5rem; 2242 | } 2243 | .px-1\.5 { 2244 | padding-left: 0.375rem; 2245 | padding-right: 0.375rem; 2246 | } 2247 | .px-1 { 2248 | padding-left: 0.25rem; 2249 | padding-right: 0.25rem; 2250 | } 2251 | .px-4 { 2252 | padding-left: 1rem; 2253 | padding-right: 1rem; 2254 | } 2255 | .px-6 { 2256 | padding-left: 1.5rem; 2257 | padding-right: 1.5rem; 2258 | } 2259 | .py-4 { 2260 | padding-top: 1rem; 2261 | padding-bottom: 1rem; 2262 | } 2263 | .py-3 { 2264 | padding-top: 0.75rem; 2265 | padding-bottom: 0.75rem; 2266 | } 2267 | .px-5 { 2268 | padding-left: 1.25rem; 2269 | padding-right: 1.25rem; 2270 | } 2271 | .px-2\.5 { 2272 | padding-left: 0.625rem; 2273 | padding-right: 0.625rem; 2274 | } 2275 | .py-10 { 2276 | padding-top: 2.5rem; 2277 | padding-bottom: 2.5rem; 2278 | } 2279 | .pt-\[1px\] { 2280 | padding-top: 1px; 2281 | } 2282 | .pr-2 { 2283 | padding-right: 0.5rem; 2284 | } 2285 | .pt-0\.5 { 2286 | padding-top: 0.125rem; 2287 | } 2288 | .pt-0 { 2289 | padding-top: 0px; 2290 | } 2291 | .pt-4 { 2292 | padding-top: 1rem; 2293 | } 2294 | .pr-5 { 2295 | padding-right: 1.25rem; 2296 | } 2297 | .pt-5 { 2298 | padding-top: 1.25rem; 2299 | } 2300 | .pr-4 { 2301 | padding-right: 1rem; 2302 | } 2303 | .pt-1 { 2304 | padding-top: 0.25rem; 2305 | } 2306 | .pt-1\.5 { 2307 | padding-top: 0.375rem; 2308 | } 2309 | .pt-2 { 2310 | padding-top: 0.5rem; 2311 | } 2312 | .pl-1 { 2313 | padding-left: 0.25rem; 2314 | } 2315 | .pt-3 { 2316 | padding-top: 0.75rem; 2317 | } 2318 | .text-left { 2319 | text-align: left; 2320 | } 2321 | .text-center { 2322 | text-align: center; 2323 | } 2324 | .text-right { 2325 | text-align: right; 2326 | } 2327 | .text-justify { 2328 | text-align: justify; 2329 | } 2330 | .align-baseline { 2331 | vertical-align: baseline; 2332 | } 2333 | .align-top { 2334 | vertical-align: top; 2335 | } 2336 | .align-middle { 2337 | vertical-align: middle; 2338 | } 2339 | .align-bottom { 2340 | vertical-align: bottom; 2341 | } 2342 | .align-text-top { 2343 | vertical-align: text-top; 2344 | } 2345 | .align-text-bottom { 2346 | vertical-align: text-bottom; 2347 | } 2348 | .align-sub { 2349 | vertical-align: sub; 2350 | } 2351 | .align-super { 2352 | vertical-align: super; 2353 | } 2354 | .font-\[\'some_font\'\2c sans-serif\] { 2355 | font-family: 'some font',sans-serif; 2356 | } 2357 | .font-\[\"some_font\"\2c sans-serif\] { 2358 | font-family: "some font",sans-serif; 2359 | } 2360 | .text-sm { 2361 | font-size: 0.875rem; 2362 | line-height: 1.25rem; 2363 | } 2364 | .text-\[13px\] { 2365 | font-size: 13px; 2366 | } 2367 | .text-lg { 2368 | font-size: 1.125rem; 2369 | line-height: 1.75rem; 2370 | } 2371 | .text-xs { 2372 | font-size: 0.75rem; 2373 | line-height: 1rem; 2374 | } 2375 | .text-\[40px\] { 2376 | font-size: 40px; 2377 | } 2378 | .text-\[18px\] { 2379 | font-size: 18px; 2380 | } 2381 | .text-\[35px\] { 2382 | font-size: 35px; 2383 | } 2384 | .text-\[16px\] { 2385 | font-size: 16px; 2386 | } 2387 | .font-light { 2388 | font-weight: 300; 2389 | } 2390 | .font-extralight { 2391 | font-weight: 200; 2392 | } 2393 | .font-\[500\] { 2394 | font-weight: 500; 2395 | } 2396 | .font-bold { 2397 | font-weight: 700; 2398 | } 2399 | .font-extrabold { 2400 | font-weight: 800; 2401 | } 2402 | .font-normal { 2403 | font-weight: 400; 2404 | } 2405 | .uppercase { 2406 | text-transform: uppercase; 2407 | } 2408 | .lowercase { 2409 | text-transform: lowercase; 2410 | } 2411 | .capitalize { 2412 | text-transform: capitalize; 2413 | } 2414 | .normal-case { 2415 | text-transform: none; 2416 | } 2417 | .italic { 2418 | font-style: italic; 2419 | } 2420 | .not-italic { 2421 | font-style: normal; 2422 | } 2423 | .normal-nums { 2424 | font-variant-numeric: normal; 2425 | } 2426 | .ordinal { 2427 | --tw-ordinal: ordinal; 2428 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2429 | } 2430 | .slashed-zero { 2431 | --tw-slashed-zero: slashed-zero; 2432 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2433 | } 2434 | .lining-nums { 2435 | --tw-numeric-figure: lining-nums; 2436 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2437 | } 2438 | .oldstyle-nums { 2439 | --tw-numeric-figure: oldstyle-nums; 2440 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2441 | } 2442 | .proportional-nums { 2443 | --tw-numeric-spacing: proportional-nums; 2444 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2445 | } 2446 | .tabular-nums { 2447 | --tw-numeric-spacing: tabular-nums; 2448 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2449 | } 2450 | .diagonal-fractions { 2451 | --tw-numeric-fraction: diagonal-fractions; 2452 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2453 | } 2454 | .stacked-fractions { 2455 | --tw-numeric-fraction: stacked-fractions; 2456 | font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); 2457 | } 2458 | .text-slate-200 { 2459 | --tw-text-opacity: 1; 2460 | color: rgb(226 232 240 / var(--tw-text-opacity)); 2461 | } 2462 | .text-\[\#a9aaae\] { 2463 | --tw-text-opacity: 1; 2464 | color: rgb(169 170 174 / var(--tw-text-opacity)); 2465 | } 2466 | .text-white { 2467 | --tw-text-opacity: 1; 2468 | color: rgb(255 255 255 / var(--tw-text-opacity)); 2469 | } 2470 | .text-\[\#efefef\] { 2471 | --tw-text-opacity: 1; 2472 | color: rgb(239 239 239 / var(--tw-text-opacity)); 2473 | } 2474 | .text-gray-200 { 2475 | --tw-text-opacity: 1; 2476 | color: rgb(229 231 235 / var(--tw-text-opacity)); 2477 | } 2478 | .text-\[\#e5e5e5\] { 2479 | --tw-text-opacity: 1; 2480 | color: rgb(229 229 229 / var(--tw-text-opacity)); 2481 | } 2482 | .text-\[\#b8b8b8\] { 2483 | --tw-text-opacity: 1; 2484 | color: rgb(184 184 184 / var(--tw-text-opacity)); 2485 | } 2486 | .text-\[\#ffad49\] { 2487 | --tw-text-opacity: 1; 2488 | color: rgb(255 173 73 / var(--tw-text-opacity)); 2489 | } 2490 | .underline { 2491 | -webkit-text-decoration-line: underline; 2492 | text-decoration-line: underline; 2493 | } 2494 | .overline { 2495 | -webkit-text-decoration-line: overline; 2496 | text-decoration-line: overline; 2497 | } 2498 | .line-through { 2499 | -webkit-text-decoration-line: line-through; 2500 | text-decoration-line: line-through; 2501 | } 2502 | .no-underline { 2503 | -webkit-text-decoration-line: none; 2504 | text-decoration-line: none; 2505 | } 2506 | .decoration-solid { 2507 | -webkit-text-decoration-style: solid; 2508 | text-decoration-style: solid; 2509 | } 2510 | .decoration-double { 2511 | -webkit-text-decoration-style: double; 2512 | text-decoration-style: double; 2513 | } 2514 | .decoration-dotted { 2515 | -webkit-text-decoration-style: dotted; 2516 | text-decoration-style: dotted; 2517 | } 2518 | .decoration-dashed { 2519 | -webkit-text-decoration-style: dashed; 2520 | text-decoration-style: dashed; 2521 | } 2522 | .decoration-wavy { 2523 | -webkit-text-decoration-style: wavy; 2524 | text-decoration-style: wavy; 2525 | } 2526 | .antialiased { 2527 | -webkit-font-smoothing: antialiased; 2528 | -moz-osx-font-smoothing: grayscale; 2529 | } 2530 | .subpixel-antialiased { 2531 | -webkit-font-smoothing: auto; 2532 | -moz-osx-font-smoothing: auto; 2533 | } 2534 | .opacity-0 { 2535 | opacity: 0; 2536 | } 2537 | .opacity-80 { 2538 | opacity: 0.8; 2539 | } 2540 | .\!opacity-100 { 2541 | opacity: 1 !important; 2542 | } 2543 | .bg-blend-normal { 2544 | background-blend-mode: normal; 2545 | } 2546 | .bg-blend-multiply { 2547 | background-blend-mode: multiply; 2548 | } 2549 | .bg-blend-screen { 2550 | background-blend-mode: screen; 2551 | } 2552 | .bg-blend-overlay { 2553 | background-blend-mode: overlay; 2554 | } 2555 | .bg-blend-darken { 2556 | background-blend-mode: darken; 2557 | } 2558 | .bg-blend-lighten { 2559 | background-blend-mode: lighten; 2560 | } 2561 | .bg-blend-color-dodge { 2562 | background-blend-mode: color-dodge; 2563 | } 2564 | .bg-blend-color-burn { 2565 | background-blend-mode: color-burn; 2566 | } 2567 | .bg-blend-hard-light { 2568 | background-blend-mode: hard-light; 2569 | } 2570 | .bg-blend-soft-light { 2571 | background-blend-mode: soft-light; 2572 | } 2573 | .bg-blend-difference { 2574 | background-blend-mode: difference; 2575 | } 2576 | .bg-blend-exclusion { 2577 | background-blend-mode: exclusion; 2578 | } 2579 | .bg-blend-hue { 2580 | background-blend-mode: hue; 2581 | } 2582 | .bg-blend-saturation { 2583 | background-blend-mode: saturation; 2584 | } 2585 | .bg-blend-color { 2586 | background-blend-mode: color; 2587 | } 2588 | .bg-blend-luminosity { 2589 | background-blend-mode: luminosity; 2590 | } 2591 | .mix-blend-normal { 2592 | mix-blend-mode: normal; 2593 | } 2594 | .mix-blend-multiply { 2595 | mix-blend-mode: multiply; 2596 | } 2597 | .mix-blend-screen { 2598 | mix-blend-mode: screen; 2599 | } 2600 | .mix-blend-overlay { 2601 | mix-blend-mode: overlay; 2602 | } 2603 | .mix-blend-darken { 2604 | mix-blend-mode: darken; 2605 | } 2606 | .mix-blend-lighten { 2607 | mix-blend-mode: lighten; 2608 | } 2609 | .mix-blend-color-dodge { 2610 | mix-blend-mode: color-dodge; 2611 | } 2612 | .mix-blend-color-burn { 2613 | mix-blend-mode: color-burn; 2614 | } 2615 | .mix-blend-hard-light { 2616 | mix-blend-mode: hard-light; 2617 | } 2618 | .mix-blend-soft-light { 2619 | mix-blend-mode: soft-light; 2620 | } 2621 | .mix-blend-difference { 2622 | mix-blend-mode: difference; 2623 | } 2624 | .mix-blend-exclusion { 2625 | mix-blend-mode: exclusion; 2626 | } 2627 | .mix-blend-hue { 2628 | mix-blend-mode: hue; 2629 | } 2630 | .mix-blend-saturation { 2631 | mix-blend-mode: saturation; 2632 | } 2633 | .mix-blend-color { 2634 | mix-blend-mode: color; 2635 | } 2636 | .mix-blend-luminosity { 2637 | mix-blend-mode: luminosity; 2638 | } 2639 | .shadow-sm { 2640 | --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); 2641 | --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); 2642 | box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); 2643 | } 2644 | .shadow-lg { 2645 | --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); 2646 | --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); 2647 | box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); 2648 | } 2649 | .shadow { 2650 | --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); 2651 | --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); 2652 | box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); 2653 | } 2654 | .\!shadow { 2655 | --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1) !important; 2656 | --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important; 2657 | box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important; 2658 | } 2659 | .shadow-\[\#0c0f15\] { 2660 | --tw-shadow-color: #0c0f15; 2661 | --tw-shadow: var(--tw-shadow-colored); 2662 | } 2663 | .shadow-\[\#131920\] { 2664 | --tw-shadow-color: #131920; 2665 | --tw-shadow: var(--tw-shadow-colored); 2666 | } 2667 | .outline-none { 2668 | outline: 2px solid transparent; 2669 | outline-offset: 2px; 2670 | } 2671 | .outline { 2672 | outline-style: solid; 2673 | } 2674 | .outline-dashed { 2675 | outline-style: dashed; 2676 | } 2677 | .outline-dotted { 2678 | outline-style: dotted; 2679 | } 2680 | .outline-double { 2681 | outline-style: double; 2682 | } 2683 | .outline-hidden { 2684 | outline-style: hidden; 2685 | } 2686 | .outline-0 { 2687 | outline-width: 0px; 2688 | } 2689 | .ring-\[3px\] { 2690 | --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); 2691 | --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); 2692 | box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); 2693 | } 2694 | .ring-\[5px\] { 2695 | --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); 2696 | --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(5px + var(--tw-ring-offset-width)) var(--tw-ring-color); 2697 | box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); 2698 | } 2699 | .ring-1 { 2700 | --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); 2701 | --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); 2702 | box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); 2703 | } 2704 | .ring { 2705 | --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); 2706 | --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); 2707 | box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); 2708 | } 2709 | .ring-inset { 2710 | --tw-ring-inset: inset; 2711 | } 2712 | .ring-\[\#343535\] { 2713 | --tw-ring-opacity: 1; 2714 | --tw-ring-color: rgb(52 53 53 / var(--tw-ring-opacity)); 2715 | } 2716 | .ring-black { 2717 | --tw-ring-opacity: 1; 2718 | --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity)); 2719 | } 2720 | .ring-\[\#080808\] { 2721 | --tw-ring-opacity: 1; 2722 | --tw-ring-color: rgb(8 8 8 / var(--tw-ring-opacity)); 2723 | } 2724 | .blur { 2725 | --tw-blur: blur(8px); 2726 | 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); 2727 | } 2728 | .drop-shadow { 2729 | --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06)); 2730 | 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); 2731 | } 2732 | .grayscale { 2733 | --tw-grayscale: grayscale(100%); 2734 | 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); 2735 | } 2736 | .invert { 2737 | --tw-invert: invert(100%); 2738 | 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); 2739 | } 2740 | .sepia { 2741 | --tw-sepia: sepia(100%); 2742 | 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); 2743 | } 2744 | .filter { 2745 | 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); 2746 | } 2747 | .\!filter { 2748 | 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) !important; 2749 | } 2750 | .filter-none { 2751 | filter: none; 2752 | } 2753 | .backdrop-blur-sm { 2754 | --tw-backdrop-blur: blur(4px); 2755 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2756 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2757 | } 2758 | .backdrop-blur-md { 2759 | --tw-backdrop-blur: blur(12px); 2760 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2761 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2762 | } 2763 | .backdrop-blur-xl { 2764 | --tw-backdrop-blur: blur(24px); 2765 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2766 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2767 | } 2768 | .backdrop-blur-\[2px\] { 2769 | --tw-backdrop-blur: blur(2px); 2770 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2771 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2772 | } 2773 | .backdrop-blur { 2774 | --tw-backdrop-blur: blur(8px); 2775 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2776 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2777 | } 2778 | .backdrop-grayscale { 2779 | --tw-backdrop-grayscale: grayscale(100%); 2780 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2781 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2782 | } 2783 | .backdrop-invert { 2784 | --tw-backdrop-invert: invert(100%); 2785 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2786 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2787 | } 2788 | .backdrop-sepia { 2789 | --tw-backdrop-sepia: sepia(100%); 2790 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2791 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2792 | } 2793 | .backdrop-filter { 2794 | -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2795 | backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); 2796 | } 2797 | .backdrop-filter-none { 2798 | -webkit-backdrop-filter: none; 2799 | backdrop-filter: none; 2800 | } 2801 | .transition-colors { 2802 | transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color; 2803 | transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; 2804 | transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color; 2805 | transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 2806 | transition-duration: 150ms; 2807 | } 2808 | .transition-all { 2809 | transition-property: all; 2810 | transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 2811 | transition-duration: 150ms; 2812 | } 2813 | .transition-transform { 2814 | transition-property: transform; 2815 | transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 2816 | transition-duration: 150ms; 2817 | } 2818 | .transition { 2819 | transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; 2820 | transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; 2821 | 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; 2822 | transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 2823 | transition-duration: 150ms; 2824 | } 2825 | .duration-500 { 2826 | transition-duration: 500ms; 2827 | } 2828 | .duration-700 { 2829 | transition-duration: 700ms; 2830 | } 2831 | .duration-300 { 2832 | transition-duration: 300ms; 2833 | } 2834 | .ease-in { 2835 | transition-timing-function: cubic-bezier(0.4, 0, 1, 1); 2836 | } 2837 | .ease-out { 2838 | transition-timing-function: cubic-bezier(0, 0, 0.2, 1); 2839 | } 2840 | .ease-in-out { 2841 | transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 2842 | } 2843 | .content-\[\'hello\'\] { 2844 | --tw-content: 'hello'; 2845 | content: var(--tw-content); 2846 | } 2847 | .content-\[\"hello\"\] { 2848 | --tw-content: "hello"; 2849 | content: var(--tw-content); 2850 | } 2851 | .content-\[\'this-is-also-valid\]-weirdly-enough\'\] { 2852 | --tw-content: 'this-is-also-valid]-weirdly-enough'; 2853 | content: var(--tw-content); 2854 | } 2855 | .\[attr\:value\] { 2856 | attr: value; 2857 | } 2858 | .\[content\:\'hello\'\] { 2859 | content: 'hello'; 2860 | } 2861 | .\[content\:\"hello\"\] { 2862 | content: "hello"; 2863 | } 2864 | .marker\:m-0 *::marker { 2865 | margin: 0px; 2866 | } 2867 | .marker\:m-0::marker { 2868 | margin: 0px; 2869 | } 2870 | .hover\:scale-110:hover { 2871 | --tw-scale-x: 1.1; 2872 | --tw-scale-y: 1.1; 2873 | 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)); 2874 | } 2875 | .hover\:border-\[\#eb8307\]:hover { 2876 | --tw-border-opacity: 1; 2877 | border-color: rgb(235 131 7 / var(--tw-border-opacity)); 2878 | } 2879 | .hover\:bg-\[\#d37706\]:hover { 2880 | --tw-bg-opacity: 1; 2881 | background-color: rgb(211 119 6 / var(--tw-bg-opacity)); 2882 | } 2883 | .hover\:pr-1:hover { 2884 | padding-right: 0.25rem; 2885 | } 2886 | .hover\:font-bold:hover { 2887 | font-weight: 700; 2888 | } 2889 | .hover\:text-white:hover { 2890 | --tw-text-opacity: 1; 2891 | color: rgb(255 255 255 / var(--tw-text-opacity)); 2892 | } 2893 | .hover\:text-\[\#eb8307\]:hover { 2894 | --tw-text-opacity: 1; 2895 | color: rgb(235 131 7 / var(--tw-text-opacity)); 2896 | } 2897 | .hover\:text-\[\#EB8307\]:hover { 2898 | --tw-text-opacity: 1; 2899 | color: rgb(235 131 7 / var(--tw-text-opacity)); 2900 | } 2901 | .hover\:text-\[\#EA8308\]:hover { 2902 | --tw-text-opacity: 1; 2903 | color: rgb(234 131 8 / var(--tw-text-opacity)); 2904 | } 2905 | .hover\:text-\[\#eb8308\]:hover { 2906 | --tw-text-opacity: 1; 2907 | color: rgb(235 131 8 / var(--tw-text-opacity)); 2908 | } 2909 | .hover\:opacity-100:hover { 2910 | opacity: 1; 2911 | } 2912 | .hover\:brightness-50:hover { 2913 | --tw-brightness: brightness(.5); 2914 | 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); 2915 | } 2916 | .before\:hover\:text-center:hover::before { 2917 | content: var(--tw-content); 2918 | text-align: center; 2919 | } 2920 | .hover\:before\:text-center:hover::before { 2921 | content: var(--tw-content); 2922 | text-align: center; 2923 | } 2924 | .hover\:focus\:text-center:focus:hover { 2925 | text-align: center; 2926 | } 2927 | .focus\:hover\:text-center:hover:focus { 2928 | text-align: center; 2929 | } 2930 | .dark .dark\:border-\[\#bebebe\] { 2931 | --tw-border-opacity: 1; 2932 | border-color: rgb(190 190 190 / var(--tw-border-opacity)); 2933 | } 2934 | .dark .dark\:bg-\[\#E4810D\] { 2935 | --tw-bg-opacity: 1; 2936 | background-color: rgb(228 129 13 / var(--tw-bg-opacity)); 2937 | } 2938 | .dark .dark\:bg-amber-500 { 2939 | --tw-bg-opacity: 1; 2940 | background-color: rgb(245 158 11 / var(--tw-bg-opacity)); 2941 | } 2942 | .dark .dark\:bg-\[\#EBEDF3\] { 2943 | --tw-bg-opacity: 1; 2944 | background-color: rgb(235 237 243 / var(--tw-bg-opacity)); 2945 | } 2946 | .dark .dark\:bg-\[\#FEFEFE\] { 2947 | --tw-bg-opacity: 1; 2948 | background-color: rgb(254 254 254 / var(--tw-bg-opacity)); 2949 | } 2950 | .dark .dark\:bg-\[\#d9dada\] { 2951 | --tw-bg-opacity: 1; 2952 | background-color: rgb(217 218 218 / var(--tw-bg-opacity)); 2953 | } 2954 | .dark .dark\:bg-\[\#FFFFFF\] { 2955 | --tw-bg-opacity: 1; 2956 | background-color: rgb(255 255 255 / var(--tw-bg-opacity)); 2957 | } 2958 | .dark .dark\:bg-\[\#dddee0\] { 2959 | --tw-bg-opacity: 1; 2960 | background-color: rgb(221 222 224 / var(--tw-bg-opacity)); 2961 | } 2962 | .dark .dark\:bg-\[\#FEFEFF\] { 2963 | --tw-bg-opacity: 1; 2964 | background-color: rgb(254 254 255 / var(--tw-bg-opacity)); 2965 | } 2966 | .dark .dark\:bg-\[\#ee8505\] { 2967 | --tw-bg-opacity: 1; 2968 | background-color: rgb(238 133 5 / var(--tw-bg-opacity)); 2969 | } 2970 | .dark .dark\:fill-\[\#585959\] { 2971 | fill: #585959; 2972 | } 2973 | .dark .dark\:fill-\[\#353636\] { 2974 | fill: #353636; 2975 | } 2976 | .dark .dark\:stroke-\[\#585959\] { 2977 | stroke: #585959; 2978 | } 2979 | .dark .dark\:text-\[\#fff\] { 2980 | --tw-text-opacity: 1; 2981 | color: rgb(255 255 255 / var(--tw-text-opacity)); 2982 | } 2983 | .dark .dark\:text-\[\#65676A\] { 2984 | --tw-text-opacity: 1; 2985 | color: rgb(101 103 106 / var(--tw-text-opacity)); 2986 | } 2987 | .dark .dark\:text-\[\#333436\] { 2988 | --tw-text-opacity: 1; 2989 | color: rgb(51 52 54 / var(--tw-text-opacity)); 2990 | } 2991 | .dark .dark\:text-\[\#636567\] { 2992 | --tw-text-opacity: 1; 2993 | color: rgb(99 101 103 / var(--tw-text-opacity)); 2994 | } 2995 | .dark .dark\:ring-\[\#efefef\] { 2996 | --tw-ring-opacity: 1; 2997 | --tw-ring-color: rgb(239 239 239 / var(--tw-ring-opacity)); 2998 | } 2999 | @media (min-width: 640px) { 3000 | 3001 | .sm\:container { 3002 | width: 100%; 3003 | margin-right: auto; 3004 | margin-left: auto; 3005 | } 3006 | 3007 | @media (min-width: 640px) { 3008 | 3009 | .sm\:container { 3010 | max-width: 640px; 3011 | } 3012 | } 3013 | 3014 | @media (min-width: 768px) { 3015 | 3016 | .sm\:container { 3017 | max-width: 768px; 3018 | } 3019 | } 3020 | 3021 | @media (min-width: 1024px) { 3022 | 3023 | .sm\:container { 3024 | max-width: 1024px; 3025 | } 3026 | } 3027 | 3028 | @media (min-width: 1280px) { 3029 | 3030 | .sm\:container { 3031 | max-width: 1280px; 3032 | } 3033 | } 3034 | 3035 | @media (min-width: 1536px) { 3036 | 3037 | .sm\:container { 3038 | max-width: 1536px; 3039 | } 3040 | } 3041 | 3042 | .sm\:underline { 3043 | -webkit-text-decoration-line: underline; 3044 | text-decoration-line: underline; 3045 | } 3046 | } 3047 | @media (min-width: 768px) { 3048 | 3049 | .md\:top-\[8\%\] { 3050 | top: 8%; 3051 | } 3052 | 3053 | .md\:right-6 { 3054 | right: 1.5rem; 3055 | } 3056 | 3057 | .md\:-bottom-9 { 3058 | bottom: -2.25rem; 3059 | } 3060 | 3061 | .md\:left-7 { 3062 | left: 1.75rem; 3063 | } 3064 | 3065 | .md\:-order-2 { 3066 | order: -2; 3067 | } 3068 | 3069 | .md\:-order-5 { 3070 | order: -5; 3071 | } 3072 | 3073 | .md\:-order-4 { 3074 | order: -4; 3075 | } 3076 | 3077 | .md\:-order-3 { 3078 | order: -3; 3079 | } 3080 | 3081 | .md\:-order-1 { 3082 | order: -1; 3083 | } 3084 | 3085 | .md\:m-0 { 3086 | margin: 0px; 3087 | } 3088 | 3089 | .md\:mx-auto { 3090 | margin-left: auto; 3091 | margin-right: auto; 3092 | } 3093 | 3094 | .md\:my-4 { 3095 | margin-top: 1rem; 3096 | margin-bottom: 1rem; 3097 | } 3098 | 3099 | .md\:mt-2 { 3100 | margin-top: 0.5rem; 3101 | } 3102 | 3103 | .md\:mb-0 { 3104 | margin-bottom: 0px; 3105 | } 3106 | 3107 | .md\:mt-3 { 3108 | margin-top: 0.75rem; 3109 | } 3110 | 3111 | .md\:mb-8 { 3112 | margin-bottom: 2rem; 3113 | } 3114 | 3115 | .md\:\!mb-10 { 3116 | margin-bottom: 2.5rem !important; 3117 | } 3118 | 3119 | .md\:mb-6 { 3120 | margin-bottom: 1.5rem; 3121 | } 3122 | 3123 | .md\:mb-4 { 3124 | margin-bottom: 1rem; 3125 | } 3126 | 3127 | .md\:block { 3128 | display: block; 3129 | } 3130 | 3131 | .md\:flex { 3132 | display: flex; 3133 | } 3134 | 3135 | .md\:grid { 3136 | display: grid; 3137 | } 3138 | 3139 | .md\:hidden { 3140 | display: none; 3141 | } 3142 | 3143 | .md\:h-\[45px\] { 3144 | height: 45px; 3145 | } 3146 | 3147 | .md\:h-\[400px\] { 3148 | height: 400px; 3149 | } 3150 | 3151 | .md\:h-\[190px\] { 3152 | height: 190px; 3153 | } 3154 | 3155 | .md\:w-\[500px\] { 3156 | width: 500px; 3157 | } 3158 | 3159 | .md\:w-\[175px\] { 3160 | width: 175px; 3161 | } 3162 | 3163 | .md\:w-\[95\%\] { 3164 | width: 95%; 3165 | } 3166 | 3167 | .md\:w-full { 3168 | width: 100%; 3169 | } 3170 | 3171 | .md\:max-w-\[768px\] { 3172 | max-width: 768px; 3173 | } 3174 | 3175 | .md\:grid-cols-2 { 3176 | grid-template-columns: repeat(2, minmax(0, 1fr)); 3177 | } 3178 | 3179 | .md\:grid-cols-4 { 3180 | grid-template-columns: repeat(4, minmax(0, 1fr)); 3181 | } 3182 | 3183 | .md\:gap-0 { 3184 | gap: 0px; 3185 | } 3186 | 3187 | .md\:gap-5 { 3188 | gap: 1.25rem; 3189 | } 3190 | 3191 | .md\:gap-y-5 { 3192 | row-gap: 1.25rem; 3193 | } 3194 | 3195 | .md\:gap-y-2 { 3196 | row-gap: 0.5rem; 3197 | } 3198 | 3199 | .md\:gap-x-0 { 3200 | -moz-column-gap: 0px; 3201 | column-gap: 0px; 3202 | } 3203 | 3204 | .md\:gap-x-4 { 3205 | -moz-column-gap: 1rem; 3206 | column-gap: 1rem; 3207 | } 3208 | 3209 | .md\:overflow-hidden { 3210 | overflow: hidden; 3211 | } 3212 | 3213 | .md\:object-cover { 3214 | -o-object-fit: cover; 3215 | object-fit: cover; 3216 | } 3217 | 3218 | .md\:p-0 { 3219 | padding: 0px; 3220 | } 3221 | 3222 | .md\:px-2 { 3223 | padding-left: 0.5rem; 3224 | padding-right: 0.5rem; 3225 | } 3226 | 3227 | .md\:pb-4 { 3228 | padding-bottom: 1rem; 3229 | } 3230 | 3231 | .md\:text-lg { 3232 | font-size: 1.125rem; 3233 | line-height: 1.75rem; 3234 | } 3235 | 3236 | .md\:text-sm { 3237 | font-size: 0.875rem; 3238 | line-height: 1.25rem; 3239 | } 3240 | 3241 | .md\:font-bold { 3242 | font-weight: 700; 3243 | } 3244 | } 3245 | @media (min-width: 1024px) { 3246 | 3247 | .lg\:right-\[180px\] { 3248 | right: 180px; 3249 | } 3250 | 3251 | .lg\:top-\[70px\] { 3252 | top: 70px; 3253 | } 3254 | 3255 | .lg\:mt-0 { 3256 | margin-top: 0px; 3257 | } 3258 | 3259 | .lg\:mb-4 { 3260 | margin-bottom: 1rem; 3261 | } 3262 | 3263 | .lg\:block { 3264 | display: block; 3265 | } 3266 | 3267 | .lg\:flex { 3268 | display: flex; 3269 | } 3270 | 3271 | .lg\:hidden { 3272 | display: none; 3273 | } 3274 | 3275 | .lg\:h-\[450px\] { 3276 | height: 450px; 3277 | } 3278 | 3279 | .lg\:h-48 { 3280 | height: 12rem; 3281 | } 3282 | 3283 | .lg\:w-3\/5 { 3284 | width: 60%; 3285 | } 3286 | 3287 | .lg\:w-2\/5 { 3288 | width: 40%; 3289 | } 3290 | 3291 | .lg\:w-48 { 3292 | width: 12rem; 3293 | } 3294 | 3295 | .lg\:w-\[200px\] { 3296 | width: 200px; 3297 | } 3298 | 3299 | .lg\:max-w-full { 3300 | max-width: 100%; 3301 | } 3302 | 3303 | .lg\:grid-cols-3 { 3304 | grid-template-columns: repeat(3, minmax(0, 1fr)); 3305 | } 3306 | 3307 | .lg\:grid-cols-5 { 3308 | grid-template-columns: repeat(5, minmax(0, 1fr)); 3309 | } 3310 | 3311 | .lg\:grid-cols-4 { 3312 | grid-template-columns: repeat(4, minmax(0, 1fr)); 3313 | } 3314 | 3315 | .lg\:gap-x-5 { 3316 | -moz-column-gap: 1.25rem; 3317 | column-gap: 1.25rem; 3318 | } 3319 | 3320 | .lg\:pr-2 { 3321 | padding-right: 0.5rem; 3322 | } 3323 | 3324 | .lg\:pl-5 { 3325 | padding-left: 1.25rem; 3326 | } 3327 | 3328 | .lg\:text-xl { 3329 | font-size: 1.25rem; 3330 | line-height: 1.75rem; 3331 | } 3332 | 3333 | .dark .dark\:lg\:hover\:\[paint-order\:markers\]:hover { 3334 | paint-order: markers; 3335 | } 3336 | } 3337 | @media (min-width: 1280px) { 3338 | 3339 | .xl\:right-\[210px\] { 3340 | right: 210px; 3341 | } 3342 | 3343 | .xl\:top-\[100px\] { 3344 | top: 100px; 3345 | } 3346 | 3347 | .xl\:\!flex { 3348 | display: flex !important; 3349 | } 3350 | 3351 | .xl\:flex { 3352 | display: flex; 3353 | } 3354 | 3355 | .xl\:h-\[550px\] { 3356 | height: 550px; 3357 | } 3358 | 3359 | .xl\:w-\[400px\] { 3360 | width: 400px; 3361 | } 3362 | 3363 | .xl\:w-\[60\%\] { 3364 | width: 60%; 3365 | } 3366 | 3367 | .xl\:w-\[40\%\] { 3368 | width: 40%; 3369 | } 3370 | 3371 | .xl\:grid-cols-6 { 3372 | grid-template-columns: repeat(6, minmax(0, 1fr)); 3373 | } 3374 | 3375 | .xl\:grid-cols-4 { 3376 | grid-template-columns: repeat(4, minmax(0, 1fr)); 3377 | } 3378 | 3379 | .xl\:grid-cols-5 { 3380 | grid-template-columns: repeat(5, minmax(0, 1fr)); 3381 | } 3382 | 3383 | .xl\:p-5 { 3384 | padding: 1.25rem; 3385 | } 3386 | 3387 | .xl\:text-\[45px\] { 3388 | font-size: 45px; 3389 | } 3390 | } 3391 | @media (min-width: 1536px) { 3392 | 3393 | .\32xl\:right-\[270px\] { 3394 | right: 270px; 3395 | } 3396 | 3397 | .\32xl\:\!flex { 3398 | display: flex !important; 3399 | } 3400 | 3401 | .\32xl\:flex { 3402 | display: flex; 3403 | } 3404 | 3405 | .\32xl\:w-1\/2 { 3406 | width: 50%; 3407 | } 3408 | 3409 | .\32xl\:w-2\/5 { 3410 | width: 40%; 3411 | } 3412 | 3413 | .\32xl\:w-3\/5 { 3414 | width: 60%; 3415 | } 3416 | 3417 | .\32xl\:grid-cols-7 { 3418 | grid-template-columns: repeat(7, minmax(0, 1fr)); 3419 | } 3420 | 3421 | .\32xl\:grid-cols-6 { 3422 | grid-template-columns: repeat(6, minmax(0, 1fr)); 3423 | } 3424 | 3425 | .\32xl\:gap-x-7 { 3426 | -moz-column-gap: 1.75rem; 3427 | column-gap: 1.75rem; 3428 | } 3429 | 3430 | .\32xl\:pl-20 { 3431 | padding-left: 5rem; 3432 | } 3433 | 3434 | .\32xl\:text-\[56px\] { 3435 | font-size: 56px; 3436 | } 3437 | } --------------------------------------------------------------------------------