[
  {
    "path": ".vscode/settings.json",
    "content": "{\n    \"workbench.colorCustomizations\": {\n        \"activityBar.background\": \"#511B26\",\n        \"titleBar.activeBackground\": \"#712635\",\n        \"titleBar.activeForeground\": \"#FEFBFC\"\n    }\n}"
  },
  {
    "path": "CHANGELOG.md",
    "content": "# Changelog\nAll notable changes to `Material Dashboard Laravel` frontend preset for Laravel will be documented in this file.\n\n## Version 1.0.0\n\n### Added\n- Material Dashboard v1.0.0 frontend theme\n- Laravel Auth preset\n- Change user profile\n- User CRUD\n\n## Version 1.0.0 - Version 1.0.4\n- Bugfixes\n\n## Version 1.0.5\n- Add link to pro theme\n\n## Version 1.0.6 - 2019-09-23\n- Update to Laravel 6.x\n\n## Version 1.1.0 - 2020-03-18\n- Update to Laravel 7.x\n\n## Version 1.0.8 - 2020-09-21\n- Update to Laravel 8.x\n\n## Version 1.0.9 - 2022-03-25\n- Update to Laravel 9.x\n\n## Version 2.0.0 - 2022-09-27\n  - Update to Material Design 2\n  - Update Bootstrap to v5.1.3\n  - Add new example pages\n  - Add Light/Dark feature\n  - New Documentation version\n\n"
  },
  {
    "path": "ISSUE_TEMPLATE.md",
    "content": "# Prerequisites\n\nPlease answer the following questions for yourself before submitting an issue.\n\n- [ ] I am running the latest version\n- [ ] I checked the documentation and found no answer\n- [ ] I checked to make sure that this issue has not already been filed\n- [ ] I'm reporting the issue to the correct repository (for multi-repository projects)\n\n# Expected Behavior\n\nPlease describe the behavior you are expecting\n\n# Current Behavior\n\nWhat is the current behavior?\n\n# Failure Information (for bugs)\n\nPlease help provide information about the failure if this is a bug. If it is not a bug, please remove the rest of this template.\n\n## Steps to Reproduce\n\nPlease provide detailed steps for reproducing the issue.\n\n1. step 1\n2. step 2\n3. you get it...\n\n## Context\n\nPlease provide any relevant information about your setup. This is important in case the issue is not reproducible except for under certain conditions.\n\n* Device:\n* Operating System:\n* Browser and Version:\n\n## Failure Logs\n\nPlease include any relevant log snippets or files here.\n"
  },
  {
    "path": "README.md",
    "content": "# [Material Dashboard 2 Laravel - Free](https://material-dashboard-laravel.creative-tim.com)\n\n![version](https://img.shields.io/badge/version-3.0.0-blue.svg) \n![license](https://img.shields.io/badge/license-MIT-blue.svg)\n[![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/material-dashboard-laravel.svg)](https://github.com/creativetimofficial/material-dashboard-laravel/issues?q=is%3Aopen+is%3Aissue) \n[![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/material-dashboard-laravel.svg)](https://github.com/creativetimofficial/material-dashboard-laravel/issues?q=is%3Aissue+is%3Aclosed)\n\n*Frontend version*: Material Dashboard v3.0.0. More info at https://www.creative-tim.com/product/material-dashboard\n[ <img src=\"https://s3.amazonaws.com/creativetim_bucket/products/154/original/material-dashboard-laravel.jpg\" width=\"100%\" />](https://material-dashboard-laravel.creative-tim.com)\n\nSpeed up your web development with the Bootstrap 5 Admin Dashboard built for Laravel Framework 9.x and up.\n\nIf you want to get more features, go PRO with [Material Dashboard 2 PRO Laravel](https://www.creative-tim.com/product/material-dashboard-pro-laravel).\n\n## Table of Contents\n* [Prerequisites](#prerequisites)\n* [Installation](#installation)\n* [Usage](#usage)\n* [Versions](#versions)\n* [Demo](#demo)\n* [Documentation](#documentation)\n* [Login](#login)\n* [Register](#register)\n* [Forgot Password](#forgot-password)\n* [Reset Password](#reset-password)\n* [User Profile](#user-profile)\n* [Dashboard](#dashboard)\n* [File Structure](#file-structure)\n* [Browser Support](#browser-support)\n* [Reporting Issues](#reporting-issues)\n* [Licensing](#licensing)\n* [Useful Links](#useful-links)\n* [Social Media](#social-media)\n* [Credits](#credits)\n\n## Prerequisites\n\nIf you don't already have an Apache local environment with PHP and MySQL, use one of the following links:\n\n - Windows: https://updivision.com/blog/post/beginner-s-guide-to-setting-up-your-local-development-environment-on-windows\n - Linux & Mac: https://updivision.com/blog/post/guide-what-is-lamp-and-how-to-install-it-on-ubuntu-and-macos\n\nAlso, you will need to install Composer: https://getcomposer.org/doc/00-intro.md  \nAnd Laravel: https://laravel.com/docs/10.x\n\n\n## Installation\n\nAfter initializing a fresh instance of Laravel (and making all the necessary configurations), install the preset using one of the provided methods:\n\n### Via composer\n\n1. `Cd` to your Laravel app  \n2. Type in your terminal: `composer require laravel/ui`\n3. Install this preset via `composer require laravel-frontend-presets/material-dashboard`. No need to register the service provider. Laravel 9.x & up can auto detect the package.\n4. Run `php artisan ui material` command to install the Material preset. This will install all the necessary assets and also the custom auth views, it will also add the auth route in `routes/web.php`\n(NOTE: If you run this command several times, be sure to clean up the duplicate Auth entries in routes/web.php)\n5. In your terminal run `composer dump-autoload`\n6. Run `php artisan migrate:fresh --seed` to create basic users table\n\n### By using the archive\n\n1. In your application's root create a **presets** folder\n2. Download the archive of the repo and unzip it\n3. Copy and paste the downloaded folder in presets (created in step 2) and rename it to **material**\n4. Open `composer.json` file \n5. Add `\"LaravelFrontendPresets\\\\MaterialPreset\\\\\": \"presets/material/src\"` to `autoload/psr-4` and to `autoload-dev/psr-4`\n6. Add `LaravelFrontendPresets\\MaterialPreset\\MaterialPresetServiceProvider::class` to `config/app.php` file\n7. Type in your terminal: `composer require laravel/ui`\n8. In your terminal run `composer dump-autoload`\n9. Run `php artisan ui material` command to install the Argon preset. This will install all the necessary assets and also the custom auth views, it will also add the auth route in `routes/web.php`\n(NOTE: If you run this command several times, be sure to clean up the duplicate Auth entries in routes/web.php)\n10. Add in your **.env** file the info for your database\n11. Run `php artisan migrate:fresh --seed` to create basic users table\n\n\n## Usage\nRegister a user or login with default user **admin@material.com** and password **secret** from your database and start testing (make sure to run the migrations and seeders for these credentials to be available).\n\nBesides the dashboard, the auth pages, the billing and table pages, there is also has an edit profile page. All the necessary files are installed out of the box and all the needed routes are added to `routes/web.php`. Keep in mind that all of the features can be viewed once you login using the credentials provided or by registering your own user. \n\n\n## Versions\n[<img src=\"https://github.com/creativetimofficial/public-assets/blob/master/logos/html-logo.jpg?raw=true\" width=\"60\" height=\"60\" />](https://demos.creative-tim.com/material-dashboard/examples/dashboard.html)\n[<img src=\"https://github.com/creativetimofficial/public-assets/blob/master/logos/laravel_logo.png?raw=true\" width=\"60\" height=\"60\" />](https://material-dashboard-laravel.creative-tim.com/)\n\n| HTML | Laravel |\n| --- | --- |\n| [![HTML](https://s3.amazonaws.com/creativetim_bucket/products/50/thumb/material-dashboard.jpg?raw=true)](https://www.creative-tim.com/product/material-dashboard) | [![Laravel](https://s3.amazonaws.com/creativetim_bucket/products/154/thumb/material-dashboard-laravel.jpg?raw=true)](https://www.creative-tim.com/product/material-dashboard-laravel)  |\n\n| Vue | React |\n| --- | --- |\n| [![Vue](https://s3.amazonaws.com/creativetim_bucket/products/596/thumb/vue-material-dashboard-2.jpg?raw=true)](https://www.creative-tim.com/product/vue-material-dashboard-2) | [![React](https://s3.amazonaws.com/creativetim_bucket/products/71/thumb/material-dashboard-react.jpg?raw=true)](https://www.creative-tim.com/product/material-dashboard-react)  | \n\n\n## Demo\n| Register | Login | Dashboard |\n| --- | --- | ---  |\n| [<img src=\"src/material-stubs/screens/register.png\" width=\"322\" />](https://material-dashboard-laravel.creative-tim.com/sign-up) | [<img src=\"src/material-stubs/screens/login.png\" width=\"322\" />](https://material-dashboard-laravel.creative-tim.com/sign-in)  | [<img src=\"src/material-stubs/screens/dashboard.png\" width=\"322\" />](https://material-dashboard-laravel.creative-tim.com/dashboard)\n\n| Forgot Password Page | Reset Password Page | Profile Page  |\n| --- | --- | ---  |\n| [<img src=\"src/material-stubs/screens/forgot-password.png\" width=\"322\" />](https://material-dashboard-laravel.creative-tim.com/verify)  | [<img src=\"src/material-stubs/screens/reset-password.png\" width=\"322\" />](https://material-dashboard-laravel.creative-tim.com/sign-in) | [<img src=\"src/material-stubs/screens/profile.png\" width=\"322\" />](https://material-dashboard-laravel.creative-tim.com/user-profile)\n[View More](https://material-dashboard-laravel.creative-tim.com/dashboard)\n\n## Documentation\nThe documentation for the Material Dashboard Laravel is hosted at our [website](https://material-dashboard-laravel.creative-tim.com/documentation/getting-started/installation.html).\n\n### Login\nIf you are not logged in you can only access this page or the Sign Up page. The default url takes you to the login page where you use the default credentials **admin@material.com** with the password **secret**. Logging in is possible only with already existing credentials. For this to work you should have run the migrations. \n\nThe `App/Http/Controllers/SessionsController.php` handles the logging in of an existing user.\n\n```\n       public function store()\n    {\n        $attributes = request()->validate([\n            'email' => 'required|email',\n            'password' => 'required'\n        ]);\n\n        if (! auth()->attempt($attributes)) {\n            throw ValidationException::withMessages([\n                'email' => 'Your provided credentials could not be verified.'\n            ]);\n        }\n\n        session()->regenerate();\n\n        return redirect('/dashboard');\n\n    }\n```\n\n### Register\nYou can register as a user by filling in the name, email and password for your account. You can do this by accessing the sign up page from the \"**Sign Up**\" button in the top navbar or by clicking the \"**Sign Up**\" button from the bottom of the log in form.. Another simple way is adding **/sign-up** in the url.\n\nThe `App/Http/Controllers/RegisterController.php` handles the registration of a new user.\n\n```\n   public function store(){\n\n        $attributes = request()->validate([\n            'name' => 'required|max:255|unique:users,name',\n            'email' => 'required|email|max:255|unique:users,email',\n            'password' => 'required|min:5|max:255',\n        ]);\n\n        $user = User::create($attributes);\n        auth()->login($user);\n        \n        return redirect('/dashboard');\n    } \n```\n\n### Forgot Password\nIf a user forgets the account's password it is possible to reset the password. For this the user should click on the \"**here**\" under the login form.\n\nThe `App/Http/Controllers/SessionsController.php ` takes care of sending an email to the user where he can reset the password afterwards.\n\n```\n       public function show(){\n\n        request()->validate([\n            'email' => 'required|email',\n        ]);\n\n        $status = Password::sendResetLink(\n            request()->only('email')\n        );\n    \n        return $status === Password::RESET_LINK_SENT\n                    ? back()->with(['status' => __($status)])\n                    : back()->withErrors(['email' => __($status)]);\n    }\n```\n\n### Reset Password\nThe user who forgot the password gets an email on the account's email address. The user can access the reset password page by clicking the button found in the email. The link for resetting the password is available for 12 hours. The user must add the email, the password and confirm the password for his password to be updated.\n\nThe `App/Http/Controllers/SessionsController.php` helps the user reset the password.\n\n```\n     public function update(){\n        \n        request()->validate([\n            'token' => 'required',\n            'email' => 'required|email',\n            'password' => 'required|min:8|confirmed',\n        ]); \n          \n        $status = Password::reset(\n            request()->only('email', 'password', 'password_confirmation', 'token'),\n            function ($user, $password) {\n                $user->forceFill([\n                    'password' => ($password)\n                ])->setRememberToken(Str::random(60));\n    \n                $user->save();\n    \n                event(new PasswordReset($user));\n            }\n        );\n    \n        return $status === Password::PASSWORD_RESET\n                    ? redirect()->route('login')->with('status', __($status))\n                    : back()->withErrors(['email' => [__($status)]]);\n    }\n```\n\n### User Profile\nThe profile can be accessed by a logged in user by clicking \"**User Profile**\" from the sidebar or adding **/user-profile** in the url. The user can add information like phone number, location, description or change the name and email.\n\nThe `App/Http/Controllers/ProfileController.php ` handles the user's profile information.\n\n```\n    public function update()\n    {\n            \n        $user = request()->user();\n        $attributes = request()->validate([\n            'email' => 'required|email|unique:users,email,'.$user->id,\n            'name' => 'required',\n            'phone' => 'required|max:10',\n            'about' => 'required:max:150',\n            'location' => 'required'\n        ]);\n        auth()->user()->update($attributes);\n        return back()->withStatus('Profile successfully updated.');\n    \n}\n```\n\n### Dashboard\nYou can access the dashboard either by using the \"**Dashboard**\" link in the left sidebar or by adding **/dashboard** in the url after logging in. \n\n## File Structure\n```\n+---app\n|   +---Console\n|   |       Kernel.php\n|   +---Exceptions\n|   |       Handler.php\n|   +---Http\n|   |   +---Controllers\n|   |   |       Controller.php\n|   |   |       DashboardController.php\n|   |   |       ProfileController.php\n|   |   |       SessionsController.php\n|   |   |       RegisterController.php\n|   |   |       \n|   |   +---Middleware\n|   |   |       Authenticate.php\n|   |   |       EncryptCookies.php\n|   |   |       PreventRequestsDuringMaintenance.php\n|   |   |       RedirectIfAuthenticated.php\n|   |   |       TrimStrings.php\n|   |   |       TrustHosts.php\n|   |   |       TrustProxies.php\n|   |   |       VerifyCsrfToken.php\n|   |   |\n|   |    \\---Kernel.php   \n|   |   \n|   +---Models\n|   |        User.php\n|   |     \n|   \\---Proviers\n|          AppServiceProvider.php\n|          AuthServiceProvider.php\n|          BroadcastServiceProvider.php\n|          EventServiceProvider.php\n|          RouteServiceProvider.php\n|   \n+---database\n|   \\---seeders\n|           DatabaseSeeder.php\n|\n\\---resources\n    |\n    |\n    \\---views\n        |   welcome.blade.php\n        |   \n        +---sessions\n        |   |   create.blade.php\n        |   |   \n        |   \\---passwords\n        |           reset.blade.php\n        |           verify.blade.php\n        |           \n        +---components\n        |   |   layout.blade.php\n        |   |   plugins.blade.php\n        |   |   \n        |   +---footers\n        |   |       auth.blade.php\n        |   |       guest.blade.php\n        |   |       \n        |   \\---navbars\n        |      |   sidebar.blade.php\n        |      |   \n        |      \\---navs\n        |             auth.blade.php\n        |             guest.blade.php\n        |              \n        |           \n        +---pages\n        |   |   billing.blade.php\n        |   |   notifications.blade.php\n        |   |   profile.blade.php\n        |   |   rtl.blade.php\n        |   |   static-sign-in.blade.php\n        |   |   static-sign-up.blade.php\n        |   |   tables.blade.php\n        |   |   virtual-reality.blade.php\n        |   |  \n        |   \\---laravel-examples\n        |           user-management.blade.php\n        |           user-profile.blade.php\n        |       \n        +---dashboard\n        |       index.blade.php\n        | \n        +---errors\n        |       401.blade.php\n        |       403.blade.php\n        |       404.blade.php\n        |       405.blade.php\n        |       419.blade.php\n        |       429.blade.php\n        |       500.blade.php\n        |       503.blade.php\n        |\n        \\---register\n                create.blade.php\n```\n\n## Browser Support\nAt present, we officially aim to support the last two versions of the following browsers:\n\n<img src=\"https://s3.amazonaws.com/creativetim_bucket/github/browser/chrome.png\" width=\"64\" height=\"64\"> <img src=\"https://s3.amazonaws.com/creativetim_bucket/github/browser/firefox.png\" width=\"64\" height=\"64\"> <img src=\"https://s3.amazonaws.com/creativetim_bucket/github/browser/edge.png\" width=\"64\" height=\"64\"> <img src=\"https://s3.amazonaws.com/creativetim_bucket/github/browser/safari.png\" width=\"64\" height=\"64\"> <img src=\"https://s3.amazonaws.com/creativetim_bucket/github/browser/opera.png\" width=\"64\" height=\"64\">\n\n\n## Reporting Issues\nWe use GitHub Issues as the official bug tracker for the Material Dashboard. Here are some advices for our users that want to report an issue:\n\n1. Make sure that you are using the latest version of the Material Dashboard. Check the CHANGELOG from your dashboard on our [website](https://www.creative-tim.com/product/material-dashboard-laravel).\n2. Providing us reproducible steps for the issue will shorten the time it takes for it to be fixed.\n3. Some issues may be browser specific, so specifying in what browser you encountered the issue might help.\n\n\n## Licensing\n- Copyright 2022 [Creative Tim](https://www.creative-tim.com?ref=readme-md2l)\n- Creative Tim [license](https://www.creative-tim.com/license?ref=readme-md2l)\n\n## Useful Links\n- [Tutorials](https://www.youtube.com/channel/UCVyTG4sCw-rOvB9oHkzZD1w)\n- [Affiliate Program](https://www.creative-tim.com/affiliates/new) (earn money)\n- [Blog Creative Tim](http://blog.creative-tim.com/)\n- [Free Products](https://www.creative-tim.com/bootstrap-themes/free) from Creative Tim\n- [Premium Products](https://www.creative-tim.com/bootstrap-themes/premium?ref=md2l-readme) from Creative Tim\n- [React Products](https://www.creative-tim.com/bootstrap-themes/react-themes?ref=md2l-readme) from Creative Tim\n- [VueJS Products](https://www.creative-tim.com/bootstrap-themes/vuejs-themes?ref=md2l-readme) from Creative Tim\n- [More products](https://www.creative-tim.com/bootstrap-themes?ref=md2l-readme) from Creative Tim\n- Check our Bundles [here](https://www.creative-tim.com/bundles??ref=md2l-readme)\n\n### Social Media\n\n### Creative Tim\nTwitter: <https://twitter.com/CreativeTim?ref=md2l-readme>\n\nFacebook: <https://www.facebook.com/CreativeTim?ref=md2l-readme>\n\nDribbble: <https://dribbble.com/creativetim?ref=md2l-readme>\n\nInstagram: <https://www.instagram.com/CreativeTimOfficial?ref=md2l-readme>\n\n### Updivision:\n\nTwitter: <https://twitter.com/updivision?ref=md2l-readme>\n\nFacebook: <https://www.facebook.com/updivision?ref=md2l-readme>\n\nLinkedin: <https://www.linkedin.com/company/updivision?ref=md2l-readme>\n\nUpdivision Blog: <https://updivision.com/blog/?ref=md2l-readme>\n\n## Credits\n\n- [Creative Tim](https://creative-tim.com/?ref=md2l-readme)\n- [UPDIVISION](https://updivision.com)\n\n\n"
  },
  {
    "path": "changelog.md",
    "content": "# Changelog\nAll notable changes to `Material Dashboard Laravel` frontend preset for Laravel will be documented in this file.\n\n## Version 1.0.0\n\n### Added\n- Material Dashboard v1.0.0 frontend theme\n- Laravel Auth preset\n- Change user profile\n- User CRUD\n\n## Version 1.0.0 - Version 1.0.4\n- Bugfixes\n\n## Version 1.0.5\n- Add link to pro theme\n\n## Version 1.0.6 - 2019-09-23\n- Update to Laravel 6.x\n\n## Version 1.1.0 - 2020-03-18\n- Update to Laravel 7.x\n\n## Version 1.0.8 - 2020-09-21\n- Update to Laravel 8.x\n\n## Version 1.0.9 - 2022-03-25\n- Update to Laravel 9.x\n\n## Version 2.0.0 - 2022-09-27\n  - Update to Material Design 2\n  - Update Bootstrap to v5.1.3\n  - Add new example pages\n  - Add Light/Dark feature\n  - New Documentation version\n"
  },
  {
    "path": "composer.json",
    "content": "{\n    \"name\": \"laravel-frontend-presets/material\",\n    \"description\": \"Laravel 10.x Front-end preset for material\",\n    \"license\": \"MIT\",\n    \"homepage\": \"https://github.com/creativetimofficial/material-dashboard-laravel\",\n    \"keywords\": [\"Laravel\", \"Preset\", \"Material\"],\n    \"require\": {\n        \"laravel/framework\": \"^10.0\",\n        \"laravel/legacy-factories\": \"^1.0\"\n    },\n    \"autoload\": {\n        \"psr-4\": {\n            \"LaravelFrontendPresets\\\\MaterialPreset\\\\\": \"src/\"\n        }\n    },\n    \"extra\": {\n        \"laravel\": {\n            \"providers\": [\n                \"LaravelFrontendPresets\\\\MaterialPreset\\\\MaterialPresetServiceProvider\"\n            ]\n        }\n    }\n}\n"
  },
  {
    "path": "license.md",
    "content": "MIT License\n\nCopyright (c) 2022 Creative Tim (https://www.creative-tim.com)\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
  },
  {
    "path": "src/MaterialPreset.php",
    "content": "<?php\n\nnamespace LaravelFrontendPresets\\MaterialPreset;\n\nuse Illuminate\\Filesystem\\Filesystem;\nuse Laravel\\Ui\\Presets\\Preset;\n\nclass MaterialPreset extends Preset\n{\n    const STUBSPATH = __DIR__.'/material-stubs/';\n\n    /**\n     * Install the preset.\n     *\n     * @return void\n     */\n    public static function install()\n    {\n        static::updateAssets();\n        static::updateWelcomePage();\n        static::updateAuthViews();\n        static::addComponents();\n        static::addPages();\n    }\n\n    /**\n     * Delete a resource\n     *\n     * @param string $resource\n     * @return void\n     */\n    private static function deleteResource($resource)\n    {\n        (new Filesystem)->delete(resource_path($resource));\n    }\n\n    /**\n     * Copy a file\n     *\n     * @param string $file\n     * @param string $destination\n     * @return void\n     */\n    private static function copyFile($file, $destination)\n    {\n        (new Filesystem)->copy(static::STUBSPATH.$file, $destination);\n    }\n\n    /**\n     * Copy a directory\n     *\n     * @param string $directory\n     * @param string $destination\n     * @return void\n     */\n    private static function copyDirectory($directory, $destination)\n    {\n        (new Filesystem)->copyDirectory(static::STUBSPATH.$directory, $destination);\n    }\n\n    /**\n     * Update the assets\n     *\n     * @return void\n     */\n    protected static function updateAssets()\n    {\n        // public assets\n        static::copyDirectory('resources/material', public_path());\n\n        // js, css in resources\n        static::copyDirectory('resources/assets', app_path('../resources'));\n        static::copyFile('webpack.mix.js', app_path('../webpack.mix.js'));\n    }\n\n    /**\n     * Update the default welcome page file.\n     *\n     * @return void\n     */\n    protected static function updateWelcomePage()\n    {\n        // remove default welcome page\n        static::deleteResource(('views/welcome.blade.php'));\n\n        // copy new one from your stubs folder\n        static::copyFile('resources/views/welcome.blade.php', resource_path('views/welcome.blade.php'));\n    }\n\n    /**\n     * Update the default layout files\n     *\n     * @return void\n     */\n    protected static function addComponents()\n    {\n        // copy new one from your stubs folder\n        static::copyDirectory('resources/views/components', resource_path('views/components'));\n    }\n\n    /**\n     * Copy Auth view templates.\n     *\n     * @return void\n     */\n    protected static function updateAuthViews()\n    {\n        // Add auth controllers\n        static::copyFile('app/Models/User.php', app_path('Models/User.php'));\n        static::copyFile('app/Http/Controllers/DashboardController.php', app_path('Http/Controllers/DashboardController.php'));\n        static::copyFile('app/Http/Controllers/ProfileController.php', app_path('Http/Controllers/ProfileController.php'));\n        static::copyFile('app/Http/Controllers/RegisterController.php', app_path('Http/Controllers/RegisterController.php'));\n        static::copyFile('app/Http/Controllers/SessionsController.php', app_path('Http/Controllers/SessionsController.php'));\n\n        // Add Auth routes in 'routes/web.php'\n        file_put_contents(\n            './routes/web.php',\n            \"\\nuse App\\Http\\Controllers\\DashboardController;\\nuse App\\Http\\Controllers\\ProfileController;\\nuse App\\Http\\Controllers\\RegisterController;\\nuse App\\Http\\Controllers\\SessionsController;\n            \\n\\nRoute::get('/', function () {return redirect('sign-in');})->middleware('guest');\\nRoute::get('/dashboard', [DashboardController::class, 'index'])->middleware('auth')->name('dashboard');\\nRoute::get('sign-up', [RegisterController::class, 'create'])->middleware('guest')->name('register');\\nRoute::post('sign-up', [RegisterController::class, 'store'])->middleware('guest');\\nRoute::get('sign-in', [SessionsController::class, 'create'])->middleware('guest')->name('login');\\nRoute::post('sign-in', [SessionsController::class, 'store'])->middleware('guest');\\nRoute::post('verify', [SessionsController::class, 'show'])->middleware('guest');\\nRoute::post('reset-password', [SessionsController::class, 'update'])->middleware('guest')->name('password.update');\\nRoute::get('verify', function () {\\n\\treturn view('sessions.password.verify');\\n})->middleware('guest')->name('verify'); \\nRoute::get('/reset-password/{token}', function (\".\"$\".\"token) {\\n\\treturn view('sessions.password.reset', ['token' => \".\"$\".\"token]);\\n})->middleware('guest')->name('password.reset');\",\n            FILE_APPEND\n        );\n\n        // Copy argon auth views from the stubs folder\n        static::copyDirectory('resources/views/register', resource_path('views/register'));\n        static::copyDirectory('resources/views/sessions', resource_path('views/sessions'));\n        static::copyDirectory('resources/views/dashboard', resource_path('views/dashboard'));\n    }\n\n    /**\n     * Copy user management and profile edit files\n     *\n     * @return void\n     */\n    public static function addPages()\n    {\n        // Add seeder, controllers, requests and rules\n        // migrations shoudl be deleted\n        static::copyDirectory('migrations', app_path('../database/migrations'));\n        static::copyDirectory('database/seeders', app_path('../database/seeders'));\n\n        // Add routes\n        file_put_contents(\n            './routes/web.php',\n            \"\\n\\nRoute::post('sign-out', [SessionsController::class, 'destroy'])->middleware('auth')->name('logout');\\nRoute::get('profile', [ProfileController::class, 'create'])->middleware('auth')->name('profile');\\nRoute::post('user-profile', [ProfileController::class, 'update'])->middleware('auth');\\nRoute::group(['middleware' => 'auth'], function () {\\n\\tRoute::get('billing', function () {\\n\\t\\treturn view('pages.billing');\\n\\t})->name('billing');\\n\\tRoute::get('tables', function () {\\n\\t\\treturn view('pages.tables');\\n\\t})->name('tables');\\n\\tRoute::get('rtl', function () {\\n\\t\\treturn view('pages.rtl');\\n\\t})->name('rtl');\\n\\tRoute::get('virtual-reality', function () {\\n\\t\\treturn view('pages.virtual-reality');\\n\\t})->name('virtual-reality');\\n\\tRoute::get('notifications', function () {\\n\\t\\treturn view('pages.notifications');\\n\\t})->name('notifications');\\n\\tRoute::get('static-sign-in', function () {\\n\\t\\treturn view('pages.static-sign-in');\\n\\t})->name('static-sign-in');\\n\\tRoute::get('static-sign-up', function () {\\n\\t\\treturn view('pages.static-sign-up');\\n\\t})->name('static-sign-up');\\n\\tRoute::get('user-management', function () {\\n\\t\\treturn view('pages.laravel-examples.user-management');\\n\\t})->name('user-management');\\n\\tRoute::get('user-profile', function () {\\n\\t\\treturn view('pages.laravel-examples.user-profile');\\n\\t})->name('user-profile');\\n});\",\n            FILE_APPEND\n        );\n\n        // Copy pages\n        static::copyDirectory('resources/views/pages', resource_path('views/pages'));\n    }\n}\n"
  },
  {
    "path": "src/MaterialPresetServiceProvider.php",
    "content": "<?php\n\nnamespace LaravelFrontendPresets\\MaterialPreset;\n\nuse Illuminate\\Support\\ServiceProvider;\nuse Laravel\\Ui\\UiCommand;\n\nclass MaterialPresetServiceProvider extends ServiceProvider\n{\n    /**\n     * Perform post-registration booting of services.\n     *\n     * @return void\n     */\n    public function boot()\n    {\n        UiCommand::macro('material', function ($command) {\n            MaterialPreset::install();\n            \n            $command->info('Material scaffolding installed successfully.');\n        });\n    }\n\n    /**\n     * Register any package services.\n     *\n     * @return void\n     */\n    public function register()\n    {\n        //\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Console/Kernel.php",
    "content": "<?php\n\nnamespace App\\Console;\n\nuse Illuminate\\Console\\Scheduling\\Schedule;\nuse Illuminate\\Foundation\\Console\\Kernel as ConsoleKernel;\n\nclass Kernel extends ConsoleKernel\n{\n    /**\n     * The Artisan commands provided by your application.\n     *\n     * @var array\n     */\n    protected $commands = [\n        //\n    ];\n\n    /**\n     * Define the application's command schedule.\n     *\n     * @param  \\Illuminate\\Console\\Scheduling\\Schedule  $schedule\n     * @return void\n     */\n    protected function schedule(Schedule $schedule)\n    {\n        // $schedule->command('inspire')->hourly();\n    }\n\n    /**\n     * Register the commands for the application.\n     *\n     * @return void\n     */\n    protected function commands()\n    {\n        $this->load(__DIR__.'/Commands');\n\n        require base_path('routes/console.php');\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Exceptions/Handler.php",
    "content": "<?php\n\nnamespace App\\Exceptions;\n\nuse Illuminate\\Foundation\\Exceptions\\Handler as ExceptionHandler;\nuse Throwable;\n\nclass Handler extends ExceptionHandler\n{\n    /**\n     * A list of the exception types that are not reported.\n     *\n     * @var string[]\n     */\n    protected $dontReport = [\n        //\n    ];\n\n    /**\n     * A list of the inputs that are never flashed for validation exceptions.\n     *\n     * @var string[]\n     */\n    protected $dontFlash = [\n        'current_password',\n        'password',\n        'password_confirmation',\n    ];\n\n    /**\n     * Register the exception handling callbacks for the application.\n     *\n     * @return void\n     */\n    public function register()\n    {\n        $this->reportable(function (Throwable $e) {\n            //\n        });\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Controllers/Controller.php",
    "content": "<?php\n\nnamespace App\\Http\\Controllers;\n\nuse Illuminate\\Foundation\\Auth\\Access\\AuthorizesRequests;\nuse Illuminate\\Foundation\\Bus\\DispatchesJobs;\nuse Illuminate\\Foundation\\Validation\\ValidatesRequests;\nuse Illuminate\\Routing\\Controller as BaseController;\n\nclass Controller extends BaseController\n{\n    use AuthorizesRequests, DispatchesJobs, ValidatesRequests;\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Controllers/DashboardController.php",
    "content": "<?php\n\nnamespace App\\Http\\Controllers;\n\nuse Illuminate\\Http\\Request;\n\nclass DashboardController extends Controller\n{\n    public function index()\n    {\n        return view('dashboard.index');\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Controllers/ProfileController.php",
    "content": "<?php\n\nnamespace App\\Http\\Controllers;\n\nuse Illuminate\\Http\\Request;\n\nclass ProfileController extends Controller\n{\n    public function create()\n    {\n        return view('pages.profile');\n    }\n\n    public function update()\n    {\n            \n        $user = request()->user();\n        $attributes = request()->validate([\n            'email' => 'required|email|unique:users,email,'.$user->id,\n            'name' => 'required',\n            'phone' => 'required|max:10',\n            'about' => 'required:max:150',\n            'location' => 'required'\n        ]);\n\n        auth()->user()->update($attributes);\n        return back()->withStatus('Profile successfully updated.');\n    \n}\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Controllers/RegisterController.php",
    "content": "<?php\n\nnamespace App\\Http\\Controllers;\n\nuse Illuminate\\Http\\Request;\nuse App\\Models\\User;\n\nclass RegisterController extends Controller\n{\n    public function create()\n    {\n        return view('register.create');\n    }\n\n    public function store(){\n\n        $attributes = request()->validate([\n            'name' => 'required|max:255',\n            'email' => 'required|email|max:255|unique:users,email',\n            'password' => 'required|min:5|max:255',\n        ]);\n\n        $user = User::create($attributes);\n        auth()->login($user);\n        \n        return redirect('/dashboard');\n    } \n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Controllers/SessionsController.php",
    "content": "<?php\n\nnamespace App\\Http\\Controllers;\n\nUse Str;\nUse Hash;\nuse Illuminate\\Auth\\Events\\PasswordReset;\nuse App\\Models\\User;\nuse Illuminate\\Http\\Request;\nuse Illuminate\\Validation\\ValidationException;\nuse Illuminate\\Support\\Facades\\Password;\n\nclass SessionsController extends Controller\n{\n    public function create()\n    {\n        return view('sessions.create');\n    }\n\n    public function store()\n    {\n        $attributes = request()->validate([\n            'email' => 'required|email',\n            'password' => 'required'\n        ]);\n\n        if (! auth()->attempt($attributes)) {\n            throw ValidationException::withMessages([\n                'email' => 'Your provided credentials could not be verified.'\n            ]);\n        }\n\n        session()->regenerate();\n\n        return redirect('/dashboard');\n\n    }\n\n    public function show(){\n        request()->validate([\n            'email' => 'required|email',\n        ]);\n\n        $status = Password::sendResetLink(\n            request()->only('email')\n        );\n    \n        return $status === Password::RESET_LINK_SENT\n                    ? back()->with(['status' => __($status)])\n                    : back()->withErrors(['email' => __($status)]);\n        \n    }\n\n    public function update(){\n        \n        request()->validate([\n            'token' => 'required',\n            'email' => 'required|email',\n            'password' => 'required|min:8|confirmed',\n        ]); \n          \n        $status = Password::reset(\n            request()->only('email', 'password', 'password_confirmation', 'token'),\n            function ($user, $password) {\n                $user->forceFill([\n                    'password' => ($password)\n                ])->setRememberToken(Str::random(60));\n    \n                $user->save();\n    \n                event(new PasswordReset($user));\n            }\n        );\n    \n        return $status === Password::PASSWORD_RESET\n                    ? redirect()->route('login')->with('status', __($status))\n                    : back()->withErrors(['email' => [__($status)]]);\n    }\n\n    public function destroy()\n    {\n        auth()->logout();\n\n        return redirect('/sign-in');\n    }\n\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Kernel.php",
    "content": "<?php\n\nnamespace App\\Http;\n\nuse Illuminate\\Foundation\\Http\\Kernel as HttpKernel;\n\nclass Kernel extends HttpKernel\n{\n    /**\n     * The application's global HTTP middleware stack.\n     *\n     * These middleware are run during every request to your application.\n     *\n     * @var array\n     */\n    protected $middleware = [\n        // \\App\\Http\\Middleware\\TrustHosts::class,\n        \\App\\Http\\Middleware\\TrustProxies::class,\n        \\Fruitcake\\Cors\\HandleCors::class,\n        \\App\\Http\\Middleware\\PreventRequestsDuringMaintenance::class,\n        \\Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize::class,\n        \\App\\Http\\Middleware\\TrimStrings::class,\n        \\Illuminate\\Foundation\\Http\\Middleware\\ConvertEmptyStringsToNull::class,\n    ];\n\n    /**\n     * The application's route middleware groups.\n     *\n     * @var array\n     */\n    protected $middlewareGroups = [\n        'web' => [\n            \\App\\Http\\Middleware\\EncryptCookies::class,\n            \\Illuminate\\Cookie\\Middleware\\AddQueuedCookiesToResponse::class,\n            \\Illuminate\\Session\\Middleware\\StartSession::class,\n            // \\Illuminate\\Session\\Middleware\\AuthenticateSession::class,\n            \\Illuminate\\View\\Middleware\\ShareErrorsFromSession::class,\n            \\App\\Http\\Middleware\\VerifyCsrfToken::class,\n            \\Illuminate\\Routing\\Middleware\\SubstituteBindings::class,\n        ],\n\n        'api' => [\n            // \\Laravel\\Sanctum\\Http\\Middleware\\EnsureFrontendRequestsAreStateful::class,\n            'throttle:api',\n            \\Illuminate\\Routing\\Middleware\\SubstituteBindings::class,\n        ],\n    ];\n\n    /**\n     * The application's route middleware.\n     *\n     * These middleware may be assigned to groups or used individually.\n     *\n     * @var array\n     */\n    protected $routeMiddleware = [\n        'auth' => \\App\\Http\\Middleware\\Authenticate::class,\n        'auth.basic' => \\Illuminate\\Auth\\Middleware\\AuthenticateWithBasicAuth::class,\n        'cache.headers' => \\Illuminate\\Http\\Middleware\\SetCacheHeaders::class,\n        'can' => \\Illuminate\\Auth\\Middleware\\Authorize::class,\n        'guest' => \\App\\Http\\Middleware\\RedirectIfAuthenticated::class,\n        'password.confirm' => \\Illuminate\\Auth\\Middleware\\RequirePassword::class,\n        'signed' => \\Illuminate\\Routing\\Middleware\\ValidateSignature::class,\n        'throttle' => \\Illuminate\\Routing\\Middleware\\ThrottleRequests::class,\n        'verified' => \\Illuminate\\Auth\\Middleware\\EnsureEmailIsVerified::class,\n    ];\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/Authenticate.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse Illuminate\\Auth\\Middleware\\Authenticate as Middleware;\n\nclass Authenticate extends Middleware\n{\n    /**\n     * Get the path the user should be redirected to when they are not authenticated.\n     *\n     * @param  \\Illuminate\\Http\\Request  $request\n     * @return string|null\n     */\n    protected function redirectTo($request)\n    {\n        if (! $request->expectsJson()) {\n            return route('login');\n        }\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/EncryptCookies.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse Illuminate\\Cookie\\Middleware\\EncryptCookies as Middleware;\n\nclass EncryptCookies extends Middleware\n{\n    /**\n     * The names of the cookies that should not be encrypted.\n     *\n     * @var array\n     */\n    protected $except = [\n        //\n    ];\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/PreventRequestsDuringMaintenance.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse Illuminate\\Foundation\\Http\\Middleware\\PreventRequestsDuringMaintenance as Middleware;\n\nclass PreventRequestsDuringMaintenance extends Middleware\n{\n    /**\n     * The URIs that should be reachable while maintenance mode is enabled.\n     *\n     * @var array\n     */\n    protected $except = [\n        //\n    ];\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/RedirectIfAuthenticated.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse App\\Providers\\RouteServiceProvider;\nuse Closure;\nuse Illuminate\\Http\\Request;\nuse Illuminate\\Support\\Facades\\Auth;\n\nclass RedirectIfAuthenticated\n{\n    /**\n     * Handle an incoming request.\n     *\n     * @param  \\Illuminate\\Http\\Request  $request\n     * @param  \\Closure  $next\n     * @param  string|null  ...$guards\n     * @return mixed\n     */\n    public function handle(Request $request, Closure $next, ...$guards)\n    {\n        $guards = empty($guards) ? [null] : $guards;\n\n        foreach ($guards as $guard) {\n            if (Auth::guard($guard)->check()) {\n                return redirect(RouteServiceProvider::HOME);\n            }\n        }\n\n        return $next($request);\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/TrimStrings.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse Illuminate\\Foundation\\Http\\Middleware\\TrimStrings as Middleware;\n\nclass TrimStrings extends Middleware\n{\n    /**\n     * The names of the attributes that should not be trimmed.\n     *\n     * @var array\n     */\n    protected $except = [\n        'current_password',\n        'password',\n        'password_confirmation',\n    ];\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/TrustHosts.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse Illuminate\\Http\\Middleware\\TrustHosts as Middleware;\n\nclass TrustHosts extends Middleware\n{\n    /**\n     * Get the host patterns that should be trusted.\n     *\n     * @return array\n     */\n    public function hosts()\n    {\n        return [\n            $this->allSubdomainsOfApplicationUrl(),\n        ];\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/TrustProxies.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse Illuminate\\Http\\Middleware\\TrustProxies as Middleware;\nuse Illuminate\\Http\\Request;\n\nclass TrustProxies extends Middleware\n{\n    /**\n     * The trusted proxies for this application.\n     *\n     * @var array|string|null\n     */\n    protected $proxies;\n\n    /**\n     * The headers that should be used to detect proxies.\n     *\n     * @var int\n     */\n    protected $headers =\n        Request::HEADER_X_FORWARDED_FOR |\n        Request::HEADER_X_FORWARDED_HOST |\n        Request::HEADER_X_FORWARDED_PORT |\n        Request::HEADER_X_FORWARDED_PROTO |\n        Request::HEADER_X_FORWARDED_AWS_ELB;\n}\n"
  },
  {
    "path": "src/material-stubs/app/Http/Middleware/VerifyCsrfToken.php",
    "content": "<?php\n\nnamespace App\\Http\\Middleware;\n\nuse Illuminate\\Foundation\\Http\\Middleware\\VerifyCsrfToken as Middleware;\n\nclass VerifyCsrfToken extends Middleware\n{\n    /**\n     * The URIs that should be excluded from CSRF verification.\n     *\n     * @var array\n     */\n    protected $except = [\n        //\n    ];\n}\n"
  },
  {
    "path": "src/material-stubs/app/Models/User.php",
    "content": "<?php\n\nnamespace App\\Models;\n\nuse Illuminate\\Contracts\\Auth\\MustVerifyEmail;\nuse Illuminate\\Database\\Eloquent\\Factories\\HasFactory;\nuse Illuminate\\Foundation\\Auth\\User as Authenticatable;\nuse Illuminate\\Notifications\\Notifiable;\nuse Laravel\\Sanctum\\HasApiTokens;\nuse Illuminate\\Contracts\\Auth\\CanResetPassword;\n\nclass User extends Authenticatable\n{\n    use HasApiTokens, HasFactory, Notifiable;\n\n    /**\n     * The attributes that are mass assignable.\n     *\n     * @var string[]\n     */\n    protected $fillable = [\n        'name',\n        'email',\n        'password',\n        'location',\n        'phone',\n        'about',\n        'password_confirmation'\n    ];\n\n    /**\n     * The attributes that should be hidden for serialization.\n     *\n     * @var array\n     */\n    protected $hidden = [\n        'password',\n        'remember_token',\n    ];\n\n    /**\n     * The attributes that should be cast.\n     *\n     * @var array\n     */\n    protected $casts = [\n        'email_verified_at' => 'datetime',\n    ];\n    \n    public function setPasswordAttribute($password)\n    {\n        $this->attributes['password'] = bcrypt($password);\n    }\n\n}\n"
  },
  {
    "path": "src/material-stubs/app/Providers/AppServiceProvider.php",
    "content": "<?php\n\nnamespace App\\Providers;\n\nuse Illuminate\\Support\\ServiceProvider;\n\nclass AppServiceProvider extends ServiceProvider\n{\n    /**\n     * Register any application services.\n     *\n     * @return void\n     */\n    public function register()\n    {\n        //\n    }\n\n    /**\n     * Bootstrap any application services.\n     *\n     * @return void\n     */\n    public function boot()\n    {\n        //\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Providers/AuthServiceProvider.php",
    "content": "<?php\n\nnamespace App\\Providers;\n\nuse Illuminate\\Foundation\\Support\\Providers\\AuthServiceProvider as ServiceProvider;\nuse Illuminate\\Support\\Facades\\Gate;\n\nclass AuthServiceProvider extends ServiceProvider\n{\n    /**\n     * The policy mappings for the application.\n     *\n     * @var array\n     */\n    protected $policies = [\n        // 'App\\Models\\Model' => 'App\\Policies\\ModelPolicy',\n    ];\n\n    /**\n     * Register any authentication / authorization services.\n     *\n     * @return void\n     */\n    public function boot()\n    {\n        $this->registerPolicies();\n\n        //\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Providers/BroadcastServiceProvider.php",
    "content": "<?php\n\nnamespace App\\Providers;\n\nuse Illuminate\\Support\\Facades\\Broadcast;\nuse Illuminate\\Support\\ServiceProvider;\n\nclass BroadcastServiceProvider extends ServiceProvider\n{\n    /**\n     * Bootstrap any application services.\n     *\n     * @return void\n     */\n    public function boot()\n    {\n        Broadcast::routes();\n\n        require base_path('routes/channels.php');\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Providers/EventServiceProvider.php",
    "content": "<?php\n\nnamespace App\\Providers;\n\nuse Illuminate\\Auth\\Events\\Registered;\nuse Illuminate\\Auth\\Listeners\\SendEmailVerificationNotification;\nuse Illuminate\\Foundation\\Support\\Providers\\EventServiceProvider as ServiceProvider;\nuse Illuminate\\Support\\Facades\\Event;\n\nclass EventServiceProvider extends ServiceProvider\n{\n    /**\n     * The event listener mappings for the application.\n     *\n     * @var array\n     */\n    protected $listen = [\n        Registered::class => [\n            SendEmailVerificationNotification::class,\n        ],\n    ];\n\n    /**\n     * Register any events for your application.\n     *\n     * @return void\n     */\n    public function boot()\n    {\n        //\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/app/Providers/RouteServiceProvider.php",
    "content": "<?php\n\nnamespace App\\Providers;\n\nuse Illuminate\\Cache\\RateLimiting\\Limit;\nuse Illuminate\\Foundation\\Support\\Providers\\RouteServiceProvider as ServiceProvider;\nuse Illuminate\\Http\\Request;\nuse Illuminate\\Support\\Facades\\RateLimiter;\nuse Illuminate\\Support\\Facades\\Route;\n\nclass RouteServiceProvider extends ServiceProvider\n{\n    /**\n     * The path to the \"home\" route for your application.\n     *\n     * This is used by Laravel authentication to redirect users after login.\n     *\n     * @var string\n     */\n    public const HOME = '/dashboard';\n\n    /**\n     * The controller namespace for the application.\n     *\n     * When present, controller route declarations will automatically be prefixed with this namespace.\n     *\n     * @var string|null\n     */\n    // protected $namespace = 'App\\\\Http\\\\Controllers';\n\n    /**\n     * Define your route model bindings, pattern filters, etc.\n     *\n     * @return void\n     */\n    public function boot()\n    {\n        $this->configureRateLimiting();\n\n        $this->routes(function () {\n            Route::prefix('api')\n                ->middleware('api')\n                ->namespace($this->namespace)\n                ->group(base_path('routes/api.php'));\n\n            Route::middleware('web')\n                ->namespace($this->namespace)\n                ->group(base_path('routes/web.php'));\n        });\n    }\n\n    /**\n     * Configure the rate limiters for the application.\n     *\n     * @return void\n     */\n    protected function configureRateLimiting()\n    {\n        RateLimiter::for('api', function (Request $request) {\n            return Limit::perMinute(60)->by(optional($request->user())->id ?: $request->ip());\n        });\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/database/seeders/DatabaseSeeder.php",
    "content": "<?php\n\nnamespace Database\\Seeders;\n\nuse Illuminate\\Database\\Seeder;\nuse App\\Models\\User;\n\n\nclass DatabaseSeeder extends Seeder\n{\n    /**\n     * Seed the application's database.\n     *\n     * @return void\n     */\n    public function run()\n    {\n         User::factory()->create([\n            'name' => 'Admin',\n            'email' => 'admin@material.com',\n            'password' => ('secret')\n        ]);\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/migrations/2014_10_12_000000_create_users_table.php",
    "content": "<?php\n\nuse Illuminate\\Database\\Migrations\\Migration;\nuse Illuminate\\Database\\Schema\\Blueprint;\nuse Illuminate\\Support\\Facades\\Schema;\n\nclass CreateUsersTable extends Migration\n{\n    /**\n     * Run the migrations.\n     *\n     * @return void\n     */\n    public function up()\n    {\n        Schema::create('users', function (Blueprint $table) {\n            $table->id();\n            $table->string('name');\n            $table->string('email')->unique();\n            $table->timestamp('email_verified_at')->nullable();\n            $table->string('phone')->nullable();\n            $table->string('location')->nullable();\n            $table->text('about')->nullable();\n            $table->string('password');\n            $table->rememberToken();\n            $table->timestamps();\n        });\n    }\n\n    /**\n     * Reverse the migrations.\n     *\n     * @return void\n     */\n    public function down()\n    {\n        Schema::dropIfExists('users');\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/assets/css/material-dashboard.css",
    "content": "/*!\n * Bootstrap v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n */\n:root {\n  --bs-blue: #63B3ED;\n  --bs-indigo: #596CFF;\n  --bs-purple: #6f42c1;\n  --bs-pink: #d63384;\n  --bs-red: #F56565;\n  --bs-orange: #fd7e14;\n  --bs-yellow: #FBD38D;\n  --bs-green: #81E6D9;\n  --bs-teal: #20c997;\n  --bs-cyan: #0dcaf0;\n  --bs-white: #fff;\n  --bs-gray: #6c757d;\n  --bs-gray-dark: #343a40;\n  --bs-gray-100: #f8f9fa;\n  --bs-gray-200: #f0f2f5;\n  --bs-gray-300: #dee2e6;\n  --bs-gray-400: #ced4da;\n  --bs-gray-500: #adb5bd;\n  --bs-gray-600: #6c757d;\n  --bs-gray-700: #495057;\n  --bs-gray-800: #343a40;\n  --bs-gray-900: #212529;\n  --bs-primary: #e91e63;\n  --bs-secondary: #7b809a;\n  --bs-success: #4CAF50;\n  --bs-info: #1A73E8;\n  --bs-warning: #fb8c00;\n  --bs-danger: #F44335;\n  --bs-light: #f0f2f5;\n  --bs-dark: #344767;\n  --bs-white: #fff;\n  --bs-primary-rgb: 233, 30, 99;\n  --bs-secondary-rgb: 123, 128, 154;\n  --bs-success-rgb: 76, 175, 80;\n  --bs-info-rgb: 26, 115, 232;\n  --bs-warning-rgb: 251, 140, 0;\n  --bs-danger-rgb: 244, 67, 53;\n  --bs-light-rgb: 240, 242, 245;\n  --bs-dark-rgb: 52, 71, 103;\n  --bs-white-rgb: 255, 255, 255;\n  --bs-white-rgb: 255, 255, 255;\n  --bs-black-rgb: 0, 0, 0;\n  --bs-body-color-rgb: 123, 128, 154;\n  --bs-body-bg-rgb: 255, 255, 255;\n  --bs-font-sans-serif: \"Roboto\", Helvetica, Arial, sans-serif;\n  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));\n  --bs-body-font-family: var(--bs-font-sans-serif);\n  --bs-body-font-size: 1rem;\n  --bs-body-font-weight: 400;\n  --bs-body-line-height: 1.5;\n  --bs-body-color: #7b809a;\n  --bs-body-bg: #fff; }\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box; }\n\n@media (prefers-reduced-motion: no-preference) {\n  :root {\n    scroll-behavior: smooth; } }\n\nbody {\n  margin: 0;\n  font-family: var(--bs-body-font-family);\n  font-size: var(--bs-body-font-size);\n  font-weight: var(--bs-body-font-weight);\n  line-height: var(--bs-body-line-height);\n  color: var(--bs-body-color);\n  text-align: var(--bs-body-text-align);\n  background-color: var(--bs-body-bg);\n  -webkit-text-size-adjust: 100%;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }\n\nhr {\n  margin: 1rem 0;\n  color: inherit;\n  background-color: currentColor;\n  border: 0;\n  opacity: 0.25; }\n\nhr:not([size]) {\n  height: 1px; }\n\nh1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {\n  margin-top: 0;\n  margin-bottom: 0.5rem;\n  font-weight: 400;\n  line-height: 1.2;\n  color: #344767; }\n\nh1, .h1 {\n  font-size: calc(1.425rem + 2.1vw); }\n  @media (min-width: 1200px) {\n    h1, .h1 {\n      font-size: 3rem; } }\n\nh2, .h2 {\n  font-size: calc(1.35rem + 1.2vw); }\n  @media (min-width: 1200px) {\n    h2, .h2 {\n      font-size: 2.25rem; } }\n\nh3, .h3 {\n  font-size: calc(1.3125rem + 0.75vw); }\n  @media (min-width: 1200px) {\n    h3, .h3 {\n      font-size: 1.875rem; } }\n\nh4, .h4 {\n  font-size: calc(1.275rem + 0.3vw); }\n  @media (min-width: 1200px) {\n    h4, .h4 {\n      font-size: 1.5rem; } }\n\nh5, .h5 {\n  font-size: 1.25rem; }\n\nh6, .h6 {\n  font-size: 1rem; }\n\np {\n  margin-top: 0;\n  margin-bottom: 1rem; }\n\nabbr[title],\nabbr[data-bs-original-title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n  cursor: help;\n  -webkit-text-decoration-skip-ink: none;\n          text-decoration-skip-ink: none; }\n\naddress {\n  margin-bottom: 1rem;\n  font-style: normal;\n  line-height: inherit; }\n\nol,\nul {\n  padding-left: 2rem; }\n\nol,\nul,\ndl {\n  margin-top: 0;\n  margin-bottom: 1rem; }\n\nol ol,\nul ul,\nol ul,\nul ol {\n  margin-bottom: 0; }\n\ndt {\n  font-weight: 600; }\n\ndd {\n  margin-bottom: .5rem;\n  margin-left: 0; }\n\nblockquote {\n  margin: 0 0 1rem; }\n\nb,\nstrong {\n  font-weight: 700; }\n\nsmall, .small {\n  font-size: 0.875em; }\n\nmark, .mark {\n  padding: 0.2em;\n  background-color: #fcf8e3; }\n\nsub,\nsup {\n  position: relative;\n  font-size: 0.75em;\n  line-height: 0;\n  vertical-align: baseline; }\n\nsub {\n  bottom: -.25em; }\n\nsup {\n  top: -.5em; }\n\na {\n  color: #e91e63;\n  text-decoration: none; }\n  a:hover {\n    color: #e91e63;\n    text-decoration: none; }\n\na:not([href]):not([class]), a:not([href]):not([class]):hover {\n  color: inherit;\n  text-decoration: none; }\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: var(--bs-font-monospace);\n  font-size: 1em;\n  direction: ltr /* rtl:ignore */;\n  unicode-bidi: bidi-override; }\n\npre {\n  display: block;\n  margin-top: 0;\n  margin-bottom: 1rem;\n  overflow: auto;\n  font-size: 0.875em; }\n  pre code {\n    font-size: inherit;\n    color: inherit;\n    word-break: normal; }\n\ncode {\n  font-size: 0.875em;\n  color: #d63384;\n  word-wrap: break-word; }\n  a > code {\n    color: inherit; }\n\nkbd {\n  padding: 0.2rem 0.4rem;\n  font-size: 0.875em;\n  color: #fff;\n  background-color: #212529;\n  border-radius: 0.125rem; }\n  kbd kbd {\n    padding: 0;\n    font-size: 1em;\n    font-weight: 600; }\n\nfigure {\n  margin: 0 0 1rem; }\n\nimg,\nsvg {\n  vertical-align: middle; }\n\ntable {\n  caption-side: bottom;\n  border-collapse: collapse; }\n\ncaption {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  color: #6c757d;\n  text-align: left; }\n\nth {\n  text-align: inherit;\n  text-align: -webkit-match-parent; }\n\nthead,\ntbody,\ntfoot,\ntr,\ntd,\nth {\n  border-color: inherit;\n  border-style: solid;\n  border-width: 0; }\n\nlabel {\n  display: inline-block; }\n\nbutton {\n  border-radius: 0; }\n\nbutton:focus:not(:focus-visible) {\n  outline: 0; }\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n  margin: 0;\n  font-family: inherit;\n  font-size: inherit;\n  line-height: inherit; }\n\nbutton,\nselect {\n  text-transform: none; }\n\n[role=\"button\"] {\n  cursor: pointer; }\n\nselect {\n  word-wrap: normal; }\n  select:disabled {\n    opacity: 1; }\n\n[list]::-webkit-calendar-picker-indicator {\n  display: none; }\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button; }\n  button:not(:disabled),\n  [type=\"button\"]:not(:disabled),\n  [type=\"reset\"]:not(:disabled),\n  [type=\"submit\"]:not(:disabled) {\n    cursor: pointer; }\n\n::-moz-focus-inner {\n  padding: 0;\n  border-style: none; }\n\ntextarea {\n  resize: vertical; }\n\nfieldset {\n  min-width: 0;\n  padding: 0;\n  margin: 0;\n  border: 0; }\n\nlegend {\n  float: left;\n  width: 100%;\n  padding: 0;\n  margin-bottom: 0.5rem;\n  font-size: calc(1.275rem + 0.3vw);\n  line-height: inherit; }\n  @media (min-width: 1200px) {\n    legend {\n      font-size: 1.5rem; } }\n  legend + * {\n    clear: left; }\n\n::-webkit-datetime-edit-fields-wrapper,\n::-webkit-datetime-edit-text,\n::-webkit-datetime-edit-minute,\n::-webkit-datetime-edit-hour-field,\n::-webkit-datetime-edit-day-field,\n::-webkit-datetime-edit-month-field,\n::-webkit-datetime-edit-year-field {\n  padding: 0; }\n\n::-webkit-inner-spin-button {\n  height: auto; }\n\n[type=\"search\"] {\n  outline-offset: -2px;\n  -webkit-appearance: textfield; }\n\n/* rtl:raw:\n[type=\"tel\"],\n[type=\"url\"],\n[type=\"email\"],\n[type=\"number\"] {\n  direction: ltr;\n}\n*/\n::-webkit-search-decoration {\n  -webkit-appearance: none; }\n\n::-webkit-color-swatch-wrapper {\n  padding: 0; }\n\n::file-selector-button {\n  font: inherit; }\n\n::-webkit-file-upload-button {\n  font: inherit;\n  -webkit-appearance: button; }\n\noutput {\n  display: inline-block; }\n\niframe {\n  border: 0; }\n\nsummary {\n  display: list-item;\n  cursor: pointer; }\n\nprogress {\n  vertical-align: baseline; }\n\n[hidden] {\n  display: none !important; }\n\n.lead {\n  font-size: 1.25rem;\n  font-weight: 400; }\n\n.display-1 {\n  font-size: calc(1.625rem + 4.5vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-1 {\n      font-size: 5rem; } }\n\n.display-2 {\n  font-size: calc(1.575rem + 3.9vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-2 {\n      font-size: 4.5rem; } }\n\n.display-3 {\n  font-size: calc(1.525rem + 3.3vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-3 {\n      font-size: 4rem; } }\n\n.display-4 {\n  font-size: calc(1.475rem + 2.7vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-4 {\n      font-size: 3.5rem; } }\n\n.display-5 {\n  font-size: calc(1.425rem + 2.1vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-5 {\n      font-size: 3rem; } }\n\n.display-6 {\n  font-size: calc(1.375rem + 1.5vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-6 {\n      font-size: 2.5rem; } }\n\n.list-unstyled {\n  padding-left: 0;\n  list-style: none; }\n\n.list-inline {\n  padding-left: 0;\n  list-style: none; }\n\n.list-inline-item {\n  display: inline-block; }\n  .list-inline-item:not(:last-child) {\n    margin-right: 0.5rem; }\n\n.initialism {\n  font-size: 0.875em;\n  text-transform: uppercase; }\n\n.blockquote {\n  margin-bottom: 1rem;\n  font-size: 1.25rem; }\n  .blockquote > :last-child {\n    margin-bottom: 0; }\n\n.blockquote-footer {\n  margin-top: -1rem;\n  margin-bottom: 1rem;\n  font-size: 0.875em;\n  color: #6c757d; }\n  .blockquote-footer::before {\n    content: \"\\2014\\00A0\"; }\n\n.img-fluid {\n  max-width: 100%;\n  height: auto; }\n\n.img-thumbnail {\n  padding: 0.25rem;\n  background-color: #fff;\n  border: 1px solid #dee2e6;\n  border-radius: 0.375rem;\n  max-width: 100%;\n  height: auto; }\n\n.figure {\n  display: inline-block; }\n\n.figure-img {\n  margin-bottom: 0.5rem;\n  line-height: 1; }\n\n.figure-caption {\n  font-size: 0.875em;\n  color: #6c757d; }\n\n.container,\n.container-fluid,\n.container-sm,\n.container-md,\n.container-lg,\n.container-xl,\n.container-xxl {\n  width: 100%;\n  padding-right: var(--bs-gutter-x, 1.5rem);\n  padding-left: var(--bs-gutter-x, 1.5rem);\n  margin-right: auto;\n  margin-left: auto; }\n\n@media (min-width: 576px) {\n  .container, .container-sm {\n    max-width: 540px; } }\n\n@media (min-width: 768px) {\n  .container, .container-sm, .container-md {\n    max-width: 720px; } }\n\n@media (min-width: 992px) {\n  .container, .container-sm, .container-md, .container-lg {\n    max-width: 960px; } }\n\n@media (min-width: 1200px) {\n  .container, .container-sm, .container-md, .container-lg, .container-xl {\n    max-width: 1140px; } }\n\n@media (min-width: 1400px) {\n  .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {\n    max-width: 1320px; } }\n\n.row {\n  --bs-gutter-x: 1.5rem;\n  --bs-gutter-y: 0;\n  display: flex;\n  flex-wrap: wrap;\n  margin-top: calc(-1 * var(--bs-gutter-y));\n  margin-right: calc(-.5 * var(--bs-gutter-x));\n  margin-left: calc(-.5 * var(--bs-gutter-x)); }\n  .row > * {\n    flex-shrink: 0;\n    width: 100%;\n    max-width: 100%;\n    padding-right: calc(var(--bs-gutter-x) * .5);\n    padding-left: calc(var(--bs-gutter-x) * .5);\n    margin-top: var(--bs-gutter-y); }\n\n.col {\n  flex: 1 0 0%; }\n\n.row-cols-auto > * {\n  flex: 0 0 auto;\n  width: auto; }\n\n.row-cols-1 > * {\n  flex: 0 0 auto;\n  width: 100%; }\n\n.row-cols-2 > * {\n  flex: 0 0 auto;\n  width: 50%; }\n\n.row-cols-3 > * {\n  flex: 0 0 auto;\n  width: 33.33333%; }\n\n.row-cols-4 > * {\n  flex: 0 0 auto;\n  width: 25%; }\n\n.row-cols-5 > * {\n  flex: 0 0 auto;\n  width: 20%; }\n\n.row-cols-6 > * {\n  flex: 0 0 auto;\n  width: 16.66667%; }\n\n.col-auto {\n  flex: 0 0 auto;\n  width: auto; }\n\n.col-1 {\n  flex: 0 0 auto;\n  width: 8.33333%; }\n\n.col-2 {\n  flex: 0 0 auto;\n  width: 16.66667%; }\n\n.col-3 {\n  flex: 0 0 auto;\n  width: 25%; }\n\n.col-4 {\n  flex: 0 0 auto;\n  width: 33.33333%; }\n\n.col-5 {\n  flex: 0 0 auto;\n  width: 41.66667%; }\n\n.col-6 {\n  flex: 0 0 auto;\n  width: 50%; }\n\n.col-7 {\n  flex: 0 0 auto;\n  width: 58.33333%; }\n\n.col-8 {\n  flex: 0 0 auto;\n  width: 66.66667%; }\n\n.col-9 {\n  flex: 0 0 auto;\n  width: 75%; }\n\n.col-10 {\n  flex: 0 0 auto;\n  width: 83.33333%; }\n\n.col-11 {\n  flex: 0 0 auto;\n  width: 91.66667%; }\n\n.col-12 {\n  flex: 0 0 auto;\n  width: 100%; }\n\n.offset-1 {\n  margin-left: 8.33333%; }\n\n.offset-2 {\n  margin-left: 16.66667%; }\n\n.offset-3 {\n  margin-left: 25%; }\n\n.offset-4 {\n  margin-left: 33.33333%; }\n\n.offset-5 {\n  margin-left: 41.66667%; }\n\n.offset-6 {\n  margin-left: 50%; }\n\n.offset-7 {\n  margin-left: 58.33333%; }\n\n.offset-8 {\n  margin-left: 66.66667%; }\n\n.offset-9 {\n  margin-left: 75%; }\n\n.offset-10 {\n  margin-left: 83.33333%; }\n\n.offset-11 {\n  margin-left: 91.66667%; }\n\n.g-0,\n.gx-0 {\n  --bs-gutter-x: 0; }\n\n.g-0,\n.gy-0 {\n  --bs-gutter-y: 0; }\n\n.g-1,\n.gx-1 {\n  --bs-gutter-x: 0.25rem; }\n\n.g-1,\n.gy-1 {\n  --bs-gutter-y: 0.25rem; }\n\n.g-2,\n.gx-2 {\n  --bs-gutter-x: 0.5rem; }\n\n.g-2,\n.gy-2 {\n  --bs-gutter-y: 0.5rem; }\n\n.g-3,\n.gx-3 {\n  --bs-gutter-x: 1rem; }\n\n.g-3,\n.gy-3 {\n  --bs-gutter-y: 1rem; }\n\n.g-4,\n.gx-4 {\n  --bs-gutter-x: 1.5rem; }\n\n.g-4,\n.gy-4 {\n  --bs-gutter-y: 1.5rem; }\n\n.g-5,\n.gx-5 {\n  --bs-gutter-x: 3rem; }\n\n.g-5,\n.gy-5 {\n  --bs-gutter-y: 3rem; }\n\n.g-6,\n.gx-6 {\n  --bs-gutter-x: 4rem; }\n\n.g-6,\n.gy-6 {\n  --bs-gutter-y: 4rem; }\n\n.g-7,\n.gx-7 {\n  --bs-gutter-x: 6rem; }\n\n.g-7,\n.gy-7 {\n  --bs-gutter-y: 6rem; }\n\n.g-8,\n.gx-8 {\n  --bs-gutter-x: 8rem; }\n\n.g-8,\n.gy-8 {\n  --bs-gutter-y: 8rem; }\n\n.g-9,\n.gx-9 {\n  --bs-gutter-x: 10rem; }\n\n.g-9,\n.gy-9 {\n  --bs-gutter-y: 10rem; }\n\n.g-10,\n.gx-10 {\n  --bs-gutter-x: 12rem; }\n\n.g-10,\n.gy-10 {\n  --bs-gutter-y: 12rem; }\n\n.g-11,\n.gx-11 {\n  --bs-gutter-x: 14rem; }\n\n.g-11,\n.gy-11 {\n  --bs-gutter-y: 14rem; }\n\n.g-12,\n.gx-12 {\n  --bs-gutter-x: 16rem; }\n\n.g-12,\n.gy-12 {\n  --bs-gutter-y: 16rem; }\n\n@media (min-width: 576px) {\n  .col-sm {\n    flex: 1 0 0%; }\n  .row-cols-sm-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-sm-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-sm-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-sm-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-sm-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-sm-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-sm-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-sm-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-sm-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-sm-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-sm-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-sm-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-sm-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-sm-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-sm-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-sm-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-sm-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-sm-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-sm-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-sm-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-sm-0 {\n    margin-left: 0; }\n  .offset-sm-1 {\n    margin-left: 8.33333%; }\n  .offset-sm-2 {\n    margin-left: 16.66667%; }\n  .offset-sm-3 {\n    margin-left: 25%; }\n  .offset-sm-4 {\n    margin-left: 33.33333%; }\n  .offset-sm-5 {\n    margin-left: 41.66667%; }\n  .offset-sm-6 {\n    margin-left: 50%; }\n  .offset-sm-7 {\n    margin-left: 58.33333%; }\n  .offset-sm-8 {\n    margin-left: 66.66667%; }\n  .offset-sm-9 {\n    margin-left: 75%; }\n  .offset-sm-10 {\n    margin-left: 83.33333%; }\n  .offset-sm-11 {\n    margin-left: 91.66667%; }\n  .g-sm-0,\n  .gx-sm-0 {\n    --bs-gutter-x: 0; }\n  .g-sm-0,\n  .gy-sm-0 {\n    --bs-gutter-y: 0; }\n  .g-sm-1,\n  .gx-sm-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-sm-1,\n  .gy-sm-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-sm-2,\n  .gx-sm-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-sm-2,\n  .gy-sm-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-sm-3,\n  .gx-sm-3 {\n    --bs-gutter-x: 1rem; }\n  .g-sm-3,\n  .gy-sm-3 {\n    --bs-gutter-y: 1rem; }\n  .g-sm-4,\n  .gx-sm-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-sm-4,\n  .gy-sm-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-sm-5,\n  .gx-sm-5 {\n    --bs-gutter-x: 3rem; }\n  .g-sm-5,\n  .gy-sm-5 {\n    --bs-gutter-y: 3rem; }\n  .g-sm-6,\n  .gx-sm-6 {\n    --bs-gutter-x: 4rem; }\n  .g-sm-6,\n  .gy-sm-6 {\n    --bs-gutter-y: 4rem; }\n  .g-sm-7,\n  .gx-sm-7 {\n    --bs-gutter-x: 6rem; }\n  .g-sm-7,\n  .gy-sm-7 {\n    --bs-gutter-y: 6rem; }\n  .g-sm-8,\n  .gx-sm-8 {\n    --bs-gutter-x: 8rem; }\n  .g-sm-8,\n  .gy-sm-8 {\n    --bs-gutter-y: 8rem; }\n  .g-sm-9,\n  .gx-sm-9 {\n    --bs-gutter-x: 10rem; }\n  .g-sm-9,\n  .gy-sm-9 {\n    --bs-gutter-y: 10rem; }\n  .g-sm-10,\n  .gx-sm-10 {\n    --bs-gutter-x: 12rem; }\n  .g-sm-10,\n  .gy-sm-10 {\n    --bs-gutter-y: 12rem; }\n  .g-sm-11,\n  .gx-sm-11 {\n    --bs-gutter-x: 14rem; }\n  .g-sm-11,\n  .gy-sm-11 {\n    --bs-gutter-y: 14rem; }\n  .g-sm-12,\n  .gx-sm-12 {\n    --bs-gutter-x: 16rem; }\n  .g-sm-12,\n  .gy-sm-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 768px) {\n  .col-md {\n    flex: 1 0 0%; }\n  .row-cols-md-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-md-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-md-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-md-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-md-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-md-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-md-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-md-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-md-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-md-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-md-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-md-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-md-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-md-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-md-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-md-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-md-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-md-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-md-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-md-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-md-0 {\n    margin-left: 0; }\n  .offset-md-1 {\n    margin-left: 8.33333%; }\n  .offset-md-2 {\n    margin-left: 16.66667%; }\n  .offset-md-3 {\n    margin-left: 25%; }\n  .offset-md-4 {\n    margin-left: 33.33333%; }\n  .offset-md-5 {\n    margin-left: 41.66667%; }\n  .offset-md-6 {\n    margin-left: 50%; }\n  .offset-md-7 {\n    margin-left: 58.33333%; }\n  .offset-md-8 {\n    margin-left: 66.66667%; }\n  .offset-md-9 {\n    margin-left: 75%; }\n  .offset-md-10 {\n    margin-left: 83.33333%; }\n  .offset-md-11 {\n    margin-left: 91.66667%; }\n  .g-md-0,\n  .gx-md-0 {\n    --bs-gutter-x: 0; }\n  .g-md-0,\n  .gy-md-0 {\n    --bs-gutter-y: 0; }\n  .g-md-1,\n  .gx-md-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-md-1,\n  .gy-md-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-md-2,\n  .gx-md-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-md-2,\n  .gy-md-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-md-3,\n  .gx-md-3 {\n    --bs-gutter-x: 1rem; }\n  .g-md-3,\n  .gy-md-3 {\n    --bs-gutter-y: 1rem; }\n  .g-md-4,\n  .gx-md-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-md-4,\n  .gy-md-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-md-5,\n  .gx-md-5 {\n    --bs-gutter-x: 3rem; }\n  .g-md-5,\n  .gy-md-5 {\n    --bs-gutter-y: 3rem; }\n  .g-md-6,\n  .gx-md-6 {\n    --bs-gutter-x: 4rem; }\n  .g-md-6,\n  .gy-md-6 {\n    --bs-gutter-y: 4rem; }\n  .g-md-7,\n  .gx-md-7 {\n    --bs-gutter-x: 6rem; }\n  .g-md-7,\n  .gy-md-7 {\n    --bs-gutter-y: 6rem; }\n  .g-md-8,\n  .gx-md-8 {\n    --bs-gutter-x: 8rem; }\n  .g-md-8,\n  .gy-md-8 {\n    --bs-gutter-y: 8rem; }\n  .g-md-9,\n  .gx-md-9 {\n    --bs-gutter-x: 10rem; }\n  .g-md-9,\n  .gy-md-9 {\n    --bs-gutter-y: 10rem; }\n  .g-md-10,\n  .gx-md-10 {\n    --bs-gutter-x: 12rem; }\n  .g-md-10,\n  .gy-md-10 {\n    --bs-gutter-y: 12rem; }\n  .g-md-11,\n  .gx-md-11 {\n    --bs-gutter-x: 14rem; }\n  .g-md-11,\n  .gy-md-11 {\n    --bs-gutter-y: 14rem; }\n  .g-md-12,\n  .gx-md-12 {\n    --bs-gutter-x: 16rem; }\n  .g-md-12,\n  .gy-md-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 992px) {\n  .col-lg {\n    flex: 1 0 0%; }\n  .row-cols-lg-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-lg-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-lg-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-lg-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-lg-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-lg-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-lg-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-lg-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-lg-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-lg-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-lg-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-lg-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-lg-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-lg-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-lg-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-lg-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-lg-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-lg-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-lg-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-lg-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-lg-0 {\n    margin-left: 0; }\n  .offset-lg-1 {\n    margin-left: 8.33333%; }\n  .offset-lg-2 {\n    margin-left: 16.66667%; }\n  .offset-lg-3 {\n    margin-left: 25%; }\n  .offset-lg-4 {\n    margin-left: 33.33333%; }\n  .offset-lg-5 {\n    margin-left: 41.66667%; }\n  .offset-lg-6 {\n    margin-left: 50%; }\n  .offset-lg-7 {\n    margin-left: 58.33333%; }\n  .offset-lg-8 {\n    margin-left: 66.66667%; }\n  .offset-lg-9 {\n    margin-left: 75%; }\n  .offset-lg-10 {\n    margin-left: 83.33333%; }\n  .offset-lg-11 {\n    margin-left: 91.66667%; }\n  .g-lg-0,\n  .gx-lg-0 {\n    --bs-gutter-x: 0; }\n  .g-lg-0,\n  .gy-lg-0 {\n    --bs-gutter-y: 0; }\n  .g-lg-1,\n  .gx-lg-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-lg-1,\n  .gy-lg-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-lg-2,\n  .gx-lg-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-lg-2,\n  .gy-lg-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-lg-3,\n  .gx-lg-3 {\n    --bs-gutter-x: 1rem; }\n  .g-lg-3,\n  .gy-lg-3 {\n    --bs-gutter-y: 1rem; }\n  .g-lg-4,\n  .gx-lg-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-lg-4,\n  .gy-lg-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-lg-5,\n  .gx-lg-5 {\n    --bs-gutter-x: 3rem; }\n  .g-lg-5,\n  .gy-lg-5 {\n    --bs-gutter-y: 3rem; }\n  .g-lg-6,\n  .gx-lg-6 {\n    --bs-gutter-x: 4rem; }\n  .g-lg-6,\n  .gy-lg-6 {\n    --bs-gutter-y: 4rem; }\n  .g-lg-7,\n  .gx-lg-7 {\n    --bs-gutter-x: 6rem; }\n  .g-lg-7,\n  .gy-lg-7 {\n    --bs-gutter-y: 6rem; }\n  .g-lg-8,\n  .gx-lg-8 {\n    --bs-gutter-x: 8rem; }\n  .g-lg-8,\n  .gy-lg-8 {\n    --bs-gutter-y: 8rem; }\n  .g-lg-9,\n  .gx-lg-9 {\n    --bs-gutter-x: 10rem; }\n  .g-lg-9,\n  .gy-lg-9 {\n    --bs-gutter-y: 10rem; }\n  .g-lg-10,\n  .gx-lg-10 {\n    --bs-gutter-x: 12rem; }\n  .g-lg-10,\n  .gy-lg-10 {\n    --bs-gutter-y: 12rem; }\n  .g-lg-11,\n  .gx-lg-11 {\n    --bs-gutter-x: 14rem; }\n  .g-lg-11,\n  .gy-lg-11 {\n    --bs-gutter-y: 14rem; }\n  .g-lg-12,\n  .gx-lg-12 {\n    --bs-gutter-x: 16rem; }\n  .g-lg-12,\n  .gy-lg-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 1200px) {\n  .col-xl {\n    flex: 1 0 0%; }\n  .row-cols-xl-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-xl-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-xl-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-xl-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-xl-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-xl-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-xl-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xl-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-xl-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-xl-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xl-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-xl-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-xl-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-xl-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-xl-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-xl-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-xl-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-xl-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-xl-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-xl-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-xl-0 {\n    margin-left: 0; }\n  .offset-xl-1 {\n    margin-left: 8.33333%; }\n  .offset-xl-2 {\n    margin-left: 16.66667%; }\n  .offset-xl-3 {\n    margin-left: 25%; }\n  .offset-xl-4 {\n    margin-left: 33.33333%; }\n  .offset-xl-5 {\n    margin-left: 41.66667%; }\n  .offset-xl-6 {\n    margin-left: 50%; }\n  .offset-xl-7 {\n    margin-left: 58.33333%; }\n  .offset-xl-8 {\n    margin-left: 66.66667%; }\n  .offset-xl-9 {\n    margin-left: 75%; }\n  .offset-xl-10 {\n    margin-left: 83.33333%; }\n  .offset-xl-11 {\n    margin-left: 91.66667%; }\n  .g-xl-0,\n  .gx-xl-0 {\n    --bs-gutter-x: 0; }\n  .g-xl-0,\n  .gy-xl-0 {\n    --bs-gutter-y: 0; }\n  .g-xl-1,\n  .gx-xl-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-xl-1,\n  .gy-xl-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-xl-2,\n  .gx-xl-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-xl-2,\n  .gy-xl-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-xl-3,\n  .gx-xl-3 {\n    --bs-gutter-x: 1rem; }\n  .g-xl-3,\n  .gy-xl-3 {\n    --bs-gutter-y: 1rem; }\n  .g-xl-4,\n  .gx-xl-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-xl-4,\n  .gy-xl-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-xl-5,\n  .gx-xl-5 {\n    --bs-gutter-x: 3rem; }\n  .g-xl-5,\n  .gy-xl-5 {\n    --bs-gutter-y: 3rem; }\n  .g-xl-6,\n  .gx-xl-6 {\n    --bs-gutter-x: 4rem; }\n  .g-xl-6,\n  .gy-xl-6 {\n    --bs-gutter-y: 4rem; }\n  .g-xl-7,\n  .gx-xl-7 {\n    --bs-gutter-x: 6rem; }\n  .g-xl-7,\n  .gy-xl-7 {\n    --bs-gutter-y: 6rem; }\n  .g-xl-8,\n  .gx-xl-8 {\n    --bs-gutter-x: 8rem; }\n  .g-xl-8,\n  .gy-xl-8 {\n    --bs-gutter-y: 8rem; }\n  .g-xl-9,\n  .gx-xl-9 {\n    --bs-gutter-x: 10rem; }\n  .g-xl-9,\n  .gy-xl-9 {\n    --bs-gutter-y: 10rem; }\n  .g-xl-10,\n  .gx-xl-10 {\n    --bs-gutter-x: 12rem; }\n  .g-xl-10,\n  .gy-xl-10 {\n    --bs-gutter-y: 12rem; }\n  .g-xl-11,\n  .gx-xl-11 {\n    --bs-gutter-x: 14rem; }\n  .g-xl-11,\n  .gy-xl-11 {\n    --bs-gutter-y: 14rem; }\n  .g-xl-12,\n  .gx-xl-12 {\n    --bs-gutter-x: 16rem; }\n  .g-xl-12,\n  .gy-xl-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 1400px) {\n  .col-xxl {\n    flex: 1 0 0%; }\n  .row-cols-xxl-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-xxl-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-xxl-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-xxl-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-xxl-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-xxl-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-xxl-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xxl-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-xxl-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-xxl-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xxl-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-xxl-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-xxl-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-xxl-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-xxl-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-xxl-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-xxl-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-xxl-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-xxl-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-xxl-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-xxl-0 {\n    margin-left: 0; }\n  .offset-xxl-1 {\n    margin-left: 8.33333%; }\n  .offset-xxl-2 {\n    margin-left: 16.66667%; }\n  .offset-xxl-3 {\n    margin-left: 25%; }\n  .offset-xxl-4 {\n    margin-left: 33.33333%; }\n  .offset-xxl-5 {\n    margin-left: 41.66667%; }\n  .offset-xxl-6 {\n    margin-left: 50%; }\n  .offset-xxl-7 {\n    margin-left: 58.33333%; }\n  .offset-xxl-8 {\n    margin-left: 66.66667%; }\n  .offset-xxl-9 {\n    margin-left: 75%; }\n  .offset-xxl-10 {\n    margin-left: 83.33333%; }\n  .offset-xxl-11 {\n    margin-left: 91.66667%; }\n  .g-xxl-0,\n  .gx-xxl-0 {\n    --bs-gutter-x: 0; }\n  .g-xxl-0,\n  .gy-xxl-0 {\n    --bs-gutter-y: 0; }\n  .g-xxl-1,\n  .gx-xxl-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-xxl-1,\n  .gy-xxl-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-xxl-2,\n  .gx-xxl-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-xxl-2,\n  .gy-xxl-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-xxl-3,\n  .gx-xxl-3 {\n    --bs-gutter-x: 1rem; }\n  .g-xxl-3,\n  .gy-xxl-3 {\n    --bs-gutter-y: 1rem; }\n  .g-xxl-4,\n  .gx-xxl-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-xxl-4,\n  .gy-xxl-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-xxl-5,\n  .gx-xxl-5 {\n    --bs-gutter-x: 3rem; }\n  .g-xxl-5,\n  .gy-xxl-5 {\n    --bs-gutter-y: 3rem; }\n  .g-xxl-6,\n  .gx-xxl-6 {\n    --bs-gutter-x: 4rem; }\n  .g-xxl-6,\n  .gy-xxl-6 {\n    --bs-gutter-y: 4rem; }\n  .g-xxl-7,\n  .gx-xxl-7 {\n    --bs-gutter-x: 6rem; }\n  .g-xxl-7,\n  .gy-xxl-7 {\n    --bs-gutter-y: 6rem; }\n  .g-xxl-8,\n  .gx-xxl-8 {\n    --bs-gutter-x: 8rem; }\n  .g-xxl-8,\n  .gy-xxl-8 {\n    --bs-gutter-y: 8rem; }\n  .g-xxl-9,\n  .gx-xxl-9 {\n    --bs-gutter-x: 10rem; }\n  .g-xxl-9,\n  .gy-xxl-9 {\n    --bs-gutter-y: 10rem; }\n  .g-xxl-10,\n  .gx-xxl-10 {\n    --bs-gutter-x: 12rem; }\n  .g-xxl-10,\n  .gy-xxl-10 {\n    --bs-gutter-y: 12rem; }\n  .g-xxl-11,\n  .gx-xxl-11 {\n    --bs-gutter-x: 14rem; }\n  .g-xxl-11,\n  .gy-xxl-11 {\n    --bs-gutter-y: 14rem; }\n  .g-xxl-12,\n  .gx-xxl-12 {\n    --bs-gutter-x: 16rem; }\n  .g-xxl-12,\n  .gy-xxl-12 {\n    --bs-gutter-y: 16rem; } }\n\n.table {\n  --bs-table-bg: transparent;\n  --bs-table-accent-bg: transparent;\n  --bs-table-striped-color: #7b809a;\n  --bs-table-striped-bg: rgba(0, 0, 0, 0.05);\n  --bs-table-active-color: #7b809a;\n  --bs-table-active-bg: rgba(0, 0, 0, 0.1);\n  --bs-table-hover-color: #7b809a;\n  --bs-table-hover-bg: rgba(0, 0, 0, 0.075);\n  width: 100%;\n  margin-bottom: 1rem;\n  color: #7b809a;\n  vertical-align: top;\n  border-color: #f0f2f5; }\n  .table > :not(caption) > * > * {\n    padding: 0.5rem 0.5rem;\n    background-color: var(--bs-table-bg);\n    border-bottom-width: 1px;\n    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); }\n  .table > tbody {\n    vertical-align: inherit; }\n  .table > thead {\n    vertical-align: bottom; }\n  .table > :not(:first-child) {\n    border-top: 2px solid currentColor; }\n\n.caption-top {\n  caption-side: top; }\n\n.table-sm > :not(caption) > * > * {\n  padding: 0.25rem 0.25rem; }\n\n.table-bordered > :not(caption) > * {\n  border-width: 1px 0; }\n  .table-bordered > :not(caption) > * > * {\n    border-width: 0 1px; }\n\n.table-borderless > :not(caption) > * > * {\n  border-bottom-width: 0; }\n\n.table-borderless > :not(:first-child) {\n  border-top-width: 0; }\n\n.table-striped > tbody > tr:nth-of-type(odd) > * {\n  --bs-table-accent-bg: var(--bs-table-striped-bg);\n  color: var(--bs-table-striped-color); }\n\n.table-active {\n  --bs-table-accent-bg: var(--bs-table-active-bg);\n  color: var(--bs-table-active-color); }\n\n.table-hover > tbody > tr:hover > * {\n  --bs-table-accent-bg: var(--bs-table-hover-bg);\n  color: var(--bs-table-hover-color); }\n\n.table-primary {\n  --bs-table-bg: #fbd2e0;\n  --bs-table-striped-bg: #eec8d5;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #e2bdca;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #e8c2cf;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #e2bdca; }\n\n.table-secondary {\n  --bs-table-bg: #e5e6eb;\n  --bs-table-striped-bg: #dadbdf;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #cecfd4;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #d4d5d9;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #cecfd4; }\n\n.table-success {\n  --bs-table-bg: #dbefdc;\n  --bs-table-striped-bg: #d0e3d1;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #c5d7c6;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #cbddcc;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #c5d7c6; }\n\n.table-info {\n  --bs-table-bg: #d1e3fa;\n  --bs-table-striped-bg: #c7d8ee;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #bccce1;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #c1d2e7;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #bccce1; }\n\n.table-warning {\n  --bs-table-bg: #fee8cc;\n  --bs-table-striped-bg: #f1dcc2;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #e5d1b8;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #ebd7bd;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #e5d1b8; }\n\n.table-danger {\n  --bs-table-bg: #fdd9d7;\n  --bs-table-striped-bg: #f0cecc;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #e4c3c2;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #eac9c7;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #e4c3c2; }\n\n.table-light {\n  --bs-table-bg: #f0f2f5;\n  --bs-table-striped-bg: #e4e6e9;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #d8dadd;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #dee0e3;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #d8dadd; }\n\n.table-dark {\n  --bs-table-bg: #344767;\n  --bs-table-striped-bg: #3e506f;\n  --bs-table-striped-color: #fff;\n  --bs-table-active-bg: #485976;\n  --bs-table-active-color: #fff;\n  --bs-table-hover-bg: #435572;\n  --bs-table-hover-color: #fff;\n  color: #fff;\n  border-color: #485976; }\n\n.table-responsive {\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch; }\n\n@media (max-width: 575.98px) {\n  .table-responsive-sm {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 767.98px) {\n  .table-responsive-md {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 991.98px) {\n  .table-responsive-lg {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 1199.98px) {\n  .table-responsive-xl {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 1399.98px) {\n  .table-responsive-xxl {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n.form-label {\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  font-weight: 400;\n  color: #7b809a; }\n\n.col-form-label {\n  padding-top: calc(0.5rem + 1px);\n  padding-bottom: calc(0.5rem + 1px);\n  margin-bottom: 0;\n  font-size: inherit;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #7b809a; }\n\n.col-form-label-lg {\n  padding-top: calc(0.75rem + 1px);\n  padding-bottom: calc(0.75rem + 1px);\n  font-size: 0.875rem; }\n\n.col-form-label-sm {\n  padding-top: calc(0.25rem + 1px);\n  padding-bottom: calc(0.25rem + 1px);\n  font-size: 0.75rem; }\n\n.form-text {\n  margin-top: 0.25rem;\n  font-size: 0.875em;\n  color: #6c757d; }\n\n.form-control {\n  display: block;\n  width: 100%;\n  padding: 0.5rem 0;\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #495057;\n  background-color: transparent;\n  background-clip: padding-box;\n  border: 1px solid #d2d6da;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none;\n  border-radius: 0.375rem;\n  transition: 0.2s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .form-control {\n      transition: none; } }\n  .form-control[type=\"file\"] {\n    overflow: hidden; }\n    .form-control[type=\"file\"]:not(:disabled):not([readonly]) {\n      cursor: pointer; }\n  .form-control:focus {\n    color: #495057;\n    background-color: transparent;\n    border-color: transparent;\n    outline: 0;\n    box-shadow: none; }\n  .form-control::-webkit-date-and-time-value {\n    height: 1.5rem; }\n  .form-control::-moz-placeholder {\n    color: #adb5bd;\n    opacity: 1; }\n  .form-control:-ms-input-placeholder {\n    color: #adb5bd;\n    opacity: 1; }\n  .form-control::placeholder {\n    color: #adb5bd;\n    opacity: 1; }\n  .form-control:disabled, .form-control[readonly] {\n    background-color: #f0f2f5;\n    opacity: 1; }\n  .form-control::file-selector-button {\n    padding: 0.5rem 0;\n    margin: -0.5rem 0;\n    -webkit-margin-end: 0;\n            margin-inline-end: 0;\n    color: #495057;\n    background-color: transparent;\n    pointer-events: none;\n    border-color: inherit;\n    border-style: solid;\n    border-width: 0;\n    border-inline-end-width: 1px;\n    border-radius: 0;\n    transition: all 0.15s ease-in; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-control::file-selector-button {\n        transition: none; } }\n  .form-control:hover:not(:disabled):not([readonly])::file-selector-button {\n    background-color: rgba(0, 0, 0, 0.05); }\n  .form-control::-webkit-file-upload-button {\n    padding: 0.5rem 0;\n    margin: -0.5rem 0;\n    -webkit-margin-end: 0;\n            margin-inline-end: 0;\n    color: #495057;\n    background-color: transparent;\n    pointer-events: none;\n    border-color: inherit;\n    border-style: solid;\n    border-width: 0;\n    border-inline-end-width: 1px;\n    border-radius: 0;\n    -webkit-transition: all 0.15s ease-in;\n    transition: all 0.15s ease-in; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-control::-webkit-file-upload-button {\n        -webkit-transition: none;\n        transition: none; } }\n  .form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {\n    background-color: rgba(0, 0, 0, 0.05); }\n\n.form-control-plaintext {\n  display: block;\n  width: 100%;\n  padding: 0.5rem 0;\n  margin-bottom: 0;\n  line-height: 1.5rem;\n  color: #344767;\n  background-color: transparent;\n  border: solid transparent;\n  border-width: 1px 0; }\n  .form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg {\n    padding-right: 0;\n    padding-left: 0; }\n\n.form-control-sm {\n  min-height: unset;\n  padding: 0.25rem 0.75rem;\n  font-size: 0.75rem;\n  border-radius: 0.125rem; }\n  .form-control-sm::file-selector-button {\n    padding: 0.25rem 0.75rem;\n    margin: -0.25rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n  .form-control-sm::-webkit-file-upload-button {\n    padding: 0.25rem 0.75rem;\n    margin: -0.25rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n\n.form-control-lg {\n  min-height: unset;\n  padding: 0.75rem 0.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n  .form-control-lg::file-selector-button {\n    padding: 0.75rem 0.75rem;\n    margin: -0.75rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n  .form-control-lg::-webkit-file-upload-button {\n    padding: 0.75rem 0.75rem;\n    margin: -0.75rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n\ntextarea.form-control {\n  min-height: unset; }\n\ntextarea.form-control-sm {\n  min-height: unset; }\n\ntextarea.form-control-lg {\n  min-height: unset; }\n\n.form-control-color {\n  width: 3rem;\n  height: auto;\n  padding: 0.5rem; }\n  .form-control-color:not(:disabled):not([readonly]) {\n    cursor: pointer; }\n  .form-control-color::-moz-color-swatch {\n    height: 1.5rem;\n    border-radius: 0.375rem; }\n  .form-control-color::-webkit-color-swatch {\n    height: 1.5rem;\n    border-radius: 0.375rem; }\n\n.form-select {\n  display: block;\n  width: 100%;\n  padding: 0.5rem 1rem 0.5rem 0;\n  -moz-padding-start: -3px;\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #495057;\n  background-color: transparent;\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e\");\n  background-repeat: no-repeat;\n  background-position: right 0 center;\n  background-size: 16px 12px;\n  border: 1px solid #d2d6da;\n  border-radius: 0.375rem;\n  transition: 0.2s ease;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none; }\n  @media (prefers-reduced-motion: reduce) {\n    .form-select {\n      transition: none; } }\n  .form-select:focus {\n    border-color: transparent;\n    outline: 0;\n    box-shadow: none; }\n  .form-select[multiple], .form-select[size]:not([size=\"1\"]) {\n    padding-right: 0;\n    background-image: none; }\n  .form-select:disabled {\n    color: #6c757d;\n    background-color: #f0f2f5; }\n  .form-select:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 #495057; }\n\n.form-select-sm {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n  padding-left: 0.75rem;\n  font-size: 0.75rem;\n  border-radius: 0.125rem; }\n\n.form-select-lg {\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n  padding-left: 0.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n\n.form-check {\n  display: block;\n  min-height: auto;\n  padding-left: 1.73em;\n  margin-bottom: 0.125rem; }\n  .form-check .form-check-input {\n    float: left;\n    margin-left: -1.73em; }\n\n.form-check-input {\n  width: 1.23em;\n  height: 1.23em;\n  margin-top: 0.135em;\n  vertical-align: top;\n  background-color: #fff;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: contain;\n  border: none;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none;\n  -webkit-print-color-adjust: exact;\n          color-adjust: exact;\n  transition: background-color 0.25s ease, border-color 0.25s ease, background-position 0.15s ease-in-out, opacity 0.15s ease-out, box-shadow 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .form-check-input {\n      transition: none; } }\n  .form-check-input[type=\"checkbox\"] {\n    border-radius: 0.35rem; }\n  .form-check-input[type=\"radio\"] {\n    border-radius: 50%; }\n  .form-check-input:active {\n    filter: brightness(99%); }\n  .form-check-input:focus {\n    border-color: none;\n    outline: 0;\n    box-shadow: none; }\n  .form-check-input:checked {\n    background-color: transparent;\n    border-color: transparent; }\n    .form-check-input:checked[type=\"checkbox\"] {\n      background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n    .form-check-input:checked[type=\"radio\"] {\n      background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n  .form-check-input[type=\"checkbox\"]:indeterminate {\n    background-color: #e91e63;\n    border-color: #e91e63;\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e\"); }\n  .form-check-input:disabled {\n    pointer-events: none;\n    filter: none;\n    opacity: 0.5; }\n  .form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {\n    opacity: 0.5; }\n\n.form-switch {\n  padding-left: 2.375rem; }\n  .form-switch .form-check-input {\n    width: 1.875rem;\n    margin-left: -2.375rem;\n    background-image: none;\n    background-position: left center;\n    border-radius: 1.875rem;\n    transition: background-color 0.25s ease, border-color 0.25s ease, background-position 0.15s ease-in-out, opacity 0.15s ease-out, box-shadow 0.15s ease-in-out; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-switch .form-check-input {\n        transition: none; } }\n    .form-switch .form-check-input:focus {\n      background-image: none; }\n    .form-switch .form-check-input:checked {\n      background-position: right center;\n      background-image: none; }\n\n.form-check-inline {\n  display: inline-block;\n  margin-right: 1rem; }\n\n.btn-check {\n  position: absolute;\n  clip: rect(0, 0, 0, 0);\n  pointer-events: none; }\n  .btn-check[disabled] + .btn, .btn-check:disabled + .btn {\n    pointer-events: none;\n    filter: none;\n    opacity: 0.65; }\n\n.form-range {\n  width: 100%;\n  height: calc(1rem + 4px);\n  padding: 0;\n  background-color: transparent;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none; }\n  .form-range:focus {\n    outline: 0; }\n    .form-range:focus::-webkit-slider-thumb {\n      box-shadow: 0 0 0 1px #fff, none; }\n    .form-range:focus::-moz-range-thumb {\n      box-shadow: 0 0 0 1px #fff, none; }\n  .form-range::-moz-focus-outer {\n    border: 0; }\n  .form-range::-webkit-slider-thumb {\n    width: 1rem;\n    height: 1rem;\n    margin-top: -0.25rem;\n    background-color: #e91e63;\n    border: 0;\n    border-radius: 1rem;\n    -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    -webkit-appearance: none;\n            appearance: none; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-range::-webkit-slider-thumb {\n        -webkit-transition: none;\n        transition: none; } }\n    .form-range::-webkit-slider-thumb:active {\n      background-color: #f9c1d4; }\n  .form-range::-webkit-slider-runnable-track {\n    width: 100%;\n    height: 0.5rem;\n    color: transparent;\n    cursor: pointer;\n    background-color: #dee2e6;\n    border-color: transparent;\n    border-radius: 1rem; }\n  .form-range::-moz-range-thumb {\n    width: 1rem;\n    height: 1rem;\n    background-color: #e91e63;\n    border: 0;\n    border-radius: 1rem;\n    -moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    -moz-appearance: none;\n         appearance: none; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-range::-moz-range-thumb {\n        -moz-transition: none;\n        transition: none; } }\n    .form-range::-moz-range-thumb:active {\n      background-color: #f9c1d4; }\n  .form-range::-moz-range-track {\n    width: 100%;\n    height: 0.5rem;\n    color: transparent;\n    cursor: pointer;\n    background-color: #dee2e6;\n    border-color: transparent;\n    border-radius: 1rem; }\n  .form-range:disabled {\n    pointer-events: none; }\n    .form-range:disabled::-webkit-slider-thumb {\n      background-color: #adb5bd; }\n    .form-range:disabled::-moz-range-thumb {\n      background-color: #adb5bd; }\n\n.form-floating {\n  position: relative; }\n  .form-floating > .form-control,\n  .form-floating > .form-select {\n    height: calc(3.5rem + 2px);\n    line-height: 1.25; }\n  .form-floating > label {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    padding: 1rem 0;\n    pointer-events: none;\n    border: 1px solid transparent;\n    transform-origin: 0 0;\n    transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-floating > label {\n        transition: none; } }\n  .form-floating > .form-control {\n    padding: 1rem 0; }\n    .form-floating > .form-control::-moz-placeholder {\n      color: transparent; }\n    .form-floating > .form-control:-ms-input-placeholder {\n      color: transparent; }\n    .form-floating > .form-control::placeholder {\n      color: transparent; }\n    .form-floating > .form-control:not(:-moz-placeholder-shown) {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n    .form-floating > .form-control:not(:-ms-input-placeholder) {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n    .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n    .form-floating > .form-control:-webkit-autofill {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n  .form-floating > .form-select {\n    padding-top: 1.625rem;\n    padding-bottom: 0.625rem; }\n  .form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n  .form-floating > .form-control:not(:-ms-input-placeholder) ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n  .form-floating > .form-control:focus ~ label,\n  .form-floating > .form-control:not(:placeholder-shown) ~ label,\n  .form-floating > .form-select ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n  .form-floating > .form-control:-webkit-autofill ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n\n.input-group {\n  position: relative;\n  display: flex;\n  flex-wrap: wrap;\n  align-items: stretch;\n  width: 100%; }\n  .input-group > .form-control,\n  .input-group > .form-select {\n    position: relative;\n    flex: 1 1 auto;\n    width: 1%;\n    min-width: 0; }\n  .input-group > .form-control:focus,\n  .input-group > .form-select:focus {\n    z-index: 3; }\n  .input-group .btn {\n    position: relative;\n    z-index: 2; }\n    .input-group .btn:focus {\n      z-index: 3; }\n\n.input-group-text {\n  display: flex;\n  align-items: center;\n  padding: 0.5rem 0;\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #344767;\n  text-align: center;\n  white-space: nowrap;\n  background-color: transparent;\n  border: 1px solid #d2d6da;\n  border-radius: 0.375rem; }\n\n.input-group-lg > .form-control,\n.input-group-lg > .form-select,\n.input-group-lg > .input-group-text,\n.input-group-lg > .btn {\n  padding: 0.75rem 0.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n\n.input-group-sm > .form-control,\n.input-group-sm > .form-select,\n.input-group-sm > .input-group-text,\n.input-group-sm > .btn {\n  padding: 0.25rem 0.75rem;\n  font-size: 0.75rem;\n  border-radius: 0.125rem; }\n\n.input-group-lg > .form-select,\n.input-group-sm > .form-select {\n  padding-right: 1rem; }\n\n.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),\n.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3) {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0; }\n\n.input-group.has-validation > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),\n.input-group.has-validation > .dropdown-toggle:nth-last-child(n + 4) {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0; }\n\n.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {\n  margin-left: -1px;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.valid-feedback {\n  display: none;\n  width: 100%;\n  margin-top: 0.25rem;\n  font-size: 0.875em;\n  color: #66d432; }\n\n.valid-tooltip {\n  position: absolute;\n  top: 100%;\n  z-index: 5;\n  display: none;\n  max-width: 100%;\n  padding: 0.25rem 0.5rem;\n  margin-top: .1rem;\n  font-size: 0.875rem;\n  color: #000;\n  background-color: rgba(102, 212, 50, 0.9);\n  border-radius: 0.375rem; }\n\n.was-validated :valid ~ .valid-feedback,\n.was-validated :valid ~ .valid-tooltip,\n.is-valid ~ .valid-feedback,\n.is-valid ~ .valid-tooltip {\n  display: block; }\n\n.was-validated .form-control:valid, .form-control.is-valid {\n  border-color: #66d432;\n  padding-right: unset;\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3e%3cpath fill='%2366d432' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");\n  background-repeat: no-repeat;\n  background-position: right 0.75rem center;\n  background-size: 1rem 1rem; }\n  .was-validated .form-control:valid:focus, .form-control.is-valid:focus {\n    border-color: #66d432;\n    box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.25); }\n\n.was-validated textarea.form-control:valid, textarea.form-control.is-valid {\n  padding-right: unset;\n  background-position: top 0.75rem right 0.75rem; }\n\n.was-validated .form-select:valid, .form-select.is-valid {\n  border-color: #66d432; }\n  .was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size=\"1\"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size=\"1\"] {\n    padding-right: 1rem;\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e\"), url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3e%3cpath fill='%2366d432' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");\n    background-position: right 0 center, center right 1rem;\n    background-size: 16px 12px, 1rem 1rem; }\n  .was-validated .form-select:valid:focus, .form-select.is-valid:focus {\n    border-color: #66d432;\n    box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.25); }\n\n.was-validated .form-check-input:valid, .form-check-input.is-valid {\n  border-color: #66d432; }\n  .was-validated .form-check-input:valid:checked, .form-check-input.is-valid:checked {\n    background-color: #66d432; }\n  .was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus {\n    box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.25); }\n  .was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label {\n    color: #66d432; }\n\n.form-check-inline .form-check-input ~ .valid-feedback {\n  margin-left: .5em; }\n\n.was-validated .input-group .form-control:valid, .input-group .form-control.is-valid, .was-validated\n.input-group .form-select:valid,\n.input-group .form-select.is-valid {\n  z-index: 1; }\n  .was-validated .input-group .form-control:valid:focus, .input-group .form-control.is-valid:focus, .was-validated\n  .input-group .form-select:valid:focus,\n  .input-group .form-select.is-valid:focus {\n    z-index: 3; }\n\n.invalid-feedback {\n  display: none;\n  width: 100%;\n  margin-top: 0.25rem;\n  font-size: 0.875em;\n  color: #fd5c70; }\n\n.invalid-tooltip {\n  position: absolute;\n  top: 100%;\n  z-index: 5;\n  display: none;\n  max-width: 100%;\n  padding: 0.25rem 0.5rem;\n  margin-top: .1rem;\n  font-size: 0.875rem;\n  color: #000;\n  background-color: rgba(253, 92, 112, 0.9);\n  border-radius: 0.375rem; }\n\n.was-validated :invalid ~ .invalid-feedback,\n.was-validated :invalid ~ .invalid-tooltip,\n.is-invalid ~ .invalid-feedback,\n.is-invalid ~ .invalid-tooltip {\n  display: block; }\n\n.was-validated .form-control:invalid, .form-control.is-invalid {\n  border-color: #fd5c70;\n  padding-right: unset;\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd5c70' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd5c70' stroke='none'/%3e%3c/svg%3e\");\n  background-repeat: no-repeat;\n  background-position: right 0.75rem center;\n  background-size: 1rem 1rem; }\n  .was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {\n    border-color: #fd5c70;\n    box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.25); }\n\n.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {\n  padding-right: unset;\n  background-position: top 0.75rem right 0.75rem; }\n\n.was-validated .form-select:invalid, .form-select.is-invalid {\n  border-color: #fd5c70; }\n  .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size=\"1\"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size=\"1\"] {\n    padding-right: 1rem;\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e\"), url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd5c70' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd5c70' stroke='none'/%3e%3c/svg%3e\");\n    background-position: right 0 center, center right 1rem;\n    background-size: 16px 12px, 1rem 1rem; }\n  .was-validated .form-select:invalid:focus, .form-select.is-invalid:focus {\n    border-color: #fd5c70;\n    box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.25); }\n\n.was-validated .form-check-input:invalid, .form-check-input.is-invalid {\n  border-color: #fd5c70; }\n  .was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked {\n    background-color: #fd5c70; }\n  .was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus {\n    box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.25); }\n  .was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {\n    color: #fd5c70; }\n\n.form-check-inline .form-check-input ~ .invalid-feedback {\n  margin-left: .5em; }\n\n.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid, .was-validated\n.input-group .form-select:invalid,\n.input-group .form-select.is-invalid {\n  z-index: 2; }\n  .was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus, .was-validated\n  .input-group .form-select:invalid:focus,\n  .input-group .form-select.is-invalid:focus {\n    z-index: 3; }\n\n.btn {\n  display: inline-block;\n  font-weight: 700;\n  line-height: 1.667;\n  color: #7b809a;\n  text-align: center;\n  vertical-align: middle;\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  background-color: transparent;\n  border: 1px solid transparent;\n  padding: 0.625rem 1.5rem;\n  font-size: 0.75rem;\n  border-radius: 0.5rem;\n  transition: all 0.15s ease-in; }\n  @media (prefers-reduced-motion: reduce) {\n    .btn {\n      transition: none; } }\n  .btn:hover {\n    color: #7b809a; }\n  .btn-check:focus + .btn, .btn:focus {\n    outline: 0;\n    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07); }\n  .btn:disabled, .btn.disabled,\n  fieldset:disabled .btn {\n    pointer-events: none;\n    opacity: 0.65; }\n\n.btn-primary {\n  color: #000;\n  background-color: #e91e63;\n  border-color: #e91e63; }\n  .btn-primary:hover {\n    color: #000;\n    background-color: #ec407a;\n    border-color: #eb3573; }\n  .btn-check:focus + .btn-primary, .btn-primary:focus {\n    color: #000;\n    background-color: #ec407a;\n    border-color: #eb3573;\n    box-shadow: 0 0 0 0.2rem rgba(198, 26, 84, 0.5); }\n  .btn-check:checked + .btn-primary,\n  .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active,\n  .show > .btn-primary.dropdown-toggle {\n    color: #000;\n    background-color: #ed4b82;\n    border-color: #eb3573; }\n    .btn-check:checked + .btn-primary:focus,\n    .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus,\n    .show > .btn-primary.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(198, 26, 84, 0.5); }\n  .btn-primary:disabled, .btn-primary.disabled {\n    color: #000;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n\n.btn-secondary {\n  color: #000;\n  background-color: #7b809a;\n  border-color: #7b809a; }\n  .btn-secondary:hover {\n    color: #000;\n    background-color: #8f93a9;\n    border-color: #888da4; }\n  .btn-check:focus + .btn-secondary, .btn-secondary:focus {\n    color: #000;\n    background-color: #8f93a9;\n    border-color: #888da4;\n    box-shadow: 0 0 0 0.2rem rgba(105, 109, 131, 0.5); }\n  .btn-check:checked + .btn-secondary,\n  .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active,\n  .show > .btn-secondary.dropdown-toggle {\n    color: #000;\n    background-color: #9599ae;\n    border-color: #888da4; }\n    .btn-check:checked + .btn-secondary:focus,\n    .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus,\n    .show > .btn-secondary.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(105, 109, 131, 0.5); }\n  .btn-secondary:disabled, .btn-secondary.disabled {\n    color: #000;\n    background-color: #7b809a;\n    border-color: #7b809a; }\n\n.btn-success {\n  color: #000;\n  background-color: #4CAF50;\n  border-color: #4CAF50; }\n  .btn-success:hover {\n    color: #000;\n    background-color: #67bb6a;\n    border-color: #5eb762; }\n  .btn-check:focus + .btn-success, .btn-success:focus {\n    color: #000;\n    background-color: #67bb6a;\n    border-color: #5eb762;\n    box-shadow: 0 0 0 0.2rem rgba(65, 149, 68, 0.5); }\n  .btn-check:checked + .btn-success,\n  .btn-check:active + .btn-success, .btn-success:active, .btn-success.active,\n  .show > .btn-success.dropdown-toggle {\n    color: #000;\n    background-color: #70bf73;\n    border-color: #5eb762; }\n    .btn-check:checked + .btn-success:focus,\n    .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus,\n    .show > .btn-success.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(65, 149, 68, 0.5); }\n  .btn-success:disabled, .btn-success.disabled {\n    color: #000;\n    background-color: #4CAF50;\n    border-color: #4CAF50; }\n\n.btn-info {\n  color: #fff;\n  background-color: #1A73E8;\n  border-color: #1A73E8; }\n  .btn-info:hover {\n    color: #fff;\n    background-color: #1662c5;\n    border-color: #155cba; }\n  .btn-check:focus + .btn-info, .btn-info:focus {\n    color: #fff;\n    background-color: #1662c5;\n    border-color: #155cba;\n    box-shadow: 0 0 0 0.2rem rgba(60, 136, 235, 0.5); }\n  .btn-check:checked + .btn-info,\n  .btn-check:active + .btn-info, .btn-info:active, .btn-info.active,\n  .show > .btn-info.dropdown-toggle {\n    color: #fff;\n    background-color: #155cba;\n    border-color: #1456ae; }\n    .btn-check:checked + .btn-info:focus,\n    .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus,\n    .show > .btn-info.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(60, 136, 235, 0.5); }\n  .btn-info:disabled, .btn-info.disabled {\n    color: #fff;\n    background-color: #1A73E8;\n    border-color: #1A73E8; }\n\n.btn-warning {\n  color: #000;\n  background-color: #fb8c00;\n  border-color: #fb8c00; }\n  .btn-warning:hover {\n    color: #000;\n    background-color: #fc9d26;\n    border-color: #fb981a; }\n  .btn-check:focus + .btn-warning, .btn-warning:focus {\n    color: #000;\n    background-color: #fc9d26;\n    border-color: #fb981a;\n    box-shadow: 0 0 0 0.2rem rgba(213, 119, 0, 0.5); }\n  .btn-check:checked + .btn-warning,\n  .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active,\n  .show > .btn-warning.dropdown-toggle {\n    color: #000;\n    background-color: #fca333;\n    border-color: #fb981a; }\n    .btn-check:checked + .btn-warning:focus,\n    .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus,\n    .show > .btn-warning.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(213, 119, 0, 0.5); }\n  .btn-warning:disabled, .btn-warning.disabled {\n    color: #000;\n    background-color: #fb8c00;\n    border-color: #fb8c00; }\n\n.btn-danger {\n  color: #000;\n  background-color: #F44335;\n  border-color: #F44335; }\n  .btn-danger:hover {\n    color: #000;\n    background-color: #f65f53;\n    border-color: #f55649; }\n  .btn-check:focus + .btn-danger, .btn-danger:focus {\n    color: #000;\n    background-color: #f65f53;\n    border-color: #f55649;\n    box-shadow: 0 0 0 0.2rem rgba(207, 57, 45, 0.5); }\n  .btn-check:checked + .btn-danger,\n  .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active,\n  .show > .btn-danger.dropdown-toggle {\n    color: #000;\n    background-color: #f6695d;\n    border-color: #f55649; }\n    .btn-check:checked + .btn-danger:focus,\n    .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus,\n    .show > .btn-danger.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(207, 57, 45, 0.5); }\n  .btn-danger:disabled, .btn-danger.disabled {\n    color: #000;\n    background-color: #F44335;\n    border-color: #F44335; }\n\n.btn-light {\n  color: #000;\n  background-color: #f0f2f5;\n  border-color: #f0f2f5; }\n  .btn-light:hover {\n    color: #000;\n    background-color: #f2f4f7;\n    border-color: #f2f3f6; }\n  .btn-check:focus + .btn-light, .btn-light:focus {\n    color: #000;\n    background-color: #f2f4f7;\n    border-color: #f2f3f6;\n    box-shadow: 0 0 0 0.2rem rgba(204, 206, 208, 0.5); }\n  .btn-check:checked + .btn-light,\n  .btn-check:active + .btn-light, .btn-light:active, .btn-light.active,\n  .show > .btn-light.dropdown-toggle {\n    color: #000;\n    background-color: #f3f5f7;\n    border-color: #f2f3f6; }\n    .btn-check:checked + .btn-light:focus,\n    .btn-check:active + .btn-light:focus, .btn-light:active:focus, .btn-light.active:focus,\n    .show > .btn-light.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(204, 206, 208, 0.5); }\n  .btn-light:disabled, .btn-light.disabled {\n    color: #000;\n    background-color: #f0f2f5;\n    border-color: #f0f2f5; }\n\n.btn-dark {\n  color: #fff;\n  background-color: #344767;\n  border-color: #344767; }\n  .btn-dark:hover {\n    color: #fff;\n    background-color: #2c3c58;\n    border-color: #2a3952; }\n  .btn-check:focus + .btn-dark, .btn-dark:focus {\n    color: #fff;\n    background-color: #2c3c58;\n    border-color: #2a3952;\n    box-shadow: 0 0 0 0.2rem rgba(82, 99, 126, 0.5); }\n  .btn-check:checked + .btn-dark,\n  .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active,\n  .show > .btn-dark.dropdown-toggle {\n    color: #fff;\n    background-color: #2a3952;\n    border-color: #27354d; }\n    .btn-check:checked + .btn-dark:focus,\n    .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus,\n    .show > .btn-dark.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(82, 99, 126, 0.5); }\n  .btn-dark:disabled, .btn-dark.disabled {\n    color: #fff;\n    background-color: #344767;\n    border-color: #344767; }\n\n.btn-white {\n  color: #000;\n  background-color: #fff;\n  border-color: #fff; }\n  .btn-white:hover {\n    color: #000;\n    background-color: white;\n    border-color: white; }\n  .btn-check:focus + .btn-white, .btn-white:focus {\n    color: #000;\n    background-color: white;\n    border-color: white;\n    box-shadow: 0 0 0 0.2rem rgba(217, 217, 217, 0.5); }\n  .btn-check:checked + .btn-white,\n  .btn-check:active + .btn-white, .btn-white:active, .btn-white.active,\n  .show > .btn-white.dropdown-toggle {\n    color: #000;\n    background-color: white;\n    border-color: white; }\n    .btn-check:checked + .btn-white:focus,\n    .btn-check:active + .btn-white:focus, .btn-white:active:focus, .btn-white.active:focus,\n    .show > .btn-white.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(217, 217, 217, 0.5); }\n  .btn-white:disabled, .btn-white.disabled {\n    color: #000;\n    background-color: #fff;\n    border-color: #fff; }\n\n.btn-outline-primary {\n  color: #e91e63;\n  border-color: #e91e63; }\n  .btn-outline-primary:hover {\n    color: #000;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n  .btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus {\n    box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.5); }\n  .btn-check:checked + .btn-outline-primary,\n  .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {\n    color: #000;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n    .btn-check:checked + .btn-outline-primary:focus,\n    .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.5); }\n  .btn-outline-primary:disabled, .btn-outline-primary.disabled {\n    color: #e91e63;\n    background-color: transparent; }\n\n.btn-outline-secondary {\n  color: #7b809a;\n  border-color: #7b809a; }\n  .btn-outline-secondary:hover {\n    color: #000;\n    background-color: #7b809a;\n    border-color: #7b809a; }\n  .btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus {\n    box-shadow: 0 0 0 0.2rem rgba(123, 128, 154, 0.5); }\n  .btn-check:checked + .btn-outline-secondary,\n  .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {\n    color: #000;\n    background-color: #7b809a;\n    border-color: #7b809a; }\n    .btn-check:checked + .btn-outline-secondary:focus,\n    .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(123, 128, 154, 0.5); }\n  .btn-outline-secondary:disabled, .btn-outline-secondary.disabled {\n    color: #7b809a;\n    background-color: transparent; }\n\n.btn-outline-success {\n  color: #4CAF50;\n  border-color: #4CAF50; }\n  .btn-outline-success:hover {\n    color: #000;\n    background-color: #4CAF50;\n    border-color: #4CAF50; }\n  .btn-check:focus + .btn-outline-success, .btn-outline-success:focus {\n    box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5); }\n  .btn-check:checked + .btn-outline-success,\n  .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show {\n    color: #000;\n    background-color: #4CAF50;\n    border-color: #4CAF50; }\n    .btn-check:checked + .btn-outline-success:focus,\n    .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5); }\n  .btn-outline-success:disabled, .btn-outline-success.disabled {\n    color: #4CAF50;\n    background-color: transparent; }\n\n.btn-outline-info {\n  color: #1A73E8;\n  border-color: #1A73E8; }\n  .btn-outline-info:hover {\n    color: #fff;\n    background-color: #1A73E8;\n    border-color: #1A73E8; }\n  .btn-check:focus + .btn-outline-info, .btn-outline-info:focus {\n    box-shadow: 0 0 0 0.2rem rgba(26, 115, 232, 0.5); }\n  .btn-check:checked + .btn-outline-info,\n  .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show {\n    color: #fff;\n    background-color: #1A73E8;\n    border-color: #1A73E8; }\n    .btn-check:checked + .btn-outline-info:focus,\n    .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(26, 115, 232, 0.5); }\n  .btn-outline-info:disabled, .btn-outline-info.disabled {\n    color: #1A73E8;\n    background-color: transparent; }\n\n.btn-outline-warning {\n  color: #fb8c00;\n  border-color: #fb8c00; }\n  .btn-outline-warning:hover {\n    color: #000;\n    background-color: #fb8c00;\n    border-color: #fb8c00; }\n  .btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus {\n    box-shadow: 0 0 0 0.2rem rgba(251, 140, 0, 0.5); }\n  .btn-check:checked + .btn-outline-warning,\n  .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show {\n    color: #000;\n    background-color: #fb8c00;\n    border-color: #fb8c00; }\n    .btn-check:checked + .btn-outline-warning:focus,\n    .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(251, 140, 0, 0.5); }\n  .btn-outline-warning:disabled, .btn-outline-warning.disabled {\n    color: #fb8c00;\n    background-color: transparent; }\n\n.btn-outline-danger {\n  color: #F44335;\n  border-color: #F44335; }\n  .btn-outline-danger:hover {\n    color: #000;\n    background-color: #F44335;\n    border-color: #F44335; }\n  .btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus {\n    box-shadow: 0 0 0 0.2rem rgba(244, 67, 53, 0.5); }\n  .btn-check:checked + .btn-outline-danger,\n  .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show {\n    color: #000;\n    background-color: #F44335;\n    border-color: #F44335; }\n    .btn-check:checked + .btn-outline-danger:focus,\n    .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(244, 67, 53, 0.5); }\n  .btn-outline-danger:disabled, .btn-outline-danger.disabled {\n    color: #F44335;\n    background-color: transparent; }\n\n.btn-outline-light {\n  color: #f0f2f5;\n  border-color: #f0f2f5; }\n  .btn-outline-light:hover {\n    color: #000;\n    background-color: #f0f2f5;\n    border-color: #f0f2f5; }\n  .btn-check:focus + .btn-outline-light, .btn-outline-light:focus {\n    box-shadow: 0 0 0 0.2rem rgba(240, 242, 245, 0.5); }\n  .btn-check:checked + .btn-outline-light,\n  .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show {\n    color: #000;\n    background-color: #f0f2f5;\n    border-color: #f0f2f5; }\n    .btn-check:checked + .btn-outline-light:focus,\n    .btn-check:active + .btn-outline-light:focus, .btn-outline-light:active:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(240, 242, 245, 0.5); }\n  .btn-outline-light:disabled, .btn-outline-light.disabled {\n    color: #f0f2f5;\n    background-color: transparent; }\n\n.btn-outline-dark {\n  color: #344767;\n  border-color: #344767; }\n  .btn-outline-dark:hover {\n    color: #fff;\n    background-color: #344767;\n    border-color: #344767; }\n  .btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus {\n    box-shadow: 0 0 0 0.2rem rgba(52, 71, 103, 0.5); }\n  .btn-check:checked + .btn-outline-dark,\n  .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show {\n    color: #fff;\n    background-color: #344767;\n    border-color: #344767; }\n    .btn-check:checked + .btn-outline-dark:focus,\n    .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(52, 71, 103, 0.5); }\n  .btn-outline-dark:disabled, .btn-outline-dark.disabled {\n    color: #344767;\n    background-color: transparent; }\n\n.btn-outline-white {\n  color: #fff;\n  border-color: #fff; }\n  .btn-outline-white:hover {\n    color: #000;\n    background-color: #fff;\n    border-color: #fff; }\n  .btn-check:focus + .btn-outline-white, .btn-outline-white:focus {\n    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); }\n  .btn-check:checked + .btn-outline-white,\n  .btn-check:active + .btn-outline-white, .btn-outline-white:active, .btn-outline-white.active, .btn-outline-white.dropdown-toggle.show {\n    color: #000;\n    background-color: #fff;\n    border-color: #fff; }\n    .btn-check:checked + .btn-outline-white:focus,\n    .btn-check:active + .btn-outline-white:focus, .btn-outline-white:active:focus, .btn-outline-white.active:focus, .btn-outline-white.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); }\n  .btn-outline-white:disabled, .btn-outline-white.disabled {\n    color: #fff;\n    background-color: transparent; }\n\n.btn-link {\n  font-weight: 400;\n  color: #e91e63;\n  text-decoration: none; }\n  .btn-link:hover {\n    color: #e91e63;\n    text-decoration: none; }\n  .btn-link:focus {\n    text-decoration: none; }\n  .btn-link:disabled, .btn-link.disabled {\n    color: #6c757d; }\n\n.btn-lg, .btn-group-lg > .btn {\n  padding: 0.75rem 1.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n\n.btn-sm, .btn-group-sm > .btn {\n  padding: 0.375rem 1rem;\n  font-size: 0.75rem;\n  border-radius: 0.5rem; }\n\n.fade {\n  transition: opacity 0.15s linear; }\n  @media (prefers-reduced-motion: reduce) {\n    .fade {\n      transition: none; } }\n  .fade:not(.show) {\n    opacity: 0; }\n\n.collapse:not(.show) {\n  display: none; }\n\n.collapsing {\n  height: 0;\n  overflow: hidden;\n  transition: height 0.35s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .collapsing {\n      transition: none; } }\n  .collapsing.collapse-horizontal {\n    width: 0;\n    height: auto;\n    transition: width 0.35s ease; }\n    @media (prefers-reduced-motion: reduce) {\n      .collapsing.collapse-horizontal {\n        transition: none; } }\n\n.dropup,\n.dropend,\n.dropdown,\n.dropstart {\n  position: relative; }\n\n.dropdown-toggle {\n  white-space: nowrap; }\n  .dropdown-toggle::after {\n    display: inline-block;\n    margin-left: 0.255em;\n    vertical-align: 0.255em;\n    content: \"\";\n    border-top: 0.3em solid;\n    border-right: 0.3em solid transparent;\n    border-bottom: 0;\n    border-left: 0.3em solid transparent; }\n  .dropdown-toggle:empty::after {\n    margin-left: 0; }\n\n.dropdown-menu {\n  position: absolute;\n  z-index: 1000;\n  display: none;\n  min-width: 11rem;\n  padding: 0.5rem 0;\n  margin: 0;\n  font-size: 0.875rem;\n  color: #7b809a;\n  text-align: left;\n  list-style: none;\n  background-color: #fff;\n  background-clip: padding-box;\n  border: 0 solid transparent;\n  border-radius: 0.375rem; }\n  .dropdown-menu[data-bs-popper] {\n    top: 100%;\n    left: 0;\n    margin-top: 1.625rem; }\n\n.dropdown-menu-start {\n  --bs-position: start; }\n  .dropdown-menu-start[data-bs-popper] {\n    right: auto;\n    left: 0; }\n\n.dropdown-menu-end {\n  --bs-position: end; }\n  .dropdown-menu-end[data-bs-popper] {\n    right: 0;\n    left: auto; }\n\n@media (min-width: 576px) {\n  .dropdown-menu-sm-start {\n    --bs-position: start; }\n    .dropdown-menu-sm-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-sm-end {\n    --bs-position: end; }\n    .dropdown-menu-sm-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 768px) {\n  .dropdown-menu-md-start {\n    --bs-position: start; }\n    .dropdown-menu-md-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-md-end {\n    --bs-position: end; }\n    .dropdown-menu-md-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 992px) {\n  .dropdown-menu-lg-start {\n    --bs-position: start; }\n    .dropdown-menu-lg-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-lg-end {\n    --bs-position: end; }\n    .dropdown-menu-lg-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 1200px) {\n  .dropdown-menu-xl-start {\n    --bs-position: start; }\n    .dropdown-menu-xl-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-xl-end {\n    --bs-position: end; }\n    .dropdown-menu-xl-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 1400px) {\n  .dropdown-menu-xxl-start {\n    --bs-position: start; }\n    .dropdown-menu-xxl-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-xxl-end {\n    --bs-position: end; }\n    .dropdown-menu-xxl-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n.dropup .dropdown-menu[data-bs-popper] {\n  top: auto;\n  bottom: 100%;\n  margin-top: 0;\n  margin-bottom: 1.625rem; }\n\n.dropup .dropdown-toggle::after {\n  display: inline-block;\n  margin-left: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\";\n  border-top: 0;\n  border-right: 0.3em solid transparent;\n  border-bottom: 0.3em solid;\n  border-left: 0.3em solid transparent; }\n\n.dropup .dropdown-toggle:empty::after {\n  margin-left: 0; }\n\n.dropend .dropdown-menu[data-bs-popper] {\n  top: 0;\n  right: auto;\n  left: 100%;\n  margin-top: 0;\n  margin-left: 1.625rem; }\n\n.dropend .dropdown-toggle::after {\n  display: inline-block;\n  margin-left: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\";\n  border-top: 0.3em solid transparent;\n  border-right: 0;\n  border-bottom: 0.3em solid transparent;\n  border-left: 0.3em solid; }\n\n.dropend .dropdown-toggle:empty::after {\n  margin-left: 0; }\n\n.dropend .dropdown-toggle::after {\n  vertical-align: 0; }\n\n.dropstart .dropdown-menu[data-bs-popper] {\n  top: 0;\n  right: 100%;\n  left: auto;\n  margin-top: 0;\n  margin-right: 1.625rem; }\n\n.dropstart .dropdown-toggle::after {\n  display: inline-block;\n  margin-left: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\"; }\n\n.dropstart .dropdown-toggle::after {\n  display: none; }\n\n.dropstart .dropdown-toggle::before {\n  display: inline-block;\n  margin-right: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\";\n  border-top: 0.3em solid transparent;\n  border-right: 0.3em solid;\n  border-bottom: 0.3em solid transparent; }\n\n.dropstart .dropdown-toggle:empty::after {\n  margin-left: 0; }\n\n.dropstart .dropdown-toggle::before {\n  vertical-align: 0; }\n\n.dropdown-divider {\n  height: 0;\n  margin: 0.5rem 0;\n  overflow: hidden;\n  border-top: 1px solid transparent; }\n\n.dropdown-item {\n  display: block;\n  width: 100%;\n  padding: 0.3rem 1rem;\n  clear: both;\n  font-weight: 400;\n  color: #7b809a;\n  text-align: inherit;\n  white-space: nowrap;\n  background-color: transparent;\n  border: 0; }\n  .dropdown-item:hover, .dropdown-item:focus {\n    color: #344767;\n    background-color: #f0f2f5; }\n  .dropdown-item.active, .dropdown-item:active {\n    color: #7b809a;\n    text-decoration: none;\n    background-color: transparent; }\n  .dropdown-item.disabled, .dropdown-item:disabled {\n    color: #6c757d;\n    pointer-events: none;\n    background-color: transparent; }\n\n.dropdown-menu.show {\n  display: block; }\n\n.dropdown-header {\n  display: block;\n  padding: 0.5rem 1rem;\n  margin-bottom: 0;\n  font-size: 0.875rem;\n  color: #6c757d;\n  white-space: nowrap; }\n\n.dropdown-item-text {\n  display: block;\n  padding: 0.3rem 1rem;\n  color: #7b809a; }\n\n.dropdown-menu-dark {\n  color: #dee2e6;\n  background-color: #343a40;\n  border-color: transparent; }\n  .dropdown-menu-dark .dropdown-item {\n    color: #dee2e6; }\n    .dropdown-menu-dark .dropdown-item:hover, .dropdown-menu-dark .dropdown-item:focus {\n      color: #fff;\n      background-color: rgba(255, 255, 255, 0.15); }\n    .dropdown-menu-dark .dropdown-item.active, .dropdown-menu-dark .dropdown-item:active {\n      color: #7b809a;\n      background-color: transparent; }\n    .dropdown-menu-dark .dropdown-item.disabled, .dropdown-menu-dark .dropdown-item:disabled {\n      color: #adb5bd; }\n  .dropdown-menu-dark .dropdown-divider {\n    border-color: transparent; }\n  .dropdown-menu-dark .dropdown-item-text {\n    color: #dee2e6; }\n  .dropdown-menu-dark .dropdown-header {\n    color: #adb5bd; }\n\n.btn-group,\n.btn-group-vertical {\n  position: relative;\n  display: inline-flex;\n  vertical-align: middle; }\n  .btn-group > .btn,\n  .btn-group-vertical > .btn {\n    position: relative;\n    flex: 1 1 auto; }\n  .btn-group > .btn-check:checked + .btn,\n  .btn-group > .btn-check:focus + .btn,\n  .btn-group > .btn:hover,\n  .btn-group > .btn:focus,\n  .btn-group > .btn:active,\n  .btn-group > .btn.active,\n  .btn-group-vertical > .btn-check:checked + .btn,\n  .btn-group-vertical > .btn-check:focus + .btn,\n  .btn-group-vertical > .btn:hover,\n  .btn-group-vertical > .btn:focus,\n  .btn-group-vertical > .btn:active,\n  .btn-group-vertical > .btn.active {\n    z-index: 1; }\n\n.btn-toolbar {\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: flex-start; }\n  .btn-toolbar .input-group {\n    width: auto; }\n\n.btn-group > .btn:not(:first-child),\n.btn-group > .btn-group:not(:first-child) {\n  margin-left: -1px; }\n\n.btn-group > .btn:not(:last-child):not(.dropdown-toggle),\n.btn-group > .btn-group:not(:last-child) > .btn {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0; }\n\n.btn-group > .btn:nth-child(n + 3),\n.btn-group > :not(.btn-check) + .btn,\n.btn-group > .btn-group:not(:first-child) > .btn {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.dropdown-toggle-split {\n  padding-right: 1.125rem;\n  padding-left: 1.125rem; }\n  .dropdown-toggle-split::after,\n  .dropup .dropdown-toggle-split::after,\n  .dropend .dropdown-toggle-split::after {\n    margin-left: 0; }\n  .dropstart .dropdown-toggle-split::before {\n    margin-right: 0; }\n\n.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {\n  padding-right: 0.75rem;\n  padding-left: 0.75rem; }\n\n.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {\n  padding-right: 1.3125rem;\n  padding-left: 1.3125rem; }\n\n.btn-group-vertical {\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center; }\n  .btn-group-vertical > .btn,\n  .btn-group-vertical > .btn-group {\n    width: 100%; }\n  .btn-group-vertical > .btn:not(:first-child),\n  .btn-group-vertical > .btn-group:not(:first-child) {\n    margin-top: -1px; }\n  .btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),\n  .btn-group-vertical > .btn-group:not(:last-child) > .btn {\n    border-bottom-right-radius: 0;\n    border-bottom-left-radius: 0; }\n  .btn-group-vertical > .btn ~ .btn,\n  .btn-group-vertical > .btn-group:not(:first-child) > .btn {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0; }\n\n.nav {\n  display: flex;\n  flex-wrap: wrap;\n  padding-left: 0;\n  margin-bottom: 0;\n  list-style: none; }\n\n.nav-link {\n  display: block;\n  padding: 0.5rem 1rem;\n  color: #e91e63;\n  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .nav-link {\n      transition: none; } }\n  .nav-link:hover, .nav-link:focus {\n    color: #e91e63; }\n  .nav-link.disabled {\n    color: #6c757d;\n    pointer-events: none;\n    cursor: default; }\n\n.nav-tabs {\n  border-bottom: 1px solid #dee2e6; }\n  .nav-tabs .nav-link {\n    margin-bottom: -1px;\n    background: none;\n    border: 1px solid transparent;\n    border-top-left-radius: 0.375rem;\n    border-top-right-radius: 0.375rem; }\n    .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {\n      border-color: #f0f2f5 #f0f2f5 #dee2e6;\n      isolation: isolate; }\n    .nav-tabs .nav-link.disabled {\n      color: #6c757d;\n      background-color: transparent;\n      border-color: transparent; }\n  .nav-tabs .nav-link.active,\n  .nav-tabs .nav-item.show .nav-link {\n    color: #495057;\n    background-color: #fff;\n    border-color: #dee2e6 #dee2e6 #fff; }\n  .nav-tabs .dropdown-menu {\n    margin-top: -1px;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0; }\n\n.nav-pills .nav-link {\n  background: none;\n  border: 0;\n  border-radius: 0.75rem; }\n\n.nav-pills .nav-link.active,\n.nav-pills .show > .nav-link {\n  color: #344767;\n  background-color: #fff; }\n\n.nav-fill > .nav-link,\n.nav-fill .nav-item {\n  flex: 1 1 auto;\n  text-align: center; }\n\n.nav-justified > .nav-link,\n.nav-justified .nav-item {\n  flex-basis: 0;\n  flex-grow: 1;\n  text-align: center; }\n\n.nav-fill .nav-item .nav-link,\n.nav-justified .nav-item .nav-link {\n  width: 100%; }\n\n.tab-content > .tab-pane {\n  display: none; }\n\n.tab-content > .active {\n  display: block; }\n\n.navbar {\n  position: relative;\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 0.5rem;\n  padding-right: 1rem;\n  padding-bottom: 0.5rem;\n  padding-left: 1rem; }\n  .navbar > .container,\n  .navbar > .container-fluid, .navbar > .container-sm, .navbar > .container-md, .navbar > .container-lg, .navbar > .container-xl, .navbar > .container-xxl {\n    display: flex;\n    flex-wrap: inherit;\n    align-items: center;\n    justify-content: space-between; }\n\n.navbar-brand {\n  padding-top: 0.40625rem;\n  padding-bottom: 0.40625rem;\n  margin-right: 1rem;\n  font-size: 1.125rem;\n  white-space: nowrap; }\n\n.navbar-nav {\n  display: flex;\n  flex-direction: column;\n  padding-left: 0;\n  margin-bottom: 0;\n  list-style: none; }\n  .navbar-nav .nav-link {\n    padding-right: 0;\n    padding-left: 0; }\n  .navbar-nav .dropdown-menu {\n    position: static; }\n\n.navbar-text {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem; }\n\n.navbar-collapse {\n  flex-basis: 100%;\n  flex-grow: 1;\n  align-items: center; }\n\n.navbar-toggler {\n  padding: 0.25rem 0.75rem;\n  font-size: 1.125rem;\n  line-height: 1;\n  background-color: transparent;\n  border: 1px solid transparent;\n  border-radius: 0.5rem;\n  transition: box-shadow 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-toggler {\n      transition: none; } }\n  .navbar-toggler:hover {\n    text-decoration: none; }\n  .navbar-toggler:focus {\n    text-decoration: none;\n    outline: 0;\n    box-shadow: 0 0 0 0.2rem; }\n\n.navbar-toggler-icon {\n  display: inline-block;\n  width: 1.5em;\n  height: 1.5em;\n  vertical-align: middle;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: 100%; }\n\n.navbar-nav-scroll {\n  max-height: var(--bs-scroll-height, 75vh);\n  overflow-y: auto; }\n\n@media (min-width: 576px) {\n  .navbar-expand-sm {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-sm .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-sm .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-sm .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-sm .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-sm .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-sm .navbar-toggler {\n      display: none; }\n    .navbar-expand-sm .offcanvas-header {\n      display: none; }\n    .navbar-expand-sm .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-sm .offcanvas-top,\n    .navbar-expand-sm .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-sm .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 768px) {\n  .navbar-expand-md {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-md .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-md .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-md .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-md .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-md .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-md .navbar-toggler {\n      display: none; }\n    .navbar-expand-md .offcanvas-header {\n      display: none; }\n    .navbar-expand-md .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-md .offcanvas-top,\n    .navbar-expand-md .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-md .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 992px) {\n  .navbar-expand-lg {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-lg .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-lg .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-lg .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-lg .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-lg .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-lg .navbar-toggler {\n      display: none; }\n    .navbar-expand-lg .offcanvas-header {\n      display: none; }\n    .navbar-expand-lg .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-lg .offcanvas-top,\n    .navbar-expand-lg .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-lg .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 1200px) {\n  .navbar-expand-xl {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-xl .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-xl .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-xl .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-xl .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-xl .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-xl .navbar-toggler {\n      display: none; }\n    .navbar-expand-xl .offcanvas-header {\n      display: none; }\n    .navbar-expand-xl .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-xl .offcanvas-top,\n    .navbar-expand-xl .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-xl .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 1400px) {\n  .navbar-expand-xxl {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-xxl .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-xxl .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-xxl .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-xxl .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-xxl .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-xxl .navbar-toggler {\n      display: none; }\n    .navbar-expand-xxl .offcanvas-header {\n      display: none; }\n    .navbar-expand-xxl .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-xxl .offcanvas-top,\n    .navbar-expand-xxl .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-xxl .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n.navbar-expand {\n  flex-wrap: nowrap;\n  justify-content: flex-start; }\n  .navbar-expand .navbar-nav {\n    flex-direction: row; }\n    .navbar-expand .navbar-nav .dropdown-menu {\n      position: absolute; }\n    .navbar-expand .navbar-nav .nav-link {\n      padding-right: 0.5rem;\n      padding-left: 0.5rem; }\n  .navbar-expand .navbar-nav-scroll {\n    overflow: visible; }\n  .navbar-expand .navbar-collapse {\n    display: flex !important;\n    flex-basis: auto; }\n  .navbar-expand .navbar-toggler {\n    display: none; }\n  .navbar-expand .offcanvas-header {\n    display: none; }\n  .navbar-expand .offcanvas {\n    position: inherit;\n    bottom: 0;\n    z-index: 1000;\n    flex-grow: 1;\n    visibility: visible !important;\n    background-color: transparent;\n    border-right: 0;\n    border-left: 0;\n    transition: none;\n    transform: none; }\n  .navbar-expand .offcanvas-top,\n  .navbar-expand .offcanvas-bottom {\n    height: auto;\n    border-top: 0;\n    border-bottom: 0; }\n  .navbar-expand .offcanvas-body {\n    display: flex;\n    flex-grow: 0;\n    padding: 0;\n    overflow-y: visible; }\n\n.navbar-light .navbar-brand {\n  color: rgba(52, 71, 103, 0.9); }\n  .navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {\n    color: rgba(52, 71, 103, 0.9); }\n\n.navbar-light .navbar-nav .nav-link {\n  color: #344767; }\n  .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {\n    color: rgba(52, 71, 103, 0.7); }\n  .navbar-light .navbar-nav .nav-link.disabled {\n    color: rgba(52, 71, 103, 0.3); }\n\n.navbar-light .navbar-nav .show > .nav-link,\n.navbar-light .navbar-nav .nav-link.active {\n  color: rgba(52, 71, 103, 0.9); }\n\n.navbar-light .navbar-toggler {\n  color: #344767;\n  border-color: rgba(52, 71, 103, 0.1); }\n\n.navbar-light .navbar-toggler-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23344767' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e\"); }\n\n.navbar-light .navbar-text {\n  color: #344767; }\n  .navbar-light .navbar-text a,\n  .navbar-light .navbar-text a:hover,\n  .navbar-light .navbar-text a:focus {\n    color: rgba(52, 71, 103, 0.9); }\n\n.navbar-dark .navbar-brand {\n  color: #fff; }\n  .navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {\n    color: #fff; }\n\n.navbar-dark .navbar-nav .nav-link {\n  color: rgba(255, 255, 255, 0.85); }\n  .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {\n    color: rgba(255, 255, 255, 0.75); }\n  .navbar-dark .navbar-nav .nav-link.disabled {\n    color: rgba(255, 255, 255, 0.25); }\n\n.navbar-dark .navbar-nav .show > .nav-link,\n.navbar-dark .navbar-nav .nav-link.active {\n  color: #fff; }\n\n.navbar-dark .navbar-toggler {\n  color: rgba(255, 255, 255, 0.85);\n  border-color: rgba(255, 255, 255, 0.1); }\n\n.navbar-dark .navbar-toggler-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e\"); }\n\n.navbar-dark .navbar-text {\n  color: rgba(255, 255, 255, 0.85); }\n  .navbar-dark .navbar-text a,\n  .navbar-dark .navbar-text a:hover,\n  .navbar-dark .navbar-text a:focus {\n    color: #fff; }\n\n.card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  word-wrap: break-word;\n  background-color: #fff;\n  background-clip: border-box;\n  border: 0 solid rgba(0, 0, 0, 0.125);\n  border-radius: 0.75rem; }\n  .card > hr {\n    margin-right: 0;\n    margin-left: 0; }\n  .card > .list-group {\n    border-top: inherit;\n    border-bottom: inherit; }\n    .card > .list-group:first-child {\n      border-top-width: 0;\n      border-top-left-radius: 0.75rem;\n      border-top-right-radius: 0.75rem; }\n    .card > .list-group:last-child {\n      border-bottom-width: 0;\n      border-bottom-right-radius: 0.75rem;\n      border-bottom-left-radius: 0.75rem; }\n  .card > .card-header + .list-group,\n  .card > .list-group + .card-footer {\n    border-top: 0; }\n\n.card-body {\n  flex: 1 1 auto;\n  padding: 1rem 1rem; }\n\n.card-title {\n  margin-bottom: 0.5rem; }\n\n.card-subtitle {\n  margin-top: -0.25rem;\n  margin-bottom: 0; }\n\n.card-text:last-child {\n  margin-bottom: 0; }\n\n.card-link + .card-link {\n  margin-left: 1rem; }\n\n.card-header {\n  padding: 0.5rem 1rem;\n  margin-bottom: 0;\n  background-color: #fff;\n  border-bottom: 0 solid rgba(0, 0, 0, 0.125); }\n  .card-header:first-child {\n    border-radius: 0.75rem 0.75rem 0 0; }\n\n.card-footer {\n  padding: 0.5rem 1rem;\n  background-color: #fff;\n  border-top: 0 solid rgba(0, 0, 0, 0.125); }\n  .card-footer:last-child {\n    border-radius: 0 0 0.75rem 0.75rem; }\n\n.card-header-tabs {\n  margin-right: -0.5rem;\n  margin-bottom: -0.5rem;\n  margin-left: -0.5rem;\n  border-bottom: 0; }\n\n.card-header-pills {\n  margin-right: -0.5rem;\n  margin-left: -0.5rem; }\n\n.card-img-overlay {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  padding: 1rem;\n  border-radius: 0.75rem; }\n\n.card-img,\n.card-img-top,\n.card-img-bottom {\n  width: 100%; }\n\n.card-img,\n.card-img-top {\n  border-top-left-radius: 0.75rem;\n  border-top-right-radius: 0.75rem; }\n\n.card-img,\n.card-img-bottom {\n  border-bottom-right-radius: 0.75rem;\n  border-bottom-left-radius: 0.75rem; }\n\n.card-group > .card {\n  margin-bottom: 0.75rem; }\n\n@media (min-width: 576px) {\n  .card-group {\n    display: flex;\n    flex-flow: row wrap; }\n    .card-group > .card {\n      flex: 1 0 0%;\n      margin-bottom: 0; }\n      .card-group > .card + .card {\n        margin-left: 0;\n        border-left: 0; }\n      .card-group > .card:not(:last-child) {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0; }\n        .card-group > .card:not(:last-child) .card-img-top,\n        .card-group > .card:not(:last-child) .card-header {\n          border-top-right-radius: 0; }\n        .card-group > .card:not(:last-child) .card-img-bottom,\n        .card-group > .card:not(:last-child) .card-footer {\n          border-bottom-right-radius: 0; }\n      .card-group > .card:not(:first-child) {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0; }\n        .card-group > .card:not(:first-child) .card-img-top,\n        .card-group > .card:not(:first-child) .card-header {\n          border-top-left-radius: 0; }\n        .card-group > .card:not(:first-child) .card-img-bottom,\n        .card-group > .card:not(:first-child) .card-footer {\n          border-bottom-left-radius: 0; } }\n\n.accordion-button {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  padding: 1rem 0rem;\n  font-size: 1rem;\n  color: #7b809a;\n  text-align: left;\n  background-color: transparent;\n  border: 0;\n  border-radius: 0;\n  overflow-anchor: none;\n  transition: all 0.15s ease-in, border-radius 0.15s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .accordion-button {\n      transition: none; } }\n  .accordion-button:not(.collapsed) {\n    color: #344767;\n    background-color: transparent;\n    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.125); }\n    .accordion-button:not(.collapsed)::after {\n      background-image: none;\n      transform: rotate(180deg); }\n  .accordion-button::after {\n    flex-shrink: 0;\n    width: 1rem;\n    height: 1rem;\n    margin-left: auto;\n    content: \"\";\n    background-image: none;\n    background-repeat: no-repeat;\n    background-size: 1rem;\n    transition: transform 0.2s ease-in-out; }\n    @media (prefers-reduced-motion: reduce) {\n      .accordion-button::after {\n        transition: none; } }\n  .accordion-button:hover {\n    z-index: 2; }\n  .accordion-button:focus {\n    z-index: 3;\n    border-color: transparent;\n    outline: 0;\n    box-shadow: none; }\n\n.accordion-header {\n  margin-bottom: 0; }\n\n.accordion-item {\n  background-color: transparent;\n  border: 0 solid rgba(0, 0, 0, 0.125); }\n  .accordion-item:first-of-type {\n    border-top-left-radius: 0.125rem;\n    border-top-right-radius: 0.125rem; }\n    .accordion-item:first-of-type .accordion-button {\n      border-top-left-radius: 0.125rem;\n      border-top-right-radius: 0.125rem; }\n  .accordion-item:not(:first-of-type) {\n    border-top: 0; }\n  .accordion-item:last-of-type {\n    border-bottom-right-radius: 0.125rem;\n    border-bottom-left-radius: 0.125rem; }\n    .accordion-item:last-of-type .accordion-button.collapsed {\n      border-bottom-right-radius: 0.125rem;\n      border-bottom-left-radius: 0.125rem; }\n    .accordion-item:last-of-type .accordion-collapse {\n      border-bottom-right-radius: 0.125rem;\n      border-bottom-left-radius: 0.125rem; }\n\n.accordion-body {\n  padding: 1rem 0rem; }\n\n.accordion-flush .accordion-collapse {\n  border-width: 0; }\n\n.accordion-flush .accordion-item {\n  border-right: 0;\n  border-left: 0;\n  border-radius: 0; }\n  .accordion-flush .accordion-item:first-child {\n    border-top: 0; }\n  .accordion-flush .accordion-item:last-child {\n    border-bottom: 0; }\n  .accordion-flush .accordion-item .accordion-button {\n    border-radius: 0; }\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  padding: 0.5rem 1rem;\n  margin-bottom: 1rem;\n  list-style: none;\n  background-color: #f0f2f5;\n  border-radius: 0.375rem; }\n\n.breadcrumb-item + .breadcrumb-item {\n  padding-left: 0.5rem; }\n  .breadcrumb-item + .breadcrumb-item::before {\n    float: left;\n    padding-right: 0.5rem;\n    color: #6c757d;\n    content: var(--bs-breadcrumb-divider, \"/\") /* rtl: var(--bs-breadcrumb-divider, \"/\") */; }\n\n.breadcrumb-item.active {\n  color: #6c757d; }\n\n.pagination {\n  display: flex;\n  padding-left: 0;\n  list-style: none; }\n\n.page-link {\n  position: relative;\n  display: block;\n  color: #e91e63;\n  background-color: #fff;\n  border: 1px solid #dee2e6;\n  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .page-link {\n      transition: none; } }\n  .page-link:hover {\n    z-index: 2;\n    color: #e91e63;\n    background-color: #f0f2f5;\n    border-color: #dee2e6; }\n  .page-link:focus {\n    z-index: 3;\n    color: #e91e63;\n    background-color: #f0f2f5;\n    outline: 0;\n    box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.25); }\n\n.page-item:not(:first-child) .page-link {\n  margin-left: -1px; }\n\n.page-item.active .page-link {\n  z-index: 3;\n  color: #fff;\n  background-color: #e91e63;\n  border-color: #e91e63; }\n\n.page-item.disabled .page-link {\n  color: #6c757d;\n  pointer-events: none;\n  background-color: #fff;\n  border-color: #dee2e6; }\n\n.page-link {\n  padding: 0.375rem 0.75rem; }\n\n.page-item:first-child .page-link {\n  border-top-left-radius: 0.375rem;\n  border-bottom-left-radius: 0.375rem; }\n\n.page-item:last-child .page-link {\n  border-top-right-radius: 0.375rem;\n  border-bottom-right-radius: 0.375rem; }\n\n.pagination-lg .page-link {\n  padding: 0.75rem 1.5rem;\n  font-size: 1.125rem; }\n\n.pagination-lg .page-item:first-child .page-link {\n  border-top-left-radius: 0.5rem;\n  border-bottom-left-radius: 0.5rem; }\n\n.pagination-lg .page-item:last-child .page-link {\n  border-top-right-radius: 0.5rem;\n  border-bottom-right-radius: 0.5rem; }\n\n.pagination-sm .page-link {\n  padding: 0.25rem 0.5rem;\n  font-size: 0.875rem; }\n\n.pagination-sm .page-item:first-child .page-link {\n  border-top-left-radius: 0.125rem;\n  border-bottom-left-radius: 0.125rem; }\n\n.pagination-sm .page-item:last-child .page-link {\n  border-top-right-radius: 0.125rem;\n  border-bottom-right-radius: 0.125rem; }\n\n.badge {\n  display: inline-block;\n  padding: 0.55em 0.9em;\n  font-size: 0.75em;\n  font-weight: 700;\n  line-height: 1;\n  color: #fff;\n  text-align: center;\n  white-space: nowrap;\n  vertical-align: baseline;\n  border-radius: 0.45rem; }\n  .badge:empty {\n    display: none; }\n\n.btn .badge {\n  position: relative;\n  top: -1px; }\n\n.alert {\n  position: relative;\n  padding: 1rem 1rem;\n  margin-bottom: 1rem;\n  border: 0 solid transparent;\n  border-radius: 0.375rem; }\n\n.alert-heading {\n  color: inherit; }\n\n.alert-link {\n  font-weight: 600; }\n\n.alert-dismissible {\n  padding-right: 3rem; }\n  .alert-dismissible .btn-close {\n    position: absolute;\n    top: 0;\n    right: 0;\n    z-index: 2;\n    padding: 1.25rem 1rem; }\n\n.alert-primary {\n  color: #8c123b;\n  background-color: #fbd2e0;\n  border-color: #f8bcd0; }\n  .alert-primary .alert-link {\n    color: #700e2f; }\n\n.alert-secondary {\n  color: #4a4d5c;\n  background-color: #e5e6eb;\n  border-color: #d7d9e1; }\n  .alert-secondary .alert-link {\n    color: #3b3e4a; }\n\n.alert-success {\n  color: #2e6930;\n  background-color: #dbefdc;\n  border-color: #c9e7cb; }\n  .alert-success .alert-link {\n    color: #255426; }\n\n.alert-info {\n  color: #10458b;\n  background-color: #d1e3fa;\n  border-color: #bad5f8; }\n  .alert-info .alert-link {\n    color: #0d376f; }\n\n.alert-warning {\n  color: #975400;\n  background-color: #fee8cc;\n  border-color: #feddb3; }\n  .alert-warning .alert-link {\n    color: #794300; }\n\n.alert-danger {\n  color: #922820;\n  background-color: #fdd9d7;\n  border-color: #fcc7c2; }\n  .alert-danger .alert-link {\n    color: #75201a; }\n\n.alert-light {\n  color: #606162;\n  background-color: #fcfcfd;\n  border-color: #fbfbfc; }\n  .alert-light .alert-link {\n    color: #4d4e4e; }\n\n.alert-dark {\n  color: #1f2b3e;\n  background-color: #d6dae1;\n  border-color: #c2c8d1; }\n  .alert-dark .alert-link {\n    color: #192232; }\n\n.alert-white {\n  color: #666666;\n  background-color: white;\n  border-color: white; }\n  .alert-white .alert-link {\n    color: #525252; }\n\n@-webkit-keyframes progress-bar-stripes {\n  0% {\n    background-position-x: 6px; } }\n\n@keyframes progress-bar-stripes {\n  0% {\n    background-position-x: 6px; } }\n\n.progress {\n  display: flex;\n  height: 6px;\n  overflow: hidden;\n  font-size: 0.75rem;\n  background-color: #f0f2f5;\n  border-radius: 0.125rem; }\n\n.progress-bar {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  overflow: hidden;\n  color: #fff;\n  text-align: center;\n  white-space: nowrap;\n  background-color: #e91e63;\n  transition: width 0.6s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .progress-bar {\n      transition: none; } }\n\n.progress-bar-striped {\n  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\n  background-size: 6px 6px; }\n\n.progress-bar-animated {\n  -webkit-animation: 1s linear infinite progress-bar-stripes;\n          animation: 1s linear infinite progress-bar-stripes; }\n  @media (prefers-reduced-motion: reduce) {\n    .progress-bar-animated {\n      -webkit-animation: none;\n              animation: none; } }\n\n.list-group {\n  display: flex;\n  flex-direction: column;\n  padding-left: 0;\n  margin-bottom: 0;\n  border-radius: 0.375rem; }\n\n.list-group-numbered {\n  list-style-type: none;\n  counter-reset: section; }\n  .list-group-numbered > li::before {\n    content: counters(section, \".\") \". \";\n    counter-increment: section; }\n\n.list-group-item-action {\n  width: 100%;\n  color: #495057;\n  text-align: inherit; }\n  .list-group-item-action:hover, .list-group-item-action:focus {\n    z-index: 1;\n    color: #495057;\n    text-decoration: none;\n    background-color: #f8f9fa; }\n  .list-group-item-action:active {\n    color: #7b809a;\n    background-color: #f0f2f5; }\n\n.list-group-item {\n  position: relative;\n  display: block;\n  padding: 0.5rem 1rem;\n  color: inherit;\n  background-color: #fff;\n  border: 1px solid rgba(0, 0, 0, 0.125); }\n  .list-group-item:first-child {\n    border-top-left-radius: inherit;\n    border-top-right-radius: inherit; }\n  .list-group-item:last-child {\n    border-bottom-right-radius: inherit;\n    border-bottom-left-radius: inherit; }\n  .list-group-item.disabled, .list-group-item:disabled {\n    color: #6c757d;\n    pointer-events: none;\n    background-color: #fff; }\n  .list-group-item.active {\n    z-index: 2;\n    color: #fff;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n  .list-group-item + .list-group-item {\n    border-top-width: 0; }\n    .list-group-item + .list-group-item.active {\n      margin-top: -1px;\n      border-top-width: 1px; }\n\n.list-group-horizontal {\n  flex-direction: row; }\n  .list-group-horizontal > .list-group-item:first-child {\n    border-bottom-left-radius: 0.375rem;\n    border-top-right-radius: 0; }\n  .list-group-horizontal > .list-group-item:last-child {\n    border-top-right-radius: 0.375rem;\n    border-bottom-left-radius: 0; }\n  .list-group-horizontal > .list-group-item.active {\n    margin-top: 0; }\n  .list-group-horizontal > .list-group-item + .list-group-item {\n    border-top-width: 1px;\n    border-left-width: 0; }\n    .list-group-horizontal > .list-group-item + .list-group-item.active {\n      margin-left: -1px;\n      border-left-width: 1px; }\n\n@media (min-width: 576px) {\n  .list-group-horizontal-sm {\n    flex-direction: row; }\n    .list-group-horizontal-sm > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-sm > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-sm > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-sm > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-sm > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 768px) {\n  .list-group-horizontal-md {\n    flex-direction: row; }\n    .list-group-horizontal-md > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-md > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-md > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-md > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-md > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 992px) {\n  .list-group-horizontal-lg {\n    flex-direction: row; }\n    .list-group-horizontal-lg > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-lg > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-lg > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-lg > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-lg > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 1200px) {\n  .list-group-horizontal-xl {\n    flex-direction: row; }\n    .list-group-horizontal-xl > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-xl > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-xl > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-xl > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-xl > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 1400px) {\n  .list-group-horizontal-xxl {\n    flex-direction: row; }\n    .list-group-horizontal-xxl > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-xxl > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-xxl > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-xxl > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-xxl > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n.list-group-flush {\n  border-radius: 0; }\n  .list-group-flush > .list-group-item {\n    border-width: 0 0 1px; }\n    .list-group-flush > .list-group-item:last-child {\n      border-bottom-width: 0; }\n\n.list-group-item-primary {\n  color: #8c123b;\n  background-color: #fbd2e0; }\n  .list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {\n    color: #8c123b;\n    background-color: #e2bdca; }\n  .list-group-item-primary.list-group-item-action.active {\n    color: #fff;\n    background-color: #8c123b;\n    border-color: #8c123b; }\n\n.list-group-item-secondary {\n  color: #4a4d5c;\n  background-color: #e5e6eb; }\n  .list-group-item-secondary.list-group-item-action:hover, .list-group-item-secondary.list-group-item-action:focus {\n    color: #4a4d5c;\n    background-color: #cecfd4; }\n  .list-group-item-secondary.list-group-item-action.active {\n    color: #fff;\n    background-color: #4a4d5c;\n    border-color: #4a4d5c; }\n\n.list-group-item-success {\n  color: #2e6930;\n  background-color: #dbefdc; }\n  .list-group-item-success.list-group-item-action:hover, .list-group-item-success.list-group-item-action:focus {\n    color: #2e6930;\n    background-color: #c5d7c6; }\n  .list-group-item-success.list-group-item-action.active {\n    color: #fff;\n    background-color: #2e6930;\n    border-color: #2e6930; }\n\n.list-group-item-info {\n  color: #10458b;\n  background-color: #d1e3fa; }\n  .list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {\n    color: #10458b;\n    background-color: #bccce1; }\n  .list-group-item-info.list-group-item-action.active {\n    color: #fff;\n    background-color: #10458b;\n    border-color: #10458b; }\n\n.list-group-item-warning {\n  color: #975400;\n  background-color: #fee8cc; }\n  .list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {\n    color: #975400;\n    background-color: #e5d1b8; }\n  .list-group-item-warning.list-group-item-action.active {\n    color: #fff;\n    background-color: #975400;\n    border-color: #975400; }\n\n.list-group-item-danger {\n  color: #922820;\n  background-color: #fdd9d7; }\n  .list-group-item-danger.list-group-item-action:hover, .list-group-item-danger.list-group-item-action:focus {\n    color: #922820;\n    background-color: #e4c3c2; }\n  .list-group-item-danger.list-group-item-action.active {\n    color: #fff;\n    background-color: #922820;\n    border-color: #922820; }\n\n.list-group-item-light {\n  color: #606162;\n  background-color: #fcfcfd; }\n  .list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {\n    color: #606162;\n    background-color: #e3e3e4; }\n  .list-group-item-light.list-group-item-action.active {\n    color: #fff;\n    background-color: #606162;\n    border-color: #606162; }\n\n.list-group-item-dark {\n  color: #1f2b3e;\n  background-color: #d6dae1; }\n  .list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus {\n    color: #1f2b3e;\n    background-color: #c1c4cb; }\n  .list-group-item-dark.list-group-item-action.active {\n    color: #fff;\n    background-color: #1f2b3e;\n    border-color: #1f2b3e; }\n\n.list-group-item-white {\n  color: #666666;\n  background-color: white; }\n  .list-group-item-white.list-group-item-action:hover, .list-group-item-white.list-group-item-action:focus {\n    color: #666666;\n    background-color: #e6e6e6; }\n  .list-group-item-white.list-group-item-action.active {\n    color: #fff;\n    background-color: #666666;\n    border-color: #666666; }\n\n.btn-close {\n  box-sizing: content-box;\n  width: 1em;\n  height: 1em;\n  padding: 0.25em 0.25em;\n  color: #fff;\n  background: transparent url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e\") center/1em auto no-repeat;\n  border: 0;\n  border-radius: 0.25rem;\n  opacity: 0.5; }\n  .btn-close:hover {\n    color: #fff;\n    text-decoration: none;\n    opacity: 0.75; }\n  .btn-close:focus {\n    outline: 0;\n    box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.25);\n    opacity: 1; }\n  .btn-close:disabled, .btn-close.disabled {\n    pointer-events: none;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    opacity: 0.25; }\n\n.btn-close-white {\n  filter: invert(1) grayscale(100%) brightness(200%); }\n\n.toast {\n  width: 350px;\n  max-width: 100%;\n  font-size: 0.875rem;\n  pointer-events: auto;\n  background-color: rgba(255, 255, 255, 0.85);\n  background-clip: padding-box;\n  border: 0 solid transparent;\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  border-radius: 0.375rem; }\n  .toast.showing {\n    opacity: 0; }\n  .toast:not(.show) {\n    display: none; }\n\n.toast-container {\n  width: -webkit-max-content;\n  width: -moz-max-content;\n  width: max-content;\n  max-width: 100%;\n  pointer-events: none; }\n  .toast-container > :not(:last-child) {\n    margin-bottom: 1.5rem; }\n\n.toast-header {\n  display: flex;\n  align-items: center;\n  padding: 0.75rem 0.75rem;\n  color: #344767;\n  background-color: rgba(255, 255, 255, 0.85);\n  background-clip: padding-box;\n  border-bottom: 0 solid rgba(0, 0, 0, 0.05);\n  border-top-left-radius: 0.375rem;\n  border-top-right-radius: 0.375rem; }\n  .toast-header .btn-close {\n    margin-right: -0.375rem;\n    margin-left: 0.75rem; }\n\n.toast-body {\n  padding: 0.75rem;\n  word-wrap: break-word; }\n\n.modal {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1050;\n  display: none;\n  width: 100%;\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  outline: 0; }\n\n.modal-dialog {\n  position: relative;\n  width: auto;\n  margin: 0.5rem;\n  pointer-events: none; }\n  .modal.fade .modal-dialog {\n    transition: transform 0.3s ease-out;\n    transform: translate(0, -50px); }\n    @media (prefers-reduced-motion: reduce) {\n      .modal.fade .modal-dialog {\n        transition: none; } }\n  .modal.show .modal-dialog {\n    transform: none; }\n  .modal.modal-static .modal-dialog {\n    transform: scale(1.02); }\n\n.modal-dialog-scrollable {\n  height: calc(100% - 1rem); }\n  .modal-dialog-scrollable .modal-content {\n    max-height: 100%;\n    overflow: hidden; }\n  .modal-dialog-scrollable .modal-body {\n    overflow-y: auto; }\n\n.modal-dialog-centered {\n  display: flex;\n  align-items: center;\n  min-height: calc(100% - 1rem); }\n\n.modal-content {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  pointer-events: auto;\n  background-color: #fff;\n  background-clip: padding-box;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n  border-radius: 0.5rem;\n  outline: 0; }\n\n.modal-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1040;\n  width: 100vw;\n  height: 100vh;\n  background-color: #000; }\n  .modal-backdrop.fade {\n    opacity: 0; }\n  .modal-backdrop.show {\n    opacity: 0.5; }\n\n.modal-header {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: space-between;\n  padding: 1rem 1rem;\n  border-bottom: 1px solid #dee2e6;\n  border-top-left-radius: calc(0.5rem - 1px);\n  border-top-right-radius: calc(0.5rem - 1px); }\n  .modal-header .btn-close {\n    padding: 0.5rem 0.5rem;\n    margin: -0.5rem -0.5rem -0.5rem auto; }\n\n.modal-title {\n  margin-bottom: 0;\n  line-height: 1.5; }\n\n.modal-body {\n  position: relative;\n  flex: 1 1 auto;\n  padding: 1rem; }\n\n.modal-footer {\n  display: flex;\n  flex-wrap: wrap;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: flex-end;\n  padding: 0.75rem;\n  border-top: 1px solid #dee2e6;\n  border-bottom-right-radius: calc(0.5rem - 1px);\n  border-bottom-left-radius: calc(0.5rem - 1px); }\n  .modal-footer > * {\n    margin: 0.25rem; }\n\n@media (min-width: 576px) {\n  .modal-dialog {\n    max-width: 500px;\n    margin: 1.75rem auto; }\n  .modal-dialog-scrollable {\n    height: calc(100% - 3.5rem); }\n  .modal-dialog-centered {\n    min-height: calc(100% - 3.5rem); }\n  .modal-sm {\n    max-width: 300px; } }\n\n@media (min-width: 992px) {\n  .modal-lg,\n  .modal-xl {\n    max-width: 800px; } }\n\n@media (min-width: 1200px) {\n  .modal-xl {\n    max-width: 1140px; } }\n\n.modal-fullscreen {\n  width: 100vw;\n  max-width: none;\n  height: 100%;\n  margin: 0; }\n  .modal-fullscreen .modal-content {\n    height: 100%;\n    border: 0;\n    border-radius: 0; }\n  .modal-fullscreen .modal-header {\n    border-radius: 0; }\n  .modal-fullscreen .modal-body {\n    overflow-y: auto; }\n  .modal-fullscreen .modal-footer {\n    border-radius: 0; }\n\n@media (max-width: 575.98px) {\n  .modal-fullscreen-sm-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-sm-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-sm-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-sm-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-sm-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 767.98px) {\n  .modal-fullscreen-md-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-md-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-md-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-md-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-md-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 991.98px) {\n  .modal-fullscreen-lg-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-lg-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-lg-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-lg-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-lg-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 1199.98px) {\n  .modal-fullscreen-xl-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-xl-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-xl-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-xl-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-xl-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 1399.98px) {\n  .modal-fullscreen-xxl-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-xxl-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-xxl-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-xxl-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-xxl-down .modal-footer {\n      border-radius: 0; } }\n\n.tooltip {\n  position: absolute;\n  z-index: 1070;\n  display: block;\n  margin: 0;\n  font-family: var(--bs-font-sans-serif);\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1.5;\n  text-align: left;\n  text-align: start;\n  text-decoration: none;\n  text-shadow: none;\n  text-transform: none;\n  letter-spacing: normal;\n  word-break: normal;\n  word-spacing: normal;\n  white-space: normal;\n  line-break: auto;\n  font-size: 0.875rem;\n  word-wrap: break-word;\n  opacity: 0; }\n  .tooltip.show {\n    opacity: 0.9; }\n  .tooltip .tooltip-arrow {\n    position: absolute;\n    display: block;\n    width: 0.8rem;\n    height: 0.4rem; }\n    .tooltip .tooltip-arrow::before {\n      position: absolute;\n      content: \"\";\n      border-color: transparent;\n      border-style: solid; }\n\n.bs-tooltip-top, .bs-tooltip-auto[data-popper-placement^=\"top\"] {\n  padding: 0.4rem 0; }\n  .bs-tooltip-top .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"top\"] .tooltip-arrow {\n    bottom: 0; }\n    .bs-tooltip-top .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"top\"] .tooltip-arrow::before {\n      top: -1px;\n      border-width: 0.4rem 0.4rem 0;\n      border-top-color: #000; }\n\n.bs-tooltip-end, .bs-tooltip-auto[data-popper-placement^=\"right\"] {\n  padding: 0 0.4rem; }\n  .bs-tooltip-end .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"right\"] .tooltip-arrow {\n    left: 0;\n    width: 0.4rem;\n    height: 0.8rem; }\n    .bs-tooltip-end .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"right\"] .tooltip-arrow::before {\n      right: -1px;\n      border-width: 0.4rem 0.4rem 0.4rem 0;\n      border-right-color: #000; }\n\n.bs-tooltip-bottom, .bs-tooltip-auto[data-popper-placement^=\"bottom\"] {\n  padding: 0.4rem 0; }\n  .bs-tooltip-bottom .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"bottom\"] .tooltip-arrow {\n    top: 0; }\n    .bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"bottom\"] .tooltip-arrow::before {\n      bottom: -1px;\n      border-width: 0 0.4rem 0.4rem;\n      border-bottom-color: #000; }\n\n.bs-tooltip-start, .bs-tooltip-auto[data-popper-placement^=\"left\"] {\n  padding: 0 0.4rem; }\n  .bs-tooltip-start .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"left\"] .tooltip-arrow {\n    right: 0;\n    width: 0.4rem;\n    height: 0.8rem; }\n    .bs-tooltip-start .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"left\"] .tooltip-arrow::before {\n      left: -1px;\n      border-width: 0.4rem 0 0.4rem 0.4rem;\n      border-left-color: #000; }\n\n.tooltip-inner {\n  max-width: 200px;\n  padding: 0.25rem 0.5rem;\n  color: #fff;\n  text-align: center;\n  background-color: #000;\n  border-radius: 0.375rem; }\n\n.popover {\n  position: absolute;\n  top: 0;\n  left: 0 /* rtl:ignore */;\n  z-index: 1060;\n  display: block;\n  max-width: 276px;\n  font-family: var(--bs-font-sans-serif);\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1.5;\n  text-align: left;\n  text-align: start;\n  text-decoration: none;\n  text-shadow: none;\n  text-transform: none;\n  letter-spacing: normal;\n  word-break: normal;\n  word-spacing: normal;\n  white-space: normal;\n  line-break: auto;\n  font-size: 0.75rem;\n  word-wrap: break-word;\n  background-color: #fff;\n  background-clip: padding-box;\n  border: 0px solid rgba(0, 0, 0, 0.2);\n  border-radius: 0.5rem; }\n  .popover .popover-arrow {\n    position: absolute;\n    display: block;\n    width: 1rem;\n    height: 0.5rem; }\n    .popover .popover-arrow::before, .popover .popover-arrow::after {\n      position: absolute;\n      display: block;\n      content: \"\";\n      border-color: transparent;\n      border-style: solid; }\n\n.bs-popover-top > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"top\"] > .popover-arrow {\n  bottom: calc(-0.5rem - 0px); }\n  .bs-popover-top > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"top\"] > .popover-arrow::before {\n    bottom: 0;\n    border-width: 0.5rem 0.5rem 0;\n    border-top-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-top > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"top\"] > .popover-arrow::after {\n    bottom: 0px;\n    border-width: 0.5rem 0.5rem 0;\n    border-top-color: #fff; }\n\n.bs-popover-end > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"right\"] > .popover-arrow {\n  left: calc(-0.5rem - 0px);\n  width: 0.5rem;\n  height: 1rem; }\n  .bs-popover-end > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"right\"] > .popover-arrow::before {\n    left: 0;\n    border-width: 0.5rem 0.5rem 0.5rem 0;\n    border-right-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-end > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"right\"] > .popover-arrow::after {\n    left: 0px;\n    border-width: 0.5rem 0.5rem 0.5rem 0;\n    border-right-color: #fff; }\n\n.bs-popover-bottom > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"bottom\"] > .popover-arrow {\n  top: calc(-0.5rem - 0px); }\n  .bs-popover-bottom > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"bottom\"] > .popover-arrow::before {\n    top: 0;\n    border-width: 0 0.5rem 0.5rem 0.5rem;\n    border-bottom-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-bottom > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"bottom\"] > .popover-arrow::after {\n    top: 0px;\n    border-width: 0 0.5rem 0.5rem 0.5rem;\n    border-bottom-color: #fff; }\n\n.bs-popover-bottom .popover-header::before, .bs-popover-auto[data-popper-placement^=\"bottom\"] .popover-header::before {\n  position: absolute;\n  top: 0;\n  left: 50%;\n  display: block;\n  width: 1rem;\n  margin-left: -0.5rem;\n  content: \"\";\n  border-bottom: 0px solid #f0f2f5; }\n\n.bs-popover-start > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"left\"] > .popover-arrow {\n  right: calc(-0.5rem - 0px);\n  width: 0.5rem;\n  height: 1rem; }\n  .bs-popover-start > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"left\"] > .popover-arrow::before {\n    right: 0;\n    border-width: 0.5rem 0 0.5rem 0.5rem;\n    border-left-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-start > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"left\"] > .popover-arrow::after {\n    right: 0px;\n    border-width: 0.5rem 0 0.5rem 0.5rem;\n    border-left-color: #fff; }\n\n.popover-header {\n  padding: 0.5rem 1rem;\n  margin-bottom: 0;\n  font-size: 1rem;\n  color: #344767;\n  background-color: #f0f2f5;\n  border-bottom: 0px solid rgba(0, 0, 0, 0.2);\n  border-top-left-radius: calc(0.5rem - 0px);\n  border-top-right-radius: calc(0.5rem - 0px); }\n  .popover-header:empty {\n    display: none; }\n\n.popover-body {\n  padding: 1rem 1rem;\n  color: #7b809a; }\n\n.carousel {\n  position: relative; }\n\n.carousel.pointer-event {\n  touch-action: pan-y; }\n\n.carousel-inner {\n  position: relative;\n  width: 100%;\n  overflow: hidden; }\n  .carousel-inner::after {\n    display: block;\n    clear: both;\n    content: \"\"; }\n\n.carousel-item {\n  position: relative;\n  display: none;\n  float: left;\n  width: 100%;\n  margin-right: -100%;\n  -webkit-backface-visibility: hidden;\n          backface-visibility: hidden;\n  transition: transform 0.6s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-item {\n      transition: none; } }\n\n.carousel-item.active,\n.carousel-item-next,\n.carousel-item-prev {\n  display: block; }\n\n/* rtl:begin:ignore */\n.carousel-item-next:not(.carousel-item-start),\n.active.carousel-item-end {\n  transform: translateX(100%); }\n\n.carousel-item-prev:not(.carousel-item-end),\n.active.carousel-item-start {\n  transform: translateX(-100%); }\n\n/* rtl:end:ignore */\n.carousel-fade .carousel-item {\n  opacity: 0;\n  transition-property: opacity;\n  transform: none; }\n\n.carousel-fade .carousel-item.active,\n.carousel-fade .carousel-item-next.carousel-item-start,\n.carousel-fade .carousel-item-prev.carousel-item-end {\n  z-index: 1;\n  opacity: 1; }\n\n.carousel-fade .active.carousel-item-start,\n.carousel-fade .active.carousel-item-end {\n  z-index: 0;\n  opacity: 0;\n  transition: opacity 0s 0.6s; }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-fade .active.carousel-item-start,\n    .carousel-fade .active.carousel-item-end {\n      transition: none; } }\n\n.carousel-control-prev,\n.carousel-control-next {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 15%;\n  padding: 0;\n  color: #fff;\n  text-align: center;\n  background: none;\n  border: 0;\n  opacity: 0.5;\n  transition: opacity 0.15s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-control-prev,\n    .carousel-control-next {\n      transition: none; } }\n  .carousel-control-prev:hover, .carousel-control-prev:focus,\n  .carousel-control-next:hover,\n  .carousel-control-next:focus {\n    color: #fff;\n    text-decoration: none;\n    outline: 0;\n    opacity: 0.9; }\n\n.carousel-control-prev {\n  left: 0; }\n\n.carousel-control-next {\n  right: 0; }\n\n.carousel-control-prev-icon,\n.carousel-control-next-icon {\n  display: inline-block;\n  width: 2rem;\n  height: 2rem;\n  background-repeat: no-repeat;\n  background-position: 50%;\n  background-size: 100% 100%; }\n\n/* rtl:options: {\n  \"autoRename\": true,\n  \"stringMap\":[ {\n    \"name\"    : \"prev-next\",\n    \"search\"  : \"prev\",\n    \"replace\" : \"next\"\n  } ]\n} */\n.carousel-control-prev-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e\"); }\n\n.carousel-control-next-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e\"); }\n\n.carousel-indicators {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 2;\n  display: flex;\n  justify-content: center;\n  padding: 0;\n  margin-right: 15%;\n  margin-bottom: 1rem;\n  margin-left: 15%;\n  list-style: none; }\n  .carousel-indicators [data-bs-target] {\n    box-sizing: content-box;\n    flex: 0 1 auto;\n    width: 30px;\n    height: 3px;\n    padding: 0;\n    margin-right: 3px;\n    margin-left: 3px;\n    text-indent: -999px;\n    cursor: pointer;\n    background-color: #fff;\n    background-clip: padding-box;\n    border: 0;\n    border-top: 10px solid transparent;\n    border-bottom: 10px solid transparent;\n    opacity: 0.5;\n    transition: opacity 0.6s ease; }\n    @media (prefers-reduced-motion: reduce) {\n      .carousel-indicators [data-bs-target] {\n        transition: none; } }\n  .carousel-indicators .active {\n    opacity: 1; }\n\n.carousel-caption {\n  position: absolute;\n  right: 15%;\n  bottom: 1.25rem;\n  left: 15%;\n  padding-top: 1.25rem;\n  padding-bottom: 1.25rem;\n  color: #fff;\n  text-align: center; }\n\n.carousel-dark .carousel-control-prev-icon,\n.carousel-dark .carousel-control-next-icon {\n  filter: invert(1) grayscale(100); }\n\n.carousel-dark .carousel-indicators [data-bs-target] {\n  background-color: #000; }\n\n.carousel-dark .carousel-caption {\n  color: #000; }\n\n@-webkit-keyframes spinner-border {\n  to {\n    transform: rotate(360deg) /* rtl:ignore */; } }\n\n@keyframes spinner-border {\n  to {\n    transform: rotate(360deg) /* rtl:ignore */; } }\n\n.spinner-border {\n  display: inline-block;\n  width: 2rem;\n  height: 2rem;\n  vertical-align: -0.125em;\n  border: 0.25em solid currentColor;\n  border-right-color: transparent;\n  border-radius: 50%;\n  -webkit-animation: 0.75s linear infinite spinner-border;\n          animation: 0.75s linear infinite spinner-border; }\n\n.spinner-border-sm {\n  width: 1rem;\n  height: 1rem;\n  border-width: 0.2em; }\n\n@-webkit-keyframes spinner-grow {\n  0% {\n    transform: scale(0); }\n  50% {\n    opacity: 1;\n    transform: none; } }\n\n@keyframes spinner-grow {\n  0% {\n    transform: scale(0); }\n  50% {\n    opacity: 1;\n    transform: none; } }\n\n.spinner-grow {\n  display: inline-block;\n  width: 2rem;\n  height: 2rem;\n  vertical-align: -0.125em;\n  background-color: currentColor;\n  border-radius: 50%;\n  opacity: 0;\n  -webkit-animation: 0.75s linear infinite spinner-grow;\n          animation: 0.75s linear infinite spinner-grow; }\n\n.spinner-grow-sm {\n  width: 1rem;\n  height: 1rem; }\n\n@media (prefers-reduced-motion: reduce) {\n  .spinner-border,\n  .spinner-grow {\n    -webkit-animation-duration: 1.5s;\n            animation-duration: 1.5s; } }\n\n.offcanvas {\n  position: fixed;\n  bottom: 0;\n  z-index: 1045;\n  display: flex;\n  flex-direction: column;\n  max-width: 100%;\n  visibility: hidden;\n  background-color: #fff;\n  background-clip: padding-box;\n  outline: 0;\n  transition: transform 0.3s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .offcanvas {\n      transition: none; } }\n\n.offcanvas-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1040;\n  width: 100vw;\n  height: 100vh;\n  background-color: #000; }\n  .offcanvas-backdrop.fade {\n    opacity: 0; }\n  .offcanvas-backdrop.show {\n    opacity: 0.5; }\n\n.offcanvas-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 1rem 1rem; }\n  .offcanvas-header .btn-close {\n    padding: 0.5rem 0.5rem;\n    margin-top: -0.5rem;\n    margin-right: -0.5rem;\n    margin-bottom: -0.5rem; }\n\n.offcanvas-title {\n  margin-bottom: 0;\n  line-height: 1.5; }\n\n.offcanvas-body {\n  flex-grow: 1;\n  padding: 1rem 1rem;\n  overflow-y: auto; }\n\n.offcanvas-start {\n  top: 0;\n  left: 0;\n  width: 400px;\n  border-right: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateX(-100%); }\n\n.offcanvas-end {\n  top: 0;\n  right: 0;\n  width: 400px;\n  border-left: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateX(100%); }\n\n.offcanvas-top {\n  top: 0;\n  right: 0;\n  left: 0;\n  height: 30vh;\n  max-height: 100%;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateY(-100%); }\n\n.offcanvas-bottom {\n  right: 0;\n  left: 0;\n  height: 30vh;\n  max-height: 100%;\n  border-top: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateY(100%); }\n\n.offcanvas.show {\n  transform: none; }\n\n.placeholder {\n  display: inline-block;\n  min-height: 1em;\n  vertical-align: middle;\n  cursor: wait;\n  background-color: currentColor;\n  opacity: 0.5; }\n  .placeholder.btn::before {\n    display: inline-block;\n    content: \"\"; }\n\n.placeholder-xs {\n  min-height: .6em; }\n\n.placeholder-sm {\n  min-height: .8em; }\n\n.placeholder-lg {\n  min-height: 1.2em; }\n\n.placeholder-glow .placeholder {\n  -webkit-animation: placeholder-glow 2s ease-in-out infinite;\n          animation: placeholder-glow 2s ease-in-out infinite; }\n\n@-webkit-keyframes placeholder-glow {\n  50% {\n    opacity: 0.2; } }\n\n@keyframes placeholder-glow {\n  50% {\n    opacity: 0.2; } }\n\n.placeholder-wave {\n  -webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);\n          mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);\n  -webkit-mask-size: 200% 100%;\n          mask-size: 200% 100%;\n  -webkit-animation: placeholder-wave 2s linear infinite;\n          animation: placeholder-wave 2s linear infinite; }\n\n@-webkit-keyframes placeholder-wave {\n  100% {\n    -webkit-mask-position: -200% 0%;\n            mask-position: -200% 0%; } }\n\n@keyframes placeholder-wave {\n  100% {\n    -webkit-mask-position: -200% 0%;\n            mask-position: -200% 0%; } }\n\n.clearfix::after {\n  display: block;\n  clear: both;\n  content: \"\"; }\n\n.link-primary {\n  color: #e91e63; }\n  .link-primary:hover, .link-primary:focus {\n    color: #ed4b82; }\n\n.link-secondary {\n  color: #7b809a; }\n  .link-secondary:hover, .link-secondary:focus {\n    color: #9599ae; }\n\n.link-success {\n  color: #4CAF50; }\n  .link-success:hover, .link-success:focus {\n    color: #70bf73; }\n\n.link-info {\n  color: #1A73E8; }\n  .link-info:hover, .link-info:focus {\n    color: #155cba; }\n\n.link-warning {\n  color: #fb8c00; }\n  .link-warning:hover, .link-warning:focus {\n    color: #fca333; }\n\n.link-danger {\n  color: #F44335; }\n  .link-danger:hover, .link-danger:focus {\n    color: #f6695d; }\n\n.link-light {\n  color: #f0f2f5; }\n  .link-light:hover, .link-light:focus {\n    color: #f3f5f7; }\n\n.link-dark {\n  color: #344767; }\n  .link-dark:hover, .link-dark:focus {\n    color: #2a3952; }\n\n.link-white {\n  color: #fff; }\n  .link-white:hover, .link-white:focus {\n    color: white; }\n\n.ratio {\n  position: relative;\n  width: 100%; }\n  .ratio::before {\n    display: block;\n    padding-top: var(--bs-aspect-ratio);\n    content: \"\"; }\n  .ratio > * {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%; }\n\n.ratio-1x1 {\n  --bs-aspect-ratio: 100%; }\n\n.ratio-4x3 {\n  --bs-aspect-ratio: calc(3 / 4 * 100%); }\n\n.ratio-16x9 {\n  --bs-aspect-ratio: calc(9 / 16 * 100%); }\n\n.ratio-21x9 {\n  --bs-aspect-ratio: calc(9 / 21 * 100%); }\n\n.fixed-top {\n  position: fixed;\n  top: 0;\n  right: 0;\n  left: 0;\n  z-index: 1030; }\n\n.fixed-bottom {\n  position: fixed;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1030; }\n\n.sticky-top {\n  position: -webkit-sticky;\n  position: sticky;\n  top: 0;\n  z-index: 1020; }\n\n@media (min-width: 576px) {\n  .sticky-sm-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 768px) {\n  .sticky-md-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 992px) {\n  .sticky-lg-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 1200px) {\n  .sticky-xl-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 1400px) {\n  .sticky-xxl-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n.hstack {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  align-self: stretch; }\n\n.vstack {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  align-self: stretch; }\n\n.visually-hidden,\n.visually-hidden-focusable:not(:focus):not(:focus-within) {\n  position: absolute !important;\n  width: 1px !important;\n  height: 1px !important;\n  padding: 0 !important;\n  margin: -1px !important;\n  overflow: hidden !important;\n  clip: rect(0, 0, 0, 0) !important;\n  white-space: nowrap !important;\n  border: 0 !important; }\n\n.stretched-link::after {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n  content: \"\"; }\n\n.text-truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap; }\n\n.vr {\n  display: inline-block;\n  align-self: stretch;\n  width: 1px;\n  min-height: 1em;\n  background-color: currentColor;\n  opacity: 0.25; }\n\n.align-baseline {\n  vertical-align: baseline !important; }\n\n.align-top {\n  vertical-align: top !important; }\n\n.align-middle {\n  vertical-align: middle !important; }\n\n.align-bottom {\n  vertical-align: bottom !important; }\n\n.align-text-bottom {\n  vertical-align: text-bottom !important; }\n\n.align-text-top {\n  vertical-align: text-top !important; }\n\n.float-start {\n  float: left !important; }\n\n.float-end {\n  float: right !important; }\n\n.float-none {\n  float: none !important; }\n\n.opacity-0 {\n  opacity: 0 !important; }\n\n.opacity-1 {\n  opacity: 0.1 !important; }\n\n.opacity-2 {\n  opacity: 0.2 !important; }\n\n.opacity-3 {\n  opacity: 0.3 !important; }\n\n.opacity-4 {\n  opacity: 0.4 !important; }\n\n.opacity-5 {\n  opacity: 0.5 !important; }\n\n.opacity-6 {\n  opacity: 0.6 !important; }\n\n.opacity-7 {\n  opacity: 0.7 !important; }\n\n.opacity-8 {\n  opacity: 0.8 !important; }\n\n.opacity-9 {\n  opacity: 0.9 !important; }\n\n.opacity-10 {\n  opacity: 1 !important; }\n\n.overflow-auto {\n  overflow: auto !important; }\n\n.overflow-hidden {\n  overflow: hidden !important; }\n\n.overflow-visible {\n  overflow: visible !important; }\n\n.overflow-scroll {\n  overflow: scroll !important; }\n\n.d-inline {\n  display: inline !important; }\n\n.d-inline-block {\n  display: inline-block !important; }\n\n.d-block {\n  display: block !important; }\n\n.d-grid {\n  display: grid !important; }\n\n.d-table {\n  display: table !important; }\n\n.d-table-row {\n  display: table-row !important; }\n\n.d-table-cell {\n  display: table-cell !important; }\n\n.d-flex {\n  display: flex !important; }\n\n.d-inline-flex {\n  display: inline-flex !important; }\n\n.d-none {\n  display: none !important; }\n\n.shadow {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; }\n\n.shadow-sm {\n  box-shadow: 0 0.3125rem 0.625rem 0 rgba(0, 0, 0, 0.12) !important; }\n\n.shadow-lg {\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; }\n\n.shadow-xl {\n  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important; }\n\n.shadow-none {\n  box-shadow: none !important; }\n\n.position-static {\n  position: static !important; }\n\n.position-relative {\n  position: relative !important; }\n\n.position-absolute {\n  position: absolute !important; }\n\n.position-fixed {\n  position: fixed !important; }\n\n.position-sticky {\n  position: -webkit-sticky !important;\n  position: sticky !important; }\n\n.top-0 {\n  top: 0 !important; }\n\n.top-1 {\n  top: 1% !important; }\n\n.top-2 {\n  top: 2% !important; }\n\n.top-3 {\n  top: 3% !important; }\n\n.top-4 {\n  top: 4% !important; }\n\n.top-5 {\n  top: 5% !important; }\n\n.top-6 {\n  top: 6% !important; }\n\n.top-7 {\n  top: 7% !important; }\n\n.top-8 {\n  top: 8% !important; }\n\n.top-9 {\n  top: 9% !important; }\n\n.top-10 {\n  top: 10% !important; }\n\n.top-50 {\n  top: 50% !important; }\n\n.top-100 {\n  top: 100% !important; }\n\n.bottom-0 {\n  bottom: 0 !important; }\n\n.bottom-1 {\n  bottom: 1% !important; }\n\n.bottom-2 {\n  bottom: 2% !important; }\n\n.bottom-3 {\n  bottom: 3% !important; }\n\n.bottom-4 {\n  bottom: 4% !important; }\n\n.bottom-5 {\n  bottom: 5% !important; }\n\n.bottom-6 {\n  bottom: 6% !important; }\n\n.bottom-7 {\n  bottom: 7% !important; }\n\n.bottom-8 {\n  bottom: 8% !important; }\n\n.bottom-9 {\n  bottom: 9% !important; }\n\n.bottom-10 {\n  bottom: 10% !important; }\n\n.bottom-50 {\n  bottom: 50% !important; }\n\n.bottom-100 {\n  bottom: 100% !important; }\n\n.start-0 {\n  left: 0 !important; }\n\n.start-1 {\n  left: 1% !important; }\n\n.start-2 {\n  left: 2% !important; }\n\n.start-3 {\n  left: 3% !important; }\n\n.start-4 {\n  left: 4% !important; }\n\n.start-5 {\n  left: 5% !important; }\n\n.start-6 {\n  left: 6% !important; }\n\n.start-7 {\n  left: 7% !important; }\n\n.start-8 {\n  left: 8% !important; }\n\n.start-9 {\n  left: 9% !important; }\n\n.start-10 {\n  left: 10% !important; }\n\n.start-50 {\n  left: 50% !important; }\n\n.start-100 {\n  left: 100% !important; }\n\n.end-0 {\n  right: 0 !important; }\n\n.end-1 {\n  right: 1% !important; }\n\n.end-2 {\n  right: 2% !important; }\n\n.end-3 {\n  right: 3% !important; }\n\n.end-4 {\n  right: 4% !important; }\n\n.end-5 {\n  right: 5% !important; }\n\n.end-6 {\n  right: 6% !important; }\n\n.end-7 {\n  right: 7% !important; }\n\n.end-8 {\n  right: 8% !important; }\n\n.end-9 {\n  right: 9% !important; }\n\n.end-10 {\n  right: 10% !important; }\n\n.end-50 {\n  right: 50% !important; }\n\n.end-100 {\n  right: 100% !important; }\n\n.translate-middle {\n  transform: translate(-50%, -50%) !important; }\n\n.translate-middle-x {\n  transform: translateX(-50%) !important; }\n\n.translate-middle-y {\n  transform: translateY(-50%) !important; }\n\n.border {\n  border: 1px solid #dee2e6 !important; }\n\n.border-0 {\n  border: 0 !important; }\n\n.border-top {\n  border-top: 1px solid #dee2e6 !important; }\n\n.border-top-0 {\n  border-top: 0 !important; }\n\n.border-end {\n  border-right: 1px solid #dee2e6 !important; }\n\n.border-end-0 {\n  border-right: 0 !important; }\n\n.border-bottom {\n  border-bottom: 1px solid #dee2e6 !important; }\n\n.border-bottom-0 {\n  border-bottom: 0 !important; }\n\n.border-start {\n  border-left: 1px solid #dee2e6 !important; }\n\n.border-start-0 {\n  border-left: 0 !important; }\n\n.border-primary {\n  border-color: #e91e63 !important; }\n\n.border-secondary {\n  border-color: #7b809a !important; }\n\n.border-success {\n  border-color: #4CAF50 !important; }\n\n.border-info {\n  border-color: #1A73E8 !important; }\n\n.border-warning {\n  border-color: #fb8c00 !important; }\n\n.border-danger {\n  border-color: #F44335 !important; }\n\n.border-light {\n  border-color: #f0f2f5 !important; }\n\n.border-dark {\n  border-color: #344767 !important; }\n\n.border-white {\n  border-color: #fff !important; }\n\n.border-0 {\n  border-width: 0 !important; }\n\n.border-1 {\n  border-width: 1px !important; }\n\n.border-2 {\n  border-width: 2px !important; }\n\n.border-3 {\n  border-width: 3px !important; }\n\n.border-4 {\n  border-width: 4px !important; }\n\n.border-5 {\n  border-width: 5px !important; }\n\n.w-0 {\n  width: 0% !important; }\n\n.w-1 {\n  width: 1% !important; }\n\n.w-2 {\n  width: 2% !important; }\n\n.w-3 {\n  width: 3% !important; }\n\n.w-4 {\n  width: 4% !important; }\n\n.w-5 {\n  width: 5% !important; }\n\n.w-6 {\n  width: 6% !important; }\n\n.w-7 {\n  width: 7% !important; }\n\n.w-8 {\n  width: 8% !important; }\n\n.w-9 {\n  width: 9% !important; }\n\n.w-10 {\n  width: 10% !important; }\n\n.w-15 {\n  width: 15% !important; }\n\n.w-20 {\n  width: 20% !important; }\n\n.w-25 {\n  width: 25% !important; }\n\n.w-30 {\n  width: 30% !important; }\n\n.w-35 {\n  width: 35% !important; }\n\n.w-40 {\n  width: 40% !important; }\n\n.w-45 {\n  width: 45% !important; }\n\n.w-50 {\n  width: 50% !important; }\n\n.w-55 {\n  width: 55% !important; }\n\n.w-60 {\n  width: 60% !important; }\n\n.w-65 {\n  width: 65% !important; }\n\n.w-70 {\n  width: 70% !important; }\n\n.w-75 {\n  width: 75% !important; }\n\n.w-80 {\n  width: 80% !important; }\n\n.w-85 {\n  width: 85% !important; }\n\n.w-90 {\n  width: 90% !important; }\n\n.w-95 {\n  width: 95% !important; }\n\n.w-100 {\n  width: 100% !important; }\n\n.w-auto {\n  width: auto !important; }\n\n.mw-100 {\n  max-width: 100% !important; }\n\n.vw-100 {\n  width: 100vw !important; }\n\n.min-vw-100 {\n  min-width: 100vw !important; }\n\n.h-25 {\n  height: 25% !important; }\n\n.h-50 {\n  height: 50% !important; }\n\n.h-75 {\n  height: 75% !important; }\n\n.h-100 {\n  height: 100% !important; }\n\n.h-auto {\n  height: auto !important; }\n\n.mh-100 {\n  max-height: 100% !important; }\n\n.vh-100 {\n  height: 100vh !important; }\n\n.min-vh-25 {\n  min-height: 25vh !important; }\n\n.min-vh-35 {\n  min-height: 35vh !important; }\n\n.min-vh-45 {\n  min-height: 45vh !important; }\n\n.min-vh-50 {\n  min-height: 50vh !important; }\n\n.min-vh-55 {\n  min-height: 55vh !important; }\n\n.min-vh-65 {\n  min-height: 65vh !important; }\n\n.min-vh-70 {\n  min-height: 70vh !important; }\n\n.min-vh-75 {\n  min-height: 75vh !important; }\n\n.min-vh-80 {\n  min-height: 80vh !important; }\n\n.min-vh-85 {\n  min-height: 85vh !important; }\n\n.min-vh-90 {\n  min-height: 90vh !important; }\n\n.min-vh-95 {\n  min-height: 95vh !important; }\n\n.min-vh-100 {\n  min-height: 100vh !important; }\n\n.flex-fill {\n  flex: 1 1 auto !important; }\n\n.flex-row {\n  flex-direction: row !important; }\n\n.flex-column {\n  flex-direction: column !important; }\n\n.flex-row-reverse {\n  flex-direction: row-reverse !important; }\n\n.flex-column-reverse {\n  flex-direction: column-reverse !important; }\n\n.flex-grow-0 {\n  flex-grow: 0 !important; }\n\n.flex-grow-1 {\n  flex-grow: 1 !important; }\n\n.flex-shrink-0 {\n  flex-shrink: 0 !important; }\n\n.flex-shrink-1 {\n  flex-shrink: 1 !important; }\n\n.flex-wrap {\n  flex-wrap: wrap !important; }\n\n.flex-nowrap {\n  flex-wrap: nowrap !important; }\n\n.flex-wrap-reverse {\n  flex-wrap: wrap-reverse !important; }\n\n.gap-0 {\n  gap: 0 !important; }\n\n.gap-1 {\n  gap: 0.25rem !important; }\n\n.gap-2 {\n  gap: 0.5rem !important; }\n\n.gap-3 {\n  gap: 1rem !important; }\n\n.gap-4 {\n  gap: 1.5rem !important; }\n\n.gap-5 {\n  gap: 3rem !important; }\n\n.gap-6 {\n  gap: 4rem !important; }\n\n.gap-7 {\n  gap: 6rem !important; }\n\n.gap-8 {\n  gap: 8rem !important; }\n\n.gap-9 {\n  gap: 10rem !important; }\n\n.gap-10 {\n  gap: 12rem !important; }\n\n.gap-11 {\n  gap: 14rem !important; }\n\n.gap-12 {\n  gap: 16rem !important; }\n\n.justify-content-start {\n  justify-content: flex-start !important; }\n\n.justify-content-end {\n  justify-content: flex-end !important; }\n\n.justify-content-center {\n  justify-content: center !important; }\n\n.justify-content-between {\n  justify-content: space-between !important; }\n\n.justify-content-around {\n  justify-content: space-around !important; }\n\n.justify-content-evenly {\n  justify-content: space-evenly !important; }\n\n.align-items-start {\n  align-items: flex-start !important; }\n\n.align-items-end {\n  align-items: flex-end !important; }\n\n.align-items-center {\n  align-items: center !important; }\n\n.align-items-baseline {\n  align-items: baseline !important; }\n\n.align-items-stretch {\n  align-items: stretch !important; }\n\n.align-content-start {\n  align-content: flex-start !important; }\n\n.align-content-end {\n  align-content: flex-end !important; }\n\n.align-content-center {\n  align-content: center !important; }\n\n.align-content-between {\n  align-content: space-between !important; }\n\n.align-content-around {\n  align-content: space-around !important; }\n\n.align-content-stretch {\n  align-content: stretch !important; }\n\n.align-self-auto {\n  align-self: auto !important; }\n\n.align-self-start {\n  align-self: flex-start !important; }\n\n.align-self-end {\n  align-self: flex-end !important; }\n\n.align-self-center {\n  align-self: center !important; }\n\n.align-self-baseline {\n  align-self: baseline !important; }\n\n.align-self-stretch {\n  align-self: stretch !important; }\n\n.order-first {\n  order: -1 !important; }\n\n.order-0 {\n  order: 0 !important; }\n\n.order-1 {\n  order: 1 !important; }\n\n.order-2 {\n  order: 2 !important; }\n\n.order-3 {\n  order: 3 !important; }\n\n.order-4 {\n  order: 4 !important; }\n\n.order-5 {\n  order: 5 !important; }\n\n.order-last {\n  order: 6 !important; }\n\n.m-0 {\n  margin: 0 !important; }\n\n.m-1 {\n  margin: 0.25rem !important; }\n\n.m-2 {\n  margin: 0.5rem !important; }\n\n.m-3 {\n  margin: 1rem !important; }\n\n.m-4 {\n  margin: 1.5rem !important; }\n\n.m-5 {\n  margin: 3rem !important; }\n\n.m-6 {\n  margin: 4rem !important; }\n\n.m-7 {\n  margin: 6rem !important; }\n\n.m-8 {\n  margin: 8rem !important; }\n\n.m-9 {\n  margin: 10rem !important; }\n\n.m-10 {\n  margin: 12rem !important; }\n\n.m-11 {\n  margin: 14rem !important; }\n\n.m-12 {\n  margin: 16rem !important; }\n\n.m-auto {\n  margin: auto !important; }\n\n.mx-0 {\n  margin-right: 0 !important;\n  margin-left: 0 !important; }\n\n.mx-1 {\n  margin-right: 0.25rem !important;\n  margin-left: 0.25rem !important; }\n\n.mx-2 {\n  margin-right: 0.5rem !important;\n  margin-left: 0.5rem !important; }\n\n.mx-3 {\n  margin-right: 1rem !important;\n  margin-left: 1rem !important; }\n\n.mx-4 {\n  margin-right: 1.5rem !important;\n  margin-left: 1.5rem !important; }\n\n.mx-5 {\n  margin-right: 3rem !important;\n  margin-left: 3rem !important; }\n\n.mx-6 {\n  margin-right: 4rem !important;\n  margin-left: 4rem !important; }\n\n.mx-7 {\n  margin-right: 6rem !important;\n  margin-left: 6rem !important; }\n\n.mx-8 {\n  margin-right: 8rem !important;\n  margin-left: 8rem !important; }\n\n.mx-9 {\n  margin-right: 10rem !important;\n  margin-left: 10rem !important; }\n\n.mx-10 {\n  margin-right: 12rem !important;\n  margin-left: 12rem !important; }\n\n.mx-11 {\n  margin-right: 14rem !important;\n  margin-left: 14rem !important; }\n\n.mx-12 {\n  margin-right: 16rem !important;\n  margin-left: 16rem !important; }\n\n.mx-auto {\n  margin-right: auto !important;\n  margin-left: auto !important; }\n\n.my-0 {\n  margin-top: 0 !important;\n  margin-bottom: 0 !important; }\n\n.my-1 {\n  margin-top: 0.25rem !important;\n  margin-bottom: 0.25rem !important; }\n\n.my-2 {\n  margin-top: 0.5rem !important;\n  margin-bottom: 0.5rem !important; }\n\n.my-3 {\n  margin-top: 1rem !important;\n  margin-bottom: 1rem !important; }\n\n.my-4 {\n  margin-top: 1.5rem !important;\n  margin-bottom: 1.5rem !important; }\n\n.my-5 {\n  margin-top: 3rem !important;\n  margin-bottom: 3rem !important; }\n\n.my-6 {\n  margin-top: 4rem !important;\n  margin-bottom: 4rem !important; }\n\n.my-7 {\n  margin-top: 6rem !important;\n  margin-bottom: 6rem !important; }\n\n.my-8 {\n  margin-top: 8rem !important;\n  margin-bottom: 8rem !important; }\n\n.my-9 {\n  margin-top: 10rem !important;\n  margin-bottom: 10rem !important; }\n\n.my-10 {\n  margin-top: 12rem !important;\n  margin-bottom: 12rem !important; }\n\n.my-11 {\n  margin-top: 14rem !important;\n  margin-bottom: 14rem !important; }\n\n.my-12 {\n  margin-top: 16rem !important;\n  margin-bottom: 16rem !important; }\n\n.my-auto {\n  margin-top: auto !important;\n  margin-bottom: auto !important; }\n\n.mt-0 {\n  margin-top: 0 !important; }\n\n.mt-1 {\n  margin-top: 0.25rem !important; }\n\n.mt-2 {\n  margin-top: 0.5rem !important; }\n\n.mt-3 {\n  margin-top: 1rem !important; }\n\n.mt-4 {\n  margin-top: 1.5rem !important; }\n\n.mt-5 {\n  margin-top: 3rem !important; }\n\n.mt-6 {\n  margin-top: 4rem !important; }\n\n.mt-7 {\n  margin-top: 6rem !important; }\n\n.mt-8 {\n  margin-top: 8rem !important; }\n\n.mt-9 {\n  margin-top: 10rem !important; }\n\n.mt-10 {\n  margin-top: 12rem !important; }\n\n.mt-11 {\n  margin-top: 14rem !important; }\n\n.mt-12 {\n  margin-top: 16rem !important; }\n\n.mt-auto {\n  margin-top: auto !important; }\n\n.me-0 {\n  margin-right: 0 !important; }\n\n.me-1 {\n  margin-right: 0.25rem !important; }\n\n.me-2 {\n  margin-right: 0.5rem !important; }\n\n.me-3 {\n  margin-right: 1rem !important; }\n\n.me-4 {\n  margin-right: 1.5rem !important; }\n\n.me-5 {\n  margin-right: 3rem !important; }\n\n.me-6 {\n  margin-right: 4rem !important; }\n\n.me-7 {\n  margin-right: 6rem !important; }\n\n.me-8 {\n  margin-right: 8rem !important; }\n\n.me-9 {\n  margin-right: 10rem !important; }\n\n.me-10 {\n  margin-right: 12rem !important; }\n\n.me-11 {\n  margin-right: 14rem !important; }\n\n.me-12 {\n  margin-right: 16rem !important; }\n\n.me-auto {\n  margin-right: auto !important; }\n\n.mb-0 {\n  margin-bottom: 0 !important; }\n\n.mb-1 {\n  margin-bottom: 0.25rem !important; }\n\n.mb-2 {\n  margin-bottom: 0.5rem !important; }\n\n.mb-3 {\n  margin-bottom: 1rem !important; }\n\n.mb-4 {\n  margin-bottom: 1.5rem !important; }\n\n.mb-5 {\n  margin-bottom: 3rem !important; }\n\n.mb-6 {\n  margin-bottom: 4rem !important; }\n\n.mb-7 {\n  margin-bottom: 6rem !important; }\n\n.mb-8 {\n  margin-bottom: 8rem !important; }\n\n.mb-9 {\n  margin-bottom: 10rem !important; }\n\n.mb-10 {\n  margin-bottom: 12rem !important; }\n\n.mb-11 {\n  margin-bottom: 14rem !important; }\n\n.mb-12 {\n  margin-bottom: 16rem !important; }\n\n.mb-auto {\n  margin-bottom: auto !important; }\n\n.ms-0 {\n  margin-left: 0 !important; }\n\n.ms-1 {\n  margin-left: 0.25rem !important; }\n\n.ms-2 {\n  margin-left: 0.5rem !important; }\n\n.ms-3 {\n  margin-left: 1rem !important; }\n\n.ms-4 {\n  margin-left: 1.5rem !important; }\n\n.ms-5 {\n  margin-left: 3rem !important; }\n\n.ms-6 {\n  margin-left: 4rem !important; }\n\n.ms-7 {\n  margin-left: 6rem !important; }\n\n.ms-8 {\n  margin-left: 8rem !important; }\n\n.ms-9 {\n  margin-left: 10rem !important; }\n\n.ms-10 {\n  margin-left: 12rem !important; }\n\n.ms-11 {\n  margin-left: 14rem !important; }\n\n.ms-12 {\n  margin-left: 16rem !important; }\n\n.ms-auto {\n  margin-left: auto !important; }\n\n.m-n1 {\n  margin: -0.25rem !important; }\n\n.m-n2 {\n  margin: -0.5rem !important; }\n\n.m-n3 {\n  margin: -1rem !important; }\n\n.m-n4 {\n  margin: -1.5rem !important; }\n\n.m-n5 {\n  margin: -3rem !important; }\n\n.m-n6 {\n  margin: -4rem !important; }\n\n.m-n7 {\n  margin: -6rem !important; }\n\n.m-n8 {\n  margin: -8rem !important; }\n\n.m-n9 {\n  margin: -10rem !important; }\n\n.m-n10 {\n  margin: -12rem !important; }\n\n.m-n11 {\n  margin: -14rem !important; }\n\n.m-n12 {\n  margin: -16rem !important; }\n\n.mx-n1 {\n  margin-right: -0.25rem !important;\n  margin-left: -0.25rem !important; }\n\n.mx-n2 {\n  margin-right: -0.5rem !important;\n  margin-left: -0.5rem !important; }\n\n.mx-n3 {\n  margin-right: -1rem !important;\n  margin-left: -1rem !important; }\n\n.mx-n4 {\n  margin-right: -1.5rem !important;\n  margin-left: -1.5rem !important; }\n\n.mx-n5 {\n  margin-right: -3rem !important;\n  margin-left: -3rem !important; }\n\n.mx-n6 {\n  margin-right: -4rem !important;\n  margin-left: -4rem !important; }\n\n.mx-n7 {\n  margin-right: -6rem !important;\n  margin-left: -6rem !important; }\n\n.mx-n8 {\n  margin-right: -8rem !important;\n  margin-left: -8rem !important; }\n\n.mx-n9 {\n  margin-right: -10rem !important;\n  margin-left: -10rem !important; }\n\n.mx-n10 {\n  margin-right: -12rem !important;\n  margin-left: -12rem !important; }\n\n.mx-n11 {\n  margin-right: -14rem !important;\n  margin-left: -14rem !important; }\n\n.mx-n12 {\n  margin-right: -16rem !important;\n  margin-left: -16rem !important; }\n\n.my-n1 {\n  margin-top: -0.25rem !important;\n  margin-bottom: -0.25rem !important; }\n\n.my-n2 {\n  margin-top: -0.5rem !important;\n  margin-bottom: -0.5rem !important; }\n\n.my-n3 {\n  margin-top: -1rem !important;\n  margin-bottom: -1rem !important; }\n\n.my-n4 {\n  margin-top: -1.5rem !important;\n  margin-bottom: -1.5rem !important; }\n\n.my-n5 {\n  margin-top: -3rem !important;\n  margin-bottom: -3rem !important; }\n\n.my-n6 {\n  margin-top: -4rem !important;\n  margin-bottom: -4rem !important; }\n\n.my-n7 {\n  margin-top: -6rem !important;\n  margin-bottom: -6rem !important; }\n\n.my-n8 {\n  margin-top: -8rem !important;\n  margin-bottom: -8rem !important; }\n\n.my-n9 {\n  margin-top: -10rem !important;\n  margin-bottom: -10rem !important; }\n\n.my-n10 {\n  margin-top: -12rem !important;\n  margin-bottom: -12rem !important; }\n\n.my-n11 {\n  margin-top: -14rem !important;\n  margin-bottom: -14rem !important; }\n\n.my-n12 {\n  margin-top: -16rem !important;\n  margin-bottom: -16rem !important; }\n\n.mt-n1 {\n  margin-top: -0.25rem !important; }\n\n.mt-n2 {\n  margin-top: -0.5rem !important; }\n\n.mt-n3 {\n  margin-top: -1rem !important; }\n\n.mt-n4 {\n  margin-top: -1.5rem !important; }\n\n.mt-n5 {\n  margin-top: -3rem !important; }\n\n.mt-n6 {\n  margin-top: -4rem !important; }\n\n.mt-n7 {\n  margin-top: -6rem !important; }\n\n.mt-n8 {\n  margin-top: -8rem !important; }\n\n.mt-n9 {\n  margin-top: -10rem !important; }\n\n.mt-n10 {\n  margin-top: -12rem !important; }\n\n.mt-n11 {\n  margin-top: -14rem !important; }\n\n.mt-n12 {\n  margin-top: -16rem !important; }\n\n.me-n1 {\n  margin-right: -0.25rem !important; }\n\n.me-n2 {\n  margin-right: -0.5rem !important; }\n\n.me-n3 {\n  margin-right: -1rem !important; }\n\n.me-n4 {\n  margin-right: -1.5rem !important; }\n\n.me-n5 {\n  margin-right: -3rem !important; }\n\n.me-n6 {\n  margin-right: -4rem !important; }\n\n.me-n7 {\n  margin-right: -6rem !important; }\n\n.me-n8 {\n  margin-right: -8rem !important; }\n\n.me-n9 {\n  margin-right: -10rem !important; }\n\n.me-n10 {\n  margin-right: -12rem !important; }\n\n.me-n11 {\n  margin-right: -14rem !important; }\n\n.me-n12 {\n  margin-right: -16rem !important; }\n\n.mb-n1 {\n  margin-bottom: -0.25rem !important; }\n\n.mb-n2 {\n  margin-bottom: -0.5rem !important; }\n\n.mb-n3 {\n  margin-bottom: -1rem !important; }\n\n.mb-n4 {\n  margin-bottom: -1.5rem !important; }\n\n.mb-n5 {\n  margin-bottom: -3rem !important; }\n\n.mb-n6 {\n  margin-bottom: -4rem !important; }\n\n.mb-n7 {\n  margin-bottom: -6rem !important; }\n\n.mb-n8 {\n  margin-bottom: -8rem !important; }\n\n.mb-n9 {\n  margin-bottom: -10rem !important; }\n\n.mb-n10 {\n  margin-bottom: -12rem !important; }\n\n.mb-n11 {\n  margin-bottom: -14rem !important; }\n\n.mb-n12 {\n  margin-bottom: -16rem !important; }\n\n.ms-n1 {\n  margin-left: -0.25rem !important; }\n\n.ms-n2 {\n  margin-left: -0.5rem !important; }\n\n.ms-n3 {\n  margin-left: -1rem !important; }\n\n.ms-n4 {\n  margin-left: -1.5rem !important; }\n\n.ms-n5 {\n  margin-left: -3rem !important; }\n\n.ms-n6 {\n  margin-left: -4rem !important; }\n\n.ms-n7 {\n  margin-left: -6rem !important; }\n\n.ms-n8 {\n  margin-left: -8rem !important; }\n\n.ms-n9 {\n  margin-left: -10rem !important; }\n\n.ms-n10 {\n  margin-left: -12rem !important; }\n\n.ms-n11 {\n  margin-left: -14rem !important; }\n\n.ms-n12 {\n  margin-left: -16rem !important; }\n\n.p-0 {\n  padding: 0 !important; }\n\n.p-1 {\n  padding: 0.25rem !important; }\n\n.p-2 {\n  padding: 0.5rem !important; }\n\n.p-3 {\n  padding: 1rem !important; }\n\n.p-4 {\n  padding: 1.5rem !important; }\n\n.p-5 {\n  padding: 3rem !important; }\n\n.p-6 {\n  padding: 4rem !important; }\n\n.p-7 {\n  padding: 6rem !important; }\n\n.p-8 {\n  padding: 8rem !important; }\n\n.p-9 {\n  padding: 10rem !important; }\n\n.p-10 {\n  padding: 12rem !important; }\n\n.p-11 {\n  padding: 14rem !important; }\n\n.p-12 {\n  padding: 16rem !important; }\n\n.px-0 {\n  padding-right: 0 !important;\n  padding-left: 0 !important; }\n\n.px-1 {\n  padding-right: 0.25rem !important;\n  padding-left: 0.25rem !important; }\n\n.px-2 {\n  padding-right: 0.5rem !important;\n  padding-left: 0.5rem !important; }\n\n.px-3 {\n  padding-right: 1rem !important;\n  padding-left: 1rem !important; }\n\n.px-4 {\n  padding-right: 1.5rem !important;\n  padding-left: 1.5rem !important; }\n\n.px-5 {\n  padding-right: 3rem !important;\n  padding-left: 3rem !important; }\n\n.px-6 {\n  padding-right: 4rem !important;\n  padding-left: 4rem !important; }\n\n.px-7 {\n  padding-right: 6rem !important;\n  padding-left: 6rem !important; }\n\n.px-8 {\n  padding-right: 8rem !important;\n  padding-left: 8rem !important; }\n\n.px-9 {\n  padding-right: 10rem !important;\n  padding-left: 10rem !important; }\n\n.px-10 {\n  padding-right: 12rem !important;\n  padding-left: 12rem !important; }\n\n.px-11 {\n  padding-right: 14rem !important;\n  padding-left: 14rem !important; }\n\n.px-12 {\n  padding-right: 16rem !important;\n  padding-left: 16rem !important; }\n\n.py-0 {\n  padding-top: 0 !important;\n  padding-bottom: 0 !important; }\n\n.py-1 {\n  padding-top: 0.25rem !important;\n  padding-bottom: 0.25rem !important; }\n\n.py-2 {\n  padding-top: 0.5rem !important;\n  padding-bottom: 0.5rem !important; }\n\n.py-3 {\n  padding-top: 1rem !important;\n  padding-bottom: 1rem !important; }\n\n.py-4 {\n  padding-top: 1.5rem !important;\n  padding-bottom: 1.5rem !important; }\n\n.py-5 {\n  padding-top: 3rem !important;\n  padding-bottom: 3rem !important; }\n\n.py-6 {\n  padding-top: 4rem !important;\n  padding-bottom: 4rem !important; }\n\n.py-7 {\n  padding-top: 6rem !important;\n  padding-bottom: 6rem !important; }\n\n.py-8 {\n  padding-top: 8rem !important;\n  padding-bottom: 8rem !important; }\n\n.py-9 {\n  padding-top: 10rem !important;\n  padding-bottom: 10rem !important; }\n\n.py-10 {\n  padding-top: 12rem !important;\n  padding-bottom: 12rem !important; }\n\n.py-11 {\n  padding-top: 14rem !important;\n  padding-bottom: 14rem !important; }\n\n.py-12 {\n  padding-top: 16rem !important;\n  padding-bottom: 16rem !important; }\n\n.pt-0 {\n  padding-top: 0 !important; }\n\n.pt-1 {\n  padding-top: 0.25rem !important; }\n\n.pt-2 {\n  padding-top: 0.5rem !important; }\n\n.pt-3 {\n  padding-top: 1rem !important; }\n\n.pt-4 {\n  padding-top: 1.5rem !important; }\n\n.pt-5 {\n  padding-top: 3rem !important; }\n\n.pt-6 {\n  padding-top: 4rem !important; }\n\n.pt-7 {\n  padding-top: 6rem !important; }\n\n.pt-8 {\n  padding-top: 8rem !important; }\n\n.pt-9 {\n  padding-top: 10rem !important; }\n\n.pt-10 {\n  padding-top: 12rem !important; }\n\n.pt-11 {\n  padding-top: 14rem !important; }\n\n.pt-12 {\n  padding-top: 16rem !important; }\n\n.pe-0 {\n  padding-right: 0 !important; }\n\n.pe-1 {\n  padding-right: 0.25rem !important; }\n\n.pe-2 {\n  padding-right: 0.5rem !important; }\n\n.pe-3 {\n  padding-right: 1rem !important; }\n\n.pe-4 {\n  padding-right: 1.5rem !important; }\n\n.pe-5 {\n  padding-right: 3rem !important; }\n\n.pe-6 {\n  padding-right: 4rem !important; }\n\n.pe-7 {\n  padding-right: 6rem !important; }\n\n.pe-8 {\n  padding-right: 8rem !important; }\n\n.pe-9 {\n  padding-right: 10rem !important; }\n\n.pe-10 {\n  padding-right: 12rem !important; }\n\n.pe-11 {\n  padding-right: 14rem !important; }\n\n.pe-12 {\n  padding-right: 16rem !important; }\n\n.pb-0 {\n  padding-bottom: 0 !important; }\n\n.pb-1 {\n  padding-bottom: 0.25rem !important; }\n\n.pb-2 {\n  padding-bottom: 0.5rem !important; }\n\n.pb-3 {\n  padding-bottom: 1rem !important; }\n\n.pb-4 {\n  padding-bottom: 1.5rem !important; }\n\n.pb-5 {\n  padding-bottom: 3rem !important; }\n\n.pb-6 {\n  padding-bottom: 4rem !important; }\n\n.pb-7 {\n  padding-bottom: 6rem !important; }\n\n.pb-8 {\n  padding-bottom: 8rem !important; }\n\n.pb-9 {\n  padding-bottom: 10rem !important; }\n\n.pb-10 {\n  padding-bottom: 12rem !important; }\n\n.pb-11 {\n  padding-bottom: 14rem !important; }\n\n.pb-12 {\n  padding-bottom: 16rem !important; }\n\n.ps-0 {\n  padding-left: 0 !important; }\n\n.ps-1 {\n  padding-left: 0.25rem !important; }\n\n.ps-2 {\n  padding-left: 0.5rem !important; }\n\n.ps-3 {\n  padding-left: 1rem !important; }\n\n.ps-4 {\n  padding-left: 1.5rem !important; }\n\n.ps-5 {\n  padding-left: 3rem !important; }\n\n.ps-6 {\n  padding-left: 4rem !important; }\n\n.ps-7 {\n  padding-left: 6rem !important; }\n\n.ps-8 {\n  padding-left: 8rem !important; }\n\n.ps-9 {\n  padding-left: 10rem !important; }\n\n.ps-10 {\n  padding-left: 12rem !important; }\n\n.ps-11 {\n  padding-left: 14rem !important; }\n\n.ps-12 {\n  padding-left: 16rem !important; }\n\n.font-monospace {\n  font-family: var(--bs-font-monospace) !important; }\n\n.fs-1 {\n  font-size: calc(1.425rem + 2.1vw) !important; }\n\n.fs-2 {\n  font-size: calc(1.35rem + 1.2vw) !important; }\n\n.fs-3 {\n  font-size: calc(1.3125rem + 0.75vw) !important; }\n\n.fs-4 {\n  font-size: calc(1.275rem + 0.3vw) !important; }\n\n.fs-5 {\n  font-size: 1.25rem !important; }\n\n.fs-6 {\n  font-size: 1rem !important; }\n\n.fst-italic {\n  font-style: italic !important; }\n\n.fst-normal {\n  font-style: normal !important; }\n\n.fw-light {\n  font-weight: 300 !important; }\n\n.fw-lighter {\n  font-weight: lighter !important; }\n\n.fw-normal {\n  font-weight: 400 !important; }\n\n.fw-bold {\n  font-weight: 600 !important; }\n\n.fw-bolder {\n  font-weight: 700 !important; }\n\n.lh-1 {\n  line-height: 1 !important; }\n\n.lh-sm {\n  line-height: 1.25 !important; }\n\n.lh-base {\n  line-height: 1.5 !important; }\n\n.lh-lg {\n  line-height: 2 !important; }\n\n.text-start {\n  text-align: left !important; }\n\n.text-end {\n  text-align: right !important; }\n\n.text-center {\n  text-align: center !important; }\n\n.text-decoration-none {\n  text-decoration: none !important; }\n\n.text-decoration-underline {\n  text-decoration: underline !important; }\n\n.text-decoration-line-through {\n  text-decoration: line-through !important; }\n\n.text-lowercase {\n  text-transform: lowercase !important; }\n\n.text-uppercase {\n  text-transform: uppercase !important; }\n\n.text-capitalize {\n  text-transform: capitalize !important; }\n\n.text-wrap {\n  white-space: normal !important; }\n\n.text-nowrap {\n  white-space: nowrap !important; }\n\n/* rtl:begin:remove */\n.text-break {\n  word-wrap: break-word !important;\n  word-break: break-word !important; }\n\n/* rtl:end:remove */\n.text-primary {\n  color: #e91e63 !important; }\n\n.text-secondary {\n  color: #7b809a !important; }\n\n.text-success {\n  color: #4CAF50 !important; }\n\n.text-info {\n  color: #1A73E8 !important; }\n\n.text-warning {\n  color: #fb8c00 !important; }\n\n.text-danger {\n  color: #F44335 !important; }\n\n.text-light {\n  color: #f0f2f5 !important; }\n\n.text-dark {\n  color: #344767 !important; }\n\n.text-white {\n  color: #fff !important; }\n\n.text-body {\n  color: #7b809a !important; }\n\n.text-rose {\n  color: #e91e63 !important; }\n\n.text-muted {\n  color: #6c757d !important; }\n\n.text-black-50 {\n  color: rgba(0, 0, 0, 0.5) !important; }\n\n.text-white-50 {\n  color: rgba(255, 255, 255, 0.5) !important; }\n\n.text-reset {\n  color: inherit !important; }\n\n.text-opacity-25 {\n  --bs-text-opacity: 0.25; }\n\n.text-opacity-50 {\n  --bs-text-opacity: 0.5; }\n\n.text-opacity-75 {\n  --bs-text-opacity: 0.75; }\n\n.text-opacity-100 {\n  --bs-text-opacity: 1; }\n\n.bg-primary {\n  background-color: #e91e63 !important; }\n\n.bg-secondary {\n  background-color: #7b809a !important; }\n\n.bg-success {\n  background-color: #4CAF50 !important; }\n\n.bg-info {\n  background-color: #1A73E8 !important; }\n\n.bg-warning {\n  background-color: #fb8c00 !important; }\n\n.bg-danger {\n  background-color: #F44335 !important; }\n\n.bg-light {\n  background-color: #f0f2f5 !important; }\n\n.bg-dark {\n  background-color: #344767 !important; }\n\n.bg-white {\n  background-color: #fff !important; }\n\n.bg-body {\n  background-color: #fff !important; }\n\n.bg-transparent {\n  background-color: transparent !important; }\n\n.bg-gray-100 {\n  background-color: #f8f9fa !important; }\n\n.bg-gray-200 {\n  background-color: #f0f2f5 !important; }\n\n.bg-gray-300 {\n  background-color: #dee2e6 !important; }\n\n.bg-gray-400 {\n  background-color: #ced4da !important; }\n\n.bg-gray-500 {\n  background-color: #adb5bd !important; }\n\n.bg-gray-600 {\n  background-color: #6c757d !important; }\n\n.bg-gray-700 {\n  background-color: #495057 !important; }\n\n.bg-gray-800 {\n  background-color: #343a40 !important; }\n\n.bg-gray-900 {\n  background-color: #212529 !important; }\n\n.bg-opacity-10 {\n  --bs-bg-opacity: 0.1; }\n\n.bg-opacity-25 {\n  --bs-bg-opacity: 0.25; }\n\n.bg-opacity-50 {\n  --bs-bg-opacity: 0.5; }\n\n.bg-opacity-75 {\n  --bs-bg-opacity: 0.75; }\n\n.bg-opacity-100 {\n  --bs-bg-opacity: 1; }\n\n.bg-gradient {\n  background-image: var(--bs-gradient) !important; }\n\n.user-select-all {\n  -webkit-user-select: all !important;\n     -moz-user-select: all !important;\n      -ms-user-select: all !important;\n          user-select: all !important; }\n\n.user-select-auto {\n  -webkit-user-select: auto !important;\n     -moz-user-select: auto !important;\n      -ms-user-select: auto !important;\n          user-select: auto !important; }\n\n.user-select-none {\n  -webkit-user-select: none !important;\n     -moz-user-select: none !important;\n      -ms-user-select: none !important;\n          user-select: none !important; }\n\n.pe-none {\n  pointer-events: none !important; }\n\n.pe-auto {\n  pointer-events: auto !important; }\n\n.rounded {\n  border-radius: 0.25rem !important; }\n\n.rounded-0 {\n  border-radius: 0 !important; }\n\n.rounded-1 {\n  border-radius: 0.125rem !important; }\n\n.rounded-2 {\n  border-radius: 0.25rem !important; }\n\n.rounded-3 {\n  border-radius: 0.5rem !important; }\n\n.rounded-circle, .avatar.rounded-circle img {\n  border-radius: 50% !important; }\n\n.rounded-pill {\n  border-radius: 50rem !important; }\n\n.rounded-top {\n  border-top-left-radius: 0.25rem !important;\n  border-top-right-radius: 0.25rem !important; }\n\n.rounded-end {\n  border-top-right-radius: 0.25rem !important;\n  border-bottom-right-radius: 0.25rem !important; }\n\n.rounded-bottom {\n  border-bottom-right-radius: 0.25rem !important;\n  border-bottom-left-radius: 0.25rem !important; }\n\n.rounded-start {\n  border-bottom-left-radius: 0.25rem !important;\n  border-top-left-radius: 0.25rem !important; }\n\n.visible {\n  visibility: visible !important; }\n\n.invisible {\n  visibility: hidden !important; }\n\n.overflow-x-auto {\n  overflow-x: auto !important; }\n\n.overflow-x-hidden {\n  overflow-x: hidden !important; }\n\n.overflow-x-visible {\n  overflow-x: visible !important; }\n\n.overflow-x-scroll {\n  overflow-x: scroll !important; }\n\n.overflow-y-auto {\n  overflow-y: auto !important; }\n\n.overflow-y-hidden {\n  overflow-y: hidden !important; }\n\n.overflow-y-visible {\n  overflow-y: visible !important; }\n\n.overflow-y-scroll {\n  overflow-y: scroll !important; }\n\n.shadow-primary {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(233, 30, 99, 0.4) !important; }\n\n.shadow-secondary {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(210, 210, 210, 0.4) !important; }\n\n.shadow-info {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 188, 212, 0.4) !important; }\n\n.shadow-warning {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(255, 152, 0, 0.4) !important; }\n\n.shadow-success {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(76, 175, 80, 0.4) !important; }\n\n.shadow-danger {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(244, 67, 54, 0.4) !important; }\n\n.shadow-dark {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(64, 64, 64, 0.4) !important; }\n\n.shadow-light {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(233, 30, 99, 0.4) !important; }\n\n.transform-scale-5 {\n  transform: scale(0.5) !important; }\n\n.transform-scale-6 {\n  transform: scale(0.6) !important; }\n\n.transform-scale-7 {\n  transform: scale(0.7) !important; }\n\n.transform-scale-8 {\n  transform: scale(0.8) !important; }\n\n.transform-scale-9 {\n  transform: scale(0.9) !important; }\n\n.transform-scale-10 {\n  transform: scale(1) !important; }\n\n.z-index-0 {\n  z-index: 0 !important; }\n\n.z-index-1 {\n  z-index: 1 !important; }\n\n.z-index-2 {\n  z-index: 2 !important; }\n\n.z-index-3 {\n  z-index: 3 !important; }\n\n.letter-spacing-1 {\n  letter-spacing: 1px !important; }\n\n.letter-spacing-2 {\n  letter-spacing: 2px !important; }\n\n.letter-spacing-3 {\n  letter-spacing: 3px !important; }\n\n.letter-spacing-4 {\n  letter-spacing: 4px !important; }\n\n.letter-spacing-5 {\n  letter-spacing: 5px !important; }\n\n.border-radius-top-start {\n  border-top-left-radius: 0.25rem !important; }\n\n.border-radius-top-start-0 {\n  border-top-left-radius: 0 !important; }\n\n.border-radius-top-start-sm {\n  border-top-left-radius: 0.125rem !important; }\n\n.border-radius-top-start-md {\n  border-top-left-radius: 0.25rem !important; }\n\n.border-radius-top-start-lg {\n  border-top-left-radius: 0.5rem !important; }\n\n.border-radius-top-start-xl {\n  border-top-left-radius: 0.75rem !important; }\n\n.border-radius-top-start-2xl {\n  border-top-left-radius: 1rem !important; }\n\n.border-radius-top-start-circle {\n  border-top-left-radius: 50% !important; }\n\n.border-radius-top-start-pill {\n  border-top-left-radius: 50rem !important; }\n\n.border-radius-top-end {\n  border-top-right-radius: 0.25rem !important; }\n\n.border-radius-top-end-0 {\n  border-top-right-radius: 0 !important; }\n\n.border-radius-top-end-sm {\n  border-top-right-radius: 0.125rem !important; }\n\n.border-radius-top-end-md {\n  border-top-right-radius: 0.25rem !important; }\n\n.border-radius-top-end-lg {\n  border-top-right-radius: 0.5rem !important; }\n\n.border-radius-top-end-xl {\n  border-top-right-radius: 0.75rem !important; }\n\n.border-radius-top-end-2xl {\n  border-top-right-radius: 1rem !important; }\n\n.border-radius-top-end-circle {\n  border-top-right-radius: 50% !important; }\n\n.border-radius-top-end-pill {\n  border-top-right-radius: 50rem !important; }\n\n.border-radius-bottom-start {\n  border-bottom-left-radius: 0.25rem !important; }\n\n.border-radius-bottom-start-0 {\n  border-bottom-left-radius: 0 !important; }\n\n.border-radius-bottom-start-sm {\n  border-bottom-left-radius: 0.125rem !important; }\n\n.border-radius-bottom-start-md {\n  border-bottom-left-radius: 0.25rem !important; }\n\n.border-radius-bottom-start-lg {\n  border-bottom-left-radius: 0.5rem !important; }\n\n.border-radius-bottom-start-xl {\n  border-bottom-left-radius: 0.75rem !important; }\n\n.border-radius-bottom-start-2xl {\n  border-bottom-left-radius: 1rem !important; }\n\n.border-radius-bottom-start-circle {\n  border-bottom-left-radius: 50% !important; }\n\n.border-radius-bottom-start-pill {\n  border-bottom-left-radius: 50rem !important; }\n\n.border-radius-bottom-end {\n  border-bottom-right-radius: 0.25rem !important; }\n\n.border-radius-bottom-end-0 {\n  border-bottom-right-radius: 0 !important; }\n\n.border-radius-bottom-end-sm {\n  border-bottom-right-radius: 0.125rem !important; }\n\n.border-radius-bottom-end-md {\n  border-bottom-right-radius: 0.25rem !important; }\n\n.border-radius-bottom-end-lg {\n  border-bottom-right-radius: 0.5rem !important; }\n\n.border-radius-bottom-end-xl {\n  border-bottom-right-radius: 0.75rem !important; }\n\n.border-radius-bottom-end-2xl {\n  border-bottom-right-radius: 1rem !important; }\n\n.border-radius-bottom-end-circle {\n  border-bottom-right-radius: 50% !important; }\n\n.border-radius-bottom-end-pill {\n  border-bottom-right-radius: 50rem !important; }\n\n.max-height-100 {\n  max-height: 100px !important; }\n\n.max-height-150 {\n  max-height: 150px !important; }\n\n.max-height-160 {\n  max-height: 160px !important; }\n\n.max-height-200 {\n  max-height: 200px !important; }\n\n.max-height-250 {\n  max-height: 250px !important; }\n\n.max-height-300 {\n  max-height: 300px !important; }\n\n.max-height-400 {\n  max-height: 400px !important; }\n\n.max-height-500 {\n  max-height: 500px !important; }\n\n.max-height-600 {\n  max-height: 600px !important; }\n\n.max-height-vh-10 {\n  max-height: 10vh !important; }\n\n.max-height-vh-20 {\n  max-height: 20vh !important; }\n\n.max-height-vh-30 {\n  max-height: 30vh !important; }\n\n.max-height-vh-40 {\n  max-height: 40vh !important; }\n\n.max-height-vh-50 {\n  max-height: 50vh !important; }\n\n.max-height-vh-60 {\n  max-height: 60vh !important; }\n\n.max-height-vh-70 {\n  max-height: 70vh !important; }\n\n.max-height-vh-80 {\n  max-height: 80vh !important; }\n\n.max-height-vh-90 {\n  max-height: 90vh !important; }\n\n.max-height-vh-100 {\n  max-height: 100vh !important; }\n\n.min-height-100 {\n  min-height: 100px !important; }\n\n.min-height-150 {\n  min-height: 150px !important; }\n\n.min-height-160 {\n  min-height: 160px !important; }\n\n.min-height-200 {\n  min-height: 200px !important; }\n\n.min-height-250 {\n  min-height: 250px !important; }\n\n.min-height-300 {\n  min-height: 300px !important; }\n\n.min-height-400 {\n  min-height: 400px !important; }\n\n.min-height-500 {\n  min-height: 500px !important; }\n\n.min-height-600 {\n  min-height: 600px !important; }\n\n.height-100 {\n  height: 100px !important; }\n\n.height-200 {\n  height: 200px !important; }\n\n.height-300 {\n  height: 300px !important; }\n\n.height-400 {\n  height: 400px !important; }\n\n.height-500 {\n  height: 500px !important; }\n\n.height-600 {\n  height: 600px !important; }\n\n.max-width-100 {\n  max-width: 100px !important; }\n\n.max-width-200 {\n  max-width: 200px !important; }\n\n.max-width-300 {\n  max-width: 300px !important; }\n\n.max-width-400 {\n  max-width: 400px !important; }\n\n.max-width-500 {\n  max-width: 500px !important; }\n\n@media (min-width: 576px) {\n  .float-sm-start {\n    float: left !important; }\n  .float-sm-end {\n    float: right !important; }\n  .float-sm-none {\n    float: none !important; }\n  .d-sm-inline {\n    display: inline !important; }\n  .d-sm-inline-block {\n    display: inline-block !important; }\n  .d-sm-block {\n    display: block !important; }\n  .d-sm-grid {\n    display: grid !important; }\n  .d-sm-table {\n    display: table !important; }\n  .d-sm-table-row {\n    display: table-row !important; }\n  .d-sm-table-cell {\n    display: table-cell !important; }\n  .d-sm-flex {\n    display: flex !important; }\n  .d-sm-inline-flex {\n    display: inline-flex !important; }\n  .d-sm-none {\n    display: none !important; }\n  .border-top-sm {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-sm-0 {\n    border-top: 0 !important; }\n  .border-end-sm {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-sm-0 {\n    border-right: 0 !important; }\n  .border-bottom-sm {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-sm-0 {\n    border-bottom: 0 !important; }\n  .border-start-sm {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-sm-0 {\n    border-left: 0 !important; }\n  .w-sm-0 {\n    width: 0% !important; }\n  .w-sm-1 {\n    width: 1% !important; }\n  .w-sm-2 {\n    width: 2% !important; }\n  .w-sm-3 {\n    width: 3% !important; }\n  .w-sm-4 {\n    width: 4% !important; }\n  .w-sm-5 {\n    width: 5% !important; }\n  .w-sm-6 {\n    width: 6% !important; }\n  .w-sm-7 {\n    width: 7% !important; }\n  .w-sm-8 {\n    width: 8% !important; }\n  .w-sm-9 {\n    width: 9% !important; }\n  .w-sm-10 {\n    width: 10% !important; }\n  .w-sm-15 {\n    width: 15% !important; }\n  .w-sm-20 {\n    width: 20% !important; }\n  .w-sm-25 {\n    width: 25% !important; }\n  .w-sm-30 {\n    width: 30% !important; }\n  .w-sm-35 {\n    width: 35% !important; }\n  .w-sm-40 {\n    width: 40% !important; }\n  .w-sm-45 {\n    width: 45% !important; }\n  .w-sm-50 {\n    width: 50% !important; }\n  .w-sm-55 {\n    width: 55% !important; }\n  .w-sm-60 {\n    width: 60% !important; }\n  .w-sm-65 {\n    width: 65% !important; }\n  .w-sm-70 {\n    width: 70% !important; }\n  .w-sm-75 {\n    width: 75% !important; }\n  .w-sm-80 {\n    width: 80% !important; }\n  .w-sm-85 {\n    width: 85% !important; }\n  .w-sm-90 {\n    width: 90% !important; }\n  .w-sm-95 {\n    width: 95% !important; }\n  .w-sm-100 {\n    width: 100% !important; }\n  .w-sm-auto {\n    width: auto !important; }\n  .flex-sm-fill {\n    flex: 1 1 auto !important; }\n  .flex-sm-row {\n    flex-direction: row !important; }\n  .flex-sm-column {\n    flex-direction: column !important; }\n  .flex-sm-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-sm-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-sm-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-sm-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-sm-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-sm-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-sm-wrap {\n    flex-wrap: wrap !important; }\n  .flex-sm-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-sm-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-sm-0 {\n    gap: 0 !important; }\n  .gap-sm-1 {\n    gap: 0.25rem !important; }\n  .gap-sm-2 {\n    gap: 0.5rem !important; }\n  .gap-sm-3 {\n    gap: 1rem !important; }\n  .gap-sm-4 {\n    gap: 1.5rem !important; }\n  .gap-sm-5 {\n    gap: 3rem !important; }\n  .gap-sm-6 {\n    gap: 4rem !important; }\n  .gap-sm-7 {\n    gap: 6rem !important; }\n  .gap-sm-8 {\n    gap: 8rem !important; }\n  .gap-sm-9 {\n    gap: 10rem !important; }\n  .gap-sm-10 {\n    gap: 12rem !important; }\n  .gap-sm-11 {\n    gap: 14rem !important; }\n  .gap-sm-12 {\n    gap: 16rem !important; }\n  .justify-content-sm-start {\n    justify-content: flex-start !important; }\n  .justify-content-sm-end {\n    justify-content: flex-end !important; }\n  .justify-content-sm-center {\n    justify-content: center !important; }\n  .justify-content-sm-between {\n    justify-content: space-between !important; }\n  .justify-content-sm-around {\n    justify-content: space-around !important; }\n  .justify-content-sm-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-sm-start {\n    align-items: flex-start !important; }\n  .align-items-sm-end {\n    align-items: flex-end !important; }\n  .align-items-sm-center {\n    align-items: center !important; }\n  .align-items-sm-baseline {\n    align-items: baseline !important; }\n  .align-items-sm-stretch {\n    align-items: stretch !important; }\n  .align-content-sm-start {\n    align-content: flex-start !important; }\n  .align-content-sm-end {\n    align-content: flex-end !important; }\n  .align-content-sm-center {\n    align-content: center !important; }\n  .align-content-sm-between {\n    align-content: space-between !important; }\n  .align-content-sm-around {\n    align-content: space-around !important; }\n  .align-content-sm-stretch {\n    align-content: stretch !important; }\n  .align-self-sm-auto {\n    align-self: auto !important; }\n  .align-self-sm-start {\n    align-self: flex-start !important; }\n  .align-self-sm-end {\n    align-self: flex-end !important; }\n  .align-self-sm-center {\n    align-self: center !important; }\n  .align-self-sm-baseline {\n    align-self: baseline !important; }\n  .align-self-sm-stretch {\n    align-self: stretch !important; }\n  .order-sm-first {\n    order: -1 !important; }\n  .order-sm-0 {\n    order: 0 !important; }\n  .order-sm-1 {\n    order: 1 !important; }\n  .order-sm-2 {\n    order: 2 !important; }\n  .order-sm-3 {\n    order: 3 !important; }\n  .order-sm-4 {\n    order: 4 !important; }\n  .order-sm-5 {\n    order: 5 !important; }\n  .order-sm-last {\n    order: 6 !important; }\n  .m-sm-0 {\n    margin: 0 !important; }\n  .m-sm-1 {\n    margin: 0.25rem !important; }\n  .m-sm-2 {\n    margin: 0.5rem !important; }\n  .m-sm-3 {\n    margin: 1rem !important; }\n  .m-sm-4 {\n    margin: 1.5rem !important; }\n  .m-sm-5 {\n    margin: 3rem !important; }\n  .m-sm-6 {\n    margin: 4rem !important; }\n  .m-sm-7 {\n    margin: 6rem !important; }\n  .m-sm-8 {\n    margin: 8rem !important; }\n  .m-sm-9 {\n    margin: 10rem !important; }\n  .m-sm-10 {\n    margin: 12rem !important; }\n  .m-sm-11 {\n    margin: 14rem !important; }\n  .m-sm-12 {\n    margin: 16rem !important; }\n  .m-sm-auto {\n    margin: auto !important; }\n  .mx-sm-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-sm-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-sm-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-sm-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-sm-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-sm-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-sm-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-sm-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-sm-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-sm-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-sm-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-sm-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-sm-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-sm-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-sm-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-sm-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-sm-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-sm-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-sm-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-sm-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-sm-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-sm-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-sm-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-sm-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-sm-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-sm-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-sm-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-sm-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-sm-0 {\n    margin-top: 0 !important; }\n  .mt-sm-1 {\n    margin-top: 0.25rem !important; }\n  .mt-sm-2 {\n    margin-top: 0.5rem !important; }\n  .mt-sm-3 {\n    margin-top: 1rem !important; }\n  .mt-sm-4 {\n    margin-top: 1.5rem !important; }\n  .mt-sm-5 {\n    margin-top: 3rem !important; }\n  .mt-sm-6 {\n    margin-top: 4rem !important; }\n  .mt-sm-7 {\n    margin-top: 6rem !important; }\n  .mt-sm-8 {\n    margin-top: 8rem !important; }\n  .mt-sm-9 {\n    margin-top: 10rem !important; }\n  .mt-sm-10 {\n    margin-top: 12rem !important; }\n  .mt-sm-11 {\n    margin-top: 14rem !important; }\n  .mt-sm-12 {\n    margin-top: 16rem !important; }\n  .mt-sm-auto {\n    margin-top: auto !important; }\n  .me-sm-0 {\n    margin-right: 0 !important; }\n  .me-sm-1 {\n    margin-right: 0.25rem !important; }\n  .me-sm-2 {\n    margin-right: 0.5rem !important; }\n  .me-sm-3 {\n    margin-right: 1rem !important; }\n  .me-sm-4 {\n    margin-right: 1.5rem !important; }\n  .me-sm-5 {\n    margin-right: 3rem !important; }\n  .me-sm-6 {\n    margin-right: 4rem !important; }\n  .me-sm-7 {\n    margin-right: 6rem !important; }\n  .me-sm-8 {\n    margin-right: 8rem !important; }\n  .me-sm-9 {\n    margin-right: 10rem !important; }\n  .me-sm-10 {\n    margin-right: 12rem !important; }\n  .me-sm-11 {\n    margin-right: 14rem !important; }\n  .me-sm-12 {\n    margin-right: 16rem !important; }\n  .me-sm-auto {\n    margin-right: auto !important; }\n  .mb-sm-0 {\n    margin-bottom: 0 !important; }\n  .mb-sm-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-sm-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-sm-3 {\n    margin-bottom: 1rem !important; }\n  .mb-sm-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-sm-5 {\n    margin-bottom: 3rem !important; }\n  .mb-sm-6 {\n    margin-bottom: 4rem !important; }\n  .mb-sm-7 {\n    margin-bottom: 6rem !important; }\n  .mb-sm-8 {\n    margin-bottom: 8rem !important; }\n  .mb-sm-9 {\n    margin-bottom: 10rem !important; }\n  .mb-sm-10 {\n    margin-bottom: 12rem !important; }\n  .mb-sm-11 {\n    margin-bottom: 14rem !important; }\n  .mb-sm-12 {\n    margin-bottom: 16rem !important; }\n  .mb-sm-auto {\n    margin-bottom: auto !important; }\n  .ms-sm-0 {\n    margin-left: 0 !important; }\n  .ms-sm-1 {\n    margin-left: 0.25rem !important; }\n  .ms-sm-2 {\n    margin-left: 0.5rem !important; }\n  .ms-sm-3 {\n    margin-left: 1rem !important; }\n  .ms-sm-4 {\n    margin-left: 1.5rem !important; }\n  .ms-sm-5 {\n    margin-left: 3rem !important; }\n  .ms-sm-6 {\n    margin-left: 4rem !important; }\n  .ms-sm-7 {\n    margin-left: 6rem !important; }\n  .ms-sm-8 {\n    margin-left: 8rem !important; }\n  .ms-sm-9 {\n    margin-left: 10rem !important; }\n  .ms-sm-10 {\n    margin-left: 12rem !important; }\n  .ms-sm-11 {\n    margin-left: 14rem !important; }\n  .ms-sm-12 {\n    margin-left: 16rem !important; }\n  .ms-sm-auto {\n    margin-left: auto !important; }\n  .m-sm-n1 {\n    margin: -0.25rem !important; }\n  .m-sm-n2 {\n    margin: -0.5rem !important; }\n  .m-sm-n3 {\n    margin: -1rem !important; }\n  .m-sm-n4 {\n    margin: -1.5rem !important; }\n  .m-sm-n5 {\n    margin: -3rem !important; }\n  .m-sm-n6 {\n    margin: -4rem !important; }\n  .m-sm-n7 {\n    margin: -6rem !important; }\n  .m-sm-n8 {\n    margin: -8rem !important; }\n  .m-sm-n9 {\n    margin: -10rem !important; }\n  .m-sm-n10 {\n    margin: -12rem !important; }\n  .m-sm-n11 {\n    margin: -14rem !important; }\n  .m-sm-n12 {\n    margin: -16rem !important; }\n  .mx-sm-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-sm-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-sm-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-sm-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-sm-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-sm-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-sm-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-sm-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-sm-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-sm-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-sm-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-sm-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-sm-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-sm-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-sm-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-sm-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-sm-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-sm-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-sm-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-sm-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-sm-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-sm-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-sm-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-sm-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-sm-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-sm-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-sm-n3 {\n    margin-top: -1rem !important; }\n  .mt-sm-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-sm-n5 {\n    margin-top: -3rem !important; }\n  .mt-sm-n6 {\n    margin-top: -4rem !important; }\n  .mt-sm-n7 {\n    margin-top: -6rem !important; }\n  .mt-sm-n8 {\n    margin-top: -8rem !important; }\n  .mt-sm-n9 {\n    margin-top: -10rem !important; }\n  .mt-sm-n10 {\n    margin-top: -12rem !important; }\n  .mt-sm-n11 {\n    margin-top: -14rem !important; }\n  .mt-sm-n12 {\n    margin-top: -16rem !important; }\n  .me-sm-n1 {\n    margin-right: -0.25rem !important; }\n  .me-sm-n2 {\n    margin-right: -0.5rem !important; }\n  .me-sm-n3 {\n    margin-right: -1rem !important; }\n  .me-sm-n4 {\n    margin-right: -1.5rem !important; }\n  .me-sm-n5 {\n    margin-right: -3rem !important; }\n  .me-sm-n6 {\n    margin-right: -4rem !important; }\n  .me-sm-n7 {\n    margin-right: -6rem !important; }\n  .me-sm-n8 {\n    margin-right: -8rem !important; }\n  .me-sm-n9 {\n    margin-right: -10rem !important; }\n  .me-sm-n10 {\n    margin-right: -12rem !important; }\n  .me-sm-n11 {\n    margin-right: -14rem !important; }\n  .me-sm-n12 {\n    margin-right: -16rem !important; }\n  .mb-sm-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-sm-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-sm-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-sm-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-sm-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-sm-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-sm-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-sm-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-sm-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-sm-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-sm-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-sm-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-sm-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-sm-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-sm-n3 {\n    margin-left: -1rem !important; }\n  .ms-sm-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-sm-n5 {\n    margin-left: -3rem !important; }\n  .ms-sm-n6 {\n    margin-left: -4rem !important; }\n  .ms-sm-n7 {\n    margin-left: -6rem !important; }\n  .ms-sm-n8 {\n    margin-left: -8rem !important; }\n  .ms-sm-n9 {\n    margin-left: -10rem !important; }\n  .ms-sm-n10 {\n    margin-left: -12rem !important; }\n  .ms-sm-n11 {\n    margin-left: -14rem !important; }\n  .ms-sm-n12 {\n    margin-left: -16rem !important; }\n  .p-sm-0 {\n    padding: 0 !important; }\n  .p-sm-1 {\n    padding: 0.25rem !important; }\n  .p-sm-2 {\n    padding: 0.5rem !important; }\n  .p-sm-3 {\n    padding: 1rem !important; }\n  .p-sm-4 {\n    padding: 1.5rem !important; }\n  .p-sm-5 {\n    padding: 3rem !important; }\n  .p-sm-6 {\n    padding: 4rem !important; }\n  .p-sm-7 {\n    padding: 6rem !important; }\n  .p-sm-8 {\n    padding: 8rem !important; }\n  .p-sm-9 {\n    padding: 10rem !important; }\n  .p-sm-10 {\n    padding: 12rem !important; }\n  .p-sm-11 {\n    padding: 14rem !important; }\n  .p-sm-12 {\n    padding: 16rem !important; }\n  .px-sm-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-sm-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-sm-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-sm-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-sm-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-sm-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-sm-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-sm-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-sm-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-sm-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-sm-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-sm-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-sm-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-sm-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-sm-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-sm-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-sm-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-sm-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-sm-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-sm-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-sm-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-sm-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-sm-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-sm-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-sm-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-sm-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-sm-0 {\n    padding-top: 0 !important; }\n  .pt-sm-1 {\n    padding-top: 0.25rem !important; }\n  .pt-sm-2 {\n    padding-top: 0.5rem !important; }\n  .pt-sm-3 {\n    padding-top: 1rem !important; }\n  .pt-sm-4 {\n    padding-top: 1.5rem !important; }\n  .pt-sm-5 {\n    padding-top: 3rem !important; }\n  .pt-sm-6 {\n    padding-top: 4rem !important; }\n  .pt-sm-7 {\n    padding-top: 6rem !important; }\n  .pt-sm-8 {\n    padding-top: 8rem !important; }\n  .pt-sm-9 {\n    padding-top: 10rem !important; }\n  .pt-sm-10 {\n    padding-top: 12rem !important; }\n  .pt-sm-11 {\n    padding-top: 14rem !important; }\n  .pt-sm-12 {\n    padding-top: 16rem !important; }\n  .pe-sm-0 {\n    padding-right: 0 !important; }\n  .pe-sm-1 {\n    padding-right: 0.25rem !important; }\n  .pe-sm-2 {\n    padding-right: 0.5rem !important; }\n  .pe-sm-3 {\n    padding-right: 1rem !important; }\n  .pe-sm-4 {\n    padding-right: 1.5rem !important; }\n  .pe-sm-5 {\n    padding-right: 3rem !important; }\n  .pe-sm-6 {\n    padding-right: 4rem !important; }\n  .pe-sm-7 {\n    padding-right: 6rem !important; }\n  .pe-sm-8 {\n    padding-right: 8rem !important; }\n  .pe-sm-9 {\n    padding-right: 10rem !important; }\n  .pe-sm-10 {\n    padding-right: 12rem !important; }\n  .pe-sm-11 {\n    padding-right: 14rem !important; }\n  .pe-sm-12 {\n    padding-right: 16rem !important; }\n  .pb-sm-0 {\n    padding-bottom: 0 !important; }\n  .pb-sm-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-sm-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-sm-3 {\n    padding-bottom: 1rem !important; }\n  .pb-sm-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-sm-5 {\n    padding-bottom: 3rem !important; }\n  .pb-sm-6 {\n    padding-bottom: 4rem !important; }\n  .pb-sm-7 {\n    padding-bottom: 6rem !important; }\n  .pb-sm-8 {\n    padding-bottom: 8rem !important; }\n  .pb-sm-9 {\n    padding-bottom: 10rem !important; }\n  .pb-sm-10 {\n    padding-bottom: 12rem !important; }\n  .pb-sm-11 {\n    padding-bottom: 14rem !important; }\n  .pb-sm-12 {\n    padding-bottom: 16rem !important; }\n  .ps-sm-0 {\n    padding-left: 0 !important; }\n  .ps-sm-1 {\n    padding-left: 0.25rem !important; }\n  .ps-sm-2 {\n    padding-left: 0.5rem !important; }\n  .ps-sm-3 {\n    padding-left: 1rem !important; }\n  .ps-sm-4 {\n    padding-left: 1.5rem !important; }\n  .ps-sm-5 {\n    padding-left: 3rem !important; }\n  .ps-sm-6 {\n    padding-left: 4rem !important; }\n  .ps-sm-7 {\n    padding-left: 6rem !important; }\n  .ps-sm-8 {\n    padding-left: 8rem !important; }\n  .ps-sm-9 {\n    padding-left: 10rem !important; }\n  .ps-sm-10 {\n    padding-left: 12rem !important; }\n  .ps-sm-11 {\n    padding-left: 14rem !important; }\n  .ps-sm-12 {\n    padding-left: 16rem !important; }\n  .text-sm-start {\n    text-align: left !important; }\n  .text-sm-end {\n    text-align: right !important; }\n  .text-sm-center {\n    text-align: center !important; }\n  .transform-scale-sm-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-sm-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-sm-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-sm-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-sm-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-sm-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-sm {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-sm-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-sm-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-sm-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-sm-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-sm-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-sm-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-sm-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-sm-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-sm {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-sm-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-sm-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-sm-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-sm-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-sm-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-sm-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-sm-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-sm-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-sm {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-sm-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-sm-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-sm-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-sm-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-sm-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-sm-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-sm-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-sm-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-sm {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-sm-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-sm-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-sm-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-sm-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-sm-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-sm-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-sm-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-sm-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 768px) {\n  .float-md-start {\n    float: left !important; }\n  .float-md-end {\n    float: right !important; }\n  .float-md-none {\n    float: none !important; }\n  .d-md-inline {\n    display: inline !important; }\n  .d-md-inline-block {\n    display: inline-block !important; }\n  .d-md-block {\n    display: block !important; }\n  .d-md-grid {\n    display: grid !important; }\n  .d-md-table {\n    display: table !important; }\n  .d-md-table-row {\n    display: table-row !important; }\n  .d-md-table-cell {\n    display: table-cell !important; }\n  .d-md-flex {\n    display: flex !important; }\n  .d-md-inline-flex {\n    display: inline-flex !important; }\n  .d-md-none {\n    display: none !important; }\n  .border-top-md {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-md-0 {\n    border-top: 0 !important; }\n  .border-end-md {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-md-0 {\n    border-right: 0 !important; }\n  .border-bottom-md {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-md-0 {\n    border-bottom: 0 !important; }\n  .border-start-md {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-md-0 {\n    border-left: 0 !important; }\n  .w-md-0 {\n    width: 0% !important; }\n  .w-md-1 {\n    width: 1% !important; }\n  .w-md-2 {\n    width: 2% !important; }\n  .w-md-3 {\n    width: 3% !important; }\n  .w-md-4 {\n    width: 4% !important; }\n  .w-md-5 {\n    width: 5% !important; }\n  .w-md-6 {\n    width: 6% !important; }\n  .w-md-7 {\n    width: 7% !important; }\n  .w-md-8 {\n    width: 8% !important; }\n  .w-md-9 {\n    width: 9% !important; }\n  .w-md-10 {\n    width: 10% !important; }\n  .w-md-15 {\n    width: 15% !important; }\n  .w-md-20 {\n    width: 20% !important; }\n  .w-md-25 {\n    width: 25% !important; }\n  .w-md-30 {\n    width: 30% !important; }\n  .w-md-35 {\n    width: 35% !important; }\n  .w-md-40 {\n    width: 40% !important; }\n  .w-md-45 {\n    width: 45% !important; }\n  .w-md-50 {\n    width: 50% !important; }\n  .w-md-55 {\n    width: 55% !important; }\n  .w-md-60 {\n    width: 60% !important; }\n  .w-md-65 {\n    width: 65% !important; }\n  .w-md-70 {\n    width: 70% !important; }\n  .w-md-75 {\n    width: 75% !important; }\n  .w-md-80 {\n    width: 80% !important; }\n  .w-md-85 {\n    width: 85% !important; }\n  .w-md-90 {\n    width: 90% !important; }\n  .w-md-95 {\n    width: 95% !important; }\n  .w-md-100 {\n    width: 100% !important; }\n  .w-md-auto {\n    width: auto !important; }\n  .flex-md-fill {\n    flex: 1 1 auto !important; }\n  .flex-md-row {\n    flex-direction: row !important; }\n  .flex-md-column {\n    flex-direction: column !important; }\n  .flex-md-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-md-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-md-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-md-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-md-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-md-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-md-wrap {\n    flex-wrap: wrap !important; }\n  .flex-md-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-md-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-md-0 {\n    gap: 0 !important; }\n  .gap-md-1 {\n    gap: 0.25rem !important; }\n  .gap-md-2 {\n    gap: 0.5rem !important; }\n  .gap-md-3 {\n    gap: 1rem !important; }\n  .gap-md-4 {\n    gap: 1.5rem !important; }\n  .gap-md-5 {\n    gap: 3rem !important; }\n  .gap-md-6 {\n    gap: 4rem !important; }\n  .gap-md-7 {\n    gap: 6rem !important; }\n  .gap-md-8 {\n    gap: 8rem !important; }\n  .gap-md-9 {\n    gap: 10rem !important; }\n  .gap-md-10 {\n    gap: 12rem !important; }\n  .gap-md-11 {\n    gap: 14rem !important; }\n  .gap-md-12 {\n    gap: 16rem !important; }\n  .justify-content-md-start {\n    justify-content: flex-start !important; }\n  .justify-content-md-end {\n    justify-content: flex-end !important; }\n  .justify-content-md-center {\n    justify-content: center !important; }\n  .justify-content-md-between {\n    justify-content: space-between !important; }\n  .justify-content-md-around {\n    justify-content: space-around !important; }\n  .justify-content-md-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-md-start {\n    align-items: flex-start !important; }\n  .align-items-md-end {\n    align-items: flex-end !important; }\n  .align-items-md-center {\n    align-items: center !important; }\n  .align-items-md-baseline {\n    align-items: baseline !important; }\n  .align-items-md-stretch {\n    align-items: stretch !important; }\n  .align-content-md-start {\n    align-content: flex-start !important; }\n  .align-content-md-end {\n    align-content: flex-end !important; }\n  .align-content-md-center {\n    align-content: center !important; }\n  .align-content-md-between {\n    align-content: space-between !important; }\n  .align-content-md-around {\n    align-content: space-around !important; }\n  .align-content-md-stretch {\n    align-content: stretch !important; }\n  .align-self-md-auto {\n    align-self: auto !important; }\n  .align-self-md-start {\n    align-self: flex-start !important; }\n  .align-self-md-end {\n    align-self: flex-end !important; }\n  .align-self-md-center {\n    align-self: center !important; }\n  .align-self-md-baseline {\n    align-self: baseline !important; }\n  .align-self-md-stretch {\n    align-self: stretch !important; }\n  .order-md-first {\n    order: -1 !important; }\n  .order-md-0 {\n    order: 0 !important; }\n  .order-md-1 {\n    order: 1 !important; }\n  .order-md-2 {\n    order: 2 !important; }\n  .order-md-3 {\n    order: 3 !important; }\n  .order-md-4 {\n    order: 4 !important; }\n  .order-md-5 {\n    order: 5 !important; }\n  .order-md-last {\n    order: 6 !important; }\n  .m-md-0 {\n    margin: 0 !important; }\n  .m-md-1 {\n    margin: 0.25rem !important; }\n  .m-md-2 {\n    margin: 0.5rem !important; }\n  .m-md-3 {\n    margin: 1rem !important; }\n  .m-md-4 {\n    margin: 1.5rem !important; }\n  .m-md-5 {\n    margin: 3rem !important; }\n  .m-md-6 {\n    margin: 4rem !important; }\n  .m-md-7 {\n    margin: 6rem !important; }\n  .m-md-8 {\n    margin: 8rem !important; }\n  .m-md-9 {\n    margin: 10rem !important; }\n  .m-md-10 {\n    margin: 12rem !important; }\n  .m-md-11 {\n    margin: 14rem !important; }\n  .m-md-12 {\n    margin: 16rem !important; }\n  .m-md-auto {\n    margin: auto !important; }\n  .mx-md-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-md-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-md-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-md-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-md-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-md-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-md-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-md-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-md-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-md-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-md-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-md-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-md-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-md-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-md-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-md-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-md-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-md-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-md-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-md-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-md-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-md-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-md-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-md-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-md-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-md-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-md-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-md-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-md-0 {\n    margin-top: 0 !important; }\n  .mt-md-1 {\n    margin-top: 0.25rem !important; }\n  .mt-md-2 {\n    margin-top: 0.5rem !important; }\n  .mt-md-3 {\n    margin-top: 1rem !important; }\n  .mt-md-4 {\n    margin-top: 1.5rem !important; }\n  .mt-md-5 {\n    margin-top: 3rem !important; }\n  .mt-md-6 {\n    margin-top: 4rem !important; }\n  .mt-md-7 {\n    margin-top: 6rem !important; }\n  .mt-md-8 {\n    margin-top: 8rem !important; }\n  .mt-md-9 {\n    margin-top: 10rem !important; }\n  .mt-md-10 {\n    margin-top: 12rem !important; }\n  .mt-md-11 {\n    margin-top: 14rem !important; }\n  .mt-md-12 {\n    margin-top: 16rem !important; }\n  .mt-md-auto {\n    margin-top: auto !important; }\n  .me-md-0 {\n    margin-right: 0 !important; }\n  .me-md-1 {\n    margin-right: 0.25rem !important; }\n  .me-md-2 {\n    margin-right: 0.5rem !important; }\n  .me-md-3 {\n    margin-right: 1rem !important; }\n  .me-md-4 {\n    margin-right: 1.5rem !important; }\n  .me-md-5 {\n    margin-right: 3rem !important; }\n  .me-md-6 {\n    margin-right: 4rem !important; }\n  .me-md-7 {\n    margin-right: 6rem !important; }\n  .me-md-8 {\n    margin-right: 8rem !important; }\n  .me-md-9 {\n    margin-right: 10rem !important; }\n  .me-md-10 {\n    margin-right: 12rem !important; }\n  .me-md-11 {\n    margin-right: 14rem !important; }\n  .me-md-12 {\n    margin-right: 16rem !important; }\n  .me-md-auto {\n    margin-right: auto !important; }\n  .mb-md-0 {\n    margin-bottom: 0 !important; }\n  .mb-md-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-md-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-md-3 {\n    margin-bottom: 1rem !important; }\n  .mb-md-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-md-5 {\n    margin-bottom: 3rem !important; }\n  .mb-md-6 {\n    margin-bottom: 4rem !important; }\n  .mb-md-7 {\n    margin-bottom: 6rem !important; }\n  .mb-md-8 {\n    margin-bottom: 8rem !important; }\n  .mb-md-9 {\n    margin-bottom: 10rem !important; }\n  .mb-md-10 {\n    margin-bottom: 12rem !important; }\n  .mb-md-11 {\n    margin-bottom: 14rem !important; }\n  .mb-md-12 {\n    margin-bottom: 16rem !important; }\n  .mb-md-auto {\n    margin-bottom: auto !important; }\n  .ms-md-0 {\n    margin-left: 0 !important; }\n  .ms-md-1 {\n    margin-left: 0.25rem !important; }\n  .ms-md-2 {\n    margin-left: 0.5rem !important; }\n  .ms-md-3 {\n    margin-left: 1rem !important; }\n  .ms-md-4 {\n    margin-left: 1.5rem !important; }\n  .ms-md-5 {\n    margin-left: 3rem !important; }\n  .ms-md-6 {\n    margin-left: 4rem !important; }\n  .ms-md-7 {\n    margin-left: 6rem !important; }\n  .ms-md-8 {\n    margin-left: 8rem !important; }\n  .ms-md-9 {\n    margin-left: 10rem !important; }\n  .ms-md-10 {\n    margin-left: 12rem !important; }\n  .ms-md-11 {\n    margin-left: 14rem !important; }\n  .ms-md-12 {\n    margin-left: 16rem !important; }\n  .ms-md-auto {\n    margin-left: auto !important; }\n  .m-md-n1 {\n    margin: -0.25rem !important; }\n  .m-md-n2 {\n    margin: -0.5rem !important; }\n  .m-md-n3 {\n    margin: -1rem !important; }\n  .m-md-n4 {\n    margin: -1.5rem !important; }\n  .m-md-n5 {\n    margin: -3rem !important; }\n  .m-md-n6 {\n    margin: -4rem !important; }\n  .m-md-n7 {\n    margin: -6rem !important; }\n  .m-md-n8 {\n    margin: -8rem !important; }\n  .m-md-n9 {\n    margin: -10rem !important; }\n  .m-md-n10 {\n    margin: -12rem !important; }\n  .m-md-n11 {\n    margin: -14rem !important; }\n  .m-md-n12 {\n    margin: -16rem !important; }\n  .mx-md-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-md-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-md-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-md-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-md-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-md-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-md-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-md-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-md-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-md-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-md-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-md-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-md-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-md-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-md-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-md-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-md-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-md-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-md-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-md-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-md-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-md-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-md-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-md-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-md-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-md-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-md-n3 {\n    margin-top: -1rem !important; }\n  .mt-md-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-md-n5 {\n    margin-top: -3rem !important; }\n  .mt-md-n6 {\n    margin-top: -4rem !important; }\n  .mt-md-n7 {\n    margin-top: -6rem !important; }\n  .mt-md-n8 {\n    margin-top: -8rem !important; }\n  .mt-md-n9 {\n    margin-top: -10rem !important; }\n  .mt-md-n10 {\n    margin-top: -12rem !important; }\n  .mt-md-n11 {\n    margin-top: -14rem !important; }\n  .mt-md-n12 {\n    margin-top: -16rem !important; }\n  .me-md-n1 {\n    margin-right: -0.25rem !important; }\n  .me-md-n2 {\n    margin-right: -0.5rem !important; }\n  .me-md-n3 {\n    margin-right: -1rem !important; }\n  .me-md-n4 {\n    margin-right: -1.5rem !important; }\n  .me-md-n5 {\n    margin-right: -3rem !important; }\n  .me-md-n6 {\n    margin-right: -4rem !important; }\n  .me-md-n7 {\n    margin-right: -6rem !important; }\n  .me-md-n8 {\n    margin-right: -8rem !important; }\n  .me-md-n9 {\n    margin-right: -10rem !important; }\n  .me-md-n10 {\n    margin-right: -12rem !important; }\n  .me-md-n11 {\n    margin-right: -14rem !important; }\n  .me-md-n12 {\n    margin-right: -16rem !important; }\n  .mb-md-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-md-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-md-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-md-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-md-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-md-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-md-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-md-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-md-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-md-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-md-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-md-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-md-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-md-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-md-n3 {\n    margin-left: -1rem !important; }\n  .ms-md-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-md-n5 {\n    margin-left: -3rem !important; }\n  .ms-md-n6 {\n    margin-left: -4rem !important; }\n  .ms-md-n7 {\n    margin-left: -6rem !important; }\n  .ms-md-n8 {\n    margin-left: -8rem !important; }\n  .ms-md-n9 {\n    margin-left: -10rem !important; }\n  .ms-md-n10 {\n    margin-left: -12rem !important; }\n  .ms-md-n11 {\n    margin-left: -14rem !important; }\n  .ms-md-n12 {\n    margin-left: -16rem !important; }\n  .p-md-0 {\n    padding: 0 !important; }\n  .p-md-1 {\n    padding: 0.25rem !important; }\n  .p-md-2 {\n    padding: 0.5rem !important; }\n  .p-md-3 {\n    padding: 1rem !important; }\n  .p-md-4 {\n    padding: 1.5rem !important; }\n  .p-md-5 {\n    padding: 3rem !important; }\n  .p-md-6 {\n    padding: 4rem !important; }\n  .p-md-7 {\n    padding: 6rem !important; }\n  .p-md-8 {\n    padding: 8rem !important; }\n  .p-md-9 {\n    padding: 10rem !important; }\n  .p-md-10 {\n    padding: 12rem !important; }\n  .p-md-11 {\n    padding: 14rem !important; }\n  .p-md-12 {\n    padding: 16rem !important; }\n  .px-md-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-md-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-md-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-md-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-md-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-md-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-md-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-md-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-md-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-md-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-md-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-md-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-md-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-md-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-md-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-md-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-md-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-md-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-md-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-md-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-md-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-md-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-md-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-md-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-md-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-md-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-md-0 {\n    padding-top: 0 !important; }\n  .pt-md-1 {\n    padding-top: 0.25rem !important; }\n  .pt-md-2 {\n    padding-top: 0.5rem !important; }\n  .pt-md-3 {\n    padding-top: 1rem !important; }\n  .pt-md-4 {\n    padding-top: 1.5rem !important; }\n  .pt-md-5 {\n    padding-top: 3rem !important; }\n  .pt-md-6 {\n    padding-top: 4rem !important; }\n  .pt-md-7 {\n    padding-top: 6rem !important; }\n  .pt-md-8 {\n    padding-top: 8rem !important; }\n  .pt-md-9 {\n    padding-top: 10rem !important; }\n  .pt-md-10 {\n    padding-top: 12rem !important; }\n  .pt-md-11 {\n    padding-top: 14rem !important; }\n  .pt-md-12 {\n    padding-top: 16rem !important; }\n  .pe-md-0 {\n    padding-right: 0 !important; }\n  .pe-md-1 {\n    padding-right: 0.25rem !important; }\n  .pe-md-2 {\n    padding-right: 0.5rem !important; }\n  .pe-md-3 {\n    padding-right: 1rem !important; }\n  .pe-md-4 {\n    padding-right: 1.5rem !important; }\n  .pe-md-5 {\n    padding-right: 3rem !important; }\n  .pe-md-6 {\n    padding-right: 4rem !important; }\n  .pe-md-7 {\n    padding-right: 6rem !important; }\n  .pe-md-8 {\n    padding-right: 8rem !important; }\n  .pe-md-9 {\n    padding-right: 10rem !important; }\n  .pe-md-10 {\n    padding-right: 12rem !important; }\n  .pe-md-11 {\n    padding-right: 14rem !important; }\n  .pe-md-12 {\n    padding-right: 16rem !important; }\n  .pb-md-0 {\n    padding-bottom: 0 !important; }\n  .pb-md-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-md-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-md-3 {\n    padding-bottom: 1rem !important; }\n  .pb-md-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-md-5 {\n    padding-bottom: 3rem !important; }\n  .pb-md-6 {\n    padding-bottom: 4rem !important; }\n  .pb-md-7 {\n    padding-bottom: 6rem !important; }\n  .pb-md-8 {\n    padding-bottom: 8rem !important; }\n  .pb-md-9 {\n    padding-bottom: 10rem !important; }\n  .pb-md-10 {\n    padding-bottom: 12rem !important; }\n  .pb-md-11 {\n    padding-bottom: 14rem !important; }\n  .pb-md-12 {\n    padding-bottom: 16rem !important; }\n  .ps-md-0 {\n    padding-left: 0 !important; }\n  .ps-md-1 {\n    padding-left: 0.25rem !important; }\n  .ps-md-2 {\n    padding-left: 0.5rem !important; }\n  .ps-md-3 {\n    padding-left: 1rem !important; }\n  .ps-md-4 {\n    padding-left: 1.5rem !important; }\n  .ps-md-5 {\n    padding-left: 3rem !important; }\n  .ps-md-6 {\n    padding-left: 4rem !important; }\n  .ps-md-7 {\n    padding-left: 6rem !important; }\n  .ps-md-8 {\n    padding-left: 8rem !important; }\n  .ps-md-9 {\n    padding-left: 10rem !important; }\n  .ps-md-10 {\n    padding-left: 12rem !important; }\n  .ps-md-11 {\n    padding-left: 14rem !important; }\n  .ps-md-12 {\n    padding-left: 16rem !important; }\n  .text-md-start {\n    text-align: left !important; }\n  .text-md-end {\n    text-align: right !important; }\n  .text-md-center {\n    text-align: center !important; }\n  .transform-scale-md-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-md-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-md-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-md-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-md-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-md-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-md-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-md-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-md-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-md-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-md-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-md-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-md-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-md-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-md-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-md-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-md-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-md-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-md-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-md-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-md-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-md-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-md-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-md-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-md-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-md-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-md-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-md-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-md-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-md-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-md-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-md-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-md-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-md-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-md-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-md-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-md-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-md-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 992px) {\n  .float-lg-start {\n    float: left !important; }\n  .float-lg-end {\n    float: right !important; }\n  .float-lg-none {\n    float: none !important; }\n  .d-lg-inline {\n    display: inline !important; }\n  .d-lg-inline-block {\n    display: inline-block !important; }\n  .d-lg-block {\n    display: block !important; }\n  .d-lg-grid {\n    display: grid !important; }\n  .d-lg-table {\n    display: table !important; }\n  .d-lg-table-row {\n    display: table-row !important; }\n  .d-lg-table-cell {\n    display: table-cell !important; }\n  .d-lg-flex {\n    display: flex !important; }\n  .d-lg-inline-flex {\n    display: inline-flex !important; }\n  .d-lg-none {\n    display: none !important; }\n  .border-top-lg {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-lg-0 {\n    border-top: 0 !important; }\n  .border-end-lg {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-lg-0 {\n    border-right: 0 !important; }\n  .border-bottom-lg {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-lg-0 {\n    border-bottom: 0 !important; }\n  .border-start-lg {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-lg-0 {\n    border-left: 0 !important; }\n  .w-lg-0 {\n    width: 0% !important; }\n  .w-lg-1 {\n    width: 1% !important; }\n  .w-lg-2 {\n    width: 2% !important; }\n  .w-lg-3 {\n    width: 3% !important; }\n  .w-lg-4 {\n    width: 4% !important; }\n  .w-lg-5 {\n    width: 5% !important; }\n  .w-lg-6 {\n    width: 6% !important; }\n  .w-lg-7 {\n    width: 7% !important; }\n  .w-lg-8 {\n    width: 8% !important; }\n  .w-lg-9 {\n    width: 9% !important; }\n  .w-lg-10 {\n    width: 10% !important; }\n  .w-lg-15 {\n    width: 15% !important; }\n  .w-lg-20 {\n    width: 20% !important; }\n  .w-lg-25 {\n    width: 25% !important; }\n  .w-lg-30 {\n    width: 30% !important; }\n  .w-lg-35 {\n    width: 35% !important; }\n  .w-lg-40 {\n    width: 40% !important; }\n  .w-lg-45 {\n    width: 45% !important; }\n  .w-lg-50 {\n    width: 50% !important; }\n  .w-lg-55 {\n    width: 55% !important; }\n  .w-lg-60 {\n    width: 60% !important; }\n  .w-lg-65 {\n    width: 65% !important; }\n  .w-lg-70 {\n    width: 70% !important; }\n  .w-lg-75 {\n    width: 75% !important; }\n  .w-lg-80 {\n    width: 80% !important; }\n  .w-lg-85 {\n    width: 85% !important; }\n  .w-lg-90 {\n    width: 90% !important; }\n  .w-lg-95 {\n    width: 95% !important; }\n  .w-lg-100 {\n    width: 100% !important; }\n  .w-lg-auto {\n    width: auto !important; }\n  .flex-lg-fill {\n    flex: 1 1 auto !important; }\n  .flex-lg-row {\n    flex-direction: row !important; }\n  .flex-lg-column {\n    flex-direction: column !important; }\n  .flex-lg-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-lg-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-lg-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-lg-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-lg-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-lg-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-lg-wrap {\n    flex-wrap: wrap !important; }\n  .flex-lg-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-lg-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-lg-0 {\n    gap: 0 !important; }\n  .gap-lg-1 {\n    gap: 0.25rem !important; }\n  .gap-lg-2 {\n    gap: 0.5rem !important; }\n  .gap-lg-3 {\n    gap: 1rem !important; }\n  .gap-lg-4 {\n    gap: 1.5rem !important; }\n  .gap-lg-5 {\n    gap: 3rem !important; }\n  .gap-lg-6 {\n    gap: 4rem !important; }\n  .gap-lg-7 {\n    gap: 6rem !important; }\n  .gap-lg-8 {\n    gap: 8rem !important; }\n  .gap-lg-9 {\n    gap: 10rem !important; }\n  .gap-lg-10 {\n    gap: 12rem !important; }\n  .gap-lg-11 {\n    gap: 14rem !important; }\n  .gap-lg-12 {\n    gap: 16rem !important; }\n  .justify-content-lg-start {\n    justify-content: flex-start !important; }\n  .justify-content-lg-end {\n    justify-content: flex-end !important; }\n  .justify-content-lg-center {\n    justify-content: center !important; }\n  .justify-content-lg-between {\n    justify-content: space-between !important; }\n  .justify-content-lg-around {\n    justify-content: space-around !important; }\n  .justify-content-lg-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-lg-start {\n    align-items: flex-start !important; }\n  .align-items-lg-end {\n    align-items: flex-end !important; }\n  .align-items-lg-center {\n    align-items: center !important; }\n  .align-items-lg-baseline {\n    align-items: baseline !important; }\n  .align-items-lg-stretch {\n    align-items: stretch !important; }\n  .align-content-lg-start {\n    align-content: flex-start !important; }\n  .align-content-lg-end {\n    align-content: flex-end !important; }\n  .align-content-lg-center {\n    align-content: center !important; }\n  .align-content-lg-between {\n    align-content: space-between !important; }\n  .align-content-lg-around {\n    align-content: space-around !important; }\n  .align-content-lg-stretch {\n    align-content: stretch !important; }\n  .align-self-lg-auto {\n    align-self: auto !important; }\n  .align-self-lg-start {\n    align-self: flex-start !important; }\n  .align-self-lg-end {\n    align-self: flex-end !important; }\n  .align-self-lg-center {\n    align-self: center !important; }\n  .align-self-lg-baseline {\n    align-self: baseline !important; }\n  .align-self-lg-stretch {\n    align-self: stretch !important; }\n  .order-lg-first {\n    order: -1 !important; }\n  .order-lg-0 {\n    order: 0 !important; }\n  .order-lg-1 {\n    order: 1 !important; }\n  .order-lg-2 {\n    order: 2 !important; }\n  .order-lg-3 {\n    order: 3 !important; }\n  .order-lg-4 {\n    order: 4 !important; }\n  .order-lg-5 {\n    order: 5 !important; }\n  .order-lg-last {\n    order: 6 !important; }\n  .m-lg-0 {\n    margin: 0 !important; }\n  .m-lg-1 {\n    margin: 0.25rem !important; }\n  .m-lg-2 {\n    margin: 0.5rem !important; }\n  .m-lg-3 {\n    margin: 1rem !important; }\n  .m-lg-4 {\n    margin: 1.5rem !important; }\n  .m-lg-5 {\n    margin: 3rem !important; }\n  .m-lg-6 {\n    margin: 4rem !important; }\n  .m-lg-7 {\n    margin: 6rem !important; }\n  .m-lg-8 {\n    margin: 8rem !important; }\n  .m-lg-9 {\n    margin: 10rem !important; }\n  .m-lg-10 {\n    margin: 12rem !important; }\n  .m-lg-11 {\n    margin: 14rem !important; }\n  .m-lg-12 {\n    margin: 16rem !important; }\n  .m-lg-auto {\n    margin: auto !important; }\n  .mx-lg-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-lg-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-lg-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-lg-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-lg-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-lg-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-lg-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-lg-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-lg-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-lg-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-lg-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-lg-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-lg-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-lg-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-lg-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-lg-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-lg-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-lg-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-lg-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-lg-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-lg-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-lg-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-lg-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-lg-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-lg-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-lg-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-lg-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-lg-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-lg-0 {\n    margin-top: 0 !important; }\n  .mt-lg-1 {\n    margin-top: 0.25rem !important; }\n  .mt-lg-2 {\n    margin-top: 0.5rem !important; }\n  .mt-lg-3 {\n    margin-top: 1rem !important; }\n  .mt-lg-4 {\n    margin-top: 1.5rem !important; }\n  .mt-lg-5 {\n    margin-top: 3rem !important; }\n  .mt-lg-6 {\n    margin-top: 4rem !important; }\n  .mt-lg-7 {\n    margin-top: 6rem !important; }\n  .mt-lg-8 {\n    margin-top: 8rem !important; }\n  .mt-lg-9 {\n    margin-top: 10rem !important; }\n  .mt-lg-10 {\n    margin-top: 12rem !important; }\n  .mt-lg-11 {\n    margin-top: 14rem !important; }\n  .mt-lg-12 {\n    margin-top: 16rem !important; }\n  .mt-lg-auto {\n    margin-top: auto !important; }\n  .me-lg-0 {\n    margin-right: 0 !important; }\n  .me-lg-1 {\n    margin-right: 0.25rem !important; }\n  .me-lg-2 {\n    margin-right: 0.5rem !important; }\n  .me-lg-3 {\n    margin-right: 1rem !important; }\n  .me-lg-4 {\n    margin-right: 1.5rem !important; }\n  .me-lg-5 {\n    margin-right: 3rem !important; }\n  .me-lg-6 {\n    margin-right: 4rem !important; }\n  .me-lg-7 {\n    margin-right: 6rem !important; }\n  .me-lg-8 {\n    margin-right: 8rem !important; }\n  .me-lg-9 {\n    margin-right: 10rem !important; }\n  .me-lg-10 {\n    margin-right: 12rem !important; }\n  .me-lg-11 {\n    margin-right: 14rem !important; }\n  .me-lg-12 {\n    margin-right: 16rem !important; }\n  .me-lg-auto {\n    margin-right: auto !important; }\n  .mb-lg-0 {\n    margin-bottom: 0 !important; }\n  .mb-lg-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-lg-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-lg-3 {\n    margin-bottom: 1rem !important; }\n  .mb-lg-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-lg-5 {\n    margin-bottom: 3rem !important; }\n  .mb-lg-6 {\n    margin-bottom: 4rem !important; }\n  .mb-lg-7 {\n    margin-bottom: 6rem !important; }\n  .mb-lg-8 {\n    margin-bottom: 8rem !important; }\n  .mb-lg-9 {\n    margin-bottom: 10rem !important; }\n  .mb-lg-10 {\n    margin-bottom: 12rem !important; }\n  .mb-lg-11 {\n    margin-bottom: 14rem !important; }\n  .mb-lg-12 {\n    margin-bottom: 16rem !important; }\n  .mb-lg-auto {\n    margin-bottom: auto !important; }\n  .ms-lg-0 {\n    margin-left: 0 !important; }\n  .ms-lg-1 {\n    margin-left: 0.25rem !important; }\n  .ms-lg-2 {\n    margin-left: 0.5rem !important; }\n  .ms-lg-3 {\n    margin-left: 1rem !important; }\n  .ms-lg-4 {\n    margin-left: 1.5rem !important; }\n  .ms-lg-5 {\n    margin-left: 3rem !important; }\n  .ms-lg-6 {\n    margin-left: 4rem !important; }\n  .ms-lg-7 {\n    margin-left: 6rem !important; }\n  .ms-lg-8 {\n    margin-left: 8rem !important; }\n  .ms-lg-9 {\n    margin-left: 10rem !important; }\n  .ms-lg-10 {\n    margin-left: 12rem !important; }\n  .ms-lg-11 {\n    margin-left: 14rem !important; }\n  .ms-lg-12 {\n    margin-left: 16rem !important; }\n  .ms-lg-auto {\n    margin-left: auto !important; }\n  .m-lg-n1 {\n    margin: -0.25rem !important; }\n  .m-lg-n2 {\n    margin: -0.5rem !important; }\n  .m-lg-n3 {\n    margin: -1rem !important; }\n  .m-lg-n4 {\n    margin: -1.5rem !important; }\n  .m-lg-n5 {\n    margin: -3rem !important; }\n  .m-lg-n6 {\n    margin: -4rem !important; }\n  .m-lg-n7 {\n    margin: -6rem !important; }\n  .m-lg-n8 {\n    margin: -8rem !important; }\n  .m-lg-n9 {\n    margin: -10rem !important; }\n  .m-lg-n10 {\n    margin: -12rem !important; }\n  .m-lg-n11 {\n    margin: -14rem !important; }\n  .m-lg-n12 {\n    margin: -16rem !important; }\n  .mx-lg-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-lg-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-lg-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-lg-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-lg-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-lg-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-lg-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-lg-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-lg-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-lg-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-lg-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-lg-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-lg-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-lg-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-lg-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-lg-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-lg-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-lg-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-lg-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-lg-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-lg-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-lg-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-lg-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-lg-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-lg-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-lg-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-lg-n3 {\n    margin-top: -1rem !important; }\n  .mt-lg-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-lg-n5 {\n    margin-top: -3rem !important; }\n  .mt-lg-n6 {\n    margin-top: -4rem !important; }\n  .mt-lg-n7 {\n    margin-top: -6rem !important; }\n  .mt-lg-n8 {\n    margin-top: -8rem !important; }\n  .mt-lg-n9 {\n    margin-top: -10rem !important; }\n  .mt-lg-n10 {\n    margin-top: -12rem !important; }\n  .mt-lg-n11 {\n    margin-top: -14rem !important; }\n  .mt-lg-n12 {\n    margin-top: -16rem !important; }\n  .me-lg-n1 {\n    margin-right: -0.25rem !important; }\n  .me-lg-n2 {\n    margin-right: -0.5rem !important; }\n  .me-lg-n3 {\n    margin-right: -1rem !important; }\n  .me-lg-n4 {\n    margin-right: -1.5rem !important; }\n  .me-lg-n5 {\n    margin-right: -3rem !important; }\n  .me-lg-n6 {\n    margin-right: -4rem !important; }\n  .me-lg-n7 {\n    margin-right: -6rem !important; }\n  .me-lg-n8 {\n    margin-right: -8rem !important; }\n  .me-lg-n9 {\n    margin-right: -10rem !important; }\n  .me-lg-n10 {\n    margin-right: -12rem !important; }\n  .me-lg-n11 {\n    margin-right: -14rem !important; }\n  .me-lg-n12 {\n    margin-right: -16rem !important; }\n  .mb-lg-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-lg-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-lg-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-lg-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-lg-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-lg-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-lg-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-lg-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-lg-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-lg-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-lg-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-lg-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-lg-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-lg-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-lg-n3 {\n    margin-left: -1rem !important; }\n  .ms-lg-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-lg-n5 {\n    margin-left: -3rem !important; }\n  .ms-lg-n6 {\n    margin-left: -4rem !important; }\n  .ms-lg-n7 {\n    margin-left: -6rem !important; }\n  .ms-lg-n8 {\n    margin-left: -8rem !important; }\n  .ms-lg-n9 {\n    margin-left: -10rem !important; }\n  .ms-lg-n10 {\n    margin-left: -12rem !important; }\n  .ms-lg-n11 {\n    margin-left: -14rem !important; }\n  .ms-lg-n12 {\n    margin-left: -16rem !important; }\n  .p-lg-0 {\n    padding: 0 !important; }\n  .p-lg-1 {\n    padding: 0.25rem !important; }\n  .p-lg-2 {\n    padding: 0.5rem !important; }\n  .p-lg-3 {\n    padding: 1rem !important; }\n  .p-lg-4 {\n    padding: 1.5rem !important; }\n  .p-lg-5 {\n    padding: 3rem !important; }\n  .p-lg-6 {\n    padding: 4rem !important; }\n  .p-lg-7 {\n    padding: 6rem !important; }\n  .p-lg-8 {\n    padding: 8rem !important; }\n  .p-lg-9 {\n    padding: 10rem !important; }\n  .p-lg-10 {\n    padding: 12rem !important; }\n  .p-lg-11 {\n    padding: 14rem !important; }\n  .p-lg-12 {\n    padding: 16rem !important; }\n  .px-lg-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-lg-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-lg-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-lg-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-lg-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-lg-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-lg-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-lg-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-lg-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-lg-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-lg-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-lg-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-lg-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-lg-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-lg-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-lg-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-lg-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-lg-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-lg-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-lg-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-lg-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-lg-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-lg-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-lg-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-lg-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-lg-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-lg-0 {\n    padding-top: 0 !important; }\n  .pt-lg-1 {\n    padding-top: 0.25rem !important; }\n  .pt-lg-2 {\n    padding-top: 0.5rem !important; }\n  .pt-lg-3 {\n    padding-top: 1rem !important; }\n  .pt-lg-4 {\n    padding-top: 1.5rem !important; }\n  .pt-lg-5 {\n    padding-top: 3rem !important; }\n  .pt-lg-6 {\n    padding-top: 4rem !important; }\n  .pt-lg-7 {\n    padding-top: 6rem !important; }\n  .pt-lg-8 {\n    padding-top: 8rem !important; }\n  .pt-lg-9 {\n    padding-top: 10rem !important; }\n  .pt-lg-10 {\n    padding-top: 12rem !important; }\n  .pt-lg-11 {\n    padding-top: 14rem !important; }\n  .pt-lg-12 {\n    padding-top: 16rem !important; }\n  .pe-lg-0 {\n    padding-right: 0 !important; }\n  .pe-lg-1 {\n    padding-right: 0.25rem !important; }\n  .pe-lg-2 {\n    padding-right: 0.5rem !important; }\n  .pe-lg-3 {\n    padding-right: 1rem !important; }\n  .pe-lg-4 {\n    padding-right: 1.5rem !important; }\n  .pe-lg-5 {\n    padding-right: 3rem !important; }\n  .pe-lg-6 {\n    padding-right: 4rem !important; }\n  .pe-lg-7 {\n    padding-right: 6rem !important; }\n  .pe-lg-8 {\n    padding-right: 8rem !important; }\n  .pe-lg-9 {\n    padding-right: 10rem !important; }\n  .pe-lg-10 {\n    padding-right: 12rem !important; }\n  .pe-lg-11 {\n    padding-right: 14rem !important; }\n  .pe-lg-12 {\n    padding-right: 16rem !important; }\n  .pb-lg-0 {\n    padding-bottom: 0 !important; }\n  .pb-lg-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-lg-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-lg-3 {\n    padding-bottom: 1rem !important; }\n  .pb-lg-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-lg-5 {\n    padding-bottom: 3rem !important; }\n  .pb-lg-6 {\n    padding-bottom: 4rem !important; }\n  .pb-lg-7 {\n    padding-bottom: 6rem !important; }\n  .pb-lg-8 {\n    padding-bottom: 8rem !important; }\n  .pb-lg-9 {\n    padding-bottom: 10rem !important; }\n  .pb-lg-10 {\n    padding-bottom: 12rem !important; }\n  .pb-lg-11 {\n    padding-bottom: 14rem !important; }\n  .pb-lg-12 {\n    padding-bottom: 16rem !important; }\n  .ps-lg-0 {\n    padding-left: 0 !important; }\n  .ps-lg-1 {\n    padding-left: 0.25rem !important; }\n  .ps-lg-2 {\n    padding-left: 0.5rem !important; }\n  .ps-lg-3 {\n    padding-left: 1rem !important; }\n  .ps-lg-4 {\n    padding-left: 1.5rem !important; }\n  .ps-lg-5 {\n    padding-left: 3rem !important; }\n  .ps-lg-6 {\n    padding-left: 4rem !important; }\n  .ps-lg-7 {\n    padding-left: 6rem !important; }\n  .ps-lg-8 {\n    padding-left: 8rem !important; }\n  .ps-lg-9 {\n    padding-left: 10rem !important; }\n  .ps-lg-10 {\n    padding-left: 12rem !important; }\n  .ps-lg-11 {\n    padding-left: 14rem !important; }\n  .ps-lg-12 {\n    padding-left: 16rem !important; }\n  .text-lg-start {\n    text-align: left !important; }\n  .text-lg-end {\n    text-align: right !important; }\n  .text-lg-center {\n    text-align: center !important; }\n  .transform-scale-lg-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-lg-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-lg-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-lg-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-lg-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-lg-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-lg {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-lg-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-lg-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-lg-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-lg-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-lg-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-lg-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-lg-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-lg-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-lg {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-lg-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-lg-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-lg-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-lg-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-lg-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-lg-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-lg-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-lg-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-lg {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-lg-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-lg-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-lg-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-lg-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-lg-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-lg-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-lg-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-lg-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-lg {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-lg-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-lg-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-lg-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-lg-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-lg-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-lg-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-lg-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-lg-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 1200px) {\n  .float-xl-start {\n    float: left !important; }\n  .float-xl-end {\n    float: right !important; }\n  .float-xl-none {\n    float: none !important; }\n  .d-xl-inline {\n    display: inline !important; }\n  .d-xl-inline-block {\n    display: inline-block !important; }\n  .d-xl-block {\n    display: block !important; }\n  .d-xl-grid {\n    display: grid !important; }\n  .d-xl-table {\n    display: table !important; }\n  .d-xl-table-row {\n    display: table-row !important; }\n  .d-xl-table-cell {\n    display: table-cell !important; }\n  .d-xl-flex {\n    display: flex !important; }\n  .d-xl-inline-flex {\n    display: inline-flex !important; }\n  .d-xl-none {\n    display: none !important; }\n  .border-top-xl {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-xl-0 {\n    border-top: 0 !important; }\n  .border-end-xl {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-xl-0 {\n    border-right: 0 !important; }\n  .border-bottom-xl {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-xl-0 {\n    border-bottom: 0 !important; }\n  .border-start-xl {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-xl-0 {\n    border-left: 0 !important; }\n  .w-xl-0 {\n    width: 0% !important; }\n  .w-xl-1 {\n    width: 1% !important; }\n  .w-xl-2 {\n    width: 2% !important; }\n  .w-xl-3 {\n    width: 3% !important; }\n  .w-xl-4 {\n    width: 4% !important; }\n  .w-xl-5 {\n    width: 5% !important; }\n  .w-xl-6 {\n    width: 6% !important; }\n  .w-xl-7 {\n    width: 7% !important; }\n  .w-xl-8 {\n    width: 8% !important; }\n  .w-xl-9 {\n    width: 9% !important; }\n  .w-xl-10 {\n    width: 10% !important; }\n  .w-xl-15 {\n    width: 15% !important; }\n  .w-xl-20 {\n    width: 20% !important; }\n  .w-xl-25 {\n    width: 25% !important; }\n  .w-xl-30 {\n    width: 30% !important; }\n  .w-xl-35 {\n    width: 35% !important; }\n  .w-xl-40 {\n    width: 40% !important; }\n  .w-xl-45 {\n    width: 45% !important; }\n  .w-xl-50 {\n    width: 50% !important; }\n  .w-xl-55 {\n    width: 55% !important; }\n  .w-xl-60 {\n    width: 60% !important; }\n  .w-xl-65 {\n    width: 65% !important; }\n  .w-xl-70 {\n    width: 70% !important; }\n  .w-xl-75 {\n    width: 75% !important; }\n  .w-xl-80 {\n    width: 80% !important; }\n  .w-xl-85 {\n    width: 85% !important; }\n  .w-xl-90 {\n    width: 90% !important; }\n  .w-xl-95 {\n    width: 95% !important; }\n  .w-xl-100 {\n    width: 100% !important; }\n  .w-xl-auto {\n    width: auto !important; }\n  .flex-xl-fill {\n    flex: 1 1 auto !important; }\n  .flex-xl-row {\n    flex-direction: row !important; }\n  .flex-xl-column {\n    flex-direction: column !important; }\n  .flex-xl-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-xl-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-xl-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-xl-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-xl-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-xl-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-xl-wrap {\n    flex-wrap: wrap !important; }\n  .flex-xl-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-xl-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-xl-0 {\n    gap: 0 !important; }\n  .gap-xl-1 {\n    gap: 0.25rem !important; }\n  .gap-xl-2 {\n    gap: 0.5rem !important; }\n  .gap-xl-3 {\n    gap: 1rem !important; }\n  .gap-xl-4 {\n    gap: 1.5rem !important; }\n  .gap-xl-5 {\n    gap: 3rem !important; }\n  .gap-xl-6 {\n    gap: 4rem !important; }\n  .gap-xl-7 {\n    gap: 6rem !important; }\n  .gap-xl-8 {\n    gap: 8rem !important; }\n  .gap-xl-9 {\n    gap: 10rem !important; }\n  .gap-xl-10 {\n    gap: 12rem !important; }\n  .gap-xl-11 {\n    gap: 14rem !important; }\n  .gap-xl-12 {\n    gap: 16rem !important; }\n  .justify-content-xl-start {\n    justify-content: flex-start !important; }\n  .justify-content-xl-end {\n    justify-content: flex-end !important; }\n  .justify-content-xl-center {\n    justify-content: center !important; }\n  .justify-content-xl-between {\n    justify-content: space-between !important; }\n  .justify-content-xl-around {\n    justify-content: space-around !important; }\n  .justify-content-xl-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-xl-start {\n    align-items: flex-start !important; }\n  .align-items-xl-end {\n    align-items: flex-end !important; }\n  .align-items-xl-center {\n    align-items: center !important; }\n  .align-items-xl-baseline {\n    align-items: baseline !important; }\n  .align-items-xl-stretch {\n    align-items: stretch !important; }\n  .align-content-xl-start {\n    align-content: flex-start !important; }\n  .align-content-xl-end {\n    align-content: flex-end !important; }\n  .align-content-xl-center {\n    align-content: center !important; }\n  .align-content-xl-between {\n    align-content: space-between !important; }\n  .align-content-xl-around {\n    align-content: space-around !important; }\n  .align-content-xl-stretch {\n    align-content: stretch !important; }\n  .align-self-xl-auto {\n    align-self: auto !important; }\n  .align-self-xl-start {\n    align-self: flex-start !important; }\n  .align-self-xl-end {\n    align-self: flex-end !important; }\n  .align-self-xl-center {\n    align-self: center !important; }\n  .align-self-xl-baseline {\n    align-self: baseline !important; }\n  .align-self-xl-stretch {\n    align-self: stretch !important; }\n  .order-xl-first {\n    order: -1 !important; }\n  .order-xl-0 {\n    order: 0 !important; }\n  .order-xl-1 {\n    order: 1 !important; }\n  .order-xl-2 {\n    order: 2 !important; }\n  .order-xl-3 {\n    order: 3 !important; }\n  .order-xl-4 {\n    order: 4 !important; }\n  .order-xl-5 {\n    order: 5 !important; }\n  .order-xl-last {\n    order: 6 !important; }\n  .m-xl-0 {\n    margin: 0 !important; }\n  .m-xl-1 {\n    margin: 0.25rem !important; }\n  .m-xl-2 {\n    margin: 0.5rem !important; }\n  .m-xl-3 {\n    margin: 1rem !important; }\n  .m-xl-4 {\n    margin: 1.5rem !important; }\n  .m-xl-5 {\n    margin: 3rem !important; }\n  .m-xl-6 {\n    margin: 4rem !important; }\n  .m-xl-7 {\n    margin: 6rem !important; }\n  .m-xl-8 {\n    margin: 8rem !important; }\n  .m-xl-9 {\n    margin: 10rem !important; }\n  .m-xl-10 {\n    margin: 12rem !important; }\n  .m-xl-11 {\n    margin: 14rem !important; }\n  .m-xl-12 {\n    margin: 16rem !important; }\n  .m-xl-auto {\n    margin: auto !important; }\n  .mx-xl-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-xl-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-xl-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-xl-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-xl-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-xl-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-xl-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-xl-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-xl-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-xl-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-xl-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-xl-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-xl-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-xl-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-xl-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-xl-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-xl-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-xl-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-xl-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-xl-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-xl-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-xl-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-xl-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-xl-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-xl-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-xl-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-xl-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-xl-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-xl-0 {\n    margin-top: 0 !important; }\n  .mt-xl-1 {\n    margin-top: 0.25rem !important; }\n  .mt-xl-2 {\n    margin-top: 0.5rem !important; }\n  .mt-xl-3 {\n    margin-top: 1rem !important; }\n  .mt-xl-4 {\n    margin-top: 1.5rem !important; }\n  .mt-xl-5 {\n    margin-top: 3rem !important; }\n  .mt-xl-6 {\n    margin-top: 4rem !important; }\n  .mt-xl-7 {\n    margin-top: 6rem !important; }\n  .mt-xl-8 {\n    margin-top: 8rem !important; }\n  .mt-xl-9 {\n    margin-top: 10rem !important; }\n  .mt-xl-10 {\n    margin-top: 12rem !important; }\n  .mt-xl-11 {\n    margin-top: 14rem !important; }\n  .mt-xl-12 {\n    margin-top: 16rem !important; }\n  .mt-xl-auto {\n    margin-top: auto !important; }\n  .me-xl-0 {\n    margin-right: 0 !important; }\n  .me-xl-1 {\n    margin-right: 0.25rem !important; }\n  .me-xl-2 {\n    margin-right: 0.5rem !important; }\n  .me-xl-3 {\n    margin-right: 1rem !important; }\n  .me-xl-4 {\n    margin-right: 1.5rem !important; }\n  .me-xl-5 {\n    margin-right: 3rem !important; }\n  .me-xl-6 {\n    margin-right: 4rem !important; }\n  .me-xl-7 {\n    margin-right: 6rem !important; }\n  .me-xl-8 {\n    margin-right: 8rem !important; }\n  .me-xl-9 {\n    margin-right: 10rem !important; }\n  .me-xl-10 {\n    margin-right: 12rem !important; }\n  .me-xl-11 {\n    margin-right: 14rem !important; }\n  .me-xl-12 {\n    margin-right: 16rem !important; }\n  .me-xl-auto {\n    margin-right: auto !important; }\n  .mb-xl-0 {\n    margin-bottom: 0 !important; }\n  .mb-xl-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-xl-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-xl-3 {\n    margin-bottom: 1rem !important; }\n  .mb-xl-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-xl-5 {\n    margin-bottom: 3rem !important; }\n  .mb-xl-6 {\n    margin-bottom: 4rem !important; }\n  .mb-xl-7 {\n    margin-bottom: 6rem !important; }\n  .mb-xl-8 {\n    margin-bottom: 8rem !important; }\n  .mb-xl-9 {\n    margin-bottom: 10rem !important; }\n  .mb-xl-10 {\n    margin-bottom: 12rem !important; }\n  .mb-xl-11 {\n    margin-bottom: 14rem !important; }\n  .mb-xl-12 {\n    margin-bottom: 16rem !important; }\n  .mb-xl-auto {\n    margin-bottom: auto !important; }\n  .ms-xl-0 {\n    margin-left: 0 !important; }\n  .ms-xl-1 {\n    margin-left: 0.25rem !important; }\n  .ms-xl-2 {\n    margin-left: 0.5rem !important; }\n  .ms-xl-3 {\n    margin-left: 1rem !important; }\n  .ms-xl-4 {\n    margin-left: 1.5rem !important; }\n  .ms-xl-5 {\n    margin-left: 3rem !important; }\n  .ms-xl-6 {\n    margin-left: 4rem !important; }\n  .ms-xl-7 {\n    margin-left: 6rem !important; }\n  .ms-xl-8 {\n    margin-left: 8rem !important; }\n  .ms-xl-9 {\n    margin-left: 10rem !important; }\n  .ms-xl-10 {\n    margin-left: 12rem !important; }\n  .ms-xl-11 {\n    margin-left: 14rem !important; }\n  .ms-xl-12 {\n    margin-left: 16rem !important; }\n  .ms-xl-auto {\n    margin-left: auto !important; }\n  .m-xl-n1 {\n    margin: -0.25rem !important; }\n  .m-xl-n2 {\n    margin: -0.5rem !important; }\n  .m-xl-n3 {\n    margin: -1rem !important; }\n  .m-xl-n4 {\n    margin: -1.5rem !important; }\n  .m-xl-n5 {\n    margin: -3rem !important; }\n  .m-xl-n6 {\n    margin: -4rem !important; }\n  .m-xl-n7 {\n    margin: -6rem !important; }\n  .m-xl-n8 {\n    margin: -8rem !important; }\n  .m-xl-n9 {\n    margin: -10rem !important; }\n  .m-xl-n10 {\n    margin: -12rem !important; }\n  .m-xl-n11 {\n    margin: -14rem !important; }\n  .m-xl-n12 {\n    margin: -16rem !important; }\n  .mx-xl-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-xl-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-xl-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-xl-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-xl-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-xl-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-xl-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-xl-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-xl-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-xl-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-xl-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-xl-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-xl-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-xl-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-xl-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-xl-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-xl-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-xl-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-xl-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-xl-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-xl-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-xl-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-xl-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-xl-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-xl-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-xl-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-xl-n3 {\n    margin-top: -1rem !important; }\n  .mt-xl-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-xl-n5 {\n    margin-top: -3rem !important; }\n  .mt-xl-n6 {\n    margin-top: -4rem !important; }\n  .mt-xl-n7 {\n    margin-top: -6rem !important; }\n  .mt-xl-n8 {\n    margin-top: -8rem !important; }\n  .mt-xl-n9 {\n    margin-top: -10rem !important; }\n  .mt-xl-n10 {\n    margin-top: -12rem !important; }\n  .mt-xl-n11 {\n    margin-top: -14rem !important; }\n  .mt-xl-n12 {\n    margin-top: -16rem !important; }\n  .me-xl-n1 {\n    margin-right: -0.25rem !important; }\n  .me-xl-n2 {\n    margin-right: -0.5rem !important; }\n  .me-xl-n3 {\n    margin-right: -1rem !important; }\n  .me-xl-n4 {\n    margin-right: -1.5rem !important; }\n  .me-xl-n5 {\n    margin-right: -3rem !important; }\n  .me-xl-n6 {\n    margin-right: -4rem !important; }\n  .me-xl-n7 {\n    margin-right: -6rem !important; }\n  .me-xl-n8 {\n    margin-right: -8rem !important; }\n  .me-xl-n9 {\n    margin-right: -10rem !important; }\n  .me-xl-n10 {\n    margin-right: -12rem !important; }\n  .me-xl-n11 {\n    margin-right: -14rem !important; }\n  .me-xl-n12 {\n    margin-right: -16rem !important; }\n  .mb-xl-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-xl-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-xl-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-xl-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-xl-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-xl-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-xl-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-xl-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-xl-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-xl-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-xl-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-xl-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-xl-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-xl-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-xl-n3 {\n    margin-left: -1rem !important; }\n  .ms-xl-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-xl-n5 {\n    margin-left: -3rem !important; }\n  .ms-xl-n6 {\n    margin-left: -4rem !important; }\n  .ms-xl-n7 {\n    margin-left: -6rem !important; }\n  .ms-xl-n8 {\n    margin-left: -8rem !important; }\n  .ms-xl-n9 {\n    margin-left: -10rem !important; }\n  .ms-xl-n10 {\n    margin-left: -12rem !important; }\n  .ms-xl-n11 {\n    margin-left: -14rem !important; }\n  .ms-xl-n12 {\n    margin-left: -16rem !important; }\n  .p-xl-0 {\n    padding: 0 !important; }\n  .p-xl-1 {\n    padding: 0.25rem !important; }\n  .p-xl-2 {\n    padding: 0.5rem !important; }\n  .p-xl-3 {\n    padding: 1rem !important; }\n  .p-xl-4 {\n    padding: 1.5rem !important; }\n  .p-xl-5 {\n    padding: 3rem !important; }\n  .p-xl-6 {\n    padding: 4rem !important; }\n  .p-xl-7 {\n    padding: 6rem !important; }\n  .p-xl-8 {\n    padding: 8rem !important; }\n  .p-xl-9 {\n    padding: 10rem !important; }\n  .p-xl-10 {\n    padding: 12rem !important; }\n  .p-xl-11 {\n    padding: 14rem !important; }\n  .p-xl-12 {\n    padding: 16rem !important; }\n  .px-xl-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-xl-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-xl-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-xl-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-xl-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-xl-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-xl-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-xl-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-xl-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-xl-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-xl-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-xl-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-xl-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-xl-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-xl-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-xl-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-xl-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-xl-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-xl-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-xl-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-xl-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-xl-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-xl-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-xl-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-xl-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-xl-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-xl-0 {\n    padding-top: 0 !important; }\n  .pt-xl-1 {\n    padding-top: 0.25rem !important; }\n  .pt-xl-2 {\n    padding-top: 0.5rem !important; }\n  .pt-xl-3 {\n    padding-top: 1rem !important; }\n  .pt-xl-4 {\n    padding-top: 1.5rem !important; }\n  .pt-xl-5 {\n    padding-top: 3rem !important; }\n  .pt-xl-6 {\n    padding-top: 4rem !important; }\n  .pt-xl-7 {\n    padding-top: 6rem !important; }\n  .pt-xl-8 {\n    padding-top: 8rem !important; }\n  .pt-xl-9 {\n    padding-top: 10rem !important; }\n  .pt-xl-10 {\n    padding-top: 12rem !important; }\n  .pt-xl-11 {\n    padding-top: 14rem !important; }\n  .pt-xl-12 {\n    padding-top: 16rem !important; }\n  .pe-xl-0 {\n    padding-right: 0 !important; }\n  .pe-xl-1 {\n    padding-right: 0.25rem !important; }\n  .pe-xl-2 {\n    padding-right: 0.5rem !important; }\n  .pe-xl-3 {\n    padding-right: 1rem !important; }\n  .pe-xl-4 {\n    padding-right: 1.5rem !important; }\n  .pe-xl-5 {\n    padding-right: 3rem !important; }\n  .pe-xl-6 {\n    padding-right: 4rem !important; }\n  .pe-xl-7 {\n    padding-right: 6rem !important; }\n  .pe-xl-8 {\n    padding-right: 8rem !important; }\n  .pe-xl-9 {\n    padding-right: 10rem !important; }\n  .pe-xl-10 {\n    padding-right: 12rem !important; }\n  .pe-xl-11 {\n    padding-right: 14rem !important; }\n  .pe-xl-12 {\n    padding-right: 16rem !important; }\n  .pb-xl-0 {\n    padding-bottom: 0 !important; }\n  .pb-xl-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-xl-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-xl-3 {\n    padding-bottom: 1rem !important; }\n  .pb-xl-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-xl-5 {\n    padding-bottom: 3rem !important; }\n  .pb-xl-6 {\n    padding-bottom: 4rem !important; }\n  .pb-xl-7 {\n    padding-bottom: 6rem !important; }\n  .pb-xl-8 {\n    padding-bottom: 8rem !important; }\n  .pb-xl-9 {\n    padding-bottom: 10rem !important; }\n  .pb-xl-10 {\n    padding-bottom: 12rem !important; }\n  .pb-xl-11 {\n    padding-bottom: 14rem !important; }\n  .pb-xl-12 {\n    padding-bottom: 16rem !important; }\n  .ps-xl-0 {\n    padding-left: 0 !important; }\n  .ps-xl-1 {\n    padding-left: 0.25rem !important; }\n  .ps-xl-2 {\n    padding-left: 0.5rem !important; }\n  .ps-xl-3 {\n    padding-left: 1rem !important; }\n  .ps-xl-4 {\n    padding-left: 1.5rem !important; }\n  .ps-xl-5 {\n    padding-left: 3rem !important; }\n  .ps-xl-6 {\n    padding-left: 4rem !important; }\n  .ps-xl-7 {\n    padding-left: 6rem !important; }\n  .ps-xl-8 {\n    padding-left: 8rem !important; }\n  .ps-xl-9 {\n    padding-left: 10rem !important; }\n  .ps-xl-10 {\n    padding-left: 12rem !important; }\n  .ps-xl-11 {\n    padding-left: 14rem !important; }\n  .ps-xl-12 {\n    padding-left: 16rem !important; }\n  .text-xl-start {\n    text-align: left !important; }\n  .text-xl-end {\n    text-align: right !important; }\n  .text-xl-center {\n    text-align: center !important; }\n  .transform-scale-xl-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-xl-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-xl-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-xl-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-xl-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-xl-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-xl {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xl-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-xl-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-xl-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xl-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-xl-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-xl-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-xl-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-xl-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-xl {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xl-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-xl-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-xl-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xl-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-xl-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-xl-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-xl-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-xl-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-xl {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xl-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-xl-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-xl-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xl-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-xl-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-xl-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-xl-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-xl-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-xl {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xl-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-xl-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-xl-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xl-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-xl-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-xl-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-xl-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-xl-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 1400px) {\n  .float-xxl-start {\n    float: left !important; }\n  .float-xxl-end {\n    float: right !important; }\n  .float-xxl-none {\n    float: none !important; }\n  .d-xxl-inline {\n    display: inline !important; }\n  .d-xxl-inline-block {\n    display: inline-block !important; }\n  .d-xxl-block {\n    display: block !important; }\n  .d-xxl-grid {\n    display: grid !important; }\n  .d-xxl-table {\n    display: table !important; }\n  .d-xxl-table-row {\n    display: table-row !important; }\n  .d-xxl-table-cell {\n    display: table-cell !important; }\n  .d-xxl-flex {\n    display: flex !important; }\n  .d-xxl-inline-flex {\n    display: inline-flex !important; }\n  .d-xxl-none {\n    display: none !important; }\n  .border-top-xxl {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-xxl-0 {\n    border-top: 0 !important; }\n  .border-end-xxl {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-xxl-0 {\n    border-right: 0 !important; }\n  .border-bottom-xxl {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-xxl-0 {\n    border-bottom: 0 !important; }\n  .border-start-xxl {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-xxl-0 {\n    border-left: 0 !important; }\n  .w-xxl-0 {\n    width: 0% !important; }\n  .w-xxl-1 {\n    width: 1% !important; }\n  .w-xxl-2 {\n    width: 2% !important; }\n  .w-xxl-3 {\n    width: 3% !important; }\n  .w-xxl-4 {\n    width: 4% !important; }\n  .w-xxl-5 {\n    width: 5% !important; }\n  .w-xxl-6 {\n    width: 6% !important; }\n  .w-xxl-7 {\n    width: 7% !important; }\n  .w-xxl-8 {\n    width: 8% !important; }\n  .w-xxl-9 {\n    width: 9% !important; }\n  .w-xxl-10 {\n    width: 10% !important; }\n  .w-xxl-15 {\n    width: 15% !important; }\n  .w-xxl-20 {\n    width: 20% !important; }\n  .w-xxl-25 {\n    width: 25% !important; }\n  .w-xxl-30 {\n    width: 30% !important; }\n  .w-xxl-35 {\n    width: 35% !important; }\n  .w-xxl-40 {\n    width: 40% !important; }\n  .w-xxl-45 {\n    width: 45% !important; }\n  .w-xxl-50 {\n    width: 50% !important; }\n  .w-xxl-55 {\n    width: 55% !important; }\n  .w-xxl-60 {\n    width: 60% !important; }\n  .w-xxl-65 {\n    width: 65% !important; }\n  .w-xxl-70 {\n    width: 70% !important; }\n  .w-xxl-75 {\n    width: 75% !important; }\n  .w-xxl-80 {\n    width: 80% !important; }\n  .w-xxl-85 {\n    width: 85% !important; }\n  .w-xxl-90 {\n    width: 90% !important; }\n  .w-xxl-95 {\n    width: 95% !important; }\n  .w-xxl-100 {\n    width: 100% !important; }\n  .w-xxl-auto {\n    width: auto !important; }\n  .flex-xxl-fill {\n    flex: 1 1 auto !important; }\n  .flex-xxl-row {\n    flex-direction: row !important; }\n  .flex-xxl-column {\n    flex-direction: column !important; }\n  .flex-xxl-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-xxl-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-xxl-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-xxl-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-xxl-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-xxl-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-xxl-wrap {\n    flex-wrap: wrap !important; }\n  .flex-xxl-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-xxl-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-xxl-0 {\n    gap: 0 !important; }\n  .gap-xxl-1 {\n    gap: 0.25rem !important; }\n  .gap-xxl-2 {\n    gap: 0.5rem !important; }\n  .gap-xxl-3 {\n    gap: 1rem !important; }\n  .gap-xxl-4 {\n    gap: 1.5rem !important; }\n  .gap-xxl-5 {\n    gap: 3rem !important; }\n  .gap-xxl-6 {\n    gap: 4rem !important; }\n  .gap-xxl-7 {\n    gap: 6rem !important; }\n  .gap-xxl-8 {\n    gap: 8rem !important; }\n  .gap-xxl-9 {\n    gap: 10rem !important; }\n  .gap-xxl-10 {\n    gap: 12rem !important; }\n  .gap-xxl-11 {\n    gap: 14rem !important; }\n  .gap-xxl-12 {\n    gap: 16rem !important; }\n  .justify-content-xxl-start {\n    justify-content: flex-start !important; }\n  .justify-content-xxl-end {\n    justify-content: flex-end !important; }\n  .justify-content-xxl-center {\n    justify-content: center !important; }\n  .justify-content-xxl-between {\n    justify-content: space-between !important; }\n  .justify-content-xxl-around {\n    justify-content: space-around !important; }\n  .justify-content-xxl-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-xxl-start {\n    align-items: flex-start !important; }\n  .align-items-xxl-end {\n    align-items: flex-end !important; }\n  .align-items-xxl-center {\n    align-items: center !important; }\n  .align-items-xxl-baseline {\n    align-items: baseline !important; }\n  .align-items-xxl-stretch {\n    align-items: stretch !important; }\n  .align-content-xxl-start {\n    align-content: flex-start !important; }\n  .align-content-xxl-end {\n    align-content: flex-end !important; }\n  .align-content-xxl-center {\n    align-content: center !important; }\n  .align-content-xxl-between {\n    align-content: space-between !important; }\n  .align-content-xxl-around {\n    align-content: space-around !important; }\n  .align-content-xxl-stretch {\n    align-content: stretch !important; }\n  .align-self-xxl-auto {\n    align-self: auto !important; }\n  .align-self-xxl-start {\n    align-self: flex-start !important; }\n  .align-self-xxl-end {\n    align-self: flex-end !important; }\n  .align-self-xxl-center {\n    align-self: center !important; }\n  .align-self-xxl-baseline {\n    align-self: baseline !important; }\n  .align-self-xxl-stretch {\n    align-self: stretch !important; }\n  .order-xxl-first {\n    order: -1 !important; }\n  .order-xxl-0 {\n    order: 0 !important; }\n  .order-xxl-1 {\n    order: 1 !important; }\n  .order-xxl-2 {\n    order: 2 !important; }\n  .order-xxl-3 {\n    order: 3 !important; }\n  .order-xxl-4 {\n    order: 4 !important; }\n  .order-xxl-5 {\n    order: 5 !important; }\n  .order-xxl-last {\n    order: 6 !important; }\n  .m-xxl-0 {\n    margin: 0 !important; }\n  .m-xxl-1 {\n    margin: 0.25rem !important; }\n  .m-xxl-2 {\n    margin: 0.5rem !important; }\n  .m-xxl-3 {\n    margin: 1rem !important; }\n  .m-xxl-4 {\n    margin: 1.5rem !important; }\n  .m-xxl-5 {\n    margin: 3rem !important; }\n  .m-xxl-6 {\n    margin: 4rem !important; }\n  .m-xxl-7 {\n    margin: 6rem !important; }\n  .m-xxl-8 {\n    margin: 8rem !important; }\n  .m-xxl-9 {\n    margin: 10rem !important; }\n  .m-xxl-10 {\n    margin: 12rem !important; }\n  .m-xxl-11 {\n    margin: 14rem !important; }\n  .m-xxl-12 {\n    margin: 16rem !important; }\n  .m-xxl-auto {\n    margin: auto !important; }\n  .mx-xxl-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-xxl-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-xxl-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-xxl-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-xxl-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-xxl-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-xxl-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-xxl-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-xxl-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-xxl-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-xxl-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-xxl-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-xxl-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-xxl-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-xxl-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-xxl-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-xxl-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-xxl-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-xxl-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-xxl-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-xxl-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-xxl-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-xxl-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-xxl-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-xxl-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-xxl-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-xxl-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-xxl-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-xxl-0 {\n    margin-top: 0 !important; }\n  .mt-xxl-1 {\n    margin-top: 0.25rem !important; }\n  .mt-xxl-2 {\n    margin-top: 0.5rem !important; }\n  .mt-xxl-3 {\n    margin-top: 1rem !important; }\n  .mt-xxl-4 {\n    margin-top: 1.5rem !important; }\n  .mt-xxl-5 {\n    margin-top: 3rem !important; }\n  .mt-xxl-6 {\n    margin-top: 4rem !important; }\n  .mt-xxl-7 {\n    margin-top: 6rem !important; }\n  .mt-xxl-8 {\n    margin-top: 8rem !important; }\n  .mt-xxl-9 {\n    margin-top: 10rem !important; }\n  .mt-xxl-10 {\n    margin-top: 12rem !important; }\n  .mt-xxl-11 {\n    margin-top: 14rem !important; }\n  .mt-xxl-12 {\n    margin-top: 16rem !important; }\n  .mt-xxl-auto {\n    margin-top: auto !important; }\n  .me-xxl-0 {\n    margin-right: 0 !important; }\n  .me-xxl-1 {\n    margin-right: 0.25rem !important; }\n  .me-xxl-2 {\n    margin-right: 0.5rem !important; }\n  .me-xxl-3 {\n    margin-right: 1rem !important; }\n  .me-xxl-4 {\n    margin-right: 1.5rem !important; }\n  .me-xxl-5 {\n    margin-right: 3rem !important; }\n  .me-xxl-6 {\n    margin-right: 4rem !important; }\n  .me-xxl-7 {\n    margin-right: 6rem !important; }\n  .me-xxl-8 {\n    margin-right: 8rem !important; }\n  .me-xxl-9 {\n    margin-right: 10rem !important; }\n  .me-xxl-10 {\n    margin-right: 12rem !important; }\n  .me-xxl-11 {\n    margin-right: 14rem !important; }\n  .me-xxl-12 {\n    margin-right: 16rem !important; }\n  .me-xxl-auto {\n    margin-right: auto !important; }\n  .mb-xxl-0 {\n    margin-bottom: 0 !important; }\n  .mb-xxl-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-xxl-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-xxl-3 {\n    margin-bottom: 1rem !important; }\n  .mb-xxl-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-xxl-5 {\n    margin-bottom: 3rem !important; }\n  .mb-xxl-6 {\n    margin-bottom: 4rem !important; }\n  .mb-xxl-7 {\n    margin-bottom: 6rem !important; }\n  .mb-xxl-8 {\n    margin-bottom: 8rem !important; }\n  .mb-xxl-9 {\n    margin-bottom: 10rem !important; }\n  .mb-xxl-10 {\n    margin-bottom: 12rem !important; }\n  .mb-xxl-11 {\n    margin-bottom: 14rem !important; }\n  .mb-xxl-12 {\n    margin-bottom: 16rem !important; }\n  .mb-xxl-auto {\n    margin-bottom: auto !important; }\n  .ms-xxl-0 {\n    margin-left: 0 !important; }\n  .ms-xxl-1 {\n    margin-left: 0.25rem !important; }\n  .ms-xxl-2 {\n    margin-left: 0.5rem !important; }\n  .ms-xxl-3 {\n    margin-left: 1rem !important; }\n  .ms-xxl-4 {\n    margin-left: 1.5rem !important; }\n  .ms-xxl-5 {\n    margin-left: 3rem !important; }\n  .ms-xxl-6 {\n    margin-left: 4rem !important; }\n  .ms-xxl-7 {\n    margin-left: 6rem !important; }\n  .ms-xxl-8 {\n    margin-left: 8rem !important; }\n  .ms-xxl-9 {\n    margin-left: 10rem !important; }\n  .ms-xxl-10 {\n    margin-left: 12rem !important; }\n  .ms-xxl-11 {\n    margin-left: 14rem !important; }\n  .ms-xxl-12 {\n    margin-left: 16rem !important; }\n  .ms-xxl-auto {\n    margin-left: auto !important; }\n  .m-xxl-n1 {\n    margin: -0.25rem !important; }\n  .m-xxl-n2 {\n    margin: -0.5rem !important; }\n  .m-xxl-n3 {\n    margin: -1rem !important; }\n  .m-xxl-n4 {\n    margin: -1.5rem !important; }\n  .m-xxl-n5 {\n    margin: -3rem !important; }\n  .m-xxl-n6 {\n    margin: -4rem !important; }\n  .m-xxl-n7 {\n    margin: -6rem !important; }\n  .m-xxl-n8 {\n    margin: -8rem !important; }\n  .m-xxl-n9 {\n    margin: -10rem !important; }\n  .m-xxl-n10 {\n    margin: -12rem !important; }\n  .m-xxl-n11 {\n    margin: -14rem !important; }\n  .m-xxl-n12 {\n    margin: -16rem !important; }\n  .mx-xxl-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-xxl-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-xxl-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-xxl-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-xxl-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-xxl-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-xxl-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-xxl-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-xxl-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-xxl-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-xxl-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-xxl-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-xxl-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-xxl-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-xxl-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-xxl-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-xxl-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-xxl-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-xxl-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-xxl-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-xxl-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-xxl-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-xxl-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-xxl-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-xxl-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-xxl-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-xxl-n3 {\n    margin-top: -1rem !important; }\n  .mt-xxl-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-xxl-n5 {\n    margin-top: -3rem !important; }\n  .mt-xxl-n6 {\n    margin-top: -4rem !important; }\n  .mt-xxl-n7 {\n    margin-top: -6rem !important; }\n  .mt-xxl-n8 {\n    margin-top: -8rem !important; }\n  .mt-xxl-n9 {\n    margin-top: -10rem !important; }\n  .mt-xxl-n10 {\n    margin-top: -12rem !important; }\n  .mt-xxl-n11 {\n    margin-top: -14rem !important; }\n  .mt-xxl-n12 {\n    margin-top: -16rem !important; }\n  .me-xxl-n1 {\n    margin-right: -0.25rem !important; }\n  .me-xxl-n2 {\n    margin-right: -0.5rem !important; }\n  .me-xxl-n3 {\n    margin-right: -1rem !important; }\n  .me-xxl-n4 {\n    margin-right: -1.5rem !important; }\n  .me-xxl-n5 {\n    margin-right: -3rem !important; }\n  .me-xxl-n6 {\n    margin-right: -4rem !important; }\n  .me-xxl-n7 {\n    margin-right: -6rem !important; }\n  .me-xxl-n8 {\n    margin-right: -8rem !important; }\n  .me-xxl-n9 {\n    margin-right: -10rem !important; }\n  .me-xxl-n10 {\n    margin-right: -12rem !important; }\n  .me-xxl-n11 {\n    margin-right: -14rem !important; }\n  .me-xxl-n12 {\n    margin-right: -16rem !important; }\n  .mb-xxl-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-xxl-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-xxl-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-xxl-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-xxl-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-xxl-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-xxl-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-xxl-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-xxl-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-xxl-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-xxl-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-xxl-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-xxl-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-xxl-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-xxl-n3 {\n    margin-left: -1rem !important; }\n  .ms-xxl-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-xxl-n5 {\n    margin-left: -3rem !important; }\n  .ms-xxl-n6 {\n    margin-left: -4rem !important; }\n  .ms-xxl-n7 {\n    margin-left: -6rem !important; }\n  .ms-xxl-n8 {\n    margin-left: -8rem !important; }\n  .ms-xxl-n9 {\n    margin-left: -10rem !important; }\n  .ms-xxl-n10 {\n    margin-left: -12rem !important; }\n  .ms-xxl-n11 {\n    margin-left: -14rem !important; }\n  .ms-xxl-n12 {\n    margin-left: -16rem !important; }\n  .p-xxl-0 {\n    padding: 0 !important; }\n  .p-xxl-1 {\n    padding: 0.25rem !important; }\n  .p-xxl-2 {\n    padding: 0.5rem !important; }\n  .p-xxl-3 {\n    padding: 1rem !important; }\n  .p-xxl-4 {\n    padding: 1.5rem !important; }\n  .p-xxl-5 {\n    padding: 3rem !important; }\n  .p-xxl-6 {\n    padding: 4rem !important; }\n  .p-xxl-7 {\n    padding: 6rem !important; }\n  .p-xxl-8 {\n    padding: 8rem !important; }\n  .p-xxl-9 {\n    padding: 10rem !important; }\n  .p-xxl-10 {\n    padding: 12rem !important; }\n  .p-xxl-11 {\n    padding: 14rem !important; }\n  .p-xxl-12 {\n    padding: 16rem !important; }\n  .px-xxl-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-xxl-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-xxl-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-xxl-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-xxl-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-xxl-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-xxl-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-xxl-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-xxl-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-xxl-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-xxl-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-xxl-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-xxl-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-xxl-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-xxl-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-xxl-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-xxl-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-xxl-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-xxl-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-xxl-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-xxl-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-xxl-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-xxl-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-xxl-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-xxl-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-xxl-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-xxl-0 {\n    padding-top: 0 !important; }\n  .pt-xxl-1 {\n    padding-top: 0.25rem !important; }\n  .pt-xxl-2 {\n    padding-top: 0.5rem !important; }\n  .pt-xxl-3 {\n    padding-top: 1rem !important; }\n  .pt-xxl-4 {\n    padding-top: 1.5rem !important; }\n  .pt-xxl-5 {\n    padding-top: 3rem !important; }\n  .pt-xxl-6 {\n    padding-top: 4rem !important; }\n  .pt-xxl-7 {\n    padding-top: 6rem !important; }\n  .pt-xxl-8 {\n    padding-top: 8rem !important; }\n  .pt-xxl-9 {\n    padding-top: 10rem !important; }\n  .pt-xxl-10 {\n    padding-top: 12rem !important; }\n  .pt-xxl-11 {\n    padding-top: 14rem !important; }\n  .pt-xxl-12 {\n    padding-top: 16rem !important; }\n  .pe-xxl-0 {\n    padding-right: 0 !important; }\n  .pe-xxl-1 {\n    padding-right: 0.25rem !important; }\n  .pe-xxl-2 {\n    padding-right: 0.5rem !important; }\n  .pe-xxl-3 {\n    padding-right: 1rem !important; }\n  .pe-xxl-4 {\n    padding-right: 1.5rem !important; }\n  .pe-xxl-5 {\n    padding-right: 3rem !important; }\n  .pe-xxl-6 {\n    padding-right: 4rem !important; }\n  .pe-xxl-7 {\n    padding-right: 6rem !important; }\n  .pe-xxl-8 {\n    padding-right: 8rem !important; }\n  .pe-xxl-9 {\n    padding-right: 10rem !important; }\n  .pe-xxl-10 {\n    padding-right: 12rem !important; }\n  .pe-xxl-11 {\n    padding-right: 14rem !important; }\n  .pe-xxl-12 {\n    padding-right: 16rem !important; }\n  .pb-xxl-0 {\n    padding-bottom: 0 !important; }\n  .pb-xxl-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-xxl-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-xxl-3 {\n    padding-bottom: 1rem !important; }\n  .pb-xxl-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-xxl-5 {\n    padding-bottom: 3rem !important; }\n  .pb-xxl-6 {\n    padding-bottom: 4rem !important; }\n  .pb-xxl-7 {\n    padding-bottom: 6rem !important; }\n  .pb-xxl-8 {\n    padding-bottom: 8rem !important; }\n  .pb-xxl-9 {\n    padding-bottom: 10rem !important; }\n  .pb-xxl-10 {\n    padding-bottom: 12rem !important; }\n  .pb-xxl-11 {\n    padding-bottom: 14rem !important; }\n  .pb-xxl-12 {\n    padding-bottom: 16rem !important; }\n  .ps-xxl-0 {\n    padding-left: 0 !important; }\n  .ps-xxl-1 {\n    padding-left: 0.25rem !important; }\n  .ps-xxl-2 {\n    padding-left: 0.5rem !important; }\n  .ps-xxl-3 {\n    padding-left: 1rem !important; }\n  .ps-xxl-4 {\n    padding-left: 1.5rem !important; }\n  .ps-xxl-5 {\n    padding-left: 3rem !important; }\n  .ps-xxl-6 {\n    padding-left: 4rem !important; }\n  .ps-xxl-7 {\n    padding-left: 6rem !important; }\n  .ps-xxl-8 {\n    padding-left: 8rem !important; }\n  .ps-xxl-9 {\n    padding-left: 10rem !important; }\n  .ps-xxl-10 {\n    padding-left: 12rem !important; }\n  .ps-xxl-11 {\n    padding-left: 14rem !important; }\n  .ps-xxl-12 {\n    padding-left: 16rem !important; }\n  .text-xxl-start {\n    text-align: left !important; }\n  .text-xxl-end {\n    text-align: right !important; }\n  .text-xxl-center {\n    text-align: center !important; }\n  .transform-scale-xxl-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-xxl-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-xxl-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-xxl-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-xxl-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-xxl-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-xxl {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xxl-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-xxl-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-xxl-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xxl-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-xxl-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-xxl-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-xxl-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-xxl-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-xxl {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xxl-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-xxl-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-xxl-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xxl-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-xxl-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-xxl-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-xxl-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-xxl-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-xxl {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xxl-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-xxl-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-xxl-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xxl-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-xxl-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-xxl-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-xxl-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-xxl-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-xxl {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xxl-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-xxl-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-xxl-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xxl-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-xxl-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-xxl-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-xxl-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-xxl-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 1200px) {\n  .fs-1 {\n    font-size: 3rem !important; }\n  .fs-2 {\n    font-size: 2.25rem !important; }\n  .fs-3 {\n    font-size: 1.875rem !important; }\n  .fs-4 {\n    font-size: 1.5rem !important; } }\n\n@media print {\n  .d-print-inline {\n    display: inline !important; }\n  .d-print-inline-block {\n    display: inline-block !important; }\n  .d-print-block {\n    display: block !important; }\n  .d-print-grid {\n    display: grid !important; }\n  .d-print-table {\n    display: table !important; }\n  .d-print-table-row {\n    display: table-row !important; }\n  .d-print-table-cell {\n    display: table-cell !important; }\n  .d-print-flex {\n    display: flex !important; }\n  .d-print-inline-flex {\n    display: inline-flex !important; }\n  .d-print-none {\n    display: none !important; } }\n\n/*!\n\n=========================================================\n* Material Dashboard - v3.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n* Licensed under MIT (site.license)\n\n* Coded by www.creative-tim.com\n\n=========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n*/\n.alert-primary {\n  background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n\n.alert-secondary {\n  background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%); }\n\n.alert-success {\n  background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%); }\n\n.alert-info {\n  background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%); }\n\n.alert-warning {\n  background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%); }\n\n.alert-danger {\n  background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%); }\n\n.alert-light {\n  background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%); }\n\n.alert-dark {\n  background-image: linear-gradient(195deg, #42424a 0%, #191919 100%); }\n\n.btn-close:focus {\n  box-shadow: none; }\n\n.alert-dismissible .btn-close {\n  background-image: none; }\n\n.avatar {\n  color: #fff;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1rem;\n  border-radius: 50rem;\n  height: 48px;\n  width: 48px;\n  transition: all .2s ease-in-out; }\n  .avatar img {\n    width: 100%; }\n  .avatar + .avatar-content {\n    display: inline-block;\n    margin-left: 0.75rem; }\n  .avatar.avatar-raised {\n    margin-top: -24px; }\n  .avatar.avatar-scale-up:hover {\n    transform: scale(1.2); }\n\n.active .avatar.avatar-scale-up {\n  transform: scale(1.2); }\n\n.avatar-xxl {\n  width: 110px !important;\n  height: 110px !important; }\n  .avatar-xxl.avatar-raised {\n    margin-top: -55px; }\n\n.avatar-xl {\n  width: 74px !important;\n  height: 74px !important; }\n  .avatar-xl.avatar-raised {\n    margin-top: -37px; }\n\n.avatar-lg {\n  width: 58px !important;\n  height: 58px !important;\n  font-size: 0.875rem; }\n  .avatar-lg.avatar-raised {\n    margin-top: -29px; }\n\n.avatar-sm {\n  width: 36px !important;\n  height: 36px !important;\n  font-size: 0.875rem; }\n  .avatar-sm.avatar-raised {\n    margin-top: -18px; }\n\n.avatar-xs {\n  width: 24px !important;\n  height: 24px !important;\n  font-size: 0.75rem; }\n  .avatar-xs.avatar-raised {\n    margin-top: -12px; }\n\n.avatar-group .avatar {\n  position: relative;\n  z-index: 2;\n  border: 2px solid #fff; }\n  .avatar-group .avatar:hover {\n    z-index: 3; }\n\n.avatar-group .avatar + .avatar {\n  margin-left: -1rem; }\n\n.badge.bg-primary {\n  background: #e91e63; }\n\n.badge.bg-secondary {\n  background: #7b809a; }\n\n.badge.bg-success {\n  background: #4CAF50; }\n\n.badge.bg-info {\n  background: #1A73E8; }\n\n.badge.bg-warning {\n  background: #fb8c00; }\n\n.badge.bg-danger {\n  background: #F44335; }\n\n.badge.bg-light {\n  background: #f0f2f5; }\n\n.badge.bg-dark {\n  background: #344767; }\n\n.badge.bg-white {\n  background: #fff; }\n\n.badge {\n  text-transform: uppercase; }\n\n.btn {\n  margin-bottom: 1rem;\n  letter-spacing: 0;\n  text-transform: uppercase;\n  background-size: 150%;\n  background-position-x: 25%;\n  position: relative;\n  overflow: hidden; }\n  .btn:not([class*=\"btn-outline-\"]) {\n    border: 0; }\n  .btn:active, .btn:active:focus, .btn:active:hover {\n    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07);\n    transform: none;\n    opacity: 0.85; }\n  .btn.bg-white:hover {\n    color: #7b809a; }\n  .btn.btn-link {\n    box-shadow: none;\n    font-weight: 700; }\n    .btn.btn-link:hover, .btn.btn-link:focus {\n      box-shadow: none; }\n  .btn.btn-round {\n    border-radius: 1.875rem; }\n  .btn.btn-icon-only {\n    width: 2.375rem;\n    height: 2.375rem;\n    padding: 0.7rem 0.7rem; }\n  .btn.btn-sm.btn-icon-only, .btn-group-sm > .btn.btn-icon-only {\n    width: 1.5rem;\n    height: 1.5rem;\n    padding: 0.3rem 0.3rem; }\n  .btn.btn-sm i, .btn-group-sm > .btn i {\n    font-size: 0.5rem; }\n  .btn.btn-lg.btn-icon-only, .btn-group-lg > .btn.btn-icon-only {\n    width: 3.25rem;\n    height: 3.25rem;\n    padding: 1rem 1rem; }\n  .btn.btn-lg i, .btn-group-lg > .btn i {\n    font-size: 1.2rem;\n    position: relative;\n    top: 0px; }\n  .btn.btn-rounded {\n    border-radius: 1.875rem; }\n  .btn .material-icons {\n    vertical-align: middle;\n    margin-top: -1px;\n    margin-bottom: -1px;\n    font-size: 1.1rem;\n    display: inline-block;\n    top: 0; }\n\n.btn-check:checked + .btn svg .color-background {\n  fill: #fff; }\n\n.btn-check:checked + .btn:hover svg .color-background {\n  fill: #344767; }\n\n.icon-move-right i {\n  transition: all 0.2s cubic-bezier(0.34, 1.61, 0.7, 1.3); }\n\n.icon-move-right:hover i, .icon-move-right:focus i {\n  transform: translateX(5px); }\n\n.icon-move-left i {\n  transition: all 0.2s cubic-bezier(0.34, 1.61, 0.7, 1.3); }\n\n.icon-move-left:hover i, .icon-move-left:focus i {\n  transform: translateX(-5px); }\n\n.btn-primary,\n.btn.bg-gradient-primary {\n  box-shadow: 0 3px 3px 0 rgba(233, 30, 99, 0.15), 0 3px 1px -2px rgba(233, 30, 99, 0.2), 0 1px 5px 0 rgba(233, 30, 99, 0.15); }\n  .btn-primary:hover,\n  .btn.bg-gradient-primary:hover {\n    background-color: #e91e63;\n    border-color: #e91e63;\n    box-shadow: 0 14px 26px -12px rgba(233, 30, 99, 0.4), 0 4px 23px 0 rgba(233, 30, 99, 0.15), 0 8px 10px -5px rgba(233, 30, 99, 0.2); }\n  .btn-primary .btn.bg-outline-primary,\n  .btn.bg-gradient-primary .btn.bg-outline-primary {\n    border: 1px solid #e91e63; }\n  .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active,\n  .show > .btn-primary.dropdown-toggle,\n  .btn.bg-gradient-primary:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-primary:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-primary.dropdown-toggle {\n    color: color-yiq(#e91e63);\n    background-color: #e91e63; }\n  .btn-primary.focus, .btn-primary:focus,\n  .btn.bg-gradient-primary.focus,\n  .btn.bg-gradient-primary:focus {\n    color: #fff; }\n\n.btn-outline-primary {\n  box-shadow: none; }\n  .btn-outline-primary:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #e91e63; }\n\n.btn-secondary,\n.btn.bg-gradient-secondary {\n  box-shadow: 0 3px 3px 0 rgba(123, 128, 154, 0.15), 0 3px 1px -2px rgba(123, 128, 154, 0.2), 0 1px 5px 0 rgba(123, 128, 154, 0.15); }\n  .btn-secondary:hover,\n  .btn.bg-gradient-secondary:hover {\n    background-color: #7b809a;\n    border-color: #7b809a;\n    box-shadow: 0 14px 26px -12px rgba(123, 128, 154, 0.4), 0 4px 23px 0 rgba(123, 128, 154, 0.15), 0 8px 10px -5px rgba(123, 128, 154, 0.2); }\n  .btn-secondary .btn.bg-outline-secondary,\n  .btn.bg-gradient-secondary .btn.bg-outline-secondary {\n    border: 1px solid #7b809a; }\n  .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active,\n  .show > .btn-secondary.dropdown-toggle,\n  .btn.bg-gradient-secondary:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-secondary:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-secondary.dropdown-toggle {\n    color: color-yiq(#7b809a);\n    background-color: #7b809a; }\n  .btn-secondary.focus, .btn-secondary:focus,\n  .btn.bg-gradient-secondary.focus,\n  .btn.bg-gradient-secondary:focus {\n    color: #fff; }\n\n.btn-outline-secondary {\n  box-shadow: none; }\n  .btn-outline-secondary:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #7b809a; }\n\n.btn-success,\n.btn.bg-gradient-success {\n  box-shadow: 0 3px 3px 0 rgba(76, 175, 80, 0.15), 0 3px 1px -2px rgba(76, 175, 80, 0.2), 0 1px 5px 0 rgba(76, 175, 80, 0.15); }\n  .btn-success:hover,\n  .btn.bg-gradient-success:hover {\n    background-color: #4CAF50;\n    border-color: #4CAF50;\n    box-shadow: 0 14px 26px -12px rgba(76, 175, 80, 0.4), 0 4px 23px 0 rgba(76, 175, 80, 0.15), 0 8px 10px -5px rgba(76, 175, 80, 0.2); }\n  .btn-success .btn.bg-outline-success,\n  .btn.bg-gradient-success .btn.bg-outline-success {\n    border: 1px solid #4CAF50; }\n  .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active,\n  .show > .btn-success.dropdown-toggle,\n  .btn.bg-gradient-success:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-success:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-success.dropdown-toggle {\n    color: color-yiq(#4CAF50);\n    background-color: #4CAF50; }\n  .btn-success.focus, .btn-success:focus,\n  .btn.bg-gradient-success.focus,\n  .btn.bg-gradient-success:focus {\n    color: #fff; }\n\n.btn-outline-success {\n  box-shadow: none; }\n  .btn-outline-success:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #4CAF50; }\n\n.btn-info,\n.btn.bg-gradient-info {\n  box-shadow: 0 3px 3px 0 rgba(26, 115, 232, 0.15), 0 3px 1px -2px rgba(26, 115, 232, 0.2), 0 1px 5px 0 rgba(26, 115, 232, 0.15); }\n  .btn-info:hover,\n  .btn.bg-gradient-info:hover {\n    background-color: #1A73E8;\n    border-color: #1A73E8;\n    box-shadow: 0 14px 26px -12px rgba(26, 115, 232, 0.4), 0 4px 23px 0 rgba(26, 115, 232, 0.15), 0 8px 10px -5px rgba(26, 115, 232, 0.2); }\n  .btn-info .btn.bg-outline-info,\n  .btn.bg-gradient-info .btn.bg-outline-info {\n    border: 1px solid #1A73E8; }\n  .btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active,\n  .show > .btn-info.dropdown-toggle,\n  .btn.bg-gradient-info:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-info:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-info.dropdown-toggle {\n    color: color-yiq(#1A73E8);\n    background-color: #1A73E8; }\n  .btn-info.focus, .btn-info:focus,\n  .btn.bg-gradient-info.focus,\n  .btn.bg-gradient-info:focus {\n    color: #fff; }\n\n.btn-outline-info {\n  box-shadow: none; }\n  .btn-outline-info:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #1A73E8; }\n\n.btn-warning,\n.btn.bg-gradient-warning {\n  box-shadow: 0 3px 3px 0 rgba(251, 140, 0, 0.15), 0 3px 1px -2px rgba(251, 140, 0, 0.2), 0 1px 5px 0 rgba(251, 140, 0, 0.15); }\n  .btn-warning:hover,\n  .btn.bg-gradient-warning:hover {\n    background-color: #fb8c00;\n    border-color: #fb8c00;\n    box-shadow: 0 14px 26px -12px rgba(251, 140, 0, 0.4), 0 4px 23px 0 rgba(251, 140, 0, 0.15), 0 8px 10px -5px rgba(251, 140, 0, 0.2); }\n  .btn-warning .btn.bg-outline-warning,\n  .btn.bg-gradient-warning .btn.bg-outline-warning {\n    border: 1px solid #fb8c00; }\n  .btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active,\n  .show > .btn-warning.dropdown-toggle,\n  .btn.bg-gradient-warning:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-warning:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-warning.dropdown-toggle {\n    color: color-yiq(#fb8c00);\n    background-color: #fb8c00; }\n  .btn-warning.focus, .btn-warning:focus,\n  .btn.bg-gradient-warning.focus,\n  .btn.bg-gradient-warning:focus {\n    color: #fff; }\n\n.btn-outline-warning {\n  box-shadow: none; }\n  .btn-outline-warning:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #fb8c00; }\n\n.btn-danger,\n.btn.bg-gradient-danger {\n  box-shadow: 0 3px 3px 0 rgba(244, 67, 53, 0.15), 0 3px 1px -2px rgba(244, 67, 53, 0.2), 0 1px 5px 0 rgba(244, 67, 53, 0.15); }\n  .btn-danger:hover,\n  .btn.bg-gradient-danger:hover {\n    background-color: #F44335;\n    border-color: #F44335;\n    box-shadow: 0 14px 26px -12px rgba(244, 67, 53, 0.4), 0 4px 23px 0 rgba(244, 67, 53, 0.15), 0 8px 10px -5px rgba(244, 67, 53, 0.2); }\n  .btn-danger .btn.bg-outline-danger,\n  .btn.bg-gradient-danger .btn.bg-outline-danger {\n    border: 1px solid #F44335; }\n  .btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active,\n  .show > .btn-danger.dropdown-toggle,\n  .btn.bg-gradient-danger:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-danger:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-danger.dropdown-toggle {\n    color: color-yiq(#F44335);\n    background-color: #F44335; }\n  .btn-danger.focus, .btn-danger:focus,\n  .btn.bg-gradient-danger.focus,\n  .btn.bg-gradient-danger:focus {\n    color: #fff; }\n\n.btn-outline-danger {\n  box-shadow: none; }\n  .btn-outline-danger:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #F44335; }\n\n.btn-light,\n.btn.bg-gradient-light {\n  box-shadow: 0 3px 3px 0 rgba(240, 242, 245, 0.15), 0 3px 1px -2px rgba(240, 242, 245, 0.2), 0 1px 5px 0 rgba(240, 242, 245, 0.15); }\n  .btn-light:hover,\n  .btn.bg-gradient-light:hover {\n    background-color: #f0f2f5;\n    border-color: #f0f2f5;\n    box-shadow: 0 14px 26px -12px rgba(240, 242, 245, 0.4), 0 4px 23px 0 rgba(240, 242, 245, 0.15), 0 8px 10px -5px rgba(240, 242, 245, 0.2); }\n  .btn-light .btn.bg-outline-light,\n  .btn.bg-gradient-light .btn.bg-outline-light {\n    border: 1px solid #f0f2f5; }\n  .btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active,\n  .show > .btn-light.dropdown-toggle,\n  .btn.bg-gradient-light:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-light:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-light.dropdown-toggle {\n    color: color-yiq(#f0f2f5);\n    background-color: #f0f2f5; }\n\n.btn-outline-light {\n  box-shadow: none; }\n  .btn-outline-light:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #f0f2f5; }\n\n.btn-dark,\n.btn.bg-gradient-dark {\n  box-shadow: 0 3px 3px 0 rgba(52, 71, 103, 0.15), 0 3px 1px -2px rgba(52, 71, 103, 0.2), 0 1px 5px 0 rgba(52, 71, 103, 0.15); }\n  .btn-dark:hover,\n  .btn.bg-gradient-dark:hover {\n    background-color: #344767;\n    border-color: #344767;\n    box-shadow: 0 14px 26px -12px rgba(52, 71, 103, 0.4), 0 4px 23px 0 rgba(52, 71, 103, 0.15), 0 8px 10px -5px rgba(52, 71, 103, 0.2); }\n  .btn-dark .btn.bg-outline-dark,\n  .btn.bg-gradient-dark .btn.bg-outline-dark {\n    border: 1px solid #344767; }\n  .btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active,\n  .show > .btn-dark.dropdown-toggle,\n  .btn.bg-gradient-dark:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-dark:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-dark.dropdown-toggle {\n    color: color-yiq(#344767);\n    background-color: #344767; }\n  .btn-dark.focus, .btn-dark:focus,\n  .btn.bg-gradient-dark.focus,\n  .btn.bg-gradient-dark:focus {\n    color: #fff; }\n\n.btn-outline-dark {\n  box-shadow: none; }\n  .btn-outline-dark:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #344767; }\n\n.btn-white,\n.btn.bg-gradient-white {\n  box-shadow: 0 3px 3px 0 rgba(255, 255, 255, 0.15), 0 3px 1px -2px rgba(255, 255, 255, 0.2), 0 1px 5px 0 rgba(255, 255, 255, 0.15); }\n  .btn-white:hover,\n  .btn.bg-gradient-white:hover {\n    background-color: #fff;\n    border-color: #fff;\n    box-shadow: 0 14px 26px -12px rgba(255, 255, 255, 0.4), 0 4px 23px 0 rgba(255, 255, 255, 0.15), 0 8px 10px -5px rgba(255, 255, 255, 0.2); }\n  .btn-white .btn.bg-outline-white,\n  .btn.bg-gradient-white .btn.bg-outline-white {\n    border: 1px solid #fff; }\n  .btn-white:not(:disabled):not(.disabled).active, .btn-white:not(:disabled):not(.disabled):active,\n  .show > .btn-white.dropdown-toggle,\n  .btn.bg-gradient-white:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-white:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-white.dropdown-toggle {\n    color: color-yiq(#fff);\n    background-color: #fff; }\n\n.btn-outline-white {\n  box-shadow: none; }\n  .btn-outline-white:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #fff; }\n\n.btn-outline-white {\n  border-color: rgba(255, 255, 255, 0.75);\n  background: rgba(255, 255, 255, 0.1); }\n\n.btn-primary,\n.btn.bg-gradient-primary {\n  color: #fff; }\n  .btn-primary:hover,\n  .btn.bg-gradient-primary:hover {\n    color: #fff; }\n\n.btn-secondary,\n.btn.bg-gradient-secondary {\n  color: #fff; }\n  .btn-secondary:hover,\n  .btn.bg-gradient-secondary:hover {\n    color: #fff; }\n\n.btn-danger,\n.btn.bg-gradient-danger {\n  color: #fff; }\n  .btn-danger:hover,\n  .btn.bg-gradient-danger:hover {\n    color: #fff; }\n\n.btn-info,\n.btn.bg-gradient-info {\n  color: #fff; }\n  .btn-info:hover,\n  .btn.bg-gradient-info:hover {\n    color: #fff; }\n\n.btn-success,\n.btn.bg-gradient-success {\n  color: #fff; }\n  .btn-success:hover,\n  .btn.bg-gradient-success:hover {\n    color: #fff; }\n\n.btn-warning,\n.btn.bg-gradient-warning {\n  color: #fff; }\n  .btn-warning:hover,\n  .btn.bg-gradient-warning:hover {\n    color: #fff; }\n\n.btn-dark,\n.btn.bg-gradient-dark {\n  color: #fff; }\n  .btn-dark:hover,\n  .btn.bg-gradient-dark:hover {\n    color: #fff; }\n\n.btn-light,\n.btn.bg-gradient-light {\n  color: #3A416F; }\n  .btn-light:hover,\n  .btn.bg-gradient-light:hover {\n    color: #3A416F; }\n\n.breadcrumb-item {\n  font-size: 0.875rem; }\n  .breadcrumb-item.text-white::before {\n    color: #fff; }\n\n.breadcrumb-dark {\n  background-color: #344767; }\n  .breadcrumb-dark .breadcrumb-item {\n    font-weight: 600; }\n    .breadcrumb-dark .breadcrumb-item a {\n      color: #f8f9fa; }\n      .breadcrumb-dark .breadcrumb-item a:hover {\n        color: #fff; }\n    .breadcrumb-dark .breadcrumb-item + .breadcrumb-item::before {\n      color: #adb5bd; }\n    .breadcrumb-dark .breadcrumb-item.active {\n      color: #dee2e6; }\n\n.breadcrumb-links {\n  padding: 0;\n  margin: 0;\n  background: transparent; }\n\n.card {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }\n  .card[data-animation=\"true\"] .card-header {\n    transform: translate3d(0, 0, 0);\n    transition: all 300ms cubic-bezier(0.34, 1.61, 0.7, 1); }\n  .card:hover[data-animation=\"true\"] .card-header {\n    transform: translate3d(0, -50px, 0); }\n  .card .card-header {\n    padding: 1.5rem; }\n  .card .card-body {\n    font-family: \"Roboto\", Helvetica, Arial, sans-serif;\n    padding: 1.5rem; }\n  .card.card-plain {\n    background-color: transparent;\n    box-shadow: none; }\n  .card .card-footer {\n    padding: 1.5rem;\n    background-color: transparent; }\n\n.author {\n  display: flex; }\n  .author .name > span {\n    line-height: 1.571;\n    font-weight: 600;\n    font-size: 0.875rem;\n    color: #3A416F; }\n  .author .stats {\n    font-size: 0.875rem;\n    font-weight: 400; }\n\n.card.card-background {\n  align-items: center; }\n  .card.card-background .full-background {\n    background-position: 50%;\n    background-size: cover;\n    margin-bottom: 30px;\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    border-radius: 0.75rem; }\n  .card.card-background .card-body {\n    color: #fff;\n    position: relative;\n    z-index: 2; }\n    .card.card-background .card-body .content-center,\n    .card.card-background .card-body .content-left {\n      min-height: 330px;\n      max-width: 450px;\n      padding-top: 60px;\n      padding-bottom: 60px; }\n    .card.card-background .card-body .content-center {\n      text-align: center; }\n    .card.card-background .card-body.body-left {\n      width: 90%; }\n    .card.card-background .card-body .author .name span,\n    .card.card-background .card-body .author .name .stats {\n      color: #fff; }\n  .card.card-background:after {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    z-index: 1;\n    display: block;\n    content: \"\";\n    background: rgba(0, 0, 0, 0.56);\n    border-radius: 0.75rem; }\n  .card.card-background.card-background-mask-primary:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-primary:after {\n    background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-secondary:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-secondary:after {\n    background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-success:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-success:after {\n    background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-info:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-info:after {\n    background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-warning:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-warning:after {\n    background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-danger:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-danger:after {\n    background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-light:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-light:after {\n    background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-dark:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-dark:after {\n    background-image: linear-gradient(195deg, #42424a 0%, #191919 100%);\n    opacity: .85; }\n  .card.card-background .card-category {\n    font-size: 0.875rem;\n    font-weight: 600; }\n  .card.card-background .card-description {\n    margin-top: 24px;\n    margin-bottom: 24px; }\n\n.rotating-card-container {\n  -o-perspective: 800px;\n  -ms-perspective: 800px;\n  perspective: 800px; }\n  .rotating-card-container .card-rotate {\n    background: transparent;\n    box-shadow: none; }\n    .rotating-card-container .card-rotate:after {\n      display: none; }\n  .rotating-card-container .card {\n    transition: all 0.8s cubic-bezier(0.34, 1.45, 0.7, 1);\n    transform-style: preserve-3d;\n    position: relative; }\n    .rotating-card-container .card .back,\n    .rotating-card-container .card .front {\n      -webkit-backface-visibility: hidden;\n      backface-visibility: hidden;\n      position: absolute;\n      background-color: #fff;\n      border-radius: 0.5rem;\n      top: 0;\n      left: 0;\n      justify-content: center;\n      align-content: center;\n      display: -moz-flex;\n      display: -o-flex;\n      display: flex;\n      -moz-flex-direction: column;\n      -o-flex-direction: column;\n      flex-direction: column; }\n      .rotating-card-container .card .back .card-body,\n      .rotating-card-container .card .front .card-body {\n        justify-content: center;\n        align-content: center;\n        display: -moz-flex;\n        display: -o-flex;\n        display: flex;\n        -moz-flex-direction: column;\n        -o-flex-direction: column;\n        flex-direction: column; }\n      .rotating-card-container .card .back:after,\n      .rotating-card-container .card .front:after {\n        position: absolute;\n        z-index: 1;\n        width: 100%;\n        height: 100%;\n        display: block;\n        left: 0;\n        top: 0;\n        content: \"\";\n        border-radius: 0.5rem;\n        background-image: linear-gradient(195deg, #EC407A, #D81B60);\n        opacity: .85; }\n    .rotating-card-container .card .front {\n      z-index: 2;\n      position: relative; }\n    .rotating-card-container .card .back {\n      transform: rotateY(180deg);\n      z-index: 5;\n      text-align: center;\n      width: 100%;\n      height: 100%; }\n      .rotating-card-container .card .back.back-background .card-body {\n        position: relative;\n        z-index: 2; }\n      .rotating-card-container .card .back .card-footer .btn {\n        margin: 0; }\n      .rotating-card-container .card .back .card-body {\n        padding-left: 15px;\n        padding-right: 15px; }\n  .rotating-card-container:not(.manual-flip):hover .card {\n    transform: rotateY(180deg); }\n  .rotating-card-container.hover.manual-flip .card {\n    transform: rotateY(180deg); }\n  .card-profile .rotating-card-container .front {\n    text-align: left; }\n\n.back-background .card-body {\n  min-height: auto;\n  padding-top: 15px;\n  padding-bottom: 15px; }\n\n/*       Fix bug for IE      */\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n  .rotating-card-container .card .back,\n  .rotating-card-container .card .front {\n    -webkit-backface-visibility: visible;\n            backface-visibility: visible; }\n  .rotating-card-container .card .back {\n    visibility: hidden;\n    transition: visibility 0.3s cubic-bezier(0.34, 1.45, 0.7, 1); }\n  .rotating-card-container .card .front {\n    z-index: 4; }\n  .rotating-card-container.manual-flip.hover .card .back,\n  .rotating-card-container:not(.manual-flip):hover .card .back {\n    z-index: 5;\n    visibility: visible; } }\n\n.dark-version {\n  background-color: #1a2035 !important; }\n  .dark-version .main-content {\n    background-color: #1a2035 !important; }\n  .dark-version .sidenav {\n    background: #1f283e !important; }\n    .dark-version .sidenav.bg-transparent {\n      background: transparent !important; }\n      .dark-version .sidenav.bg-transparent .navbar-nav .nav-link {\n        color: #fff !important; }\n      .dark-version .sidenav.bg-transparent .nav .nav-link {\n        color: #fff !important; }\n    .dark-version .sidenav.bg-white {\n      background: #fff !important; }\n      .dark-version .sidenav.bg-white .navbar-nav .nav-link.active:after {\n        color: rgba(206, 212, 218, 0.7); }\n      .dark-version .sidenav.bg-white .collapse .nav-item .nav-link:not(.active) i {\n        color: #344767 !important; }\n      .dark-version .sidenav.bg-white .collapse .nav-item h6, .dark-version .sidenav.bg-white .collapse .nav-item .h6 {\n        color: #344767 !important; }\n    .dark-version .sidenav .collapse .nav-item .nav-link i {\n      color: #fff !important; }\n  .dark-version .fixed-plugin .btn.bg-gradient-dark, .dark-version .fixed-plugin .btn.btn-outline-dark {\n    color: #fff !important;\n    border: 1px solid #fff !important; }\n  .dark-version .fixed-plugin .btn.active {\n    background: #fff !important;\n    color: #344767 !important; }\n  .dark-version .bg-gradient-dark {\n    background-image: linear-gradient(195deg, #323a54, #1a2035); }\n  .dark-version .card,\n  .dark-version .swal2-popup,\n  .dark-version .dropdown .dropdown-menu,\n  .dark-version .kanban-board {\n    background: #202940;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n    .dark-version .card .card-header,\n    .dark-version .swal2-popup .card-header,\n    .dark-version .dropdown .dropdown-menu .card-header,\n    .dark-version .kanban-board .card-header {\n      background: transparent; }\n    .dark-version .card p,\n    .dark-version .swal2-popup p,\n    .dark-version .dropdown .dropdown-menu p,\n    .dark-version .kanban-board p {\n      color: #fff !important;\n      opacity: .6; }\n  .dark-version .kanban-item {\n    background: transparent !important;\n    border: 1px solid; }\n  .dark-version .swal2-html-container {\n    color: #fff !important;\n    opacity: .6; }\n  .dark-version h1, .dark-version .h1, .dark-version .h1,\n  .dark-version h2,\n  .dark-version .h2, .dark-version .h2,\n  .dark-version h3,\n  .dark-version .h3, .dark-version .h3,\n  .dark-version h4,\n  .dark-version .h4, .dark-version .h4,\n  .dark-version h5,\n  .dark-version .h5, .dark-version .h5,\n  .dark-version h6,\n  .dark-version .h6, .dark-version .h6,\n  .dark-version a:not(.dropdown-item):not(.choices__item):not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out):not(.btn):not(.nav-link):not(.fixed-plugin-button),\n  .dark-version .table thead tr th,\n  .dark-version .kanban-title-board {\n    color: #fff !important; }\n  .dark-version .input-group.input-group-dynamic .form-control, .dark-version .input-group.input-group-static .form-control {\n    background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, rgba(210, 210, 210, 0.6) 1px, rgba(209, 209, 209, 0) 0) !important;\n    background-size: 0 100%, 100% 100%; }\n    .dark-version .input-group.input-group-dynamic .form-control:focus, .dark-version .input-group.input-group-static .form-control:focus {\n      background-size: 100% 100%, 100% 100%; }\n  .dark-version .input-group.input-group-outline .form-control {\n    border-color: rgba(255, 255, 255, 0.4) !important; }\n  .dark-version .input-group .is-valid,\n  .dark-version .input-group .is-invalid {\n    border-color: rgba(255, 255, 255, 0.4) !important; }\n  .dark-version .accordion .accordion-button {\n    border-color: rgba(255, 255, 255, 0.4) !important;\n    color: #fff;\n    opacity: .8; }\n  .dark-version .table > :not(caption) > * > * {\n    border-color: rgba(255, 255, 255, 0.4) !important;\n    color: rgba(255, 255, 255, 0.6) !important; }\n  .dark-version label {\n    color: rgba(255, 255, 255, 0.8) !important; }\n  .dark-version .list-group-item,\n  .dark-version .multisteps-form__panel {\n    background-color: transparent !important; }\n  .dark-version .nav.bg-white {\n    background-color: #202940 !important;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n  .dark-version .nav .nav-link[data-scroll]:hover {\n    color: #344767 !important; }\n  .dark-version .toast {\n    background-color: #202940 !important;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n    .dark-version .toast .toast-header {\n      background: transparent; }\n    .dark-version .toast span {\n      color: #fff; }\n    .dark-version .toast p {\n      color: #fff !important;\n      opacity: .6; }\n  .dark-version .choices .choices__input {\n    background-color: transparent !important;\n    border-bottom: 1px solid rgba(255, 255, 255, 0.4);\n    color: #fff; }\n  .dark-version .choices .choices__list.choices__list--dropdown {\n    background: #202940;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n  .dark-version .fc-theme-standard td,\n  .dark-version .fc-theme-standard th {\n    border-color: rgba(123, 128, 154, 0.3); }\n  .dark-version .dataTable-sorter::after {\n    border-bottom-color: #fff; }\n  .dark-version .dataTable-sorter::before {\n    border-top-color: #fff; }\n  .dark-version .ql-snow .ql-stroke {\n    stroke: #f0f2f5; }\n  .dark-version .ql-snow .ql-fill, .dark-version .ql-snow .ql-stroke.ql-fill {\n    fill: #f0f2f5; }\n  .dark-version .ql-toolbar.ql-snow .ql-picker-label {\n    color: #f0f2f5; }\n\nbody.dark-version {\n  color: rgba(255, 255, 255, 0.8) !important; }\n\n@media (min-width: 992px) {\n  .dropdown .dropdown-menu,\n  .dropup .dropdown-menu,\n  .dropstart .dropdown-menu,\n  .dropend .dropdown-menu {\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n    cursor: pointer; }\n  .dropdown .dropdown-toggle:after,\n  .dropup .dropdown-toggle:after,\n  .dropstart .dropdown-toggle:after,\n  .dropend .dropdown-toggle:after {\n    content: \"\\f107\";\n    font: normal normal normal 14px/1 FontAwesome;\n    border: none;\n    vertical-align: middle;\n    font-weight: 600; }\n  .dropdown .dropdown-toggle.show:after,\n  .dropup .dropdown-toggle.show:after,\n  .dropstart .dropdown-toggle.show:after,\n  .dropend .dropdown-toggle.show:after {\n    transform: rotate(180deg); }\n  .dropdown .dropdown-toggle:after,\n  .dropup .dropdown-toggle:after,\n  .dropstart .dropdown-toggle:after,\n  .dropend .dropdown-toggle:after {\n    transition: 0.3s ease; }\n  .dropdown.dropdown-hover .dropdown-menu,\n  .dropdown .dropdown-menu {\n    display: block;\n    position: absolute;\n    opacity: 0;\n    transform-origin: 0 0;\n    inset: 0px auto auto 0px;\n    margin-top: 2.8125rem !important;\n    pointer-events: none;\n    transform: scale(0.95) !important;\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    will-change: transform,box-shadow; }\n    .dropdown.dropdown-hover .dropdown-menu .dropdown.dropdown-hover .dropdown-menu,\n    .dropdown.dropdown-hover .dropdown-menu .dropdown .dropdown-menu,\n    .dropdown .dropdown-menu .dropdown.dropdown-hover .dropdown-menu,\n    .dropdown .dropdown-menu .dropdown .dropdown-menu {\n      margin-top: 0 !important; }\n  .dropdown.dropdown-hover:hover > .dropdown-menu,\n  .dropdown .dropdown-menu.show {\n    opacity: 1;\n    pointer-events: auto;\n    visibility: visible;\n    transform: scale(1) !important; }\n  .dropdown.dropdown-hover:hover > .dropdown-menu:before,\n  .dropdown .dropdown-menu.show:before {\n    top: -20px; }\n  .dropdown.dropdown-hover:after {\n    content: '';\n    position: absolute;\n    left: 0;\n    bottom: -24px;\n    width: 100%;\n    height: 100%; }\n  .dropdown:not(.dropdown-hover) .dropdown-menu.show {\n    margin-top: 2.8125rem !important; }\n  .dropdown .dropdown-menu:before {\n    font-family: \"FontAwesome\";\n    content: \"\\f0d8\";\n    position: absolute;\n    top: 0;\n    left: 28px;\n    right: auto;\n    font-size: 22px;\n    color: #fff;\n    transition: top 0.35s ease; }\n  .dropdown .dropdown-item .arrow {\n    transform: rotate(-90deg); }\n  .dropdown-item {\n    transition: background-color 0.3s ease, color 0.3s ease; } }\n\n@media (max-width: 991.98px) {\n  .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu {\n    display: block;\n    opacity: 0;\n    top: 0;\n    transform-origin: 0 0;\n    pointer-events: none;\n    transform: scale(0.95) !important;\n    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    will-change: transform,box-shadow;\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }\n    .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu:before {\n      font-family: \"FontAwesome\";\n      content: \"\\f0d8\";\n      position: absolute;\n      top: 0;\n      left: 28px;\n      right: auto;\n      font-size: 22px;\n      color: #fff;\n      transition: top 0.35s ease; }\n  .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item):not(.dropdown-hover) .dropdown-menu {\n    margin-top: 2.8125rem !important; }\n  .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu.show {\n    opacity: 1;\n    pointer-events: auto;\n    visibility: visible;\n    transform: scale(1) !important; }\n    .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu.show:before {\n      top: -20px; }\n  .navbar-toggler + .navbar-collapse .dropdown.nav-item .dropdown-menu {\n    background-color: transparent;\n    overflow: scroll;\n    position: relative; }\n  .dropdown .dropdown-menu {\n    opacity: 0;\n    top: 0;\n    transform-origin: 0 0;\n    pointer-events: none;\n    transform: scale(0.95) !important;\n    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    will-change: transform,box-shadow;\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }\n    .dropdown .dropdown-menu:before {\n      font-family: \"FontAwesome\";\n      content: \"\\f0d8\";\n      position: absolute;\n      top: 0;\n      left: 28px;\n      right: auto;\n      font-size: 22px;\n      color: #fff;\n      transition: top 0.35s ease; }\n  .dropdown:not(.dropdown-hover) .dropdown-menu {\n    margin-top: 2.8125rem !important; }\n  .dropdown .dropdown-menu.show {\n    opacity: 1;\n    pointer-events: auto;\n    visibility: visible;\n    transform: scale(1) !important; }\n    .dropdown .dropdown-menu.show:before {\n      top: -20px; }\n  .dropdown.nav-item .dropdown-menu {\n    position: absolute; }\n  .dropdown.nav-item .dropdown-menu-animation {\n    display: block;\n    height: 0;\n    transition: all .35s ease;\n    padding-top: 0 !important;\n    padding-bottom: 0 !important;\n    opacity: 0; }\n    .dropdown.nav-item .dropdown-menu-animation.show {\n      height: 250px;\n      opacity: 1; } }\n\n.dropdown-menu li {\n  position: relative; }\n\n.dropdown.dropdown-subitem:after {\n  left: 100%;\n  bottom: 0;\n  width: 50%; }\n\n.dropdown .dropdown-menu .dropdown-item + .dropdown-menu:before {\n  transform: rotate(-90deg);\n  left: 0;\n  top: 0;\n  z-index: -1;\n  transition: left .35s ease; }\n\n.dropdown .dropdown-menu.dropdown-menu-end {\n  right: 0 !important;\n  left: auto !important; }\n  .dropdown .dropdown-menu.dropdown-menu-end:before {\n    right: 28px;\n    left: auto; }\n\n.dropdown.dropdown-subitem:hover .dropdown-item + .dropdown-menu:before {\n  left: -8px; }\n\n.dropdown > .dropdown-menu .dropdown-item + .dropdown-menu {\n  transform: scale(1) !important; }\n\n.dropdown .dropdown-menu .dropdown-item + .dropdown-menu {\n  right: -197px;\n  left: auto;\n  top: 0; }\n\n.dropdown-image {\n  background-size: cover; }\n\n@media (min-width: 992px) {\n  .dropdown-xl {\n    min-width: 40rem; }\n  .dropdown-lg {\n    min-width: 23rem; }\n  .dropdown-md {\n    min-width: 15rem; } }\n\n@media (max-width: 1199.98px) {\n  .dropdown-lg-responsive {\n    min-width: 19rem; } }\n\n.dropup .dropdown-menu {\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n  cursor: pointer;\n  top: auto !important;\n  bottom: 100% !important;\n  margin-bottom: 0.5rem !important;\n  display: block;\n  opacity: 0;\n  transform-origin: bottom;\n  pointer-events: none;\n  transform: scale(0.95) !important;\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  will-change: transform,box-shadow; }\n  .dropup .dropdown-menu.show {\n    pointer-events: auto;\n    transform: scale(1) !important;\n    opacity: 1; }\n    .dropup .dropdown-menu.show:after {\n      bottom: -20px; }\n  .dropup .dropdown-menu:after {\n    font-family: \"FontAwesome\";\n    content: \"\\f0d7\";\n    position: absolute;\n    z-index: -1;\n    bottom: 22px;\n    left: 28px;\n    right: auto;\n    font-size: 22px;\n    color: #fff;\n    transition: bottom 0.35s ease; }\n\n.page-header {\n  padding: 0;\n  position: relative;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  background-size: cover;\n  background-position: 50%; }\n  .page-header .container {\n    z-index: 1; }\n  .page-header video {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    min-width: 100%;\n    min-height: 100%;\n    width: auto;\n    height: auto;\n    z-index: 0;\n    transform: translateX(-50%) translateY(-50%); }\n\n.fixed-plugin .fixed-plugin-button {\n  background: #fff;\n  border-radius: 50%;\n  bottom: 30px;\n  right: 30px;\n  font-size: 1.25rem;\n  z-index: 990;\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.16);\n  cursor: pointer; }\n  .fixed-plugin .fixed-plugin-button i {\n    pointer-events: none; }\n\n.fixed-plugin .card {\n  position: fixed !important;\n  right: -360px;\n  top: 0;\n  height: 100%;\n  left: auto !important;\n  transform: unset !important;\n  width: 360px;\n  border-radius: 0;\n  padding: 0 10px;\n  transition: .2s ease;\n  z-index: 1020; }\n\n.fixed-plugin .badge {\n  border: 1px solid #fff;\n  border-radius: 50%;\n  cursor: pointer;\n  display: inline-block;\n  height: 23px;\n  margin-right: 5px;\n  position: relative;\n  width: 23px;\n  transition: all 0.2s ease-in-out; }\n  .fixed-plugin .badge:hover, .fixed-plugin .badge.active {\n    border-color: #344767; }\n\n.fixed-plugin .btn.bg-gradient-dark:not(:disabled):not(.disabled) {\n  border: 1px solid transparent; }\n  .fixed-plugin .btn.bg-gradient-dark:not(:disabled):not(.disabled):not(.active) {\n    background-color: transparent;\n    background-image: none;\n    border: 1px solid #344767;\n    color: #344767; }\n\n.fixed-plugin.show .card {\n  right: 0; }\n\n.input-group {\n  border-radius: 0; }\n  .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),\n  .input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3) {\n    border-top-right-radius: inherit;\n    border-bottom-right-radius: inherit; }\n  .input-group.has-validation > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),\n  .input-group.has-validation > .dropdown-toggle:nth-last-child(n + 4) {\n    border-top-right-radius: inherit;\n    border-bottom-right-radius: inherit; }\n  .input-group,\n  .input-group .input-group-text {\n    transition: 0.2s ease;\n    border: none; }\n  .input-group > :not(:first-child):not(.dropdown-menu) {\n    margin-left: 2px; }\n  .input-group label {\n    transition: all 0.3s ease; }\n  .input-group.input-group-dynamic .form-control, .input-group.input-group-static .form-control {\n    background: no-repeat bottom, 50% calc(100% - 1px);\n    background-size: 0 100%, 100% 100%;\n    transition: 0.2s ease; }\n    .input-group.input-group-dynamic .form-control:not(:first-child), .input-group.input-group-static .form-control:not(:first-child) {\n      border-left: 0;\n      padding-left: 0; }\n    .input-group.input-group-dynamic .form-control:not(:last-child), .input-group.input-group-static .form-control:not(:last-child) {\n      border-right: 0;\n      padding-right: 0; }\n    .input-group.input-group-dynamic .form-control + .input-group-text, .input-group.input-group-static .form-control + .input-group-text {\n      border-left: 0;\n      border-right: 1px solid #d2d6da; }\n    .input-group.input-group-dynamic .form-control, .input-group.input-group-dynamic .form-control:focus, .input-group.input-group-static .form-control, .input-group.input-group-static .form-control:focus {\n      background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n      border-radius: 0 !important; }\n    .input-group.input-group-dynamic .form-control:focus, .input-group.input-group-static .form-control:focus {\n      background-size: 100% 100%, 100% 100%; }\n    .input-group.input-group-dynamic .form-control[disabled], .input-group.input-group-static .form-control[disabled] {\n      cursor: not-allowed;\n      background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #f0f2f5 1px, rgba(209, 209, 209, 0) 0) !important; }\n  .input-group.input-group-dynamic .input-group-text, .input-group.input-group-static .input-group-text {\n    border-right: 0; }\n  .input-group.input-group-dynamic.is-focused .form-label, .input-group.input-group-dynamic.is-filled .form-label, .input-group.input-group-static.is-focused .form-label, .input-group.input-group-static.is-filled .form-label {\n    font-size: 0.6875rem !important; }\n  .input-group.input-group-dynamic.is-focused .form-label, .input-group.input-group-static.is-focused .form-label {\n    top: -0.7rem; }\n  .input-group.input-group-dynamic.is-focused label, .input-group.input-group-static.is-focused label {\n    color: #e91e63; }\n  .input-group.input-group-dynamic.is-focused.is-valid label, .input-group.input-group-static.is-focused.is-valid label {\n    color: #4CAF50; }\n  .input-group.input-group-dynamic.is-focused.is-valid .form-control, .input-group.input-group-dynamic.is-focused.is-valid .form-control:focus, .input-group.input-group-static.is-focused.is-valid .form-control, .input-group.input-group-static.is-focused.is-valid .form-control:focus {\n    background-image: linear-gradient(0deg, #4CAF50 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-focused.is-invalid label, .input-group.input-group-static.is-focused.is-invalid label {\n    color: #F44335; }\n  .input-group.input-group-dynamic.is-focused.is-invalid .form-control, .input-group.input-group-dynamic.is-focused.is-invalid .form-control:focus, .input-group.input-group-static.is-focused.is-invalid .form-control, .input-group.input-group-static.is-focused.is-invalid .form-control:focus {\n    background-image: linear-gradient(0deg, #F44335 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-valid .form-control, .input-group.input-group-dynamic.is-valid .form-control:focus, .input-group.input-group-static.is-valid .form-control, .input-group.input-group-static.is-valid .form-control:focus {\n    background-image: linear-gradient(0deg, #4CAF50 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-invalid .form-control, .input-group.input-group-dynamic.is-invalid .form-control:focus, .input-group.input-group-static.is-invalid .form-control, .input-group.input-group-static.is-invalid .form-control:focus {\n    background-image: linear-gradient(0deg, #F44335 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-filled.is-focused .form-label, .input-group.input-group-dynamic.is-filled .form-label, .input-group.input-group-static.is-filled.is-focused .form-label, .input-group.input-group-static.is-filled .form-label {\n    top: -1rem; }\n  .input-group.input-group-outline .form-control {\n    background: none;\n    border: 1px solid #d2d6da;\n    border-radius: 0.375rem;\n    border-top-left-radius: 0.375rem !important;\n    border-bottom-left-radius: 0.375rem !important;\n    padding: 0.625rem 0.75rem !important;\n    line-height: 1.3 !important; }\n    .input-group.input-group-outline .form-control.form-control-lg {\n      padding: 0.75rem 0.75rem !important; }\n    .input-group.input-group-outline .form-control.form-control-sm {\n      padding: 0.25rem 0.75rem !important; }\n    .input-group.input-group-outline .form-control[disabled] {\n      cursor: not-allowed;\n      border-style: dashed; }\n  .input-group.input-group-outline .form-label {\n    display: flex;\n    line-height: 3.925 !important;\n    top: -0.375rem;\n    margin-bottom: 0; }\n    .input-group.input-group-outline .form-label:before {\n      content: \"\";\n      margin-right: 4px;\n      border-left: solid 1px transparent;\n      border-radius: 4px 0; }\n    .input-group.input-group-outline .form-label:after {\n      content: \"\";\n      flex-grow: 1;\n      margin-left: 4px;\n      border-right: solid 1px transparent;\n      border-radius: 0 5px; }\n    .input-group.input-group-outline .form-label:before, .input-group.input-group-outline .form-label:after {\n      content: \"\";\n      border-top: solid 1px;\n      border-top-color: #d2d6da;\n      pointer-events: none;\n      margin-top: 0.375rem;\n      box-sizing: border-box;\n      display: block;\n      height: 0.5rem;\n      width: 0.625rem;\n      border-width: 1px 0 0;\n      border-color: transparent; }\n  .input-group.input-group-outline.is-focused .form-label + .form-control, .input-group.input-group-outline.is-filled .form-label + .form-control {\n    border-color: #e91e63 !important;\n    border-top-color: transparent !important;\n    box-shadow: inset 1px 0 #e91e63, inset -1px 0 #e91e63, inset 0 -1px #e91e63; }\n  .input-group.input-group-outline.is-focused .form-label, .input-group.input-group-outline.is-filled .form-label {\n    width: 100%;\n    height: 100%;\n    font-size: 0.6875rem !important;\n    color: #e91e63;\n    display: flex;\n    line-height: 1.25 !important; }\n    .input-group.input-group-outline.is-focused .form-label:before, .input-group.input-group-outline.is-focused .form-label:after, .input-group.input-group-outline.is-filled .form-label:before, .input-group.input-group-outline.is-filled .form-label:after {\n      opacity: 1; }\n    .input-group.input-group-outline.is-focused .form-label:before, .input-group.input-group-outline.is-focused .form-label:after, .input-group.input-group-outline.is-filled .form-label:before, .input-group.input-group-outline.is-filled .form-label:after {\n      border-top-color: #e91e63;\n      box-shadow: inset 0 1px #e91e63; }\n  .input-group.input-group-outline.is-valid .form-control {\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3e%3cpath fill='%2366d432' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");\n    background-repeat: no-repeat;\n    background-position: right 0.75rem center;\n    background-size: 1rem 1rem; }\n  .input-group.input-group-outline.is-valid.is-focused .form-label + .form-control, .input-group.input-group-outline.is-valid.is-filled .form-label + .form-control {\n    border-color: #4CAF50 !important;\n    box-shadow: inset 1px 0 #4CAF50, inset -1px 0 #4CAF50, inset 0 -1px #4CAF50;\n    border-top-color: transparent !important; }\n  .input-group.input-group-outline.is-valid.is-focused .form-label, .input-group.input-group-outline.is-valid.is-filled .form-label {\n    color: #4CAF50; }\n    .input-group.input-group-outline.is-valid.is-focused .form-label:before, .input-group.input-group-outline.is-valid.is-focused .form-label:after, .input-group.input-group-outline.is-valid.is-filled .form-label:before, .input-group.input-group-outline.is-valid.is-filled .form-label:after {\n      border-top-color: #4CAF50;\n      box-shadow: inset 0 1px #4CAF50; }\n  .input-group.input-group-outline.is-invalid .form-control {\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd5c70' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd5c70' stroke='none'/%3e%3c/svg%3e\");\n    background-repeat: no-repeat;\n    background-position: right 0.75rem center;\n    background-size: 1rem 1rem; }\n  .input-group.input-group-outline.is-invalid.is-focused .form-label + .form-control, .input-group.input-group-outline.is-invalid.is-filled .form-label + .form-control {\n    border-color: #F44335 !important;\n    box-shadow: inset 1px 0 #F44335, inset -1px 0 #F44335, inset 0 -1px #F44335;\n    border-top-color: transparent !important; }\n  .input-group.input-group-outline.is-invalid.is-focused .form-label, .input-group.input-group-outline.is-invalid.is-filled .form-label {\n    color: #F44335; }\n    .input-group.input-group-outline.is-invalid.is-focused .form-label:before, .input-group.input-group-outline.is-invalid.is-focused .form-label:after, .input-group.input-group-outline.is-invalid.is-filled .form-label:before, .input-group.input-group-outline.is-invalid.is-filled .form-label:after {\n      border-top-color: #F44335;\n      box-shadow: inset 0 1px #F44335; }\n  .input-group.input-group-outline.input-group-sm .form-label,\n  .input-group.input-group-outline.input-group-sm label, .input-group.input-group-dynamic.input-group-sm .form-label,\n  .input-group.input-group-dynamic.input-group-sm label, .input-group.input-group-static.input-group-sm .form-label,\n  .input-group.input-group-static.input-group-sm label {\n    font-size: 0.75rem; }\n  .input-group.input-group-outline.input-group-lg .form-label,\n  .input-group.input-group-outline.input-group-lg label, .input-group.input-group-dynamic.input-group-lg .form-label,\n  .input-group.input-group-dynamic.input-group-lg label, .input-group.input-group-static.input-group-lg .form-label,\n  .input-group.input-group-static.input-group-lg label {\n    font-size: 0.975rem; }\n  .input-group.input-group-static .form-control {\n    width: 100%; }\n  .input-group.input-group-static label {\n    margin-left: 0;\n    margin-bottom: 0; }\n\n.form-check:not(.form-switch) .form-check-input {\n  float: initial !important;\n  margin-left: auto !important; }\n  .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"], .form-check:not(.form-switch) .form-check-input[type=\"radio\"] {\n    border: 1px solid #d1d7e1;\n    margin-top: 0.25rem;\n    position: relative; }\n    .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:checked, .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:checked {\n      border-color: #e91e63; }\n  .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"] {\n    background-image: none; }\n    .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:after {\n      transition: opacity 0.25s ease-in-out;\n      font-family: \"FontAwesome\";\n      content: \"\\f00c\";\n      width: 100%;\n      height: 100%;\n      color: #fff;\n      position: absolute;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      font-size: 0.67rem;\n      opacity: 0; }\n    .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:checked {\n      background: #e91e63; }\n      .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:checked:after {\n        opacity: 1; }\n  .form-check:not(.form-switch) .form-check-input[type=\"radio\"] {\n    transition: border 0s;\n    background: transparent; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:after {\n      transition: opacity 0.25s ease-in-out;\n      content: \"\";\n      position: absolute;\n      width: 0.8375rem;\n      height: 0.8375rem;\n      border-radius: 50%;\n      background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%), var(--bs-gradient);\n      opacity: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      margin: auto; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:checked {\n      padding: 6px; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:checked:after {\n      opacity: 1; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:active {\n      box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 0 0 12px rgba(53, 71, 102, 0.1);\n      border-radius: 50rem;\n      transition: 0.05s ease; }\n\n.form-check-label,\n.form-check-input[type=\"checkbox\"] {\n  cursor: pointer; }\n\n.form-check-label {\n  font-size: 0.875rem;\n  font-weight: 400; }\n\n.form-check-input {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none; }\n\n.form-switch .form-check-input {\n  position: relative;\n  background-color: #ced4da;\n  height: 0.9375rem;\n  width: 1.875rem; }\n  .form-switch .form-check-input:after {\n    transition: transform 0.25s ease-in-out, background-color 0.25s ease-in-out;\n    content: \"\";\n    width: 1.25rem;\n    height: 1.25rem;\n    border-radius: 50%;\n    border: 1px solid #ced4da;\n    position: absolute;\n    background-color: #fff;\n    transform: translateX(1px);\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n    top: -2.5px;\n    left: -5px; }\n  .form-switch .form-check-input:checked:after {\n    transform: translateX(21px);\n    border-color: #42424a; }\n  .form-switch .form-check-input:checked {\n    border-color: #42424a;\n    background-color: #42424a; }\n    .form-switch .form-check-input:checked:active:after {\n      box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 0 0 15px rgba(53, 71, 102, 0.1); }\n  .form-switch .form-check-input:active:after {\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 0 0 15px rgba(0, 0, 0, 0.1); }\n\n.form-select {\n  transition: 0.2s ease; }\n\nlabel,\n.form-label {\n  font-size: 0.875rem;\n  font-weight: 400;\n  margin-bottom: 0.5rem;\n  color: #7b809a;\n  margin-left: 0.25rem; }\n\n.input-group .form-label {\n  position: absolute;\n  top: 0.6125rem;\n  margin-left: 0;\n  transition: 0.2s ease all; }\n\n.form-control {\n  border: none; }\n  .form-control.is-invalid {\n    border: 1px solid #d2d6da;\n    padding: 0.625rem 0.75rem;\n    line-height: 1.3 !important; }\n    .form-control.is-invalid:focus {\n      box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.6); }\n  .form-control.is-valid {\n    border: 1px solid #d2d6da;\n    padding: 0.625rem 0.75rem;\n    line-height: 1.3 !important; }\n    .form-control.is-valid:focus {\n      box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.65); }\n  .form-control[disabled] {\n    padding: 0.625rem 0.75rem;\n    line-height: 1.45 !important; }\n\n.input-group .input-group-text {\n  position: absolute;\n  padding: .75rem 0;\n  right: 0;\n  border-right: 0 !important; }\n  .input-group .input-group-text i {\n    color: #6c757d; }\n\n.input-group.input-group-static .input-group-text {\n  bottom: 0; }\n\n.footer .nav-link {\n  color: #344767;\n  font-weight: 400;\n  font-size: 0.875rem;\n  padding-top: 0;\n  padding-bottom: 0.25rem; }\n  .footer .nav-link:hover {\n    opacity: 1 !important;\n    transition: opacity 0.3 ease; }\n\n.footer .footer-logo {\n  max-width: 2rem; }\n\n.bg-gradient-primary {\n  background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n\n.bg-gradient-secondary {\n  background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%); }\n\n.bg-gradient-success {\n  background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%); }\n\n.bg-gradient-info {\n  background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%); }\n\n.bg-gradient-warning {\n  background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%); }\n\n.bg-gradient-danger {\n  background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%); }\n\n.bg-gradient-light {\n  background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%); }\n\n.bg-gradient-dark {\n  background-image: linear-gradient(195deg, #42424a 0%, #191919 100%); }\n\n.bg-gradient-faded-primary {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(233, 30, 99, 0.6) 0, #c1134e 100%); }\n\n.bg-gradient-faded-secondary {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(123, 128, 154, 0.6) 0, #626780 100%); }\n\n.bg-gradient-faded-success {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(76, 175, 80, 0.6) 0, #3d8b40 100%); }\n\n.bg-gradient-faded-info {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(26, 115, 232, 0.6) 0, #135cbc 100%); }\n\n.bg-gradient-faded-warning {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(251, 140, 0, 0.6) 0, #c87000 100%); }\n\n.bg-gradient-faded-danger {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(244, 67, 53, 0.6) 0, #e91d0d 100%); }\n\n.bg-gradient-faded-light {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(240, 242, 245, 0.6) 0, #d1d7e1 100%); }\n\n.bg-gradient-faded-dark {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(52, 71, 103, 0.6) 0, #233045 100%); }\n\n.bg-gradient-faded-white {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(255, 255, 255, 0.6) 0, #e6e6e6 100%); }\n\n.bg-gradient-faded-primary-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(233, 30, 99, 0.3) 0, #e91e63 100%); }\n\n.bg-gradient-faded-secondary-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(123, 128, 154, 0.3) 0, #7b809a 100%); }\n\n.bg-gradient-faded-success-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(76, 175, 80, 0.3) 0, #4CAF50 100%); }\n\n.bg-gradient-faded-info-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(26, 115, 232, 0.3) 0, #1A73E8 100%); }\n\n.bg-gradient-faded-warning-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(251, 140, 0, 0.3) 0, #fb8c00 100%); }\n\n.bg-gradient-faded-danger-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(244, 67, 53, 0.3) 0, #F44335 100%); }\n\n.bg-gradient-faded-light-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(240, 242, 245, 0.3) 0, #f0f2f5 100%); }\n\n.bg-gradient-faded-dark-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(52, 71, 103, 0.3) 0, #344767 100%); }\n\n.bg-gradient-faded-white-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(255, 255, 255, 0.3) 0, #fff 100%); }\n\n.material-icons {\n  font-family: 'Material Icons Round';\n  font-weight: normal;\n  font-style: normal;\n  font-size: 20px;\n  /* Preferred icon size */\n  display: inline-block;\n  line-height: 1;\n  text-transform: none;\n  letter-spacing: normal;\n  word-wrap: normal;\n  white-space: nowrap;\n  direction: ltr;\n  /* Support for all WebKit browsers. */\n  -webkit-font-smoothing: antialiased;\n  /* Support for Safari and Chrome. */\n  text-rendering: optimizeLegibility;\n  /* Support for Firefox. */\n  -moz-osx-font-smoothing: grayscale;\n  /* Support for IE. */\n  font-feature-settings: 'liga'; }\n\n.nav.nav-pills .nav-link .material-icons {\n  top: 3px; }\n\n.icon-shape {\n  width: 48px;\n  height: 48px;\n  background-position: center;\n  border-radius: 0.5rem; }\n  .icon-shape i {\n    color: #fff;\n    opacity: 0.8;\n    top: 11px;\n    position: relative; }\n  .icon-shape .ni {\n    top: 14px; }\n\n.icon-xxs {\n  width: 20px;\n  height: 20px; }\n  .icon-xxs i {\n    top: 0;\n    font-size: 0.65rem; }\n\n.icon-xs {\n  width: 24px;\n  height: 24px; }\n  .icon-xs i {\n    top: -1px;\n    font-size: 0.75rem; }\n\n.icon-sm {\n  width: 32px;\n  height: 32px; }\n  .icon-sm i {\n    top: 4px;\n    font-size: 0.875rem; }\n\n.icon-md {\n  width: 48px;\n  height: 48px; }\n  .icon-md i {\n    top: 30%;\n    font-size: 1.125rem; }\n  .icon-md.icon-striped {\n    background-position-x: 85px;\n    background-position-y: 85px; }\n    .icon-md.icon-striped i {\n      top: 11%;\n      margin-left: -10px;\n      font-size: 0.875rem; }\n\n.icon-lg {\n  width: 64px;\n  height: 64px; }\n  .icon-lg i {\n    top: 31%;\n    font-size: 1.5rem; }\n  .icon-lg.icon-striped {\n    background-position-x: 111px;\n    background-position-y: 111px; }\n    .icon-lg.icon-striped i {\n      top: 21%;\n      margin-left: -15px; }\n\n.icon-xl {\n  width: 100px;\n  height: 100px;\n  border-radius: 0.5rem; }\n  .icon-xl i {\n    top: 35%;\n    font-size: 2.1rem; }\n  .icon-xl.icon-striped {\n    background-position-x: 80px;\n    background-position-y: 80px; }\n    .icon-xl.icon-striped i {\n      top: 30%;\n      margin-left: -15px; }\n\n.info-horizontal {\n  text-align: left !important; }\n  .info-horizontal .icon {\n    float: left; }\n  .info-horizontal .description {\n    overflow: hidden; }\n\nsvg.text-primary .color-foreground {\n  fill: #EC407A; }\n\nsvg.text-primary .color-background {\n  fill: #D81B60; }\n\nsvg.text-secondary .color-foreground {\n  fill: #747b8a; }\n\nsvg.text-secondary .color-background {\n  fill: #495361; }\n\nsvg.text-info .color-foreground {\n  fill: #49a3f1; }\n\nsvg.text-info .color-background {\n  fill: #1A73E8; }\n\nsvg.text-warning .color-foreground {\n  fill: #FFA726; }\n\nsvg.text-warning .color-background {\n  fill: #FB8C00; }\n\nsvg.text-danger .color-foreground {\n  fill: #EF5350; }\n\nsvg.text-danger .color-background {\n  fill: #E53935; }\n\nsvg.text-success .color-foreground {\n  fill: #66BB6A; }\n\nsvg.text-success .color-background {\n  fill: #43A047; }\n\nsvg.text-dark .color-foreground {\n  fill: #42424a; }\n\nsvg.text-dark .color-background {\n  fill: #191919; }\n\n.blur {\n  box-shadow: inset 0px 0px 2px #fefefed1;\n  -webkit-backdrop-filter: saturate(200%) blur(30px);\n  backdrop-filter: saturate(200%) blur(30px);\n  background-color: rgba(255, 255, 255, 0.8) !important; }\n  .blur.saturation-less {\n    -webkit-backdrop-filter: saturate(20%) blur(30px);\n    backdrop-filter: saturate(20%) blur(30px); }\n  .blur.blur-rounded {\n    border-radius: 40px; }\n  .blur.blur-light {\n    background-color: rgba(255, 255, 255, 0.4); }\n  .blur.blur-dark {\n    background-color: rgba(0, 0, 0, 0.3); }\n\n.shadow-blur {\n  box-shadow: inset 0 0px 1px 1px rgba(254, 254, 254, 0.9), 0 20px 27px 0 rgba(0, 0, 0, 0.05) !important; }\n\n.shadow-card {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; }\n\n.navbar-blur {\n  -webkit-backdrop-filter: saturate(200%) blur(30px);\n  backdrop-filter: saturate(200%) blur(30px);\n  background-color: rgba(255, 255, 255, 0.58) !important; }\n\n.blur-section {\n  -webkit-backdrop-filter: saturate(200%) blur(30px);\n  backdrop-filter: saturate(200%) blur(30px); }\n  .blur-section.blur-gradient-primary {\n    background-image: linear-gradient(195deg, rgba(236, 64, 122, 0.95) 0%, rgba(216, 27, 96, 0.95) 100%); }\n\n*.move-on-hover {\n  transition: 0.2s ease-out;\n  overflow: hidden;\n  transform-origin: 50% 0;\n  transform-origin: 50% 0;\n  transform: perspective(999px) rotateX(0deg) translate3d(0, 0, 0);\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  will-change: transform, box-shadow; }\n  *.move-on-hover:hover {\n    transform: perspective(999px) rotateX(7deg) translate3d(0px, -4px, 5px); }\n\n*.gradient-animation {\n  background: linear-gradient(-45deg, #49a3f1, #F44335, #fb8c00, #EC407A, #344767);\n  background-size: 400% 400% !important;\n  -webkit-animation: gradient 10s ease infinite;\n          animation: gradient 10s ease infinite; }\n\nhr.vertical {\n  position: absolute;\n  background-color: transparent;\n  height: 100%;\n  right: 0;\n  top: 0;\n  width: 1px; }\n  hr.vertical.light {\n    background-color: #ffffff94; }\n  hr.vertical.dark {\n    background-color: #7b809a33; }\n  hr.vertical.gray-light {\n    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)); }\n\nhr.horizontal {\n  background-color: transparent; }\n  hr.horizontal.light {\n    background-color: #ffffff94; }\n  hr.horizontal.dark {\n    background-color: #7b809a33; }\n  hr.horizontal.gray-light {\n    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)); }\n\n.lock-size {\n  width: 1.7rem;\n  height: 1.7rem; }\n\n.border-radius-xs {\n  border-radius: 0.1rem; }\n\n.border-radius-sm {\n  border-radius: 0.125rem; }\n\n.border-radius-md {\n  border-radius: 0.375rem; }\n\n.border-radius-lg {\n  border-radius: 0.5rem; }\n\n.border-radius-xl {\n  border-radius: 0.75rem; }\n\n.border-radius-2xl {\n  border-radius: 1rem; }\n\n.border-radius-section {\n  border-radius: 10rem; }\n\n.border-bottom-end-radius-0 {\n  border-bottom-right-radius: 0; }\n\n.border-top-end-radius-0 {\n  border-top-right-radius: 0; }\n\n.border-bottom-start-radius-0 {\n  border-bottom-left-radius: 0; }\n\n.border-top-start-radius-0 {\n  border-top-left-radius: 0; }\n\n.border-dashed {\n  border-style: dashed; }\n\n.z-index-sticky {\n  z-index: 1020; }\n\n.waves {\n  position: relative;\n  width: 100%;\n  height: 16vh;\n  margin-bottom: -7px;\n  /*Fix for safari gap*/\n  min-height: 100px;\n  max-height: 150px; }\n  .waves.waves-sm {\n    height: 50px;\n    min-height: 50px; }\n  .waves.no-animation .moving-waves > use {\n    -webkit-animation: none;\n            animation: none; }\n\n.wave-rotate {\n  transform: rotate(180deg); }\n\n/* Animation for the waves */\n.moving-waves > use {\n  -webkit-animation: move-forever 40s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;\n          animation: move-forever 40s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; }\n\n.moving-waves > use:nth-child(1) {\n  -webkit-animation-delay: -2s;\n          animation-delay: -2s;\n  -webkit-animation-duration: 11s;\n          animation-duration: 11s; }\n\n.moving-waves > use:nth-child(2) {\n  -webkit-animation-delay: -4s;\n          animation-delay: -4s;\n  -webkit-animation-duration: 13s;\n          animation-duration: 13s; }\n\n.moving-waves > use:nth-child(3) {\n  -webkit-animation-delay: -3s;\n          animation-delay: -3s;\n  -webkit-animation-duration: 15s;\n          animation-duration: 15s; }\n\n.moving-waves > use:nth-child(4) {\n  -webkit-animation-delay: -4s;\n          animation-delay: -4s;\n  -webkit-animation-duration: 20s;\n          animation-duration: 20s; }\n\n.moving-waves > use:nth-child(5) {\n  -webkit-animation-delay: -4s;\n          animation-delay: -4s;\n  -webkit-animation-duration: 25s;\n          animation-duration: 25s; }\n\n.moving-waves > use:nth-child(6) {\n  -webkit-animation-delay: -3s;\n          animation-delay: -3s;\n  -webkit-animation-duration: 30s;\n          animation-duration: 30s; }\n\n@-webkit-keyframes move-forever {\n  0% {\n    transform: translate3d(-90px, 0, 0); }\n  100% {\n    transform: translate3d(85px, 0, 0); } }\n\n@keyframes move-forever {\n  0% {\n    transform: translate3d(-90px, 0, 0); }\n  100% {\n    transform: translate3d(85px, 0, 0); } }\n\n/*Shrinking for mobile*/\n@media (max-width: 767.98px) {\n  .waves {\n    height: 40px;\n    min-height: 40px; }\n  hr.horizontal {\n    background-color: transparent; }\n    hr.horizontal:not(.dark) {\n      background-image: linear-gradient(to right, rgba(255, 255, 255, 0), white, rgba(255, 255, 255, 0)); }\n    hr.horizontal.vertical {\n      transform: rotate(90deg); }\n    hr.horizontal.dark {\n      background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)); } }\n\n.overflow-visible {\n  overflow: visible !important; }\n\n.popover .popover-header {\n  font-weight: 600; }\n\n.bg-cover {\n  background-size: cover; }\n\n.mask {\n  position: absolute;\n  background-size: cover;\n  background-position: center center;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 0.8; }\n\n.cursor-pointer {\n  cursor: pointer; }\n\n.transform-translate-50 {\n  transform: translate(0, -50%); }\n\n@media (min-width: 992px) {\n  .virtual-reality .sidenav {\n    margin-top: 2rem;\n    -webkit-animation-name: fadeInBottom;\n            animation-name: fadeInBottom;\n    -webkit-animation-fill-mode: both;\n            animation-fill-mode: both;\n    -webkit-animation-duration: 1.5s;\n            animation-duration: 1.5s;\n    transform: scale(0.6);\n    left: 18% !important;\n    position: absolute; } }\n\n.choices .choices__list {\n  background: no-repeat bottom, 50% calc(100% - 1px);\n  background-size: 0 100%, 100% 100%;\n  transition: 0.2s ease; }\n  .choices .choices__list.choices__list--single .choices__item--selectable {\n    margin-bottom: 0.5rem; }\n  .choices .choices__list.choices__list--single, .choices .choices__list.choices__list--single:focus {\n    background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0); }\n  .choices .choices__list.choices__list--dropdown {\n    background: #fff; }\n\n.choices.is-focused .choices__list {\n  background-size: 100% 100%, 100% 100%; }\n\n.border-right-after:after {\n  content: \"\";\n  position: absolute;\n  right: 0;\n  top: 3vh;\n  height: 70%;\n  width: 50%;\n  border-right: 1px solid #dee2e6; }\n\n.navbar {\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.16); }\n  .navbar .navbar-brand {\n    color: #344767;\n    font-size: 0.875rem; }\n  .navbar .nav-link {\n    color: #344767;\n    padding: 0.5rem 1rem;\n    font-weight: 400;\n    font-size: 0.875rem; }\n  .navbar.navbar-absolute {\n    position: absolute;\n    width: 100%;\n    z-index: 1; }\n  .navbar.navbar-transparent .nav-link, .navbar.navbar-transparent .nav-link i {\n    color: #fff; }\n  .navbar.navbar-transparent .nav-link:hover, .navbar.navbar-transparent .nav-link:focus {\n    color: rgba(255, 255, 255, 0.75); }\n  .navbar.navbar-transparent .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar {\n    background: #fff; }\n  .navbar.navbar-transparent .navbar-collapse {\n    border-radius: 0.75rem; }\n  .navbar.navbar-dark .navbar-collapse.show .dropdown-header.text-dark,\n  .navbar.navbar-dark .navbar-collapse.collapsing .dropdown-header.text-dark {\n    color: #fff !important; }\n  .navbar .sidenav-toggler-inner {\n    width: 18px; }\n    .navbar .sidenav-toggler-inner .sidenav-toggler-line {\n      transition: all 0.15s ease;\n      background: #7b809a;\n      border-radius: 0.1rem;\n      position: relative;\n      display: block;\n      height: 2px; }\n      .navbar .sidenav-toggler-inner .sidenav-toggler-line:not(:last-child) {\n        margin-bottom: 3px; }\n  .g-sidenav-show.g-sidenav-pinned .navbar .sidenav-toggler-inner .sidenav-toggler-line:first-child,\n  .g-sidenav-show.g-sidenav-pinned .navbar .sidenav-toggler-inner .sidenav-toggler-line:last-child {\n    width: 13px;\n    transform: translateX(5px); }\n\n.navbar-light {\n  background-color: #fff !important; }\n  .navbar-light .navbar-toggler {\n    border: none; }\n    .navbar-light .navbar-toggler:focus {\n      box-shadow: none; }\n\n.navbar-toggler .navbar-toggler-icon {\n  background-image: none; }\n  .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar {\n    display: block;\n    position: relative;\n    width: 22px;\n    height: 1px;\n    border-radius: 1px;\n    background: #6c757d;\n    transition: all 0.2s;\n    margin: 0 auto; }\n    .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar.bar2, .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar.bar3 {\n      margin-top: 7px; }\n\n.navbar-toggler[aria-expanded=\"true\"] .navbar-toggler-bar.bar1 {\n  transform: rotate(45deg);\n  transform-origin: 10% 10%;\n  margin-top: 4px; }\n\n.navbar-toggler[aria-expanded=\"true\"] .navbar-toggler-bar.bar2 {\n  opacity: 0; }\n\n.navbar-toggler[aria-expanded=\"true\"] .navbar-toggler-bar.bar3 {\n  transform: rotate(-45deg);\n  transform-origin: 10% 90%;\n  margin-top: 3px; }\n\n@media (max-width: 991.98px) {\n  .navbar.navbar-transparent .navbar-collapse {\n    padding-top: 0.5rem;\n    padding-bottom: 0.5rem;\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }\n  .navbar.navbar-transparent .navbar-collapse.collapsing {\n    background: #fff; }\n  .navbar.navbar-transparent .navbar-collapse.show {\n    background: #fff; }\n    .navbar.navbar-transparent .navbar-collapse.show .nav-link,\n    .navbar.navbar-transparent .navbar-collapse.show i {\n      color: #344767; }\n  .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-collapse {\n    display: flex !important;\n    flex-basis: auto; }\n  .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-nav {\n    flex-direction: row; }\n  .navbar .navbar-collapse .navbar-nav .dropdown .dropdown-menu {\n    box-shadow: none !important; }\n    .navbar .navbar-collapse .navbar-nav .dropdown .dropdown-menu:before {\n      display: none !important; } }\n\n@media (max-width: 767.98px) {\n  .navbar-collapse {\n    position: relative; }\n    .navbar-collapse .navbar-nav {\n      width: 100%; }\n      .navbar-collapse .navbar-nav .nav-item.dropdown {\n        position: static; }\n        .navbar-collapse .navbar-nav .nav-item.dropdown .dropdown-menu {\n          left: 0;\n          right: 0; }\n          .navbar-collapse .navbar-nav .nav-item.dropdown .dropdown-menu.show:before {\n            content: none; } }\n\n@media (max-width: 575.98px) {\n  .navbar-nav .nav-item.dropdown .dropdown-menu {\n    left: 0;\n    right: auto; } }\n\n.navbar-vertical .navbar-brand > img,\n.navbar-vertical .navbar-brand-img {\n  max-width: 100%;\n  max-height: 2rem; }\n\n.navbar-vertical .navbar-nav .nav-link {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  font-weight: 300;\n  color: #fff; }\n  .navbar-vertical .navbar-nav .nav-link > i {\n    min-width: 1.8rem;\n    font-size: 1.5rem;\n    line-height: 1.5rem;\n    text-align: center; }\n  .navbar-vertical .navbar-nav .nav-link .dropdown-menu {\n    border: none; }\n    .navbar-vertical .navbar-nav .nav-link .dropdown-menu .dropdown-menu {\n      margin-left: 0.5rem; }\n  .navbar-vertical .navbar-nav .nav-link .avatar {\n    width: 1.875rem;\n    height: 1.875rem; }\n\n.navbar-vertical .navbar-nav .nav-sm .nav-link {\n  font-size: 0.8125rem; }\n\n.navbar-vertical .navbar-nav .nav-link {\n  display: flex;\n  align-items: center;\n  white-space: nowrap; }\n\n.navbar-vertical .navbar-heading {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  font-size: 0.75rem;\n  text-transform: uppercase;\n  letter-spacing: 0.04em; }\n\n.navbar-vertical.navbar-expand-xs {\n  display: block;\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  width: 100%;\n  max-width: 15.625rem !important;\n  overflow-y: auto;\n  padding: 0;\n  box-shadow: none; }\n  .navbar-vertical.navbar-expand-xs .navbar-collapse {\n    display: block;\n    overflow: auto;\n    height: calc(100vh - 360px); }\n  .navbar-vertical.navbar-expand-xs > [class*=\"container\"] {\n    flex-direction: column;\n    align-items: stretch;\n    min-height: 100%;\n    padding-left: 0;\n    padding-right: 0; }\n    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-xs > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n  .navbar-vertical.navbar-expand-xs.fixed-start {\n    left: 0; }\n  .navbar-vertical.navbar-expand-xs.fixed-end {\n    right: 0; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link {\n    padding-top: 0.75rem;\n    padding-bottom: 0.75rem;\n    margin: 0 1rem;\n    margin-bottom: 1.5px; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link .nav-link-text,\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link .sidenav-mini-icon,\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link .sidenav-normal,\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link i {\n      pointer-events: none; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav .nav-item {\n    width: 100%; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav > .nav-item {\n    margin-top: 0.125rem; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav > .nav-item .icon .ni {\n      top: 0; }\n  .navbar-vertical.navbar-expand-xs .lavalamp-object {\n    width: calc(100% - 1rem) !important;\n    background: theme-color(\"primary\");\n    color: color-yiq(#e91e63);\n    margin-right: 0.5rem;\n    margin-left: 0.5rem;\n    padding-left: 1rem;\n    padding-right: 1rem;\n    border-radius: 0.125rem; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav .nav .nav-link {\n    padding-top: 0.75rem;\n    padding-bottom: 0.75rem;\n    padding-left: 15px; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav .nav-link > span.sidenav-normal {\n      transition: all 0.1s ease 0s; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav .nav-link.active {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem; }\n\n@media (min-width: 576px) {\n  .navbar-vertical.navbar-expand-sm {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-sm .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-sm > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 576px) and (-ms-high-contrast: none), (min-width: 576px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-sm > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 576px) {\n    .navbar-vertical.navbar-expand-sm.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-sm.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-sm .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 768px) {\n  .navbar-vertical.navbar-expand-md {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-md .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-md > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 768px) and (-ms-high-contrast: none), (min-width: 768px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-md > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 768px) {\n    .navbar-vertical.navbar-expand-md.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-md.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-md .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-md .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-md .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-md .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-md .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 992px) {\n  .navbar-vertical.navbar-expand-lg {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-lg .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-lg > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 992px) and (-ms-high-contrast: none), (min-width: 992px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-lg > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 992px) {\n    .navbar-vertical.navbar-expand-lg.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-lg.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-lg .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 1200px) {\n  .navbar-vertical.navbar-expand-xl {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-xl .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-xl > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 1200px) and (-ms-high-contrast: none), (min-width: 1200px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-xl > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 1200px) {\n    .navbar-vertical.navbar-expand-xl.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-xl.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-xl .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 1400px) {\n  .navbar-vertical.navbar-expand-xxl {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-xxl .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-xxl > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 1400px) and (-ms-high-contrast: none), (min-width: 1400px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-xxl > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 1400px) {\n    .navbar-vertical.navbar-expand-xxl.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-xxl.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-xxl .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #7b809a 0%, #7b809a 100%); }\n\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #7b809a 0%, #7b809a 100%); }\n\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #4CAF50 0%, #4CAF50 100%); }\n\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #4CAF50 0%, #4CAF50 100%); }\n\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #1A73E8 0%, #1A73E8 100%); }\n\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #1A73E8 0%, #1A73E8 100%); }\n\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #fb8c00 0%, #fb8c00 100%); }\n\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #fb8c00 0%, #fb8c00 100%); }\n\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #F44335 0%, #F44335 100%); }\n\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #F44335 0%, #F44335 100%); }\n\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #f0f2f5 0%, #f0f2f5 100%); }\n\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #f0f2f5 0%, #f0f2f5 100%); }\n\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #344767 0%, #344767 100%); }\n\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #344767 0%, #344767 100%); }\n\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #fff 0%, #fff 100%); }\n\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #fff 0%, #fff 100%); }\n\n.main-content,\n.sidenav {\n  transition: all 0.2s ease-in-out; }\n\n.sidenav {\n  z-index: 999; }\n  .sidenav .navbar-brand,\n  .sidenav .navbar-heading {\n    display: block; }\n  @media (min-width: 1200px) {\n    .sidenav:hover {\n      max-width: 15.625rem; }\n    .sidenav .sidenav-toggler {\n      padding: 1.5rem; }\n    .sidenav.fixed-start + .main-content {\n      margin-left: 17.125rem; }\n    .sidenav.fixed-end + .main-content {\n      margin-right: 17.125rem; } }\n  .sidenav .navbar-heading .docs-mini {\n    padding-left: 3px; }\n  .sidenav .navbar-heading {\n    transition: all 0.1s ease; }\n  .sidenav .navbar-brand {\n    padding: 1.5rem 2rem; }\n  .sidenav .collapse .nav-item .nav-link.active {\n    color: #fff !important; }\n    .sidenav .collapse .nav-item .nav-link.active i {\n      color: #fff !important; }\n\n.sidenav-header {\n  height: 4.875rem; }\n\n.sidenav-footer .card.card-background:after {\n  opacity: 0.65; }\n\n.g-sidenav-show .sidenav .nav-item .collapse {\n  height: auto;\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .g-sidenav-show .sidenav .nav-item .collapse {\n      transition: none; } }\n\n.g-sidenav-show .sidenav .nav-link-text {\n  transition: 0.3s ease;\n  opacity: 1; }\n\n.g-sidenav-show.rtl .navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"]:after {\n  margin-left: 0; }\n\n@media (max-width: 1199.98px) {\n  .g-sidenav-show.rtl .sidenav {\n    transform: translateX(17.125rem); }\n  .g-sidenav-show:not(.rtl) .sidenav {\n    transform: translateX(-17.125rem); }\n  .g-sidenav-show .sidenav.fixed-start + .main-content {\n    margin-left: 0 !important; }\n  .g-sidenav-show.g-sidenav-pinned .sidenav {\n    transform: translateX(0); } }\n\n.navbar-vertical.bg-white {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }\n  .navbar-vertical.bg-white .navbar-nav .nav-link.active {\n    box-shadow: none; }\n\n.navbar-vertical.bg-transparent .navbar-nav .nav-link.active:after, .navbar-vertical.bg-white .navbar-nav .nav-link.active:after {\n  color: rgba(206, 212, 218, 0.7) !important; }\n\n.navbar-vertical .navbar-nav .nav-link.active {\n  font-weight: 400;\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  border-radius: 0.375rem;\n  margin-top: 1.5px;\n  margin-bottom: 1.5px; }\n\n.navbar-vertical .navbar-nav > .nav-item .nav-link.active {\n  color: #fff;\n  border-right-width: 0;\n  border-bottom-width: 0;\n  background-color: rgba(199, 199, 199, 0.2); }\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n    background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active span,\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active span {\n      color: #fff; }\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n    background-color: rgba(199, 199, 199, 0.2); }\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n      background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n\n.navbar-main {\n  transition: box-shadow 0.25s ease-in, background-color 0.25s ease-in; }\n  .navbar-main.fixed-top {\n    width: calc(100% - (15.625rem + 1.5rem * 3)); }\n  .navbar-main.fixed-top + [class*=\"container\"] {\n    margin-top: 7.1875rem !important; }\n\n.navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"]:after {\n  display: inline-block;\n  font-style: normal;\n  font-variant: normal;\n  text-rendering: auto;\n  -webkit-font-smoothing: antialiased;\n  font-family: 'Font Awesome 5 Free';\n  font-weight: 700;\n  content: \"\\f107\";\n  margin-left: auto;\n  color: rgba(206, 212, 218, 0.7);\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"]:after {\n      transition: none; } }\n\n.navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"][aria-expanded=\"true\"]:after {\n  color: #CED4DA;\n  transform: rotate(180deg); }\n\n.navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"].active:after {\n  color: #fff; }\n\n.navbar-vertical .navbar-nav .nav-item .collapse .nav,\n.navbar-vertical .navbar-nav .nav-item .collapsing .nav {\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .navbar-nav .nav-item .collapse .nav,\n    .navbar-vertical .navbar-nav .nav-item .collapsing .nav {\n      transition: none; } }\n  .navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item .nav-link,\n  .navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item .nav-link {\n    position: relative;\n    background-color: transparent;\n    box-shadow: none;\n    color: rgba(206, 212, 218, 0.7); }\n    .navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item .nav-link.active,\n    .navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item .nav-link.active {\n      color: #CED4DA; }\n  .navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item.active .nav-link,\n  .navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item.active .nav-link {\n    color: #CED4DA; }\n\n.navbar-vertical.blur .navbar-nav > .nav-item .nav-link {\n  background-color: transparent;\n  box-shadow: none; }\n\n.navbar-vertical .navbar-brand .navbar-brand-img,\n.navbar-vertical .navbar-brand span {\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .navbar-brand .navbar-brand-img,\n    .navbar-vertical .navbar-brand span {\n      transition: none; } }\n\n.navbar-vertical .nav-item .nav-link span.sidenav-mini-icon {\n  transition: all 0.2s ease-in-out;\n  text-align: center;\n  min-width: 1.8rem; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .nav-item .nav-link span.sidenav-mini-icon {\n      transition: none; } }\n\n.navbar-vertical .docs-info {\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .docs-info {\n      transition: none; } }\n\n.navbar-vertical .nav-item .nav-link {\n  margin-top: 3px;\n  margin-bottom: 3px;\n  border-radius: 0.375rem;\n  margin-bottom: 1.5px;\n  margin-top: 1.5px; }\n  .navbar-vertical .nav-item .nav-link + .collapse .nav .nav-item > .nav-link,\n  .navbar-vertical .nav-item .nav-link + .collapsing .nav .nav-item > .nav-link {\n    margin-top: 1.5px;\n    margin-bottom: 1.5px; }\n    .navbar-vertical .nav-item .nav-link + .collapse .nav .nav-item > .nav-link + .collapse .nav .nav-item .nav-link,\n    .navbar-vertical .nav-item .nav-link + .collapse .nav .nav-item > .nav-link + .collapsing .nav .nav-item .nav-link,\n    .navbar-vertical .nav-item .nav-link + .collapsing .nav .nav-item > .nav-link + .collapse .nav .nav-item .nav-link,\n    .navbar-vertical .nav-item .nav-link + .collapsing .nav .nav-item > .nav-link + .collapsing .nav .nav-item .nav-link {\n      margin-top: 1.5px;\n      margin-bottom: 1.5px; }\n\n.navbar-vertical .nav-item:hover .nav-link {\n  background-color: rgba(199, 199, 199, 0.2);\n  border-radius: 0.375rem; }\n  .navbar-vertical .nav-item:hover .nav-link + .collapse .nav .nav-item:hover > .nav-link {\n    background-color: rgba(199, 199, 199, 0.2);\n    border-radius: 0.375rem; }\n  .navbar-vertical .nav-item:hover .nav-link + .collapse .nav .nav-item + .collapse .nav .nav-item:hover .nav-link {\n    background-color: rgba(199, 199, 199, 0.2);\n    border-radius: 0.375rem; }\n\n@media (min-width: 1200px) {\n  .g-sidenav-hidden.rtl .main-content {\n    margin-right: 6rem !important; }\n  .g-sidenav-hidden.rtl .navbar-vertical:hover {\n    max-width: 15.625rem !important; }\n  .g-sidenav-hidden.rtl .navbar-vertical .nav-item .nav-link .material-icons-round {\n    margin-right: 2px; }\n  .g-sidenav-hidden.rtl .sidenav:hover + .main-content {\n    margin-right: 17.125rem !important; }\n  .g-sidenav-hidden .navbar-vertical {\n    max-width: 6rem !important; }\n    .g-sidenav-hidden .navbar-vertical.fixed-start + .main-content {\n      margin-left: 7.5rem; }\n    .g-sidenav-hidden .navbar-vertical .navbar-brand img {\n      width: auto !important; }\n    .g-sidenav-hidden .navbar-vertical .navbar-brand span {\n      opacity: 0; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .icon {\n      padding: 10px; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .material-icons-round {\n      margin-left: 2px; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .nav-link-text,\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .sidenav-normal {\n      opacity: 0;\n      width: 0; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .sidenav-mini-icon {\n      min-width: 1.8rem;\n      margin-left: 0.15rem !important; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link[data-bs-toggle=\"collapse\"]:after {\n      content: \"\";\n      opacity: 0; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .collapse .nav {\n      margin-left: 0 !important;\n      padding-left: 0 !important; }\n      .g-sidenav-hidden .navbar-vertical .nav-item .collapse .nav .nav-item .nav-link {\n        margin-left: 1rem; }\n        .g-sidenav-hidden .navbar-vertical .nav-item .collapse .nav .nav-item .nav-link[data-bs-toggle=\"collapse\"]:after {\n          content: \"\\f107\"; }\n    .g-sidenav-hidden .navbar-vertical .card.card-background .icon-shape {\n      margin-bottom: 0 !important; }\n    .g-sidenav-hidden .navbar-vertical .card.card-background .docs-info {\n      opacity: 0;\n      width: 0;\n      height: 0; }\n    .g-sidenav-hidden .navbar-vertical:hover {\n      max-width: 15.625rem !important; }\n      .g-sidenav-hidden .navbar-vertical:hover.fixed-start + .main-content {\n        margin-left: 17.125rem; }\n      .g-sidenav-hidden .navbar-vertical:hover .navbar-brand span {\n        opacity: 1; }\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .nav-link .nav-link-text,\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .nav-link .sidenav-normal {\n        opacity: 1;\n        width: auto; }\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .nav-link[data-bs-toggle=\"collapse\"]:after {\n        content: \"\\f107\";\n        opacity: 1; }\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .collapse .nav .nav-item .collapse .nav,\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .collapse .nav .nav-item .collapsing .nav {\n        margin-left: 0 !important;\n        padding-left: 0 !important; }\n      .g-sidenav-hidden .navbar-vertical:hover .card.card-background .icon-shape {\n        margin-bottom: 1rem !important; }\n      .g-sidenav-hidden .navbar-vertical:hover .card.card-background .docs-info {\n        opacity: 1;\n        width: auto;\n        height: auto; } }\n\n.nav.nav-pills {\n  background: #f8f9fa;\n  border-radius: 0.75rem;\n  position: relative; }\n  .nav.nav-pills.nav-pills-vertical {\n    border-radius: 1.1875rem; }\n    .nav.nav-pills.nav-pills-vertical .nav-link.active {\n      border-radius: 0.875rem; }\n  .nav.nav-pills .nav-link {\n    z-index: 3;\n    color: #344767;\n    border-radius: 0.5rem;\n    background-color: inherit; }\n    .nav.nav-pills .nav-link.active {\n      -webkit-animation: 0.2s ease;\n              animation: 0.2s ease; }\n    .nav.nav-pills .nav-link:hover:not(.active) {\n      color: #344767; }\n  .nav.nav-pills.nav-pills-primary {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-primary .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-primary .moving-tab .nav-link.active {\n      background: #EC407A;\n      color: #EC407A; }\n  .nav.nav-pills.nav-pills-info {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-info .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-info .moving-tab .nav-link.active {\n      background: #49a3f1;\n      color: #49a3f1; }\n  .nav.nav-pills.nav-pills-success {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-success .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-success .moving-tab .nav-link.active {\n      background: #66BB6A;\n      color: #66BB6A; }\n  .nav.nav-pills.nav-pills-warning {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-warning .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-warning .moving-tab .nav-link.active {\n      background: #FFA726;\n      color: #FFA726; }\n  .nav.nav-pills.nav-pills-danger {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-danger .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-danger .moving-tab .nav-link.active {\n      background: #EF5350;\n      color: #EF5350; }\n  .nav.nav-pills .nav-item {\n    z-index: 3; }\n\n.moving-tab {\n  z-index: 1 !important; }\n  .moving-tab .nav-link {\n    color: #fff;\n    transition: .2s ease;\n    border-radius: 0.5rem; }\n    .moving-tab .nav-link.active {\n      color: #fff;\n      font-weight: 600;\n      box-shadow: 0px 1px 5px 1px #ddd;\n      -webkit-animation: 0.2s ease;\n              animation: 0.2s ease;\n      background: #fff; }\n    .moving-tab .nav-link:hover:not(.active) {\n      color: #344767; }\n\n.page-item.active .page-link {\n  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07); }\n\n.page-item .page-link,\n.page-item span {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #7b809a;\n  padding: 0;\n  margin: 0 3px;\n  border-radius: 50% !important;\n  width: 36px;\n  height: 36px;\n  font-size: 0.875rem; }\n\n.pagination-lg .page-item .page-link,\n.pagination-lg .page-item span {\n  width: 46px;\n  height: 46px;\n  line-height: 46px; }\n\n.pagination-sm .page-item .page-link,\n.pagination-sm .page-item span {\n  width: 30px;\n  height: 30px;\n  line-height: 30px; }\n\n.pagination.pagination-primary .page-item.active > .page-link, .pagination.pagination-primary .page-item.active > .page-link:focus, .pagination.pagination-primary .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%);\n  border: none; }\n\n.pagination.pagination-secondary .page-item.active > .page-link, .pagination.pagination-secondary .page-item.active > .page-link:focus, .pagination.pagination-secondary .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%);\n  border: none; }\n\n.pagination.pagination-success .page-item.active > .page-link, .pagination.pagination-success .page-item.active > .page-link:focus, .pagination.pagination-success .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%);\n  border: none; }\n\n.pagination.pagination-info .page-item.active > .page-link, .pagination.pagination-info .page-item.active > .page-link:focus, .pagination.pagination-info .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%);\n  border: none; }\n\n.pagination.pagination-warning .page-item.active > .page-link, .pagination.pagination-warning .page-item.active > .page-link:focus, .pagination.pagination-warning .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%);\n  border: none; }\n\n.pagination.pagination-danger .page-item.active > .page-link, .pagination.pagination-danger .page-item.active > .page-link:focus, .pagination.pagination-danger .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%);\n  border: none; }\n\n.pagination.pagination-light .page-item.active > .page-link, .pagination.pagination-light .page-item.active > .page-link:focus, .pagination.pagination-light .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%);\n  border: none; }\n\n.pagination.pagination-dark .page-item.active > .page-link, .pagination.pagination-dark .page-item.active > .page-link:focus, .pagination.pagination-dark .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #42424a 0%, #191919 100%);\n  border: none; }\n\n.popover {\n  box-shadow: 0 0.3125rem 0.625rem 0 rgba(0, 0, 0, 0.12); }\n\n.popover .popover-header {\n  font-weight: 600; }\n\n.progress-bar {\n  height: 6px;\n  border-radius: 0.125rem; }\n\n.progress {\n  overflow: visible; }\n  .progress.progress-sm {\n    height: 4px; }\n  .progress.progress-lg {\n    height: 20px; }\n\n.rtl .breadcrumb .breadcrumb-item + .breadcrumb-item::before {\n  float: right;\n  padding-left: 0.5rem;\n  padding-right: 0; }\n\n.rtl .sidenav .navbar-nav {\n  width: 100%;\n  padding-right: 0; }\n\n.rtl .fixed-plugin .fixed-plugin-button {\n  left: 30px;\n  right: auto; }\n\n.rtl .fixed-plugin .card {\n  left: -360px !important;\n  right: auto; }\n\n.rtl .fixed-plugin.show .card {\n  right: auto;\n  left: 0 !important; }\n\n.rtl .timeline .timeline-content {\n  margin-right: 45px;\n  margin-left: 0; }\n\n.rtl .timeline .timeline-step {\n  transform: translateX(50%); }\n\n.rtl .timeline.timeline-one-side:before {\n  right: 1rem; }\n\n.rtl .timeline.timeline-one-side .timeline-step {\n  right: 1rem; }\n\n.rtl .form-check.form-switch .form-check-input:after {\n  transform: translateX(-1px); }\n\n.rtl .form-check.form-switch .form-check-input:checked:after {\n  transform: translateX(21px); }\n\n.rtl .avatar-group .avatar + .avatar {\n  margin-left: 0;\n  margin-right: -1rem; }\n\n.rtl .dropdown .dropdown-menu {\n  left: 0; }\n\n.rtl .input-group .input-group-text {\n  border-left: 0;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.rtl .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {\n  margin-right: -1px;\n  border-top-left-radius: 0.375rem;\n  border-bottom-left-radius: 0.375rem; }\n\n.rtl .input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3),\n.rtl .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {\n  border-top-right-radius: 0.375rem;\n  border-bottom-right-radius: 0.375rem; }\n\n.ripple {\n  display: block;\n  position: absolute;\n  background: rgba(255, 255, 255, 0.3);\n  border-radius: 100%;\n  transform: scale(0);\n  -webkit-animation: ripple 0.65s linear;\n          animation: ripple 0.65s linear; }\n\n@-webkit-keyframes ripple {\n  100% {\n    opacity: 0;\n    transform: scale(2.5); } }\n\n@keyframes ripple {\n  100% {\n    opacity: 0;\n    transform: scale(2.5); } }\n\n.btn.btn-facebook {\n  background-color: #3b5998;\n  color: #fff; }\n  .btn.btn-facebook:focus, .btn.btn-facebook:hover {\n    background-color: #344e86;\n    color: #fff; }\n  .btn.btn-facebook:active, .btn.btn-facebook:focus, .btn.btn-facebook:active:focus {\n    box-shadow: none; }\n  .btn.btn-facebook.btn-simple {\n    color: #344e86;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-facebook.btn-simple:hover, .btn.btn-facebook.btn-simple:focus, .btn.btn-facebook.btn-simple:hover:focus, .btn.btn-facebook.btn-simple:active, .btn.btn-facebook.btn-simple:hover:focus:active {\n      color: #344e86;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-facebook.btn-neutral {\n    color: #3b5998;\n    background-color: #fff; }\n    .btn.btn-facebook.btn-neutral:hover, .btn.btn-facebook.btn-neutral:focus, .btn.btn-facebook.btn-neutral:active {\n      color: #344e86; }\n\n.btn.btn-twitter {\n  background-color: #55acee;\n  color: #fff; }\n  .btn.btn-twitter:focus, .btn.btn-twitter:hover {\n    background-color: #3ea1ec;\n    color: #fff; }\n  .btn.btn-twitter:active, .btn.btn-twitter:focus, .btn.btn-twitter:active:focus {\n    box-shadow: none; }\n  .btn.btn-twitter.btn-simple {\n    color: #3ea1ec;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-twitter.btn-simple:hover, .btn.btn-twitter.btn-simple:focus, .btn.btn-twitter.btn-simple:hover:focus, .btn.btn-twitter.btn-simple:active, .btn.btn-twitter.btn-simple:hover:focus:active {\n      color: #3ea1ec;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-twitter.btn-neutral {\n    color: #55acee;\n    background-color: #fff; }\n    .btn.btn-twitter.btn-neutral:hover, .btn.btn-twitter.btn-neutral:focus, .btn.btn-twitter.btn-neutral:active {\n      color: #3ea1ec; }\n\n.btn.btn-pinterest {\n  background-color: #cc2127;\n  color: #fff; }\n  .btn.btn-pinterest:focus, .btn.btn-pinterest:hover {\n    background-color: #b21d22;\n    color: #fff; }\n  .btn.btn-pinterest:active, .btn.btn-pinterest:focus, .btn.btn-pinterest:active:focus {\n    box-shadow: none; }\n  .btn.btn-pinterest.btn-simple {\n    color: #b21d22;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-pinterest.btn-simple:hover, .btn.btn-pinterest.btn-simple:focus, .btn.btn-pinterest.btn-simple:hover:focus, .btn.btn-pinterest.btn-simple:active, .btn.btn-pinterest.btn-simple:hover:focus:active {\n      color: #b21d22;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-pinterest.btn-neutral {\n    color: #cc2127;\n    background-color: #fff; }\n    .btn.btn-pinterest.btn-neutral:hover, .btn.btn-pinterest.btn-neutral:focus, .btn.btn-pinterest.btn-neutral:active {\n      color: #b21d22; }\n\n.btn.btn-linkedin {\n  background-color: #0077B5;\n  color: #fff; }\n  .btn.btn-linkedin:focus, .btn.btn-linkedin:hover {\n    background-color: #00669c;\n    color: #fff; }\n  .btn.btn-linkedin:active, .btn.btn-linkedin:focus, .btn.btn-linkedin:active:focus {\n    box-shadow: none; }\n  .btn.btn-linkedin.btn-simple {\n    color: #00669c;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-linkedin.btn-simple:hover, .btn.btn-linkedin.btn-simple:focus, .btn.btn-linkedin.btn-simple:hover:focus, .btn.btn-linkedin.btn-simple:active, .btn.btn-linkedin.btn-simple:hover:focus:active {\n      color: #00669c;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-linkedin.btn-neutral {\n    color: #0077B5;\n    background-color: #fff; }\n    .btn.btn-linkedin.btn-neutral:hover, .btn.btn-linkedin.btn-neutral:focus, .btn.btn-linkedin.btn-neutral:active {\n      color: #00669c; }\n\n.btn.btn-dribbble {\n  background-color: #ea4c89;\n  color: #fff; }\n  .btn.btn-dribbble:focus, .btn.btn-dribbble:hover {\n    background-color: #e73177;\n    color: #fff; }\n  .btn.btn-dribbble:active, .btn.btn-dribbble:focus, .btn.btn-dribbble:active:focus {\n    box-shadow: none; }\n  .btn.btn-dribbble.btn-simple {\n    color: #e73177;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-dribbble.btn-simple:hover, .btn.btn-dribbble.btn-simple:focus, .btn.btn-dribbble.btn-simple:hover:focus, .btn.btn-dribbble.btn-simple:active, .btn.btn-dribbble.btn-simple:hover:focus:active {\n      color: #e73177;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-dribbble.btn-neutral {\n    color: #ea4c89;\n    background-color: #fff; }\n    .btn.btn-dribbble.btn-neutral:hover, .btn.btn-dribbble.btn-neutral:focus, .btn.btn-dribbble.btn-neutral:active {\n      color: #e73177; }\n\n.btn.btn-github {\n  background-color: #24292E;\n  color: #fff; }\n  .btn.btn-github:focus, .btn.btn-github:hover {\n    background-color: #171a1d;\n    color: #fff; }\n  .btn.btn-github:active, .btn.btn-github:focus, .btn.btn-github:active:focus {\n    box-shadow: none; }\n  .btn.btn-github.btn-simple {\n    color: #171a1d;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-github.btn-simple:hover, .btn.btn-github.btn-simple:focus, .btn.btn-github.btn-simple:hover:focus, .btn.btn-github.btn-simple:active, .btn.btn-github.btn-simple:hover:focus:active {\n      color: #171a1d;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-github.btn-neutral {\n    color: #24292E;\n    background-color: #fff; }\n    .btn.btn-github.btn-neutral:hover, .btn.btn-github.btn-neutral:focus, .btn.btn-github.btn-neutral:active {\n      color: #171a1d; }\n\n.btn.btn-youtube {\n  background-color: #e52d27;\n  color: #fff; }\n  .btn.btn-youtube:focus, .btn.btn-youtube:hover {\n    background-color: #d41f1a;\n    color: #fff; }\n  .btn.btn-youtube:active, .btn.btn-youtube:focus, .btn.btn-youtube:active:focus {\n    box-shadow: none; }\n  .btn.btn-youtube.btn-simple {\n    color: #d41f1a;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-youtube.btn-simple:hover, .btn.btn-youtube.btn-simple:focus, .btn.btn-youtube.btn-simple:hover:focus, .btn.btn-youtube.btn-simple:active, .btn.btn-youtube.btn-simple:hover:focus:active {\n      color: #d41f1a;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-youtube.btn-neutral {\n    color: #e52d27;\n    background-color: #fff; }\n    .btn.btn-youtube.btn-neutral:hover, .btn.btn-youtube.btn-neutral:focus, .btn.btn-youtube.btn-neutral:active {\n      color: #d41f1a; }\n\n.btn.btn-instagram {\n  background-color: #125688;\n  color: #fff; }\n  .btn.btn-instagram:focus, .btn.btn-instagram:hover {\n    background-color: #0e456d;\n    color: #fff; }\n  .btn.btn-instagram:active, .btn.btn-instagram:focus, .btn.btn-instagram:active:focus {\n    box-shadow: none; }\n  .btn.btn-instagram.btn-simple {\n    color: #0e456d;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-instagram.btn-simple:hover, .btn.btn-instagram.btn-simple:focus, .btn.btn-instagram.btn-simple:hover:focus, .btn.btn-instagram.btn-simple:active, .btn.btn-instagram.btn-simple:hover:focus:active {\n      color: #0e456d;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-instagram.btn-neutral {\n    color: #125688;\n    background-color: #fff; }\n    .btn.btn-instagram.btn-neutral:hover, .btn.btn-instagram.btn-neutral:focus, .btn.btn-instagram.btn-neutral:active {\n      color: #0e456d; }\n\n.btn.btn-reddit {\n  background-color: #ff4500;\n  color: #fff; }\n  .btn.btn-reddit:focus, .btn.btn-reddit:hover {\n    background-color: #e03d00;\n    color: #fff; }\n  .btn.btn-reddit:active, .btn.btn-reddit:focus, .btn.btn-reddit:active:focus {\n    box-shadow: none; }\n  .btn.btn-reddit.btn-simple {\n    color: #e03d00;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-reddit.btn-simple:hover, .btn.btn-reddit.btn-simple:focus, .btn.btn-reddit.btn-simple:hover:focus, .btn.btn-reddit.btn-simple:active, .btn.btn-reddit.btn-simple:hover:focus:active {\n      color: #e03d00;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-reddit.btn-neutral {\n    color: #ff4500;\n    background-color: #fff; }\n    .btn.btn-reddit.btn-neutral:hover, .btn.btn-reddit.btn-neutral:focus, .btn.btn-reddit.btn-neutral:active {\n      color: #e03d00; }\n\n.btn.btn-tumblr {\n  background-color: #35465c;\n  color: #fff; }\n  .btn.btn-tumblr:focus, .btn.btn-tumblr:hover {\n    background-color: #2a3749;\n    color: #fff; }\n  .btn.btn-tumblr:active, .btn.btn-tumblr:focus, .btn.btn-tumblr:active:focus {\n    box-shadow: none; }\n  .btn.btn-tumblr.btn-simple {\n    color: #2a3749;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-tumblr.btn-simple:hover, .btn.btn-tumblr.btn-simple:focus, .btn.btn-tumblr.btn-simple:hover:focus, .btn.btn-tumblr.btn-simple:active, .btn.btn-tumblr.btn-simple:hover:focus:active {\n      color: #2a3749;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-tumblr.btn-neutral {\n    color: #35465c;\n    background-color: #fff; }\n    .btn.btn-tumblr.btn-neutral:hover, .btn.btn-tumblr.btn-neutral:focus, .btn.btn-tumblr.btn-neutral:active {\n      color: #2a3749; }\n\n.btn.btn-behance {\n  background-color: #1769ff;\n  color: #fff; }\n  .btn.btn-behance:focus, .btn.btn-behance:hover {\n    background-color: #0057f7;\n    color: #fff; }\n  .btn.btn-behance:active, .btn.btn-behance:focus, .btn.btn-behance:active:focus {\n    box-shadow: none; }\n  .btn.btn-behance.btn-simple {\n    color: #0057f7;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-behance.btn-simple:hover, .btn.btn-behance.btn-simple:focus, .btn.btn-behance.btn-simple:hover:focus, .btn.btn-behance.btn-simple:active, .btn.btn-behance.btn-simple:hover:focus:active {\n      color: #0057f7;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-behance.btn-neutral {\n    color: #1769ff;\n    background-color: #fff; }\n    .btn.btn-behance.btn-neutral:hover, .btn.btn-behance.btn-neutral:focus, .btn.btn-behance.btn-neutral:active {\n      color: #0057f7; }\n\n.btn.btn-vimeo {\n  background-color: #1AB7EA;\n  color: #fff; }\n  .btn.btn-vimeo:focus, .btn.btn-vimeo:hover {\n    background-color: #13a3d2;\n    color: #fff; }\n  .btn.btn-vimeo:active, .btn.btn-vimeo:focus, .btn.btn-vimeo:active:focus {\n    box-shadow: none; }\n  .btn.btn-vimeo.btn-simple {\n    color: #13a3d2;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-vimeo.btn-simple:hover, .btn.btn-vimeo.btn-simple:focus, .btn.btn-vimeo.btn-simple:hover:focus, .btn.btn-vimeo.btn-simple:active, .btn.btn-vimeo.btn-simple:hover:focus:active {\n      color: #13a3d2;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-vimeo.btn-neutral {\n    color: #1AB7EA;\n    background-color: #fff; }\n    .btn.btn-vimeo.btn-neutral:hover, .btn.btn-vimeo.btn-neutral:focus, .btn.btn-vimeo.btn-neutral:active {\n      color: #13a3d2; }\n\n.btn.btn-slack {\n  background-color: #3aaf85;\n  color: #fff; }\n  .btn.btn-slack:focus, .btn.btn-slack:hover {\n    background-color: #329874;\n    color: #fff; }\n  .btn.btn-slack:active, .btn.btn-slack:focus, .btn.btn-slack:active:focus {\n    box-shadow: none; }\n  .btn.btn-slack.btn-simple {\n    color: #329874;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-slack.btn-simple:hover, .btn.btn-slack.btn-simple:focus, .btn.btn-slack.btn-simple:hover:focus, .btn.btn-slack.btn-simple:active, .btn.btn-slack.btn-simple:hover:focus:active {\n      color: #329874;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-slack.btn-neutral {\n    color: #3aaf85;\n    background-color: #fff; }\n    .btn.btn-slack.btn-neutral:hover, .btn.btn-slack.btn-neutral:focus, .btn.btn-slack.btn-neutral:active {\n      color: #329874; }\n\n.table thead th {\n  padding: 0.75rem 1.5rem;\n  text-transform: capitalize;\n  letter-spacing: 0px;\n  border-bottom: 1px solid #f0f2f5; }\n\n.table th {\n  font-weight: 600; }\n\n.table td .progress {\n  height: 3px;\n  width: 120px;\n  margin: 0; }\n  .table td .progress .progress-bar {\n    height: 3px; }\n\n.table td,\n.table th {\n  white-space: nowrap; }\n\n.table.align-items-center td,\n.table.align-items-center th {\n  vertical-align: middle; }\n\n.table tbody tr:last-child td {\n  border-width: 0; }\n\n.table > :not(:last-child) > :last-child > * {\n  border-bottom-color: #f0f2f5; }\n\n.table > :not(:first-child) {\n  border-top: 1px solid currentColor; }\n\n.timeline {\n  position: relative; }\n  .timeline:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 1rem;\n    height: 100%;\n    border-right: 2px solid #e5e5e5; }\n  .timeline.timeline-dark:before {\n    border-right-color: #4a4a4a; }\n\n.timeline-block {\n  position: relative; }\n  .timeline-block:after {\n    content: \"\";\n    display: table;\n    clear: both; }\n  .timeline-block:first-child {\n    margin-top: 0; }\n  .timeline-block:last-child {\n    margin-bottom: 0; }\n\n.timeline-step {\n  position: absolute;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  left: 0;\n  width: 26px;\n  height: 26px;\n  border-radius: 50%;\n  background: #fff;\n  text-align: center;\n  transform: translateX(-50%);\n  font-size: 1rem;\n  font-weight: 600;\n  z-index: 1; }\n  .timeline-step svg, .timeline-step i {\n    line-height: 1.4; }\n\n.timeline-content {\n  position: relative;\n  margin-left: 45px;\n  padding-top: 0.35rem;\n  position: relative;\n  top: -6px; }\n  .timeline-content:after {\n    content: \"\";\n    display: table;\n    clear: both; }\n\n@media (min-width: 992px) {\n  .timeline:before {\n    left: 50%;\n    margin-left: -1px; }\n  .timeline-step {\n    left: 50%; }\n  .timeline-content {\n    width: 38%; }\n  .timeline-block:nth-child(even) .timeline-content {\n    float: right; } }\n\n.timeline-one-side:before {\n  left: 1rem; }\n\n.timeline-one-side .timeline-step {\n  left: 1rem; }\n\n.timeline-one-side .timeline-content {\n  width: auto; }\n\n@media (min-width: 992px) {\n  .timeline-one-side .timeline-content {\n    max-width: 30rem; } }\n\n.timeline-one-side .timeline-block:nth-child(even) .timeline-content {\n  float: none; }\n\n.tilt {\n  transform-style: preserve-3d; }\n  .tilt .up {\n    transform: translateZ(50px) scale(0.7) !important;\n    transition: all 0.5s; }\n\n.bs-tooltip-auto[x-placement^=right] .tooltip-arrow,\n.bs-tooltip-right .tooltip-arrow {\n  left: 1px; }\n\n.bs-tooltip-auto[x-placement^=left] .tooltip-arrow,\n.bs-tooltip-left .tooltip-arrow {\n  right: 1px; }\n\nhtml * {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale; }\n\nbody {\n  font-weight: 400;\n  line-height: 1.6; }\n\nh1, .h1, .h1 {\n  font-size: 3rem;\n  line-height: 1.25;\n  letter-spacing: 0; }\n  @media (max-width: 575.98px) {\n    h1, .h1, .h1 {\n      font-size: calc(1.425rem + 2.1vw); } }\n\nh2, .h2, .h2 {\n  font-size: 2.25rem;\n  line-height: 1.3;\n  letter-spacing: 0.05rem; }\n  @media (max-width: 575.98px) {\n    h2, .h2, .h2 {\n      font-size: calc(1.35rem + 1.2vw); } }\n\nh3, .h3, .h3 {\n  font-size: 1.875rem;\n  line-height: 1.375; }\n  @media (max-width: 575.98px) {\n    h3, .h3, .h3 {\n      font-size: calc(1.3125rem + 0.75vw); } }\n\nh4, .h4, .h4 {\n  font-size: 1.5rem;\n  line-height: 1.375; }\n  @media (max-width: 575.98px) {\n    h4, .h4, .h4 {\n      font-size: calc(1.275rem + 0.3vw); } }\n\nh5, .h5, .h5 {\n  font-size: 1.25rem;\n  line-height: 1.375; }\n  @media (max-width: 575.98px) {\n    h5, .h5, .h5 {\n      font-size: 1.25rem; } }\n\nh6, .h6, .h6 {\n  font-size: 1rem;\n  line-height: 1.625; }\n\np, .p {\n  font-size: 1rem;\n  font-weight: 400;\n  line-height: 1.6; }\n\n.lead {\n  font-size: 1.25rem;\n  font-weight: 400;\n  line-height: 1.625; }\n\nh1, .h1, .h1, h2, .h2, .h2, h3, .h3, .h3 {\n  font-weight: 600;\n  font-family: \"Roboto Slab\", sans-serif; }\n\nh4, .h4, .h4, h5, .h5, .h5, h6, .h6, .h6 {\n  font-weight: 600; }\n\nh1, .h1, .h1, h2, .h2, .h2, h3, .h3, .h3, h4, .h4, .h4 {\n  letter-spacing: -0.05rem; }\n\na {\n  letter-spacing: 0rem;\n  color: #344767; }\n\n.text-sm {\n  line-height: 1.5; }\n\n.text-xs {\n  line-height: 1.25; }\n\np, .p {\n  font-size: 1rem; }\n\n.lead {\n  font-size: 1.25rem; }\n\n.text-lg {\n  font-size: 1.125rem !important; }\n\n.text-md {\n  font-size: 1rem !important; }\n\n.text-sm {\n  font-size: 0.875rem !important; }\n\n.text-xs {\n  font-size: 0.75rem !important; }\n\n.text-xxs {\n  font-size: 0.65rem !important; }\n\np {\n  line-height: 1.625;\n  font-weight: 300; }\n\n.text-sans-serif {\n  font-family: \"Roboto\", Helvetica, Arial, sans-serif !important; }\n\n.text-monospace {\n  font-family: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !important; }\n\n.text-justify {\n  text-align: justify !important; }\n\n.text-wrap {\n  white-space: normal !important; }\n\n.text-nowrap {\n  white-space: nowrap !important; }\n\n.text-truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap; }\n\n.font-weight-light {\n  font-weight: 300 !important; }\n\n.font-weight-lighter {\n  font-weight: lighter !important; }\n\n.font-weight-normal {\n  font-weight: 400 !important; }\n\n.font-weight-bold {\n  font-weight: 600 !important; }\n\n.font-weight-bolder {\n  font-weight: 700 !important; }\n\n.font-italic {\n  font-style: italic !important; }\n\n.text-gradient {\n  background-clip: text;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  position: relative;\n  z-index: 1; }\n  .text-gradient.text-primary {\n    background-image: linear-gradient(195deg, #EC407A, #D81B60); }\n  .text-gradient.text-info {\n    background-image: linear-gradient(195deg, #49a3f1, #1A73E8); }\n  .text-gradient.text-success {\n    background-image: linear-gradient(195deg, #66BB6A, #43A047); }\n  .text-gradient.text-warning {\n    background-image: linear-gradient(195deg, #FFA726, #FB8C00); }\n  .text-gradient.text-danger {\n    background-image: linear-gradient(195deg, #EF5350, #E53935); }\n  .text-gradient.text-dark {\n    background-image: linear-gradient(195deg, #42424a, #191919); }\n\n.blockquote {\n  border-left: 3px solid #6c757d; }\n  .blockquote > span {\n    font-style: italic; }\n\n.text-muted {\n  color: #7b809a !important; }\n\n.text-black-50 {\n  color: rgba(0, 0, 0, 0.5) !important; }\n\n.text-white-50 {\n  color: rgba(255, 255, 255, 0.5) !important; }\n\n.text-decoration-none {\n  text-decoration: none !important; }\n\n.text-break {\n  word-wrap: break-word !important; }\n\n.text-reset {\n  color: inherit !important; }\n\n.letter-wider {\n  letter-spacing: 0.05rem; }\n\n.letter-normal {\n  letter-spacing: 0rem; }\n\n.letter-tighter {\n  letter-spacing: -0.05rem; }\n\n.text-lighter {\n  font-weight: lighter; }\n\n.text-light {\n  font-weight: 300; }\n\n.text-normal {\n  font-weight: 400; }\n\n.text-bold {\n  font-weight: 600; }\n\n.text-bolder {\n  font-weight: 700; }\n\n.text-2xl {\n  font-size: 1.5rem; }\n\n.text-3xl {\n  font-size: 1.875rem; }\n\n.text-4xl {\n  font-size: 2rem; }\n\n.text-5xl {\n  font-size: 2.25rem; }\n\n.text-6xl {\n  font-size: 3rem; }\n\n.text-7xl {\n  font-size: 3.75rem; }\n\n.text-8xl {\n  font-size: 4rem; }\n\n.text-9xl {\n  font-size: 5rem; }\n\n.flatpickr-calendar {\n  background: transparent;\n  opacity: 0;\n  display: none;\n  text-align: center;\n  visibility: hidden;\n  padding: 0;\n  -webkit-animation: none;\n  animation: none;\n  direction: ltr;\n  border: 0;\n  font-size: 14px;\n  line-height: 24px;\n  border-radius: 0.75rem;\n  position: absolute;\n  width: 307.875px;\n  box-sizing: border-box;\n  touch-action: manipulation;\n  background: #fff;\n  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  transform: scale(0.95) !important; }\n\n.flatpickr-calendar.open,\n.flatpickr-calendar.inline {\n  opacity: 1;\n  max-height: 640px;\n  visibility: visible;\n  transform: scale(1) !important; }\n\n.flatpickr-calendar.open {\n  display: inline-block;\n  z-index: 99999; }\n\n.flatpickr-calendar.animate.open {\n  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);\n  animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1); }\n\n.flatpickr-calendar.inline {\n  display: block;\n  position: relative;\n  top: 2px; }\n\n.flatpickr-calendar.static {\n  position: absolute;\n  top: calc(100% + 2px); }\n\n.flatpickr-calendar.static.open {\n  z-index: 999;\n  display: block; }\n\n.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {\n  box-shadow: none !important; }\n\n.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {\n  box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6; }\n\n.flatpickr-calendar .hasWeeks .dayContainer,\n.flatpickr-calendar .hasTime .dayContainer {\n  border-bottom: 0;\n  border-bottom-right-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.flatpickr-calendar .hasWeeks .dayContainer {\n  border-left: 0; }\n\n.flatpickr-calendar.hasTime .flatpickr-time {\n  height: 40px;\n  border-top: 1px solid #e6e6e6; }\n\n.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {\n  height: auto; }\n\n.flatpickr-calendar:before,\n.flatpickr-calendar:after {\n  position: absolute;\n  display: block;\n  pointer-events: none;\n  border: solid transparent;\n  content: '';\n  height: 0;\n  width: 0;\n  left: 22px; }\n\n.flatpickr-calendar.rightMost:before,\n.flatpickr-calendar.arrowRight:before,\n.flatpickr-calendar.rightMost:after,\n.flatpickr-calendar.arrowRight:after {\n  left: auto;\n  right: 22px; }\n\n.flatpickr-calendar.arrowCenter:before,\n.flatpickr-calendar.arrowCenter:after {\n  left: 50%;\n  right: 50%; }\n\n.flatpickr-calendar:before {\n  border-width: 5px;\n  margin: 0 -5px; }\n\n.flatpickr-calendar:after {\n  border-width: 4px;\n  margin: 0 -4px; }\n\n.flatpickr-calendar.arrowTop:before,\n.flatpickr-calendar.arrowTop:after {\n  bottom: 100%; }\n\n.flatpickr-calendar.arrowTop:before {\n  border-bottom-color: #fff; }\n\n.flatpickr-calendar.arrowTop:after {\n  border-bottom-color: #fff; }\n\n.flatpickr-calendar.arrowBottom:before,\n.flatpickr-calendar.arrowBottom:after {\n  top: 100%; }\n\n.flatpickr-calendar.arrowBottom:before {\n  border-top-color: #e6e6e6; }\n\n.flatpickr-calendar.arrowBottom:after {\n  border-top-color: #fff; }\n\n.flatpickr-calendar:focus {\n  outline: 0; }\n\n.flatpickr-wrapper {\n  position: relative;\n  display: inline-block; }\n\n.flatpickr-months {\n  display: flex; }\n\n.flatpickr-months .flatpickr-month {\n  background: transparent;\n  color: #344767;\n  fill: rgba(0, 0, 0, 0.8);\n  height: 34px;\n  line-height: 1;\n  text-align: center;\n  position: relative;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n  overflow: hidden;\n  flex: 1; }\n\n.flatpickr-months .flatpickr-prev-month,\n.flatpickr-months .flatpickr-next-month {\n  text-decoration: none;\n  cursor: pointer;\n  position: absolute;\n  top: 0;\n  height: 34px;\n  padding: 10px;\n  z-index: 3;\n  color: rgba(0, 0, 0, 0.9);\n  fill: rgba(0, 0, 0, 0.9); }\n\n.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,\n.flatpickr-months .flatpickr-next-month.flatpickr-disabled {\n  display: none; }\n\n.flatpickr-months .flatpickr-prev-month i,\n.flatpickr-months .flatpickr-next-month i {\n  position: relative; }\n\n.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,\n.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {\n  /*\n      /*rtl:begin:ignore*/\n  /*\n      */\n  left: 0;\n  /*\n      /*rtl:end:ignore*/\n  /*\n      */ }\n\n/*\n      /*rtl:begin:ignore*/\n/*\n      /*rtl:end:ignore*/\n.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,\n.flatpickr-months .flatpickr-next-month.flatpickr-next-month {\n  /*\n      /*rtl:begin:ignore*/\n  /*\n      */\n  right: 0;\n  /*\n      /*rtl:end:ignore*/\n  /*\n      */ }\n\n/*\n      /*rtl:begin:ignore*/\n/*\n      /*rtl:end:ignore*/\n.flatpickr-months .flatpickr-prev-month:hover,\n.flatpickr-months .flatpickr-next-month:hover {\n  color: #959ea9; }\n\n.flatpickr-months .flatpickr-prev-month:hover svg,\n.flatpickr-months .flatpickr-next-month:hover svg {\n  fill: #f64747; }\n\n.flatpickr-months .flatpickr-prev-month svg,\n.flatpickr-months .flatpickr-next-month svg {\n  width: 14px;\n  height: 14px; }\n\n.flatpickr-months .flatpickr-prev-month svg path,\n.flatpickr-months .flatpickr-next-month svg path {\n  transition: fill 0.1s;\n  fill: inherit; }\n\n.numInputWrapper {\n  position: relative;\n  height: auto; }\n\n.numInputWrapper input,\n.numInputWrapper span {\n  display: inline-block; }\n\n.numInputWrapper input {\n  width: 100%; }\n\n.numInputWrapper input::-ms-clear {\n  display: none; }\n\n.numInputWrapper input::-webkit-outer-spin-button,\n.numInputWrapper input::-webkit-inner-spin-button {\n  margin: 0;\n  -webkit-appearance: none; }\n\n.numInputWrapper span {\n  position: absolute;\n  right: 0;\n  width: 14px;\n  padding: 0 4px 0 2px;\n  height: 50%;\n  line-height: 50%;\n  opacity: 0;\n  cursor: pointer;\n  border: 1px solid rgba(57, 57, 57, 0.15);\n  box-sizing: border-box; }\n\n.numInputWrapper span:hover {\n  background: rgba(0, 0, 0, 0.1); }\n\n.numInputWrapper span:active {\n  background: rgba(0, 0, 0, 0.2); }\n\n.numInputWrapper span:after {\n  display: block;\n  content: \"\";\n  position: absolute; }\n\n.numInputWrapper span.arrowUp {\n  top: 0;\n  border-bottom: 0; }\n\n.numInputWrapper span.arrowUp:after {\n  border-left: 4px solid transparent;\n  border-right: 4px solid transparent;\n  border-bottom: 4px solid rgba(57, 57, 57, 0.6);\n  top: 26%; }\n\n.numInputWrapper span.arrowDown {\n  top: 50%; }\n\n.numInputWrapper span.arrowDown:after {\n  border-left: 4px solid transparent;\n  border-right: 4px solid transparent;\n  border-top: 4px solid rgba(57, 57, 57, 0.6);\n  top: 40%; }\n\n.numInputWrapper span svg {\n  width: inherit;\n  height: auto; }\n\n.numInputWrapper span svg path {\n  fill: rgba(0, 0, 0, 0.5); }\n\n.numInputWrapper:hover {\n  background: rgba(0, 0, 0, 0.05); }\n\n.numInputWrapper:hover span {\n  opacity: 1; }\n\n.flatpickr-current-month {\n  font-size: 135%;\n  line-height: inherit;\n  font-weight: 300;\n  color: inherit;\n  position: absolute;\n  width: 75%;\n  left: 12.5%;\n  padding: 7.48px 0 0 0;\n  line-height: 1;\n  height: 34px;\n  display: inline-block;\n  text-align: center;\n  transform: translate3d(0px, 0px, 0px); }\n\n.flatpickr-current-month span.cur-month {\n  font-family: inherit;\n  font-weight: 700;\n  color: inherit;\n  display: inline-block;\n  margin-left: 0.5ch;\n  padding: 0; }\n\n.flatpickr-current-month span.cur-month:hover {\n  background: rgba(0, 0, 0, 0.05); }\n\n.flatpickr-current-month .numInputWrapper {\n  width: 6ch;\n  width: 7ch\\0;\n  display: inline-block; }\n\n.flatpickr-current-month .numInputWrapper span.arrowUp:after {\n  border-bottom-color: rgba(0, 0, 0, 0.9); }\n\n.flatpickr-current-month .numInputWrapper span.arrowDown:after {\n  border-top-color: rgba(0, 0, 0, 0.9); }\n\n.flatpickr-current-month input.cur-year {\n  background: transparent;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: text;\n  padding: 0 0 0 0.5ch;\n  margin: 0;\n  display: inline-block;\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: 300;\n  line-height: inherit;\n  height: auto;\n  border: 0;\n  border-radius: 0;\n  vertical-align: initial;\n  -webkit-appearance: textfield;\n  -moz-appearance: textfield;\n  appearance: textfield; }\n\n.flatpickr-current-month input.cur-year:focus {\n  outline: 0; }\n\n.flatpickr-current-month input.cur-year[disabled],\n.flatpickr-current-month input.cur-year[disabled]:hover {\n  font-size: 100%;\n  color: rgba(0, 0, 0, 0.5);\n  background: transparent;\n  pointer-events: none; }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months {\n  appearance: menulist;\n  background: transparent;\n  border: none;\n  border-radius: 0;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: pointer;\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: 300;\n  height: auto;\n  line-height: inherit;\n  margin: -1px 0 0 0;\n  outline: none;\n  padding: 0 0 0 0.5ch;\n  position: relative;\n  vertical-align: initial;\n  -webkit-box-sizing: border-box;\n  -webkit-appearance: menulist;\n  -moz-appearance: menulist;\n  width: auto; }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months:focus,\n.flatpickr-current-month .flatpickr-monthDropdown-months:active {\n  outline: none; }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months:hover {\n  background: rgba(0, 0, 0, 0.05); }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {\n  background-color: transparent;\n  outline: none;\n  padding: 0; }\n\n.flatpickr-weekdays {\n  background: transparent;\n  text-align: center;\n  overflow: hidden;\n  width: 100%;\n  display: flex;\n  align-items: center;\n  height: 28px; }\n\n.flatpickr-weekdays .flatpickr-weekdaycontainer {\n  display: flex;\n  flex: 1; }\n\nspan.flatpickr-weekday {\n  cursor: default;\n  font-size: 90%;\n  background: transparent;\n  color: rgba(0, 0, 0, 0.54);\n  line-height: 1;\n  margin: 0;\n  text-align: center;\n  display: block;\n  flex: 1;\n  font-weight: bolder; }\n\n.dayContainer,\n.flatpickr-weeks {\n  padding: 1px 0 0 0; }\n\n.flatpickr-days {\n  position: relative;\n  overflow: hidden;\n  display: flex;\n  align-items: flex-start;\n  width: 307.875px; }\n\n.flatpickr-days:focus {\n  outline: 0; }\n\n.dayContainer {\n  padding: 0;\n  outline: 0;\n  text-align: left;\n  width: 307.875px;\n  min-width: 307.875px;\n  max-width: 307.875px;\n  box-sizing: border-box;\n  display: inline-block;\n  display: flex;\n  flex-wrap: wrap;\n  -ms-flex-wrap: wrap;\n  justify-content: space-around;\n  transform: translate3d(0px, 0px, 0px);\n  opacity: 1; }\n\n.dayContainer + .dayContainer {\n  box-shadow: -1px 0 0 #e6e6e6; }\n\n.flatpickr-day {\n  background: none;\n  border: 1px solid transparent;\n  border-radius: 150px;\n  box-sizing: border-box;\n  color: #344767;\n  cursor: pointer;\n  font-weight: 400;\n  width: 14.2857143%;\n  flex-basis: 14.2857143%;\n  max-width: 39px;\n  height: 39px;\n  line-height: 39px;\n  margin: 0;\n  display: inline-block;\n  position: relative;\n  justify-content: center;\n  text-align: center; }\n\n.flatpickr-day.inRange,\n.flatpickr-day.prevMonthDay.inRange,\n.flatpickr-day.nextMonthDay.inRange,\n.flatpickr-day.today.inRange,\n.flatpickr-day.prevMonthDay.today.inRange,\n.flatpickr-day.nextMonthDay.today.inRange,\n.flatpickr-day:hover,\n.flatpickr-day.prevMonthDay:hover,\n.flatpickr-day.nextMonthDay:hover,\n.flatpickr-day:focus,\n.flatpickr-day.prevMonthDay:focus,\n.flatpickr-day.nextMonthDay:focus {\n  cursor: pointer;\n  outline: 0;\n  background: #e6e6e6;\n  border-color: #e6e6e6; }\n\n.flatpickr-day.today {\n  border-color: #959ea9; }\n\n.flatpickr-day.today:hover,\n.flatpickr-day.today:focus {\n  border-color: #959ea9;\n  background: #959ea9;\n  color: #fff; }\n\n.flatpickr-day.selected,\n.flatpickr-day.startRange,\n.flatpickr-day.endRange,\n.flatpickr-day.selected.inRange,\n.flatpickr-day.startRange.inRange,\n.flatpickr-day.endRange.inRange,\n.flatpickr-day.selected:focus,\n.flatpickr-day.startRange:focus,\n.flatpickr-day.endRange:focus,\n.flatpickr-day.selected:hover,\n.flatpickr-day.startRange:hover,\n.flatpickr-day.endRange:hover,\n.flatpickr-day.selected.prevMonthDay,\n.flatpickr-day.startRange.prevMonthDay,\n.flatpickr-day.endRange.prevMonthDay,\n.flatpickr-day.selected.nextMonthDay,\n.flatpickr-day.startRange.nextMonthDay,\n.flatpickr-day.endRange.nextMonthDay {\n  background: #569ff7;\n  box-shadow: none;\n  color: #fff;\n  border-color: #569ff7; }\n\n.flatpickr-day.selected.startRange,\n.flatpickr-day.startRange.startRange,\n.flatpickr-day.endRange.startRange {\n  border-radius: 50px 0 0 50px; }\n\n.flatpickr-day.selected.endRange,\n.flatpickr-day.startRange.endRange,\n.flatpickr-day.endRange.endRange {\n  border-radius: 0 50px 50px 0; }\n\n.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {\n  box-shadow: -10px 0 0 #569ff7; }\n\n.flatpickr-day.selected.startRange.endRange,\n.flatpickr-day.startRange.startRange.endRange,\n.flatpickr-day.endRange.startRange.endRange {\n  border-radius: 50px; }\n\n.flatpickr-day.inRange {\n  border-radius: 0;\n  box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6; }\n\n.flatpickr-day.flatpickr-disabled,\n.flatpickr-day.flatpickr-disabled:hover,\n.flatpickr-day.prevMonthDay,\n.flatpickr-day.nextMonthDay,\n.flatpickr-day.notAllowed,\n.flatpickr-day.notAllowed.prevMonthDay,\n.flatpickr-day.notAllowed.nextMonthDay {\n  color: rgba(57, 57, 57, 0.3);\n  background: transparent;\n  border-color: transparent;\n  cursor: default; }\n\n.flatpickr-day.flatpickr-disabled,\n.flatpickr-day.flatpickr-disabled:hover {\n  cursor: not-allowed;\n  color: rgba(57, 57, 57, 0.1); }\n\n.flatpickr-day.week.selected {\n  border-radius: 0;\n  box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7; }\n\n.flatpickr-day.hidden {\n  visibility: hidden; }\n\n.rangeMode .flatpickr-day {\n  margin-top: 1px; }\n\n.flatpickr-weekwrapper {\n  float: left; }\n\n.flatpickr-weekwrapper .flatpickr-weeks {\n  padding: 0 12px;\n  box-shadow: 1px 0 0 #e6e6e6; }\n\n.flatpickr-weekwrapper .flatpickr-weekday {\n  float: none;\n  width: 100%;\n  line-height: 28px; }\n\n.flatpickr-weekwrapper span.flatpickr-day,\n.flatpickr-weekwrapper span.flatpickr-day:hover {\n  display: block;\n  width: 100%;\n  max-width: none;\n  color: rgba(57, 57, 57, 0.3);\n  background: transparent;\n  cursor: default;\n  border: none; }\n\n.flatpickr-innerContainer {\n  display: block;\n  display: flex;\n  box-sizing: border-box;\n  overflow: hidden; }\n\n.flatpickr-rContainer {\n  display: inline-block;\n  padding: 0;\n  box-sizing: border-box; }\n\n.flatpickr-time {\n  text-align: center;\n  outline: 0;\n  display: block;\n  height: 0;\n  line-height: 40px;\n  max-height: 40px;\n  box-sizing: border-box;\n  overflow: hidden;\n  display: flex; }\n\n.flatpickr-time:after {\n  content: \"\";\n  display: table;\n  clear: both; }\n\n.flatpickr-time .numInputWrapper {\n  flex: 1;\n  width: 40%;\n  height: 40px;\n  float: left; }\n\n.flatpickr-time .numInputWrapper span.arrowUp:after {\n  border-bottom-color: #393939; }\n\n.flatpickr-time .numInputWrapper span.arrowDown:after {\n  border-top-color: #393939; }\n\n.flatpickr-time.hasSeconds .numInputWrapper {\n  width: 26%; }\n\n.flatpickr-time.time24hr .numInputWrapper {\n  width: 49%; }\n\n.flatpickr-time input {\n  background: transparent;\n  box-shadow: none;\n  border: 0;\n  border-radius: 0;\n  text-align: center;\n  margin: 0;\n  padding: 0;\n  height: inherit;\n  line-height: inherit;\n  color: #393939;\n  font-size: 14px;\n  position: relative;\n  box-sizing: border-box;\n  -webkit-appearance: textfield;\n  -moz-appearance: textfield;\n  appearance: textfield; }\n\n.flatpickr-time input.flatpickr-hour {\n  font-weight: bold; }\n\n.flatpickr-time input.flatpickr-minute,\n.flatpickr-time input.flatpickr-second {\n  font-weight: 400; }\n\n.flatpickr-time input:focus {\n  outline: 0;\n  border: 0; }\n\n.flatpickr-time .flatpickr-time-separator,\n.flatpickr-time .flatpickr-am-pm {\n  height: inherit;\n  float: left;\n  line-height: inherit;\n  color: #393939;\n  font-weight: bold;\n  width: 2%;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n  align-self: center; }\n\n.flatpickr-time .flatpickr-am-pm {\n  outline: 0;\n  width: 18%;\n  cursor: pointer;\n  text-align: center;\n  font-weight: 400; }\n\n.flatpickr-time input:hover,\n.flatpickr-time .flatpickr-am-pm:hover,\n.flatpickr-time input:focus,\n.flatpickr-time .flatpickr-am-pm:focus {\n  background: #eee; }\n\n.flatpickr-input[readonly] {\n  cursor: pointer; }\n\n@-webkit-keyframes fpFadeInDown {\n  from {\n    opacity: 0;\n    transform: translate3d(0, -20px, 0); }\n  to {\n    opacity: 1;\n    transform: translate3d(0, 0, 0); } }\n\n@keyframes fpFadeInDown {\n  from {\n    opacity: 0;\n    transform: translate3d(0, -20px, 0); }\n  to {\n    opacity: 1;\n    transform: translate3d(0, 0, 0); } }\n\n.datepicker.flatpickr-input {\n  background-color: #fff; }\n\n.flatpickr-calendar.open {\n  margin-left: 0px;\n  margin-top: 4px; }\n\n.flatpickr-calendar.arrowBottom {\n  margin-top: -20px; }\n\n.flatpickr-calendar .flatpickr-innerContainer {\n  margin-top: 15px !important; }\n\n.flatpickr-calendar .numInputWrapper span {\n  border: none;\n  border-bottom: 1px solid rgba(57, 57, 57, 0.15); }\n\n.flatpickr-calendar .numInputWrapper:hover .arrowUp,\n.flatpickr-calendar .numInputWrapper:hover .arrowDown {\n  margin-top: 3px; }\n\n.flatpickr-calendar .flatpickr-day.today, .flatpickr-calendar .flatpickr-day.selected, .flatpickr-calendar .flatpickr-day.startRange, .flatpickr-calendar .flatpickr-day.endRange {\n  background: #e91e63 !important;\n  color: #fff;\n  border: none; }\n\n.flatpickr-calendar .flatpickr-day.inRange {\n  background: rgba(94, 114, 228, 0.28);\n  border: none;\n  box-shadow: -5px 0 0 #D7DCF8, 5px 0 0 #D7DCF8; }\n\n.flatpickr-calendar .flatpickr-day:not(.selected):hover, .flatpickr-calendar .flatpickr-day:not(.selected):focus {\n  background: rgba(94, 114, 228, 0.28);\n  border: none; }\n\n.flatpickr-calendar .flatpickr-time input:hover,\n.flatpickr-calendar .flatpickr-time .flatpickr-am-pm:hover,\n.flatpickr-calendar .flatpickr-time input:focus,\n.flatpickr-calendar .flatpickr-time .flatpickr-am-pm:focus {\n  background: rgba(94, 114, 228, 0.28); }\n\n.flatpickr.form-control {\n  background: #fff; }\n\n.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)) {\n  box-shadow: -10px 0 0 #e91e63; }\n\n/*! nouislider - 14.6.3 - 11/19/2020 */\n/* Functional styling;\n * These styles are required for noUiSlider to function.\n * You don't need to change these rules to apply your design.\n */\n.noUi-target,\n.noUi-target * {\n  -webkit-touch-callout: none;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  -webkit-user-select: none;\n  touch-action: none;\n  -ms-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  box-sizing: border-box; }\n\n.noUi-target {\n  position: relative; }\n\n.noUi-base,\n.noUi-connects {\n  width: 100%;\n  height: 2px;\n  position: relative;\n  z-index: 1;\n  top: 0; }\n\n/* Wrapper for all connect elements.\n */\n.noUi-connects {\n  z-index: 0;\n  overflow: hidden; }\n\n.noUi-connect,\n.noUi-origin {\n  will-change: transform;\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  -ms-transform-origin: 0 0;\n  -webkit-transform-origin: 0 0;\n  -webkit-transform-style: preserve-3d;\n  transform-origin: 0 0;\n  transform-style: flat; }\n\n.noUi-connect {\n  height: 100%;\n  width: 100%;\n  border-radius: 0.25rem; }\n\n.noUi-origin {\n  height: 10%;\n  width: 10%; }\n\n/* Offset direction\n */\n.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {\n  left: 0;\n  right: auto; }\n\n/* Give origins 0 height/width so they don't interfere with clicking the\n * connect elements.\n */\n.noUi-vertical .noUi-origin {\n  width: 0; }\n\n.noUi-horizontal .noUi-origin {\n  height: 0; }\n\n.noUi-handle {\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  position: absolute; }\n\n.noUi-touch-area {\n  height: 100%;\n  width: 100%; }\n\n.noUi-state-tap .noUi-connect,\n.noUi-state-tap .noUi-origin {\n  transition: transform 0.3s; }\n\n.noUi-state-drag * {\n  cursor: inherit !important; }\n\n/* Slider size and handle placement;\n */\n.noUi-horizontal {\n  height: 2px; }\n\n.noUi-horizontal .noUi-handle {\n  border-radius: 50%;\n  background-color: #fff;\n  box-shadow: 0 1px 13px 0 rgba(0, 0, 0, 0.2);\n  height: 14px;\n  width: 14px;\n  cursor: pointer;\n  margin-top: -6px;\n  outline: none;\n  right: -10px; }\n\n.noUi-vertical {\n  width: 3px; }\n\n.noUi-vertical .noUi-handle {\n  width: 28px;\n  height: 34px;\n  right: -6px;\n  top: -17px; }\n\n.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {\n  left: -17px;\n  right: auto; }\n\n/* Styling;\n * Giving the connect element a border radius causes issues with using transform: scale\n */\n.noUi-target {\n  background: #f0f2f5;\n  border-radius: .25rem; }\n\n.noUi-connects {\n  border-radius: 3px; }\n\n.noUi-connect {\n  background: #e91e63; }\n\n/* Handles and cursors;\n */\n.noUi-draggable {\n  cursor: ew-resize; }\n\n.noUi-vertical .noUi-draggable {\n  cursor: ns-resize; }\n\n.noUi-handle {\n  border: 1px solid #e91e63;\n  border-radius: 3px;\n  background: #fff;\n  cursor: default;\n  box-shadow: inset 0 0 1px #fff, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;\n  webkit-transition: .3s ease 0s;\n  -moz-transition: .3s ease 0s;\n  -ms-transition: .3s ease 0s;\n  -o-transform: .3s ease 0s;\n  transition: .3s ease 0s; }\n\n.noUi-active {\n  box-shadow: inset 0 0 1px #fff, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;\n  transform: scale3d(1.5, 1.5, 1); }\n\n/* Disabled state;\n */\n[disabled] .noUi-connect {\n  background: #B8B8B8; }\n\n[disabled].noUi-target,\n[disabled].noUi-handle,\n[disabled] .noUi-handle {\n  cursor: not-allowed; }\n\n/* Base;\n *\n */\n.noUi-pips,\n.noUi-pips * {\n  box-sizing: border-box; }\n\n.noUi-pips {\n  position: absolute;\n  color: #999; }\n\n/* Values;\n *\n */\n.noUi-value {\n  position: absolute;\n  white-space: nowrap;\n  text-align: center; }\n\n.noUi-value-sub {\n  color: #ccc;\n  font-size: 10px; }\n\n/* Markings;\n *\n */\n.noUi-marker {\n  position: absolute;\n  background: #CCC; }\n\n.noUi-marker-sub {\n  background: #AAA; }\n\n.noUi-marker-large {\n  background: #AAA; }\n\n/* Horizontal layout;\n *\n */\n.noUi-pips-horizontal {\n  padding: 10px 0;\n  height: 80px;\n  top: 100%;\n  left: 0;\n  width: 100%; }\n\n.noUi-value-horizontal {\n  transform: translate(-50%, 50%); }\n\n.noUi-rtl .noUi-value-horizontal {\n  transform: translate(50%, 50%); }\n\n.noUi-marker-horizontal.noUi-marker {\n  margin-left: -1px;\n  width: 2px;\n  height: 5px; }\n\n.noUi-marker-horizontal.noUi-marker-sub {\n  height: 10px; }\n\n.noUi-marker-horizontal.noUi-marker-large {\n  height: 15px; }\n\n/* Vertical layout;\n *\n */\n.noUi-pips-vertical {\n  padding: 0 10px;\n  height: 100%;\n  top: 0;\n  left: 100%; }\n\n.noUi-value-vertical {\n  transform: translate(0, -50%);\n  padding-left: 25px; }\n\n.noUi-rtl .noUi-value-vertical {\n  transform: translate(0, 50%); }\n\n.noUi-marker-vertical.noUi-marker {\n  width: 5px;\n  height: 2px;\n  margin-top: -1px; }\n\n.noUi-marker-vertical.noUi-marker-sub {\n  width: 10px; }\n\n.noUi-marker-vertical.noUi-marker-large {\n  width: 15px; }\n\n.noUi-tooltip {\n  display: block;\n  position: absolute;\n  border: 1px solid #D9D9D9;\n  border-radius: 3px;\n  background: #fff;\n  color: #000;\n  padding: 5px;\n  text-align: center;\n  white-space: nowrap; }\n\n.noUi-horizontal .noUi-tooltip {\n  transform: translate(-50%, 0);\n  left: 50%;\n  bottom: 120%; }\n\n.noUi-vertical .noUi-tooltip {\n  transform: translate(0, -50%);\n  top: 50%;\n  right: 120%; }\n\n.noUi-horizontal .noUi-origin > .noUi-tooltip {\n  transform: translate(50%, 0);\n  left: auto;\n  bottom: 10px; }\n\n.noUi-vertical .noUi-origin > .noUi-tooltip {\n  transform: translate(0, -18px);\n  top: auto;\n  right: 28px; }\n\n/* PrismJS 1.23.0\nhttps://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */\n/**\n * prism.js default theme for JavaScript, CSS and HTML\n * Based on dabblet (http://dabblet.com)\n * @author Lea Verou\n */\ncode[class*=\"language-\"],\npre[class*=\"language-\"] {\n  color: black;\n  background: none;\n  text-shadow: 0 1px white;\n  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n  font-size: 1em;\n  text-align: left;\n  white-space: pre;\n  word-spacing: normal;\n  word-break: normal;\n  word-wrap: normal;\n  line-height: 1.5;\n  -moz-tab-size: 4;\n  -o-tab-size: 4;\n  tab-size: 4;\n  -webkit-hyphens: none;\n  -ms-hyphens: none;\n  hyphens: none; }\n\npre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection,\ncode[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n  text-shadow: none;\n  background: #b3d4fc; }\n\npre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection, code[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n  text-shadow: none;\n  background: #b3d4fc; }\n\npre[class*=\"language-\"]::selection, pre[class*=\"language-\"] ::selection,\ncode[class*=\"language-\"]::selection, code[class*=\"language-\"] ::selection {\n  text-shadow: none;\n  background: #b3d4fc; }\n\n@media print {\n  code[class*=\"language-\"],\n  pre[class*=\"language-\"] {\n    text-shadow: none; } }\n\n/* Code blocks */\npre[class*=\"language-\"] {\n  padding: 1em;\n  overflow: auto;\n  border-radius: .75rem; }\n\n:not(pre) > code[class*=\"language-\"],\npre[class*=\"language-\"] {\n  background: #f8f9fa; }\n\n/* Inline code */\n:not(pre) > code[class*=\"language-\"] {\n  padding: .1em;\n  border-radius: .3em;\n  white-space: normal; }\n\n.token.comment,\n.token.prolog,\n.token.doctype,\n.token.cdata {\n  color: slategray; }\n\n.token.punctuation {\n  color: #999; }\n\n.token.namespace {\n  opacity: .7; }\n\n.token.property,\n.token.tag,\n.token.boolean,\n.token.number,\n.token.constant,\n.token.symbol,\n.token.deleted {\n  color: #905; }\n\n.token.selector,\n.token.attr-name,\n.token.string,\n.token.char,\n.token.builtin,\n.token.inserted {\n  color: #690; }\n\n.token.operator,\n.token.entity,\n.token.url,\n.language-css .token.string,\n.style .token.string {\n  color: #9a6e3a;\n  /* This background color was intended by the author of this theme. */\n  background: rgba(255, 255, 255, 0.5); }\n\n.token.atrule,\n.token.attr-value,\n.token.keyword {\n  color: #07a; }\n\n.token.function,\n.token.class-name {\n  color: #DD4A68; }\n\n.token.regex,\n.token.important,\n.token.variable {\n  color: #e90; }\n\n.token.important,\n.token.bold {\n  font-weight: bold; }\n\n.token.italic {\n  font-style: italic; }\n\n.token.entity {\n  cursor: help; }\n\n/*\n * Container style\n */\n.ps {\n  overflow: hidden !important;\n  overflow-anchor: none;\n  -ms-overflow-style: none;\n  touch-action: auto;\n  -ms-touch-action: auto; }\n\n/*\n * Scrollbar rail styles\n */\n.ps__rail-x {\n  display: none;\n  opacity: 0;\n  transition: background-color .2s linear, opacity .2s linear;\n  -webkit-transition: background-color .2s linear, opacity .2s linear;\n  height: 15px;\n  /* there must be 'bottom' or 'top' for ps__rail-x */\n  bottom: 0px;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps__rail-y {\n  display: none;\n  opacity: 0;\n  transition: background-color .2s linear, opacity .2s linear;\n  -webkit-transition: background-color .2s linear, opacity .2s linear;\n  width: 15px;\n  /* there must be 'right' or 'left' for ps__rail-y */\n  right: 0;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps--active-x > .ps__rail-x,\n.ps--active-y > .ps__rail-y {\n  display: block;\n  background-color: transparent; }\n\n.ps:hover > .ps__rail-x,\n.ps:hover > .ps__rail-y,\n.ps--focus > .ps__rail-x,\n.ps--focus > .ps__rail-y,\n.ps--scrolling-x > .ps__rail-x,\n.ps--scrolling-y > .ps__rail-y {\n  opacity: 0.6; }\n\n.ps .ps__rail-x:hover,\n.ps .ps__rail-y:hover,\n.ps .ps__rail-x:focus,\n.ps .ps__rail-y:focus,\n.ps .ps__rail-x.ps--clicking,\n.ps .ps__rail-y.ps--clicking {\n  background-color: #eee;\n  opacity: 0.9; }\n\n/*\n * Scrollbar thumb styles\n */\n.ps__thumb-x {\n  background-color: #aaa;\n  border-radius: 6px;\n  transition: background-color .2s linear, height .2s ease-in-out;\n  -webkit-transition: background-color .2s linear, height .2s ease-in-out;\n  height: 6px;\n  /* there must be 'bottom' for ps__thumb-x */\n  bottom: 2px;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps__thumb-y {\n  background-color: #aaa;\n  border-radius: 6px;\n  transition: background-color .2s linear, width .2s ease-in-out;\n  -webkit-transition: background-color .2s linear, width .2s ease-in-out;\n  width: 6px;\n  /* there must be 'right' for ps__thumb-y */\n  right: 2px;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps__rail-x:hover > .ps__thumb-x,\n.ps__rail-x:focus > .ps__thumb-x,\n.ps__rail-x.ps--clicking .ps__thumb-x {\n  background-color: #999;\n  height: 11px; }\n\n.ps__rail-y:hover > .ps__thumb-y,\n.ps__rail-y:focus > .ps__thumb-y,\n.ps__rail-y.ps--clicking .ps__thumb-y {\n  background-color: #999;\n  width: 11px; }\n\n/* MS supports */\n@supports (-ms-overflow-style: none) {\n  .ps {\n    overflow: auto !important; } }\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n  .ps {\n    overflow: auto !important; } }\n\n/*# sourceMappingURL=material-dashboard.css.map */\n"
  },
  {
    "path": "src/material-stubs/resources/assets/css/nucleo-icons.css",
    "content": "/*--------------------------------\n\nhermes-dashboard-icons Web Font - built using nucleoapp.com\nLicense - nucleoapp.com/license/\n\n-------------------------------- */\n@font-face {\n  font-family: 'NucleoIcons';\n  src: url('../fonts/nucleo-icons.eot');\n  src: url('../fonts/nucleo-icons.eot') format('embedded-opentype'), url('../fonts/nucleo-icons.woff2') format('woff2'), url('../fonts/nucleo-icons.woff') format('woff'), url('../fonts/nucleo-icons.ttf') format('truetype'), url('../fonts/nucleo-icons.svg') format('svg');\n  font-weight: normal;\n  font-style: normal;\n}\n\n/*------------------------\n    base class definition\n-------------------------*/\n.ni {\n  display: inline-block;\n  font: normal normal normal 14px/1 NucleoIcons;\n  font-size: inherit;\n  text-rendering: auto;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n/*------------------------\n  change icon size\n-------------------------*/\n.ni-lg {\n  font-size: 1.33333333em;\n  line-height: 0.75em;\n  vertical-align: -15%;\n}\n\n.ni-2x {\n  font-size: 2em;\n}\n\n.ni-3x {\n  font-size: 3em;\n}\n\n.ni-4x {\n  font-size: 4em;\n}\n\n.ni-5x {\n  font-size: 5em;\n}\n\n/*----------------------------------\n  add a square/circle background\n-----------------------------------*/\n.ni.square,\n.ni.circle {\n  padding: 0.33333333em;\n  vertical-align: -16%;\n  background-color: #eee;\n}\n\n.ni.circle {\n  border-radius: 50%;\n}\n\n/*------------------------\n  list icons\n-------------------------*/\n.ni-ul {\n  padding-left: 0;\n  margin-left: 2.14285714em;\n  list-style-type: none;\n}\n\n.ni-ul>li {\n  position: relative;\n}\n\n.ni-ul>li>.ni {\n  position: absolute;\n  left: -1.57142857em;\n  top: 0.14285714em;\n  text-align: center;\n}\n\n.ni-ul>li>.ni.lg {\n  top: 0;\n  left: -1.35714286em;\n}\n\n.ni-ul>li>.ni.circle,\n.ni-ul>li>.ni.square {\n  top: -0.19047619em;\n  left: -1.9047619em;\n}\n\n/*------------------------\n  spinning icons\n-------------------------*/\n.ni.spin {\n  -webkit-animation: nc-spin 2s infinite linear;\n  -moz-animation: nc-spin 2s infinite linear;\n  animation: nc-spin 2s infinite linear;\n}\n\n@-webkit-keyframes nc-spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n  }\n\n  100% {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n@-moz-keyframes nc-spin {\n  0% {\n    -moz-transform: rotate(0deg);\n  }\n\n  100% {\n    -moz-transform: rotate(360deg);\n  }\n}\n\n@keyframes nc-spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n    -moz-transform: rotate(0deg);\n    -ms-transform: rotate(0deg);\n    -o-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n\n  100% {\n    -webkit-transform: rotate(360deg);\n    -moz-transform: rotate(360deg);\n    -ms-transform: rotate(360deg);\n    -o-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n\n/*------------------------\n  rotated/flipped icons\n-------------------------*/\n.ni.rotate-90 {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);\n  -webkit-transform: rotate(90deg);\n  -moz-transform: rotate(90deg);\n  -ms-transform: rotate(90deg);\n  -o-transform: rotate(90deg);\n  transform: rotate(90deg);\n}\n\n.ni.rotate-180 {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);\n  -webkit-transform: rotate(180deg);\n  -moz-transform: rotate(180deg);\n  -ms-transform: rotate(180deg);\n  -o-transform: rotate(180deg);\n  transform: rotate(180deg);\n}\n\n.ni.rotate-270 {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);\n  -webkit-transform: rotate(270deg);\n  -moz-transform: rotate(270deg);\n  -ms-transform: rotate(270deg);\n  -o-transform: rotate(270deg);\n  transform: rotate(270deg);\n}\n\n.ni.flip-y {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);\n  -webkit-transform: scale(-1, 1);\n  -moz-transform: scale(-1, 1);\n  -ms-transform: scale(-1, 1);\n  -o-transform: scale(-1, 1);\n  transform: scale(-1, 1);\n}\n\n.ni.flip-x {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);\n  -webkit-transform: scale(1, -1);\n  -moz-transform: scale(1, -1);\n  -ms-transform: scale(1, -1);\n  -o-transform: scale(1, -1);\n  transform: scale(1, -1);\n}\n\n/*------------------------\n    font icons\n-------------------------*/\n\n.ni-active-40::before {\n  content: \"\\ea02\";\n}\n\n.ni-air-baloon::before {\n  content: \"\\ea03\";\n}\n\n.ni-album-2::before {\n  content: \"\\ea04\";\n}\n\n.ni-align-center::before {\n  content: \"\\ea05\";\n}\n\n.ni-align-left-2::before {\n  content: \"\\ea06\";\n}\n\n.ni-ambulance::before {\n  content: \"\\ea07\";\n}\n\n.ni-app::before {\n  content: \"\\ea08\";\n}\n\n.ni-archive-2::before {\n  content: \"\\ea09\";\n}\n\n.ni-atom::before {\n  content: \"\\ea0a\";\n}\n\n.ni-badge::before {\n  content: \"\\ea0b\";\n}\n\n.ni-bag-17::before {\n  content: \"\\ea0c\";\n}\n\n.ni-basket::before {\n  content: \"\\ea0d\";\n}\n\n.ni-bell-55::before {\n  content: \"\\ea0e\";\n}\n\n.ni-bold-down::before {\n  content: \"\\ea0f\";\n}\n\n.ni-bold-left::before {\n  content: \"\\ea10\";\n}\n\n.ni-bold-right::before {\n  content: \"\\ea11\";\n}\n\n.ni-bold-up::before {\n  content: \"\\ea12\";\n}\n\n.ni-bold::before {\n  content: \"\\ea13\";\n}\n\n.ni-book-bookmark::before {\n  content: \"\\ea14\";\n}\n\n.ni-books::before {\n  content: \"\\ea15\";\n}\n\n.ni-box-2::before {\n  content: \"\\ea16\";\n}\n\n.ni-briefcase-24::before {\n  content: \"\\ea17\";\n}\n\n.ni-building::before {\n  content: \"\\ea18\";\n}\n\n.ni-bulb-61::before {\n  content: \"\\ea19\";\n}\n\n.ni-bullet-list-67::before {\n  content: \"\\ea1a\";\n}\n\n.ni-bus-front-12::before {\n  content: \"\\ea1b\";\n}\n\n.ni-button-pause::before {\n  content: \"\\ea1c\";\n}\n\n.ni-button-play::before {\n  content: \"\\ea1d\";\n}\n\n.ni-button-power::before {\n  content: \"\\ea1e\";\n}\n\n.ni-calendar-grid-58::before {\n  content: \"\\ea1f\";\n}\n\n.ni-camera-compact::before {\n  content: \"\\ea20\";\n}\n\n.ni-caps-small::before {\n  content: \"\\ea21\";\n}\n\n.ni-cart::before {\n  content: \"\\ea22\";\n}\n\n.ni-chart-bar-32::before {\n  content: \"\\ea23\";\n}\n\n.ni-chart-pie-35::before {\n  content: \"\\ea24\";\n}\n\n.ni-chat-round::before {\n  content: \"\\ea25\";\n}\n\n.ni-check-bold::before {\n  content: \"\\ea26\";\n}\n\n.ni-circle-08::before {\n  content: \"\\ea27\";\n}\n\n.ni-cloud-download-95::before {\n  content: \"\\ea28\";\n}\n\n.ni-cloud-upload-96::before {\n  content: \"\\ea29\";\n}\n\n.ni-compass-04::before {\n  content: \"\\ea2a\";\n}\n\n.ni-controller::before {\n  content: \"\\ea2b\";\n}\n\n.ni-credit-card::before {\n  content: \"\\ea2c\";\n}\n\n.ni-curved-next::before {\n  content: \"\\ea2d\";\n}\n\n.ni-delivery-fast::before {\n  content: \"\\ea2e\";\n}\n\n.ni-diamond::before {\n  content: \"\\ea2f\";\n}\n\n.ni-email-83::before {\n  content: \"\\ea30\";\n}\n\n.ni-fat-add::before {\n  content: \"\\ea31\";\n}\n\n.ni-fat-delete::before {\n  content: \"\\ea32\";\n}\n\n.ni-fat-remove::before {\n  content: \"\\ea33\";\n}\n\n.ni-favourite-28::before {\n  content: \"\\ea34\";\n}\n\n.ni-folder-17::before {\n  content: \"\\ea35\";\n}\n\n.ni-glasses-2::before {\n  content: \"\\ea36\";\n}\n\n.ni-hat-3::before {\n  content: \"\\ea37\";\n}\n\n.ni-headphones::before {\n  content: \"\\ea38\";\n}\n\n.ni-html5::before {\n  content: \"\\ea39\";\n}\n\n.ni-istanbul::before {\n  content: \"\\ea3a\";\n}\n\n.ni-key-25::before {\n  content: \"\\ea3b\";\n}\n\n.ni-laptop::before {\n  content: \"\\ea3c\";\n}\n\n.ni-like-2::before {\n  content: \"\\ea3d\";\n}\n\n.ni-lock-circle-open::before {\n  content: \"\\ea3e\";\n}\n\n.ni-map-big::before {\n  content: \"\\ea3f\";\n}\n\n.ni-mobile-button::before {\n  content: \"\\ea40\";\n}\n\n.ni-money-coins::before {\n  content: \"\\ea41\";\n}\n\n.ni-note-03::before {\n  content: \"\\ea42\";\n}\n\n.ni-notification-70::before {\n  content: \"\\ea43\";\n}\n\n.ni-palette::before {\n  content: \"\\ea44\";\n}\n\n.ni-paper-diploma::before {\n  content: \"\\ea45\";\n}\n\n.ni-pin-3::before {\n  content: \"\\ea46\";\n}\n\n.ni-planet::before {\n  content: \"\\ea47\";\n}\n\n.ni-ruler-pencil::before {\n  content: \"\\ea48\";\n}\n\n.ni-satisfied::before {\n  content: \"\\ea49\";\n}\n\n.ni-scissors::before {\n  content: \"\\ea4a\";\n}\n\n.ni-send::before {\n  content: \"\\ea4b\";\n}\n\n.ni-settings-gear-65::before {\n  content: \"\\ea4c\";\n}\n\n.ni-settings::before {\n  content: \"\\ea4d\";\n}\n\n.ni-single-02::before {\n  content: \"\\ea4e\";\n}\n\n.ni-single-copy-04::before {\n  content: \"\\ea4f\";\n}\n\n.ni-sound-wave::before {\n  content: \"\\ea50\";\n}\n\n.ni-spaceship::before {\n  content: \"\\ea51\";\n}\n\n.ni-square-pin::before {\n  content: \"\\ea52\";\n}\n\n.ni-support-16::before {\n  content: \"\\ea53\";\n}\n\n.ni-tablet-button::before {\n  content: \"\\ea54\";\n}\n\n.ni-tag::before {\n  content: \"\\ea55\";\n}\n\n.ni-tie-bow::before {\n  content: \"\\ea56\";\n}\n\n.ni-time-alarm::before {\n  content: \"\\ea57\";\n}\n\n.ni-trophy::before {\n  content: \"\\ea58\";\n}\n\n.ni-tv-2::before {\n  content: \"\\ea59\";\n}\n\n.ni-umbrella-13::before {\n  content: \"\\ea5a\";\n}\n\n.ni-user-run::before {\n  content: \"\\ea5b\";\n}\n\n.ni-vector::before {\n  content: \"\\ea5c\";\n}\n\n.ni-watch-time::before {\n  content: \"\\ea5d\";\n}\n\n.ni-world::before {\n  content: \"\\ea5e\";\n}\n\n.ni-zoom-split-in::before {\n  content: \"\\ea5f\";\n}\n\n.ni-collection::before {\n  content: \"\\ea60\";\n}\n\n.ni-image::before {\n  content: \"\\ea61\";\n}\n\n.ni-shop::before {\n  content: \"\\ea62\";\n}\n\n.ni-ungroup::before {\n  content: \"\\ea63\";\n}\n\n.ni-world-2::before {\n  content: \"\\ea64\";\n}\n\n.ni-ui-04::before {\n  content: \"\\ea65\";\n}\n\n\n/* all icon font classes list here */"
  },
  {
    "path": "src/material-stubs/resources/assets/css/nucleo-svg.css",
    "content": "/* Generated using nucleoapp.com */\n/* --------------------------------\n\nIcon colors\n\n-------------------------------- */\n\n.icon {\n  display: inline-block;\n  /* icon primary color */\n  color: #111111;\n  height: 1em;\n  width: 1em;\n}\n\n.icon use {\n  /* icon secondary color - fill */\n  fill: #7ea6f6;\n}\n\n.icon.icon-outline use {\n  /* icon secondary color - stroke */\n  stroke: #7ea6f6;\n}\n\n/* --------------------------------\n\nChange icon size\n\n-------------------------------- */\n\n.icon-xs {\n  height: 0.5em;\n  width: 0.5em;\n}\n\n.icon-sm {\n  height: 0.8em;\n  width: 0.8em;\n}\n\n.icon-lg {\n  height: 1.6em;\n  width: 1.6em;\n}\n\n.icon-xl {\n  height: 2em;\n  width: 2em;\n}\n\n/* -------------------------------- \n\nAlign icon and text \n\n-------------------------------- */\n\n.icon-text-aligner {\n  /* add this class to parent element that contains icon + text */\n  display: flex;\n  align-items: center;\n}\n\n.icon-text-aligner .icon {\n  color: inherit;\n  margin-right: 0.4em;\n}\n\n.icon-text-aligner .icon use {\n  color: inherit;\n  fill: currentColor;\n}\n\n.icon-text-aligner .icon.icon-outline use {\n  stroke: currentColor;\n}\n\n/* -------------------------------- \n\nIcon reset values - used to enable color customizations\n\n-------------------------------- */\n\n.icon {\n  fill: currentColor;\n  stroke: none;\n}\n\n.icon.icon-outline {\n  fill: none;\n  stroke: currentColor;\n}\n\n.icon use {\n  stroke: none;\n}\n\n.icon.icon-outline use {\n  fill: none;\n}\n\n/* -------------------------------- \n\nStroke effects - Nucleo outline icons\n\n- 16px icons -> up to 1px stroke (16px outline icons do not support stroke changes)\n- 24px, 32px icons -> up to 2px stroke\n- 48px, 64px icons -> up to 4px stroke\n\n-------------------------------- */\n\n.icon-outline.icon-stroke-1 {\n  stroke-width: 1px;\n}\n\n.icon-outline.icon-stroke-2 {\n  stroke-width: 2px;\n}\n\n.icon-outline.icon-stroke-3 {\n  stroke-width: 3px;\n}\n\n.icon-outline.icon-stroke-4 {\n  stroke-width: 4px;\n}\n\n.icon-outline.icon-stroke-1 use,\n.icon-outline.icon-stroke-3 use {\n  -webkit-transform: translateX(0.5px) translateY(0.5px);\n  -moz-transform: translateX(0.5px) translateY(0.5px);\n  -ms-transform: translateX(0.5px) translateY(0.5px);\n  -o-transform: translateX(0.5px) translateY(0.5px);\n  transform: translateX(0.5px) translateY(0.5px);\n}"
  },
  {
    "path": "src/material-stubs/resources/assets/js/app.js",
    "content": "require('./bootstrap');\n"
  },
  {
    "path": "src/material-stubs/resources/assets/js/bootstrap.js",
    "content": "window._ = require('lodash');\n\n/**\n * We'll load the axios HTTP library which allows us to easily issue requests\n * to our Laravel back-end. This library automatically handles sending the\n * CSRF token as a header based on the value of the \"XSRF\" token cookie.\n */\n\nwindow.axios = require('axios');\n\nwindow.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';\n\n/**\n * Echo exposes an expressive API for subscribing to channels and listening\n * for events that are broadcast by Laravel. Echo and event broadcasting\n * allows your team to easily build robust real-time web applications.\n */\n\n// import Echo from 'laravel-echo';\n\n// window.Pusher = require('pusher-js');\n\n// window.Echo = new Echo({\n//     broadcaster: 'pusher',\n//     key: process.env.MIX_PUSHER_APP_KEY,\n//     cluster: process.env.MIX_PUSHER_APP_CLUSTER,\n//     forceTLS: true\n// });\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/css/demo.css",
    "content": "@media (min-width: 992px){\n.navbar.navbar-hover .nav-item.dropdown:hover>.dropdown-menu,\n.navbar.navbar-hover .nav-item.dropdown>.dropdown-menu .dropdown-item.open+.dropdown-menu {\n    display: block;\n    opacity: 1;\n    pointer-events: auto;\n    visibility: visible;\n    transform: translate(0);\n    animation: none;\n    transition: all .3s ease;\n  }\n}\n@media (min-width: 768px){\n  .ct-sidebar {\n    top: 3rem;\n  }\n}\n\n.ct-navbar{\n  background-color: #212529!important;\n  padding-top: 0.1rem!important;\n  padding-bottom: 0.1rem!important;\n}\n\n.ct-example {\n  position: relative;\n  border: 2px solid #f5f7ff !important;\n  border-bottom: none !important;\n  padding: 1rem 1rem 2rem 1rem;\n  margin-bottom: -1.25rem;\n}\n\n.ct-example .skew-separator.skew-mini:after {\n  height: unset;\n}\n\n.ct-example .skew-separator.skew-top:after {\n  display: none!important;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/css/docs.css",
    "content": ".ct-docs-typography, [class*=\"ct-docs\"] {\n  font-family: Open Sans, sans-serif;\n}\n\n.ct-docs-navbar {\n  position: relative;\n  display: flex;\n  padding: 16px 16px;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: space-between;\n  background-color: #212529 !important;\n  padding-top: 0.1rem !important;\n  padding-bottom: 0.1rem !important;\n  box-shadow: rgba(116, 129, 141, .1) 0 1px 1px 0;\n  flex-direction: row !important;\n  flex-flow: row nowrap;\n  justify-content: flex-start;\n}\n\n.ct-docs-sidebar-product{\n  padding: 4px 24px 20px;\n  display: flex;\n}\n\n.ct-docs-sidebar-product-image{\n  width: 30px;\n}\n\n.ct-docs-sidebar-product-image img{\n  width: 30px;\n}\n\n.ct-docs-sidebar-product-text{\n  margin-left: 5px;\n  margin-top: auto;\n  margin-bottom: auto;\n  color: rgba(0, 0, 0, .85);\n  font-size: 16px;\n  font-weight: 600;\n  line-height: 1.7;\n  text-decoration: none;\n  background-color: transparent;\n}\n\n.ct-docs-navbar-nav-link-inner--text{\n  margin-left: 4px;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-navbar {\n    position: -webkit-sticky;\n    position: sticky;\n    z-index: 1071;\n    top: 0;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-navbar {\n    align-items: center !important;\n  }\n}\n\n@media (max-width: 991.98px) {\n  .ct-docs-navbar {\n    padding-right: 8px;\n    padding-left: 8px;\n  }\n}\n\n.ct-docs-navbar-brand {\n  font-size: 20px;\n  line-height: inherit;\n  display: inline-block;\n  margin-right: 16px;\n  padding-top: 0.0625rem;\n  padding-bottom: 0.0625rem;\n  white-space: nowrap;\n  font-size: 14px;\n  font-weight: 600;\n  letter-spacing: 0.05px;\n  text-transform: uppercase;\n  color: rgba(255, 255, 255, .65);\n}\n\n@media (min-width: 768px) {\n  .ct-docs-navbar-brand {\n    margin-right: 8px !important;\n  }\n}\n\n.ct-docs-navbar-brand-img {\n  height: 30px;\n  vertical-align: middle;\n  border-style: none;\n}\n\n.ct-docs-navbar-text{\n  font-size: 14px;\n  text-transform: uppercase;\n  color: rgba(255, 255, 255, .9) !important;\n}\n\n.ct-docs-navbar-border{\n  margin: 0 10px;\n  height: 15px;\n  border: 1px solid #909090;\n  display: block;\n}\n\n.ct-docs-navbar-nav-left {\n  display: flex;\n  flex-direction: column;\n  margin-bottom: 0;\n  padding-left: 0;\n  list-style: none;\n  display: none !important;\n  flex-direction: row;\n  margin-right: auto !important;\n  margin-left: 24px !important;\n  flex-direction: row !important;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-navbar-nav-left {\n    display: flex !important;\n  }\n}\n\n.ct-docs-nav-item-dropdown {\n  display: inline-block;\n  position: relative;\n}\n\n@media (min-width: 992px) {\n  .ct-docs-nav-item-dropdown {\n    margin-right: 8px;\n  }\n}\n\n.ct-docs-navbar-nav-link {\n  padding-right: 8px;\n  padding-left: 8px;\n  color: rgba(255, 255, 255, .9) !important;\n  font-size: 14px;\n  font-weight: 500;\n  letter-spacing: 0;\n  text-transform: normal;\n  display: block;\n}\n\n.ct-docs-navbar-nav-link:hover {\n  color: #fff !important;\n  background-color: transparent !important;\n}\n\n@media (min-width: 992px) {\n  .ct-docs-navbar-nav-link {\n    padding-top: 16px;\n    padding-bottom: 16px;\n    border-radius: 6px;\n  }\n}\n\n.ct-docs-navbar-dropdown-menu {\n  z-index: 1000;\n  top: 100%;\n  left: 0;\n  display: none;\n  padding: 8px 0;\n  list-style: none;\n  text-align: left;\n  color: #525f7f;\n  border: 0 solid rgba(0, 0, 0, .15);\n  border-radius: 7px;\n  background-color: #fff;\n  background-clip: padding-box;\n  box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);\n  margin: 0;\n  pointer-events: none;\n  opacity: 0;\n  position: static;\n  float: none;\n  min-width: 192px;\n  position: absolute;\n  font-size: 14px;\n}\n\n@media (min-width: 992px) {\n  .ct-docs-navbar-dropdown-menu {\n    margin: 0;\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.ct-docs-navbar-dropdown-item {\n  font-size: 14px;\n  padding: 8px 16px;\n  font-weight: 400;\n  display: block;\n  clear: both;\n  width: 100%;\n  text-align: inherit;\n  white-space: nowrap;\n  color: #212529;\n  border: 0;\n  background-color: transparent;\n  text-decoration: none;\n}\n\n.ct-docs-navbar-dropdown-item:hover{\n  text-decoration: none;\n  color: #16181b;\n  background-color: #f6f9fc;\n}\n\n.ct-docs-navbar-nav-right {\n  display: flex;\n  flex-direction: column;\n  margin-bottom: 0;\n  padding-left: 0;\n  list-style: none;\n  flex-direction: row !important;\n  flex-direction: row;\n  margin-left: 24px !important;\n  display: none !important;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-navbar-nav-right {\n    display: flex !important;\n  }\n}\n\n@media (min-width: 992px) {\n  .ct-docs-navbar-nav-item {\n    margin-right: 8px;\n  }\n}\n\n.ct-docs-btn-upgrade {\n  display: none !important;\n  margin-right: 8px;\n  color: #5e72e4;\n  font-size: 14px;\n  position: relative;\n  transition: all 0.15s ease;\n  letter-spacing: 0.025em;\n  text-transform: none;\n  will-change: transform;\n  border-color: #fff;\n  background-color: #fff;\n  box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);\n  font-weight: 600;\n  line-height: 1.5;\n  padding: 10px 20px;\n  cursor: pointer;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n  text-align: center;\n  vertical-align: middle;\n  border: 1px solid transparent;\n  border-radius: 04px;\n  text-decoration: none;\n}\n\n@media (min-width: 576px) {\n  .ct-docs-btn-upgrade {\n    margin-left: 16px !important;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-btn-upgrade {\n    display: block !important;\n  }\n}\n\n.ct-docs-navbar-toggler {\n  font-size: 20px;\n  line-height: 1;\n  padding: 4px 12px;\n  border: 1px solid transparent;\n  border-radius: 4px;\n  background-color: transparent;\n  color: rgba(255, 255, 255, .95);\n  border-color: transparent;\n  cursor: pointer;\n  line-height: 1;\n  margin-left: auto !important;\n  display: block !important;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-navbar-toggler {\n    display: none !important;\n  }\n}\n\n.ct-docs-navbar-toggler-icon {\n  display: inline-block;\n  width: 1.5em;\n  height: 1.5em;\n  content: '';\n  vertical-align: middle;\n  background: no-repeat center center;\n  background-size: 100% 100%;\n  background-image: url('data:image/svg+xml,%3csvg xmlns=\\'http://www.w3.org/2000/svg\\' width=\\'30\\' height=\\'30\\' viewBox=\\'0 0 30 30\\'%3e%3cpath stroke=\\'rgba(255, 255, 255, 0.95)\\' stroke-linecap=\\'round\\' stroke-miterlimit=\\'10\\' stroke-width=\\'2\\' d=\\'M4 7h22M4 15h22M4 23h22\\'/%3e%3c/svg%3e');\n}\n\n.ct-docs-main-container {\n  position: relative !important;\n  width: 100%;\n  margin-right: auto;\n  margin-left: auto;\n  padding-right: 15px;\n  padding-left: 15px;\n}\n\n.ct-docs-main-content-row {\n  display: flex;\n  margin-right: -15px;\n  margin-left: -15px;\n  flex-wrap: wrap;\n}\n\n@media (min-width: 1200px) {\n  .ct-docs-main-content-row {\n    flex-wrap: nowrap !important;\n  }\n}\n\n.ct-docs-main-footer-row {\n  bottom: 0;\n  width: 100% !important;\n  position: absolute !important;\n  border-top: 1px solid #e9ecef !important;\n  display: flex;\n  margin-right: -15px;\n  margin-left: -15px;\n  flex-wrap: wrap;\n}\n\n.ct-docs-main-footer-blank-col {\n  max-width: 100%;\n  flex: 0 0 100%;\n  position: relative;\n  width: 100%;\n  padding-right: 15px;\n  padding-left: 15px;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-main-footer-blank-col {\n    max-width: 25%;\n    flex: 0 0 25%;\n  }\n}\n\n@media (min-width: 1200px) {\n  .ct-docs-main-footer-blank-col {\n    max-width: 16.66667%;\n    flex: 0 0 16.66667%;\n  }\n}\n\n.ct-docs-main-footer-col {\n  max-width: 100%;\n  flex: 0 0 100%;\n  position: relative;\n  width: 100%;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-main-footer-col {\n    max-width: 75%;\n    flex: 0 0 75%;\n  }\n}\n\n.ct-docs-footer {\n  padding: 30px 0;\n  background: #f8f9fe;\n  padding-bottom: 16px !important;\n  padding-top: 16px !important;\n  background-color: transparent !important;\n  display: block;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-footer {\n    padding-left: 48px !important;\n  }\n}\n\n.ct-docs-footer-inner-row {\n  align-items: center !important;\n  display: flex;\n  margin-right: -15px;\n  margin-left: -15px;\n  flex-wrap: wrap;\n}\n\n@media (min-width: 992px) {\n  .ct-docs-footer-inner-row {\n    justify-content: space-between !important;\n  }\n}\n\n.ct-docs-footer-col {\n  position: relative;\n  width: 100%;\n  padding-right: 15px;\n  padding-left: 15px;\n}\n\n@media (min-width: 992px) {\n  .ct-docs-footer-col {\n    max-width: 50%;\n    flex: 0 0 50%;\n  }\n}\n\n.ct-docs-footer-copyright {\n  font-size: 14px;\n  color: #8898aa !important;\n  text-align: center !important;\n}\n\n.ct-docs-footer-copyright a:hover{\n  color: #233dd2;\n}\n\n@media (min-width: 992px) {\n  .ct-docs-footer-copyright {\n    text-align: left !important;\n  }\n}\n\n.ct-docs-footer-copyright-author {\n  font-weight: 600 !important;\n  margin-left: 4px !important;\n  text-decoration: none;\n  color: #5e72e4;\n  background-color: transparent;\n}\n\n.ct-docs-footer-nav-footer {\n  display: flex;\n  margin-bottom: 0;\n  padding-left: 0;\n  list-style: none;\n  flex-wrap: wrap;\n  justify-content: center !important;\n}\n\n@media (min-width: 992px) {\n  .ct-docs-footer-nav-footer {\n    justify-content: flex-end !important;\n  }\n}\n\n.ct-docs-footer-nav {\n  color: #8898aa !important;\n  font-size: 14px;\n  display: block;\n  padding: 4px 12px;\n  text-decoration: none;\n  background-color: transparent;\n}\n\n.ct-docs-footer-nav-link {\n  color: #8898aa !important;\n  font-size: 14px;\n  font-weight: 400;\n  display: block;\n  padding: 4px 12px;\n  text-decoration: none;\n  background-color: transparent;\n}\n\n.ct-docs-footer-nav-link:hover {\n  color: #525f7f !important;\n}\n\n.ct-docs-sidebar-col {\n  position: relative;\n  width: 100%;\n  padding-right: 15px;\n  padding-left: 15px;\n  max-width: 100%;\n  flex: 0 0 100%;\n  border-bottom: 1px solid #e6ecf1;\n  background-color: #f5f7f9;\n  order: 0;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-sidebar-col {\n    max-width: 25%;\n    flex: 0 0 25%;\n  }\n}\n\n@media (min-width: 1200px) {\n  .ct-docs-sidebar-col {\n    max-width: 16.66667%;\n    flex: 0 0 16.66667%;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-sidebar-col {\n    border-right: 1px solid #e6ecf1;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-sidebar-col {\n    position: -webkit-sticky;\n    position: sticky;\n    z-index: 1000;\n    top: 48px;\n    height: calc(100vh - 48px);\n  }\n}\n\n@media (min-width: 1200px) {\n  .ct-docs-sidebar-col {\n    flex: 0 1 320px;\n  }\n}\n\n.ct-docs-sidebar-collapse-links {\n  display: none;\n  margin-right: -15px;\n  margin-left: -15px;\n  padding: 0;\n  max-height: 0;\n  overflow: hidden;\n  transition: max-height 0.15s ease-out, padding 0.15s ease-out;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-sidebar-collapse-links {\n    display: block !important;\n    padding: 32px 0 16px;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-sidebar-collapse-links {\n    overflow-y: auto;\n    max-height: calc(100vh - 80px);\n  }\n}\n\n.ct-docs-toc-item-active {\n  margin-bottom: 16px;\n}\n\n.ct-docs-toc-item-active>.ct-docs-toc-link {\n  color: rgba(0, 0, 0, .85);\n  font-size: 14px;\n  font-weight: 600;\n  display: block;\n  padding: 4px 24px;\n  text-decoration: none;\n  background-color: transparent;\n}\n\n.ct-docs-toc-item-active>.ct-docs-nav-sidenav {\n  display: block;\n  margin-bottom: 0;\n  padding-left: 0;\n  list-style: none;\n  flex-wrap: wrap;\n}\n\n.ct-docs-nav-sidenav>li>a {\n  font-size: 13.5px;\n  font-weight: 400;\n  display: block;\n  padding: 4px 24px;\n  color: #4c555a;\n  text-decoration: none;\n  background-color: transparent;\n}\n\n.ct-docs-nav-sidenav-active>a {\n  font-weight: 500;\n  position: relative;\n  padding-left: 32px;\n  color: #0099e5;\n  background-color: transparent;\n}\n\n.ct-docs-sidenav-pro-badge {\n  text-transform: uppercase;\n  float: right !important;\n  color: #2643e9;\n  background-color: #eaecfb;\n  font-size: 66%;\n  font-weight: 600;\n  line-height: 1;\n  display: inline-block;\n  padding: .35rem .375rem;\n  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;\n  text-align: center;\n  vertical-align: baseline;\n  white-space: nowrap;\n  border-radius: 6px;\n}\n\n.ct-docs-badge-pro{\n  font-size: 10px;\n  font-weight: 600;\n  line-height: 1;\n  display: inline-block;\n  padding: 6px;\n  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;\n  text-align: center;\n  vertical-align: baseline;\n  white-space: nowrap;\n  border-radius: 5px;\n  color: #2643e9;\n  background-color: #eaecfb;\n  text-transform: uppercase;\n}\n\n.ct-docs-toc-col {\n  position: -webkit-sticky;\n  position: sticky;\n  top: 64px;\n  overflow-y: auto;\n  height: calc(100vh - 64px);\n  font-size: 14px;\n  padding-top: 32px;\n  padding-bottom: 24px;\n  order: 2;\n  display: none !important;\n  width: 100%;\n  padding-right: 15px;\n  padding-left: 15px;\n}\n\n@media (min-width: 1200px) {\n  .ct-docs-toc-col {\n    display: block !important;\n  }\n}\n\n@media (min-width: 1200px) {\n  .ct-docs-toc-col {\n    max-width: 16.66667%;\n    flex: 0 0 16.66667%;\n  }\n}\n\n.ct-docs-toc-col .section-nav {\n  padding-left: 0;\n  border-left: 1px solid #eee;\n}\n\n.ct-docs-toc-col .toc-entry {\n  font-size: 16px;\n  display: block;\n}\n\n.ct-docs-toc-col .toc-entry a {\n  font-weight: 400;\n  font-size: 14.4px;\n  display: block;\n  padding: 2px 24px;\n  color: #99979c;\n  text-decoration: none;\n  background-color: transparent;\n}\n\n.ct-docs-toc-col .toc-entry a:hover {\n  text-decoration: none;\n  color: #5e72e4;\n}\n\n.ct-docs-toc-col .section-nav ul {\n  padding-left: 16px;\n}\n\n.ct-docs-content-col {\n  position: relative;\n  width: 100%;\n  padding-right: 15px;\n  padding-left: 15px;\n  display: block;\n  order: 1;\n  margin-bottom: 96px !important;\n  max-width: 100%;\n  flex: 0 0 100%;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-content-col {\n    padding-left: 48px !important;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-content-col {\n    padding-bottom: 16px !important;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-content-col {\n    padding-top: 16px !important;\n  }\n}\n\n@media (min-width: 576px) {\n  .ct-docs-content-col {\n    margin-bottom: 72px !important;\n  }\n}\n\n@media (min-width: 768px) {\n  .ct-docs-content-col {\n    max-width: 66.66667%;\n    flex: 0 0 66.66667%;\n  }\n}\n\n@media (min-width: 1200px) {\n  .ct-docs-content-col {\n    max-width: 58.33333%;\n    flex: 0 0 58.33333%;\n  }\n}\n\n.ct-docs-content-col .ct-docs-page-title {\n  margin-bottom: 24px;\n  padding-left: 20px;\n  border-left: 2px solid #5e72e4;\n}\n\n.ct-docs-content-col .ct-docs-page-title-lead {\n  font-weight: 500;\n  color: #3b454e;\n}\n\n@media (min-width: 576px) {\n  .ct-docs-content-col .ct-docs-page-title-lead {\n    font-size: 14px;\n    max-width: 80%;\n    margin-bottom: 16px;\n  }\n}\n\n@media (min-width: 992px) {\n  .ct-docs-content-col>ol, .ct-docs-content-col>p, .ct-docs-content-col>ul {\n    max-width: 80%;\n  }\n}\n\n.ct-docs-page-h1-title {\n  font-family: inherit;\n  color: #32325d;\n  font-weight: 300;\n  margin-top: 16px;\n  margin-bottom: 8px;\n  font-size: 26px;\n}\n\n@media (min-width: 576px) {\n  .ct-docs-page-h1-title {\n    font-size: 24px;\n    font-weight: 600;\n  }\n}\n\n@media (min-width: 576px) {\n  .ct-docs-page-h1-title {\n    margin-top: 8px !important;\n  }\n}\n\n@media (min-width: 576px) {\n  .ct-docs-page-h1-title {\n    display: inline-block !important;\n  }\n}\n\n.ct-docs-page-title-pro-line {\n  font-size: 24px !important;\n  font-weight: 600 !important;\n}\n\n.ct-docs-page-title-pro-bage {\n  color: #fff !important;\n  font-size: 14px !important;\n  font-weight: 600 !important;\n  padding-left: 16px !important;\n  padding-right: 16px !important;\n  padding-bottom: 8px !important;\n  padding-top: 8px !important;\n  display: inline !important;\n  border-radius: 6px !important;\n  background-color: #5e72e4 !important;\n}\n\n@media (max-width: 1200px) {\n  .ct-docs-page-h1-title {\n    font-size: calc(1.2875rem + .45vw);\n  }\n}\n\n.ct-docs-navbar-dropdown-menu-show {\n  display: block;\n  opacity: 1;\n  pointer-events: auto;\n  visibility: visible;\n  transform: translate(0);\n  animation: none;\n  transition: all .3s ease;\n}\n\n.ct-docs-navbar-dropdown-menu::before {\n  position: absolute;\n  z-index: -5;\n  bottom: 100%;\n  left: 20px;\n  display: block;\n  width: 16px;\n  height: 16px;\n  content: '';\n  transform: rotate(-45deg) translateY(16px);\n  border-radius: 4px;\n  background: #fff;\n  box-shadow: none;\n}\n\nli.ct-docs-nav-sidenav-active a {\n  font-weight: 500;\n  position: relative;\n  padding-left: 32px;\n  color: #0099e5;\n  background-color: transparent;\n}\n\nli.ct-docs-nav-sidenav-active a:before {\n  position: absolute;\n  top: 50%;\n  left: 24px;\n  width: 2px;\n  height: 16px;\n  content: '';\n  transform: translateY(-50%);\n  background-color: #0099e5;\n}\n\n.ct-docs-content-col a.ct-docs-start-button {\n  font-size: 14px;\n  font-weight: 600;\n  position: relative;\n  transition: all .15s ease;\n  letter-spacing: .025em;\n  text-transform: none;\n  padding: 10px 20px;\n  border-radius: 4px;\n  will-change: transform;\n  margin-bottom: 24px !important;\n  margin-top: 24px !important;\n  color: #fff;\n  border-color: #5e72e4;\n  background-color: #5e72e4;\n  box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);\n  display: inline-block;\n}\n\n.ct-docs-content-col a.ct-docs-start-button:hover {\n  transform: translateY(-1px);\n  box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);\n  color: #fff;\n  border-color: #5e72e4;\n  background-color: #5e72e4;\n}\n\n.ct-docs-content-col a.ct-docs-start-button:active {\n  color: #fff;\n  border-color: #5e72e4;\n  background-color: #324cdd;\n}\n\n.docs {\n  background: #fff;\n}\n\n.btn-clipboard {\n  font-size: 12px;\n  font-weight: 400;\n  position: absolute;\n  z-index: 10;\n  top: 16px;\n  right: 16px;\n  display: block;\n  padding: 4px 8px;\n  cursor: pointer;\n  color: #fff;\n  border: 0;\n  border-radius: 4px;\n  background-color: transparent;\n  background-color: #5e72e4;\n}\n\n.btn-clipboard:hover {\n  color: #fff;\n  background-color: #324cdd;\n}\n\npre[class*=language-] {\n  overflow: auto;\n  margin: 0;\n  padding: 20px;\n}\n\ncode[class*=language-], pre[class*=language-] {\n  font-family: Consolas, Menlo, Monaco, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', 'Courier New', Courier, monospace;\n  font-size: 14px;\n  line-height: 1.375;\n  text-align: left;\n  white-space: pre;\n  word-spacing: normal;\n  word-break: normal;\n  -moz-tab-size: 4;\n  -o-tab-size: 4;\n  tab-size: 4;\n  -webkit-hyphens: none;\n  hyphens: none;\n  color: #5e6687;\n  border-radius: 4px;\n  background: #f5f7ff;\n  direction: ltr;\n  -ms-hyphens: none;\n}\n\n.token.tag {\n  color: #3d8fd1;\n}\n\n.token.attr-name {\n  color: #c76b29;\n}\n\n.token.attr-value, .token.control, .token.directive, .token.keyword, .token.unit {\n  color: #ac9739;\n}\n\n.token.punctuation {\n  color: #5e6687;\n}\n\n.ct-docs-content-col>h1 {\n  font-size: 26px;\n  font-weight: 600;\n  margin-top: 48px;\n  line-height: 1.5;\n  margin-bottom: 8px;\n  color: #32325d;\n}\n\n.ct-docs-content-col>h2 {\n  font-size: 24px;\n  font-weight: 600;\n  margin-top: 48px;\n  line-height: 1.5;\n  margin-bottom: 8px;\n  color: #32325d;\n}\n\n.ct-docs-content-col>h3 {\n  font-size: 20px;\n  font-weight: 600;\n  margin-top: 40px;\n  line-height: 1.5;\n  margin-bottom: 8px;\n  color: #32325d;\n}\n\n.ct-docs-content-col>h4 {\n  font-size: 15px;\n  font-weight: 600;\n  margin-top: 40px;\n  line-height: 1.5;\n  margin-bottom: 8px;\n  color: #32325d;\n}\n\n.ct-docs-content-col>p {\n  font-size: 16px;\n  font-weight: 300;\n  line-height: 1.7;\n  margin-top: 0;\n  margin-bottom: 16px;\n  text-align: left;\n  color: #525f7f;\n}\n\n.ct-docs-content-col > a,\n.ct-docs-content-col > p > a,\n.ct-docs-content-col > p > strong > a,\n.ct-docs-content-col > ul > li,\n.ct-docs-content-col > ul > li > a,\n.ct-docs-description a {\n  text-decoration: none;\n  color: #5e72e4;\n  background-color: transparent;\n}\n\n.ct-docs-content-col > ol > li > p{\n  color: #525f7f;\n}\n\n.ct-docs-content-col>ul.pagination,\n.ct-docs-content-col>ul.breadcrumb {\n  list-style-type: none;\n}\n\n.ct-docs-content-col>ul {\n  list-style-type: disc;\n}\n\n.ct-docs-content-col>ol {\n  list-style-type: decimal;\n}\n\n.ct-docs-content-col>ul,\n.ct-docs-content-col>ol {\n  max-width: 80%;\n  margin-top: 0;\n  margin-bottom: 15px;\n  margin-top: 30px;\n}\n\n.ct-docs-content-col>ul>li,\n.ct-docs-content-col>ol>li {\n  margin-bottom: 4px;\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 1.5;\n  color: #525f7f;\n}\n\n.ct-docs-info-row {\n  margin-top: 48px !important;\n  display: flex;\n  margin-right: -15px;\n  margin-left: -15px;\n  flex-wrap: wrap;\n}\n\n.ct-docs-info-col {\n  position: relative;\n  width: 100%;\n  padding-right: 15px;\n  padding-left: 15px;\n}\n\n.ct-docs-info-col a{\n  text-decoration: none;\n  color: #5e72e4;\n}\n\n.ct-docs-info-col a:hover{\n  text-decoration: none;\n  color: #233dd2;\n}\n\n@media (min-width: 768px) {\n  .ct-docs-info-col {\n    max-width: 33.33333%;\n    flex: 0 0 33.33333%;\n  }\n}\n\n.ct-docs-info-col > h6 {\n  font-size: 1rem;\n  font-family: inherit;\n  font-weight: 600;\n  line-height: 1.5;\n  margin-bottom: .5rem;\n  color: #32325d;\n  margin-top: 0;\n  text-align: left;\n  text-transform: inherit;\n}\n\n.ct-docs-info-col > p,\n.ct-docs-info-col > p.description {\n  font-size: .875rem;\n  font-weight: 300;\n  line-height: 1.7;\n  margin-top: 0;\n  margin-bottom: 1rem;\n  text-align: left;\n  color: #525f7f;\n  font-family: Open Sans,sans-serif;\n}\n\n.ct-docs-info-icon-primary,\n.ct-docs-info-icon-danger,\n.ct-docs-info-icon-warning {\n  color: #fff !important;\n  display: inline-flex;\n  padding: 12px;\n  text-align: center;\n  border-radius: 50%;\n  align-items: center;\n  justify-content: center;\n  margin-bottom: 16px !important;\n  width: 48px;\n  height: 48px;\n}\n\n.ct-docs-info-icon-primary {\n  background: linear-gradient(87deg, #5e72e4 0, #825ee4 100%) !important;\n}\n\n.ct-docs-info-icon-danger {\n  background: linear-gradient(87deg, #f5365c 0, #f56036 100%) !important;\n}\n\n.ct-docs-info-icon-warning {\n  background: linear-gradient(87deg, #fb6340 0, #fbb140 100%) !important;\n}\n\n.ct-docs-content-col>table>tbody>tr>td,\n.ct-docs-content-col>table>tbody>tr>th,\n.ct-docs-content-col>table>tfoot>tr>td,\n.ct-docs-content-col>table>tfoot>tr>th,\n.ct-docs-content-col>table>thead>tr>td,\n.ct-docs-content-col>table>thead>tr>th {\n  padding: 16px;\n  vertical-align: top;\n  border: 1px solid #e9ecef;\n}\n\n.ct-docs-content-col>table.table>tbody>tr>td{\n  color: #525f7f !important;\n}\n\n.ct-docs-content-col>table.table>thead>tr>th{\n  color: #525f7f !important;\n}\n\n.ct-docs-content-col>table>tbody>tr>td>a{\n  color: #5e72e4;\n}\n\n.ct-docs-content-col>table>tbody>tr>td>a:hover{\n  color: #233dd2;\n}\n\n.ct-docs-content-col >table.bg-dark>tbody>tr>td,\n.ct-docs-content-col >table.bg-dark>tbody>tr>th,\n.ct-docs-content-col >table.bg-dark>tfoot>tr>td,\n.ct-docs-content-col >table.bg-dark>tfoot>tr>th,\n.ct-docs-content-col >table.bg-dark>thead>tr>td,\n.ct-docs-content-col >table.bg-dark>thead>tr>th{\n  border: none;\n}\n\n.ct-docs-content-col > table {\n  width: 100%;\n  max-width: 100%;\n  margin-bottom: 16px;\n}\n\n.color-swatch {\n  margin: 1rem 0;\n  border-radius: .25rem;\n  background-color: #f4f5f7;\n}\n\n.color-swatch-header {\n  position: relative;\n  height: 0;\n  padding-bottom: 50%;\n  border: 1px solid transparent;\n  border-radius: .25rem .25rem 0 0;\n}\n\n.color-swatch-body {\n  position: relative;\n  left: 50%;\n  float: left;\n  padding: 10px 0;\n  transform: translateX(-50%);\n}\n\n.color-swatch-body .prop-item-wrap {\n  float: left;\n  min-width: 65px;\n  padding: 0 15px;\n}\n\n.color-swatch-body .prop-item {\n  padding: 15px 0;\n}\n\n.color-swatch-body .prop-item .label {\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 16px;\n  text-transform: uppercase;\n  color: #62748c;\n}\n\n.color-swatch-body .prop-item .value {\n  font-size: 14px;\n  font-weight: 400;\n}\n\n.color-swatch:after {\n  display: table;\n  clear: both;\n  content: ' ';\n}\n\n.ct-docs-content-col #grid-system~.ct-example-row .row div[class^=\"col\"] span {\n  font-size: 14px;\n  display: block;\n  margin: 16px 0;\n  padding: 12px;\n  color: #393f49;\n  border-radius: 4px;\n  border: 1px solid rgba(0, 0, 0, .1);\n  box-shadow: none;\n}\n\n.ct-docs-content-col .row div[class^=\"col\"] .btn-icon-clipboard span {\n  border: none;\n  margin-top: 0;\n  margin-bottom: 0;\n  padding-top: 0;\n  padding-bottom: 0;\n}\n\n.ct-example {\n  position: relative;\n  border: 2px solid #f5f7ff !important;\n  border-bottom: none !important;\n  padding: 1rem 1rem 2rem 1rem;\n  margin-bottom: -1.25rem;\n}\n\n.ct-docs-content-col>ul.nav {\n  list-style-type: none;\n}\n\n.ct-docs-alert {\n  font-size: 14px;\n  font-weight: 400;\n  color: #fff;\n  border-color: #7889e8;\n  background-color: #7889e8;\n  position: relative;\n  padding: 16px 24px;\n  margin-bottom: 16px;\n  border: 1px solid transparent;\n  border-radius: 6px;\n}\n\n/* gray colors */\n\n.table-colors .swatch,\n.table-colors:first-child .swatch {\n  display: inline-block;\n  float: left;\n  width: 40px;\n  height: 40px;\n  margin-right: 20px;\n  border: 1px solid transparent;\n  border-radius: 4px;\n}\n\n.table-colors td:nth-child(1),\n.table-colors:first-child td:nth-child(1) {\n  line-height: 40px;\n}\n\n/* START Material Dashboard Dark Particularity */\n\n.dark-edition .ct-example {\n  background: #202940;\n  color: #ffffff;\n}\n\n.dark-edition .ct-example .nav-link {\n  color: #8b92a9;\n}\n\n.docs.dark-edition .ct-docs-content-col > .nav {\n  padding: 15px;\n  background: #202940;\n}\n\n.docs.dark-edition .slider {\n  background: #c8c8c8 !important;\n}\n\n.docs.dark-edition .ct-chart .ct-series-a .ct-area,\n.docs.dark-edition .ct-chart .ct-series-a .ct-bar,\n.docs.dark-edition .ct-chart .ct-series-a .ct-line,\n.docs.dark-edition .ct-chart .ct-series-a .ct-point,\n.docs.dark-edition .ct-chart .ct-series-a .ct-slice-donut,\n.docs.dark-edition .ct-chart .ct-series-a .ct-slice-donut-solid,\n.docs.dark-edition .ct-chart .ct-series-a .ct-slice-pie {\n  stroke: #ffffff !important;\n}\n\n.docs.dark-edition .ct-chart .ct-label {\n  color: #ffffff\n}\n\n.docs.dark-edition .ct-chart .ct-grid {\n  stroke: hsl(0deg 0% 100% / 20%);\n}\n\n.dark-edition .list-group-item,\n.dark-edition .alert-icon .material-icons,\n.dark-edition .ct-example .nav-link:hover,\n.dark-edition .ct-example .nav-link.active {\n  color: #ffffff !important;\n}\n\n.dark-edition .iframe-container iframe {\n  width: 100%;\n  height: 60vh;\n}\n\n.dark-edition .btn.btn-fab {\n  font-size: 1rem;\n}\n\n/* STOP Material Dashboard Dark Particularity */\n\n\n\n\n/* START Black Dashboard Particularity */\n\n.black-design-edition .ct-example{\n  background: linear-gradient(#1e1e2f,#1e1e24);\n}\n\n.black-design-edition .ct-example .dropdown.btn-group .btn{\n  margin: 0;\n}\n/* STOP Black Dashboard Particularity */\n\n\n.ct-docs-content-col > hr {\n  margin-top: 2rem;\n  margin-bottom: 2rem;\n  border: 0;\n  border-top: 1px solid rgba(0,0,0,.1);\n  overflow: visible;\n  box-sizing: content-box;\n  height: 0;\n  display: block;\n  font-family: Open Sans,sans-serif;\n  font-size: 1rem;\n  font-weight: 400;\n  line-height: 1.5;\n  text-align: left;\n  color: #525f7f;\n}\n\n.ct-docs-content-col > ul > li > ul,\n.ct-docs-content-col > ol > li > ol {\n  margin-left: 40px;\n}\n.ct-docs-content-col > ul > li > ul > li,\n.ct-docs-content-col > ol > li > ol > li {\n  margin-bottom: .25rem;\n}\n.ct-docs-content-col > ul > li > ul {\n  list-style-type: circle;\n}\n.ct-docs-content-col > ol > li > ol {\n  list-style-type: decimal;\n}\n\n.highlight .language-js .token.string,\n.highlight .token.language-javascript .token.string {\n  color: #22a2c9;\n}\n.highlight .language-js .token.function,\n.highlight .token.language-javascript .token.function {\n  color: #3d8fd1;\n}\n.highlight .language-js .token.operator,\n.highlight .token.language-javascript .token.operator {\n  color: #c76b29;\n}\n.highlight .language-js .token.comment,\n.highlight .token.language-javascript .token.comment {\n  color: #898ea4;\n}\n.highlight .language-js .token.template-string .token.template-punctuation.string,\n.highlight .language-js .token.template-string .token.string {\n  color: #399c58;\n}\n.highlight .language-js .token.class-name,\n.highlight .token.language-javascript .token.class-name{\n  color: #b586c3;\n}\n.highlight .language-js .token.boolean,\n.highlight .token.language-javascript .token.boolean {\n  color: #fb8002;\n}\n.highlight .token.language-javascript .token.keyword {\n  color: #ac9739;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/css/material-dashboard.css",
    "content": "/*!\n * Bootstrap v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n */\n @media (max-width:500px){\n\n  .bottom-footer {\n    bottom: -3% !important;\n  }\n\n  .page-header{\n    overflow:scroll !important;\n  }\n }\n .bottom-footer {\n  bottom: 2%\n}\n\n.signin-margin{\n  margin-top: 5rem !important;\n  margin-bottom: 5rem !important;\n}\n .inputerror{\n   font-size: 0.75rem;\n   margin-top: 0.30rem;\n }\n\n input:-webkit-autofill,\ninput:-webkit-autofill:hover,\ninput:-webkit-autofill:focus,\ntextarea:-webkit-autofill,\ntextarea:-webkit-autofill:hover,\ntextarea:-webkit-autofill:focus,\nselect:-webkit-autofill,\nselect:-webkit-autofill:hover,\nselect:-webkit-autofill:focus {\n  -webkit-text-fill-color: black;\n  transition: background-color 5000s ease-in-out 0s;\n}\n\n:root {\n  --bs-blue: #63B3ED;\n  --bs-indigo: #596CFF;\n  --bs-purple: #6f42c1;\n  --bs-pink: #d63384;\n  --bs-red: #F56565;\n  --bs-orange: #fd7e14;\n  --bs-yellow: #FBD38D;\n  --bs-green: #81E6D9;\n  --bs-teal: #20c997;\n  --bs-cyan: #0dcaf0;\n  --bs-white: #fff;\n  --bs-gray: #6c757d;\n  --bs-gray-dark: #343a40;\n  --bs-gray-100: #f8f9fa;\n  --bs-gray-200: #f0f2f5;\n  --bs-gray-300: #dee2e6;\n  --bs-gray-400: #ced4da;\n  --bs-gray-500: #adb5bd;\n  --bs-gray-600: #6c757d;\n  --bs-gray-700: #495057;\n  --bs-gray-800: #343a40;\n  --bs-gray-900: #212529;\n  --bs-primary: #e91e63;\n  --bs-secondary: #7b809a;\n  --bs-success: #4CAF50;\n  --bs-info: #1A73E8;\n  --bs-warning: #fb8c00;\n  --bs-danger: #F44335;\n  --bs-light: #f0f2f5;\n  --bs-dark: #344767;\n  --bs-white: #fff;\n  --bs-primary-rgb: 233, 30, 99;\n  --bs-secondary-rgb: 123, 128, 154;\n  --bs-success-rgb: 76, 175, 80;\n  --bs-info-rgb: 26, 115, 232;\n  --bs-warning-rgb: 251, 140, 0;\n  --bs-danger-rgb: 244, 67, 53;\n  --bs-light-rgb: 240, 242, 245;\n  --bs-dark-rgb: 52, 71, 103;\n  --bs-white-rgb: 255, 255, 255;\n  --bs-white-rgb: 255, 255, 255;\n  --bs-black-rgb: 0, 0, 0;\n  --bs-body-color-rgb: 123, 128, 154;\n  --bs-body-bg-rgb: 255, 255, 255;\n  --bs-font-sans-serif: \"Roboto\", Helvetica, Arial, sans-serif;\n  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));\n  --bs-body-font-family: var(--bs-font-sans-serif);\n  --bs-body-font-size: 1rem;\n  --bs-body-font-weight: 400;\n  --bs-body-line-height: 1.5;\n  --bs-body-color: #7b809a;\n  --bs-body-bg: #fff; }\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box; }\n\n@media (prefers-reduced-motion: no-preference) {\n  :root {\n    scroll-behavior: smooth; } }\n\nbody {\n  margin: 0;\n  font-family: var(--bs-body-font-family);\n  font-size: var(--bs-body-font-size);\n  font-weight: var(--bs-body-font-weight);\n  line-height: var(--bs-body-line-height);\n  color: var(--bs-body-color);\n  text-align: var(--bs-body-text-align);\n  background-color: var(--bs-body-bg);\n  -webkit-text-size-adjust: 100%;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }\n\nhr {\n  margin: 1rem 0;\n  color: inherit;\n  background-color: currentColor;\n  border: 0;\n  opacity: 0.25; }\n\nhr:not([size]) {\n  height: 1px; }\n\nh1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {\n  margin-top: 0;\n  margin-bottom: 0.5rem;\n  font-weight: 400;\n  line-height: 1.2;\n  color: #344767; }\n\nh1, .h1 {\n  font-size: calc(1.425rem + 2.1vw); }\n  @media (min-width: 1200px) {\n    h1, .h1 {\n      font-size: 3rem; } }\n\nh2, .h2 {\n  font-size: calc(1.35rem + 1.2vw); }\n  @media (min-width: 1200px) {\n    h2, .h2 {\n      font-size: 2.25rem; } }\n\nh3, .h3 {\n  font-size: calc(1.3125rem + 0.75vw); }\n  @media (min-width: 1200px) {\n    h3, .h3 {\n      font-size: 1.875rem; } }\n\nh4, .h4 {\n  font-size: calc(1.275rem + 0.3vw); }\n  @media (min-width: 1200px) {\n    h4, .h4 {\n      font-size: 1.5rem; } }\n\nh5, .h5 {\n  font-size: 1.25rem; }\n\nh6, .h6 {\n  font-size: 1rem; }\n\np {\n  margin-top: 0;\n  margin-bottom: 1rem; }\n\nabbr[title],\nabbr[data-bs-original-title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n  cursor: help;\n  -webkit-text-decoration-skip-ink: none;\n          text-decoration-skip-ink: none; }\n\naddress {\n  margin-bottom: 1rem;\n  font-style: normal;\n  line-height: inherit; }\n\nol,\nul {\n  padding-left: 2rem; }\n\nol,\nul,\ndl {\n  margin-top: 0;\n  margin-bottom: 1rem; }\n\nol ol,\nul ul,\nol ul,\nul ol {\n  margin-bottom: 0; }\n\ndt {\n  font-weight: 600; }\n\ndd {\n  margin-bottom: .5rem;\n  margin-left: 0; }\n\nblockquote {\n  margin: 0 0 1rem; }\n\nb,\nstrong {\n  font-weight: 700; }\n\nsmall, .small {\n  font-size: 0.875em; }\n\nmark, .mark {\n  padding: 0.2em;\n  background-color: #fcf8e3; }\n\nsub,\nsup {\n  position: relative;\n  font-size: 0.75em;\n  line-height: 0;\n  vertical-align: baseline; }\n\nsub {\n  bottom: -.25em; }\n\nsup {\n  top: -.5em; }\n\na {\n  color: #e91e63;\n  text-decoration: none; }\n  a:hover {\n    color: #e91e63;\n    text-decoration: none; }\n\na:not([href]):not([class]), a:not([href]):not([class]):hover {\n  color: inherit;\n  text-decoration: none; }\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: var(--bs-font-monospace);\n  font-size: 1em;\n  direction: ltr /* rtl:ignore */;\n  unicode-bidi: bidi-override; }\n\npre {\n  display: block;\n  margin-top: 0;\n  margin-bottom: 1rem;\n  overflow: auto;\n  font-size: 0.875em; }\n  pre code {\n    font-size: inherit;\n    color: inherit;\n    word-break: normal; }\n\ncode {\n  font-size: 0.875em;\n  color: #d63384;\n  word-wrap: break-word; }\n  a > code {\n    color: inherit; }\n\nkbd {\n  padding: 0.2rem 0.4rem;\n  font-size: 0.875em;\n  color: #fff;\n  background-color: #212529;\n  border-radius: 0.125rem; }\n  kbd kbd {\n    padding: 0;\n    font-size: 1em;\n    font-weight: 600; }\n\nfigure {\n  margin: 0 0 1rem; }\n\nimg,\nsvg {\n  vertical-align: middle; }\n\ntable {\n  caption-side: bottom;\n  border-collapse: collapse; }\n\ncaption {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  color: #6c757d;\n  text-align: left; }\n\nth {\n  text-align: inherit;\n  text-align: -webkit-match-parent; }\n\nthead,\ntbody,\ntfoot,\ntr,\ntd,\nth {\n  border-color: inherit;\n  border-style: solid;\n  border-width: 0; }\n\nlabel {\n  display: inline-block; }\n\nbutton {\n  border-radius: 0; }\n\nbutton:focus:not(:focus-visible) {\n  outline: 0; }\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n  margin: 0;\n  font-family: inherit;\n  font-size: inherit;\n  line-height: inherit; }\n\nbutton,\nselect {\n  text-transform: none; }\n\n[role=\"button\"] {\n  cursor: pointer; }\n\nselect {\n  word-wrap: normal; }\n  select:disabled {\n    opacity: 1; }\n\n[list]::-webkit-calendar-picker-indicator {\n  display: none; }\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button; }\n  button:not(:disabled),\n  [type=\"button\"]:not(:disabled),\n  [type=\"reset\"]:not(:disabled),\n  [type=\"submit\"]:not(:disabled) {\n    cursor: pointer; }\n\n::-moz-focus-inner {\n  padding: 0;\n  border-style: none; }\n\ntextarea {\n  resize: vertical; }\n\nfieldset {\n  min-width: 0;\n  padding: 0;\n  margin: 0;\n  border: 0; }\n\nlegend {\n  float: left;\n  width: 100%;\n  padding: 0;\n  margin-bottom: 0.5rem;\n  font-size: calc(1.275rem + 0.3vw);\n  line-height: inherit; }\n  @media (min-width: 1200px) {\n    legend {\n      font-size: 1.5rem; } }\n  legend + * {\n    clear: left; }\n\n::-webkit-datetime-edit-fields-wrapper,\n::-webkit-datetime-edit-text,\n::-webkit-datetime-edit-minute,\n::-webkit-datetime-edit-hour-field,\n::-webkit-datetime-edit-day-field,\n::-webkit-datetime-edit-month-field,\n::-webkit-datetime-edit-year-field {\n  padding: 0; }\n\n::-webkit-inner-spin-button {\n  height: auto; }\n\n[type=\"search\"] {\n  outline-offset: -2px;\n  -webkit-appearance: textfield; }\n\n/* rtl:raw:\n[type=\"tel\"],\n[type=\"url\"],\n[type=\"email\"],\n[type=\"number\"] {\n  direction: ltr;\n}\n*/\n::-webkit-search-decoration {\n  -webkit-appearance: none; }\n\n::-webkit-color-swatch-wrapper {\n  padding: 0; }\n\n::file-selector-button {\n  font: inherit; }\n\n::-webkit-file-upload-button {\n  font: inherit;\n  -webkit-appearance: button; }\n\noutput {\n  display: inline-block; }\n\niframe {\n  border: 0; }\n\nsummary {\n  display: list-item;\n  cursor: pointer; }\n\nprogress {\n  vertical-align: baseline; }\n\n[hidden] {\n  display: none !important; }\n\n.lead {\n  font-size: 1.25rem;\n  font-weight: 400; }\n\n.display-1 {\n  font-size: calc(1.625rem + 4.5vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-1 {\n      font-size: 5rem; } }\n\n.display-2 {\n  font-size: calc(1.575rem + 3.9vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-2 {\n      font-size: 4.5rem; } }\n\n.display-3 {\n  font-size: calc(1.525rem + 3.3vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-3 {\n      font-size: 4rem; } }\n\n.display-4 {\n  font-size: calc(1.475rem + 2.7vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-4 {\n      font-size: 3.5rem; } }\n\n.display-5 {\n  font-size: calc(1.425rem + 2.1vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-5 {\n      font-size: 3rem; } }\n\n.display-6 {\n  font-size: calc(1.375rem + 1.5vw);\n  font-weight: 300;\n  line-height: 1.2; }\n  @media (min-width: 1200px) {\n    .display-6 {\n      font-size: 2.5rem; } }\n\n.list-unstyled {\n  padding-left: 0;\n  list-style: none; }\n\n.list-inline {\n  padding-left: 0;\n  list-style: none; }\n\n.list-inline-item {\n  display: inline-block; }\n  .list-inline-item:not(:last-child) {\n    margin-right: 0.5rem; }\n\n.initialism {\n  font-size: 0.875em;\n  text-transform: uppercase; }\n\n.blockquote {\n  margin-bottom: 1rem;\n  font-size: 1.25rem; }\n  .blockquote > :last-child {\n    margin-bottom: 0; }\n\n.blockquote-footer {\n  margin-top: -1rem;\n  margin-bottom: 1rem;\n  font-size: 0.875em;\n  color: #6c757d; }\n  .blockquote-footer::before {\n    content: \"\\2014\\00A0\"; }\n\n.img-fluid {\n  max-width: 100%;\n  height: auto; }\n\n.img-thumbnail {\n  padding: 0.25rem;\n  background-color: #fff;\n  border: 1px solid #dee2e6;\n  border-radius: 0.375rem;\n  max-width: 100%;\n  height: auto; }\n\n.figure {\n  display: inline-block; }\n\n.figure-img {\n  margin-bottom: 0.5rem;\n  line-height: 1; }\n\n.figure-caption {\n  font-size: 0.875em;\n  color: #6c757d; }\n\n.container,\n.container-fluid,\n.container-sm,\n.container-md,\n.container-lg,\n.container-xl,\n.container-xxl {\n  width: 100%;\n  padding-right: var(--bs-gutter-x, 1.5rem);\n  padding-left: var(--bs-gutter-x, 1.5rem);\n  margin-right: auto;\n  margin-left: auto; }\n\n@media (min-width: 576px) {\n  .container, .container-sm {\n    max-width: 540px; } }\n\n@media (min-width: 768px) {\n  .container, .container-sm, .container-md {\n    max-width: 720px; } }\n\n@media (min-width: 992px) {\n  .container, .container-sm, .container-md, .container-lg {\n    max-width: 960px; } }\n\n@media (min-width: 1200px) {\n  .container, .container-sm, .container-md, .container-lg, .container-xl {\n    max-width: 1140px; } }\n\n@media (min-width: 1400px) {\n  .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {\n    max-width: 1320px; } }\n\n.row {\n  --bs-gutter-x: 1.5rem;\n  --bs-gutter-y: 0;\n  display: flex;\n  flex-wrap: wrap;\n  margin-top: calc(-1 * var(--bs-gutter-y));\n  margin-right: calc(-.5 * var(--bs-gutter-x));\n  margin-left: calc(-.5 * var(--bs-gutter-x)); }\n  .row > * {\n    flex-shrink: 0;\n    width: 100%;\n    max-width: 100%;\n    padding-right: calc(var(--bs-gutter-x) * .5);\n    padding-left: calc(var(--bs-gutter-x) * .5);\n    margin-top: var(--bs-gutter-y); }\n\n.col {\n  flex: 1 0 0%; }\n\n.row-cols-auto > * {\n  flex: 0 0 auto;\n  width: auto; }\n\n.row-cols-1 > * {\n  flex: 0 0 auto;\n  width: 100%; }\n\n.row-cols-2 > * {\n  flex: 0 0 auto;\n  width: 50%; }\n\n.row-cols-3 > * {\n  flex: 0 0 auto;\n  width: 33.33333%; }\n\n.row-cols-4 > * {\n  flex: 0 0 auto;\n  width: 25%; }\n\n.row-cols-5 > * {\n  flex: 0 0 auto;\n  width: 20%; }\n\n.row-cols-6 > * {\n  flex: 0 0 auto;\n  width: 16.66667%; }\n\n.col-auto {\n  flex: 0 0 auto;\n  width: auto; }\n\n.col-1 {\n  flex: 0 0 auto;\n  width: 8.33333%; }\n\n.col-2 {\n  flex: 0 0 auto;\n  width: 16.66667%; }\n\n.col-3 {\n  flex: 0 0 auto;\n  width: 25%; }\n\n.col-4 {\n  flex: 0 0 auto;\n  width: 33.33333%; }\n\n.col-5 {\n  flex: 0 0 auto;\n  width: 41.66667%; }\n\n.col-6 {\n  flex: 0 0 auto;\n  width: 50%; }\n\n.col-7 {\n  flex: 0 0 auto;\n  width: 58.33333%; }\n\n.col-8 {\n  flex: 0 0 auto;\n  width: 66.66667%; }\n\n.col-9 {\n  flex: 0 0 auto;\n  width: 75%; }\n\n.col-10 {\n  flex: 0 0 auto;\n  width: 83.33333%; }\n\n.col-11 {\n  flex: 0 0 auto;\n  width: 91.66667%; }\n\n.col-12 {\n  flex: 0 0 auto;\n  width: 100%; }\n\n.offset-1 {\n  margin-left: 8.33333%; }\n\n.offset-2 {\n  margin-left: 16.66667%; }\n\n.offset-3 {\n  margin-left: 25%; }\n\n.offset-4 {\n  margin-left: 33.33333%; }\n\n.offset-5 {\n  margin-left: 41.66667%; }\n\n.offset-6 {\n  margin-left: 50%; }\n\n.offset-7 {\n  margin-left: 58.33333%; }\n\n.offset-8 {\n  margin-left: 66.66667%; }\n\n.offset-9 {\n  margin-left: 75%; }\n\n.offset-10 {\n  margin-left: 83.33333%; }\n\n.offset-11 {\n  margin-left: 91.66667%; }\n\n.g-0,\n.gx-0 {\n  --bs-gutter-x: 0; }\n\n.g-0,\n.gy-0 {\n  --bs-gutter-y: 0; }\n\n.g-1,\n.gx-1 {\n  --bs-gutter-x: 0.25rem; }\n\n.g-1,\n.gy-1 {\n  --bs-gutter-y: 0.25rem; }\n\n.g-2,\n.gx-2 {\n  --bs-gutter-x: 0.5rem; }\n\n.g-2,\n.gy-2 {\n  --bs-gutter-y: 0.5rem; }\n\n.g-3,\n.gx-3 {\n  --bs-gutter-x: 1rem; }\n\n.g-3,\n.gy-3 {\n  --bs-gutter-y: 1rem; }\n\n.g-4,\n.gx-4 {\n  --bs-gutter-x: 1.5rem; }\n\n.g-4,\n.gy-4 {\n  --bs-gutter-y: 1.5rem; }\n\n.g-5,\n.gx-5 {\n  --bs-gutter-x: 3rem; }\n\n.g-5,\n.gy-5 {\n  --bs-gutter-y: 3rem; }\n\n.g-6,\n.gx-6 {\n  --bs-gutter-x: 4rem; }\n\n.g-6,\n.gy-6 {\n  --bs-gutter-y: 4rem; }\n\n.g-7,\n.gx-7 {\n  --bs-gutter-x: 6rem; }\n\n.g-7,\n.gy-7 {\n  --bs-gutter-y: 6rem; }\n\n.g-8,\n.gx-8 {\n  --bs-gutter-x: 8rem; }\n\n.g-8,\n.gy-8 {\n  --bs-gutter-y: 8rem; }\n\n.g-9,\n.gx-9 {\n  --bs-gutter-x: 10rem; }\n\n.g-9,\n.gy-9 {\n  --bs-gutter-y: 10rem; }\n\n.g-10,\n.gx-10 {\n  --bs-gutter-x: 12rem; }\n\n.g-10,\n.gy-10 {\n  --bs-gutter-y: 12rem; }\n\n.g-11,\n.gx-11 {\n  --bs-gutter-x: 14rem; }\n\n.g-11,\n.gy-11 {\n  --bs-gutter-y: 14rem; }\n\n.g-12,\n.gx-12 {\n  --bs-gutter-x: 16rem; }\n\n.g-12,\n.gy-12 {\n  --bs-gutter-y: 16rem; }\n\n@media (min-width: 576px) {\n  .col-sm {\n    flex: 1 0 0%; }\n  .row-cols-sm-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-sm-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-sm-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-sm-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-sm-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-sm-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-sm-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-sm-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-sm-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-sm-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-sm-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-sm-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-sm-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-sm-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-sm-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-sm-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-sm-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-sm-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-sm-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-sm-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-sm-0 {\n    margin-left: 0; }\n  .offset-sm-1 {\n    margin-left: 8.33333%; }\n  .offset-sm-2 {\n    margin-left: 16.66667%; }\n  .offset-sm-3 {\n    margin-left: 25%; }\n  .offset-sm-4 {\n    margin-left: 33.33333%; }\n  .offset-sm-5 {\n    margin-left: 41.66667%; }\n  .offset-sm-6 {\n    margin-left: 50%; }\n  .offset-sm-7 {\n    margin-left: 58.33333%; }\n  .offset-sm-8 {\n    margin-left: 66.66667%; }\n  .offset-sm-9 {\n    margin-left: 75%; }\n  .offset-sm-10 {\n    margin-left: 83.33333%; }\n  .offset-sm-11 {\n    margin-left: 91.66667%; }\n  .g-sm-0,\n  .gx-sm-0 {\n    --bs-gutter-x: 0; }\n  .g-sm-0,\n  .gy-sm-0 {\n    --bs-gutter-y: 0; }\n  .g-sm-1,\n  .gx-sm-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-sm-1,\n  .gy-sm-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-sm-2,\n  .gx-sm-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-sm-2,\n  .gy-sm-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-sm-3,\n  .gx-sm-3 {\n    --bs-gutter-x: 1rem; }\n  .g-sm-3,\n  .gy-sm-3 {\n    --bs-gutter-y: 1rem; }\n  .g-sm-4,\n  .gx-sm-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-sm-4,\n  .gy-sm-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-sm-5,\n  .gx-sm-5 {\n    --bs-gutter-x: 3rem; }\n  .g-sm-5,\n  .gy-sm-5 {\n    --bs-gutter-y: 3rem; }\n  .g-sm-6,\n  .gx-sm-6 {\n    --bs-gutter-x: 4rem; }\n  .g-sm-6,\n  .gy-sm-6 {\n    --bs-gutter-y: 4rem; }\n  .g-sm-7,\n  .gx-sm-7 {\n    --bs-gutter-x: 6rem; }\n  .g-sm-7,\n  .gy-sm-7 {\n    --bs-gutter-y: 6rem; }\n  .g-sm-8,\n  .gx-sm-8 {\n    --bs-gutter-x: 8rem; }\n  .g-sm-8,\n  .gy-sm-8 {\n    --bs-gutter-y: 8rem; }\n  .g-sm-9,\n  .gx-sm-9 {\n    --bs-gutter-x: 10rem; }\n  .g-sm-9,\n  .gy-sm-9 {\n    --bs-gutter-y: 10rem; }\n  .g-sm-10,\n  .gx-sm-10 {\n    --bs-gutter-x: 12rem; }\n  .g-sm-10,\n  .gy-sm-10 {\n    --bs-gutter-y: 12rem; }\n  .g-sm-11,\n  .gx-sm-11 {\n    --bs-gutter-x: 14rem; }\n  .g-sm-11,\n  .gy-sm-11 {\n    --bs-gutter-y: 14rem; }\n  .g-sm-12,\n  .gx-sm-12 {\n    --bs-gutter-x: 16rem; }\n  .g-sm-12,\n  .gy-sm-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 768px) {\n  .col-md {\n    flex: 1 0 0%; }\n  .row-cols-md-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-md-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-md-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-md-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-md-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-md-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-md-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-md-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-md-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-md-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-md-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-md-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-md-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-md-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-md-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-md-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-md-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-md-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-md-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-md-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-md-0 {\n    margin-left: 0; }\n  .offset-md-1 {\n    margin-left: 8.33333%; }\n  .offset-md-2 {\n    margin-left: 16.66667%; }\n  .offset-md-3 {\n    margin-left: 25%; }\n  .offset-md-4 {\n    margin-left: 33.33333%; }\n  .offset-md-5 {\n    margin-left: 41.66667%; }\n  .offset-md-6 {\n    margin-left: 50%; }\n  .offset-md-7 {\n    margin-left: 58.33333%; }\n  .offset-md-8 {\n    margin-left: 66.66667%; }\n  .offset-md-9 {\n    margin-left: 75%; }\n  .offset-md-10 {\n    margin-left: 83.33333%; }\n  .offset-md-11 {\n    margin-left: 91.66667%; }\n  .g-md-0,\n  .gx-md-0 {\n    --bs-gutter-x: 0; }\n  .g-md-0,\n  .gy-md-0 {\n    --bs-gutter-y: 0; }\n  .g-md-1,\n  .gx-md-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-md-1,\n  .gy-md-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-md-2,\n  .gx-md-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-md-2,\n  .gy-md-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-md-3,\n  .gx-md-3 {\n    --bs-gutter-x: 1rem; }\n  .g-md-3,\n  .gy-md-3 {\n    --bs-gutter-y: 1rem; }\n  .g-md-4,\n  .gx-md-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-md-4,\n  .gy-md-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-md-5,\n  .gx-md-5 {\n    --bs-gutter-x: 3rem; }\n  .g-md-5,\n  .gy-md-5 {\n    --bs-gutter-y: 3rem; }\n  .g-md-6,\n  .gx-md-6 {\n    --bs-gutter-x: 4rem; }\n  .g-md-6,\n  .gy-md-6 {\n    --bs-gutter-y: 4rem; }\n  .g-md-7,\n  .gx-md-7 {\n    --bs-gutter-x: 6rem; }\n  .g-md-7,\n  .gy-md-7 {\n    --bs-gutter-y: 6rem; }\n  .g-md-8,\n  .gx-md-8 {\n    --bs-gutter-x: 8rem; }\n  .g-md-8,\n  .gy-md-8 {\n    --bs-gutter-y: 8rem; }\n  .g-md-9,\n  .gx-md-9 {\n    --bs-gutter-x: 10rem; }\n  .g-md-9,\n  .gy-md-9 {\n    --bs-gutter-y: 10rem; }\n  .g-md-10,\n  .gx-md-10 {\n    --bs-gutter-x: 12rem; }\n  .g-md-10,\n  .gy-md-10 {\n    --bs-gutter-y: 12rem; }\n  .g-md-11,\n  .gx-md-11 {\n    --bs-gutter-x: 14rem; }\n  .g-md-11,\n  .gy-md-11 {\n    --bs-gutter-y: 14rem; }\n  .g-md-12,\n  .gx-md-12 {\n    --bs-gutter-x: 16rem; }\n  .g-md-12,\n  .gy-md-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 992px) {\n  .col-lg {\n    flex: 1 0 0%; }\n  .row-cols-lg-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-lg-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-lg-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-lg-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-lg-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-lg-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-lg-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-lg-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-lg-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-lg-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-lg-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-lg-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-lg-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-lg-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-lg-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-lg-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-lg-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-lg-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-lg-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-lg-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-lg-0 {\n    margin-left: 0; }\n  .offset-lg-1 {\n    margin-left: 8.33333%; }\n  .offset-lg-2 {\n    margin-left: 16.66667%; }\n  .offset-lg-3 {\n    margin-left: 25%; }\n  .offset-lg-4 {\n    margin-left: 33.33333%; }\n  .offset-lg-5 {\n    margin-left: 41.66667%; }\n  .offset-lg-6 {\n    margin-left: 50%; }\n  .offset-lg-7 {\n    margin-left: 58.33333%; }\n  .offset-lg-8 {\n    margin-left: 66.66667%; }\n  .offset-lg-9 {\n    margin-left: 75%; }\n  .offset-lg-10 {\n    margin-left: 83.33333%; }\n  .offset-lg-11 {\n    margin-left: 91.66667%; }\n  .g-lg-0,\n  .gx-lg-0 {\n    --bs-gutter-x: 0; }\n  .g-lg-0,\n  .gy-lg-0 {\n    --bs-gutter-y: 0; }\n  .g-lg-1,\n  .gx-lg-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-lg-1,\n  .gy-lg-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-lg-2,\n  .gx-lg-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-lg-2,\n  .gy-lg-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-lg-3,\n  .gx-lg-3 {\n    --bs-gutter-x: 1rem; }\n  .g-lg-3,\n  .gy-lg-3 {\n    --bs-gutter-y: 1rem; }\n  .g-lg-4,\n  .gx-lg-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-lg-4,\n  .gy-lg-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-lg-5,\n  .gx-lg-5 {\n    --bs-gutter-x: 3rem; }\n  .g-lg-5,\n  .gy-lg-5 {\n    --bs-gutter-y: 3rem; }\n  .g-lg-6,\n  .gx-lg-6 {\n    --bs-gutter-x: 4rem; }\n  .g-lg-6,\n  .gy-lg-6 {\n    --bs-gutter-y: 4rem; }\n  .g-lg-7,\n  .gx-lg-7 {\n    --bs-gutter-x: 6rem; }\n  .g-lg-7,\n  .gy-lg-7 {\n    --bs-gutter-y: 6rem; }\n  .g-lg-8,\n  .gx-lg-8 {\n    --bs-gutter-x: 8rem; }\n  .g-lg-8,\n  .gy-lg-8 {\n    --bs-gutter-y: 8rem; }\n  .g-lg-9,\n  .gx-lg-9 {\n    --bs-gutter-x: 10rem; }\n  .g-lg-9,\n  .gy-lg-9 {\n    --bs-gutter-y: 10rem; }\n  .g-lg-10,\n  .gx-lg-10 {\n    --bs-gutter-x: 12rem; }\n  .g-lg-10,\n  .gy-lg-10 {\n    --bs-gutter-y: 12rem; }\n  .g-lg-11,\n  .gx-lg-11 {\n    --bs-gutter-x: 14rem; }\n  .g-lg-11,\n  .gy-lg-11 {\n    --bs-gutter-y: 14rem; }\n  .g-lg-12,\n  .gx-lg-12 {\n    --bs-gutter-x: 16rem; }\n  .g-lg-12,\n  .gy-lg-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 1200px) {\n  .col-xl {\n    flex: 1 0 0%; }\n  .row-cols-xl-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-xl-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-xl-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-xl-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-xl-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-xl-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-xl-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xl-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-xl-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-xl-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xl-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-xl-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-xl-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-xl-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-xl-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-xl-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-xl-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-xl-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-xl-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-xl-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-xl-0 {\n    margin-left: 0; }\n  .offset-xl-1 {\n    margin-left: 8.33333%; }\n  .offset-xl-2 {\n    margin-left: 16.66667%; }\n  .offset-xl-3 {\n    margin-left: 25%; }\n  .offset-xl-4 {\n    margin-left: 33.33333%; }\n  .offset-xl-5 {\n    margin-left: 41.66667%; }\n  .offset-xl-6 {\n    margin-left: 50%; }\n  .offset-xl-7 {\n    margin-left: 58.33333%; }\n  .offset-xl-8 {\n    margin-left: 66.66667%; }\n  .offset-xl-9 {\n    margin-left: 75%; }\n  .offset-xl-10 {\n    margin-left: 83.33333%; }\n  .offset-xl-11 {\n    margin-left: 91.66667%; }\n  .g-xl-0,\n  .gx-xl-0 {\n    --bs-gutter-x: 0; }\n  .g-xl-0,\n  .gy-xl-0 {\n    --bs-gutter-y: 0; }\n  .g-xl-1,\n  .gx-xl-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-xl-1,\n  .gy-xl-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-xl-2,\n  .gx-xl-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-xl-2,\n  .gy-xl-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-xl-3,\n  .gx-xl-3 {\n    --bs-gutter-x: 1rem; }\n  .g-xl-3,\n  .gy-xl-3 {\n    --bs-gutter-y: 1rem; }\n  .g-xl-4,\n  .gx-xl-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-xl-4,\n  .gy-xl-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-xl-5,\n  .gx-xl-5 {\n    --bs-gutter-x: 3rem; }\n  .g-xl-5,\n  .gy-xl-5 {\n    --bs-gutter-y: 3rem; }\n  .g-xl-6,\n  .gx-xl-6 {\n    --bs-gutter-x: 4rem; }\n  .g-xl-6,\n  .gy-xl-6 {\n    --bs-gutter-y: 4rem; }\n  .g-xl-7,\n  .gx-xl-7 {\n    --bs-gutter-x: 6rem; }\n  .g-xl-7,\n  .gy-xl-7 {\n    --bs-gutter-y: 6rem; }\n  .g-xl-8,\n  .gx-xl-8 {\n    --bs-gutter-x: 8rem; }\n  .g-xl-8,\n  .gy-xl-8 {\n    --bs-gutter-y: 8rem; }\n  .g-xl-9,\n  .gx-xl-9 {\n    --bs-gutter-x: 10rem; }\n  .g-xl-9,\n  .gy-xl-9 {\n    --bs-gutter-y: 10rem; }\n  .g-xl-10,\n  .gx-xl-10 {\n    --bs-gutter-x: 12rem; }\n  .g-xl-10,\n  .gy-xl-10 {\n    --bs-gutter-y: 12rem; }\n  .g-xl-11,\n  .gx-xl-11 {\n    --bs-gutter-x: 14rem; }\n  .g-xl-11,\n  .gy-xl-11 {\n    --bs-gutter-y: 14rem; }\n  .g-xl-12,\n  .gx-xl-12 {\n    --bs-gutter-x: 16rem; }\n  .g-xl-12,\n  .gy-xl-12 {\n    --bs-gutter-y: 16rem; } }\n\n@media (min-width: 1400px) {\n  .col-xxl {\n    flex: 1 0 0%; }\n  .row-cols-xxl-auto > * {\n    flex: 0 0 auto;\n    width: auto; }\n  .row-cols-xxl-1 > * {\n    flex: 0 0 auto;\n    width: 100%; }\n  .row-cols-xxl-2 > * {\n    flex: 0 0 auto;\n    width: 50%; }\n  .row-cols-xxl-3 > * {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .row-cols-xxl-4 > * {\n    flex: 0 0 auto;\n    width: 25%; }\n  .row-cols-xxl-5 > * {\n    flex: 0 0 auto;\n    width: 20%; }\n  .row-cols-xxl-6 > * {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xxl-auto {\n    flex: 0 0 auto;\n    width: auto; }\n  .col-xxl-1 {\n    flex: 0 0 auto;\n    width: 8.33333%; }\n  .col-xxl-2 {\n    flex: 0 0 auto;\n    width: 16.66667%; }\n  .col-xxl-3 {\n    flex: 0 0 auto;\n    width: 25%; }\n  .col-xxl-4 {\n    flex: 0 0 auto;\n    width: 33.33333%; }\n  .col-xxl-5 {\n    flex: 0 0 auto;\n    width: 41.66667%; }\n  .col-xxl-6 {\n    flex: 0 0 auto;\n    width: 50%; }\n  .col-xxl-7 {\n    flex: 0 0 auto;\n    width: 58.33333%; }\n  .col-xxl-8 {\n    flex: 0 0 auto;\n    width: 66.66667%; }\n  .col-xxl-9 {\n    flex: 0 0 auto;\n    width: 75%; }\n  .col-xxl-10 {\n    flex: 0 0 auto;\n    width: 83.33333%; }\n  .col-xxl-11 {\n    flex: 0 0 auto;\n    width: 91.66667%; }\n  .col-xxl-12 {\n    flex: 0 0 auto;\n    width: 100%; }\n  .offset-xxl-0 {\n    margin-left: 0; }\n  .offset-xxl-1 {\n    margin-left: 8.33333%; }\n  .offset-xxl-2 {\n    margin-left: 16.66667%; }\n  .offset-xxl-3 {\n    margin-left: 25%; }\n  .offset-xxl-4 {\n    margin-left: 33.33333%; }\n  .offset-xxl-5 {\n    margin-left: 41.66667%; }\n  .offset-xxl-6 {\n    margin-left: 50%; }\n  .offset-xxl-7 {\n    margin-left: 58.33333%; }\n  .offset-xxl-8 {\n    margin-left: 66.66667%; }\n  .offset-xxl-9 {\n    margin-left: 75%; }\n  .offset-xxl-10 {\n    margin-left: 83.33333%; }\n  .offset-xxl-11 {\n    margin-left: 91.66667%; }\n  .g-xxl-0,\n  .gx-xxl-0 {\n    --bs-gutter-x: 0; }\n  .g-xxl-0,\n  .gy-xxl-0 {\n    --bs-gutter-y: 0; }\n  .g-xxl-1,\n  .gx-xxl-1 {\n    --bs-gutter-x: 0.25rem; }\n  .g-xxl-1,\n  .gy-xxl-1 {\n    --bs-gutter-y: 0.25rem; }\n  .g-xxl-2,\n  .gx-xxl-2 {\n    --bs-gutter-x: 0.5rem; }\n  .g-xxl-2,\n  .gy-xxl-2 {\n    --bs-gutter-y: 0.5rem; }\n  .g-xxl-3,\n  .gx-xxl-3 {\n    --bs-gutter-x: 1rem; }\n  .g-xxl-3,\n  .gy-xxl-3 {\n    --bs-gutter-y: 1rem; }\n  .g-xxl-4,\n  .gx-xxl-4 {\n    --bs-gutter-x: 1.5rem; }\n  .g-xxl-4,\n  .gy-xxl-4 {\n    --bs-gutter-y: 1.5rem; }\n  .g-xxl-5,\n  .gx-xxl-5 {\n    --bs-gutter-x: 3rem; }\n  .g-xxl-5,\n  .gy-xxl-5 {\n    --bs-gutter-y: 3rem; }\n  .g-xxl-6,\n  .gx-xxl-6 {\n    --bs-gutter-x: 4rem; }\n  .g-xxl-6,\n  .gy-xxl-6 {\n    --bs-gutter-y: 4rem; }\n  .g-xxl-7,\n  .gx-xxl-7 {\n    --bs-gutter-x: 6rem; }\n  .g-xxl-7,\n  .gy-xxl-7 {\n    --bs-gutter-y: 6rem; }\n  .g-xxl-8,\n  .gx-xxl-8 {\n    --bs-gutter-x: 8rem; }\n  .g-xxl-8,\n  .gy-xxl-8 {\n    --bs-gutter-y: 8rem; }\n  .g-xxl-9,\n  .gx-xxl-9 {\n    --bs-gutter-x: 10rem; }\n  .g-xxl-9,\n  .gy-xxl-9 {\n    --bs-gutter-y: 10rem; }\n  .g-xxl-10,\n  .gx-xxl-10 {\n    --bs-gutter-x: 12rem; }\n  .g-xxl-10,\n  .gy-xxl-10 {\n    --bs-gutter-y: 12rem; }\n  .g-xxl-11,\n  .gx-xxl-11 {\n    --bs-gutter-x: 14rem; }\n  .g-xxl-11,\n  .gy-xxl-11 {\n    --bs-gutter-y: 14rem; }\n  .g-xxl-12,\n  .gx-xxl-12 {\n    --bs-gutter-x: 16rem; }\n  .g-xxl-12,\n  .gy-xxl-12 {\n    --bs-gutter-y: 16rem; } }\n\n.table {\n  --bs-table-bg: transparent;\n  --bs-table-accent-bg: transparent;\n  --bs-table-striped-color: #7b809a;\n  --bs-table-striped-bg: rgba(0, 0, 0, 0.05);\n  --bs-table-active-color: #7b809a;\n  --bs-table-active-bg: rgba(0, 0, 0, 0.1);\n  --bs-table-hover-color: #7b809a;\n  --bs-table-hover-bg: rgba(0, 0, 0, 0.075);\n  width: 100%;\n  margin-bottom: 1rem;\n  color: #7b809a;\n  vertical-align: top;\n  border-color: #f0f2f5; }\n  .table > :not(caption) > * > * {\n    padding: 0.5rem 0.5rem;\n    background-color: var(--bs-table-bg);\n    border-bottom-width: 1px;\n    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); }\n  .table > tbody {\n    vertical-align: inherit; }\n  .table > thead {\n    vertical-align: bottom; }\n  .table > :not(:first-child) {\n    border-top: 2px solid currentColor; }\n\n.caption-top {\n  caption-side: top; }\n\n.table-sm > :not(caption) > * > * {\n  padding: 0.25rem 0.25rem; }\n\n.table-bordered > :not(caption) > * {\n  border-width: 1px 0; }\n  .table-bordered > :not(caption) > * > * {\n    border-width: 0 1px; }\n\n.table-borderless > :not(caption) > * > * {\n  border-bottom-width: 0; }\n\n.table-borderless > :not(:first-child) {\n  border-top-width: 0; }\n\n.table-striped > tbody > tr:nth-of-type(odd) > * {\n  --bs-table-accent-bg: var(--bs-table-striped-bg);\n  color: var(--bs-table-striped-color); }\n\n.table-active {\n  --bs-table-accent-bg: var(--bs-table-active-bg);\n  color: var(--bs-table-active-color); }\n\n.table-hover > tbody > tr:hover > * {\n  --bs-table-accent-bg: var(--bs-table-hover-bg);\n  color: var(--bs-table-hover-color); }\n\n.table-primary {\n  --bs-table-bg: #fbd2e0;\n  --bs-table-striped-bg: #eec8d5;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #e2bdca;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #e8c2cf;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #e2bdca; }\n\n.table-secondary {\n  --bs-table-bg: #e5e6eb;\n  --bs-table-striped-bg: #dadbdf;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #cecfd4;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #d4d5d9;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #cecfd4; }\n\n.table-success {\n  --bs-table-bg: #dbefdc;\n  --bs-table-striped-bg: #d0e3d1;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #c5d7c6;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #cbddcc;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #c5d7c6; }\n\n.table-info {\n  --bs-table-bg: #d1e3fa;\n  --bs-table-striped-bg: #c7d8ee;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #bccce1;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #c1d2e7;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #bccce1; }\n\n.table-warning {\n  --bs-table-bg: #fee8cc;\n  --bs-table-striped-bg: #f1dcc2;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #e5d1b8;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #ebd7bd;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #e5d1b8; }\n\n.table-danger {\n  --bs-table-bg: #fdd9d7;\n  --bs-table-striped-bg: #f0cecc;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #e4c3c2;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #eac9c7;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #e4c3c2; }\n\n.table-light {\n  --bs-table-bg: #f0f2f5;\n  --bs-table-striped-bg: #e4e6e9;\n  --bs-table-striped-color: #000;\n  --bs-table-active-bg: #d8dadd;\n  --bs-table-active-color: #000;\n  --bs-table-hover-bg: #dee0e3;\n  --bs-table-hover-color: #000;\n  color: #000;\n  border-color: #d8dadd; }\n\n.table-dark {\n  --bs-table-bg: #344767;\n  --bs-table-striped-bg: #3e506f;\n  --bs-table-striped-color: #fff;\n  --bs-table-active-bg: #485976;\n  --bs-table-active-color: #fff;\n  --bs-table-hover-bg: #435572;\n  --bs-table-hover-color: #fff;\n  color: #fff;\n  border-color: #485976; }\n\n.table-responsive {\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch; }\n\n@media (max-width: 575.98px) {\n  .table-responsive-sm {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 767.98px) {\n  .table-responsive-md {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 991.98px) {\n  .table-responsive-lg {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 1199.98px) {\n  .table-responsive-xl {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n@media (max-width: 1399.98px) {\n  .table-responsive-xxl {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch; } }\n\n.form-label {\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  font-weight: 400;\n  color: #7b809a; }\n\n.col-form-label {\n  padding-top: calc(0.5rem + 1px);\n  padding-bottom: calc(0.5rem + 1px);\n  margin-bottom: 0;\n  font-size: inherit;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #7b809a; }\n\n.col-form-label-lg {\n  padding-top: calc(0.75rem + 1px);\n  padding-bottom: calc(0.75rem + 1px);\n  font-size: 0.875rem; }\n\n.col-form-label-sm {\n  padding-top: calc(0.25rem + 1px);\n  padding-bottom: calc(0.25rem + 1px);\n  font-size: 0.75rem; }\n\n.form-text {\n  margin-top: 0.25rem;\n  font-size: 0.875em;\n  color: #6c757d; }\n\n.form-control {\n  display: block;\n  width: 100%;\n  padding: 0.5rem 0;\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #495057;\n  background-color: transparent;\n  background-clip: padding-box;\n  border: 1px solid #d2d6da;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none;\n  border-radius: 0.375rem;\n  transition: 0.2s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .form-control {\n      transition: none; } }\n  .form-control[type=\"file\"] {\n    overflow: hidden; }\n    .form-control[type=\"file\"]:not(:disabled):not([readonly]) {\n      cursor: pointer; }\n  .form-control:focus {\n    color: #495057;\n    background-color: transparent;\n    border-color: transparent;\n    outline: 0;\n    box-shadow: none; }\n  .form-control::-webkit-date-and-time-value {\n    height: 1.5rem; }\n  .form-control::-moz-placeholder {\n    color: #adb5bd;\n    opacity: 1; }\n  .form-control:-ms-input-placeholder {\n    color: #adb5bd;\n    opacity: 1; }\n  .form-control::placeholder {\n    color: #adb5bd;\n    opacity: 1; }\n  .form-control:disabled, .form-control[readonly] {\n    background-color: #f0f2f5;\n    opacity: 1; }\n  .form-control::file-selector-button {\n    padding: 0.5rem 0;\n    margin: -0.5rem 0;\n    -webkit-margin-end: 0;\n            margin-inline-end: 0;\n    color: #495057;\n    background-color: transparent;\n    pointer-events: none;\n    border-color: inherit;\n    border-style: solid;\n    border-width: 0;\n    border-inline-end-width: 1px;\n    border-radius: 0;\n    transition: all 0.15s ease-in; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-control::file-selector-button {\n        transition: none; } }\n  .form-control:hover:not(:disabled):not([readonly])::file-selector-button {\n    background-color: rgba(0, 0, 0, 0.05); }\n  .form-control::-webkit-file-upload-button {\n    padding: 0.5rem 0;\n    margin: -0.5rem 0;\n    -webkit-margin-end: 0;\n            margin-inline-end: 0;\n    color: #495057;\n    background-color: transparent;\n    pointer-events: none;\n    border-color: inherit;\n    border-style: solid;\n    border-width: 0;\n    border-inline-end-width: 1px;\n    border-radius: 0;\n    -webkit-transition: all 0.15s ease-in;\n    transition: all 0.15s ease-in; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-control::-webkit-file-upload-button {\n        -webkit-transition: none;\n        transition: none; } }\n  .form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {\n    background-color: rgba(0, 0, 0, 0.05); }\n\n.form-control-plaintext {\n  display: block;\n  width: 100%;\n  padding: 0.5rem 0;\n  margin-bottom: 0;\n  line-height: 1.5rem;\n  color: #344767;\n  background-color: transparent;\n  border: solid transparent;\n  border-width: 1px 0; }\n  .form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg {\n    padding-right: 0;\n    padding-left: 0; }\n\n.form-control-sm {\n  min-height: unset;\n  padding: 0.25rem 0.75rem;\n  font-size: 0.75rem;\n  border-radius: 0.125rem; }\n  .form-control-sm::file-selector-button {\n    padding: 0.25rem 0.75rem;\n    margin: -0.25rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n  .form-control-sm::-webkit-file-upload-button {\n    padding: 0.25rem 0.75rem;\n    margin: -0.25rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n\n.form-control-lg {\n  min-height: unset;\n  padding: 0.75rem 0.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n  .form-control-lg::file-selector-button {\n    padding: 0.75rem 0.75rem;\n    margin: -0.75rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n  .form-control-lg::-webkit-file-upload-button {\n    padding: 0.75rem 0.75rem;\n    margin: -0.75rem -0.75rem;\n    -webkit-margin-end: 0.75rem;\n            margin-inline-end: 0.75rem; }\n\ntextarea.form-control {\n  min-height: unset; }\n\ntextarea.form-control-sm {\n  min-height: unset; }\n\ntextarea.form-control-lg {\n  min-height: unset; }\n\n.form-control-color {\n  width: 3rem;\n  height: auto;\n  padding: 0.5rem; }\n  .form-control-color:not(:disabled):not([readonly]) {\n    cursor: pointer; }\n  .form-control-color::-moz-color-swatch {\n    height: 1.5rem;\n    border-radius: 0.375rem; }\n  .form-control-color::-webkit-color-swatch {\n    height: 1.5rem;\n    border-radius: 0.375rem; }\n\n.form-select {\n  display: block;\n  width: 100%;\n  padding: 0.5rem 1rem 0.5rem 0;\n  -moz-padding-start: -3px;\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #495057;\n  background-color: transparent;\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e\");\n  background-repeat: no-repeat;\n  background-position: right 0 center;\n  background-size: 16px 12px;\n  border: 1px solid #d2d6da;\n  border-radius: 0.375rem;\n  transition: 0.2s ease;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none; }\n  @media (prefers-reduced-motion: reduce) {\n    .form-select {\n      transition: none; } }\n  .form-select:focus {\n    border-color: transparent;\n    outline: 0;\n    box-shadow: none; }\n  .form-select[multiple], .form-select[size]:not([size=\"1\"]) {\n    padding-right: 0;\n    background-image: none; }\n  .form-select:disabled {\n    color: #6c757d;\n    background-color: #f0f2f5; }\n  .form-select:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 #495057; }\n\n.form-select-sm {\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n  padding-left: 0.75rem;\n  font-size: 0.75rem;\n  border-radius: 0.125rem; }\n\n.form-select-lg {\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n  padding-left: 0.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n\n.form-check {\n  display: block;\n  min-height: auto;\n  padding-left: 1.73em;\n  margin-bottom: 0.125rem; }\n  .form-check .form-check-input {\n    float: left;\n    margin-left: -1.73em; }\n\n.form-check-input {\n  width: 1.23em;\n  height: 1.23em;\n  margin-top: 0.135em;\n  vertical-align: top;\n  background-color: #fff;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: contain;\n  border: none;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none;\n  -webkit-print-color-adjust: exact;\n          color-adjust: exact;\n  transition: background-color 0.25s ease, border-color 0.25s ease, background-position 0.15s ease-in-out, opacity 0.15s ease-out, box-shadow 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .form-check-input {\n      transition: none; } }\n  .form-check-input[type=\"checkbox\"] {\n    border-radius: 0.35rem; }\n  .form-check-input[type=\"radio\"] {\n    border-radius: 50%; }\n  .form-check-input:active {\n    filter: brightness(99%); }\n  .form-check-input:focus {\n    border-color: none;\n    outline: 0;\n    box-shadow: none; }\n  .form-check-input:checked {\n    background-color: transparent;\n    border-color: transparent; }\n    .form-check-input:checked[type=\"checkbox\"] {\n      background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n    .form-check-input:checked[type=\"radio\"] {\n      background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n  .form-check-input[type=\"checkbox\"]:indeterminate {\n    background-color: #e91e63;\n    border-color: #e91e63;\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e\"); }\n  .form-check-input:disabled {\n    pointer-events: none;\n    filter: none;\n    opacity: 0.5; }\n  .form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {\n    opacity: 0.5; }\n\n.form-switch {\n  padding-left: 2.375rem; }\n  .form-switch .form-check-input {\n    width: 1.875rem;\n    margin-left: -2.375rem;\n    background-image: none;\n    background-position: left center;\n    border-radius: 1.875rem;\n    transition: background-color 0.25s ease, border-color 0.25s ease, background-position 0.15s ease-in-out, opacity 0.15s ease-out, box-shadow 0.15s ease-in-out; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-switch .form-check-input {\n        transition: none; } }\n    .form-switch .form-check-input:focus {\n      background-image: none; }\n    .form-switch .form-check-input:checked {\n      background-position: right center;\n      background-image: none; }\n\n.form-check-inline {\n  display: inline-block;\n  margin-right: 1rem; }\n\n.btn-check {\n  position: absolute;\n  clip: rect(0, 0, 0, 0);\n  pointer-events: none; }\n  .btn-check[disabled] + .btn, .btn-check:disabled + .btn {\n    pointer-events: none;\n    filter: none;\n    opacity: 0.65; }\n\n.form-range {\n  width: 100%;\n  height: calc(1rem + 4px);\n  padding: 0;\n  background-color: transparent;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none; }\n  .form-range:focus {\n    outline: 0; }\n    .form-range:focus::-webkit-slider-thumb {\n      box-shadow: 0 0 0 1px #fff, none; }\n    .form-range:focus::-moz-range-thumb {\n      box-shadow: 0 0 0 1px #fff, none; }\n  .form-range::-moz-focus-outer {\n    border: 0; }\n  .form-range::-webkit-slider-thumb {\n    width: 1rem;\n    height: 1rem;\n    margin-top: -0.25rem;\n    background-color: #e91e63;\n    border: 0;\n    border-radius: 1rem;\n    -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    -webkit-appearance: none;\n            appearance: none; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-range::-webkit-slider-thumb {\n        -webkit-transition: none;\n        transition: none; } }\n    .form-range::-webkit-slider-thumb:active {\n      background-color: #f9c1d4; }\n  .form-range::-webkit-slider-runnable-track {\n    width: 100%;\n    height: 0.5rem;\n    color: transparent;\n    cursor: pointer;\n    background-color: #dee2e6;\n    border-color: transparent;\n    border-radius: 1rem; }\n  .form-range::-moz-range-thumb {\n    width: 1rem;\n    height: 1rem;\n    background-color: #e91e63;\n    border: 0;\n    border-radius: 1rem;\n    -moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n    -moz-appearance: none;\n         appearance: none; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-range::-moz-range-thumb {\n        -moz-transition: none;\n        transition: none; } }\n    .form-range::-moz-range-thumb:active {\n      background-color: #f9c1d4; }\n  .form-range::-moz-range-track {\n    width: 100%;\n    height: 0.5rem;\n    color: transparent;\n    cursor: pointer;\n    background-color: #dee2e6;\n    border-color: transparent;\n    border-radius: 1rem; }\n  .form-range:disabled {\n    pointer-events: none; }\n    .form-range:disabled::-webkit-slider-thumb {\n      background-color: #adb5bd; }\n    .form-range:disabled::-moz-range-thumb {\n      background-color: #adb5bd; }\n\n.form-floating {\n  position: relative; }\n  .form-floating > .form-control,\n  .form-floating > .form-select {\n    height: calc(3.5rem + 2px);\n    line-height: 1.25; }\n  .form-floating > label {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    padding: 1rem 0;\n    pointer-events: none;\n    border: 1px solid transparent;\n    transform-origin: 0 0;\n    transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; }\n    @media (prefers-reduced-motion: reduce) {\n      .form-floating > label {\n        transition: none; } }\n  .form-floating > .form-control {\n    padding: 1rem 0; }\n    .form-floating > .form-control::-moz-placeholder {\n      color: transparent; }\n    .form-floating > .form-control:-ms-input-placeholder {\n      color: transparent; }\n    .form-floating > .form-control::placeholder {\n      color: transparent; }\n    .form-floating > .form-control:not(:-moz-placeholder-shown) {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n    .form-floating > .form-control:not(:-ms-input-placeholder) {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n    .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n    .form-floating > .form-control:-webkit-autofill {\n      padding-top: 1.625rem;\n      padding-bottom: 0.625rem; }\n  .form-floating > .form-select {\n    padding-top: 1.625rem;\n    padding-bottom: 0.625rem; }\n  .form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n  .form-floating > .form-control:not(:-ms-input-placeholder) ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n  .form-floating > .form-control:focus ~ label,\n  .form-floating > .form-control:not(:placeholder-shown) ~ label,\n  .form-floating > .form-select ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n  .form-floating > .form-control:-webkit-autofill ~ label {\n    opacity: 0.65;\n    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); }\n\n.input-group {\n  position: relative;\n  display: flex;\n  flex-wrap: wrap;\n  align-items: stretch;\n  width: 100%; }\n  .input-group > .form-control,\n  .input-group > .form-select {\n    position: relative;\n    flex: 1 1 auto;\n    width: 1%;\n    min-width: 0; }\n  .input-group > .form-control:focus,\n  .input-group > .form-select:focus {\n    z-index: 3; }\n  .input-group .btn {\n    position: relative;\n    z-index: 2; }\n    .input-group .btn:focus {\n      z-index: 3; }\n\n.input-group-text {\n  display: flex;\n  align-items: center;\n  padding: 0.5rem 0;\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.5rem;\n  color: #344767;\n  text-align: center;\n  white-space: nowrap;\n  background-color: transparent;\n  border: 1px solid #d2d6da;\n  border-radius: 0.375rem; }\n\n.input-group-lg > .form-control,\n.input-group-lg > .form-select,\n.input-group-lg > .input-group-text,\n.input-group-lg > .btn {\n  padding: 0.75rem 0.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n\n.input-group-sm > .form-control,\n.input-group-sm > .form-select,\n.input-group-sm > .input-group-text,\n.input-group-sm > .btn {\n  padding: 0.25rem 0.75rem;\n  font-size: 0.75rem;\n  border-radius: 0.125rem; }\n\n.input-group-lg > .form-select,\n.input-group-sm > .form-select {\n  padding-right: 1rem; }\n\n.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),\n.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3) {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0; }\n\n.input-group.has-validation > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),\n.input-group.has-validation > .dropdown-toggle:nth-last-child(n + 4) {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0; }\n\n.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {\n  margin-left: -1px;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.valid-feedback {\n  display: none;\n  width: 100%;\n  margin-top: 0.25rem;\n  font-size: 0.875em;\n  color: #66d432; }\n\n.valid-tooltip {\n  position: absolute;\n  top: 100%;\n  z-index: 5;\n  display: none;\n  max-width: 100%;\n  padding: 0.25rem 0.5rem;\n  margin-top: .1rem;\n  font-size: 0.875rem;\n  color: #000;\n  background-color: rgba(102, 212, 50, 0.9);\n  border-radius: 0.375rem; }\n\n.was-validated :valid ~ .valid-feedback,\n.was-validated :valid ~ .valid-tooltip,\n.is-valid ~ .valid-feedback,\n.is-valid ~ .valid-tooltip {\n  display: block; }\n\n.was-validated .form-control:valid, .form-control.is-valid {\n  border-color: #66d432;\n  padding-right: unset;\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3e%3cpath fill='%2366d432' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");\n  background-repeat: no-repeat;\n  background-position: right 0.75rem center;\n  background-size: 1rem 1rem; }\n  .was-validated .form-control:valid:focus, .form-control.is-valid:focus {\n    border-color: #66d432;\n    box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.25); }\n\n.was-validated textarea.form-control:valid, textarea.form-control.is-valid {\n  padding-right: unset;\n  background-position: top 0.75rem right 0.75rem; }\n\n.was-validated .form-select:valid, .form-select.is-valid {\n  border-color: #66d432; }\n  .was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size=\"1\"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size=\"1\"] {\n    padding-right: 1rem;\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e\"), url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3e%3cpath fill='%2366d432' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");\n    background-position: right 0 center, center right 1rem;\n    background-size: 16px 12px, 1rem 1rem; }\n  .was-validated .form-select:valid:focus, .form-select.is-valid:focus {\n    border-color: #66d432;\n    box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.25); }\n\n.was-validated .form-check-input:valid, .form-check-input.is-valid {\n  border-color: #66d432; }\n  .was-validated .form-check-input:valid:checked, .form-check-input.is-valid:checked {\n    background-color: #66d432; }\n  .was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus {\n    box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.25); }\n  .was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label {\n    color: #66d432; }\n\n.form-check-inline .form-check-input ~ .valid-feedback {\n  margin-left: .5em; }\n\n.was-validated .input-group .form-control:valid, .input-group .form-control.is-valid, .was-validated\n.input-group .form-select:valid,\n.input-group .form-select.is-valid {\n  z-index: 1; }\n  .was-validated .input-group .form-control:valid:focus, .input-group .form-control.is-valid:focus, .was-validated\n  .input-group .form-select:valid:focus,\n  .input-group .form-select.is-valid:focus {\n    z-index: 3; }\n\n.invalid-feedback {\n  display: none;\n  width: 100%;\n  margin-top: 0.25rem;\n  font-size: 0.875em;\n  color: #fd5c70; }\n\n.invalid-tooltip {\n  position: absolute;\n  top: 100%;\n  z-index: 5;\n  display: none;\n  max-width: 100%;\n  padding: 0.25rem 0.5rem;\n  margin-top: .1rem;\n  font-size: 0.875rem;\n  color: #000;\n  background-color: rgba(253, 92, 112, 0.9);\n  border-radius: 0.375rem; }\n\n.was-validated :invalid ~ .invalid-feedback,\n.was-validated :invalid ~ .invalid-tooltip,\n.is-invalid ~ .invalid-feedback,\n.is-invalid ~ .invalid-tooltip {\n  display: block; }\n\n.was-validated .form-control:invalid, .form-control.is-invalid {\n  border-color: #fd5c70;\n  padding-right: unset;\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd5c70' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd5c70' stroke='none'/%3e%3c/svg%3e\");\n  background-repeat: no-repeat;\n  background-position: right 0.75rem center;\n  background-size: 1rem 1rem; }\n  .was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {\n    border-color: #fd5c70;\n    box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.25); }\n\n.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {\n  padding-right: unset;\n  background-position: top 0.75rem right 0.75rem; }\n\n.was-validated .form-select:invalid, .form-select.is-invalid {\n  border-color: #fd5c70; }\n  .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size=\"1\"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size=\"1\"] {\n    padding-right: 1rem;\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e\"), url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd5c70' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd5c70' stroke='none'/%3e%3c/svg%3e\");\n    background-position: right 0 center, center right 1rem;\n    background-size: 16px 12px, 1rem 1rem; }\n  .was-validated .form-select:invalid:focus, .form-select.is-invalid:focus {\n    border-color: #fd5c70;\n    box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.25); }\n\n.was-validated .form-check-input:invalid, .form-check-input.is-invalid {\n  border-color: #fd5c70; }\n  .was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked {\n    background-color: #fd5c70; }\n  .was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus {\n    box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.25); }\n  .was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {\n    color: #fd5c70; }\n\n.form-check-inline .form-check-input ~ .invalid-feedback {\n  margin-left: .5em; }\n\n.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid, .was-validated\n.input-group .form-select:invalid,\n.input-group .form-select.is-invalid {\n  z-index: 2; }\n  .was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus, .was-validated\n  .input-group .form-select:invalid:focus,\n  .input-group .form-select.is-invalid:focus {\n    z-index: 3; }\n\n.btn {\n  display: inline-block;\n  font-weight: 700;\n  line-height: 1.667;\n  color: #7b809a;\n  text-align: center;\n  vertical-align: middle;\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  background-color: transparent;\n  border: 1px solid transparent;\n  padding: 0.625rem 1.5rem;\n  font-size: 0.75rem;\n  border-radius: 0.5rem;\n  transition: all 0.15s ease-in; }\n  @media (prefers-reduced-motion: reduce) {\n    .btn {\n      transition: none; } }\n  .btn:hover {\n    color: #7b809a; }\n  .btn-check:focus + .btn, .btn:focus {\n    outline: 0;\n    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07); }\n  .btn:disabled, .btn.disabled,\n  fieldset:disabled .btn {\n    pointer-events: none;\n    opacity: 0.65; }\n\n.btn-primary {\n  color: #000;\n  background-color: #e91e63;\n  border-color: #e91e63; }\n  .btn-primary:hover {\n    color: #000;\n    background-color: #ec407a;\n    border-color: #eb3573; }\n  .btn-check:focus + .btn-primary, .btn-primary:focus {\n    color: #000;\n    background-color: #ec407a;\n    border-color: #eb3573;\n    box-shadow: 0 0 0 0.2rem rgba(198, 26, 84, 0.5); }\n  .btn-check:checked + .btn-primary,\n  .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active,\n  .show > .btn-primary.dropdown-toggle {\n    color: #000;\n    background-color: #ed4b82;\n    border-color: #eb3573; }\n    .btn-check:checked + .btn-primary:focus,\n    .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus,\n    .show > .btn-primary.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(198, 26, 84, 0.5); }\n  .btn-primary:disabled, .btn-primary.disabled {\n    color: #000;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n\n.btn-secondary {\n  color: #000;\n  background-color: #7b809a;\n  border-color: #7b809a; }\n  .btn-secondary:hover {\n    color: #000;\n    background-color: #8f93a9;\n    border-color: #888da4; }\n  .btn-check:focus + .btn-secondary, .btn-secondary:focus {\n    color: #000;\n    background-color: #8f93a9;\n    border-color: #888da4;\n    box-shadow: 0 0 0 0.2rem rgba(105, 109, 131, 0.5); }\n  .btn-check:checked + .btn-secondary,\n  .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active,\n  .show > .btn-secondary.dropdown-toggle {\n    color: #000;\n    background-color: #9599ae;\n    border-color: #888da4; }\n    .btn-check:checked + .btn-secondary:focus,\n    .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus,\n    .show > .btn-secondary.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(105, 109, 131, 0.5); }\n  .btn-secondary:disabled, .btn-secondary.disabled {\n    color: #000;\n    background-color: #7b809a;\n    border-color: #7b809a; }\n\n.btn-success {\n  color: #000;\n  background-color: #4CAF50;\n  border-color: #4CAF50; }\n  .btn-success:hover {\n    color: #000;\n    background-color: #67bb6a;\n    border-color: #5eb762; }\n  .btn-check:focus + .btn-success, .btn-success:focus {\n    color: #000;\n    background-color: #67bb6a;\n    border-color: #5eb762;\n    box-shadow: 0 0 0 0.2rem rgba(65, 149, 68, 0.5); }\n  .btn-check:checked + .btn-success,\n  .btn-check:active + .btn-success, .btn-success:active, .btn-success.active,\n  .show > .btn-success.dropdown-toggle {\n    color: #000;\n    background-color: #70bf73;\n    border-color: #5eb762; }\n    .btn-check:checked + .btn-success:focus,\n    .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus,\n    .show > .btn-success.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(65, 149, 68, 0.5); }\n  .btn-success:disabled, .btn-success.disabled {\n    color: #000;\n    background-color: #4CAF50;\n    border-color: #4CAF50; }\n\n.btn-info {\n  color: #fff;\n  background-color: #1A73E8;\n  border-color: #1A73E8; }\n  .btn-info:hover {\n    color: #fff;\n    background-color: #1662c5;\n    border-color: #155cba; }\n  .btn-check:focus + .btn-info, .btn-info:focus {\n    color: #fff;\n    background-color: #1662c5;\n    border-color: #155cba;\n    box-shadow: 0 0 0 0.2rem rgba(60, 136, 235, 0.5); }\n  .btn-check:checked + .btn-info,\n  .btn-check:active + .btn-info, .btn-info:active, .btn-info.active,\n  .show > .btn-info.dropdown-toggle {\n    color: #fff;\n    background-color: #155cba;\n    border-color: #1456ae; }\n    .btn-check:checked + .btn-info:focus,\n    .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus,\n    .show > .btn-info.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(60, 136, 235, 0.5); }\n  .btn-info:disabled, .btn-info.disabled {\n    color: #fff;\n    background-color: #1A73E8;\n    border-color: #1A73E8; }\n\n.btn-warning {\n  color: #000;\n  background-color: #fb8c00;\n  border-color: #fb8c00; }\n  .btn-warning:hover {\n    color: #000;\n    background-color: #fc9d26;\n    border-color: #fb981a; }\n  .btn-check:focus + .btn-warning, .btn-warning:focus {\n    color: #000;\n    background-color: #fc9d26;\n    border-color: #fb981a;\n    box-shadow: 0 0 0 0.2rem rgba(213, 119, 0, 0.5); }\n  .btn-check:checked + .btn-warning,\n  .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active,\n  .show > .btn-warning.dropdown-toggle {\n    color: #000;\n    background-color: #fca333;\n    border-color: #fb981a; }\n    .btn-check:checked + .btn-warning:focus,\n    .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus,\n    .show > .btn-warning.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(213, 119, 0, 0.5); }\n  .btn-warning:disabled, .btn-warning.disabled {\n    color: #000;\n    background-color: #fb8c00;\n    border-color: #fb8c00; }\n\n.btn-danger {\n  color: #000;\n  background-color: #F44335;\n  border-color: #F44335; }\n  .btn-danger:hover {\n    color: #000;\n    background-color: #f65f53;\n    border-color: #f55649; }\n  .btn-check:focus + .btn-danger, .btn-danger:focus {\n    color: #000;\n    background-color: #f65f53;\n    border-color: #f55649;\n    box-shadow: 0 0 0 0.2rem rgba(207, 57, 45, 0.5); }\n  .btn-check:checked + .btn-danger,\n  .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active,\n  .show > .btn-danger.dropdown-toggle {\n    color: #000;\n    background-color: #f6695d;\n    border-color: #f55649; }\n    .btn-check:checked + .btn-danger:focus,\n    .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus,\n    .show > .btn-danger.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(207, 57, 45, 0.5); }\n  .btn-danger:disabled, .btn-danger.disabled {\n    color: #000;\n    background-color: #F44335;\n    border-color: #F44335; }\n\n.btn-light {\n  color: #000;\n  background-color: #f0f2f5;\n  border-color: #f0f2f5; }\n  .btn-light:hover {\n    color: #000;\n    background-color: #f2f4f7;\n    border-color: #f2f3f6; }\n  .btn-check:focus + .btn-light, .btn-light:focus {\n    color: #000;\n    background-color: #f2f4f7;\n    border-color: #f2f3f6;\n    box-shadow: 0 0 0 0.2rem rgba(204, 206, 208, 0.5); }\n  .btn-check:checked + .btn-light,\n  .btn-check:active + .btn-light, .btn-light:active, .btn-light.active,\n  .show > .btn-light.dropdown-toggle {\n    color: #000;\n    background-color: #f3f5f7;\n    border-color: #f2f3f6; }\n    .btn-check:checked + .btn-light:focus,\n    .btn-check:active + .btn-light:focus, .btn-light:active:focus, .btn-light.active:focus,\n    .show > .btn-light.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(204, 206, 208, 0.5); }\n  .btn-light:disabled, .btn-light.disabled {\n    color: #000;\n    background-color: #f0f2f5;\n    border-color: #f0f2f5; }\n\n.btn-dark {\n  color: #fff;\n  background-color: #344767;\n  border-color: #344767; }\n  .btn-dark:hover {\n    color: #fff;\n    background-color: #2c3c58;\n    border-color: #2a3952; }\n  .btn-check:focus + .btn-dark, .btn-dark:focus {\n    color: #fff;\n    background-color: #2c3c58;\n    border-color: #2a3952;\n    box-shadow: 0 0 0 0.2rem rgba(82, 99, 126, 0.5); }\n  .btn-check:checked + .btn-dark,\n  .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active,\n  .show > .btn-dark.dropdown-toggle {\n    color: #fff;\n    background-color: #2a3952;\n    border-color: #27354d; }\n    .btn-check:checked + .btn-dark:focus,\n    .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus,\n    .show > .btn-dark.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(82, 99, 126, 0.5); }\n  .btn-dark:disabled, .btn-dark.disabled {\n    color: #fff;\n    background-color: #344767;\n    border-color: #344767; }\n\n.btn-white {\n  color: #000;\n  background-color: #fff;\n  border-color: #fff; }\n  .btn-white:hover {\n    color: #000;\n    background-color: white;\n    border-color: white; }\n  .btn-check:focus + .btn-white, .btn-white:focus {\n    color: #000;\n    background-color: white;\n    border-color: white;\n    box-shadow: 0 0 0 0.2rem rgba(217, 217, 217, 0.5); }\n  .btn-check:checked + .btn-white,\n  .btn-check:active + .btn-white, .btn-white:active, .btn-white.active,\n  .show > .btn-white.dropdown-toggle {\n    color: #000;\n    background-color: white;\n    border-color: white; }\n    .btn-check:checked + .btn-white:focus,\n    .btn-check:active + .btn-white:focus, .btn-white:active:focus, .btn-white.active:focus,\n    .show > .btn-white.dropdown-toggle:focus {\n      box-shadow: 0 0 0 0.2rem rgba(217, 217, 217, 0.5); }\n  .btn-white:disabled, .btn-white.disabled {\n    color: #000;\n    background-color: #fff;\n    border-color: #fff; }\n\n.btn-outline-primary {\n  color: #e91e63;\n  border-color: #e91e63; }\n  .btn-outline-primary:hover {\n    color: #000;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n  .btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus {\n    box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.5); }\n  .btn-check:checked + .btn-outline-primary,\n  .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {\n    color: #000;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n    .btn-check:checked + .btn-outline-primary:focus,\n    .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.5); }\n  .btn-outline-primary:disabled, .btn-outline-primary.disabled {\n    color: #e91e63;\n    background-color: transparent; }\n\n.btn-outline-secondary {\n  color: #7b809a;\n  border-color: #7b809a; }\n  .btn-outline-secondary:hover {\n    color: #000;\n    background-color: #7b809a;\n    border-color: #7b809a; }\n  .btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus {\n    box-shadow: 0 0 0 0.2rem rgba(123, 128, 154, 0.5); }\n  .btn-check:checked + .btn-outline-secondary,\n  .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {\n    color: #000;\n    background-color: #7b809a;\n    border-color: #7b809a; }\n    .btn-check:checked + .btn-outline-secondary:focus,\n    .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(123, 128, 154, 0.5); }\n  .btn-outline-secondary:disabled, .btn-outline-secondary.disabled {\n    color: #7b809a;\n    background-color: transparent; }\n\n.btn-outline-success {\n  color: #4CAF50;\n  border-color: #4CAF50; }\n  .btn-outline-success:hover {\n    color: #000;\n    background-color: #4CAF50;\n    border-color: #4CAF50; }\n  .btn-check:focus + .btn-outline-success, .btn-outline-success:focus {\n    box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5); }\n  .btn-check:checked + .btn-outline-success,\n  .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show {\n    color: #000;\n    background-color: #4CAF50;\n    border-color: #4CAF50; }\n    .btn-check:checked + .btn-outline-success:focus,\n    .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5); }\n  .btn-outline-success:disabled, .btn-outline-success.disabled {\n    color: #4CAF50;\n    background-color: transparent; }\n\n.btn-outline-info {\n  color: #1A73E8;\n  border-color: #1A73E8; }\n  .btn-outline-info:hover {\n    color: #fff;\n    background-color: #1A73E8;\n    border-color: #1A73E8; }\n  .btn-check:focus + .btn-outline-info, .btn-outline-info:focus {\n    box-shadow: 0 0 0 0.2rem rgba(26, 115, 232, 0.5); }\n  .btn-check:checked + .btn-outline-info,\n  .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show {\n    color: #fff;\n    background-color: #1A73E8;\n    border-color: #1A73E8; }\n    .btn-check:checked + .btn-outline-info:focus,\n    .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(26, 115, 232, 0.5); }\n  .btn-outline-info:disabled, .btn-outline-info.disabled {\n    color: #1A73E8;\n    background-color: transparent; }\n\n.btn-outline-warning {\n  color: #fb8c00;\n  border-color: #fb8c00; }\n  .btn-outline-warning:hover {\n    color: #000;\n    background-color: #fb8c00;\n    border-color: #fb8c00; }\n  .btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus {\n    box-shadow: 0 0 0 0.2rem rgba(251, 140, 0, 0.5); }\n  .btn-check:checked + .btn-outline-warning,\n  .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show {\n    color: #000;\n    background-color: #fb8c00;\n    border-color: #fb8c00; }\n    .btn-check:checked + .btn-outline-warning:focus,\n    .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(251, 140, 0, 0.5); }\n  .btn-outline-warning:disabled, .btn-outline-warning.disabled {\n    color: #fb8c00;\n    background-color: transparent; }\n\n.btn-outline-danger {\n  color: #F44335;\n  border-color: #F44335; }\n  .btn-outline-danger:hover {\n    color: #000;\n    background-color: #F44335;\n    border-color: #F44335; }\n  .btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus {\n    box-shadow: 0 0 0 0.2rem rgba(244, 67, 53, 0.5); }\n  .btn-check:checked + .btn-outline-danger,\n  .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show {\n    color: #000;\n    background-color: #F44335;\n    border-color: #F44335; }\n    .btn-check:checked + .btn-outline-danger:focus,\n    .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(244, 67, 53, 0.5); }\n  .btn-outline-danger:disabled, .btn-outline-danger.disabled {\n    color: #F44335;\n    background-color: transparent; }\n\n.btn-outline-light {\n  color: #f0f2f5;\n  border-color: #f0f2f5; }\n  .btn-outline-light:hover {\n    color: #000;\n    background-color: #f0f2f5;\n    border-color: #f0f2f5; }\n  .btn-check:focus + .btn-outline-light, .btn-outline-light:focus {\n    box-shadow: 0 0 0 0.2rem rgba(240, 242, 245, 0.5); }\n  .btn-check:checked + .btn-outline-light,\n  .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show {\n    color: #000;\n    background-color: #f0f2f5;\n    border-color: #f0f2f5; }\n    .btn-check:checked + .btn-outline-light:focus,\n    .btn-check:active + .btn-outline-light:focus, .btn-outline-light:active:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(240, 242, 245, 0.5); }\n  .btn-outline-light:disabled, .btn-outline-light.disabled {\n    color: #f0f2f5;\n    background-color: transparent; }\n\n.btn-outline-dark {\n  color: #344767;\n  border-color: #344767; }\n  .btn-outline-dark:hover {\n    color: #fff;\n    background-color: #344767;\n    border-color: #344767; }\n  .btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus {\n    box-shadow: 0 0 0 0.2rem rgba(52, 71, 103, 0.5); }\n  .btn-check:checked + .btn-outline-dark,\n  .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show {\n    color: #fff;\n    background-color: #344767;\n    border-color: #344767; }\n    .btn-check:checked + .btn-outline-dark:focus,\n    .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(52, 71, 103, 0.5); }\n  .btn-outline-dark:disabled, .btn-outline-dark.disabled {\n    color: #344767;\n    background-color: transparent; }\n\n.btn-outline-white {\n  color: #fff;\n  border-color: #fff; }\n  .btn-outline-white:hover {\n    color: #000;\n    background-color: #fff;\n    border-color: #fff; }\n  .btn-check:focus + .btn-outline-white, .btn-outline-white:focus {\n    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); }\n  .btn-check:checked + .btn-outline-white,\n  .btn-check:active + .btn-outline-white, .btn-outline-white:active, .btn-outline-white.active, .btn-outline-white.dropdown-toggle.show {\n    color: #000;\n    background-color: #fff;\n    border-color: #fff; }\n    .btn-check:checked + .btn-outline-white:focus,\n    .btn-check:active + .btn-outline-white:focus, .btn-outline-white:active:focus, .btn-outline-white.active:focus, .btn-outline-white.dropdown-toggle.show:focus {\n      box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); }\n  .btn-outline-white:disabled, .btn-outline-white.disabled {\n    color: #fff;\n    background-color: transparent; }\n\n.btn-link {\n  font-weight: 400;\n  color: #e91e63;\n  text-decoration: none; }\n  .btn-link:hover {\n    color: #e91e63;\n    text-decoration: none; }\n  .btn-link:focus {\n    text-decoration: none; }\n  .btn-link:disabled, .btn-link.disabled {\n    color: #6c757d; }\n\n.btn-lg, .btn-group-lg > .btn {\n  padding: 0.75rem 1.75rem;\n  font-size: 0.875rem;\n  border-radius: 0.5rem; }\n\n.btn-sm, .btn-group-sm > .btn {\n  padding: 0.375rem 1rem;\n  font-size: 0.75rem;\n  border-radius: 0.5rem; }\n\n.fade {\n  transition: opacity 0.15s linear; }\n  @media (prefers-reduced-motion: reduce) {\n    .fade {\n      transition: none; } }\n  .fade:not(.show) {\n    opacity: 0; }\n\n.collapse:not(.show) {\n  display: none; }\n\n.collapsing {\n  height: 0;\n  overflow: hidden;\n  transition: height 0.35s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .collapsing {\n      transition: none; } }\n  .collapsing.collapse-horizontal {\n    width: 0;\n    height: auto;\n    transition: width 0.35s ease; }\n    @media (prefers-reduced-motion: reduce) {\n      .collapsing.collapse-horizontal {\n        transition: none; } }\n\n.dropup,\n.dropend,\n.dropdown,\n.dropstart {\n  position: relative; }\n\n.dropdown-toggle {\n  white-space: nowrap; }\n  .dropdown-toggle::after {\n    display: inline-block;\n    margin-left: 0.255em;\n    vertical-align: 0.255em;\n    content: \"\";\n    border-top: 0.3em solid;\n    border-right: 0.3em solid transparent;\n    border-bottom: 0;\n    border-left: 0.3em solid transparent; }\n  .dropdown-toggle:empty::after {\n    margin-left: 0; }\n\n.dropdown-menu {\n  position: absolute;\n  z-index: 1000;\n  display: none;\n  min-width: 11rem;\n  padding: 0.5rem 0;\n  margin: 0;\n  font-size: 0.875rem;\n  color: #7b809a;\n  text-align: left;\n  list-style: none;\n  background-color: #fff;\n  background-clip: padding-box;\n  border: 0 solid transparent;\n  border-radius: 0.375rem; }\n  .dropdown-menu[data-bs-popper] {\n    top: 100%;\n    left: 0;\n    margin-top: 1.625rem; }\n\n.dropdown-menu-start {\n  --bs-position: start; }\n  .dropdown-menu-start[data-bs-popper] {\n    right: auto;\n    left: 0; }\n\n.dropdown-menu-end {\n  --bs-position: end; }\n  .dropdown-menu-end[data-bs-popper] {\n    right: 0;\n    left: auto; }\n\n@media (min-width: 576px) {\n  .dropdown-menu-sm-start {\n    --bs-position: start; }\n    .dropdown-menu-sm-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-sm-end {\n    --bs-position: end; }\n    .dropdown-menu-sm-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 768px) {\n  .dropdown-menu-md-start {\n    --bs-position: start; }\n    .dropdown-menu-md-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-md-end {\n    --bs-position: end; }\n    .dropdown-menu-md-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 992px) {\n  .dropdown-menu-lg-start {\n    --bs-position: start; }\n    .dropdown-menu-lg-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-lg-end {\n    --bs-position: end; }\n    .dropdown-menu-lg-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 1200px) {\n  .dropdown-menu-xl-start {\n    --bs-position: start; }\n    .dropdown-menu-xl-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-xl-end {\n    --bs-position: end; }\n    .dropdown-menu-xl-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n@media (min-width: 1400px) {\n  .dropdown-menu-xxl-start {\n    --bs-position: start; }\n    .dropdown-menu-xxl-start[data-bs-popper] {\n      right: auto;\n      left: 0; }\n  .dropdown-menu-xxl-end {\n    --bs-position: end; }\n    .dropdown-menu-xxl-end[data-bs-popper] {\n      right: 0;\n      left: auto; } }\n\n.dropup .dropdown-menu[data-bs-popper] {\n  top: auto;\n  bottom: 100%;\n  margin-top: 0;\n  margin-bottom: 1.625rem; }\n\n.dropup .dropdown-toggle::after {\n  display: inline-block;\n  margin-left: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\";\n  border-top: 0;\n  border-right: 0.3em solid transparent;\n  border-bottom: 0.3em solid;\n  border-left: 0.3em solid transparent; }\n\n.dropup .dropdown-toggle:empty::after {\n  margin-left: 0; }\n\n.dropend .dropdown-menu[data-bs-popper] {\n  top: 0;\n  right: auto;\n  left: 100%;\n  margin-top: 0;\n  margin-left: 1.625rem; }\n\n.dropend .dropdown-toggle::after {\n  display: inline-block;\n  margin-left: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\";\n  border-top: 0.3em solid transparent;\n  border-right: 0;\n  border-bottom: 0.3em solid transparent;\n  border-left: 0.3em solid; }\n\n.dropend .dropdown-toggle:empty::after {\n  margin-left: 0; }\n\n.dropend .dropdown-toggle::after {\n  vertical-align: 0; }\n\n.dropstart .dropdown-menu[data-bs-popper] {\n  top: 0;\n  right: 100%;\n  left: auto;\n  margin-top: 0;\n  margin-right: 1.625rem; }\n\n.dropstart .dropdown-toggle::after {\n  display: inline-block;\n  margin-left: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\"; }\n\n.dropstart .dropdown-toggle::after {\n  display: none; }\n\n.dropstart .dropdown-toggle::before {\n  display: inline-block;\n  margin-right: 0.255em;\n  vertical-align: 0.255em;\n  content: \"\";\n  border-top: 0.3em solid transparent;\n  border-right: 0.3em solid;\n  border-bottom: 0.3em solid transparent; }\n\n.dropstart .dropdown-toggle:empty::after {\n  margin-left: 0; }\n\n.dropstart .dropdown-toggle::before {\n  vertical-align: 0; }\n\n.dropdown-divider {\n  height: 0;\n  margin: 0.5rem 0;\n  overflow: hidden;\n  border-top: 1px solid transparent; }\n\n.dropdown-item {\n  display: block;\n  width: 100%;\n  padding: 0.3rem 1rem;\n  clear: both;\n  font-weight: 400;\n  color: #7b809a;\n  text-align: inherit;\n  white-space: nowrap;\n  background-color: transparent;\n  border: 0; }\n  .dropdown-item:hover, .dropdown-item:focus {\n    color: #344767;\n    background-color: #f0f2f5; }\n  .dropdown-item.active, .dropdown-item:active {\n    color: #7b809a;\n    text-decoration: none;\n    background-color: transparent; }\n  .dropdown-item.disabled, .dropdown-item:disabled {\n    color: #6c757d;\n    pointer-events: none;\n    background-color: transparent; }\n\n.dropdown-menu.show {\n  display: block; }\n\n.dropdown-header {\n  display: block;\n  padding: 0.5rem 1rem;\n  margin-bottom: 0;\n  font-size: 0.875rem;\n  color: #6c757d;\n  white-space: nowrap; }\n\n.dropdown-item-text {\n  display: block;\n  padding: 0.3rem 1rem;\n  color: #7b809a; }\n\n.dropdown-menu-dark {\n  color: #dee2e6;\n  background-color: #343a40;\n  border-color: transparent; }\n  .dropdown-menu-dark .dropdown-item {\n    color: #dee2e6; }\n    .dropdown-menu-dark .dropdown-item:hover, .dropdown-menu-dark .dropdown-item:focus {\n      color: #fff;\n      background-color: rgba(255, 255, 255, 0.15); }\n    .dropdown-menu-dark .dropdown-item.active, .dropdown-menu-dark .dropdown-item:active {\n      color: #7b809a;\n      background-color: transparent; }\n    .dropdown-menu-dark .dropdown-item.disabled, .dropdown-menu-dark .dropdown-item:disabled {\n      color: #adb5bd; }\n  .dropdown-menu-dark .dropdown-divider {\n    border-color: transparent; }\n  .dropdown-menu-dark .dropdown-item-text {\n    color: #dee2e6; }\n  .dropdown-menu-dark .dropdown-header {\n    color: #adb5bd; }\n\n.btn-group,\n.btn-group-vertical {\n  position: relative;\n  display: inline-flex;\n  vertical-align: middle; }\n  .btn-group > .btn,\n  .btn-group-vertical > .btn {\n    position: relative;\n    flex: 1 1 auto; }\n  .btn-group > .btn-check:checked + .btn,\n  .btn-group > .btn-check:focus + .btn,\n  .btn-group > .btn:hover,\n  .btn-group > .btn:focus,\n  .btn-group > .btn:active,\n  .btn-group > .btn.active,\n  .btn-group-vertical > .btn-check:checked + .btn,\n  .btn-group-vertical > .btn-check:focus + .btn,\n  .btn-group-vertical > .btn:hover,\n  .btn-group-vertical > .btn:focus,\n  .btn-group-vertical > .btn:active,\n  .btn-group-vertical > .btn.active {\n    z-index: 1; }\n\n.btn-toolbar {\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: flex-start; }\n  .btn-toolbar .input-group {\n    width: auto; }\n\n.btn-group > .btn:not(:first-child),\n.btn-group > .btn-group:not(:first-child) {\n  margin-left: -1px; }\n\n.btn-group > .btn:not(:last-child):not(.dropdown-toggle),\n.btn-group > .btn-group:not(:last-child) > .btn {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0; }\n\n.btn-group > .btn:nth-child(n + 3),\n.btn-group > :not(.btn-check) + .btn,\n.btn-group > .btn-group:not(:first-child) > .btn {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.dropdown-toggle-split {\n  padding-right: 1.125rem;\n  padding-left: 1.125rem; }\n  .dropdown-toggle-split::after,\n  .dropup .dropdown-toggle-split::after,\n  .dropend .dropdown-toggle-split::after {\n    margin-left: 0; }\n  .dropstart .dropdown-toggle-split::before {\n    margin-right: 0; }\n\n.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {\n  padding-right: 0.75rem;\n  padding-left: 0.75rem; }\n\n.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {\n  padding-right: 1.3125rem;\n  padding-left: 1.3125rem; }\n\n.btn-group-vertical {\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center; }\n  .btn-group-vertical > .btn,\n  .btn-group-vertical > .btn-group {\n    width: 100%; }\n  .btn-group-vertical > .btn:not(:first-child),\n  .btn-group-vertical > .btn-group:not(:first-child) {\n    margin-top: -1px; }\n  .btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),\n  .btn-group-vertical > .btn-group:not(:last-child) > .btn {\n    border-bottom-right-radius: 0;\n    border-bottom-left-radius: 0; }\n  .btn-group-vertical > .btn ~ .btn,\n  .btn-group-vertical > .btn-group:not(:first-child) > .btn {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0; }\n\n.nav {\n  display: flex;\n  flex-wrap: wrap;\n  padding-left: 0;\n  margin-bottom: 0;\n  list-style: none; }\n\n.nav-link {\n  display: block;\n  padding: 0.5rem 1rem;\n  color: #e91e63;\n  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .nav-link {\n      transition: none; } }\n  .nav-link:hover, .nav-link:focus {\n    color: #e91e63; }\n  .nav-link.disabled {\n    color: #6c757d;\n    pointer-events: none;\n    cursor: default; }\n\n.nav-tabs {\n  border-bottom: 1px solid #dee2e6; }\n  .nav-tabs .nav-link {\n    margin-bottom: -1px;\n    background: none;\n    border: 1px solid transparent;\n    border-top-left-radius: 0.375rem;\n    border-top-right-radius: 0.375rem; }\n    .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {\n      border-color: #f0f2f5 #f0f2f5 #dee2e6;\n      isolation: isolate; }\n    .nav-tabs .nav-link.disabled {\n      color: #6c757d;\n      background-color: transparent;\n      border-color: transparent; }\n  .nav-tabs .nav-link.active,\n  .nav-tabs .nav-item.show .nav-link {\n    color: #495057;\n    background-color: #fff;\n    border-color: #dee2e6 #dee2e6 #fff; }\n  .nav-tabs .dropdown-menu {\n    margin-top: -1px;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0; }\n\n.nav-pills .nav-link {\n  background: none;\n  border: 0;\n  border-radius: 0.75rem; }\n\n.nav-pills .nav-link.active,\n.nav-pills .show > .nav-link {\n  color: #344767;\n  background-color: #fff; }\n\n.nav-fill > .nav-link,\n.nav-fill .nav-item {\n  flex: 1 1 auto;\n  text-align: center; }\n\n.nav-justified > .nav-link,\n.nav-justified .nav-item {\n  flex-basis: 0;\n  flex-grow: 1;\n  text-align: center; }\n\n.nav-fill .nav-item .nav-link,\n.nav-justified .nav-item .nav-link {\n  width: 100%; }\n\n.tab-content > .tab-pane {\n  display: none; }\n\n.tab-content > .active {\n  display: block; }\n\n.navbar {\n  position: relative;\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 0.5rem;\n  padding-right: 1rem;\n  padding-bottom: 0.5rem;\n  padding-left: 1rem; }\n  .navbar > .container,\n  .navbar > .container-fluid, .navbar > .container-sm, .navbar > .container-md, .navbar > .container-lg, .navbar > .container-xl, .navbar > .container-xxl {\n    display: flex;\n    flex-wrap: inherit;\n    align-items: center;\n    justify-content: space-between; }\n\n.navbar-brand {\n  padding-top: 0.40625rem;\n  padding-bottom: 0.40625rem;\n  margin-right: 1rem;\n  font-size: 1.125rem;\n  white-space: nowrap; }\n\n.navbar-nav {\n  display: flex;\n  flex-direction: column;\n  padding-left: 0;\n  margin-bottom: 0;\n  list-style: none; }\n  .navbar-nav .nav-link {\n    padding-right: 0;\n    padding-left: 0; }\n  .navbar-nav .dropdown-menu {\n    position: static; }\n\n.navbar-text {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem; }\n\n.navbar-collapse {\n  flex-basis: 100%;\n  flex-grow: 1;\n  align-items: center; }\n\n.navbar-toggler {\n  padding: 0.25rem 0.75rem;\n  font-size: 1.125rem;\n  line-height: 1;\n  background-color: transparent;\n  border: 1px solid transparent;\n  border-radius: 0.5rem;\n  transition: box-shadow 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-toggler {\n      transition: none; } }\n  .navbar-toggler:hover {\n    text-decoration: none; }\n  .navbar-toggler:focus {\n    text-decoration: none;\n    outline: 0;\n    box-shadow: 0 0 0 0.2rem; }\n\n.navbar-toggler-icon {\n  display: inline-block;\n  width: 1.5em;\n  height: 1.5em;\n  vertical-align: middle;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: 100%; }\n\n.navbar-nav-scroll {\n  max-height: var(--bs-scroll-height, 75vh);\n  overflow-y: auto; }\n\n@media (min-width: 576px) {\n  .navbar-expand-sm {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-sm .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-sm .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-sm .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-sm .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-sm .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-sm .navbar-toggler {\n      display: none; }\n    .navbar-expand-sm .offcanvas-header {\n      display: none; }\n    .navbar-expand-sm .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-sm .offcanvas-top,\n    .navbar-expand-sm .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-sm .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 768px) {\n  .navbar-expand-md {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-md .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-md .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-md .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-md .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-md .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-md .navbar-toggler {\n      display: none; }\n    .navbar-expand-md .offcanvas-header {\n      display: none; }\n    .navbar-expand-md .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-md .offcanvas-top,\n    .navbar-expand-md .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-md .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 992px) {\n  .navbar-expand-lg {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-lg .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-lg .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-lg .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-lg .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-lg .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-lg .navbar-toggler {\n      display: none; }\n    .navbar-expand-lg .offcanvas-header {\n      display: none; }\n    .navbar-expand-lg .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-lg .offcanvas-top,\n    .navbar-expand-lg .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-lg .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 1200px) {\n  .navbar-expand-xl {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-xl .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-xl .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-xl .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-xl .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-xl .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-xl .navbar-toggler {\n      display: none; }\n    .navbar-expand-xl .offcanvas-header {\n      display: none; }\n    .navbar-expand-xl .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-xl .offcanvas-top,\n    .navbar-expand-xl .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-xl .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n@media (min-width: 1400px) {\n  .navbar-expand-xxl {\n    flex-wrap: nowrap;\n    justify-content: flex-start; }\n    .navbar-expand-xxl .navbar-nav {\n      flex-direction: row; }\n      .navbar-expand-xxl .navbar-nav .dropdown-menu {\n        position: absolute; }\n      .navbar-expand-xxl .navbar-nav .nav-link {\n        padding-right: 0.5rem;\n        padding-left: 0.5rem; }\n    .navbar-expand-xxl .navbar-nav-scroll {\n      overflow: visible; }\n    .navbar-expand-xxl .navbar-collapse {\n      display: flex !important;\n      flex-basis: auto; }\n    .navbar-expand-xxl .navbar-toggler {\n      display: none; }\n    .navbar-expand-xxl .offcanvas-header {\n      display: none; }\n    .navbar-expand-xxl .offcanvas {\n      position: inherit;\n      bottom: 0;\n      z-index: 1000;\n      flex-grow: 1;\n      visibility: visible !important;\n      background-color: transparent;\n      border-right: 0;\n      border-left: 0;\n      transition: none;\n      transform: none; }\n    .navbar-expand-xxl .offcanvas-top,\n    .navbar-expand-xxl .offcanvas-bottom {\n      height: auto;\n      border-top: 0;\n      border-bottom: 0; }\n    .navbar-expand-xxl .offcanvas-body {\n      display: flex;\n      flex-grow: 0;\n      padding: 0;\n      overflow-y: visible; } }\n\n.navbar-expand {\n  flex-wrap: nowrap;\n  justify-content: flex-start; }\n  .navbar-expand .navbar-nav {\n    flex-direction: row; }\n    .navbar-expand .navbar-nav .dropdown-menu {\n      position: absolute; }\n    .navbar-expand .navbar-nav .nav-link {\n      padding-right: 0.5rem;\n      padding-left: 0.5rem; }\n  .navbar-expand .navbar-nav-scroll {\n    overflow: visible; }\n  .navbar-expand .navbar-collapse {\n    display: flex !important;\n    flex-basis: auto; }\n  .navbar-expand .navbar-toggler {\n    display: none; }\n  .navbar-expand .offcanvas-header {\n    display: none; }\n  .navbar-expand .offcanvas {\n    position: inherit;\n    bottom: 0;\n    z-index: 1000;\n    flex-grow: 1;\n    visibility: visible !important;\n    background-color: transparent;\n    border-right: 0;\n    border-left: 0;\n    transition: none;\n    transform: none; }\n  .navbar-expand .offcanvas-top,\n  .navbar-expand .offcanvas-bottom {\n    height: auto;\n    border-top: 0;\n    border-bottom: 0; }\n  .navbar-expand .offcanvas-body {\n    display: flex;\n    flex-grow: 0;\n    padding: 0;\n    overflow-y: visible; }\n\n.navbar-light .navbar-brand {\n  color: rgba(52, 71, 103, 0.9); }\n  .navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {\n    color: rgba(52, 71, 103, 0.9); }\n\n.navbar-light .navbar-nav .nav-link {\n  color: #344767; }\n  .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {\n    color: rgba(52, 71, 103, 0.7); }\n  .navbar-light .navbar-nav .nav-link.disabled {\n    color: rgba(52, 71, 103, 0.3); }\n\n.navbar-light .navbar-nav .show > .nav-link,\n.navbar-light .navbar-nav .nav-link.active {\n  color: rgba(52, 71, 103, 0.9); }\n\n.navbar-light .navbar-toggler {\n  color: #344767;\n  border-color: rgba(52, 71, 103, 0.1); }\n\n.navbar-light .navbar-toggler-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23344767' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e\"); }\n\n.navbar-light .navbar-text {\n  color: #344767; }\n  .navbar-light .navbar-text a,\n  .navbar-light .navbar-text a:hover,\n  .navbar-light .navbar-text a:focus {\n    color: rgba(52, 71, 103, 0.9); }\n\n.navbar-dark .navbar-brand {\n  color: #fff; }\n  .navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {\n    color: #fff; }\n\n.navbar-dark .navbar-nav .nav-link {\n  color: rgba(255, 255, 255, 0.85); }\n  .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {\n    color: rgba(255, 255, 255, 0.75); }\n  .navbar-dark .navbar-nav .nav-link.disabled {\n    color: rgba(255, 255, 255, 0.25); }\n\n.navbar-dark .navbar-nav .show > .nav-link,\n.navbar-dark .navbar-nav .nav-link.active {\n  color: #fff; }\n\n.navbar-dark .navbar-toggler {\n  color: rgba(255, 255, 255, 0.85);\n  border-color: rgba(255, 255, 255, 0.1); }\n\n.navbar-dark .navbar-toggler-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e\"); }\n\n.navbar-dark .navbar-text {\n  color: rgba(255, 255, 255, 0.85); }\n  .navbar-dark .navbar-text a,\n  .navbar-dark .navbar-text a:hover,\n  .navbar-dark .navbar-text a:focus {\n    color: #fff; }\n\n.card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  word-wrap: break-word;\n  background-color: #fff;\n  background-clip: border-box;\n  border: 0 solid rgba(0, 0, 0, 0.125);\n  border-radius: 0.75rem; }\n  .card > hr {\n    margin-right: 0;\n    margin-left: 0; }\n  .card > .list-group {\n    border-top: inherit;\n    border-bottom: inherit; }\n    .card > .list-group:first-child {\n      border-top-width: 0;\n      border-top-left-radius: 0.75rem;\n      border-top-right-radius: 0.75rem; }\n    .card > .list-group:last-child {\n      border-bottom-width: 0;\n      border-bottom-right-radius: 0.75rem;\n      border-bottom-left-radius: 0.75rem; }\n  .card > .card-header + .list-group,\n  .card > .list-group + .card-footer {\n    border-top: 0; }\n\n.card-body {\n  flex: 1 1 auto;\n  padding: 1rem 1rem; }\n\n.card-title {\n  margin-bottom: 0.5rem; }\n\n.card-subtitle {\n  margin-top: -0.25rem;\n  margin-bottom: 0; }\n\n.card-text:last-child {\n  margin-bottom: 0; }\n\n.card-link + .card-link {\n  margin-left: 1rem; }\n\n.card-header {\n  padding: 0.5rem 1rem;\n  margin-bottom: 0;\n  background-color: #fff;\n  border-bottom: 0 solid rgba(0, 0, 0, 0.125); }\n  .card-header:first-child {\n    border-radius: 0.75rem 0.75rem 0 0; }\n\n.card-footer {\n  padding: 0.5rem 1rem;\n  background-color: #fff;\n  border-top: 0 solid rgba(0, 0, 0, 0.125); }\n  .card-footer:last-child {\n    border-radius: 0 0 0.75rem 0.75rem; }\n\n.card-header-tabs {\n  margin-right: -0.5rem;\n  margin-bottom: -0.5rem;\n  margin-left: -0.5rem;\n  border-bottom: 0; }\n\n.card-header-pills {\n  margin-right: -0.5rem;\n  margin-left: -0.5rem; }\n\n.card-img-overlay {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  padding: 1rem;\n  border-radius: 0.75rem; }\n\n.card-img,\n.card-img-top,\n.card-img-bottom {\n  width: 100%; }\n\n.card-img,\n.card-img-top {\n  border-top-left-radius: 0.75rem;\n  border-top-right-radius: 0.75rem; }\n\n.card-img,\n.card-img-bottom {\n  border-bottom-right-radius: 0.75rem;\n  border-bottom-left-radius: 0.75rem; }\n\n.card-group > .card {\n  margin-bottom: 0.75rem; }\n\n@media (min-width: 576px) {\n  .card-group {\n    display: flex;\n    flex-flow: row wrap; }\n    .card-group > .card {\n      flex: 1 0 0%;\n      margin-bottom: 0; }\n      .card-group > .card + .card {\n        margin-left: 0;\n        border-left: 0; }\n      .card-group > .card:not(:last-child) {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0; }\n        .card-group > .card:not(:last-child) .card-img-top,\n        .card-group > .card:not(:last-child) .card-header {\n          border-top-right-radius: 0; }\n        .card-group > .card:not(:last-child) .card-img-bottom,\n        .card-group > .card:not(:last-child) .card-footer {\n          border-bottom-right-radius: 0; }\n      .card-group > .card:not(:first-child) {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0; }\n        .card-group > .card:not(:first-child) .card-img-top,\n        .card-group > .card:not(:first-child) .card-header {\n          border-top-left-radius: 0; }\n        .card-group > .card:not(:first-child) .card-img-bottom,\n        .card-group > .card:not(:first-child) .card-footer {\n          border-bottom-left-radius: 0; } }\n\n.accordion-button {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  padding: 1rem 0rem;\n  font-size: 1rem;\n  color: #7b809a;\n  text-align: left;\n  background-color: transparent;\n  border: 0;\n  border-radius: 0;\n  overflow-anchor: none;\n  transition: all 0.15s ease-in, border-radius 0.15s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .accordion-button {\n      transition: none; } }\n  .accordion-button:not(.collapsed) {\n    color: #344767;\n    background-color: transparent;\n    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.125); }\n    .accordion-button:not(.collapsed)::after {\n      background-image: none;\n      transform: rotate(180deg); }\n  .accordion-button::after {\n    flex-shrink: 0;\n    width: 1rem;\n    height: 1rem;\n    margin-left: auto;\n    content: \"\";\n    background-image: none;\n    background-repeat: no-repeat;\n    background-size: 1rem;\n    transition: transform 0.2s ease-in-out; }\n    @media (prefers-reduced-motion: reduce) {\n      .accordion-button::after {\n        transition: none; } }\n  .accordion-button:hover {\n    z-index: 2; }\n  .accordion-button:focus {\n    z-index: 3;\n    border-color: transparent;\n    outline: 0;\n    box-shadow: none; }\n\n.accordion-header {\n  margin-bottom: 0; }\n\n.accordion-item {\n  background-color: transparent;\n  border: 0 solid rgba(0, 0, 0, 0.125); }\n  .accordion-item:first-of-type {\n    border-top-left-radius: 0.125rem;\n    border-top-right-radius: 0.125rem; }\n    .accordion-item:first-of-type .accordion-button {\n      border-top-left-radius: 0.125rem;\n      border-top-right-radius: 0.125rem; }\n  .accordion-item:not(:first-of-type) {\n    border-top: 0; }\n  .accordion-item:last-of-type {\n    border-bottom-right-radius: 0.125rem;\n    border-bottom-left-radius: 0.125rem; }\n    .accordion-item:last-of-type .accordion-button.collapsed {\n      border-bottom-right-radius: 0.125rem;\n      border-bottom-left-radius: 0.125rem; }\n    .accordion-item:last-of-type .accordion-collapse {\n      border-bottom-right-radius: 0.125rem;\n      border-bottom-left-radius: 0.125rem; }\n\n.accordion-body {\n  padding: 1rem 0rem; }\n\n.accordion-flush .accordion-collapse {\n  border-width: 0; }\n\n.accordion-flush .accordion-item {\n  border-right: 0;\n  border-left: 0;\n  border-radius: 0; }\n  .accordion-flush .accordion-item:first-child {\n    border-top: 0; }\n  .accordion-flush .accordion-item:last-child {\n    border-bottom: 0; }\n  .accordion-flush .accordion-item .accordion-button {\n    border-radius: 0; }\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  padding: 0.5rem 1rem;\n  margin-bottom: 1rem;\n  list-style: none;\n  background-color: #f0f2f5;\n  border-radius: 0.375rem; }\n\n.breadcrumb-item + .breadcrumb-item {\n  padding-left: 0.5rem; }\n  .breadcrumb-item + .breadcrumb-item::before {\n    float: left;\n    padding-right: 0.5rem;\n    color: #6c757d;\n    content: var(--bs-breadcrumb-divider, \"/\") /* rtl: var(--bs-breadcrumb-divider, \"/\") */; }\n\n.breadcrumb-item.active {\n  color: #6c757d; }\n\n.pagination {\n  display: flex;\n  padding-left: 0;\n  list-style: none; }\n\n.page-link {\n  position: relative;\n  display: block;\n  color: #e91e63;\n  background-color: #fff;\n  border: 1px solid #dee2e6;\n  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .page-link {\n      transition: none; } }\n  .page-link:hover {\n    z-index: 2;\n    color: #e91e63;\n    background-color: #f0f2f5;\n    border-color: #dee2e6; }\n  .page-link:focus {\n    z-index: 3;\n    color: #e91e63;\n    background-color: #f0f2f5;\n    outline: 0;\n    box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.25); }\n\n.page-item:not(:first-child) .page-link {\n  margin-left: -1px; }\n\n.page-item.active .page-link {\n  z-index: 3;\n  color: #fff;\n  background-color: #e91e63;\n  border-color: #e91e63; }\n\n.page-item.disabled .page-link {\n  color: #6c757d;\n  pointer-events: none;\n  background-color: #fff;\n  border-color: #dee2e6; }\n\n.page-link {\n  padding: 0.375rem 0.75rem; }\n\n.page-item:first-child .page-link {\n  border-top-left-radius: 0.375rem;\n  border-bottom-left-radius: 0.375rem; }\n\n.page-item:last-child .page-link {\n  border-top-right-radius: 0.375rem;\n  border-bottom-right-radius: 0.375rem; }\n\n.pagination-lg .page-link {\n  padding: 0.75rem 1.5rem;\n  font-size: 1.125rem; }\n\n.pagination-lg .page-item:first-child .page-link {\n  border-top-left-radius: 0.5rem;\n  border-bottom-left-radius: 0.5rem; }\n\n.pagination-lg .page-item:last-child .page-link {\n  border-top-right-radius: 0.5rem;\n  border-bottom-right-radius: 0.5rem; }\n\n.pagination-sm .page-link {\n  padding: 0.25rem 0.5rem;\n  font-size: 0.875rem; }\n\n.pagination-sm .page-item:first-child .page-link {\n  border-top-left-radius: 0.125rem;\n  border-bottom-left-radius: 0.125rem; }\n\n.pagination-sm .page-item:last-child .page-link {\n  border-top-right-radius: 0.125rem;\n  border-bottom-right-radius: 0.125rem; }\n\n.badge {\n  display: inline-block;\n  padding: 0.55em 0.9em;\n  font-size: 0.75em;\n  font-weight: 700;\n  line-height: 1;\n  color: #fff;\n  text-align: center;\n  white-space: nowrap;\n  vertical-align: baseline;\n  border-radius: 0.45rem; }\n  .badge:empty {\n    display: none; }\n\n.btn .badge {\n  position: relative;\n  top: -1px; }\n\n.alert {\n  position: relative;\n  padding: 1rem 1rem;\n  margin-bottom: 1rem;\n  border: 0 solid transparent;\n  border-radius: 0.375rem; }\n\n.alert-heading {\n  color: inherit; }\n\n.alert-link {\n  font-weight: 600; }\n\n.alert-dismissible {\n  padding-right: 3rem; }\n  .alert-dismissible .btn-close {\n    position: absolute;\n    top: 0;\n    right: 0;\n    z-index: 2;\n    padding: 1.25rem 1rem; }\n\n.alert-primary {\n  color: #8c123b;\n  background-color: #fbd2e0;\n  border-color: #f8bcd0; }\n  .alert-primary .alert-link {\n    color: #700e2f; }\n\n.alert-secondary {\n  color: #4a4d5c;\n  background-color: #e5e6eb;\n  border-color: #d7d9e1; }\n  .alert-secondary .alert-link {\n    color: #3b3e4a; }\n\n.alert-success {\n  color: #2e6930;\n  background-color: #dbefdc;\n  border-color: #c9e7cb; }\n  .alert-success .alert-link {\n    color: #255426; }\n\n.alert-info {\n  color: #10458b;\n  background-color: #d1e3fa;\n  border-color: #bad5f8; }\n  .alert-info .alert-link {\n    color: #0d376f; }\n\n.alert-warning {\n  color: #975400;\n  background-color: #fee8cc;\n  border-color: #feddb3; }\n  .alert-warning .alert-link {\n    color: #794300; }\n\n.alert-danger {\n  color: #922820;\n  background-color: #fdd9d7;\n  border-color: #fcc7c2; }\n  .alert-danger .alert-link {\n    color: #75201a; }\n\n.alert-light {\n  color: #606162;\n  background-color: #fcfcfd;\n  border-color: #fbfbfc; }\n  .alert-light .alert-link {\n    color: #4d4e4e; }\n\n.alert-dark {\n  color: #1f2b3e;\n  background-color: #d6dae1;\n  border-color: #c2c8d1; }\n  .alert-dark .alert-link {\n    color: #192232; }\n\n.alert-white {\n  color: #666666;\n  background-color: white;\n  border-color: white; }\n  .alert-white .alert-link {\n    color: #525252; }\n\n@-webkit-keyframes progress-bar-stripes {\n  0% {\n    background-position-x: 6px; } }\n\n@keyframes progress-bar-stripes {\n  0% {\n    background-position-x: 6px; } }\n\n.progress {\n  display: flex;\n  height: 6px;\n  overflow: hidden;\n  font-size: 0.75rem;\n  background-color: #f0f2f5;\n  border-radius: 0.125rem; }\n\n.progress-bar {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  overflow: hidden;\n  color: #fff;\n  text-align: center;\n  white-space: nowrap;\n  background-color: #e91e63;\n  transition: width 0.6s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .progress-bar {\n      transition: none; } }\n\n.progress-bar-striped {\n  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);\n  background-size: 6px 6px; }\n\n.progress-bar-animated {\n  -webkit-animation: 1s linear infinite progress-bar-stripes;\n          animation: 1s linear infinite progress-bar-stripes; }\n  @media (prefers-reduced-motion: reduce) {\n    .progress-bar-animated {\n      -webkit-animation: none;\n              animation: none; } }\n\n.list-group {\n  display: flex;\n  flex-direction: column;\n  padding-left: 0;\n  margin-bottom: 0;\n  border-radius: 0.375rem; }\n\n.list-group-numbered {\n  list-style-type: none;\n  counter-reset: section; }\n  .list-group-numbered > li::before {\n    content: counters(section, \".\") \". \";\n    counter-increment: section; }\n\n.list-group-item-action {\n  width: 100%;\n  color: #495057;\n  text-align: inherit; }\n  .list-group-item-action:hover, .list-group-item-action:focus {\n    z-index: 1;\n    color: #495057;\n    text-decoration: none;\n    background-color: #f8f9fa; }\n  .list-group-item-action:active {\n    color: #7b809a;\n    background-color: #f0f2f5; }\n\n.list-group-item {\n  position: relative;\n  display: block;\n  padding: 0.5rem 1rem;\n  color: inherit;\n  background-color: #fff;\n  border: 1px solid rgba(0, 0, 0, 0.125); }\n  .list-group-item:first-child {\n    border-top-left-radius: inherit;\n    border-top-right-radius: inherit; }\n  .list-group-item:last-child {\n    border-bottom-right-radius: inherit;\n    border-bottom-left-radius: inherit; }\n  .list-group-item.disabled, .list-group-item:disabled {\n    color: #6c757d;\n    pointer-events: none;\n    background-color: #fff; }\n  .list-group-item.active {\n    z-index: 2;\n    color: #fff;\n    background-color: #e91e63;\n    border-color: #e91e63; }\n  .list-group-item + .list-group-item {\n    border-top-width: 0; }\n    .list-group-item + .list-group-item.active {\n      margin-top: -1px;\n      border-top-width: 1px; }\n\n.list-group-horizontal {\n  flex-direction: row; }\n  .list-group-horizontal > .list-group-item:first-child {\n    border-bottom-left-radius: 0.375rem;\n    border-top-right-radius: 0; }\n  .list-group-horizontal > .list-group-item:last-child {\n    border-top-right-radius: 0.375rem;\n    border-bottom-left-radius: 0; }\n  .list-group-horizontal > .list-group-item.active {\n    margin-top: 0; }\n  .list-group-horizontal > .list-group-item + .list-group-item {\n    border-top-width: 1px;\n    border-left-width: 0; }\n    .list-group-horizontal > .list-group-item + .list-group-item.active {\n      margin-left: -1px;\n      border-left-width: 1px; }\n\n@media (min-width: 576px) {\n  .list-group-horizontal-sm {\n    flex-direction: row; }\n    .list-group-horizontal-sm > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-sm > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-sm > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-sm > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-sm > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 768px) {\n  .list-group-horizontal-md {\n    flex-direction: row; }\n    .list-group-horizontal-md > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-md > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-md > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-md > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-md > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 992px) {\n  .list-group-horizontal-lg {\n    flex-direction: row; }\n    .list-group-horizontal-lg > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-lg > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-lg > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-lg > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-lg > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 1200px) {\n  .list-group-horizontal-xl {\n    flex-direction: row; }\n    .list-group-horizontal-xl > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-xl > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-xl > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-xl > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-xl > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n@media (min-width: 1400px) {\n  .list-group-horizontal-xxl {\n    flex-direction: row; }\n    .list-group-horizontal-xxl > .list-group-item:first-child {\n      border-bottom-left-radius: 0.375rem;\n      border-top-right-radius: 0; }\n    .list-group-horizontal-xxl > .list-group-item:last-child {\n      border-top-right-radius: 0.375rem;\n      border-bottom-left-radius: 0; }\n    .list-group-horizontal-xxl > .list-group-item.active {\n      margin-top: 0; }\n    .list-group-horizontal-xxl > .list-group-item + .list-group-item {\n      border-top-width: 1px;\n      border-left-width: 0; }\n      .list-group-horizontal-xxl > .list-group-item + .list-group-item.active {\n        margin-left: -1px;\n        border-left-width: 1px; } }\n\n.list-group-flush {\n  border-radius: 0; }\n  .list-group-flush > .list-group-item {\n    border-width: 0 0 1px; }\n    .list-group-flush > .list-group-item:last-child {\n      border-bottom-width: 0; }\n\n.list-group-item-primary {\n  color: #8c123b;\n  background-color: #fbd2e0; }\n  .list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {\n    color: #8c123b;\n    background-color: #e2bdca; }\n  .list-group-item-primary.list-group-item-action.active {\n    color: #fff;\n    background-color: #8c123b;\n    border-color: #8c123b; }\n\n.list-group-item-secondary {\n  color: #4a4d5c;\n  background-color: #e5e6eb; }\n  .list-group-item-secondary.list-group-item-action:hover, .list-group-item-secondary.list-group-item-action:focus {\n    color: #4a4d5c;\n    background-color: #cecfd4; }\n  .list-group-item-secondary.list-group-item-action.active {\n    color: #fff;\n    background-color: #4a4d5c;\n    border-color: #4a4d5c; }\n\n.list-group-item-success {\n  color: #2e6930;\n  background-color: #dbefdc; }\n  .list-group-item-success.list-group-item-action:hover, .list-group-item-success.list-group-item-action:focus {\n    color: #2e6930;\n    background-color: #c5d7c6; }\n  .list-group-item-success.list-group-item-action.active {\n    color: #fff;\n    background-color: #2e6930;\n    border-color: #2e6930; }\n\n.list-group-item-info {\n  color: #10458b;\n  background-color: #d1e3fa; }\n  .list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {\n    color: #10458b;\n    background-color: #bccce1; }\n  .list-group-item-info.list-group-item-action.active {\n    color: #fff;\n    background-color: #10458b;\n    border-color: #10458b; }\n\n.list-group-item-warning {\n  color: #975400;\n  background-color: #fee8cc; }\n  .list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {\n    color: #975400;\n    background-color: #e5d1b8; }\n  .list-group-item-warning.list-group-item-action.active {\n    color: #fff;\n    background-color: #975400;\n    border-color: #975400; }\n\n.list-group-item-danger {\n  color: #922820;\n  background-color: #fdd9d7; }\n  .list-group-item-danger.list-group-item-action:hover, .list-group-item-danger.list-group-item-action:focus {\n    color: #922820;\n    background-color: #e4c3c2; }\n  .list-group-item-danger.list-group-item-action.active {\n    color: #fff;\n    background-color: #922820;\n    border-color: #922820; }\n\n.list-group-item-light {\n  color: #606162;\n  background-color: #fcfcfd; }\n  .list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {\n    color: #606162;\n    background-color: #e3e3e4; }\n  .list-group-item-light.list-group-item-action.active {\n    color: #fff;\n    background-color: #606162;\n    border-color: #606162; }\n\n.list-group-item-dark {\n  color: #1f2b3e;\n  background-color: #d6dae1; }\n  .list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus {\n    color: #1f2b3e;\n    background-color: #c1c4cb; }\n  .list-group-item-dark.list-group-item-action.active {\n    color: #fff;\n    background-color: #1f2b3e;\n    border-color: #1f2b3e; }\n\n.list-group-item-white {\n  color: #666666;\n  background-color: white; }\n  .list-group-item-white.list-group-item-action:hover, .list-group-item-white.list-group-item-action:focus {\n    color: #666666;\n    background-color: #e6e6e6; }\n  .list-group-item-white.list-group-item-action.active {\n    color: #fff;\n    background-color: #666666;\n    border-color: #666666; }\n\n.btn-close {\n  box-sizing: content-box;\n  width: 1em;\n  height: 1em;\n  padding: 0.25em 0.25em;\n  color: #fff;\n  background: transparent url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e\") center/1em auto no-repeat;\n  border: 0;\n  border-radius: 0.25rem;\n  opacity: 0.5; }\n  .btn-close:hover {\n    color: #fff;\n    text-decoration: none;\n    opacity: 0.75; }\n  .btn-close:focus {\n    outline: 0;\n    box-shadow: 0 0 0 0.2rem rgba(233, 30, 99, 0.25);\n    opacity: 1; }\n  .btn-close:disabled, .btn-close.disabled {\n    pointer-events: none;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    opacity: 0.25; }\n\n.btn-close-white {\n  filter: invert(1) grayscale(100%) brightness(200%); }\n\n.toast {\n  width: 350px;\n  max-width: 100%;\n  font-size: 0.875rem;\n  pointer-events: auto;\n  background-color: rgba(255, 255, 255, 0.85);\n  background-clip: padding-box;\n  border: 0 solid transparent;\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  border-radius: 0.375rem; }\n  .toast.showing {\n    opacity: 0; }\n  .toast:not(.show) {\n    display: none; }\n\n.toast-container {\n  width: -webkit-max-content;\n  width: -moz-max-content;\n  width: max-content;\n  max-width: 100%;\n  pointer-events: none; }\n  .toast-container > :not(:last-child) {\n    margin-bottom: 1.5rem; }\n\n.toast-header {\n  display: flex;\n  align-items: center;\n  padding: 0.75rem 0.75rem;\n  color: #344767;\n  background-color: rgba(255, 255, 255, 0.85);\n  background-clip: padding-box;\n  border-bottom: 0 solid rgba(0, 0, 0, 0.05);\n  border-top-left-radius: 0.375rem;\n  border-top-right-radius: 0.375rem; }\n  .toast-header .btn-close {\n    margin-right: -0.375rem;\n    margin-left: 0.75rem; }\n\n.toast-body {\n  padding: 0.75rem;\n  word-wrap: break-word; }\n\n.modal {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1050;\n  display: none;\n  width: 100%;\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  outline: 0; }\n\n.modal-dialog {\n  position: relative;\n  width: auto;\n  margin: 0.5rem;\n  pointer-events: none; }\n  .modal.fade .modal-dialog {\n    transition: transform 0.3s ease-out;\n    transform: translate(0, -50px); }\n    @media (prefers-reduced-motion: reduce) {\n      .modal.fade .modal-dialog {\n        transition: none; } }\n  .modal.show .modal-dialog {\n    transform: none; }\n  .modal.modal-static .modal-dialog {\n    transform: scale(1.02); }\n\n.modal-dialog-scrollable {\n  height: calc(100% - 1rem); }\n  .modal-dialog-scrollable .modal-content {\n    max-height: 100%;\n    overflow: hidden; }\n  .modal-dialog-scrollable .modal-body {\n    overflow-y: auto; }\n\n.modal-dialog-centered {\n  display: flex;\n  align-items: center;\n  min-height: calc(100% - 1rem); }\n\n.modal-content {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  pointer-events: auto;\n  background-color: #fff;\n  background-clip: padding-box;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n  border-radius: 0.5rem;\n  outline: 0; }\n\n.modal-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1040;\n  width: 100vw;\n  height: 100vh;\n  background-color: #000; }\n  .modal-backdrop.fade {\n    opacity: 0; }\n  .modal-backdrop.show {\n    opacity: 0.5; }\n\n.modal-header {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: space-between;\n  padding: 1rem 1rem;\n  border-bottom: 1px solid #dee2e6;\n  border-top-left-radius: calc(0.5rem - 1px);\n  border-top-right-radius: calc(0.5rem - 1px); }\n  .modal-header .btn-close {\n    padding: 0.5rem 0.5rem;\n    margin: -0.5rem -0.5rem -0.5rem auto; }\n\n.modal-title {\n  margin-bottom: 0;\n  line-height: 1.5; }\n\n.modal-body {\n  position: relative;\n  flex: 1 1 auto;\n  padding: 1rem; }\n\n.modal-footer {\n  display: flex;\n  flex-wrap: wrap;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: flex-end;\n  padding: 0.75rem;\n  border-top: 1px solid #dee2e6;\n  border-bottom-right-radius: calc(0.5rem - 1px);\n  border-bottom-left-radius: calc(0.5rem - 1px); }\n  .modal-footer > * {\n    margin: 0.25rem; }\n\n@media (min-width: 576px) {\n  .modal-dialog {\n    max-width: 500px;\n    margin: 1.75rem auto; }\n  .modal-dialog-scrollable {\n    height: calc(100% - 3.5rem); }\n  .modal-dialog-centered {\n    min-height: calc(100% - 3.5rem); }\n  .modal-sm {\n    max-width: 300px; } }\n\n@media (min-width: 992px) {\n  .modal-lg,\n  .modal-xl {\n    max-width: 800px; } }\n\n@media (min-width: 1200px) {\n  .modal-xl {\n    max-width: 1140px; } }\n\n.modal-fullscreen {\n  width: 100vw;\n  max-width: none;\n  height: 100%;\n  margin: 0; }\n  .modal-fullscreen .modal-content {\n    height: 100%;\n    border: 0;\n    border-radius: 0; }\n  .modal-fullscreen .modal-header {\n    border-radius: 0; }\n  .modal-fullscreen .modal-body {\n    overflow-y: auto; }\n  .modal-fullscreen .modal-footer {\n    border-radius: 0; }\n\n@media (max-width: 575.98px) {\n  .modal-fullscreen-sm-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-sm-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-sm-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-sm-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-sm-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 767.98px) {\n  .modal-fullscreen-md-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-md-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-md-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-md-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-md-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 991.98px) {\n  .modal-fullscreen-lg-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-lg-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-lg-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-lg-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-lg-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 1199.98px) {\n  .modal-fullscreen-xl-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-xl-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-xl-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-xl-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-xl-down .modal-footer {\n      border-radius: 0; } }\n\n@media (max-width: 1399.98px) {\n  .modal-fullscreen-xxl-down {\n    width: 100vw;\n    max-width: none;\n    height: 100%;\n    margin: 0; }\n    .modal-fullscreen-xxl-down .modal-content {\n      height: 100%;\n      border: 0;\n      border-radius: 0; }\n    .modal-fullscreen-xxl-down .modal-header {\n      border-radius: 0; }\n    .modal-fullscreen-xxl-down .modal-body {\n      overflow-y: auto; }\n    .modal-fullscreen-xxl-down .modal-footer {\n      border-radius: 0; } }\n\n.tooltip {\n  position: absolute;\n  z-index: 1070;\n  display: block;\n  margin: 0;\n  font-family: var(--bs-font-sans-serif);\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1.5;\n  text-align: left;\n  text-align: start;\n  text-decoration: none;\n  text-shadow: none;\n  text-transform: none;\n  letter-spacing: normal;\n  word-break: normal;\n  word-spacing: normal;\n  white-space: normal;\n  line-break: auto;\n  font-size: 0.875rem;\n  word-wrap: break-word;\n  opacity: 0; }\n  .tooltip.show {\n    opacity: 0.9; }\n  .tooltip .tooltip-arrow {\n    position: absolute;\n    display: block;\n    width: 0.8rem;\n    height: 0.4rem; }\n    .tooltip .tooltip-arrow::before {\n      position: absolute;\n      content: \"\";\n      border-color: transparent;\n      border-style: solid; }\n\n.bs-tooltip-top, .bs-tooltip-auto[data-popper-placement^=\"top\"] {\n  padding: 0.4rem 0; }\n  .bs-tooltip-top .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"top\"] .tooltip-arrow {\n    bottom: 0; }\n    .bs-tooltip-top .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"top\"] .tooltip-arrow::before {\n      top: -1px;\n      border-width: 0.4rem 0.4rem 0;\n      border-top-color: #000; }\n\n.bs-tooltip-end, .bs-tooltip-auto[data-popper-placement^=\"right\"] {\n  padding: 0 0.4rem; }\n  .bs-tooltip-end .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"right\"] .tooltip-arrow {\n    left: 0;\n    width: 0.4rem;\n    height: 0.8rem; }\n    .bs-tooltip-end .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"right\"] .tooltip-arrow::before {\n      right: -1px;\n      border-width: 0.4rem 0.4rem 0.4rem 0;\n      border-right-color: #000; }\n\n.bs-tooltip-bottom, .bs-tooltip-auto[data-popper-placement^=\"bottom\"] {\n  padding: 0.4rem 0; }\n  .bs-tooltip-bottom .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"bottom\"] .tooltip-arrow {\n    top: 0; }\n    .bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"bottom\"] .tooltip-arrow::before {\n      bottom: -1px;\n      border-width: 0 0.4rem 0.4rem;\n      border-bottom-color: #000; }\n\n.bs-tooltip-start, .bs-tooltip-auto[data-popper-placement^=\"left\"] {\n  padding: 0 0.4rem; }\n  .bs-tooltip-start .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=\"left\"] .tooltip-arrow {\n    right: 0;\n    width: 0.4rem;\n    height: 0.8rem; }\n    .bs-tooltip-start .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=\"left\"] .tooltip-arrow::before {\n      left: -1px;\n      border-width: 0.4rem 0 0.4rem 0.4rem;\n      border-left-color: #000; }\n\n.tooltip-inner {\n  max-width: 200px;\n  padding: 0.25rem 0.5rem;\n  color: #fff;\n  text-align: center;\n  background-color: #000;\n  border-radius: 0.375rem; }\n\n.popover {\n  position: absolute;\n  top: 0;\n  left: 0 /* rtl:ignore */;\n  z-index: 1060;\n  display: block;\n  max-width: 276px;\n  font-family: var(--bs-font-sans-serif);\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1.5;\n  text-align: left;\n  text-align: start;\n  text-decoration: none;\n  text-shadow: none;\n  text-transform: none;\n  letter-spacing: normal;\n  word-break: normal;\n  word-spacing: normal;\n  white-space: normal;\n  line-break: auto;\n  font-size: 0.75rem;\n  word-wrap: break-word;\n  background-color: #fff;\n  background-clip: padding-box;\n  border: 0px solid rgba(0, 0, 0, 0.2);\n  border-radius: 0.5rem; }\n  .popover .popover-arrow {\n    position: absolute;\n    display: block;\n    width: 1rem;\n    height: 0.5rem; }\n    .popover .popover-arrow::before, .popover .popover-arrow::after {\n      position: absolute;\n      display: block;\n      content: \"\";\n      border-color: transparent;\n      border-style: solid; }\n\n.bs-popover-top > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"top\"] > .popover-arrow {\n  bottom: calc(-0.5rem - 0px); }\n  .bs-popover-top > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"top\"] > .popover-arrow::before {\n    bottom: 0;\n    border-width: 0.5rem 0.5rem 0;\n    border-top-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-top > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"top\"] > .popover-arrow::after {\n    bottom: 0px;\n    border-width: 0.5rem 0.5rem 0;\n    border-top-color: #fff; }\n\n.bs-popover-end > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"right\"] > .popover-arrow {\n  left: calc(-0.5rem - 0px);\n  width: 0.5rem;\n  height: 1rem; }\n  .bs-popover-end > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"right\"] > .popover-arrow::before {\n    left: 0;\n    border-width: 0.5rem 0.5rem 0.5rem 0;\n    border-right-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-end > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"right\"] > .popover-arrow::after {\n    left: 0px;\n    border-width: 0.5rem 0.5rem 0.5rem 0;\n    border-right-color: #fff; }\n\n.bs-popover-bottom > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"bottom\"] > .popover-arrow {\n  top: calc(-0.5rem - 0px); }\n  .bs-popover-bottom > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"bottom\"] > .popover-arrow::before {\n    top: 0;\n    border-width: 0 0.5rem 0.5rem 0.5rem;\n    border-bottom-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-bottom > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"bottom\"] > .popover-arrow::after {\n    top: 0px;\n    border-width: 0 0.5rem 0.5rem 0.5rem;\n    border-bottom-color: #fff; }\n\n.bs-popover-bottom .popover-header::before, .bs-popover-auto[data-popper-placement^=\"bottom\"] .popover-header::before {\n  position: absolute;\n  top: 0;\n  left: 50%;\n  display: block;\n  width: 1rem;\n  margin-left: -0.5rem;\n  content: \"\";\n  border-bottom: 0px solid #f0f2f5; }\n\n.bs-popover-start > .popover-arrow, .bs-popover-auto[data-popper-placement^=\"left\"] > .popover-arrow {\n  right: calc(-0.5rem - 0px);\n  width: 0.5rem;\n  height: 1rem; }\n  .bs-popover-start > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=\"left\"] > .popover-arrow::before {\n    right: 0;\n    border-width: 0.5rem 0 0.5rem 0.5rem;\n    border-left-color: rgba(0, 0, 0, 0.25); }\n  .bs-popover-start > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=\"left\"] > .popover-arrow::after {\n    right: 0px;\n    border-width: 0.5rem 0 0.5rem 0.5rem;\n    border-left-color: #fff; }\n\n.popover-header {\n  padding: 0.5rem 1rem;\n  margin-bottom: 0;\n  font-size: 1rem;\n  color: #344767;\n  background-color: #f0f2f5;\n  border-bottom: 0px solid rgba(0, 0, 0, 0.2);\n  border-top-left-radius: calc(0.5rem - 0px);\n  border-top-right-radius: calc(0.5rem - 0px); }\n  .popover-header:empty {\n    display: none; }\n\n.popover-body {\n  padding: 1rem 1rem;\n  color: #7b809a; }\n\n.carousel {\n  position: relative; }\n\n.carousel.pointer-event {\n  touch-action: pan-y; }\n\n.carousel-inner {\n  position: relative;\n  width: 100%;\n  overflow: hidden; }\n  .carousel-inner::after {\n    display: block;\n    clear: both;\n    content: \"\"; }\n\n.carousel-item {\n  position: relative;\n  display: none;\n  float: left;\n  width: 100%;\n  margin-right: -100%;\n  -webkit-backface-visibility: hidden;\n          backface-visibility: hidden;\n  transition: transform 0.6s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-item {\n      transition: none; } }\n\n.carousel-item.active,\n.carousel-item-next,\n.carousel-item-prev {\n  display: block; }\n\n/* rtl:begin:ignore */\n.carousel-item-next:not(.carousel-item-start),\n.active.carousel-item-end {\n  transform: translateX(100%); }\n\n.carousel-item-prev:not(.carousel-item-end),\n.active.carousel-item-start {\n  transform: translateX(-100%); }\n\n/* rtl:end:ignore */\n.carousel-fade .carousel-item {\n  opacity: 0;\n  transition-property: opacity;\n  transform: none; }\n\n.carousel-fade .carousel-item.active,\n.carousel-fade .carousel-item-next.carousel-item-start,\n.carousel-fade .carousel-item-prev.carousel-item-end {\n  z-index: 1;\n  opacity: 1; }\n\n.carousel-fade .active.carousel-item-start,\n.carousel-fade .active.carousel-item-end {\n  z-index: 0;\n  opacity: 0;\n  transition: opacity 0s 0.6s; }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-fade .active.carousel-item-start,\n    .carousel-fade .active.carousel-item-end {\n      transition: none; } }\n\n.carousel-control-prev,\n.carousel-control-next {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 15%;\n  padding: 0;\n  color: #fff;\n  text-align: center;\n  background: none;\n  border: 0;\n  opacity: 0.5;\n  transition: opacity 0.15s ease; }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-control-prev,\n    .carousel-control-next {\n      transition: none; } }\n  .carousel-control-prev:hover, .carousel-control-prev:focus,\n  .carousel-control-next:hover,\n  .carousel-control-next:focus {\n    color: #fff;\n    text-decoration: none;\n    outline: 0;\n    opacity: 0.9; }\n\n.carousel-control-prev {\n  left: 0; }\n\n.carousel-control-next {\n  right: 0; }\n\n.carousel-control-prev-icon,\n.carousel-control-next-icon {\n  display: inline-block;\n  width: 2rem;\n  height: 2rem;\n  background-repeat: no-repeat;\n  background-position: 50%;\n  background-size: 100% 100%; }\n\n/* rtl:options: {\n  \"autoRename\": true,\n  \"stringMap\":[ {\n    \"name\"    : \"prev-next\",\n    \"search\"  : \"prev\",\n    \"replace\" : \"next\"\n  } ]\n} */\n.carousel-control-prev-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e\"); }\n\n.carousel-control-next-icon {\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e\"); }\n\n.carousel-indicators {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 2;\n  display: flex;\n  justify-content: center;\n  padding: 0;\n  margin-right: 15%;\n  margin-bottom: 1rem;\n  margin-left: 15%;\n  list-style: none; }\n  .carousel-indicators [data-bs-target] {\n    box-sizing: content-box;\n    flex: 0 1 auto;\n    width: 30px;\n    height: 3px;\n    padding: 0;\n    margin-right: 3px;\n    margin-left: 3px;\n    text-indent: -999px;\n    cursor: pointer;\n    background-color: #fff;\n    background-clip: padding-box;\n    border: 0;\n    border-top: 10px solid transparent;\n    border-bottom: 10px solid transparent;\n    opacity: 0.5;\n    transition: opacity 0.6s ease; }\n    @media (prefers-reduced-motion: reduce) {\n      .carousel-indicators [data-bs-target] {\n        transition: none; } }\n  .carousel-indicators .active {\n    opacity: 1; }\n\n.carousel-caption {\n  position: absolute;\n  right: 15%;\n  bottom: 1.25rem;\n  left: 15%;\n  padding-top: 1.25rem;\n  padding-bottom: 1.25rem;\n  color: #fff;\n  text-align: center; }\n\n.carousel-dark .carousel-control-prev-icon,\n.carousel-dark .carousel-control-next-icon {\n  filter: invert(1) grayscale(100); }\n\n.carousel-dark .carousel-indicators [data-bs-target] {\n  background-color: #000; }\n\n.carousel-dark .carousel-caption {\n  color: #000; }\n\n@-webkit-keyframes spinner-border {\n  to {\n    transform: rotate(360deg) /* rtl:ignore */; } }\n\n@keyframes spinner-border {\n  to {\n    transform: rotate(360deg) /* rtl:ignore */; } }\n\n.spinner-border {\n  display: inline-block;\n  width: 2rem;\n  height: 2rem;\n  vertical-align: -0.125em;\n  border: 0.25em solid currentColor;\n  border-right-color: transparent;\n  border-radius: 50%;\n  -webkit-animation: 0.75s linear infinite spinner-border;\n          animation: 0.75s linear infinite spinner-border; }\n\n.spinner-border-sm {\n  width: 1rem;\n  height: 1rem;\n  border-width: 0.2em; }\n\n@-webkit-keyframes spinner-grow {\n  0% {\n    transform: scale(0); }\n  50% {\n    opacity: 1;\n    transform: none; } }\n\n@keyframes spinner-grow {\n  0% {\n    transform: scale(0); }\n  50% {\n    opacity: 1;\n    transform: none; } }\n\n.spinner-grow {\n  display: inline-block;\n  width: 2rem;\n  height: 2rem;\n  vertical-align: -0.125em;\n  background-color: currentColor;\n  border-radius: 50%;\n  opacity: 0;\n  -webkit-animation: 0.75s linear infinite spinner-grow;\n          animation: 0.75s linear infinite spinner-grow; }\n\n.spinner-grow-sm {\n  width: 1rem;\n  height: 1rem; }\n\n@media (prefers-reduced-motion: reduce) {\n  .spinner-border,\n  .spinner-grow {\n    -webkit-animation-duration: 1.5s;\n            animation-duration: 1.5s; } }\n\n.offcanvas {\n  position: fixed;\n  bottom: 0;\n  z-index: 1045;\n  display: flex;\n  flex-direction: column;\n  max-width: 100%;\n  visibility: hidden;\n  background-color: #fff;\n  background-clip: padding-box;\n  outline: 0;\n  transition: transform 0.3s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .offcanvas {\n      transition: none; } }\n\n.offcanvas-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: 1040;\n  width: 100vw;\n  height: 100vh;\n  background-color: #000; }\n  .offcanvas-backdrop.fade {\n    opacity: 0; }\n  .offcanvas-backdrop.show {\n    opacity: 0.5; }\n\n.offcanvas-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 1rem 1rem; }\n  .offcanvas-header .btn-close {\n    padding: 0.5rem 0.5rem;\n    margin-top: -0.5rem;\n    margin-right: -0.5rem;\n    margin-bottom: -0.5rem; }\n\n.offcanvas-title {\n  margin-bottom: 0;\n  line-height: 1.5; }\n\n.offcanvas-body {\n  flex-grow: 1;\n  padding: 1rem 1rem;\n  overflow-y: auto; }\n\n.offcanvas-start {\n  top: 0;\n  left: 0;\n  width: 400px;\n  border-right: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateX(-100%); }\n\n.offcanvas-end {\n  top: 0;\n  right: 0;\n  width: 400px;\n  border-left: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateX(100%); }\n\n.offcanvas-top {\n  top: 0;\n  right: 0;\n  left: 0;\n  height: 30vh;\n  max-height: 100%;\n  border-bottom: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateY(-100%); }\n\n.offcanvas-bottom {\n  right: 0;\n  left: 0;\n  height: 30vh;\n  max-height: 100%;\n  border-top: 1px solid rgba(0, 0, 0, 0.2);\n  transform: translateY(100%); }\n\n.offcanvas.show {\n  transform: none; }\n\n.placeholder {\n  display: inline-block;\n  min-height: 1em;\n  vertical-align: middle;\n  cursor: wait;\n  background-color: currentColor;\n  opacity: 0.5; }\n  .placeholder.btn::before {\n    display: inline-block;\n    content: \"\"; }\n\n.placeholder-xs {\n  min-height: .6em; }\n\n.placeholder-sm {\n  min-height: .8em; }\n\n.placeholder-lg {\n  min-height: 1.2em; }\n\n.placeholder-glow .placeholder {\n  -webkit-animation: placeholder-glow 2s ease-in-out infinite;\n          animation: placeholder-glow 2s ease-in-out infinite; }\n\n@-webkit-keyframes placeholder-glow {\n  50% {\n    opacity: 0.2; } }\n\n@keyframes placeholder-glow {\n  50% {\n    opacity: 0.2; } }\n\n.placeholder-wave {\n  -webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);\n          mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);\n  -webkit-mask-size: 200% 100%;\n          mask-size: 200% 100%;\n  -webkit-animation: placeholder-wave 2s linear infinite;\n          animation: placeholder-wave 2s linear infinite; }\n\n@-webkit-keyframes placeholder-wave {\n  100% {\n    -webkit-mask-position: -200% 0%;\n            mask-position: -200% 0%; } }\n\n@keyframes placeholder-wave {\n  100% {\n    -webkit-mask-position: -200% 0%;\n            mask-position: -200% 0%; } }\n\n.clearfix::after {\n  display: block;\n  clear: both;\n  content: \"\"; }\n\n.link-primary {\n  color: #e91e63; }\n  .link-primary:hover, .link-primary:focus {\n    color: #ed4b82; }\n\n.link-secondary {\n  color: #7b809a; }\n  .link-secondary:hover, .link-secondary:focus {\n    color: #9599ae; }\n\n.link-success {\n  color: #4CAF50; }\n  .link-success:hover, .link-success:focus {\n    color: #70bf73; }\n\n.link-info {\n  color: #1A73E8; }\n  .link-info:hover, .link-info:focus {\n    color: #155cba; }\n\n.link-warning {\n  color: #fb8c00; }\n  .link-warning:hover, .link-warning:focus {\n    color: #fca333; }\n\n.link-danger {\n  color: #F44335; }\n  .link-danger:hover, .link-danger:focus {\n    color: #f6695d; }\n\n.link-light {\n  color: #f0f2f5; }\n  .link-light:hover, .link-light:focus {\n    color: #f3f5f7; }\n\n.link-dark {\n  color: #344767; }\n  .link-dark:hover, .link-dark:focus {\n    color: #2a3952; }\n\n.link-white {\n  color: #fff; }\n  .link-white:hover, .link-white:focus {\n    color: white; }\n\n.ratio {\n  position: relative;\n  width: 100%; }\n  .ratio::before {\n    display: block;\n    padding-top: var(--bs-aspect-ratio);\n    content: \"\"; }\n  .ratio > * {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%; }\n\n.ratio-1x1 {\n  --bs-aspect-ratio: 100%; }\n\n.ratio-4x3 {\n  --bs-aspect-ratio: calc(3 / 4 * 100%); }\n\n.ratio-16x9 {\n  --bs-aspect-ratio: calc(9 / 16 * 100%); }\n\n.ratio-21x9 {\n  --bs-aspect-ratio: calc(9 / 21 * 100%); }\n\n.fixed-top {\n  position: fixed;\n  top: 0;\n  right: 0;\n  left: 0;\n  z-index: 1030; }\n\n.fixed-bottom {\n  position: fixed;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1030; }\n\n.sticky-top {\n  position: -webkit-sticky;\n  position: sticky;\n  top: 0;\n  z-index: 1020; }\n\n@media (min-width: 576px) {\n  .sticky-sm-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 768px) {\n  .sticky-md-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 992px) {\n  .sticky-lg-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 1200px) {\n  .sticky-xl-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n@media (min-width: 1400px) {\n  .sticky-xxl-top {\n    position: -webkit-sticky;\n    position: sticky;\n    top: 0;\n    z-index: 1020; } }\n\n.hstack {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  align-self: stretch; }\n\n.vstack {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  align-self: stretch; }\n\n.visually-hidden,\n.visually-hidden-focusable:not(:focus):not(:focus-within) {\n  position: absolute !important;\n  width: 1px !important;\n  height: 1px !important;\n  padding: 0 !important;\n  margin: -1px !important;\n  overflow: hidden !important;\n  clip: rect(0, 0, 0, 0) !important;\n  white-space: nowrap !important;\n  border: 0 !important; }\n\n.stretched-link::after {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n  content: \"\"; }\n\n.text-truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap; }\n\n.vr {\n  display: inline-block;\n  align-self: stretch;\n  width: 1px;\n  min-height: 1em;\n  background-color: currentColor;\n  opacity: 0.25; }\n\n.align-baseline {\n  vertical-align: baseline !important; }\n\n.align-top {\n  vertical-align: top !important; }\n\n.align-middle {\n  vertical-align: middle !important; }\n\n.align-bottom {\n  vertical-align: bottom !important; }\n\n.align-text-bottom {\n  vertical-align: text-bottom !important; }\n\n.align-text-top {\n  vertical-align: text-top !important; }\n\n.float-start {\n  float: left !important; }\n\n.float-end {\n  float: right !important; }\n\n.float-none {\n  float: none !important; }\n\n.opacity-0 {\n  opacity: 0 !important; }\n\n.opacity-1 {\n  opacity: 0.1 !important; }\n\n.opacity-2 {\n  opacity: 0.2 !important; }\n\n.opacity-3 {\n  opacity: 0.3 !important; }\n\n.opacity-4 {\n  opacity: 0.4 !important; }\n\n.opacity-5 {\n  opacity: 0.5 !important; }\n\n.opacity-6 {\n  opacity: 0.6 !important; }\n\n.opacity-7 {\n  opacity: 0.7 !important; }\n\n.opacity-8 {\n  opacity: 0.8 !important; }\n\n.opacity-9 {\n  opacity: 0.9 !important; }\n\n.opacity-10 {\n  opacity: 1 !important; }\n\n.overflow-auto {\n  overflow: auto !important; }\n\n.overflow-hidden {\n  overflow: hidden !important; }\n\n.overflow-visible {\n  overflow: visible !important; }\n\n.overflow-scroll {\n  overflow: scroll !important; }\n\n.d-inline {\n  display: inline !important; }\n\n.d-inline-block {\n  display: inline-block !important; }\n\n.d-block {\n  display: block !important; }\n\n.d-grid {\n  display: grid !important; }\n\n.d-table {\n  display: table !important; }\n\n.d-table-row {\n  display: table-row !important; }\n\n.d-table-cell {\n  display: table-cell !important; }\n\n.d-flex {\n  display: flex !important; }\n\n.d-inline-flex {\n  display: inline-flex !important; }\n\n.d-none {\n  display: none !important; }\n\n.shadow {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; }\n\n.shadow-sm {\n  box-shadow: 0 0.3125rem 0.625rem 0 rgba(0, 0, 0, 0.12) !important; }\n\n.shadow-lg {\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; }\n\n.shadow-xl {\n  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important; }\n\n.shadow-none {\n  box-shadow: none !important; }\n\n.position-static {\n  position: static !important; }\n\n.position-relative {\n  position: relative !important; }\n\n.position-absolute {\n  position: absolute !important; }\n\n.position-fixed {\n  position: fixed !important; }\n\n.position-sticky {\n  position: -webkit-sticky !important;\n  position: sticky !important; }\n\n.top-0 {\n  top: 0 !important; }\n\n.top-1 {\n  top: 1% !important; }\n\n.top-2 {\n  top: 2% !important; }\n\n.top-3 {\n  top: 3% !important; }\n\n.top-4 {\n  top: 4% !important; }\n\n.top-5 {\n  top: 5% !important; }\n\n.top-6 {\n  top: 6% !important; }\n\n.top-7 {\n  top: 7% !important; }\n\n.top-8 {\n  top: 8% !important; }\n\n.top-9 {\n  top: 9% !important; }\n\n.top-10 {\n  top: 10% !important; }\n\n.top-50 {\n  top: 50% !important; }\n\n.top-100 {\n  top: 100% !important; }\n\n.bottom-0 {\n  bottom: 0 !important; }\n\n.bottom-1 {\n  bottom: 1% !important; }\n\n.bottom-2 {\n  bottom: 2% !important; }\n\n.bottom-3 {\n  bottom: 3% !important; }\n\n.bottom-4 {\n  bottom: 4% !important; }\n\n.bottom-5 {\n  bottom: 5% !important; }\n\n.bottom-6 {\n  bottom: 6% !important; }\n\n.bottom-7 {\n  bottom: 7% !important; }\n\n.bottom-8 {\n  bottom: 8% !important; }\n\n.bottom-9 {\n  bottom: 9% !important; }\n\n.bottom-10 {\n  bottom: 10% !important; }\n\n.bottom-50 {\n  bottom: 50% !important; }\n\n.bottom-100 {\n  bottom: 100% !important; }\n\n.start-0 {\n  left: 0 !important; }\n\n.start-1 {\n  left: 1% !important; }\n\n.start-2 {\n  left: 2% !important; }\n\n.start-3 {\n  left: 3% !important; }\n\n.start-4 {\n  left: 4% !important; }\n\n.start-5 {\n  left: 5% !important; }\n\n.start-6 {\n  left: 6% !important; }\n\n.start-7 {\n  left: 7% !important; }\n\n.start-8 {\n  left: 8% !important; }\n\n.start-9 {\n  left: 9% !important; }\n\n.start-10 {\n  left: 10% !important; }\n\n.start-50 {\n  left: 50% !important; }\n\n.start-100 {\n  left: 100% !important; }\n\n.end-0 {\n  right: 0 !important; }\n\n.end-1 {\n  right: 1% !important; }\n\n.end-2 {\n  right: 2% !important; }\n\n.end-3 {\n  right: 3% !important; }\n\n.end-4 {\n  right: 4% !important; }\n\n.end-5 {\n  right: 5% !important; }\n\n.end-6 {\n  right: 6% !important; }\n\n.end-7 {\n  right: 7% !important; }\n\n.end-8 {\n  right: 8% !important; }\n\n.end-9 {\n  right: 9% !important; }\n\n.end-10 {\n  right: 10% !important; }\n\n.end-50 {\n  right: 50% !important; }\n\n.end-100 {\n  right: 100% !important; }\n\n.translate-middle {\n  transform: translate(-50%, -50%) !important; }\n\n.translate-middle-x {\n  transform: translateX(-50%) !important; }\n\n.translate-middle-y {\n  transform: translateY(-50%) !important; }\n\n.border {\n  border: 1px solid #dee2e6 !important; }\n\n.border-0 {\n  border: 0 !important; }\n\n.border-top {\n  border-top: 1px solid #dee2e6 !important; }\n\n.border-top-0 {\n  border-top: 0 !important; }\n\n.border-end {\n  border-right: 1px solid #dee2e6 !important; }\n\n.border-end-0 {\n  border-right: 0 !important; }\n\n.border-bottom {\n  border-bottom: 1px solid #dee2e6 !important; }\n\n.border-bottom-0 {\n  border-bottom: 0 !important; }\n\n.border-start {\n  border-left: 1px solid #dee2e6 !important; }\n\n.border-start-0 {\n  border-left: 0 !important; }\n\n.border-primary {\n  border-color: #e91e63 !important; }\n\n.border-secondary {\n  border-color: #7b809a !important; }\n\n.border-success {\n  border-color: #4CAF50 !important; }\n\n.border-info {\n  border-color: #1A73E8 !important; }\n\n.border-warning {\n  border-color: #fb8c00 !important; }\n\n.border-danger {\n  border-color: #F44335 !important; }\n\n.border-light {\n  border-color: #f0f2f5 !important; }\n\n.border-dark {\n  border-color: #344767 !important; }\n\n.border-white {\n  border-color: #fff !important; }\n\n.border-0 {\n  border-width: 0 !important; }\n\n.border-1 {\n  border-width: 1px !important; }\n\n.border-2 {\n  border-width: 2px !important; }\n\n.border-3 {\n  border-width: 3px !important; }\n\n.border-4 {\n  border-width: 4px !important; }\n\n.border-5 {\n  border-width: 5px !important; }\n\n.w-0 {\n  width: 0% !important; }\n\n.w-1 {\n  width: 1% !important; }\n\n.w-2 {\n  width: 2% !important; }\n\n.w-3 {\n  width: 3% !important; }\n\n.w-4 {\n  width: 4% !important; }\n\n.w-5 {\n  width: 5% !important; }\n\n.w-6 {\n  width: 6% !important; }\n\n.w-7 {\n  width: 7% !important; }\n\n.w-8 {\n  width: 8% !important; }\n\n.w-9 {\n  width: 9% !important; }\n\n.w-10 {\n  width: 10% !important; }\n\n.w-15 {\n  width: 15% !important; }\n\n.w-20 {\n  width: 20% !important; }\n\n.w-25 {\n  width: 25% !important; }\n\n.w-30 {\n  width: 30% !important; }\n\n.w-35 {\n  width: 35% !important; }\n\n.w-40 {\n  width: 40% !important; }\n\n.w-45 {\n  width: 45% !important; }\n\n.w-50 {\n  width: 50% !important; }\n\n.w-55 {\n  width: 55% !important; }\n\n.w-60 {\n  width: 60% !important; }\n\n.w-65 {\n  width: 65% !important; }\n\n.w-70 {\n  width: 70% !important; }\n\n.w-75 {\n  width: 75% !important; }\n\n.w-80 {\n  width: 80% !important; }\n\n.w-85 {\n  width: 85% !important; }\n\n.w-90 {\n  width: 90% !important; }\n\n.w-95 {\n  width: 95% !important; }\n\n.w-100 {\n  width: 100% !important; }\n\n.w-auto {\n  width: auto !important; }\n\n.mw-100 {\n  max-width: 100% !important; }\n\n.vw-100 {\n  width: 100vw !important; }\n\n.min-vw-100 {\n  min-width: 100vw !important; }\n\n.h-25 {\n  height: 25% !important; }\n\n.h-50 {\n  height: 50% !important; }\n\n.h-75 {\n  height: 75% !important; }\n\n.h-100 {\n  height: 100% !important; }\n\n.h-auto {\n  height: auto !important; }\n\n.mh-100 {\n  max-height: 100% !important; }\n\n.vh-100 {\n  height: 100vh !important; }\n\n.min-vh-25 {\n  min-height: 25vh !important; }\n\n.min-vh-35 {\n  min-height: 35vh !important; }\n\n.min-vh-45 {\n  min-height: 45vh !important; }\n\n.min-vh-50 {\n  min-height: 50vh !important; }\n\n.min-vh-55 {\n  min-height: 55vh !important; }\n\n.min-vh-65 {\n  min-height: 65vh !important; }\n\n.min-vh-70 {\n  min-height: 70vh !important; }\n\n.min-vh-75 {\n  min-height: 75vh !important; }\n\n.min-vh-80 {\n  min-height: 80vh !important; }\n\n.min-vh-85 {\n  min-height: 85vh !important; }\n\n.min-vh-90 {\n  min-height: 90vh !important; }\n\n.min-vh-95 {\n  min-height: 95vh !important; }\n\n.min-vh-100 {\n  min-height: 100vh !important; }\n\n.flex-fill {\n  flex: 1 1 auto !important; }\n\n.flex-row {\n  flex-direction: row !important; }\n\n.flex-column {\n  flex-direction: column !important; }\n\n.flex-row-reverse {\n  flex-direction: row-reverse !important; }\n\n.flex-column-reverse {\n  flex-direction: column-reverse !important; }\n\n.flex-grow-0 {\n  flex-grow: 0 !important; }\n\n.flex-grow-1 {\n  flex-grow: 1 !important; }\n\n.flex-shrink-0 {\n  flex-shrink: 0 !important; }\n\n.flex-shrink-1 {\n  flex-shrink: 1 !important; }\n\n.flex-wrap {\n  flex-wrap: wrap !important; }\n\n.flex-nowrap {\n  flex-wrap: nowrap !important; }\n\n.flex-wrap-reverse {\n  flex-wrap: wrap-reverse !important; }\n\n.gap-0 {\n  gap: 0 !important; }\n\n.gap-1 {\n  gap: 0.25rem !important; }\n\n.gap-2 {\n  gap: 0.5rem !important; }\n\n.gap-3 {\n  gap: 1rem !important; }\n\n.gap-4 {\n  gap: 1.5rem !important; }\n\n.gap-5 {\n  gap: 3rem !important; }\n\n.gap-6 {\n  gap: 4rem !important; }\n\n.gap-7 {\n  gap: 6rem !important; }\n\n.gap-8 {\n  gap: 8rem !important; }\n\n.gap-9 {\n  gap: 10rem !important; }\n\n.gap-10 {\n  gap: 12rem !important; }\n\n.gap-11 {\n  gap: 14rem !important; }\n\n.gap-12 {\n  gap: 16rem !important; }\n\n.justify-content-start {\n  justify-content: flex-start !important; }\n\n.justify-content-end {\n  justify-content: flex-end !important; }\n\n.justify-content-center {\n  justify-content: center !important; }\n\n.justify-content-between {\n  justify-content: space-between !important; }\n\n.justify-content-around {\n  justify-content: space-around !important; }\n\n.justify-content-evenly {\n  justify-content: space-evenly !important; }\n\n.align-items-start {\n  align-items: flex-start !important; }\n\n.align-items-end {\n  align-items: flex-end !important; }\n\n.align-items-center {\n  align-items: center !important; }\n\n.align-items-baseline {\n  align-items: baseline !important; }\n\n.align-items-stretch {\n  align-items: stretch !important; }\n\n.align-content-start {\n  align-content: flex-start !important; }\n\n.align-content-end {\n  align-content: flex-end !important; }\n\n.align-content-center {\n  align-content: center !important; }\n\n.align-content-between {\n  align-content: space-between !important; }\n\n.align-content-around {\n  align-content: space-around !important; }\n\n.align-content-stretch {\n  align-content: stretch !important; }\n\n.align-self-auto {\n  align-self: auto !important; }\n\n.align-self-start {\n  align-self: flex-start !important; }\n\n.align-self-end {\n  align-self: flex-end !important; }\n\n.align-self-center {\n  align-self: center !important; }\n\n.align-self-baseline {\n  align-self: baseline !important; }\n\n.align-self-stretch {\n  align-self: stretch !important; }\n\n.order-first {\n  order: -1 !important; }\n\n.order-0 {\n  order: 0 !important; }\n\n.order-1 {\n  order: 1 !important; }\n\n.order-2 {\n  order: 2 !important; }\n\n.order-3 {\n  order: 3 !important; }\n\n.order-4 {\n  order: 4 !important; }\n\n.order-5 {\n  order: 5 !important; }\n\n.order-last {\n  order: 6 !important; }\n\n.m-0 {\n  margin: 0 !important; }\n\n.m-1 {\n  margin: 0.25rem !important; }\n\n.m-2 {\n  margin: 0.5rem !important; }\n\n.m-3 {\n  margin: 1rem !important; }\n\n.m-4 {\n  margin: 1.5rem !important; }\n\n.m-5 {\n  margin: 3rem !important; }\n\n.m-6 {\n  margin: 4rem !important; }\n\n.m-7 {\n  margin: 6rem !important; }\n\n.m-8 {\n  margin: 8rem !important; }\n\n.m-9 {\n  margin: 10rem !important; }\n\n.m-10 {\n  margin: 12rem !important; }\n\n.m-11 {\n  margin: 14rem !important; }\n\n.m-12 {\n  margin: 16rem !important; }\n\n.m-auto {\n  margin: auto !important; }\n\n.mx-0 {\n  margin-right: 0 !important;\n  margin-left: 0 !important; }\n\n.mx-1 {\n  margin-right: 0.25rem !important;\n  margin-left: 0.25rem !important; }\n\n.mx-2 {\n  margin-right: 0.5rem !important;\n  margin-left: 0.5rem !important; }\n\n.mx-3 {\n  margin-right: 1rem !important;\n  margin-left: 1rem !important; }\n\n.mx-4 {\n  margin-right: 1.5rem !important;\n  margin-left: 1.5rem !important; }\n\n.mx-5 {\n  margin-right: 3rem !important;\n  margin-left: 3rem !important; }\n\n.mx-6 {\n  margin-right: 4rem !important;\n  margin-left: 4rem !important; }\n\n.mx-7 {\n  margin-right: 6rem !important;\n  margin-left: 6rem !important; }\n\n.mx-8 {\n  margin-right: 8rem !important;\n  margin-left: 8rem !important; }\n\n.mx-9 {\n  margin-right: 10rem !important;\n  margin-left: 10rem !important; }\n\n.mx-10 {\n  margin-right: 12rem !important;\n  margin-left: 12rem !important; }\n\n.mx-11 {\n  margin-right: 14rem !important;\n  margin-left: 14rem !important; }\n\n.mx-12 {\n  margin-right: 16rem !important;\n  margin-left: 16rem !important; }\n\n.mx-auto {\n  margin-right: auto !important;\n  margin-left: auto !important; }\n\n.my-0 {\n  margin-top: 0 !important;\n  margin-bottom: 0 !important; }\n\n.my-1 {\n  margin-top: 0.25rem !important;\n  margin-bottom: 0.25rem !important; }\n\n.my-2 {\n  margin-top: 0.5rem !important;\n  margin-bottom: 0.5rem !important; }\n\n.my-3 {\n  margin-top: 1rem !important;\n  margin-bottom: 1rem !important; }\n\n.my-4 {\n  margin-top: 1.5rem !important;\n  margin-bottom: 1.5rem !important; }\n\n.my-5 {\n  margin-top: 3rem !important;\n  margin-bottom: 3rem !important; }\n\n.my-6 {\n  margin-top: 4rem !important;\n  margin-bottom: 4rem !important; }\n\n.my-7 {\n  margin-top: 6rem !important;\n  margin-bottom: 6rem !important; }\n\n.my-8 {\n  margin-top: 8rem !important;\n  margin-bottom: 8rem !important; }\n\n.my-9 {\n  margin-top: 10rem !important;\n  margin-bottom: 10rem !important; }\n\n.my-10 {\n  margin-top: 12rem !important;\n  margin-bottom: 12rem !important; }\n\n.my-11 {\n  margin-top: 14rem !important;\n  margin-bottom: 14rem !important; }\n\n.my-12 {\n  margin-top: 16rem !important;\n  margin-bottom: 16rem !important; }\n\n.my-auto {\n  margin-top: auto !important;\n  margin-bottom: auto !important; }\n\n.mt-0 {\n  margin-top: 0 !important; }\n\n.mt-1 {\n  margin-top: 0.25rem !important; }\n\n.mt-2 {\n  margin-top: 0.5rem !important; }\n\n.mt-3 {\n  margin-top: 1rem !important; }\n\n.mt-4 {\n  margin-top: 1.5rem !important; }\n\n.mt-5 {\n  margin-top: 3rem !important; }\n\n.mt-6 {\n  margin-top: 4rem !important; }\n\n.mt-7 {\n  margin-top: 6rem !important; }\n\n.mt-8 {\n  margin-top: 8rem !important; }\n\n.mt-9 {\n  margin-top: 10rem !important; }\n\n.mt-10 {\n  margin-top: 12rem !important; }\n\n.mt-11 {\n  margin-top: 14rem !important; }\n\n.mt-12 {\n  margin-top: 16rem !important; }\n\n.mt-auto {\n  margin-top: auto !important; }\n\n.me-0 {\n  margin-right: 0 !important; }\n\n.me-1 {\n  margin-right: 0.25rem !important; }\n\n.me-2 {\n  margin-right: 0.5rem !important; }\n\n.me-3 {\n  margin-right: 1rem !important; }\n\n.me-4 {\n  margin-right: 1.5rem !important; }\n\n.me-5 {\n  margin-right: 3rem !important; }\n\n.me-6 {\n  margin-right: 4rem !important; }\n\n.me-7 {\n  margin-right: 6rem !important; }\n\n.me-8 {\n  margin-right: 8rem !important; }\n\n.me-9 {\n  margin-right: 10rem !important; }\n\n.me-10 {\n  margin-right: 12rem !important; }\n\n.me-11 {\n  margin-right: 14rem !important; }\n\n.me-12 {\n  margin-right: 16rem !important; }\n\n.me-auto {\n  margin-right: auto !important; }\n\n.mb-0 {\n  margin-bottom: 0 !important; }\n\n.mb-1 {\n  margin-bottom: 0.25rem !important; }\n\n.mb-2 {\n  margin-bottom: 0.5rem !important; }\n\n.mb-3 {\n  margin-bottom: 1rem !important; }\n\n.mb-4 {\n  margin-bottom: 1.5rem !important; }\n\n.mb-5 {\n  margin-bottom: 3rem !important; }\n\n.mb-6 {\n  margin-bottom: 4rem !important; }\n\n.mb-7 {\n  margin-bottom: 6rem !important; }\n\n.mb-8 {\n  margin-bottom: 8rem !important; }\n\n.mb-9 {\n  margin-bottom: 10rem !important; }\n\n.mb-10 {\n  margin-bottom: 12rem !important; }\n\n.mb-11 {\n  margin-bottom: 14rem !important; }\n\n.mb-12 {\n  margin-bottom: 16rem !important; }\n\n.mb-auto {\n  margin-bottom: auto !important; }\n\n.ms-0 {\n  margin-left: 0 !important; }\n\n.ms-1 {\n  margin-left: 0.25rem !important; }\n\n.ms-2 {\n  margin-left: 0.5rem !important; }\n\n.ms-3 {\n  margin-left: 1rem !important; }\n\n.ms-4 {\n  margin-left: 1.5rem !important; }\n\n.ms-5 {\n  margin-left: 3rem !important; }\n\n.ms-6 {\n  margin-left: 4rem !important; }\n\n.ms-7 {\n  margin-left: 6rem !important; }\n\n.ms-8 {\n  margin-left: 8rem !important; }\n\n.ms-9 {\n  margin-left: 10rem !important; }\n\n.ms-10 {\n  margin-left: 12rem !important; }\n\n.ms-11 {\n  margin-left: 14rem !important; }\n\n.ms-12 {\n  margin-left: 16rem !important; }\n\n.ms-auto {\n  margin-left: auto !important; }\n\n.m-n1 {\n  margin: -0.25rem !important; }\n\n.m-n2 {\n  margin: -0.5rem !important; }\n\n.m-n3 {\n  margin: -1rem !important; }\n\n.m-n4 {\n  margin: -1.5rem !important; }\n\n.m-n5 {\n  margin: -3rem !important; }\n\n.m-n6 {\n  margin: -4rem !important; }\n\n.m-n7 {\n  margin: -6rem !important; }\n\n.m-n8 {\n  margin: -8rem !important; }\n\n.m-n9 {\n  margin: -10rem !important; }\n\n.m-n10 {\n  margin: -12rem !important; }\n\n.m-n11 {\n  margin: -14rem !important; }\n\n.m-n12 {\n  margin: -16rem !important; }\n\n.mx-n1 {\n  margin-right: -0.25rem !important;\n  margin-left: -0.25rem !important; }\n\n.mx-n2 {\n  margin-right: -0.5rem !important;\n  margin-left: -0.5rem !important; }\n\n.mx-n3 {\n  margin-right: -1rem !important;\n  margin-left: -1rem !important; }\n\n.mx-n4 {\n  margin-right: -1.5rem !important;\n  margin-left: -1.5rem !important; }\n\n.mx-n5 {\n  margin-right: -3rem !important;\n  margin-left: -3rem !important; }\n\n.mx-n6 {\n  margin-right: -4rem !important;\n  margin-left: -4rem !important; }\n\n.mx-n7 {\n  margin-right: -6rem !important;\n  margin-left: -6rem !important; }\n\n.mx-n8 {\n  margin-right: -8rem !important;\n  margin-left: -8rem !important; }\n\n.mx-n9 {\n  margin-right: -10rem !important;\n  margin-left: -10rem !important; }\n\n.mx-n10 {\n  margin-right: -12rem !important;\n  margin-left: -12rem !important; }\n\n.mx-n11 {\n  margin-right: -14rem !important;\n  margin-left: -14rem !important; }\n\n.mx-n12 {\n  margin-right: -16rem !important;\n  margin-left: -16rem !important; }\n\n.my-n1 {\n  margin-top: -0.25rem !important;\n  margin-bottom: -0.25rem !important; }\n\n.my-n2 {\n  margin-top: -0.5rem !important;\n  margin-bottom: -0.5rem !important; }\n\n.my-n3 {\n  margin-top: -1rem !important;\n  margin-bottom: -1rem !important; }\n\n.my-n4 {\n  margin-top: -1.5rem !important;\n  margin-bottom: -1.5rem !important; }\n\n.my-n5 {\n  margin-top: -3rem !important;\n  margin-bottom: -3rem !important; }\n\n.my-n6 {\n  margin-top: -4rem !important;\n  margin-bottom: -4rem !important; }\n\n.my-n7 {\n  margin-top: -6rem !important;\n  margin-bottom: -6rem !important; }\n\n.my-n8 {\n  margin-top: -8rem !important;\n  margin-bottom: -8rem !important; }\n\n.my-n9 {\n  margin-top: -10rem !important;\n  margin-bottom: -10rem !important; }\n\n.my-n10 {\n  margin-top: -12rem !important;\n  margin-bottom: -12rem !important; }\n\n.my-n11 {\n  margin-top: -14rem !important;\n  margin-bottom: -14rem !important; }\n\n.my-n12 {\n  margin-top: -16rem !important;\n  margin-bottom: -16rem !important; }\n\n.mt-n1 {\n  margin-top: -0.25rem !important; }\n\n.mt-n2 {\n  margin-top: -0.5rem !important; }\n\n.mt-n3 {\n  margin-top: -1rem !important; }\n\n.mt-n4 {\n  margin-top: -1.5rem !important; }\n\n.mt-n5 {\n  margin-top: -3rem !important; }\n\n.mt-n6 {\n  margin-top: -4rem !important; }\n\n.mt-n7 {\n  margin-top: -6rem !important; }\n\n.mt-n8 {\n  margin-top: -8rem !important; }\n\n.mt-n9 {\n  margin-top: -10rem !important; }\n\n.mt-n10 {\n  margin-top: -12rem !important; }\n\n.mt-n11 {\n  margin-top: -14rem !important; }\n\n.mt-n12 {\n  margin-top: -16rem !important; }\n\n.me-n1 {\n  margin-right: -0.25rem !important; }\n\n.me-n2 {\n  margin-right: -0.5rem !important; }\n\n.me-n3 {\n  margin-right: -1rem !important; }\n\n.me-n4 {\n  margin-right: -1.5rem !important; }\n\n.me-n5 {\n  margin-right: -3rem !important; }\n\n.me-n6 {\n  margin-right: -4rem !important; }\n\n.me-n7 {\n  margin-right: -6rem !important; }\n\n.me-n8 {\n  margin-right: -8rem !important; }\n\n.me-n9 {\n  margin-right: -10rem !important; }\n\n.me-n10 {\n  margin-right: -12rem !important; }\n\n.me-n11 {\n  margin-right: -14rem !important; }\n\n.me-n12 {\n  margin-right: -16rem !important; }\n\n.mb-n1 {\n  margin-bottom: -0.25rem !important; }\n\n.mb-n2 {\n  margin-bottom: -0.5rem !important; }\n\n.mb-n3 {\n  margin-bottom: -1rem !important; }\n\n.mb-n4 {\n  margin-bottom: -1.5rem !important; }\n\n.mb-n5 {\n  margin-bottom: -3rem !important; }\n\n.mb-n6 {\n  margin-bottom: -4rem !important; }\n\n.mb-n7 {\n  margin-bottom: -6rem !important; }\n\n.mb-n8 {\n  margin-bottom: -8rem !important; }\n\n.mb-n9 {\n  margin-bottom: -10rem !important; }\n\n.mb-n10 {\n  margin-bottom: -12rem !important; }\n\n.mb-n11 {\n  margin-bottom: -14rem !important; }\n\n.mb-n12 {\n  margin-bottom: -16rem !important; }\n\n.ms-n1 {\n  margin-left: -0.25rem !important; }\n\n.ms-n2 {\n  margin-left: -0.5rem !important; }\n\n.ms-n3 {\n  margin-left: -1rem !important; }\n\n.ms-n4 {\n  margin-left: -1.5rem !important; }\n\n.ms-n5 {\n  margin-left: -3rem !important; }\n\n.ms-n6 {\n  margin-left: -4rem !important; }\n\n.ms-n7 {\n  margin-left: -6rem !important; }\n\n.ms-n8 {\n  margin-left: -8rem !important; }\n\n.ms-n9 {\n  margin-left: -10rem !important; }\n\n.ms-n10 {\n  margin-left: -12rem !important; }\n\n.ms-n11 {\n  margin-left: -14rem !important; }\n\n.ms-n12 {\n  margin-left: -16rem !important; }\n\n.p-0 {\n  padding: 0 !important; }\n\n.p-1 {\n  padding: 0.25rem !important; }\n\n.p-2 {\n  padding: 0.5rem !important; }\n\n.p-3 {\n  padding: 1rem !important; }\n\n.p-4 {\n  padding: 1.5rem !important; }\n\n.p-5 {\n  padding: 3rem !important; }\n\n.p-6 {\n  padding: 4rem !important; }\n\n.p-7 {\n  padding: 6rem !important; }\n\n.p-8 {\n  padding: 8rem !important; }\n\n.p-9 {\n  padding: 10rem !important; }\n\n.p-10 {\n  padding: 12rem !important; }\n\n.p-11 {\n  padding: 14rem !important; }\n\n.p-12 {\n  padding: 16rem !important; }\n\n.px-0 {\n  padding-right: 0 !important;\n  padding-left: 0 !important; }\n\n.px-1 {\n  padding-right: 0.25rem !important;\n  padding-left: 0.25rem !important; }\n\n.px-2 {\n  padding-right: 0.5rem !important;\n  padding-left: 0.5rem !important; }\n\n.px-3 {\n  padding-right: 1rem !important;\n  padding-left: 1rem !important; }\n\n.px-4 {\n  padding-right: 1.5rem !important;\n  padding-left: 1.5rem !important; }\n\n.px-5 {\n  padding-right: 3rem !important;\n  padding-left: 3rem !important; }\n\n.px-6 {\n  padding-right: 4rem !important;\n  padding-left: 4rem !important; }\n\n.px-7 {\n  padding-right: 6rem !important;\n  padding-left: 6rem !important; }\n\n.px-8 {\n  padding-right: 8rem !important;\n  padding-left: 8rem !important; }\n\n.px-9 {\n  padding-right: 10rem !important;\n  padding-left: 10rem !important; }\n\n.px-10 {\n  padding-right: 12rem !important;\n  padding-left: 12rem !important; }\n\n.px-11 {\n  padding-right: 14rem !important;\n  padding-left: 14rem !important; }\n\n.px-12 {\n  padding-right: 16rem !important;\n  padding-left: 16rem !important; }\n\n.py-0 {\n  padding-top: 0 !important;\n  padding-bottom: 0 !important; }\n\n.py-1 {\n  padding-top: 0.25rem !important;\n  padding-bottom: 0.25rem !important; }\n\n.py-2 {\n  padding-top: 0.5rem !important;\n  padding-bottom: 0.5rem !important; }\n\n.py-3 {\n  padding-top: 1rem !important;\n  padding-bottom: 1rem !important; }\n\n.py-4 {\n  padding-top: 1.5rem !important;\n  padding-bottom: 1.5rem !important; }\n\n.py-5 {\n  padding-top: 3rem !important;\n  padding-bottom: 3rem !important; }\n\n.py-6 {\n  padding-top: 4rem !important;\n  padding-bottom: 4rem !important; }\n\n.py-7 {\n  padding-top: 6rem !important;\n  padding-bottom: 6rem !important; }\n\n.py-8 {\n  padding-top: 8rem !important;\n  padding-bottom: 8rem !important; }\n\n.py-9 {\n  padding-top: 10rem !important;\n  padding-bottom: 10rem !important; }\n\n.py-10 {\n  padding-top: 12rem !important;\n  padding-bottom: 12rem !important; }\n\n.py-11 {\n  padding-top: 14rem !important;\n  padding-bottom: 14rem !important; }\n\n.py-12 {\n  padding-top: 16rem !important;\n  padding-bottom: 16rem !important; }\n\n.pt-0 {\n  padding-top: 0 !important; }\n\n.pt-1 {\n  padding-top: 0.25rem !important; }\n\n.pt-2 {\n  padding-top: 0.5rem !important; }\n\n.pt-3 {\n  padding-top: 1rem !important; }\n\n.pt-4 {\n  padding-top: 1.5rem !important; }\n\n.pt-5 {\n  padding-top: 3rem !important; }\n\n.pt-6 {\n  padding-top: 4rem !important; }\n\n.pt-7 {\n  padding-top: 6rem !important; }\n\n.pt-8 {\n  padding-top: 8rem !important; }\n\n.pt-9 {\n  padding-top: 10rem !important; }\n\n.pt-10 {\n  padding-top: 12rem !important; }\n\n.pt-11 {\n  padding-top: 14rem !important; }\n\n.pt-12 {\n  padding-top: 16rem !important; }\n\n.pe-0 {\n  padding-right: 0 !important; }\n\n.pe-1 {\n  padding-right: 0.25rem !important; }\n\n.pe-2 {\n  padding-right: 0.5rem !important; }\n\n.pe-3 {\n  padding-right: 1rem !important; }\n\n.pe-4 {\n  padding-right: 1.5rem !important; }\n\n.pe-5 {\n  padding-right: 3rem !important; }\n\n.pe-6 {\n  padding-right: 4rem !important; }\n\n.pe-7 {\n  padding-right: 6rem !important; }\n\n.pe-8 {\n  padding-right: 8rem !important; }\n\n.pe-9 {\n  padding-right: 10rem !important; }\n\n.pe-10 {\n  padding-right: 12rem !important; }\n\n.pe-11 {\n  padding-right: 14rem !important; }\n\n.pe-12 {\n  padding-right: 16rem !important; }\n\n.pb-0 {\n  padding-bottom: 0 !important; }\n\n.pb-1 {\n  padding-bottom: 0.25rem !important; }\n\n.pb-2 {\n  padding-bottom: 0.5rem !important; }\n\n.pb-3 {\n  padding-bottom: 1rem !important; }\n\n.pb-4 {\n  padding-bottom: 1.5rem !important; }\n\n.pb-5 {\n  padding-bottom: 3rem !important; }\n\n.pb-6 {\n  padding-bottom: 4rem !important; }\n\n.pb-7 {\n  padding-bottom: 6rem !important; }\n\n.pb-8 {\n  padding-bottom: 8rem !important; }\n\n.pb-9 {\n  padding-bottom: 10rem !important; }\n\n.pb-10 {\n  padding-bottom: 12rem !important; }\n\n.pb-11 {\n  padding-bottom: 14rem !important; }\n\n.pb-12 {\n  padding-bottom: 16rem !important; }\n\n.ps-0 {\n  padding-left: 0 !important; }\n\n.ps-1 {\n  padding-left: 0.25rem !important; }\n\n.ps-2 {\n  padding-left: 0.5rem !important; }\n\n.ps-3 {\n  padding-left: 1rem !important; }\n\n.ps-4 {\n  padding-left: 1.5rem !important; }\n\n.ps-5 {\n  padding-left: 3rem !important; }\n\n.ps-6 {\n  padding-left: 4rem !important; }\n\n.ps-7 {\n  padding-left: 6rem !important; }\n\n.ps-8 {\n  padding-left: 8rem !important; }\n\n.ps-9 {\n  padding-left: 10rem !important; }\n\n.ps-10 {\n  padding-left: 12rem !important; }\n\n.ps-11 {\n  padding-left: 14rem !important; }\n\n.ps-12 {\n  padding-left: 16rem !important; }\n\n.font-monospace {\n  font-family: var(--bs-font-monospace) !important; }\n\n.fs-1 {\n  font-size: calc(1.425rem + 2.1vw) !important; }\n\n.fs-2 {\n  font-size: calc(1.35rem + 1.2vw) !important; }\n\n.fs-3 {\n  font-size: calc(1.3125rem + 0.75vw) !important; }\n\n.fs-4 {\n  font-size: calc(1.275rem + 0.3vw) !important; }\n\n.fs-5 {\n  font-size: 1.25rem !important; }\n\n.fs-6 {\n  font-size: 1rem !important; }\n\n.fst-italic {\n  font-style: italic !important; }\n\n.fst-normal {\n  font-style: normal !important; }\n\n.fw-light {\n  font-weight: 300 !important; }\n\n.fw-lighter {\n  font-weight: lighter !important; }\n\n.fw-normal {\n  font-weight: 400 !important; }\n\n.fw-bold {\n  font-weight: 600 !important; }\n\n.fw-bolder {\n  font-weight: 700 !important; }\n\n.lh-1 {\n  line-height: 1 !important; }\n\n.lh-sm {\n  line-height: 1.25 !important; }\n\n.lh-base {\n  line-height: 1.5 !important; }\n\n.lh-lg {\n  line-height: 2 !important; }\n\n.text-start {\n  text-align: left !important; }\n\n.text-end {\n  text-align: right !important; }\n\n.text-center {\n  text-align: center !important; }\n\n.text-decoration-none {\n  text-decoration: none !important; }\n\n.text-decoration-underline {\n  text-decoration: underline !important; }\n\n.text-decoration-line-through {\n  text-decoration: line-through !important; }\n\n.text-lowercase {\n  text-transform: lowercase !important; }\n\n.text-uppercase {\n  text-transform: uppercase !important; }\n\n.text-capitalize {\n  text-transform: capitalize !important; }\n\n.text-wrap {\n  white-space: normal !important; }\n\n.text-nowrap {\n  white-space: nowrap !important; }\n\n/* rtl:begin:remove */\n.text-break {\n  word-wrap: break-word !important;\n  word-break: break-word !important; }\n\n/* rtl:end:remove */\n.text-primary {\n  color: #e91e63 !important; }\n\n.text-secondary {\n  color: #7b809a !important; }\n\n.text-success {\n  color: #4CAF50 !important; }\n\n.text-info {\n  color: #1A73E8 !important; }\n\n.text-warning {\n  color: #fb8c00 !important; }\n\n.text-danger {\n  color: #F44335 !important; }\n\n.text-light {\n  color: #f0f2f5 !important; }\n\n.text-dark {\n  color: #344767 !important; }\n\n.text-white {\n  color: #fff !important; }\n\n.text-body {\n  color: #7b809a !important; }\n\n.text-rose {\n  color: #e91e63 !important; }\n\n.text-muted {\n  color: #6c757d !important; }\n\n.text-black-50 {\n  color: rgba(0, 0, 0, 0.5) !important; }\n\n.text-white-50 {\n  color: rgba(255, 255, 255, 0.5) !important; }\n\n.text-reset {\n  color: inherit !important; }\n\n.text-opacity-25 {\n  --bs-text-opacity: 0.25; }\n\n.text-opacity-50 {\n  --bs-text-opacity: 0.5; }\n\n.text-opacity-75 {\n  --bs-text-opacity: 0.75; }\n\n.text-opacity-100 {\n  --bs-text-opacity: 1; }\n\n.bg-primary {\n  background-color: #e91e63 !important; }\n\n.bg-secondary {\n  background-color: #7b809a !important; }\n\n.bg-success {\n  background-color: #4CAF50 !important; }\n\n.bg-info {\n  background-color: #1A73E8 !important; }\n\n.bg-warning {\n  background-color: #fb8c00 !important; }\n\n.bg-danger {\n  background-color: #F44335 !important; }\n\n.bg-light {\n  background-color: #f0f2f5 !important; }\n\n.bg-dark {\n  background-color: #344767 !important; }\n\n.bg-white {\n  background-color: #fff !important; }\n\n.bg-body {\n  background-color: #fff !important; }\n\n.bg-transparent {\n  background-color: transparent !important; }\n\n.bg-gray-100 {\n  background-color: #f8f9fa !important; }\n\n.bg-gray-200 {\n  background-color: #f0f2f5 !important; }\n\n.bg-gray-300 {\n  background-color: #dee2e6 !important; }\n\n.bg-gray-400 {\n  background-color: #ced4da !important; }\n\n.bg-gray-500 {\n  background-color: #adb5bd !important; }\n\n.bg-gray-600 {\n  background-color: #6c757d !important; }\n\n.bg-gray-700 {\n  background-color: #495057 !important; }\n\n.bg-gray-800 {\n  background-color: #343a40 !important; }\n\n.bg-gray-900 {\n  background-color: #212529 !important; }\n\n.bg-opacity-10 {\n  --bs-bg-opacity: 0.1; }\n\n.bg-opacity-25 {\n  --bs-bg-opacity: 0.25; }\n\n.bg-opacity-50 {\n  --bs-bg-opacity: 0.5; }\n\n.bg-opacity-75 {\n  --bs-bg-opacity: 0.75; }\n\n.bg-opacity-100 {\n  --bs-bg-opacity: 1; }\n\n.bg-gradient {\n  background-image: var(--bs-gradient) !important; }\n\n.user-select-all {\n  -webkit-user-select: all !important;\n     -moz-user-select: all !important;\n      -ms-user-select: all !important;\n          user-select: all !important; }\n\n.user-select-auto {\n  -webkit-user-select: auto !important;\n     -moz-user-select: auto !important;\n      -ms-user-select: auto !important;\n          user-select: auto !important; }\n\n.user-select-none {\n  -webkit-user-select: none !important;\n     -moz-user-select: none !important;\n      -ms-user-select: none !important;\n          user-select: none !important; }\n\n.pe-none {\n  pointer-events: none !important; }\n\n.pe-auto {\n  pointer-events: auto !important; }\n\n.rounded {\n  border-radius: 0.25rem !important; }\n\n.rounded-0 {\n  border-radius: 0 !important; }\n\n.rounded-1 {\n  border-radius: 0.125rem !important; }\n\n.rounded-2 {\n  border-radius: 0.25rem !important; }\n\n.rounded-3 {\n  border-radius: 0.5rem !important; }\n\n.rounded-circle, .avatar.rounded-circle img {\n  border-radius: 50% !important; }\n\n.rounded-pill {\n  border-radius: 50rem !important; }\n\n.rounded-top {\n  border-top-left-radius: 0.25rem !important;\n  border-top-right-radius: 0.25rem !important; }\n\n.rounded-end {\n  border-top-right-radius: 0.25rem !important;\n  border-bottom-right-radius: 0.25rem !important; }\n\n.rounded-bottom {\n  border-bottom-right-radius: 0.25rem !important;\n  border-bottom-left-radius: 0.25rem !important; }\n\n.rounded-start {\n  border-bottom-left-radius: 0.25rem !important;\n  border-top-left-radius: 0.25rem !important; }\n\n.visible {\n  visibility: visible !important; }\n\n.invisible {\n  visibility: hidden !important; }\n\n.overflow-x-auto {\n  overflow-x: auto !important; }\n\n.overflow-x-hidden {\n  overflow-x: hidden !important; }\n\n.overflow-x-visible {\n  overflow-x: visible !important; }\n\n.overflow-x-scroll {\n  overflow-x: scroll !important; }\n\n.overflow-y-auto {\n  overflow-y: auto !important; }\n\n.overflow-y-hidden {\n  overflow-y: hidden !important; }\n\n.overflow-y-visible {\n  overflow-y: visible !important; }\n\n.overflow-y-scroll {\n  overflow-y: scroll !important; }\n\n.shadow-primary {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(233, 30, 99, 0.4) !important; }\n\n.shadow-secondary {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(210, 210, 210, 0.4) !important; }\n\n.shadow-info {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 188, 212, 0.4) !important; }\n\n.shadow-warning {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(255, 152, 0, 0.4) !important; }\n\n.shadow-success {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(76, 175, 80, 0.4) !important; }\n\n.shadow-danger {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(244, 67, 54, 0.4) !important; }\n\n.shadow-dark {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(64, 64, 64, 0.4) !important; }\n\n.shadow-light {\n  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(233, 30, 99, 0.4) !important; }\n\n.transform-scale-5 {\n  transform: scale(0.5) !important; }\n\n.transform-scale-6 {\n  transform: scale(0.6) !important; }\n\n.transform-scale-7 {\n  transform: scale(0.7) !important; }\n\n.transform-scale-8 {\n  transform: scale(0.8) !important; }\n\n.transform-scale-9 {\n  transform: scale(0.9) !important; }\n\n.transform-scale-10 {\n  transform: scale(1) !important; }\n\n.z-index-0 {\n  z-index: 0 !important; }\n\n.z-index-1 {\n  z-index: 1 !important; }\n\n.z-index-2 {\n  z-index: 2 !important; }\n\n.z-index-3 {\n  z-index: 3 !important; }\n\n.letter-spacing-1 {\n  letter-spacing: 1px !important; }\n\n.letter-spacing-2 {\n  letter-spacing: 2px !important; }\n\n.letter-spacing-3 {\n  letter-spacing: 3px !important; }\n\n.letter-spacing-4 {\n  letter-spacing: 4px !important; }\n\n.letter-spacing-5 {\n  letter-spacing: 5px !important; }\n\n.border-radius-top-start {\n  border-top-left-radius: 0.25rem !important; }\n\n.border-radius-top-start-0 {\n  border-top-left-radius: 0 !important; }\n\n.border-radius-top-start-sm {\n  border-top-left-radius: 0.125rem !important; }\n\n.border-radius-top-start-md {\n  border-top-left-radius: 0.25rem !important; }\n\n.border-radius-top-start-lg {\n  border-top-left-radius: 0.5rem !important; }\n\n.border-radius-top-start-xl {\n  border-top-left-radius: 0.75rem !important; }\n\n.border-radius-top-start-2xl {\n  border-top-left-radius: 1rem !important; }\n\n.border-radius-top-start-circle {\n  border-top-left-radius: 50% !important; }\n\n.border-radius-top-start-pill {\n  border-top-left-radius: 50rem !important; }\n\n.border-radius-top-end {\n  border-top-right-radius: 0.25rem !important; }\n\n.border-radius-top-end-0 {\n  border-top-right-radius: 0 !important; }\n\n.border-radius-top-end-sm {\n  border-top-right-radius: 0.125rem !important; }\n\n.border-radius-top-end-md {\n  border-top-right-radius: 0.25rem !important; }\n\n.border-radius-top-end-lg {\n  border-top-right-radius: 0.5rem !important; }\n\n.border-radius-top-end-xl {\n  border-top-right-radius: 0.75rem !important; }\n\n.border-radius-top-end-2xl {\n  border-top-right-radius: 1rem !important; }\n\n.border-radius-top-end-circle {\n  border-top-right-radius: 50% !important; }\n\n.border-radius-top-end-pill {\n  border-top-right-radius: 50rem !important; }\n\n.border-radius-bottom-start {\n  border-bottom-left-radius: 0.25rem !important; }\n\n.border-radius-bottom-start-0 {\n  border-bottom-left-radius: 0 !important; }\n\n.border-radius-bottom-start-sm {\n  border-bottom-left-radius: 0.125rem !important; }\n\n.border-radius-bottom-start-md {\n  border-bottom-left-radius: 0.25rem !important; }\n\n.border-radius-bottom-start-lg {\n  border-bottom-left-radius: 0.5rem !important; }\n\n.border-radius-bottom-start-xl {\n  border-bottom-left-radius: 0.75rem !important; }\n\n.border-radius-bottom-start-2xl {\n  border-bottom-left-radius: 1rem !important; }\n\n.border-radius-bottom-start-circle {\n  border-bottom-left-radius: 50% !important; }\n\n.border-radius-bottom-start-pill {\n  border-bottom-left-radius: 50rem !important; }\n\n.border-radius-bottom-end {\n  border-bottom-right-radius: 0.25rem !important; }\n\n.border-radius-bottom-end-0 {\n  border-bottom-right-radius: 0 !important; }\n\n.border-radius-bottom-end-sm {\n  border-bottom-right-radius: 0.125rem !important; }\n\n.border-radius-bottom-end-md {\n  border-bottom-right-radius: 0.25rem !important; }\n\n.border-radius-bottom-end-lg {\n  border-bottom-right-radius: 0.5rem !important; }\n\n.border-radius-bottom-end-xl {\n  border-bottom-right-radius: 0.75rem !important; }\n\n.border-radius-bottom-end-2xl {\n  border-bottom-right-radius: 1rem !important; }\n\n.border-radius-bottom-end-circle {\n  border-bottom-right-radius: 50% !important; }\n\n.border-radius-bottom-end-pill {\n  border-bottom-right-radius: 50rem !important; }\n\n.max-height-100 {\n  max-height: 100px !important; }\n\n.max-height-150 {\n  max-height: 150px !important; }\n\n.max-height-160 {\n  max-height: 160px !important; }\n\n.max-height-200 {\n  max-height: 200px !important; }\n\n.max-height-250 {\n  max-height: 250px !important; }\n\n.max-height-300 {\n  max-height: 300px !important; }\n\n.max-height-400 {\n  max-height: 400px !important; }\n\n.max-height-500 {\n  max-height: 500px !important; }\n\n.max-height-600 {\n  max-height: 600px !important; }\n\n.max-height-vh-10 {\n  max-height: 10vh !important; }\n\n.max-height-vh-20 {\n  max-height: 20vh !important; }\n\n.max-height-vh-30 {\n  max-height: 30vh !important; }\n\n.max-height-vh-40 {\n  max-height: 40vh !important; }\n\n.max-height-vh-50 {\n  max-height: 50vh !important; }\n\n.max-height-vh-60 {\n  max-height: 60vh !important; }\n\n.max-height-vh-70 {\n  max-height: 70vh !important; }\n\n.max-height-vh-80 {\n  max-height: 80vh !important; }\n\n.max-height-vh-90 {\n  max-height: 90vh !important; }\n\n.max-height-vh-100 {\n  max-height: 100vh !important; }\n\n.min-height-100 {\n  min-height: 100px !important; }\n\n.min-height-150 {\n  min-height: 150px !important; }\n\n.min-height-160 {\n  min-height: 160px !important; }\n\n.min-height-200 {\n  min-height: 200px !important; }\n\n.min-height-250 {\n  min-height: 250px !important; }\n\n.min-height-300 {\n  min-height: 300px !important; }\n\n.min-height-400 {\n  min-height: 400px !important; }\n\n.min-height-500 {\n  min-height: 500px !important; }\n\n.min-height-600 {\n  min-height: 600px !important; }\n\n.height-100 {\n  height: 100px !important; }\n\n.height-200 {\n  height: 200px !important; }\n\n.height-300 {\n  height: 300px !important; }\n\n.height-400 {\n  height: 400px !important; }\n\n.height-500 {\n  height: 500px !important; }\n\n.height-600 {\n  height: 600px !important; }\n\n.max-width-100 {\n  max-width: 100px !important; }\n\n.max-width-200 {\n  max-width: 200px !important; }\n\n.max-width-300 {\n  max-width: 300px !important; }\n\n.max-width-400 {\n  max-width: 400px !important; }\n\n.max-width-500 {\n  max-width: 500px !important; }\n\n@media (min-width: 576px) {\n  .float-sm-start {\n    float: left !important; }\n  .float-sm-end {\n    float: right !important; }\n  .float-sm-none {\n    float: none !important; }\n  .d-sm-inline {\n    display: inline !important; }\n  .d-sm-inline-block {\n    display: inline-block !important; }\n  .d-sm-block {\n    display: block !important; }\n  .d-sm-grid {\n    display: grid !important; }\n  .d-sm-table {\n    display: table !important; }\n  .d-sm-table-row {\n    display: table-row !important; }\n  .d-sm-table-cell {\n    display: table-cell !important; }\n  .d-sm-flex {\n    display: flex !important; }\n  .d-sm-inline-flex {\n    display: inline-flex !important; }\n  .d-sm-none {\n    display: none !important; }\n  .border-top-sm {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-sm-0 {\n    border-top: 0 !important; }\n  .border-end-sm {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-sm-0 {\n    border-right: 0 !important; }\n  .border-bottom-sm {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-sm-0 {\n    border-bottom: 0 !important; }\n  .border-start-sm {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-sm-0 {\n    border-left: 0 !important; }\n  .w-sm-0 {\n    width: 0% !important; }\n  .w-sm-1 {\n    width: 1% !important; }\n  .w-sm-2 {\n    width: 2% !important; }\n  .w-sm-3 {\n    width: 3% !important; }\n  .w-sm-4 {\n    width: 4% !important; }\n  .w-sm-5 {\n    width: 5% !important; }\n  .w-sm-6 {\n    width: 6% !important; }\n  .w-sm-7 {\n    width: 7% !important; }\n  .w-sm-8 {\n    width: 8% !important; }\n  .w-sm-9 {\n    width: 9% !important; }\n  .w-sm-10 {\n    width: 10% !important; }\n  .w-sm-15 {\n    width: 15% !important; }\n  .w-sm-20 {\n    width: 20% !important; }\n  .w-sm-25 {\n    width: 25% !important; }\n  .w-sm-30 {\n    width: 30% !important; }\n  .w-sm-35 {\n    width: 35% !important; }\n  .w-sm-40 {\n    width: 40% !important; }\n  .w-sm-45 {\n    width: 45% !important; }\n  .w-sm-50 {\n    width: 50% !important; }\n  .w-sm-55 {\n    width: 55% !important; }\n  .w-sm-60 {\n    width: 60% !important; }\n  .w-sm-65 {\n    width: 65% !important; }\n  .w-sm-70 {\n    width: 70% !important; }\n  .w-sm-75 {\n    width: 75% !important; }\n  .w-sm-80 {\n    width: 80% !important; }\n  .w-sm-85 {\n    width: 85% !important; }\n  .w-sm-90 {\n    width: 90% !important; }\n  .w-sm-95 {\n    width: 95% !important; }\n  .w-sm-100 {\n    width: 100% !important; }\n  .w-sm-auto {\n    width: auto !important; }\n  .flex-sm-fill {\n    flex: 1 1 auto !important; }\n  .flex-sm-row {\n    flex-direction: row !important; }\n  .flex-sm-column {\n    flex-direction: column !important; }\n  .flex-sm-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-sm-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-sm-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-sm-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-sm-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-sm-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-sm-wrap {\n    flex-wrap: wrap !important; }\n  .flex-sm-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-sm-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-sm-0 {\n    gap: 0 !important; }\n  .gap-sm-1 {\n    gap: 0.25rem !important; }\n  .gap-sm-2 {\n    gap: 0.5rem !important; }\n  .gap-sm-3 {\n    gap: 1rem !important; }\n  .gap-sm-4 {\n    gap: 1.5rem !important; }\n  .gap-sm-5 {\n    gap: 3rem !important; }\n  .gap-sm-6 {\n    gap: 4rem !important; }\n  .gap-sm-7 {\n    gap: 6rem !important; }\n  .gap-sm-8 {\n    gap: 8rem !important; }\n  .gap-sm-9 {\n    gap: 10rem !important; }\n  .gap-sm-10 {\n    gap: 12rem !important; }\n  .gap-sm-11 {\n    gap: 14rem !important; }\n  .gap-sm-12 {\n    gap: 16rem !important; }\n  .justify-content-sm-start {\n    justify-content: flex-start !important; }\n  .justify-content-sm-end {\n    justify-content: flex-end !important; }\n  .justify-content-sm-center {\n    justify-content: center !important; }\n  .justify-content-sm-between {\n    justify-content: space-between !important; }\n  .justify-content-sm-around {\n    justify-content: space-around !important; }\n  .justify-content-sm-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-sm-start {\n    align-items: flex-start !important; }\n  .align-items-sm-end {\n    align-items: flex-end !important; }\n  .align-items-sm-center {\n    align-items: center !important; }\n  .align-items-sm-baseline {\n    align-items: baseline !important; }\n  .align-items-sm-stretch {\n    align-items: stretch !important; }\n  .align-content-sm-start {\n    align-content: flex-start !important; }\n  .align-content-sm-end {\n    align-content: flex-end !important; }\n  .align-content-sm-center {\n    align-content: center !important; }\n  .align-content-sm-between {\n    align-content: space-between !important; }\n  .align-content-sm-around {\n    align-content: space-around !important; }\n  .align-content-sm-stretch {\n    align-content: stretch !important; }\n  .align-self-sm-auto {\n    align-self: auto !important; }\n  .align-self-sm-start {\n    align-self: flex-start !important; }\n  .align-self-sm-end {\n    align-self: flex-end !important; }\n  .align-self-sm-center {\n    align-self: center !important; }\n  .align-self-sm-baseline {\n    align-self: baseline !important; }\n  .align-self-sm-stretch {\n    align-self: stretch !important; }\n  .order-sm-first {\n    order: -1 !important; }\n  .order-sm-0 {\n    order: 0 !important; }\n  .order-sm-1 {\n    order: 1 !important; }\n  .order-sm-2 {\n    order: 2 !important; }\n  .order-sm-3 {\n    order: 3 !important; }\n  .order-sm-4 {\n    order: 4 !important; }\n  .order-sm-5 {\n    order: 5 !important; }\n  .order-sm-last {\n    order: 6 !important; }\n  .m-sm-0 {\n    margin: 0 !important; }\n  .m-sm-1 {\n    margin: 0.25rem !important; }\n  .m-sm-2 {\n    margin: 0.5rem !important; }\n  .m-sm-3 {\n    margin: 1rem !important; }\n  .m-sm-4 {\n    margin: 1.5rem !important; }\n  .m-sm-5 {\n    margin: 3rem !important; }\n  .m-sm-6 {\n    margin: 4rem !important; }\n  .m-sm-7 {\n    margin: 6rem !important; }\n  .m-sm-8 {\n    margin: 8rem !important; }\n  .m-sm-9 {\n    margin: 10rem !important; }\n  .m-sm-10 {\n    margin: 12rem !important; }\n  .m-sm-11 {\n    margin: 14rem !important; }\n  .m-sm-12 {\n    margin: 16rem !important; }\n  .m-sm-auto {\n    margin: auto !important; }\n  .mx-sm-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-sm-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-sm-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-sm-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-sm-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-sm-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-sm-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-sm-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-sm-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-sm-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-sm-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-sm-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-sm-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-sm-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-sm-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-sm-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-sm-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-sm-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-sm-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-sm-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-sm-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-sm-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-sm-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-sm-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-sm-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-sm-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-sm-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-sm-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-sm-0 {\n    margin-top: 0 !important; }\n  .mt-sm-1 {\n    margin-top: 0.25rem !important; }\n  .mt-sm-2 {\n    margin-top: 0.5rem !important; }\n  .mt-sm-3 {\n    margin-top: 1rem !important; }\n  .mt-sm-4 {\n    margin-top: 1.5rem !important; }\n  .mt-sm-5 {\n    margin-top: 3rem !important; }\n  .mt-sm-6 {\n    margin-top: 4rem !important; }\n  .mt-sm-7 {\n    margin-top: 6rem !important; }\n  .mt-sm-8 {\n    margin-top: 8rem !important; }\n  .mt-sm-9 {\n    margin-top: 10rem !important; }\n  .mt-sm-10 {\n    margin-top: 12rem !important; }\n  .mt-sm-11 {\n    margin-top: 14rem !important; }\n  .mt-sm-12 {\n    margin-top: 16rem !important; }\n  .mt-sm-auto {\n    margin-top: auto !important; }\n  .me-sm-0 {\n    margin-right: 0 !important; }\n  .me-sm-1 {\n    margin-right: 0.25rem !important; }\n  .me-sm-2 {\n    margin-right: 0.5rem !important; }\n  .me-sm-3 {\n    margin-right: 1rem !important; }\n  .me-sm-4 {\n    margin-right: 1.5rem !important; }\n  .me-sm-5 {\n    margin-right: 3rem !important; }\n  .me-sm-6 {\n    margin-right: 4rem !important; }\n  .me-sm-7 {\n    margin-right: 6rem !important; }\n  .me-sm-8 {\n    margin-right: 8rem !important; }\n  .me-sm-9 {\n    margin-right: 10rem !important; }\n  .me-sm-10 {\n    margin-right: 12rem !important; }\n  .me-sm-11 {\n    margin-right: 14rem !important; }\n  .me-sm-12 {\n    margin-right: 16rem !important; }\n  .me-sm-auto {\n    margin-right: auto !important; }\n  .mb-sm-0 {\n    margin-bottom: 0 !important; }\n  .mb-sm-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-sm-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-sm-3 {\n    margin-bottom: 1rem !important; }\n  .mb-sm-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-sm-5 {\n    margin-bottom: 3rem !important; }\n  .mb-sm-6 {\n    margin-bottom: 4rem !important; }\n  .mb-sm-7 {\n    margin-bottom: 6rem !important; }\n  .mb-sm-8 {\n    margin-bottom: 8rem !important; }\n  .mb-sm-9 {\n    margin-bottom: 10rem !important; }\n  .mb-sm-10 {\n    margin-bottom: 12rem !important; }\n  .mb-sm-11 {\n    margin-bottom: 14rem !important; }\n  .mb-sm-12 {\n    margin-bottom: 16rem !important; }\n  .mb-sm-auto {\n    margin-bottom: auto !important; }\n  .ms-sm-0 {\n    margin-left: 0 !important; }\n  .ms-sm-1 {\n    margin-left: 0.25rem !important; }\n  .ms-sm-2 {\n    margin-left: 0.5rem !important; }\n  .ms-sm-3 {\n    margin-left: 1rem !important; }\n  .ms-sm-4 {\n    margin-left: 1.5rem !important; }\n  .ms-sm-5 {\n    margin-left: 3rem !important; }\n  .ms-sm-6 {\n    margin-left: 4rem !important; }\n  .ms-sm-7 {\n    margin-left: 6rem !important; }\n  .ms-sm-8 {\n    margin-left: 8rem !important; }\n  .ms-sm-9 {\n    margin-left: 10rem !important; }\n  .ms-sm-10 {\n    margin-left: 12rem !important; }\n  .ms-sm-11 {\n    margin-left: 14rem !important; }\n  .ms-sm-12 {\n    margin-left: 16rem !important; }\n  .ms-sm-auto {\n    margin-left: auto !important; }\n  .m-sm-n1 {\n    margin: -0.25rem !important; }\n  .m-sm-n2 {\n    margin: -0.5rem !important; }\n  .m-sm-n3 {\n    margin: -1rem !important; }\n  .m-sm-n4 {\n    margin: -1.5rem !important; }\n  .m-sm-n5 {\n    margin: -3rem !important; }\n  .m-sm-n6 {\n    margin: -4rem !important; }\n  .m-sm-n7 {\n    margin: -6rem !important; }\n  .m-sm-n8 {\n    margin: -8rem !important; }\n  .m-sm-n9 {\n    margin: -10rem !important; }\n  .m-sm-n10 {\n    margin: -12rem !important; }\n  .m-sm-n11 {\n    margin: -14rem !important; }\n  .m-sm-n12 {\n    margin: -16rem !important; }\n  .mx-sm-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-sm-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-sm-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-sm-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-sm-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-sm-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-sm-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-sm-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-sm-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-sm-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-sm-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-sm-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-sm-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-sm-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-sm-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-sm-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-sm-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-sm-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-sm-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-sm-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-sm-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-sm-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-sm-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-sm-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-sm-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-sm-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-sm-n3 {\n    margin-top: -1rem !important; }\n  .mt-sm-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-sm-n5 {\n    margin-top: -3rem !important; }\n  .mt-sm-n6 {\n    margin-top: -4rem !important; }\n  .mt-sm-n7 {\n    margin-top: -6rem !important; }\n  .mt-sm-n8 {\n    margin-top: -8rem !important; }\n  .mt-sm-n9 {\n    margin-top: -10rem !important; }\n  .mt-sm-n10 {\n    margin-top: -12rem !important; }\n  .mt-sm-n11 {\n    margin-top: -14rem !important; }\n  .mt-sm-n12 {\n    margin-top: -16rem !important; }\n  .me-sm-n1 {\n    margin-right: -0.25rem !important; }\n  .me-sm-n2 {\n    margin-right: -0.5rem !important; }\n  .me-sm-n3 {\n    margin-right: -1rem !important; }\n  .me-sm-n4 {\n    margin-right: -1.5rem !important; }\n  .me-sm-n5 {\n    margin-right: -3rem !important; }\n  .me-sm-n6 {\n    margin-right: -4rem !important; }\n  .me-sm-n7 {\n    margin-right: -6rem !important; }\n  .me-sm-n8 {\n    margin-right: -8rem !important; }\n  .me-sm-n9 {\n    margin-right: -10rem !important; }\n  .me-sm-n10 {\n    margin-right: -12rem !important; }\n  .me-sm-n11 {\n    margin-right: -14rem !important; }\n  .me-sm-n12 {\n    margin-right: -16rem !important; }\n  .mb-sm-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-sm-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-sm-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-sm-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-sm-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-sm-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-sm-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-sm-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-sm-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-sm-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-sm-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-sm-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-sm-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-sm-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-sm-n3 {\n    margin-left: -1rem !important; }\n  .ms-sm-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-sm-n5 {\n    margin-left: -3rem !important; }\n  .ms-sm-n6 {\n    margin-left: -4rem !important; }\n  .ms-sm-n7 {\n    margin-left: -6rem !important; }\n  .ms-sm-n8 {\n    margin-left: -8rem !important; }\n  .ms-sm-n9 {\n    margin-left: -10rem !important; }\n  .ms-sm-n10 {\n    margin-left: -12rem !important; }\n  .ms-sm-n11 {\n    margin-left: -14rem !important; }\n  .ms-sm-n12 {\n    margin-left: -16rem !important; }\n  .p-sm-0 {\n    padding: 0 !important; }\n  .p-sm-1 {\n    padding: 0.25rem !important; }\n  .p-sm-2 {\n    padding: 0.5rem !important; }\n  .p-sm-3 {\n    padding: 1rem !important; }\n  .p-sm-4 {\n    padding: 1.5rem !important; }\n  .p-sm-5 {\n    padding: 3rem !important; }\n  .p-sm-6 {\n    padding: 4rem !important; }\n  .p-sm-7 {\n    padding: 6rem !important; }\n  .p-sm-8 {\n    padding: 8rem !important; }\n  .p-sm-9 {\n    padding: 10rem !important; }\n  .p-sm-10 {\n    padding: 12rem !important; }\n  .p-sm-11 {\n    padding: 14rem !important; }\n  .p-sm-12 {\n    padding: 16rem !important; }\n  .px-sm-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-sm-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-sm-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-sm-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-sm-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-sm-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-sm-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-sm-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-sm-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-sm-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-sm-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-sm-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-sm-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-sm-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-sm-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-sm-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-sm-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-sm-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-sm-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-sm-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-sm-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-sm-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-sm-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-sm-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-sm-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-sm-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-sm-0 {\n    padding-top: 0 !important; }\n  .pt-sm-1 {\n    padding-top: 0.25rem !important; }\n  .pt-sm-2 {\n    padding-top: 0.5rem !important; }\n  .pt-sm-3 {\n    padding-top: 1rem !important; }\n  .pt-sm-4 {\n    padding-top: 1.5rem !important; }\n  .pt-sm-5 {\n    padding-top: 3rem !important; }\n  .pt-sm-6 {\n    padding-top: 4rem !important; }\n  .pt-sm-7 {\n    padding-top: 6rem !important; }\n  .pt-sm-8 {\n    padding-top: 8rem !important; }\n  .pt-sm-9 {\n    padding-top: 10rem !important; }\n  .pt-sm-10 {\n    padding-top: 12rem !important; }\n  .pt-sm-11 {\n    padding-top: 14rem !important; }\n  .pt-sm-12 {\n    padding-top: 16rem !important; }\n  .pe-sm-0 {\n    padding-right: 0 !important; }\n  .pe-sm-1 {\n    padding-right: 0.25rem !important; }\n  .pe-sm-2 {\n    padding-right: 0.5rem !important; }\n  .pe-sm-3 {\n    padding-right: 1rem !important; }\n  .pe-sm-4 {\n    padding-right: 1.5rem !important; }\n  .pe-sm-5 {\n    padding-right: 3rem !important; }\n  .pe-sm-6 {\n    padding-right: 4rem !important; }\n  .pe-sm-7 {\n    padding-right: 6rem !important; }\n  .pe-sm-8 {\n    padding-right: 8rem !important; }\n  .pe-sm-9 {\n    padding-right: 10rem !important; }\n  .pe-sm-10 {\n    padding-right: 12rem !important; }\n  .pe-sm-11 {\n    padding-right: 14rem !important; }\n  .pe-sm-12 {\n    padding-right: 16rem !important; }\n  .pb-sm-0 {\n    padding-bottom: 0 !important; }\n  .pb-sm-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-sm-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-sm-3 {\n    padding-bottom: 1rem !important; }\n  .pb-sm-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-sm-5 {\n    padding-bottom: 3rem !important; }\n  .pb-sm-6 {\n    padding-bottom: 4rem !important; }\n  .pb-sm-7 {\n    padding-bottom: 6rem !important; }\n  .pb-sm-8 {\n    padding-bottom: 8rem !important; }\n  .pb-sm-9 {\n    padding-bottom: 10rem !important; }\n  .pb-sm-10 {\n    padding-bottom: 12rem !important; }\n  .pb-sm-11 {\n    padding-bottom: 14rem !important; }\n  .pb-sm-12 {\n    padding-bottom: 16rem !important; }\n  .ps-sm-0 {\n    padding-left: 0 !important; }\n  .ps-sm-1 {\n    padding-left: 0.25rem !important; }\n  .ps-sm-2 {\n    padding-left: 0.5rem !important; }\n  .ps-sm-3 {\n    padding-left: 1rem !important; }\n  .ps-sm-4 {\n    padding-left: 1.5rem !important; }\n  .ps-sm-5 {\n    padding-left: 3rem !important; }\n  .ps-sm-6 {\n    padding-left: 4rem !important; }\n  .ps-sm-7 {\n    padding-left: 6rem !important; }\n  .ps-sm-8 {\n    padding-left: 8rem !important; }\n  .ps-sm-9 {\n    padding-left: 10rem !important; }\n  .ps-sm-10 {\n    padding-left: 12rem !important; }\n  .ps-sm-11 {\n    padding-left: 14rem !important; }\n  .ps-sm-12 {\n    padding-left: 16rem !important; }\n  .text-sm-start {\n    text-align: left !important; }\n  .text-sm-end {\n    text-align: right !important; }\n  .text-sm-center {\n    text-align: center !important; }\n  .transform-scale-sm-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-sm-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-sm-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-sm-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-sm-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-sm-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-sm {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-sm-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-sm-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-sm-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-sm-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-sm-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-sm-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-sm-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-sm-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-sm {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-sm-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-sm-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-sm-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-sm-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-sm-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-sm-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-sm-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-sm-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-sm {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-sm-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-sm-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-sm-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-sm-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-sm-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-sm-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-sm-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-sm-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-sm {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-sm-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-sm-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-sm-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-sm-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-sm-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-sm-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-sm-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-sm-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 768px) {\n  .float-md-start {\n    float: left !important; }\n  .float-md-end {\n    float: right !important; }\n  .float-md-none {\n    float: none !important; }\n  .d-md-inline {\n    display: inline !important; }\n  .d-md-inline-block {\n    display: inline-block !important; }\n  .d-md-block {\n    display: block !important; }\n  .d-md-grid {\n    display: grid !important; }\n  .d-md-table {\n    display: table !important; }\n  .d-md-table-row {\n    display: table-row !important; }\n  .d-md-table-cell {\n    display: table-cell !important; }\n  .d-md-flex {\n    display: flex !important; }\n  .d-md-inline-flex {\n    display: inline-flex !important; }\n  .d-md-none {\n    display: none !important; }\n  .border-top-md {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-md-0 {\n    border-top: 0 !important; }\n  .border-end-md {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-md-0 {\n    border-right: 0 !important; }\n  .border-bottom-md {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-md-0 {\n    border-bottom: 0 !important; }\n  .border-start-md {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-md-0 {\n    border-left: 0 !important; }\n  .w-md-0 {\n    width: 0% !important; }\n  .w-md-1 {\n    width: 1% !important; }\n  .w-md-2 {\n    width: 2% !important; }\n  .w-md-3 {\n    width: 3% !important; }\n  .w-md-4 {\n    width: 4% !important; }\n  .w-md-5 {\n    width: 5% !important; }\n  .w-md-6 {\n    width: 6% !important; }\n  .w-md-7 {\n    width: 7% !important; }\n  .w-md-8 {\n    width: 8% !important; }\n  .w-md-9 {\n    width: 9% !important; }\n  .w-md-10 {\n    width: 10% !important; }\n  .w-md-15 {\n    width: 15% !important; }\n  .w-md-20 {\n    width: 20% !important; }\n  .w-md-25 {\n    width: 25% !important; }\n  .w-md-30 {\n    width: 30% !important; }\n  .w-md-35 {\n    width: 35% !important; }\n  .w-md-40 {\n    width: 40% !important; }\n  .w-md-45 {\n    width: 45% !important; }\n  .w-md-50 {\n    width: 50% !important; }\n  .w-md-55 {\n    width: 55% !important; }\n  .w-md-60 {\n    width: 60% !important; }\n  .w-md-65 {\n    width: 65% !important; }\n  .w-md-70 {\n    width: 70% !important; }\n  .w-md-75 {\n    width: 75% !important; }\n  .w-md-80 {\n    width: 80% !important; }\n  .w-md-85 {\n    width: 85% !important; }\n  .w-md-90 {\n    width: 90% !important; }\n  .w-md-95 {\n    width: 95% !important; }\n  .w-md-100 {\n    width: 100% !important; }\n  .w-md-auto {\n    width: auto !important; }\n  .flex-md-fill {\n    flex: 1 1 auto !important; }\n  .flex-md-row {\n    flex-direction: row !important; }\n  .flex-md-column {\n    flex-direction: column !important; }\n  .flex-md-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-md-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-md-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-md-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-md-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-md-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-md-wrap {\n    flex-wrap: wrap !important; }\n  .flex-md-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-md-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-md-0 {\n    gap: 0 !important; }\n  .gap-md-1 {\n    gap: 0.25rem !important; }\n  .gap-md-2 {\n    gap: 0.5rem !important; }\n  .gap-md-3 {\n    gap: 1rem !important; }\n  .gap-md-4 {\n    gap: 1.5rem !important; }\n  .gap-md-5 {\n    gap: 3rem !important; }\n  .gap-md-6 {\n    gap: 4rem !important; }\n  .gap-md-7 {\n    gap: 6rem !important; }\n  .gap-md-8 {\n    gap: 8rem !important; }\n  .gap-md-9 {\n    gap: 10rem !important; }\n  .gap-md-10 {\n    gap: 12rem !important; }\n  .gap-md-11 {\n    gap: 14rem !important; }\n  .gap-md-12 {\n    gap: 16rem !important; }\n  .justify-content-md-start {\n    justify-content: flex-start !important; }\n  .justify-content-md-end {\n    justify-content: flex-end !important; }\n  .justify-content-md-center {\n    justify-content: center !important; }\n  .justify-content-md-between {\n    justify-content: space-between !important; }\n  .justify-content-md-around {\n    justify-content: space-around !important; }\n  .justify-content-md-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-md-start {\n    align-items: flex-start !important; }\n  .align-items-md-end {\n    align-items: flex-end !important; }\n  .align-items-md-center {\n    align-items: center !important; }\n  .align-items-md-baseline {\n    align-items: baseline !important; }\n  .align-items-md-stretch {\n    align-items: stretch !important; }\n  .align-content-md-start {\n    align-content: flex-start !important; }\n  .align-content-md-end {\n    align-content: flex-end !important; }\n  .align-content-md-center {\n    align-content: center !important; }\n  .align-content-md-between {\n    align-content: space-between !important; }\n  .align-content-md-around {\n    align-content: space-around !important; }\n  .align-content-md-stretch {\n    align-content: stretch !important; }\n  .align-self-md-auto {\n    align-self: auto !important; }\n  .align-self-md-start {\n    align-self: flex-start !important; }\n  .align-self-md-end {\n    align-self: flex-end !important; }\n  .align-self-md-center {\n    align-self: center !important; }\n  .align-self-md-baseline {\n    align-self: baseline !important; }\n  .align-self-md-stretch {\n    align-self: stretch !important; }\n  .order-md-first {\n    order: -1 !important; }\n  .order-md-0 {\n    order: 0 !important; }\n  .order-md-1 {\n    order: 1 !important; }\n  .order-md-2 {\n    order: 2 !important; }\n  .order-md-3 {\n    order: 3 !important; }\n  .order-md-4 {\n    order: 4 !important; }\n  .order-md-5 {\n    order: 5 !important; }\n  .order-md-last {\n    order: 6 !important; }\n  .m-md-0 {\n    margin: 0 !important; }\n  .m-md-1 {\n    margin: 0.25rem !important; }\n  .m-md-2 {\n    margin: 0.5rem !important; }\n  .m-md-3 {\n    margin: 1rem !important; }\n  .m-md-4 {\n    margin: 1.5rem !important; }\n  .m-md-5 {\n    margin: 3rem !important; }\n  .m-md-6 {\n    margin: 4rem !important; }\n  .m-md-7 {\n    margin: 6rem !important; }\n  .m-md-8 {\n    margin: 8rem !important; }\n  .m-md-9 {\n    margin: 10rem !important; }\n  .m-md-10 {\n    margin: 12rem !important; }\n  .m-md-11 {\n    margin: 14rem !important; }\n  .m-md-12 {\n    margin: 16rem !important; }\n  .m-md-auto {\n    margin: auto !important; }\n  .mx-md-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-md-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-md-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-md-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-md-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-md-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-md-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-md-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-md-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-md-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-md-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-md-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-md-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-md-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-md-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-md-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-md-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-md-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-md-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-md-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-md-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-md-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-md-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-md-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-md-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-md-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-md-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-md-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-md-0 {\n    margin-top: 0 !important; }\n  .mt-md-1 {\n    margin-top: 0.25rem !important; }\n  .mt-md-2 {\n    margin-top: 0.5rem !important; }\n  .mt-md-3 {\n    margin-top: 1rem !important; }\n  .mt-md-4 {\n    margin-top: 1.5rem !important; }\n  .mt-md-5 {\n    margin-top: 3rem !important; }\n  .mt-md-6 {\n    margin-top: 4rem !important; }\n  .mt-md-7 {\n    margin-top: 6rem !important; }\n  .mt-md-8 {\n    margin-top: 8rem !important; }\n  .mt-md-9 {\n    margin-top: 10rem !important; }\n  .mt-md-10 {\n    margin-top: 12rem !important; }\n  .mt-md-11 {\n    margin-top: 14rem !important; }\n  .mt-md-12 {\n    margin-top: 16rem !important; }\n  .mt-md-auto {\n    margin-top: auto !important; }\n  .me-md-0 {\n    margin-right: 0 !important; }\n  .me-md-1 {\n    margin-right: 0.25rem !important; }\n  .me-md-2 {\n    margin-right: 0.5rem !important; }\n  .me-md-3 {\n    margin-right: 1rem !important; }\n  .me-md-4 {\n    margin-right: 1.5rem !important; }\n  .me-md-5 {\n    margin-right: 3rem !important; }\n  .me-md-6 {\n    margin-right: 4rem !important; }\n  .me-md-7 {\n    margin-right: 6rem !important; }\n  .me-md-8 {\n    margin-right: 8rem !important; }\n  .me-md-9 {\n    margin-right: 10rem !important; }\n  .me-md-10 {\n    margin-right: 12rem !important; }\n  .me-md-11 {\n    margin-right: 14rem !important; }\n  .me-md-12 {\n    margin-right: 16rem !important; }\n  .me-md-auto {\n    margin-right: auto !important; }\n  .mb-md-0 {\n    margin-bottom: 0 !important; }\n  .mb-md-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-md-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-md-3 {\n    margin-bottom: 1rem !important; }\n  .mb-md-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-md-5 {\n    margin-bottom: 3rem !important; }\n  .mb-md-6 {\n    margin-bottom: 4rem !important; }\n  .mb-md-7 {\n    margin-bottom: 6rem !important; }\n  .mb-md-8 {\n    margin-bottom: 8rem !important; }\n  .mb-md-9 {\n    margin-bottom: 10rem !important; }\n  .mb-md-10 {\n    margin-bottom: 12rem !important; }\n  .mb-md-11 {\n    margin-bottom: 14rem !important; }\n  .mb-md-12 {\n    margin-bottom: 16rem !important; }\n  .mb-md-auto {\n    margin-bottom: auto !important; }\n  .ms-md-0 {\n    margin-left: 0 !important; }\n  .ms-md-1 {\n    margin-left: 0.25rem !important; }\n  .ms-md-2 {\n    margin-left: 0.5rem !important; }\n  .ms-md-3 {\n    margin-left: 1rem !important; }\n  .ms-md-4 {\n    margin-left: 1.5rem !important; }\n  .ms-md-5 {\n    margin-left: 3rem !important; }\n  .ms-md-6 {\n    margin-left: 4rem !important; }\n  .ms-md-7 {\n    margin-left: 6rem !important; }\n  .ms-md-8 {\n    margin-left: 8rem !important; }\n  .ms-md-9 {\n    margin-left: 10rem !important; }\n  .ms-md-10 {\n    margin-left: 12rem !important; }\n  .ms-md-11 {\n    margin-left: 14rem !important; }\n  .ms-md-12 {\n    margin-left: 16rem !important; }\n  .ms-md-auto {\n    margin-left: auto !important; }\n  .m-md-n1 {\n    margin: -0.25rem !important; }\n  .m-md-n2 {\n    margin: -0.5rem !important; }\n  .m-md-n3 {\n    margin: -1rem !important; }\n  .m-md-n4 {\n    margin: -1.5rem !important; }\n  .m-md-n5 {\n    margin: -3rem !important; }\n  .m-md-n6 {\n    margin: -4rem !important; }\n  .m-md-n7 {\n    margin: -6rem !important; }\n  .m-md-n8 {\n    margin: -8rem !important; }\n  .m-md-n9 {\n    margin: -10rem !important; }\n  .m-md-n10 {\n    margin: -12rem !important; }\n  .m-md-n11 {\n    margin: -14rem !important; }\n  .m-md-n12 {\n    margin: -16rem !important; }\n  .mx-md-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-md-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-md-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-md-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-md-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-md-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-md-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-md-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-md-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-md-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-md-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-md-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-md-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-md-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-md-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-md-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-md-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-md-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-md-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-md-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-md-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-md-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-md-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-md-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-md-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-md-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-md-n3 {\n    margin-top: -1rem !important; }\n  .mt-md-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-md-n5 {\n    margin-top: -3rem !important; }\n  .mt-md-n6 {\n    margin-top: -4rem !important; }\n  .mt-md-n7 {\n    margin-top: -6rem !important; }\n  .mt-md-n8 {\n    margin-top: -8rem !important; }\n  .mt-md-n9 {\n    margin-top: -10rem !important; }\n  .mt-md-n10 {\n    margin-top: -12rem !important; }\n  .mt-md-n11 {\n    margin-top: -14rem !important; }\n  .mt-md-n12 {\n    margin-top: -16rem !important; }\n  .me-md-n1 {\n    margin-right: -0.25rem !important; }\n  .me-md-n2 {\n    margin-right: -0.5rem !important; }\n  .me-md-n3 {\n    margin-right: -1rem !important; }\n  .me-md-n4 {\n    margin-right: -1.5rem !important; }\n  .me-md-n5 {\n    margin-right: -3rem !important; }\n  .me-md-n6 {\n    margin-right: -4rem !important; }\n  .me-md-n7 {\n    margin-right: -6rem !important; }\n  .me-md-n8 {\n    margin-right: -8rem !important; }\n  .me-md-n9 {\n    margin-right: -10rem !important; }\n  .me-md-n10 {\n    margin-right: -12rem !important; }\n  .me-md-n11 {\n    margin-right: -14rem !important; }\n  .me-md-n12 {\n    margin-right: -16rem !important; }\n  .mb-md-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-md-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-md-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-md-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-md-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-md-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-md-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-md-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-md-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-md-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-md-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-md-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-md-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-md-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-md-n3 {\n    margin-left: -1rem !important; }\n  .ms-md-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-md-n5 {\n    margin-left: -3rem !important; }\n  .ms-md-n6 {\n    margin-left: -4rem !important; }\n  .ms-md-n7 {\n    margin-left: -6rem !important; }\n  .ms-md-n8 {\n    margin-left: -8rem !important; }\n  .ms-md-n9 {\n    margin-left: -10rem !important; }\n  .ms-md-n10 {\n    margin-left: -12rem !important; }\n  .ms-md-n11 {\n    margin-left: -14rem !important; }\n  .ms-md-n12 {\n    margin-left: -16rem !important; }\n  .p-md-0 {\n    padding: 0 !important; }\n  .p-md-1 {\n    padding: 0.25rem !important; }\n  .p-md-2 {\n    padding: 0.5rem !important; }\n  .p-md-3 {\n    padding: 1rem !important; }\n  .p-md-4 {\n    padding: 1.5rem !important; }\n  .p-md-5 {\n    padding: 3rem !important; }\n  .p-md-6 {\n    padding: 4rem !important; }\n  .p-md-7 {\n    padding: 6rem !important; }\n  .p-md-8 {\n    padding: 8rem !important; }\n  .p-md-9 {\n    padding: 10rem !important; }\n  .p-md-10 {\n    padding: 12rem !important; }\n  .p-md-11 {\n    padding: 14rem !important; }\n  .p-md-12 {\n    padding: 16rem !important; }\n  .px-md-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-md-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-md-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-md-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-md-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-md-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-md-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-md-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-md-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-md-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-md-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-md-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-md-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-md-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-md-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-md-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-md-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-md-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-md-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-md-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-md-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-md-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-md-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-md-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-md-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-md-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-md-0 {\n    padding-top: 0 !important; }\n  .pt-md-1 {\n    padding-top: 0.25rem !important; }\n  .pt-md-2 {\n    padding-top: 0.5rem !important; }\n  .pt-md-3 {\n    padding-top: 1rem !important; }\n  .pt-md-4 {\n    padding-top: 1.5rem !important; }\n  .pt-md-5 {\n    padding-top: 3rem !important; }\n  .pt-md-6 {\n    padding-top: 4rem !important; }\n  .pt-md-7 {\n    padding-top: 6rem !important; }\n  .pt-md-8 {\n    padding-top: 8rem !important; }\n  .pt-md-9 {\n    padding-top: 10rem !important; }\n  .pt-md-10 {\n    padding-top: 12rem !important; }\n  .pt-md-11 {\n    padding-top: 14rem !important; }\n  .pt-md-12 {\n    padding-top: 16rem !important; }\n  .pe-md-0 {\n    padding-right: 0 !important; }\n  .pe-md-1 {\n    padding-right: 0.25rem !important; }\n  .pe-md-2 {\n    padding-right: 0.5rem !important; }\n  .pe-md-3 {\n    padding-right: 1rem !important; }\n  .pe-md-4 {\n    padding-right: 1.5rem !important; }\n  .pe-md-5 {\n    padding-right: 3rem !important; }\n  .pe-md-6 {\n    padding-right: 4rem !important; }\n  .pe-md-7 {\n    padding-right: 6rem !important; }\n  .pe-md-8 {\n    padding-right: 8rem !important; }\n  .pe-md-9 {\n    padding-right: 10rem !important; }\n  .pe-md-10 {\n    padding-right: 12rem !important; }\n  .pe-md-11 {\n    padding-right: 14rem !important; }\n  .pe-md-12 {\n    padding-right: 16rem !important; }\n  .pb-md-0 {\n    padding-bottom: 0 !important; }\n  .pb-md-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-md-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-md-3 {\n    padding-bottom: 1rem !important; }\n  .pb-md-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-md-5 {\n    padding-bottom: 3rem !important; }\n  .pb-md-6 {\n    padding-bottom: 4rem !important; }\n  .pb-md-7 {\n    padding-bottom: 6rem !important; }\n  .pb-md-8 {\n    padding-bottom: 8rem !important; }\n  .pb-md-9 {\n    padding-bottom: 10rem !important; }\n  .pb-md-10 {\n    padding-bottom: 12rem !important; }\n  .pb-md-11 {\n    padding-bottom: 14rem !important; }\n  .pb-md-12 {\n    padding-bottom: 16rem !important; }\n  .ps-md-0 {\n    padding-left: 0 !important; }\n  .ps-md-1 {\n    padding-left: 0.25rem !important; }\n  .ps-md-2 {\n    padding-left: 0.5rem !important; }\n  .ps-md-3 {\n    padding-left: 1rem !important; }\n  .ps-md-4 {\n    padding-left: 1.5rem !important; }\n  .ps-md-5 {\n    padding-left: 3rem !important; }\n  .ps-md-6 {\n    padding-left: 4rem !important; }\n  .ps-md-7 {\n    padding-left: 6rem !important; }\n  .ps-md-8 {\n    padding-left: 8rem !important; }\n  .ps-md-9 {\n    padding-left: 10rem !important; }\n  .ps-md-10 {\n    padding-left: 12rem !important; }\n  .ps-md-11 {\n    padding-left: 14rem !important; }\n  .ps-md-12 {\n    padding-left: 16rem !important; }\n  .text-md-start {\n    text-align: left !important; }\n  .text-md-end {\n    text-align: right !important; }\n  .text-md-center {\n    text-align: center !important; }\n  .transform-scale-md-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-md-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-md-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-md-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-md-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-md-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-md-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-md-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-md-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-md-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-md-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-md-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-md-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-md-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-md-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-md-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-md-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-md-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-md-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-md-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-md-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-md-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-md-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-md-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-md-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-md-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-md-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-md-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-md-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-md-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-md-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-md-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-md-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-md-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-md-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-md-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-md-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-md-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 992px) {\n  .float-lg-start {\n    float: left !important; }\n  .float-lg-end {\n    float: right !important; }\n  .float-lg-none {\n    float: none !important; }\n  .d-lg-inline {\n    display: inline !important; }\n  .d-lg-inline-block {\n    display: inline-block !important; }\n  .d-lg-block {\n    display: block !important; }\n  .d-lg-grid {\n    display: grid !important; }\n  .d-lg-table {\n    display: table !important; }\n  .d-lg-table-row {\n    display: table-row !important; }\n  .d-lg-table-cell {\n    display: table-cell !important; }\n  .d-lg-flex {\n    display: flex !important; }\n  .d-lg-inline-flex {\n    display: inline-flex !important; }\n  .d-lg-none {\n    display: none !important; }\n  .border-top-lg {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-lg-0 {\n    border-top: 0 !important; }\n  .border-end-lg {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-lg-0 {\n    border-right: 0 !important; }\n  .border-bottom-lg {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-lg-0 {\n    border-bottom: 0 !important; }\n  .border-start-lg {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-lg-0 {\n    border-left: 0 !important; }\n  .w-lg-0 {\n    width: 0% !important; }\n  .w-lg-1 {\n    width: 1% !important; }\n  .w-lg-2 {\n    width: 2% !important; }\n  .w-lg-3 {\n    width: 3% !important; }\n  .w-lg-4 {\n    width: 4% !important; }\n  .w-lg-5 {\n    width: 5% !important; }\n  .w-lg-6 {\n    width: 6% !important; }\n  .w-lg-7 {\n    width: 7% !important; }\n  .w-lg-8 {\n    width: 8% !important; }\n  .w-lg-9 {\n    width: 9% !important; }\n  .w-lg-10 {\n    width: 10% !important; }\n  .w-lg-15 {\n    width: 15% !important; }\n  .w-lg-20 {\n    width: 20% !important; }\n  .w-lg-25 {\n    width: 25% !important; }\n  .w-lg-30 {\n    width: 30% !important; }\n  .w-lg-35 {\n    width: 35% !important; }\n  .w-lg-40 {\n    width: 40% !important; }\n  .w-lg-45 {\n    width: 45% !important; }\n  .w-lg-50 {\n    width: 50% !important; }\n  .w-lg-55 {\n    width: 55% !important; }\n  .w-lg-60 {\n    width: 60% !important; }\n  .w-lg-65 {\n    width: 65% !important; }\n  .w-lg-70 {\n    width: 70% !important; }\n  .w-lg-75 {\n    width: 75% !important; }\n  .w-lg-80 {\n    width: 80% !important; }\n  .w-lg-85 {\n    width: 85% !important; }\n  .w-lg-90 {\n    width: 90% !important; }\n  .w-lg-95 {\n    width: 95% !important; }\n  .w-lg-100 {\n    width: 100% !important; }\n  .w-lg-auto {\n    width: auto !important; }\n  .flex-lg-fill {\n    flex: 1 1 auto !important; }\n  .flex-lg-row {\n    flex-direction: row !important; }\n  .flex-lg-column {\n    flex-direction: column !important; }\n  .flex-lg-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-lg-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-lg-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-lg-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-lg-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-lg-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-lg-wrap {\n    flex-wrap: wrap !important; }\n  .flex-lg-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-lg-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-lg-0 {\n    gap: 0 !important; }\n  .gap-lg-1 {\n    gap: 0.25rem !important; }\n  .gap-lg-2 {\n    gap: 0.5rem !important; }\n  .gap-lg-3 {\n    gap: 1rem !important; }\n  .gap-lg-4 {\n    gap: 1.5rem !important; }\n  .gap-lg-5 {\n    gap: 3rem !important; }\n  .gap-lg-6 {\n    gap: 4rem !important; }\n  .gap-lg-7 {\n    gap: 6rem !important; }\n  .gap-lg-8 {\n    gap: 8rem !important; }\n  .gap-lg-9 {\n    gap: 10rem !important; }\n  .gap-lg-10 {\n    gap: 12rem !important; }\n  .gap-lg-11 {\n    gap: 14rem !important; }\n  .gap-lg-12 {\n    gap: 16rem !important; }\n  .justify-content-lg-start {\n    justify-content: flex-start !important; }\n  .justify-content-lg-end {\n    justify-content: flex-end !important; }\n  .justify-content-lg-center {\n    justify-content: center !important; }\n  .justify-content-lg-between {\n    justify-content: space-between !important; }\n  .justify-content-lg-around {\n    justify-content: space-around !important; }\n  .justify-content-lg-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-lg-start {\n    align-items: flex-start !important; }\n  .align-items-lg-end {\n    align-items: flex-end !important; }\n  .align-items-lg-center {\n    align-items: center !important; }\n  .align-items-lg-baseline {\n    align-items: baseline !important; }\n  .align-items-lg-stretch {\n    align-items: stretch !important; }\n  .align-content-lg-start {\n    align-content: flex-start !important; }\n  .align-content-lg-end {\n    align-content: flex-end !important; }\n  .align-content-lg-center {\n    align-content: center !important; }\n  .align-content-lg-between {\n    align-content: space-between !important; }\n  .align-content-lg-around {\n    align-content: space-around !important; }\n  .align-content-lg-stretch {\n    align-content: stretch !important; }\n  .align-self-lg-auto {\n    align-self: auto !important; }\n  .align-self-lg-start {\n    align-self: flex-start !important; }\n  .align-self-lg-end {\n    align-self: flex-end !important; }\n  .align-self-lg-center {\n    align-self: center !important; }\n  .align-self-lg-baseline {\n    align-self: baseline !important; }\n  .align-self-lg-stretch {\n    align-self: stretch !important; }\n  .order-lg-first {\n    order: -1 !important; }\n  .order-lg-0 {\n    order: 0 !important; }\n  .order-lg-1 {\n    order: 1 !important; }\n  .order-lg-2 {\n    order: 2 !important; }\n  .order-lg-3 {\n    order: 3 !important; }\n  .order-lg-4 {\n    order: 4 !important; }\n  .order-lg-5 {\n    order: 5 !important; }\n  .order-lg-last {\n    order: 6 !important; }\n  .m-lg-0 {\n    margin: 0 !important; }\n  .m-lg-1 {\n    margin: 0.25rem !important; }\n  .m-lg-2 {\n    margin: 0.5rem !important; }\n  .m-lg-3 {\n    margin: 1rem !important; }\n  .m-lg-4 {\n    margin: 1.5rem !important; }\n  .m-lg-5 {\n    margin: 3rem !important; }\n  .m-lg-6 {\n    margin: 4rem !important; }\n  .m-lg-7 {\n    margin: 6rem !important; }\n  .m-lg-8 {\n    margin: 8rem !important; }\n  .m-lg-9 {\n    margin: 10rem !important; }\n  .m-lg-10 {\n    margin: 12rem !important; }\n  .m-lg-11 {\n    margin: 14rem !important; }\n  .m-lg-12 {\n    margin: 16rem !important; }\n  .m-lg-auto {\n    margin: auto !important; }\n  .mx-lg-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-lg-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-lg-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-lg-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-lg-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-lg-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-lg-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-lg-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-lg-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-lg-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-lg-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-lg-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-lg-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-lg-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-lg-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-lg-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-lg-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-lg-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-lg-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-lg-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-lg-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-lg-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-lg-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-lg-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-lg-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-lg-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-lg-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-lg-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-lg-0 {\n    margin-top: 0 !important; }\n  .mt-lg-1 {\n    margin-top: 0.25rem !important; }\n  .mt-lg-2 {\n    margin-top: 0.5rem !important; }\n  .mt-lg-3 {\n    margin-top: 1rem !important; }\n  .mt-lg-4 {\n    margin-top: 1.5rem !important; }\n  .mt-lg-5 {\n    margin-top: 3rem !important; }\n  .mt-lg-6 {\n    margin-top: 4rem !important; }\n  .mt-lg-7 {\n    margin-top: 6rem !important; }\n  .mt-lg-8 {\n    margin-top: 8rem !important; }\n  .mt-lg-9 {\n    margin-top: 10rem !important; }\n  .mt-lg-10 {\n    margin-top: 12rem !important; }\n  .mt-lg-11 {\n    margin-top: 14rem !important; }\n  .mt-lg-12 {\n    margin-top: 16rem !important; }\n  .mt-lg-auto {\n    margin-top: auto !important; }\n  .me-lg-0 {\n    margin-right: 0 !important; }\n  .me-lg-1 {\n    margin-right: 0.25rem !important; }\n  .me-lg-2 {\n    margin-right: 0.5rem !important; }\n  .me-lg-3 {\n    margin-right: 1rem !important; }\n  .me-lg-4 {\n    margin-right: 1.5rem !important; }\n  .me-lg-5 {\n    margin-right: 3rem !important; }\n  .me-lg-6 {\n    margin-right: 4rem !important; }\n  .me-lg-7 {\n    margin-right: 6rem !important; }\n  .me-lg-8 {\n    margin-right: 8rem !important; }\n  .me-lg-9 {\n    margin-right: 10rem !important; }\n  .me-lg-10 {\n    margin-right: 12rem !important; }\n  .me-lg-11 {\n    margin-right: 14rem !important; }\n  .me-lg-12 {\n    margin-right: 16rem !important; }\n  .me-lg-auto {\n    margin-right: auto !important; }\n  .mb-lg-0 {\n    margin-bottom: 0 !important; }\n  .mb-lg-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-lg-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-lg-3 {\n    margin-bottom: 1rem !important; }\n  .mb-lg-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-lg-5 {\n    margin-bottom: 3rem !important; }\n  .mb-lg-6 {\n    margin-bottom: 4rem !important; }\n  .mb-lg-7 {\n    margin-bottom: 6rem !important; }\n  .mb-lg-8 {\n    margin-bottom: 8rem !important; }\n  .mb-lg-9 {\n    margin-bottom: 10rem !important; }\n  .mb-lg-10 {\n    margin-bottom: 12rem !important; }\n  .mb-lg-11 {\n    margin-bottom: 14rem !important; }\n  .mb-lg-12 {\n    margin-bottom: 16rem !important; }\n  .mb-lg-auto {\n    margin-bottom: auto !important; }\n  .ms-lg-0 {\n    margin-left: 0 !important; }\n  .ms-lg-1 {\n    margin-left: 0.25rem !important; }\n  .ms-lg-2 {\n    margin-left: 0.5rem !important; }\n  .ms-lg-3 {\n    margin-left: 1rem !important; }\n  .ms-lg-4 {\n    margin-left: 1.5rem !important; }\n  .ms-lg-5 {\n    margin-left: 3rem !important; }\n  .ms-lg-6 {\n    margin-left: 4rem !important; }\n  .ms-lg-7 {\n    margin-left: 6rem !important; }\n  .ms-lg-8 {\n    margin-left: 8rem !important; }\n  .ms-lg-9 {\n    margin-left: 10rem !important; }\n  .ms-lg-10 {\n    margin-left: 12rem !important; }\n  .ms-lg-11 {\n    margin-left: 14rem !important; }\n  .ms-lg-12 {\n    margin-left: 16rem !important; }\n  .ms-lg-auto {\n    margin-left: auto !important; }\n  .m-lg-n1 {\n    margin: -0.25rem !important; }\n  .m-lg-n2 {\n    margin: -0.5rem !important; }\n  .m-lg-n3 {\n    margin: -1rem !important; }\n  .m-lg-n4 {\n    margin: -1.5rem !important; }\n  .m-lg-n5 {\n    margin: -3rem !important; }\n  .m-lg-n6 {\n    margin: -4rem !important; }\n  .m-lg-n7 {\n    margin: -6rem !important; }\n  .m-lg-n8 {\n    margin: -8rem !important; }\n  .m-lg-n9 {\n    margin: -10rem !important; }\n  .m-lg-n10 {\n    margin: -12rem !important; }\n  .m-lg-n11 {\n    margin: -14rem !important; }\n  .m-lg-n12 {\n    margin: -16rem !important; }\n  .mx-lg-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-lg-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-lg-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-lg-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-lg-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-lg-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-lg-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-lg-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-lg-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-lg-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-lg-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-lg-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-lg-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-lg-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-lg-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-lg-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-lg-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-lg-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-lg-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-lg-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-lg-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-lg-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-lg-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-lg-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-lg-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-lg-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-lg-n3 {\n    margin-top: -1rem !important; }\n  .mt-lg-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-lg-n5 {\n    margin-top: -3rem !important; }\n  .mt-lg-n6 {\n    margin-top: -4rem !important; }\n  .mt-lg-n7 {\n    margin-top: -6rem !important; }\n  .mt-lg-n8 {\n    margin-top: -8rem !important; }\n  .mt-lg-n9 {\n    margin-top: -10rem !important; }\n  .mt-lg-n10 {\n    margin-top: -12rem !important; }\n  .mt-lg-n11 {\n    margin-top: -14rem !important; }\n  .mt-lg-n12 {\n    margin-top: -16rem !important; }\n  .me-lg-n1 {\n    margin-right: -0.25rem !important; }\n  .me-lg-n2 {\n    margin-right: -0.5rem !important; }\n  .me-lg-n3 {\n    margin-right: -1rem !important; }\n  .me-lg-n4 {\n    margin-right: -1.5rem !important; }\n  .me-lg-n5 {\n    margin-right: -3rem !important; }\n  .me-lg-n6 {\n    margin-right: -4rem !important; }\n  .me-lg-n7 {\n    margin-right: -6rem !important; }\n  .me-lg-n8 {\n    margin-right: -8rem !important; }\n  .me-lg-n9 {\n    margin-right: -10rem !important; }\n  .me-lg-n10 {\n    margin-right: -12rem !important; }\n  .me-lg-n11 {\n    margin-right: -14rem !important; }\n  .me-lg-n12 {\n    margin-right: -16rem !important; }\n  .mb-lg-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-lg-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-lg-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-lg-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-lg-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-lg-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-lg-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-lg-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-lg-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-lg-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-lg-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-lg-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-lg-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-lg-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-lg-n3 {\n    margin-left: -1rem !important; }\n  .ms-lg-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-lg-n5 {\n    margin-left: -3rem !important; }\n  .ms-lg-n6 {\n    margin-left: -4rem !important; }\n  .ms-lg-n7 {\n    margin-left: -6rem !important; }\n  .ms-lg-n8 {\n    margin-left: -8rem !important; }\n  .ms-lg-n9 {\n    margin-left: -10rem !important; }\n  .ms-lg-n10 {\n    margin-left: -12rem !important; }\n  .ms-lg-n11 {\n    margin-left: -14rem !important; }\n  .ms-lg-n12 {\n    margin-left: -16rem !important; }\n  .p-lg-0 {\n    padding: 0 !important; }\n  .p-lg-1 {\n    padding: 0.25rem !important; }\n  .p-lg-2 {\n    padding: 0.5rem !important; }\n  .p-lg-3 {\n    padding: 1rem !important; }\n  .p-lg-4 {\n    padding: 1.5rem !important; }\n  .p-lg-5 {\n    padding: 3rem !important; }\n  .p-lg-6 {\n    padding: 4rem !important; }\n  .p-lg-7 {\n    padding: 6rem !important; }\n  .p-lg-8 {\n    padding: 8rem !important; }\n  .p-lg-9 {\n    padding: 10rem !important; }\n  .p-lg-10 {\n    padding: 12rem !important; }\n  .p-lg-11 {\n    padding: 14rem !important; }\n  .p-lg-12 {\n    padding: 16rem !important; }\n  .px-lg-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-lg-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-lg-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-lg-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-lg-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-lg-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-lg-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-lg-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-lg-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-lg-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-lg-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-lg-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-lg-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-lg-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-lg-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-lg-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-lg-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-lg-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-lg-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-lg-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-lg-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-lg-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-lg-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-lg-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-lg-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-lg-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-lg-0 {\n    padding-top: 0 !important; }\n  .pt-lg-1 {\n    padding-top: 0.25rem !important; }\n  .pt-lg-2 {\n    padding-top: 0.5rem !important; }\n  .pt-lg-3 {\n    padding-top: 1rem !important; }\n  .pt-lg-4 {\n    padding-top: 1.5rem !important; }\n  .pt-lg-5 {\n    padding-top: 3rem !important; }\n  .pt-lg-6 {\n    padding-top: 4rem !important; }\n  .pt-lg-7 {\n    padding-top: 6rem !important; }\n  .pt-lg-8 {\n    padding-top: 8rem !important; }\n  .pt-lg-9 {\n    padding-top: 10rem !important; }\n  .pt-lg-10 {\n    padding-top: 12rem !important; }\n  .pt-lg-11 {\n    padding-top: 14rem !important; }\n  .pt-lg-12 {\n    padding-top: 16rem !important; }\n  .pe-lg-0 {\n    padding-right: 0 !important; }\n  .pe-lg-1 {\n    padding-right: 0.25rem !important; }\n  .pe-lg-2 {\n    padding-right: 0.5rem !important; }\n  .pe-lg-3 {\n    padding-right: 1rem !important; }\n  .pe-lg-4 {\n    padding-right: 1.5rem !important; }\n  .pe-lg-5 {\n    padding-right: 3rem !important; }\n  .pe-lg-6 {\n    padding-right: 4rem !important; }\n  .pe-lg-7 {\n    padding-right: 6rem !important; }\n  .pe-lg-8 {\n    padding-right: 8rem !important; }\n  .pe-lg-9 {\n    padding-right: 10rem !important; }\n  .pe-lg-10 {\n    padding-right: 12rem !important; }\n  .pe-lg-11 {\n    padding-right: 14rem !important; }\n  .pe-lg-12 {\n    padding-right: 16rem !important; }\n  .pb-lg-0 {\n    padding-bottom: 0 !important; }\n  .pb-lg-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-lg-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-lg-3 {\n    padding-bottom: 1rem !important; }\n  .pb-lg-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-lg-5 {\n    padding-bottom: 3rem !important; }\n  .pb-lg-6 {\n    padding-bottom: 4rem !important; }\n  .pb-lg-7 {\n    padding-bottom: 6rem !important; }\n  .pb-lg-8 {\n    padding-bottom: 8rem !important; }\n  .pb-lg-9 {\n    padding-bottom: 10rem !important; }\n  .pb-lg-10 {\n    padding-bottom: 12rem !important; }\n  .pb-lg-11 {\n    padding-bottom: 14rem !important; }\n  .pb-lg-12 {\n    padding-bottom: 16rem !important; }\n  .ps-lg-0 {\n    padding-left: 0 !important; }\n  .ps-lg-1 {\n    padding-left: 0.25rem !important; }\n  .ps-lg-2 {\n    padding-left: 0.5rem !important; }\n  .ps-lg-3 {\n    padding-left: 1rem !important; }\n  .ps-lg-4 {\n    padding-left: 1.5rem !important; }\n  .ps-lg-5 {\n    padding-left: 3rem !important; }\n  .ps-lg-6 {\n    padding-left: 4rem !important; }\n  .ps-lg-7 {\n    padding-left: 6rem !important; }\n  .ps-lg-8 {\n    padding-left: 8rem !important; }\n  .ps-lg-9 {\n    padding-left: 10rem !important; }\n  .ps-lg-10 {\n    padding-left: 12rem !important; }\n  .ps-lg-11 {\n    padding-left: 14rem !important; }\n  .ps-lg-12 {\n    padding-left: 16rem !important; }\n  .text-lg-start {\n    text-align: left !important; }\n  .text-lg-end {\n    text-align: right !important; }\n  .text-lg-center {\n    text-align: center !important; }\n  .transform-scale-lg-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-lg-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-lg-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-lg-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-lg-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-lg-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-lg {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-lg-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-lg-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-lg-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-lg-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-lg-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-lg-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-lg-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-lg-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-lg {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-lg-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-lg-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-lg-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-lg-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-lg-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-lg-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-lg-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-lg-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-lg {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-lg-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-lg-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-lg-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-lg-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-lg-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-lg-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-lg-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-lg-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-lg {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-lg-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-lg-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-lg-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-lg-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-lg-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-lg-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-lg-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-lg-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 1200px) {\n  .float-xl-start {\n    float: left !important; }\n  .float-xl-end {\n    float: right !important; }\n  .float-xl-none {\n    float: none !important; }\n  .d-xl-inline {\n    display: inline !important; }\n  .d-xl-inline-block {\n    display: inline-block !important; }\n  .d-xl-block {\n    display: block !important; }\n  .d-xl-grid {\n    display: grid !important; }\n  .d-xl-table {\n    display: table !important; }\n  .d-xl-table-row {\n    display: table-row !important; }\n  .d-xl-table-cell {\n    display: table-cell !important; }\n  .d-xl-flex {\n    display: flex !important; }\n  .d-xl-inline-flex {\n    display: inline-flex !important; }\n  .d-xl-none {\n    display: none !important; }\n  .border-top-xl {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-xl-0 {\n    border-top: 0 !important; }\n  .border-end-xl {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-xl-0 {\n    border-right: 0 !important; }\n  .border-bottom-xl {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-xl-0 {\n    border-bottom: 0 !important; }\n  .border-start-xl {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-xl-0 {\n    border-left: 0 !important; }\n  .w-xl-0 {\n    width: 0% !important; }\n  .w-xl-1 {\n    width: 1% !important; }\n  .w-xl-2 {\n    width: 2% !important; }\n  .w-xl-3 {\n    width: 3% !important; }\n  .w-xl-4 {\n    width: 4% !important; }\n  .w-xl-5 {\n    width: 5% !important; }\n  .w-xl-6 {\n    width: 6% !important; }\n  .w-xl-7 {\n    width: 7% !important; }\n  .w-xl-8 {\n    width: 8% !important; }\n  .w-xl-9 {\n    width: 9% !important; }\n  .w-xl-10 {\n    width: 10% !important; }\n  .w-xl-15 {\n    width: 15% !important; }\n  .w-xl-20 {\n    width: 20% !important; }\n  .w-xl-25 {\n    width: 25% !important; }\n  .w-xl-30 {\n    width: 30% !important; }\n  .w-xl-35 {\n    width: 35% !important; }\n  .w-xl-40 {\n    width: 40% !important; }\n  .w-xl-45 {\n    width: 45% !important; }\n  .w-xl-50 {\n    width: 50% !important; }\n  .w-xl-55 {\n    width: 55% !important; }\n  .w-xl-60 {\n    width: 60% !important; }\n  .w-xl-65 {\n    width: 65% !important; }\n  .w-xl-70 {\n    width: 70% !important; }\n  .w-xl-75 {\n    width: 75% !important; }\n  .w-xl-80 {\n    width: 80% !important; }\n  .w-xl-85 {\n    width: 85% !important; }\n  .w-xl-90 {\n    width: 90% !important; }\n  .w-xl-95 {\n    width: 95% !important; }\n  .w-xl-100 {\n    width: 100% !important; }\n  .w-xl-auto {\n    width: auto !important; }\n  .flex-xl-fill {\n    flex: 1 1 auto !important; }\n  .flex-xl-row {\n    flex-direction: row !important; }\n  .flex-xl-column {\n    flex-direction: column !important; }\n  .flex-xl-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-xl-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-xl-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-xl-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-xl-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-xl-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-xl-wrap {\n    flex-wrap: wrap !important; }\n  .flex-xl-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-xl-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-xl-0 {\n    gap: 0 !important; }\n  .gap-xl-1 {\n    gap: 0.25rem !important; }\n  .gap-xl-2 {\n    gap: 0.5rem !important; }\n  .gap-xl-3 {\n    gap: 1rem !important; }\n  .gap-xl-4 {\n    gap: 1.5rem !important; }\n  .gap-xl-5 {\n    gap: 3rem !important; }\n  .gap-xl-6 {\n    gap: 4rem !important; }\n  .gap-xl-7 {\n    gap: 6rem !important; }\n  .gap-xl-8 {\n    gap: 8rem !important; }\n  .gap-xl-9 {\n    gap: 10rem !important; }\n  .gap-xl-10 {\n    gap: 12rem !important; }\n  .gap-xl-11 {\n    gap: 14rem !important; }\n  .gap-xl-12 {\n    gap: 16rem !important; }\n  .justify-content-xl-start {\n    justify-content: flex-start !important; }\n  .justify-content-xl-end {\n    justify-content: flex-end !important; }\n  .justify-content-xl-center {\n    justify-content: center !important; }\n  .justify-content-xl-between {\n    justify-content: space-between !important; }\n  .justify-content-xl-around {\n    justify-content: space-around !important; }\n  .justify-content-xl-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-xl-start {\n    align-items: flex-start !important; }\n  .align-items-xl-end {\n    align-items: flex-end !important; }\n  .align-items-xl-center {\n    align-items: center !important; }\n  .align-items-xl-baseline {\n    align-items: baseline !important; }\n  .align-items-xl-stretch {\n    align-items: stretch !important; }\n  .align-content-xl-start {\n    align-content: flex-start !important; }\n  .align-content-xl-end {\n    align-content: flex-end !important; }\n  .align-content-xl-center {\n    align-content: center !important; }\n  .align-content-xl-between {\n    align-content: space-between !important; }\n  .align-content-xl-around {\n    align-content: space-around !important; }\n  .align-content-xl-stretch {\n    align-content: stretch !important; }\n  .align-self-xl-auto {\n    align-self: auto !important; }\n  .align-self-xl-start {\n    align-self: flex-start !important; }\n  .align-self-xl-end {\n    align-self: flex-end !important; }\n  .align-self-xl-center {\n    align-self: center !important; }\n  .align-self-xl-baseline {\n    align-self: baseline !important; }\n  .align-self-xl-stretch {\n    align-self: stretch !important; }\n  .order-xl-first {\n    order: -1 !important; }\n  .order-xl-0 {\n    order: 0 !important; }\n  .order-xl-1 {\n    order: 1 !important; }\n  .order-xl-2 {\n    order: 2 !important; }\n  .order-xl-3 {\n    order: 3 !important; }\n  .order-xl-4 {\n    order: 4 !important; }\n  .order-xl-5 {\n    order: 5 !important; }\n  .order-xl-last {\n    order: 6 !important; }\n  .m-xl-0 {\n    margin: 0 !important; }\n  .m-xl-1 {\n    margin: 0.25rem !important; }\n  .m-xl-2 {\n    margin: 0.5rem !important; }\n  .m-xl-3 {\n    margin: 1rem !important; }\n  .m-xl-4 {\n    margin: 1.5rem !important; }\n  .m-xl-5 {\n    margin: 3rem !important; }\n  .m-xl-6 {\n    margin: 4rem !important; }\n  .m-xl-7 {\n    margin: 6rem !important; }\n  .m-xl-8 {\n    margin: 8rem !important; }\n  .m-xl-9 {\n    margin: 10rem !important; }\n  .m-xl-10 {\n    margin: 12rem !important; }\n  .m-xl-11 {\n    margin: 14rem !important; }\n  .m-xl-12 {\n    margin: 16rem !important; }\n  .m-xl-auto {\n    margin: auto !important; }\n  .mx-xl-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-xl-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-xl-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-xl-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-xl-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-xl-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-xl-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-xl-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-xl-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-xl-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-xl-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-xl-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-xl-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-xl-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-xl-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-xl-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-xl-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-xl-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-xl-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-xl-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-xl-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-xl-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-xl-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-xl-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-xl-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-xl-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-xl-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-xl-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-xl-0 {\n    margin-top: 0 !important; }\n  .mt-xl-1 {\n    margin-top: 0.25rem !important; }\n  .mt-xl-2 {\n    margin-top: 0.5rem !important; }\n  .mt-xl-3 {\n    margin-top: 1rem !important; }\n  .mt-xl-4 {\n    margin-top: 1.5rem !important; }\n  .mt-xl-5 {\n    margin-top: 3rem !important; }\n  .mt-xl-6 {\n    margin-top: 4rem !important; }\n  .mt-xl-7 {\n    margin-top: 6rem !important; }\n  .mt-xl-8 {\n    margin-top: 8rem !important; }\n  .mt-xl-9 {\n    margin-top: 10rem !important; }\n  .mt-xl-10 {\n    margin-top: 12rem !important; }\n  .mt-xl-11 {\n    margin-top: 14rem !important; }\n  .mt-xl-12 {\n    margin-top: 16rem !important; }\n  .mt-xl-auto {\n    margin-top: auto !important; }\n  .me-xl-0 {\n    margin-right: 0 !important; }\n  .me-xl-1 {\n    margin-right: 0.25rem !important; }\n  .me-xl-2 {\n    margin-right: 0.5rem !important; }\n  .me-xl-3 {\n    margin-right: 1rem !important; }\n  .me-xl-4 {\n    margin-right: 1.5rem !important; }\n  .me-xl-5 {\n    margin-right: 3rem !important; }\n  .me-xl-6 {\n    margin-right: 4rem !important; }\n  .me-xl-7 {\n    margin-right: 6rem !important; }\n  .me-xl-8 {\n    margin-right: 8rem !important; }\n  .me-xl-9 {\n    margin-right: 10rem !important; }\n  .me-xl-10 {\n    margin-right: 12rem !important; }\n  .me-xl-11 {\n    margin-right: 14rem !important; }\n  .me-xl-12 {\n    margin-right: 16rem !important; }\n  .me-xl-auto {\n    margin-right: auto !important; }\n  .mb-xl-0 {\n    margin-bottom: 0 !important; }\n  .mb-xl-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-xl-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-xl-3 {\n    margin-bottom: 1rem !important; }\n  .mb-xl-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-xl-5 {\n    margin-bottom: 3rem !important; }\n  .mb-xl-6 {\n    margin-bottom: 4rem !important; }\n  .mb-xl-7 {\n    margin-bottom: 6rem !important; }\n  .mb-xl-8 {\n    margin-bottom: 8rem !important; }\n  .mb-xl-9 {\n    margin-bottom: 10rem !important; }\n  .mb-xl-10 {\n    margin-bottom: 12rem !important; }\n  .mb-xl-11 {\n    margin-bottom: 14rem !important; }\n  .mb-xl-12 {\n    margin-bottom: 16rem !important; }\n  .mb-xl-auto {\n    margin-bottom: auto !important; }\n  .ms-xl-0 {\n    margin-left: 0 !important; }\n  .ms-xl-1 {\n    margin-left: 0.25rem !important; }\n  .ms-xl-2 {\n    margin-left: 0.5rem !important; }\n  .ms-xl-3 {\n    margin-left: 1rem !important; }\n  .ms-xl-4 {\n    margin-left: 1.5rem !important; }\n  .ms-xl-5 {\n    margin-left: 3rem !important; }\n  .ms-xl-6 {\n    margin-left: 4rem !important; }\n  .ms-xl-7 {\n    margin-left: 6rem !important; }\n  .ms-xl-8 {\n    margin-left: 8rem !important; }\n  .ms-xl-9 {\n    margin-left: 10rem !important; }\n  .ms-xl-10 {\n    margin-left: 12rem !important; }\n  .ms-xl-11 {\n    margin-left: 14rem !important; }\n  .ms-xl-12 {\n    margin-left: 16rem !important; }\n  .ms-xl-auto {\n    margin-left: auto !important; }\n  .m-xl-n1 {\n    margin: -0.25rem !important; }\n  .m-xl-n2 {\n    margin: -0.5rem !important; }\n  .m-xl-n3 {\n    margin: -1rem !important; }\n  .m-xl-n4 {\n    margin: -1.5rem !important; }\n  .m-xl-n5 {\n    margin: -3rem !important; }\n  .m-xl-n6 {\n    margin: -4rem !important; }\n  .m-xl-n7 {\n    margin: -6rem !important; }\n  .m-xl-n8 {\n    margin: -8rem !important; }\n  .m-xl-n9 {\n    margin: -10rem !important; }\n  .m-xl-n10 {\n    margin: -12rem !important; }\n  .m-xl-n11 {\n    margin: -14rem !important; }\n  .m-xl-n12 {\n    margin: -16rem !important; }\n  .mx-xl-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-xl-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-xl-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-xl-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-xl-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-xl-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-xl-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-xl-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-xl-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-xl-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-xl-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-xl-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-xl-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-xl-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-xl-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-xl-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-xl-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-xl-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-xl-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-xl-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-xl-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-xl-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-xl-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-xl-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-xl-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-xl-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-xl-n3 {\n    margin-top: -1rem !important; }\n  .mt-xl-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-xl-n5 {\n    margin-top: -3rem !important; }\n  .mt-xl-n6 {\n    margin-top: -4rem !important; }\n  .mt-xl-n7 {\n    margin-top: -6rem !important; }\n  .mt-xl-n8 {\n    margin-top: -8rem !important; }\n  .mt-xl-n9 {\n    margin-top: -10rem !important; }\n  .mt-xl-n10 {\n    margin-top: -12rem !important; }\n  .mt-xl-n11 {\n    margin-top: -14rem !important; }\n  .mt-xl-n12 {\n    margin-top: -16rem !important; }\n  .me-xl-n1 {\n    margin-right: -0.25rem !important; }\n  .me-xl-n2 {\n    margin-right: -0.5rem !important; }\n  .me-xl-n3 {\n    margin-right: -1rem !important; }\n  .me-xl-n4 {\n    margin-right: -1.5rem !important; }\n  .me-xl-n5 {\n    margin-right: -3rem !important; }\n  .me-xl-n6 {\n    margin-right: -4rem !important; }\n  .me-xl-n7 {\n    margin-right: -6rem !important; }\n  .me-xl-n8 {\n    margin-right: -8rem !important; }\n  .me-xl-n9 {\n    margin-right: -10rem !important; }\n  .me-xl-n10 {\n    margin-right: -12rem !important; }\n  .me-xl-n11 {\n    margin-right: -14rem !important; }\n  .me-xl-n12 {\n    margin-right: -16rem !important; }\n  .mb-xl-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-xl-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-xl-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-xl-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-xl-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-xl-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-xl-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-xl-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-xl-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-xl-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-xl-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-xl-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-xl-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-xl-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-xl-n3 {\n    margin-left: -1rem !important; }\n  .ms-xl-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-xl-n5 {\n    margin-left: -3rem !important; }\n  .ms-xl-n6 {\n    margin-left: -4rem !important; }\n  .ms-xl-n7 {\n    margin-left: -6rem !important; }\n  .ms-xl-n8 {\n    margin-left: -8rem !important; }\n  .ms-xl-n9 {\n    margin-left: -10rem !important; }\n  .ms-xl-n10 {\n    margin-left: -12rem !important; }\n  .ms-xl-n11 {\n    margin-left: -14rem !important; }\n  .ms-xl-n12 {\n    margin-left: -16rem !important; }\n  .p-xl-0 {\n    padding: 0 !important; }\n  .p-xl-1 {\n    padding: 0.25rem !important; }\n  .p-xl-2 {\n    padding: 0.5rem !important; }\n  .p-xl-3 {\n    padding: 1rem !important; }\n  .p-xl-4 {\n    padding: 1.5rem !important; }\n  .p-xl-5 {\n    padding: 3rem !important; }\n  .p-xl-6 {\n    padding: 4rem !important; }\n  .p-xl-7 {\n    padding: 6rem !important; }\n  .p-xl-8 {\n    padding: 8rem !important; }\n  .p-xl-9 {\n    padding: 10rem !important; }\n  .p-xl-10 {\n    padding: 12rem !important; }\n  .p-xl-11 {\n    padding: 14rem !important; }\n  .p-xl-12 {\n    padding: 16rem !important; }\n  .px-xl-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-xl-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-xl-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-xl-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-xl-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-xl-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-xl-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-xl-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-xl-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-xl-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-xl-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-xl-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-xl-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-xl-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-xl-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-xl-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-xl-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-xl-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-xl-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-xl-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-xl-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-xl-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-xl-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-xl-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-xl-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-xl-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-xl-0 {\n    padding-top: 0 !important; }\n  .pt-xl-1 {\n    padding-top: 0.25rem !important; }\n  .pt-xl-2 {\n    padding-top: 0.5rem !important; }\n  .pt-xl-3 {\n    padding-top: 1rem !important; }\n  .pt-xl-4 {\n    padding-top: 1.5rem !important; }\n  .pt-xl-5 {\n    padding-top: 3rem !important; }\n  .pt-xl-6 {\n    padding-top: 4rem !important; }\n  .pt-xl-7 {\n    padding-top: 6rem !important; }\n  .pt-xl-8 {\n    padding-top: 8rem !important; }\n  .pt-xl-9 {\n    padding-top: 10rem !important; }\n  .pt-xl-10 {\n    padding-top: 12rem !important; }\n  .pt-xl-11 {\n    padding-top: 14rem !important; }\n  .pt-xl-12 {\n    padding-top: 16rem !important; }\n  .pe-xl-0 {\n    padding-right: 0 !important; }\n  .pe-xl-1 {\n    padding-right: 0.25rem !important; }\n  .pe-xl-2 {\n    padding-right: 0.5rem !important; }\n  .pe-xl-3 {\n    padding-right: 1rem !important; }\n  .pe-xl-4 {\n    padding-right: 1.5rem !important; }\n  .pe-xl-5 {\n    padding-right: 3rem !important; }\n  .pe-xl-6 {\n    padding-right: 4rem !important; }\n  .pe-xl-7 {\n    padding-right: 6rem !important; }\n  .pe-xl-8 {\n    padding-right: 8rem !important; }\n  .pe-xl-9 {\n    padding-right: 10rem !important; }\n  .pe-xl-10 {\n    padding-right: 12rem !important; }\n  .pe-xl-11 {\n    padding-right: 14rem !important; }\n  .pe-xl-12 {\n    padding-right: 16rem !important; }\n  .pb-xl-0 {\n    padding-bottom: 0 !important; }\n  .pb-xl-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-xl-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-xl-3 {\n    padding-bottom: 1rem !important; }\n  .pb-xl-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-xl-5 {\n    padding-bottom: 3rem !important; }\n  .pb-xl-6 {\n    padding-bottom: 4rem !important; }\n  .pb-xl-7 {\n    padding-bottom: 6rem !important; }\n  .pb-xl-8 {\n    padding-bottom: 8rem !important; }\n  .pb-xl-9 {\n    padding-bottom: 10rem !important; }\n  .pb-xl-10 {\n    padding-bottom: 12rem !important; }\n  .pb-xl-11 {\n    padding-bottom: 14rem !important; }\n  .pb-xl-12 {\n    padding-bottom: 16rem !important; }\n  .ps-xl-0 {\n    padding-left: 0 !important; }\n  .ps-xl-1 {\n    padding-left: 0.25rem !important; }\n  .ps-xl-2 {\n    padding-left: 0.5rem !important; }\n  .ps-xl-3 {\n    padding-left: 1rem !important; }\n  .ps-xl-4 {\n    padding-left: 1.5rem !important; }\n  .ps-xl-5 {\n    padding-left: 3rem !important; }\n  .ps-xl-6 {\n    padding-left: 4rem !important; }\n  .ps-xl-7 {\n    padding-left: 6rem !important; }\n  .ps-xl-8 {\n    padding-left: 8rem !important; }\n  .ps-xl-9 {\n    padding-left: 10rem !important; }\n  .ps-xl-10 {\n    padding-left: 12rem !important; }\n  .ps-xl-11 {\n    padding-left: 14rem !important; }\n  .ps-xl-12 {\n    padding-left: 16rem !important; }\n  .text-xl-start {\n    text-align: left !important; }\n  .text-xl-end {\n    text-align: right !important; }\n  .text-xl-center {\n    text-align: center !important; }\n  .transform-scale-xl-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-xl-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-xl-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-xl-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-xl-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-xl-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-xl {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xl-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-xl-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-xl-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xl-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-xl-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-xl-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-xl-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-xl-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-xl {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xl-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-xl-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-xl-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xl-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-xl-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-xl-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-xl-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-xl-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-xl {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xl-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-xl-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-xl-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xl-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-xl-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-xl-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-xl-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-xl-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-xl {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xl-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-xl-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-xl-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xl-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-xl-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-xl-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-xl-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-xl-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 1400px) {\n  .float-xxl-start {\n    float: left !important; }\n  .float-xxl-end {\n    float: right !important; }\n  .float-xxl-none {\n    float: none !important; }\n  .d-xxl-inline {\n    display: inline !important; }\n  .d-xxl-inline-block {\n    display: inline-block !important; }\n  .d-xxl-block {\n    display: block !important; }\n  .d-xxl-grid {\n    display: grid !important; }\n  .d-xxl-table {\n    display: table !important; }\n  .d-xxl-table-row {\n    display: table-row !important; }\n  .d-xxl-table-cell {\n    display: table-cell !important; }\n  .d-xxl-flex {\n    display: flex !important; }\n  .d-xxl-inline-flex {\n    display: inline-flex !important; }\n  .d-xxl-none {\n    display: none !important; }\n  .border-top-xxl {\n    border-top: 1px solid #dee2e6 !important; }\n  .border-top-xxl-0 {\n    border-top: 0 !important; }\n  .border-end-xxl {\n    border-right: 1px solid #dee2e6 !important; }\n  .border-end-xxl-0 {\n    border-right: 0 !important; }\n  .border-bottom-xxl {\n    border-bottom: 1px solid #dee2e6 !important; }\n  .border-bottom-xxl-0 {\n    border-bottom: 0 !important; }\n  .border-start-xxl {\n    border-left: 1px solid #dee2e6 !important; }\n  .border-start-xxl-0 {\n    border-left: 0 !important; }\n  .w-xxl-0 {\n    width: 0% !important; }\n  .w-xxl-1 {\n    width: 1% !important; }\n  .w-xxl-2 {\n    width: 2% !important; }\n  .w-xxl-3 {\n    width: 3% !important; }\n  .w-xxl-4 {\n    width: 4% !important; }\n  .w-xxl-5 {\n    width: 5% !important; }\n  .w-xxl-6 {\n    width: 6% !important; }\n  .w-xxl-7 {\n    width: 7% !important; }\n  .w-xxl-8 {\n    width: 8% !important; }\n  .w-xxl-9 {\n    width: 9% !important; }\n  .w-xxl-10 {\n    width: 10% !important; }\n  .w-xxl-15 {\n    width: 15% !important; }\n  .w-xxl-20 {\n    width: 20% !important; }\n  .w-xxl-25 {\n    width: 25% !important; }\n  .w-xxl-30 {\n    width: 30% !important; }\n  .w-xxl-35 {\n    width: 35% !important; }\n  .w-xxl-40 {\n    width: 40% !important; }\n  .w-xxl-45 {\n    width: 45% !important; }\n  .w-xxl-50 {\n    width: 50% !important; }\n  .w-xxl-55 {\n    width: 55% !important; }\n  .w-xxl-60 {\n    width: 60% !important; }\n  .w-xxl-65 {\n    width: 65% !important; }\n  .w-xxl-70 {\n    width: 70% !important; }\n  .w-xxl-75 {\n    width: 75% !important; }\n  .w-xxl-80 {\n    width: 80% !important; }\n  .w-xxl-85 {\n    width: 85% !important; }\n  .w-xxl-90 {\n    width: 90% !important; }\n  .w-xxl-95 {\n    width: 95% !important; }\n  .w-xxl-100 {\n    width: 100% !important; }\n  .w-xxl-auto {\n    width: auto !important; }\n  .flex-xxl-fill {\n    flex: 1 1 auto !important; }\n  .flex-xxl-row {\n    flex-direction: row !important; }\n  .flex-xxl-column {\n    flex-direction: column !important; }\n  .flex-xxl-row-reverse {\n    flex-direction: row-reverse !important; }\n  .flex-xxl-column-reverse {\n    flex-direction: column-reverse !important; }\n  .flex-xxl-grow-0 {\n    flex-grow: 0 !important; }\n  .flex-xxl-grow-1 {\n    flex-grow: 1 !important; }\n  .flex-xxl-shrink-0 {\n    flex-shrink: 0 !important; }\n  .flex-xxl-shrink-1 {\n    flex-shrink: 1 !important; }\n  .flex-xxl-wrap {\n    flex-wrap: wrap !important; }\n  .flex-xxl-nowrap {\n    flex-wrap: nowrap !important; }\n  .flex-xxl-wrap-reverse {\n    flex-wrap: wrap-reverse !important; }\n  .gap-xxl-0 {\n    gap: 0 !important; }\n  .gap-xxl-1 {\n    gap: 0.25rem !important; }\n  .gap-xxl-2 {\n    gap: 0.5rem !important; }\n  .gap-xxl-3 {\n    gap: 1rem !important; }\n  .gap-xxl-4 {\n    gap: 1.5rem !important; }\n  .gap-xxl-5 {\n    gap: 3rem !important; }\n  .gap-xxl-6 {\n    gap: 4rem !important; }\n  .gap-xxl-7 {\n    gap: 6rem !important; }\n  .gap-xxl-8 {\n    gap: 8rem !important; }\n  .gap-xxl-9 {\n    gap: 10rem !important; }\n  .gap-xxl-10 {\n    gap: 12rem !important; }\n  .gap-xxl-11 {\n    gap: 14rem !important; }\n  .gap-xxl-12 {\n    gap: 16rem !important; }\n  .justify-content-xxl-start {\n    justify-content: flex-start !important; }\n  .justify-content-xxl-end {\n    justify-content: flex-end !important; }\n  .justify-content-xxl-center {\n    justify-content: center !important; }\n  .justify-content-xxl-between {\n    justify-content: space-between !important; }\n  .justify-content-xxl-around {\n    justify-content: space-around !important; }\n  .justify-content-xxl-evenly {\n    justify-content: space-evenly !important; }\n  .align-items-xxl-start {\n    align-items: flex-start !important; }\n  .align-items-xxl-end {\n    align-items: flex-end !important; }\n  .align-items-xxl-center {\n    align-items: center !important; }\n  .align-items-xxl-baseline {\n    align-items: baseline !important; }\n  .align-items-xxl-stretch {\n    align-items: stretch !important; }\n  .align-content-xxl-start {\n    align-content: flex-start !important; }\n  .align-content-xxl-end {\n    align-content: flex-end !important; }\n  .align-content-xxl-center {\n    align-content: center !important; }\n  .align-content-xxl-between {\n    align-content: space-between !important; }\n  .align-content-xxl-around {\n    align-content: space-around !important; }\n  .align-content-xxl-stretch {\n    align-content: stretch !important; }\n  .align-self-xxl-auto {\n    align-self: auto !important; }\n  .align-self-xxl-start {\n    align-self: flex-start !important; }\n  .align-self-xxl-end {\n    align-self: flex-end !important; }\n  .align-self-xxl-center {\n    align-self: center !important; }\n  .align-self-xxl-baseline {\n    align-self: baseline !important; }\n  .align-self-xxl-stretch {\n    align-self: stretch !important; }\n  .order-xxl-first {\n    order: -1 !important; }\n  .order-xxl-0 {\n    order: 0 !important; }\n  .order-xxl-1 {\n    order: 1 !important; }\n  .order-xxl-2 {\n    order: 2 !important; }\n  .order-xxl-3 {\n    order: 3 !important; }\n  .order-xxl-4 {\n    order: 4 !important; }\n  .order-xxl-5 {\n    order: 5 !important; }\n  .order-xxl-last {\n    order: 6 !important; }\n  .m-xxl-0 {\n    margin: 0 !important; }\n  .m-xxl-1 {\n    margin: 0.25rem !important; }\n  .m-xxl-2 {\n    margin: 0.5rem !important; }\n  .m-xxl-3 {\n    margin: 1rem !important; }\n  .m-xxl-4 {\n    margin: 1.5rem !important; }\n  .m-xxl-5 {\n    margin: 3rem !important; }\n  .m-xxl-6 {\n    margin: 4rem !important; }\n  .m-xxl-7 {\n    margin: 6rem !important; }\n  .m-xxl-8 {\n    margin: 8rem !important; }\n  .m-xxl-9 {\n    margin: 10rem !important; }\n  .m-xxl-10 {\n    margin: 12rem !important; }\n  .m-xxl-11 {\n    margin: 14rem !important; }\n  .m-xxl-12 {\n    margin: 16rem !important; }\n  .m-xxl-auto {\n    margin: auto !important; }\n  .mx-xxl-0 {\n    margin-right: 0 !important;\n    margin-left: 0 !important; }\n  .mx-xxl-1 {\n    margin-right: 0.25rem !important;\n    margin-left: 0.25rem !important; }\n  .mx-xxl-2 {\n    margin-right: 0.5rem !important;\n    margin-left: 0.5rem !important; }\n  .mx-xxl-3 {\n    margin-right: 1rem !important;\n    margin-left: 1rem !important; }\n  .mx-xxl-4 {\n    margin-right: 1.5rem !important;\n    margin-left: 1.5rem !important; }\n  .mx-xxl-5 {\n    margin-right: 3rem !important;\n    margin-left: 3rem !important; }\n  .mx-xxl-6 {\n    margin-right: 4rem !important;\n    margin-left: 4rem !important; }\n  .mx-xxl-7 {\n    margin-right: 6rem !important;\n    margin-left: 6rem !important; }\n  .mx-xxl-8 {\n    margin-right: 8rem !important;\n    margin-left: 8rem !important; }\n  .mx-xxl-9 {\n    margin-right: 10rem !important;\n    margin-left: 10rem !important; }\n  .mx-xxl-10 {\n    margin-right: 12rem !important;\n    margin-left: 12rem !important; }\n  .mx-xxl-11 {\n    margin-right: 14rem !important;\n    margin-left: 14rem !important; }\n  .mx-xxl-12 {\n    margin-right: 16rem !important;\n    margin-left: 16rem !important; }\n  .mx-xxl-auto {\n    margin-right: auto !important;\n    margin-left: auto !important; }\n  .my-xxl-0 {\n    margin-top: 0 !important;\n    margin-bottom: 0 !important; }\n  .my-xxl-1 {\n    margin-top: 0.25rem !important;\n    margin-bottom: 0.25rem !important; }\n  .my-xxl-2 {\n    margin-top: 0.5rem !important;\n    margin-bottom: 0.5rem !important; }\n  .my-xxl-3 {\n    margin-top: 1rem !important;\n    margin-bottom: 1rem !important; }\n  .my-xxl-4 {\n    margin-top: 1.5rem !important;\n    margin-bottom: 1.5rem !important; }\n  .my-xxl-5 {\n    margin-top: 3rem !important;\n    margin-bottom: 3rem !important; }\n  .my-xxl-6 {\n    margin-top: 4rem !important;\n    margin-bottom: 4rem !important; }\n  .my-xxl-7 {\n    margin-top: 6rem !important;\n    margin-bottom: 6rem !important; }\n  .my-xxl-8 {\n    margin-top: 8rem !important;\n    margin-bottom: 8rem !important; }\n  .my-xxl-9 {\n    margin-top: 10rem !important;\n    margin-bottom: 10rem !important; }\n  .my-xxl-10 {\n    margin-top: 12rem !important;\n    margin-bottom: 12rem !important; }\n  .my-xxl-11 {\n    margin-top: 14rem !important;\n    margin-bottom: 14rem !important; }\n  .my-xxl-12 {\n    margin-top: 16rem !important;\n    margin-bottom: 16rem !important; }\n  .my-xxl-auto {\n    margin-top: auto !important;\n    margin-bottom: auto !important; }\n  .mt-xxl-0 {\n    margin-top: 0 !important; }\n  .mt-xxl-1 {\n    margin-top: 0.25rem !important; }\n  .mt-xxl-2 {\n    margin-top: 0.5rem !important; }\n  .mt-xxl-3 {\n    margin-top: 1rem !important; }\n  .mt-xxl-4 {\n    margin-top: 1.5rem !important; }\n  .mt-xxl-5 {\n    margin-top: 3rem !important; }\n  .mt-xxl-6 {\n    margin-top: 4rem !important; }\n  .mt-xxl-7 {\n    margin-top: 6rem !important; }\n  .mt-xxl-8 {\n    margin-top: 8rem !important; }\n  .mt-xxl-9 {\n    margin-top: 10rem !important; }\n  .mt-xxl-10 {\n    margin-top: 12rem !important; }\n  .mt-xxl-11 {\n    margin-top: 14rem !important; }\n  .mt-xxl-12 {\n    margin-top: 16rem !important; }\n  .mt-xxl-auto {\n    margin-top: auto !important; }\n  .me-xxl-0 {\n    margin-right: 0 !important; }\n  .me-xxl-1 {\n    margin-right: 0.25rem !important; }\n  .me-xxl-2 {\n    margin-right: 0.5rem !important; }\n  .me-xxl-3 {\n    margin-right: 1rem !important; }\n  .me-xxl-4 {\n    margin-right: 1.5rem !important; }\n  .me-xxl-5 {\n    margin-right: 3rem !important; }\n  .me-xxl-6 {\n    margin-right: 4rem !important; }\n  .me-xxl-7 {\n    margin-right: 6rem !important; }\n  .me-xxl-8 {\n    margin-right: 8rem !important; }\n  .me-xxl-9 {\n    margin-right: 10rem !important; }\n  .me-xxl-10 {\n    margin-right: 12rem !important; }\n  .me-xxl-11 {\n    margin-right: 14rem !important; }\n  .me-xxl-12 {\n    margin-right: 16rem !important; }\n  .me-xxl-auto {\n    margin-right: auto !important; }\n  .mb-xxl-0 {\n    margin-bottom: 0 !important; }\n  .mb-xxl-1 {\n    margin-bottom: 0.25rem !important; }\n  .mb-xxl-2 {\n    margin-bottom: 0.5rem !important; }\n  .mb-xxl-3 {\n    margin-bottom: 1rem !important; }\n  .mb-xxl-4 {\n    margin-bottom: 1.5rem !important; }\n  .mb-xxl-5 {\n    margin-bottom: 3rem !important; }\n  .mb-xxl-6 {\n    margin-bottom: 4rem !important; }\n  .mb-xxl-7 {\n    margin-bottom: 6rem !important; }\n  .mb-xxl-8 {\n    margin-bottom: 8rem !important; }\n  .mb-xxl-9 {\n    margin-bottom: 10rem !important; }\n  .mb-xxl-10 {\n    margin-bottom: 12rem !important; }\n  .mb-xxl-11 {\n    margin-bottom: 14rem !important; }\n  .mb-xxl-12 {\n    margin-bottom: 16rem !important; }\n  .mb-xxl-auto {\n    margin-bottom: auto !important; }\n  .ms-xxl-0 {\n    margin-left: 0 !important; }\n  .ms-xxl-1 {\n    margin-left: 0.25rem !important; }\n  .ms-xxl-2 {\n    margin-left: 0.5rem !important; }\n  .ms-xxl-3 {\n    margin-left: 1rem !important; }\n  .ms-xxl-4 {\n    margin-left: 1.5rem !important; }\n  .ms-xxl-5 {\n    margin-left: 3rem !important; }\n  .ms-xxl-6 {\n    margin-left: 4rem !important; }\n  .ms-xxl-7 {\n    margin-left: 6rem !important; }\n  .ms-xxl-8 {\n    margin-left: 8rem !important; }\n  .ms-xxl-9 {\n    margin-left: 10rem !important; }\n  .ms-xxl-10 {\n    margin-left: 12rem !important; }\n  .ms-xxl-11 {\n    margin-left: 14rem !important; }\n  .ms-xxl-12 {\n    margin-left: 16rem !important; }\n  .ms-xxl-auto {\n    margin-left: auto !important; }\n  .m-xxl-n1 {\n    margin: -0.25rem !important; }\n  .m-xxl-n2 {\n    margin: -0.5rem !important; }\n  .m-xxl-n3 {\n    margin: -1rem !important; }\n  .m-xxl-n4 {\n    margin: -1.5rem !important; }\n  .m-xxl-n5 {\n    margin: -3rem !important; }\n  .m-xxl-n6 {\n    margin: -4rem !important; }\n  .m-xxl-n7 {\n    margin: -6rem !important; }\n  .m-xxl-n8 {\n    margin: -8rem !important; }\n  .m-xxl-n9 {\n    margin: -10rem !important; }\n  .m-xxl-n10 {\n    margin: -12rem !important; }\n  .m-xxl-n11 {\n    margin: -14rem !important; }\n  .m-xxl-n12 {\n    margin: -16rem !important; }\n  .mx-xxl-n1 {\n    margin-right: -0.25rem !important;\n    margin-left: -0.25rem !important; }\n  .mx-xxl-n2 {\n    margin-right: -0.5rem !important;\n    margin-left: -0.5rem !important; }\n  .mx-xxl-n3 {\n    margin-right: -1rem !important;\n    margin-left: -1rem !important; }\n  .mx-xxl-n4 {\n    margin-right: -1.5rem !important;\n    margin-left: -1.5rem !important; }\n  .mx-xxl-n5 {\n    margin-right: -3rem !important;\n    margin-left: -3rem !important; }\n  .mx-xxl-n6 {\n    margin-right: -4rem !important;\n    margin-left: -4rem !important; }\n  .mx-xxl-n7 {\n    margin-right: -6rem !important;\n    margin-left: -6rem !important; }\n  .mx-xxl-n8 {\n    margin-right: -8rem !important;\n    margin-left: -8rem !important; }\n  .mx-xxl-n9 {\n    margin-right: -10rem !important;\n    margin-left: -10rem !important; }\n  .mx-xxl-n10 {\n    margin-right: -12rem !important;\n    margin-left: -12rem !important; }\n  .mx-xxl-n11 {\n    margin-right: -14rem !important;\n    margin-left: -14rem !important; }\n  .mx-xxl-n12 {\n    margin-right: -16rem !important;\n    margin-left: -16rem !important; }\n  .my-xxl-n1 {\n    margin-top: -0.25rem !important;\n    margin-bottom: -0.25rem !important; }\n  .my-xxl-n2 {\n    margin-top: -0.5rem !important;\n    margin-bottom: -0.5rem !important; }\n  .my-xxl-n3 {\n    margin-top: -1rem !important;\n    margin-bottom: -1rem !important; }\n  .my-xxl-n4 {\n    margin-top: -1.5rem !important;\n    margin-bottom: -1.5rem !important; }\n  .my-xxl-n5 {\n    margin-top: -3rem !important;\n    margin-bottom: -3rem !important; }\n  .my-xxl-n6 {\n    margin-top: -4rem !important;\n    margin-bottom: -4rem !important; }\n  .my-xxl-n7 {\n    margin-top: -6rem !important;\n    margin-bottom: -6rem !important; }\n  .my-xxl-n8 {\n    margin-top: -8rem !important;\n    margin-bottom: -8rem !important; }\n  .my-xxl-n9 {\n    margin-top: -10rem !important;\n    margin-bottom: -10rem !important; }\n  .my-xxl-n10 {\n    margin-top: -12rem !important;\n    margin-bottom: -12rem !important; }\n  .my-xxl-n11 {\n    margin-top: -14rem !important;\n    margin-bottom: -14rem !important; }\n  .my-xxl-n12 {\n    margin-top: -16rem !important;\n    margin-bottom: -16rem !important; }\n  .mt-xxl-n1 {\n    margin-top: -0.25rem !important; }\n  .mt-xxl-n2 {\n    margin-top: -0.5rem !important; }\n  .mt-xxl-n3 {\n    margin-top: -1rem !important; }\n  .mt-xxl-n4 {\n    margin-top: -1.5rem !important; }\n  .mt-xxl-n5 {\n    margin-top: -3rem !important; }\n  .mt-xxl-n6 {\n    margin-top: -4rem !important; }\n  .mt-xxl-n7 {\n    margin-top: -6rem !important; }\n  .mt-xxl-n8 {\n    margin-top: -8rem !important; }\n  .mt-xxl-n9 {\n    margin-top: -10rem !important; }\n  .mt-xxl-n10 {\n    margin-top: -12rem !important; }\n  .mt-xxl-n11 {\n    margin-top: -14rem !important; }\n  .mt-xxl-n12 {\n    margin-top: -16rem !important; }\n  .me-xxl-n1 {\n    margin-right: -0.25rem !important; }\n  .me-xxl-n2 {\n    margin-right: -0.5rem !important; }\n  .me-xxl-n3 {\n    margin-right: -1rem !important; }\n  .me-xxl-n4 {\n    margin-right: -1.5rem !important; }\n  .me-xxl-n5 {\n    margin-right: -3rem !important; }\n  .me-xxl-n6 {\n    margin-right: -4rem !important; }\n  .me-xxl-n7 {\n    margin-right: -6rem !important; }\n  .me-xxl-n8 {\n    margin-right: -8rem !important; }\n  .me-xxl-n9 {\n    margin-right: -10rem !important; }\n  .me-xxl-n10 {\n    margin-right: -12rem !important; }\n  .me-xxl-n11 {\n    margin-right: -14rem !important; }\n  .me-xxl-n12 {\n    margin-right: -16rem !important; }\n  .mb-xxl-n1 {\n    margin-bottom: -0.25rem !important; }\n  .mb-xxl-n2 {\n    margin-bottom: -0.5rem !important; }\n  .mb-xxl-n3 {\n    margin-bottom: -1rem !important; }\n  .mb-xxl-n4 {\n    margin-bottom: -1.5rem !important; }\n  .mb-xxl-n5 {\n    margin-bottom: -3rem !important; }\n  .mb-xxl-n6 {\n    margin-bottom: -4rem !important; }\n  .mb-xxl-n7 {\n    margin-bottom: -6rem !important; }\n  .mb-xxl-n8 {\n    margin-bottom: -8rem !important; }\n  .mb-xxl-n9 {\n    margin-bottom: -10rem !important; }\n  .mb-xxl-n10 {\n    margin-bottom: -12rem !important; }\n  .mb-xxl-n11 {\n    margin-bottom: -14rem !important; }\n  .mb-xxl-n12 {\n    margin-bottom: -16rem !important; }\n  .ms-xxl-n1 {\n    margin-left: -0.25rem !important; }\n  .ms-xxl-n2 {\n    margin-left: -0.5rem !important; }\n  .ms-xxl-n3 {\n    margin-left: -1rem !important; }\n  .ms-xxl-n4 {\n    margin-left: -1.5rem !important; }\n  .ms-xxl-n5 {\n    margin-left: -3rem !important; }\n  .ms-xxl-n6 {\n    margin-left: -4rem !important; }\n  .ms-xxl-n7 {\n    margin-left: -6rem !important; }\n  .ms-xxl-n8 {\n    margin-left: -8rem !important; }\n  .ms-xxl-n9 {\n    margin-left: -10rem !important; }\n  .ms-xxl-n10 {\n    margin-left: -12rem !important; }\n  .ms-xxl-n11 {\n    margin-left: -14rem !important; }\n  .ms-xxl-n12 {\n    margin-left: -16rem !important; }\n  .p-xxl-0 {\n    padding: 0 !important; }\n  .p-xxl-1 {\n    padding: 0.25rem !important; }\n  .p-xxl-2 {\n    padding: 0.5rem !important; }\n  .p-xxl-3 {\n    padding: 1rem !important; }\n  .p-xxl-4 {\n    padding: 1.5rem !important; }\n  .p-xxl-5 {\n    padding: 3rem !important; }\n  .p-xxl-6 {\n    padding: 4rem !important; }\n  .p-xxl-7 {\n    padding: 6rem !important; }\n  .p-xxl-8 {\n    padding: 8rem !important; }\n  .p-xxl-9 {\n    padding: 10rem !important; }\n  .p-xxl-10 {\n    padding: 12rem !important; }\n  .p-xxl-11 {\n    padding: 14rem !important; }\n  .p-xxl-12 {\n    padding: 16rem !important; }\n  .px-xxl-0 {\n    padding-right: 0 !important;\n    padding-left: 0 !important; }\n  .px-xxl-1 {\n    padding-right: 0.25rem !important;\n    padding-left: 0.25rem !important; }\n  .px-xxl-2 {\n    padding-right: 0.5rem !important;\n    padding-left: 0.5rem !important; }\n  .px-xxl-3 {\n    padding-right: 1rem !important;\n    padding-left: 1rem !important; }\n  .px-xxl-4 {\n    padding-right: 1.5rem !important;\n    padding-left: 1.5rem !important; }\n  .px-xxl-5 {\n    padding-right: 3rem !important;\n    padding-left: 3rem !important; }\n  .px-xxl-6 {\n    padding-right: 4rem !important;\n    padding-left: 4rem !important; }\n  .px-xxl-7 {\n    padding-right: 6rem !important;\n    padding-left: 6rem !important; }\n  .px-xxl-8 {\n    padding-right: 8rem !important;\n    padding-left: 8rem !important; }\n  .px-xxl-9 {\n    padding-right: 10rem !important;\n    padding-left: 10rem !important; }\n  .px-xxl-10 {\n    padding-right: 12rem !important;\n    padding-left: 12rem !important; }\n  .px-xxl-11 {\n    padding-right: 14rem !important;\n    padding-left: 14rem !important; }\n  .px-xxl-12 {\n    padding-right: 16rem !important;\n    padding-left: 16rem !important; }\n  .py-xxl-0 {\n    padding-top: 0 !important;\n    padding-bottom: 0 !important; }\n  .py-xxl-1 {\n    padding-top: 0.25rem !important;\n    padding-bottom: 0.25rem !important; }\n  .py-xxl-2 {\n    padding-top: 0.5rem !important;\n    padding-bottom: 0.5rem !important; }\n  .py-xxl-3 {\n    padding-top: 1rem !important;\n    padding-bottom: 1rem !important; }\n  .py-xxl-4 {\n    padding-top: 1.5rem !important;\n    padding-bottom: 1.5rem !important; }\n  .py-xxl-5 {\n    padding-top: 3rem !important;\n    padding-bottom: 3rem !important; }\n  .py-xxl-6 {\n    padding-top: 4rem !important;\n    padding-bottom: 4rem !important; }\n  .py-xxl-7 {\n    padding-top: 6rem !important;\n    padding-bottom: 6rem !important; }\n  .py-xxl-8 {\n    padding-top: 8rem !important;\n    padding-bottom: 8rem !important; }\n  .py-xxl-9 {\n    padding-top: 10rem !important;\n    padding-bottom: 10rem !important; }\n  .py-xxl-10 {\n    padding-top: 12rem !important;\n    padding-bottom: 12rem !important; }\n  .py-xxl-11 {\n    padding-top: 14rem !important;\n    padding-bottom: 14rem !important; }\n  .py-xxl-12 {\n    padding-top: 16rem !important;\n    padding-bottom: 16rem !important; }\n  .pt-xxl-0 {\n    padding-top: 0 !important; }\n  .pt-xxl-1 {\n    padding-top: 0.25rem !important; }\n  .pt-xxl-2 {\n    padding-top: 0.5rem !important; }\n  .pt-xxl-3 {\n    padding-top: 1rem !important; }\n  .pt-xxl-4 {\n    padding-top: 1.5rem !important; }\n  .pt-xxl-5 {\n    padding-top: 3rem !important; }\n  .pt-xxl-6 {\n    padding-top: 4rem !important; }\n  .pt-xxl-7 {\n    padding-top: 6rem !important; }\n  .pt-xxl-8 {\n    padding-top: 8rem !important; }\n  .pt-xxl-9 {\n    padding-top: 10rem !important; }\n  .pt-xxl-10 {\n    padding-top: 12rem !important; }\n  .pt-xxl-11 {\n    padding-top: 14rem !important; }\n  .pt-xxl-12 {\n    padding-top: 16rem !important; }\n  .pe-xxl-0 {\n    padding-right: 0 !important; }\n  .pe-xxl-1 {\n    padding-right: 0.25rem !important; }\n  .pe-xxl-2 {\n    padding-right: 0.5rem !important; }\n  .pe-xxl-3 {\n    padding-right: 1rem !important; }\n  .pe-xxl-4 {\n    padding-right: 1.5rem !important; }\n  .pe-xxl-5 {\n    padding-right: 3rem !important; }\n  .pe-xxl-6 {\n    padding-right: 4rem !important; }\n  .pe-xxl-7 {\n    padding-right: 6rem !important; }\n  .pe-xxl-8 {\n    padding-right: 8rem !important; }\n  .pe-xxl-9 {\n    padding-right: 10rem !important; }\n  .pe-xxl-10 {\n    padding-right: 12rem !important; }\n  .pe-xxl-11 {\n    padding-right: 14rem !important; }\n  .pe-xxl-12 {\n    padding-right: 16rem !important; }\n  .pb-xxl-0 {\n    padding-bottom: 0 !important; }\n  .pb-xxl-1 {\n    padding-bottom: 0.25rem !important; }\n  .pb-xxl-2 {\n    padding-bottom: 0.5rem !important; }\n  .pb-xxl-3 {\n    padding-bottom: 1rem !important; }\n  .pb-xxl-4 {\n    padding-bottom: 1.5rem !important; }\n  .pb-xxl-5 {\n    padding-bottom: 3rem !important; }\n  .pb-xxl-6 {\n    padding-bottom: 4rem !important; }\n  .pb-xxl-7 {\n    padding-bottom: 6rem !important; }\n  .pb-xxl-8 {\n    padding-bottom: 8rem !important; }\n  .pb-xxl-9 {\n    padding-bottom: 10rem !important; }\n  .pb-xxl-10 {\n    padding-bottom: 12rem !important; }\n  .pb-xxl-11 {\n    padding-bottom: 14rem !important; }\n  .pb-xxl-12 {\n    padding-bottom: 16rem !important; }\n  .ps-xxl-0 {\n    padding-left: 0 !important; }\n  .ps-xxl-1 {\n    padding-left: 0.25rem !important; }\n  .ps-xxl-2 {\n    padding-left: 0.5rem !important; }\n  .ps-xxl-3 {\n    padding-left: 1rem !important; }\n  .ps-xxl-4 {\n    padding-left: 1.5rem !important; }\n  .ps-xxl-5 {\n    padding-left: 3rem !important; }\n  .ps-xxl-6 {\n    padding-left: 4rem !important; }\n  .ps-xxl-7 {\n    padding-left: 6rem !important; }\n  .ps-xxl-8 {\n    padding-left: 8rem !important; }\n  .ps-xxl-9 {\n    padding-left: 10rem !important; }\n  .ps-xxl-10 {\n    padding-left: 12rem !important; }\n  .ps-xxl-11 {\n    padding-left: 14rem !important; }\n  .ps-xxl-12 {\n    padding-left: 16rem !important; }\n  .text-xxl-start {\n    text-align: left !important; }\n  .text-xxl-end {\n    text-align: right !important; }\n  .text-xxl-center {\n    text-align: center !important; }\n  .transform-scale-xxl-5 {\n    transform: scale(0.5) !important; }\n  .transform-scale-xxl-6 {\n    transform: scale(0.6) !important; }\n  .transform-scale-xxl-7 {\n    transform: scale(0.7) !important; }\n  .transform-scale-xxl-8 {\n    transform: scale(0.8) !important; }\n  .transform-scale-xxl-9 {\n    transform: scale(0.9) !important; }\n  .transform-scale-xxl-10 {\n    transform: scale(1) !important; }\n  .border-radius-top-start-xxl {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xxl-0 {\n    border-top-left-radius: 0 !important; }\n  .border-radius-top-start-xxl-sm {\n    border-top-left-radius: 0.125rem !important; }\n  .border-radius-top-start-xxl-md {\n    border-top-left-radius: 0.25rem !important; }\n  .border-radius-top-start-xxl-lg {\n    border-top-left-radius: 0.5rem !important; }\n  .border-radius-top-start-xxl-xl {\n    border-top-left-radius: 0.75rem !important; }\n  .border-radius-top-start-xxl-2xl {\n    border-top-left-radius: 1rem !important; }\n  .border-radius-top-start-xxl-circle {\n    border-top-left-radius: 50% !important; }\n  .border-radius-top-start-xxl-pill {\n    border-top-left-radius: 50rem !important; }\n  .border-radius-top-end-xxl {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xxl-0 {\n    border-top-right-radius: 0 !important; }\n  .border-radius-top-end-xxl-sm {\n    border-top-right-radius: 0.125rem !important; }\n  .border-radius-top-end-xxl-md {\n    border-top-right-radius: 0.25rem !important; }\n  .border-radius-top-end-xxl-lg {\n    border-top-right-radius: 0.5rem !important; }\n  .border-radius-top-end-xxl-xl {\n    border-top-right-radius: 0.75rem !important; }\n  .border-radius-top-end-xxl-2xl {\n    border-top-right-radius: 1rem !important; }\n  .border-radius-top-end-xxl-circle {\n    border-top-right-radius: 50% !important; }\n  .border-radius-top-end-xxl-pill {\n    border-top-right-radius: 50rem !important; }\n  .border-radius-bottom-start-xxl {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xxl-0 {\n    border-bottom-left-radius: 0 !important; }\n  .border-radius-bottom-start-xxl-sm {\n    border-bottom-left-radius: 0.125rem !important; }\n  .border-radius-bottom-start-xxl-md {\n    border-bottom-left-radius: 0.25rem !important; }\n  .border-radius-bottom-start-xxl-lg {\n    border-bottom-left-radius: 0.5rem !important; }\n  .border-radius-bottom-start-xxl-xl {\n    border-bottom-left-radius: 0.75rem !important; }\n  .border-radius-bottom-start-xxl-2xl {\n    border-bottom-left-radius: 1rem !important; }\n  .border-radius-bottom-start-xxl-circle {\n    border-bottom-left-radius: 50% !important; }\n  .border-radius-bottom-start-xxl-pill {\n    border-bottom-left-radius: 50rem !important; }\n  .border-radius-bottom-end-xxl {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xxl-0 {\n    border-bottom-right-radius: 0 !important; }\n  .border-radius-bottom-end-xxl-sm {\n    border-bottom-right-radius: 0.125rem !important; }\n  .border-radius-bottom-end-xxl-md {\n    border-bottom-right-radius: 0.25rem !important; }\n  .border-radius-bottom-end-xxl-lg {\n    border-bottom-right-radius: 0.5rem !important; }\n  .border-radius-bottom-end-xxl-xl {\n    border-bottom-right-radius: 0.75rem !important; }\n  .border-radius-bottom-end-xxl-2xl {\n    border-bottom-right-radius: 1rem !important; }\n  .border-radius-bottom-end-xxl-circle {\n    border-bottom-right-radius: 50% !important; }\n  .border-radius-bottom-end-xxl-pill {\n    border-bottom-right-radius: 50rem !important; } }\n\n@media (min-width: 1200px) {\n  .fs-1 {\n    font-size: 3rem !important; }\n  .fs-2 {\n    font-size: 2.25rem !important; }\n  .fs-3 {\n    font-size: 1.875rem !important; }\n  .fs-4 {\n    font-size: 1.5rem !important; } }\n\n@media print {\n  .d-print-inline {\n    display: inline !important; }\n  .d-print-inline-block {\n    display: inline-block !important; }\n  .d-print-block {\n    display: block !important; }\n  .d-print-grid {\n    display: grid !important; }\n  .d-print-table {\n    display: table !important; }\n  .d-print-table-row {\n    display: table-row !important; }\n  .d-print-table-cell {\n    display: table-cell !important; }\n  .d-print-flex {\n    display: flex !important; }\n  .d-print-inline-flex {\n    display: inline-flex !important; }\n  .d-print-none {\n    display: none !important; } }\n\n/*!\n\n=========================================================\n* Material Dashboard - v3.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n* Licensed under MIT (site.license)\n\n* Coded by www.creative-tim.com\n\n=========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n*/\n.alert-primary {\n  background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n\n.alert-secondary {\n  background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%); }\n\n.alert-success {\n  background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%); }\n\n.alert-info {\n  background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%); }\n\n.alert-warning {\n  background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%); }\n\n.alert-danger {\n  background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%); }\n\n.alert-light {\n  background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%); }\n\n.alert-dark {\n  background-image: linear-gradient(195deg, #42424a 0%, #191919 100%); }\n\n.btn-close:focus {\n  box-shadow: none; }\n\n.alert-dismissible .btn-close {\n  background-image: none; }\n\n.avatar {\n  color: #fff;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1rem;\n  border-radius: 50rem;\n  height: 48px;\n  width: 48px;\n  transition: all .2s ease-in-out; }\n  .avatar img {\n    width: 100%; }\n  .avatar + .avatar-content {\n    display: inline-block;\n    margin-left: 0.75rem; }\n  .avatar.avatar-raised {\n    margin-top: -24px; }\n  .avatar.avatar-scale-up:hover {\n    transform: scale(1.2); }\n\n.active .avatar.avatar-scale-up {\n  transform: scale(1.2); }\n\n.avatar-xxl {\n  width: 110px !important;\n  height: 110px !important; }\n  .avatar-xxl.avatar-raised {\n    margin-top: -55px; }\n\n.avatar-xl {\n  width: 74px !important;\n  height: 74px !important; }\n  .avatar-xl.avatar-raised {\n    margin-top: -37px; }\n\n.avatar-lg {\n  width: 58px !important;\n  height: 58px !important;\n  font-size: 0.875rem; }\n  .avatar-lg.avatar-raised {\n    margin-top: -29px; }\n\n.avatar-sm {\n  width: 36px !important;\n  height: 36px !important;\n  font-size: 0.875rem; }\n  .avatar-sm.avatar-raised {\n    margin-top: -18px; }\n\n.avatar-xs {\n  width: 24px !important;\n  height: 24px !important;\n  font-size: 0.75rem; }\n  .avatar-xs.avatar-raised {\n    margin-top: -12px; }\n\n.avatar-group .avatar {\n  position: relative;\n  z-index: 2;\n  border: 2px solid #fff; }\n  .avatar-group .avatar:hover {\n    z-index: 3; }\n\n.avatar-group .avatar + .avatar {\n  margin-left: -1rem; }\n\n.badge.bg-primary {\n  background: #e91e63; }\n\n.badge.bg-secondary {\n  background: #7b809a; }\n\n.badge.bg-success {\n  background: #4CAF50; }\n\n.badge.bg-info {\n  background: #1A73E8; }\n\n.badge.bg-warning {\n  background: #fb8c00; }\n\n.badge.bg-danger {\n  background: #F44335; }\n\n.badge.bg-light {\n  background: #f0f2f5; }\n\n.badge.bg-dark {\n  background: #344767; }\n\n.badge.bg-white {\n  background: #fff; }\n\n.badge {\n  text-transform: uppercase; }\n\n.btn {\n  margin-bottom: 1rem;\n  letter-spacing: 0;\n  text-transform: uppercase;\n  background-size: 150%;\n  background-position-x: 25%;\n  position: relative;\n  overflow: hidden; }\n  .btn:not([class*=\"btn-outline-\"]) {\n    border: 0; }\n  .btn:active, .btn:active:focus, .btn:active:hover {\n    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07);\n    transform: none;\n    opacity: 0.85; }\n  .btn.bg-white:hover {\n    color: #7b809a; }\n  .btn.btn-link {\n    box-shadow: none;\n    font-weight: 700; }\n    .btn.btn-link:hover, .btn.btn-link:focus {\n      box-shadow: none; }\n  .btn.btn-round {\n    border-radius: 1.875rem; }\n  .btn.btn-icon-only {\n    width: 2.375rem;\n    height: 2.375rem;\n    padding: 0.7rem 0.7rem; }\n  .btn.btn-sm.btn-icon-only, .btn-group-sm > .btn.btn-icon-only {\n    width: 1.5rem;\n    height: 1.5rem;\n    padding: 0.3rem 0.3rem; }\n  .btn.btn-sm i, .btn-group-sm > .btn i {\n    font-size: 0.5rem; }\n  .btn.btn-lg.btn-icon-only, .btn-group-lg > .btn.btn-icon-only {\n    width: 3.25rem;\n    height: 3.25rem;\n    padding: 1rem 1rem; }\n  .btn.btn-lg i, .btn-group-lg > .btn i {\n    font-size: 1.2rem;\n    position: relative;\n    top: 0px; }\n  .btn.btn-rounded {\n    border-radius: 1.875rem; }\n  .btn .material-icons {\n    vertical-align: middle;\n    margin-top: -1px;\n    margin-bottom: -1px;\n    font-size: 1.1rem;\n    display: inline-block;\n    top: 0; }\n\n.btn-check:checked + .btn svg .color-background {\n  fill: #fff; }\n\n.btn-check:checked + .btn:hover svg .color-background {\n  fill: #344767; }\n\n.icon-move-right i {\n  transition: all 0.2s cubic-bezier(0.34, 1.61, 0.7, 1.3); }\n\n.icon-move-right:hover i, .icon-move-right:focus i {\n  transform: translateX(5px); }\n\n.icon-move-left i {\n  transition: all 0.2s cubic-bezier(0.34, 1.61, 0.7, 1.3); }\n\n.icon-move-left:hover i, .icon-move-left:focus i {\n  transform: translateX(-5px); }\n\n.btn-primary,\n.btn.bg-gradient-primary {\n  box-shadow: 0 3px 3px 0 rgba(233, 30, 99, 0.15), 0 3px 1px -2px rgba(233, 30, 99, 0.2), 0 1px 5px 0 rgba(233, 30, 99, 0.15); }\n  .btn-primary:hover,\n  .btn.bg-gradient-primary:hover {\n    background-color: #e91e63;\n    border-color: #e91e63;\n    box-shadow: 0 14px 26px -12px rgba(233, 30, 99, 0.4), 0 4px 23px 0 rgba(233, 30, 99, 0.15), 0 8px 10px -5px rgba(233, 30, 99, 0.2); }\n  .btn-primary .btn.bg-outline-primary,\n  .btn.bg-gradient-primary .btn.bg-outline-primary {\n    border: 1px solid #e91e63; }\n  .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active,\n  .show > .btn-primary.dropdown-toggle,\n  .btn.bg-gradient-primary:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-primary:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-primary.dropdown-toggle {\n    color: color-yiq(#e91e63);\n    background-color: #e91e63; }\n  .btn-primary.focus, .btn-primary:focus,\n  .btn.bg-gradient-primary.focus,\n  .btn.bg-gradient-primary:focus {\n    color: #fff; }\n\n.btn-outline-primary {\n  box-shadow: none; }\n  .btn-outline-primary:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #e91e63; }\n\n.btn-secondary,\n.btn.bg-gradient-secondary {\n  box-shadow: 0 3px 3px 0 rgba(123, 128, 154, 0.15), 0 3px 1px -2px rgba(123, 128, 154, 0.2), 0 1px 5px 0 rgba(123, 128, 154, 0.15); }\n  .btn-secondary:hover,\n  .btn.bg-gradient-secondary:hover {\n    background-color: #7b809a;\n    border-color: #7b809a;\n    box-shadow: 0 14px 26px -12px rgba(123, 128, 154, 0.4), 0 4px 23px 0 rgba(123, 128, 154, 0.15), 0 8px 10px -5px rgba(123, 128, 154, 0.2); }\n  .btn-secondary .btn.bg-outline-secondary,\n  .btn.bg-gradient-secondary .btn.bg-outline-secondary {\n    border: 1px solid #7b809a; }\n  .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active,\n  .show > .btn-secondary.dropdown-toggle,\n  .btn.bg-gradient-secondary:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-secondary:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-secondary.dropdown-toggle {\n    color: color-yiq(#7b809a);\n    background-color: #7b809a; }\n  .btn-secondary.focus, .btn-secondary:focus,\n  .btn.bg-gradient-secondary.focus,\n  .btn.bg-gradient-secondary:focus {\n    color: #fff; }\n\n.btn-outline-secondary {\n  box-shadow: none; }\n  .btn-outline-secondary:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #7b809a; }\n\n.btn-success,\n.btn.bg-gradient-success {\n  box-shadow: 0 3px 3px 0 rgba(76, 175, 80, 0.15), 0 3px 1px -2px rgba(76, 175, 80, 0.2), 0 1px 5px 0 rgba(76, 175, 80, 0.15); }\n  .btn-success:hover,\n  .btn.bg-gradient-success:hover {\n    background-color: #4CAF50;\n    border-color: #4CAF50;\n    box-shadow: 0 14px 26px -12px rgba(76, 175, 80, 0.4), 0 4px 23px 0 rgba(76, 175, 80, 0.15), 0 8px 10px -5px rgba(76, 175, 80, 0.2); }\n  .btn-success .btn.bg-outline-success,\n  .btn.bg-gradient-success .btn.bg-outline-success {\n    border: 1px solid #4CAF50; }\n  .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active,\n  .show > .btn-success.dropdown-toggle,\n  .btn.bg-gradient-success:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-success:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-success.dropdown-toggle {\n    color: color-yiq(#4CAF50);\n    background-color: #4CAF50; }\n  .btn-success.focus, .btn-success:focus,\n  .btn.bg-gradient-success.focus,\n  .btn.bg-gradient-success:focus {\n    color: #fff; }\n\n.btn-outline-success {\n  box-shadow: none; }\n  .btn-outline-success:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #4CAF50; }\n\n.btn-info,\n.btn.bg-gradient-info {\n  box-shadow: 0 3px 3px 0 rgba(26, 115, 232, 0.15), 0 3px 1px -2px rgba(26, 115, 232, 0.2), 0 1px 5px 0 rgba(26, 115, 232, 0.15); }\n  .btn-info:hover,\n  .btn.bg-gradient-info:hover {\n    background-color: #1A73E8;\n    border-color: #1A73E8;\n    box-shadow: 0 14px 26px -12px rgba(26, 115, 232, 0.4), 0 4px 23px 0 rgba(26, 115, 232, 0.15), 0 8px 10px -5px rgba(26, 115, 232, 0.2); }\n  .btn-info .btn.bg-outline-info,\n  .btn.bg-gradient-info .btn.bg-outline-info {\n    border: 1px solid #1A73E8; }\n  .btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active,\n  .show > .btn-info.dropdown-toggle,\n  .btn.bg-gradient-info:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-info:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-info.dropdown-toggle {\n    color: color-yiq(#1A73E8);\n    background-color: #1A73E8; }\n  .btn-info.focus, .btn-info:focus,\n  .btn.bg-gradient-info.focus,\n  .btn.bg-gradient-info:focus {\n    color: #fff; }\n\n.btn-outline-info {\n  box-shadow: none; }\n  .btn-outline-info:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #1A73E8; }\n\n.btn-warning,\n.btn.bg-gradient-warning {\n  box-shadow: 0 3px 3px 0 rgba(251, 140, 0, 0.15), 0 3px 1px -2px rgba(251, 140, 0, 0.2), 0 1px 5px 0 rgba(251, 140, 0, 0.15); }\n  .btn-warning:hover,\n  .btn.bg-gradient-warning:hover {\n    background-color: #fb8c00;\n    border-color: #fb8c00;\n    box-shadow: 0 14px 26px -12px rgba(251, 140, 0, 0.4), 0 4px 23px 0 rgba(251, 140, 0, 0.15), 0 8px 10px -5px rgba(251, 140, 0, 0.2); }\n  .btn-warning .btn.bg-outline-warning,\n  .btn.bg-gradient-warning .btn.bg-outline-warning {\n    border: 1px solid #fb8c00; }\n  .btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active,\n  .show > .btn-warning.dropdown-toggle,\n  .btn.bg-gradient-warning:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-warning:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-warning.dropdown-toggle {\n    color: color-yiq(#fb8c00);\n    background-color: #fb8c00; }\n  .btn-warning.focus, .btn-warning:focus,\n  .btn.bg-gradient-warning.focus,\n  .btn.bg-gradient-warning:focus {\n    color: #fff; }\n\n.btn-outline-warning {\n  box-shadow: none; }\n  .btn-outline-warning:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #fb8c00; }\n\n.btn-danger,\n.btn.bg-gradient-danger {\n  box-shadow: 0 3px 3px 0 rgba(244, 67, 53, 0.15), 0 3px 1px -2px rgba(244, 67, 53, 0.2), 0 1px 5px 0 rgba(244, 67, 53, 0.15); }\n  .btn-danger:hover,\n  .btn.bg-gradient-danger:hover {\n    background-color: #F44335;\n    border-color: #F44335;\n    box-shadow: 0 14px 26px -12px rgba(244, 67, 53, 0.4), 0 4px 23px 0 rgba(244, 67, 53, 0.15), 0 8px 10px -5px rgba(244, 67, 53, 0.2); }\n  .btn-danger .btn.bg-outline-danger,\n  .btn.bg-gradient-danger .btn.bg-outline-danger {\n    border: 1px solid #F44335; }\n  .btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active,\n  .show > .btn-danger.dropdown-toggle,\n  .btn.bg-gradient-danger:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-danger:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-danger.dropdown-toggle {\n    color: color-yiq(#F44335);\n    background-color: #F44335; }\n  .btn-danger.focus, .btn-danger:focus,\n  .btn.bg-gradient-danger.focus,\n  .btn.bg-gradient-danger:focus {\n    color: #fff; }\n\n.btn-outline-danger {\n  box-shadow: none; }\n  .btn-outline-danger:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #F44335; }\n\n.btn-light,\n.btn.bg-gradient-light {\n  box-shadow: 0 3px 3px 0 rgba(240, 242, 245, 0.15), 0 3px 1px -2px rgba(240, 242, 245, 0.2), 0 1px 5px 0 rgba(240, 242, 245, 0.15); }\n  .btn-light:hover,\n  .btn.bg-gradient-light:hover {\n    background-color: #f0f2f5;\n    border-color: #f0f2f5;\n    box-shadow: 0 14px 26px -12px rgba(240, 242, 245, 0.4), 0 4px 23px 0 rgba(240, 242, 245, 0.15), 0 8px 10px -5px rgba(240, 242, 245, 0.2); }\n  .btn-light .btn.bg-outline-light,\n  .btn.bg-gradient-light .btn.bg-outline-light {\n    border: 1px solid #f0f2f5; }\n  .btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active,\n  .show > .btn-light.dropdown-toggle,\n  .btn.bg-gradient-light:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-light:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-light.dropdown-toggle {\n    color: color-yiq(#f0f2f5);\n    background-color: #f0f2f5; }\n\n.btn-outline-light {\n  box-shadow: none; }\n  .btn-outline-light:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #f0f2f5; }\n\n.btn-dark,\n.btn.bg-gradient-dark {\n  box-shadow: 0 3px 3px 0 rgba(52, 71, 103, 0.15), 0 3px 1px -2px rgba(52, 71, 103, 0.2), 0 1px 5px 0 rgba(52, 71, 103, 0.15); }\n  .btn-dark:hover,\n  .btn.bg-gradient-dark:hover {\n    background-color: #344767;\n    border-color: #344767;\n    box-shadow: 0 14px 26px -12px rgba(52, 71, 103, 0.4), 0 4px 23px 0 rgba(52, 71, 103, 0.15), 0 8px 10px -5px rgba(52, 71, 103, 0.2); }\n  .btn-dark .btn.bg-outline-dark,\n  .btn.bg-gradient-dark .btn.bg-outline-dark {\n    border: 1px solid #344767; }\n  .btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active,\n  .show > .btn-dark.dropdown-toggle,\n  .btn.bg-gradient-dark:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-dark:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-dark.dropdown-toggle {\n    color: color-yiq(#344767);\n    background-color: #344767; }\n  .btn-dark.focus, .btn-dark:focus,\n  .btn.bg-gradient-dark.focus,\n  .btn.bg-gradient-dark:focus {\n    color: #fff; }\n\n.btn-outline-dark {\n  box-shadow: none; }\n  .btn-outline-dark:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #344767; }\n\n.btn-white,\n.btn.bg-gradient-white {\n  box-shadow: 0 3px 3px 0 rgba(255, 255, 255, 0.15), 0 3px 1px -2px rgba(255, 255, 255, 0.2), 0 1px 5px 0 rgba(255, 255, 255, 0.15); }\n  .btn-white:hover,\n  .btn.bg-gradient-white:hover {\n    background-color: #fff;\n    border-color: #fff;\n    box-shadow: 0 14px 26px -12px rgba(255, 255, 255, 0.4), 0 4px 23px 0 rgba(255, 255, 255, 0.15), 0 8px 10px -5px rgba(255, 255, 255, 0.2); }\n  .btn-white .btn.bg-outline-white,\n  .btn.bg-gradient-white .btn.bg-outline-white {\n    border: 1px solid #fff; }\n  .btn-white:not(:disabled):not(.disabled).active, .btn-white:not(:disabled):not(.disabled):active,\n  .show > .btn-white.dropdown-toggle,\n  .btn.bg-gradient-white:not(:disabled):not(.disabled).active,\n  .btn.bg-gradient-white:not(:disabled):not(.disabled):active,\n  .show >\n  .btn.bg-gradient-white.dropdown-toggle {\n    color: color-yiq(#fff);\n    background-color: #fff; }\n\n.btn-outline-white {\n  box-shadow: none; }\n  .btn-outline-white:hover:not(.active) {\n    background-color: transparent;\n    opacity: .75;\n    box-shadow: none;\n    color: #fff; }\n\n.btn-outline-white {\n  border-color: rgba(255, 255, 255, 0.75);\n  background: rgba(255, 255, 255, 0.1); }\n\n.btn-primary,\n.btn.bg-gradient-primary {\n  color: #fff; }\n  .btn-primary:hover,\n  .btn.bg-gradient-primary:hover {\n    color: #fff; }\n\n.btn-secondary,\n.btn.bg-gradient-secondary {\n  color: #fff; }\n  .btn-secondary:hover,\n  .btn.bg-gradient-secondary:hover {\n    color: #fff; }\n\n.btn-danger,\n.btn.bg-gradient-danger {\n  color: #fff; }\n  .btn-danger:hover,\n  .btn.bg-gradient-danger:hover {\n    color: #fff; }\n\n.btn-info,\n.btn.bg-gradient-info {\n  color: #fff; }\n  .btn-info:hover,\n  .btn.bg-gradient-info:hover {\n    color: #fff; }\n\n.btn-success,\n.btn.bg-gradient-success {\n  color: #fff; }\n  .btn-success:hover,\n  .btn.bg-gradient-success:hover {\n    color: #fff; }\n\n.btn-warning,\n.btn.bg-gradient-warning {\n  color: #fff; }\n  .btn-warning:hover,\n  .btn.bg-gradient-warning:hover {\n    color: #fff; }\n\n.btn-dark,\n.btn.bg-gradient-dark {\n  color: #fff; }\n  .btn-dark:hover,\n  .btn.bg-gradient-dark:hover {\n    color: #fff; }\n\n.btn-light,\n.btn.bg-gradient-light {\n  color: #3A416F; }\n  .btn-light:hover,\n  .btn.bg-gradient-light:hover {\n    color: #3A416F; }\n\n.breadcrumb-item {\n  font-size: 0.875rem; }\n  .breadcrumb-item.text-white::before {\n    color: #fff; }\n\n.breadcrumb-dark {\n  background-color: #344767; }\n  .breadcrumb-dark .breadcrumb-item {\n    font-weight: 600; }\n    .breadcrumb-dark .breadcrumb-item a {\n      color: #f8f9fa; }\n      .breadcrumb-dark .breadcrumb-item a:hover {\n        color: #fff; }\n    .breadcrumb-dark .breadcrumb-item + .breadcrumb-item::before {\n      color: #adb5bd; }\n    .breadcrumb-dark .breadcrumb-item.active {\n      color: #dee2e6; }\n\n.breadcrumb-links {\n  padding: 0;\n  margin: 0;\n  background: transparent; }\n\n.card {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }\n  .card[data-animation=\"true\"] .card-header {\n    transform: translate3d(0, 0, 0);\n    transition: all 300ms cubic-bezier(0.34, 1.61, 0.7, 1); }\n  .card:hover[data-animation=\"true\"] .card-header {\n    transform: translate3d(0, -50px, 0); }\n  .card .card-header {\n    padding: 1.5rem; }\n  .card .card-body {\n    font-family: \"Roboto\", Helvetica, Arial, sans-serif;\n    padding: 1.5rem; }\n  .card.card-plain {\n    background-color: transparent;\n    box-shadow: none; }\n  .card .card-footer {\n    padding: 1.5rem;\n    background-color: transparent; }\n\n.author {\n  display: flex; }\n  .author .name > span {\n    line-height: 1.571;\n    font-weight: 600;\n    font-size: 0.875rem;\n    color: #3A416F; }\n  .author .stats {\n    font-size: 0.875rem;\n    font-weight: 400; }\n\n.card.card-background {\n  align-items: center; }\n  .card.card-background .full-background {\n    background-position: 50%;\n    background-size: cover;\n    margin-bottom: 30px;\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    border-radius: 0.75rem; }\n  .card.card-background .card-body {\n    color: #fff;\n    position: relative;\n    z-index: 2; }\n    .card.card-background .card-body .content-center,\n    .card.card-background .card-body .content-left {\n      min-height: 330px;\n      max-width: 450px;\n      padding-top: 60px;\n      padding-bottom: 60px; }\n    .card.card-background .card-body .content-center {\n      text-align: center; }\n    .card.card-background .card-body.body-left {\n      width: 90%; }\n    .card.card-background .card-body .author .name span,\n    .card.card-background .card-body .author .name .stats {\n      color: #fff; }\n  .card.card-background:after {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    z-index: 1;\n    display: block;\n    content: \"\";\n    background: rgba(0, 0, 0, 0.56);\n    border-radius: 0.75rem; }\n  .card.card-background.card-background-mask-primary:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-primary:after {\n    background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-secondary:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-secondary:after {\n    background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-success:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-success:after {\n    background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-info:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-info:after {\n    background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-warning:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-warning:after {\n    background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-danger:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-danger:after {\n    background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-light:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-light:after {\n    background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%);\n    opacity: .85; }\n  .card.card-background.card-background-mask-dark:before {\n    background: rgba(0, 0, 0, 0.2); }\n  .card.card-background.card-background-mask-dark:after {\n    background-image: linear-gradient(195deg, #42424a 0%, #191919 100%);\n    opacity: .85; }\n  .card.card-background .card-category {\n    font-size: 0.875rem;\n    font-weight: 600; }\n  .card.card-background .card-description {\n    margin-top: 24px;\n    margin-bottom: 24px; }\n\n.rotating-card-container {\n  -o-perspective: 800px;\n  -ms-perspective: 800px;\n  perspective: 800px; }\n  .rotating-card-container .card-rotate {\n    background: transparent;\n    box-shadow: none; }\n    .rotating-card-container .card-rotate:after {\n      display: none; }\n  .rotating-card-container .card {\n    transition: all 0.8s cubic-bezier(0.34, 1.45, 0.7, 1);\n    transform-style: preserve-3d;\n    position: relative; }\n    .rotating-card-container .card .back,\n    .rotating-card-container .card .front {\n      -webkit-backface-visibility: hidden;\n      backface-visibility: hidden;\n      position: absolute;\n      background-color: #fff;\n      border-radius: 0.5rem;\n      top: 0;\n      left: 0;\n      justify-content: center;\n      align-content: center;\n      display: -moz-flex;\n      display: -o-flex;\n      display: flex;\n      -moz-flex-direction: column;\n      -o-flex-direction: column;\n      flex-direction: column; }\n      .rotating-card-container .card .back .card-body,\n      .rotating-card-container .card .front .card-body {\n        justify-content: center;\n        align-content: center;\n        display: -moz-flex;\n        display: -o-flex;\n        display: flex;\n        -moz-flex-direction: column;\n        -o-flex-direction: column;\n        flex-direction: column; }\n      .rotating-card-container .card .back:after,\n      .rotating-card-container .card .front:after {\n        position: absolute;\n        z-index: 1;\n        width: 100%;\n        height: 100%;\n        display: block;\n        left: 0;\n        top: 0;\n        content: \"\";\n        border-radius: 0.5rem;\n        background-image: linear-gradient(195deg, #EC407A, #D81B60);\n        opacity: .85; }\n    .rotating-card-container .card .front {\n      z-index: 2;\n      position: relative; }\n    .rotating-card-container .card .back {\n      transform: rotateY(180deg);\n      z-index: 5;\n      text-align: center;\n      width: 100%;\n      height: 100%; }\n      .rotating-card-container .card .back.back-background .card-body {\n        position: relative;\n        z-index: 2; }\n      .rotating-card-container .card .back .card-footer .btn {\n        margin: 0; }\n      .rotating-card-container .card .back .card-body {\n        padding-left: 15px;\n        padding-right: 15px; }\n  .rotating-card-container:not(.manual-flip):hover .card {\n    transform: rotateY(180deg); }\n  .rotating-card-container.hover.manual-flip .card {\n    transform: rotateY(180deg); }\n  .card-profile .rotating-card-container .front {\n    text-align: left; }\n\n.back-background .card-body {\n  min-height: auto;\n  padding-top: 15px;\n  padding-bottom: 15px; }\n\n/*       Fix bug for IE      */\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n  .rotating-card-container .card .back,\n  .rotating-card-container .card .front {\n    -webkit-backface-visibility: visible;\n            backface-visibility: visible; }\n  .rotating-card-container .card .back {\n    visibility: hidden;\n    transition: visibility 0.3s cubic-bezier(0.34, 1.45, 0.7, 1); }\n  .rotating-card-container .card .front {\n    z-index: 4; }\n  .rotating-card-container.manual-flip.hover .card .back,\n  .rotating-card-container:not(.manual-flip):hover .card .back {\n    z-index: 5;\n    visibility: visible; } }\n\n.dark-version {\n  background-color: #1a2035 !important; }\n  .dark-version .main-content {\n    background-color: #1a2035 !important; }\n  .dark-version .sidenav {\n    background: #1f283e !important; }\n    .dark-version .sidenav.bg-transparent {\n      background: transparent !important; }\n      .dark-version .sidenav.bg-transparent .navbar-nav .nav-link {\n        color: #fff !important; }\n      .dark-version .sidenav.bg-transparent .nav .nav-link {\n        color: #fff !important; }\n    .dark-version .sidenav.bg-white {\n      background: #fff !important; }\n      .dark-version .sidenav.bg-white .navbar-nav .nav-link.active:after {\n        color: rgba(206, 212, 218, 0.7); }\n      .dark-version .sidenav.bg-white .collapse .nav-item .nav-link:not(.active) i {\n        color: #344767 !important; }\n      .dark-version .sidenav.bg-white .collapse .nav-item h6, .dark-version .sidenav.bg-white .collapse .nav-item .h6 {\n        color: #344767 !important; }\n    .dark-version .sidenav .collapse .nav-item .nav-link i {\n      color: #fff !important; }\n  .dark-version .fixed-plugin .btn.bg-gradient-dark, .dark-version .fixed-plugin .btn.btn-outline-dark {\n    color: #fff !important;\n    border: 1px solid #fff !important; }\n  .dark-version .fixed-plugin .btn.active {\n    background: #fff !important;\n    color: #344767 !important; }\n  .dark-version .bg-gradient-dark {\n    background-image: linear-gradient(195deg, #323a54, #1a2035); }\n  .dark-version .card,\n  .dark-version .swal2-popup,\n  .dark-version .dropdown .dropdown-menu,\n  .dark-version .kanban-board {\n    background: #202940;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n    .dark-version .card .card-header,\n    .dark-version .swal2-popup .card-header,\n    .dark-version .dropdown .dropdown-menu .card-header,\n    .dark-version .kanban-board .card-header {\n      background: transparent; }\n    .dark-version .card p,\n    .dark-version .swal2-popup p,\n    .dark-version .dropdown .dropdown-menu p,\n    .dark-version .kanban-board p {\n      color: #fff !important;\n      opacity: .6; }\n  .dark-version .kanban-item {\n    background: transparent !important;\n    border: 1px solid; }\n  .dark-version .swal2-html-container {\n    color: #fff !important;\n    opacity: .6; }\n  .dark-version h1, .dark-version .h1, .dark-version .h1,\n  .dark-version h2,\n  .dark-version .h2, .dark-version .h2,\n  .dark-version h3,\n  .dark-version .h3, .dark-version .h3,\n  .dark-version h4,\n  .dark-version .h4, .dark-version .h4,\n  .dark-version h5,\n  .dark-version .h5, .dark-version .h5,\n  .dark-version h6,\n  .dark-version .h6, .dark-version .h6,\n  .dark-version a:not(.dropdown-item):not(.choices__item):not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out):not(.btn):not(.nav-link):not(.fixed-plugin-button),\n  .dark-version .table thead tr th,\n  .dark-version .kanban-title-board {\n    color: #fff !important; }\n  .dark-version .input-group.input-group-dynamic .form-control, .dark-version .input-group.input-group-static .form-control {\n    background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, rgba(210, 210, 210, 0.6) 1px, rgba(209, 209, 209, 0) 0) !important;\n    background-size: 0 100%, 100% 100%; }\n    .dark-version .input-group.input-group-dynamic .form-control:focus, .dark-version .input-group.input-group-static .form-control:focus {\n      background-size: 100% 100%, 100% 100%; }\n  .dark-version .input-group.input-group-outline .form-control {\n    border-color: rgba(255, 255, 255, 0.4) !important; }\n  .dark-version .input-group .is-valid,\n  .dark-version .input-group .is-invalid {\n    border-color: rgba(255, 255, 255, 0.4) !important; }\n  .dark-version .accordion .accordion-button {\n    border-color: rgba(255, 255, 255, 0.4) !important;\n    color: #fff;\n    opacity: .8; }\n  .dark-version .table > :not(caption) > * > * {\n    border-color: rgba(255, 255, 255, 0.4) !important;\n    color: rgba(255, 255, 255, 0.6) !important; }\n  .dark-version label {\n    color: rgba(255, 255, 255, 0.8) !important; }\n  .dark-version .list-group-item,\n  .dark-version .multisteps-form__panel {\n    background-color: transparent !important; }\n  .dark-version .nav.bg-white {\n    background-color: #202940 !important;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n  .dark-version .nav .nav-link[data-scroll]:hover {\n    color: #344767 !important; }\n  .dark-version .toast {\n    background-color: #202940 !important;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n    .dark-version .toast .toast-header {\n      background: transparent; }\n    .dark-version .toast span {\n      color: #fff; }\n    .dark-version .toast p {\n      color: #fff !important;\n      opacity: .6; }\n  .dark-version .choices .choices__input {\n    background-color: transparent !important;\n    border-bottom: 1px solid rgba(255, 255, 255, 0.4);\n    color: #fff; }\n  .dark-version .choices .choices__list.choices__list--dropdown {\n    background: #202940;\n    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }\n  .dark-version .fc-theme-standard td,\n  .dark-version .fc-theme-standard th {\n    border-color: rgba(123, 128, 154, 0.3); }\n  .dark-version .dataTable-sorter::after {\n    border-bottom-color: #fff; }\n  .dark-version .dataTable-sorter::before {\n    border-top-color: #fff; }\n  .dark-version .ql-snow .ql-stroke {\n    stroke: #f0f2f5; }\n  .dark-version .ql-snow .ql-fill, .dark-version .ql-snow .ql-stroke.ql-fill {\n    fill: #f0f2f5; }\n  .dark-version .ql-toolbar.ql-snow .ql-picker-label {\n    color: #f0f2f5; }\n\nbody.dark-version {\n  color: rgba(255, 255, 255, 0.8) !important; }\n\n@media (min-width: 992px) {\n  .dropdown .dropdown-menu,\n  .dropup .dropdown-menu,\n  .dropstart .dropdown-menu,\n  .dropend .dropdown-menu {\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n    cursor: pointer; }\n  .dropdown .dropdown-toggle:after,\n  .dropup .dropdown-toggle:after,\n  .dropstart .dropdown-toggle:after,\n  .dropend .dropdown-toggle:after {\n    content: \"\\f107\";\n    font: normal normal normal 14px/1 FontAwesome;\n    border: none;\n    vertical-align: middle;\n    font-weight: 600; }\n  .dropdown .dropdown-toggle.show:after,\n  .dropup .dropdown-toggle.show:after,\n  .dropstart .dropdown-toggle.show:after,\n  .dropend .dropdown-toggle.show:after {\n    transform: rotate(180deg); }\n  .dropdown .dropdown-toggle:after,\n  .dropup .dropdown-toggle:after,\n  .dropstart .dropdown-toggle:after,\n  .dropend .dropdown-toggle:after {\n    transition: 0.3s ease; }\n  .dropdown.dropdown-hover .dropdown-menu,\n  .dropdown .dropdown-menu {\n    display: block;\n    position: absolute;\n    opacity: 0;\n    transform-origin: 0 0;\n    inset: 0px auto auto 0px;\n    margin-top: 2.8125rem !important;\n    pointer-events: none;\n    transform: scale(0.95) !important;\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    will-change: transform,box-shadow; }\n    .dropdown.dropdown-hover .dropdown-menu .dropdown.dropdown-hover .dropdown-menu,\n    .dropdown.dropdown-hover .dropdown-menu .dropdown .dropdown-menu,\n    .dropdown .dropdown-menu .dropdown.dropdown-hover .dropdown-menu,\n    .dropdown .dropdown-menu .dropdown .dropdown-menu {\n      margin-top: 0 !important; }\n  .dropdown.dropdown-hover:hover > .dropdown-menu,\n  .dropdown .dropdown-menu.show {\n    opacity: 1;\n    pointer-events: auto;\n    visibility: visible;\n    transform: scale(1) !important; }\n  .dropdown.dropdown-hover:hover > .dropdown-menu:before,\n  .dropdown .dropdown-menu.show:before {\n    top: -20px; }\n  .dropdown.dropdown-hover:after {\n    content: '';\n    position: absolute;\n    left: 0;\n    bottom: -24px;\n    width: 100%;\n    height: 100%; }\n  .dropdown:not(.dropdown-hover) .dropdown-menu.show {\n    margin-top: 2.8125rem !important; }\n  .dropdown .dropdown-menu:before {\n    font-family: \"FontAwesome\";\n    content: \"\\f0d8\";\n    position: absolute;\n    top: 0;\n    left: 28px;\n    right: auto;\n    font-size: 22px;\n    color: #fff;\n    transition: top 0.35s ease; }\n  .dropdown .dropdown-item .arrow {\n    transform: rotate(-90deg); }\n  .dropdown-item {\n    transition: background-color 0.3s ease, color 0.3s ease; } }\n\n@media (max-width: 991.98px) {\n  .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu {\n    display: block;\n    opacity: 0;\n    top: 0;\n    transform-origin: 0 0;\n    pointer-events: none;\n    transform: scale(0.95) !important;\n    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    will-change: transform,box-shadow;\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }\n    .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu:before {\n      font-family: \"FontAwesome\";\n      content: \"\\f0d8\";\n      position: absolute;\n      top: 0;\n      left: 28px;\n      right: auto;\n      font-size: 22px;\n      color: #fff;\n      transition: top 0.35s ease; }\n  .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item):not(.dropdown-hover) .dropdown-menu {\n    margin-top: 2.8125rem !important; }\n  .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu.show {\n    opacity: 1;\n    pointer-events: auto;\n    visibility: visible;\n    transform: scale(1) !important; }\n    .navbar-toggler + .navbar-collapse .dropdown:not(.nav-item) .dropdown-menu.show:before {\n      top: -20px; }\n  .navbar-toggler + .navbar-collapse .dropdown.nav-item .dropdown-menu {\n    background-color: transparent;\n    overflow: scroll;\n    position: relative; }\n  .dropdown .dropdown-menu {\n    opacity: 0;\n    top: 0;\n    transform-origin: 0 0;\n    pointer-events: none;\n    transform: scale(0.95) !important;\n    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    will-change: transform,box-shadow;\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }\n    .dropdown .dropdown-menu:before {\n      font-family: \"FontAwesome\";\n      content: \"\\f0d8\";\n      position: absolute;\n      top: 0;\n      left: 28px;\n      right: auto;\n      font-size: 22px;\n      color: #fff;\n      transition: top 0.35s ease; }\n  .dropdown:not(.dropdown-hover) .dropdown-menu {\n    margin-top: 2.8125rem !important; }\n  .dropdown .dropdown-menu.show {\n    opacity: 1;\n    pointer-events: auto;\n    visibility: visible;\n    transform: scale(1) !important; }\n    .dropdown .dropdown-menu.show:before {\n      top: -20px; }\n  .dropdown.nav-item .dropdown-menu {\n    position: absolute; }\n  .dropdown.nav-item .dropdown-menu-animation {\n    display: block;\n    height: 0;\n    transition: all .35s ease;\n    padding-top: 0 !important;\n    padding-bottom: 0 !important;\n    opacity: 0; }\n    .dropdown.nav-item .dropdown-menu-animation.show {\n      height: 250px;\n      opacity: 1; } }\n\n.dropdown-menu li {\n  position: relative; }\n\n.dropdown.dropdown-subitem:after {\n  left: 100%;\n  bottom: 0;\n  width: 50%; }\n\n.dropdown .dropdown-menu .dropdown-item + .dropdown-menu:before {\n  transform: rotate(-90deg);\n  left: 0;\n  top: 0;\n  z-index: -1;\n  transition: left .35s ease; }\n\n.dropdown .dropdown-menu.dropdown-menu-end {\n  right: 0 !important;\n  left: auto !important; }\n  .dropdown .dropdown-menu.dropdown-menu-end:before {\n    right: 28px;\n    left: auto; }\n\n.dropdown.dropdown-subitem:hover .dropdown-item + .dropdown-menu:before {\n  left: -8px; }\n\n.dropdown > .dropdown-menu .dropdown-item + .dropdown-menu {\n  transform: scale(1) !important; }\n\n.dropdown .dropdown-menu .dropdown-item + .dropdown-menu {\n  right: -197px;\n  left: auto;\n  top: 0; }\n\n.dropdown-image {\n  background-size: cover; }\n\n@media (min-width: 992px) {\n  .dropdown-xl {\n    min-width: 40rem; }\n  .dropdown-lg {\n    min-width: 23rem; }\n  .dropdown-md {\n    min-width: 15rem; } }\n\n@media (max-width: 1199.98px) {\n  .dropdown-lg-responsive {\n    min-width: 19rem; } }\n\n.dropup .dropdown-menu {\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;\n  cursor: pointer;\n  top: auto !important;\n  bottom: 100% !important;\n  margin-bottom: 0.5rem !important;\n  display: block;\n  opacity: 0;\n  transform-origin: bottom;\n  pointer-events: none;\n  transform: scale(0.95) !important;\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  will-change: transform,box-shadow; }\n  .dropup .dropdown-menu.show {\n    pointer-events: auto;\n    transform: scale(1) !important;\n    opacity: 1; }\n    .dropup .dropdown-menu.show:after {\n      bottom: -20px; }\n  .dropup .dropdown-menu:after {\n    font-family: \"FontAwesome\";\n    content: \"\\f0d7\";\n    position: absolute;\n    z-index: -1;\n    bottom: 22px;\n    left: 28px;\n    right: auto;\n    font-size: 22px;\n    color: #fff;\n    transition: bottom 0.35s ease; }\n\n.page-header {\n  padding: 0;\n  position: relative;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  background-size: cover;\n  background-position: 50%; }\n  .page-header .container {\n    z-index: 1; }\n  .page-header video {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    min-width: 100%;\n    min-height: 100%;\n    width: auto;\n    height: auto;\n    z-index: 0;\n    transform: translateX(-50%) translateY(-50%); }\n\n.fixed-plugin .fixed-plugin-button {\n  background: #fff;\n  border-radius: 50%;\n  bottom: 30px;\n  right: 30px;\n  font-size: 1.25rem;\n  z-index: 990;\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.16);\n  cursor: pointer; }\n  .fixed-plugin .fixed-plugin-button i {\n    pointer-events: none; }\n\n.fixed-plugin .card {\n  position: fixed !important;\n  right: -360px;\n  top: 0;\n  height: 100%;\n  left: auto !important;\n  transform: unset !important;\n  width: 360px;\n  border-radius: 0;\n  padding: 0 10px;\n  transition: .2s ease;\n  z-index: 1020; }\n\n.fixed-plugin .badge {\n  border: 1px solid #fff;\n  border-radius: 50%;\n  cursor: pointer;\n  display: inline-block;\n  height: 23px;\n  margin-right: 5px;\n  position: relative;\n  width: 23px;\n  transition: all 0.2s ease-in-out; }\n  .fixed-plugin .badge:hover, .fixed-plugin .badge.active {\n    border-color: #344767; }\n\n.fixed-plugin .btn.bg-gradient-dark:not(:disabled):not(.disabled) {\n  border: 1px solid transparent; }\n  .fixed-plugin .btn.bg-gradient-dark:not(:disabled):not(.disabled):not(.active) {\n    background-color: transparent;\n    background-image: none;\n    border: 1px solid #344767;\n    color: #344767; }\n\n.fixed-plugin.show .card {\n  right: 0; }\n\n.input-group {\n  border-radius: 0; }\n  .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),\n  .input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3) {\n    border-top-right-radius: inherit;\n    border-bottom-right-radius: inherit; }\n  .input-group.has-validation > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),\n  .input-group.has-validation > .dropdown-toggle:nth-last-child(n + 4) {\n    border-top-right-radius: inherit;\n    border-bottom-right-radius: inherit; }\n  .input-group,\n  .input-group .input-group-text {\n    transition: 0.2s ease;\n    border: none; }\n  .input-group > :not(:first-child):not(.dropdown-menu) {\n    margin-left: 2px; }\n  .input-group label {\n    transition: all 0.3s ease; }\n  .input-group.input-group-dynamic .form-control, .input-group.input-group-static .form-control {\n    background: no-repeat bottom, 50% calc(100% - 1px);\n    background-size: 0 100%, 100% 100%;\n    transition: 0.2s ease; }\n    .input-group.input-group-dynamic .form-control:not(:first-child), .input-group.input-group-static .form-control:not(:first-child) {\n      border-left: 0;\n      padding-left: 0; }\n    .input-group.input-group-dynamic .form-control:not(:last-child), .input-group.input-group-static .form-control:not(:last-child) {\n      border-right: 0;\n      padding-right: 0; }\n    .input-group.input-group-dynamic .form-control + .input-group-text, .input-group.input-group-static .form-control + .input-group-text {\n      border-left: 0;\n      border-right: 1px solid #d2d6da; }\n    .input-group.input-group-dynamic .form-control, .input-group.input-group-dynamic .form-control:focus, .input-group.input-group-static .form-control, .input-group.input-group-static .form-control:focus {\n      background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n      border-radius: 0 !important; }\n    .input-group.input-group-dynamic .form-control:focus, .input-group.input-group-static .form-control:focus {\n      background-size: 100% 100%, 100% 100%; }\n    .input-group.input-group-dynamic .form-control[disabled], .input-group.input-group-static .form-control[disabled] {\n      cursor: not-allowed;\n      background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #f0f2f5 1px, rgba(209, 209, 209, 0) 0) !important; }\n  .input-group.input-group-dynamic .input-group-text, .input-group.input-group-static .input-group-text {\n    border-right: 0; }\n  .input-group.input-group-dynamic.is-focused .form-label, .input-group.input-group-dynamic.is-filled .form-label, .input-group.input-group-static.is-focused .form-label, .input-group.input-group-static.is-filled .form-label {\n    font-size: 0.6875rem !important; }\n  .input-group.input-group-dynamic.is-focused .form-label, .input-group.input-group-static.is-focused .form-label {\n    top: -0.7rem; }\n  .input-group.input-group-dynamic.is-focused label, .input-group.input-group-static.is-focused label {\n    color: #e91e63; }\n  .input-group.input-group-dynamic.is-focused.is-valid label, .input-group.input-group-static.is-focused.is-valid label {\n    color: #4CAF50; }\n  .input-group.input-group-dynamic.is-focused.is-valid .form-control, .input-group.input-group-dynamic.is-focused.is-valid .form-control:focus, .input-group.input-group-static.is-focused.is-valid .form-control, .input-group.input-group-static.is-focused.is-valid .form-control:focus {\n    background-image: linear-gradient(0deg, #4CAF50 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-focused.is-invalid label, .input-group.input-group-static.is-focused.is-invalid label {\n    color: #F44335; }\n  .input-group.input-group-dynamic.is-focused.is-invalid .form-control, .input-group.input-group-dynamic.is-focused.is-invalid .form-control:focus, .input-group.input-group-static.is-focused.is-invalid .form-control, .input-group.input-group-static.is-focused.is-invalid .form-control:focus {\n    background-image: linear-gradient(0deg, #F44335 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-valid .form-control, .input-group.input-group-dynamic.is-valid .form-control:focus, .input-group.input-group-static.is-valid .form-control, .input-group.input-group-static.is-valid .form-control:focus {\n    background-image: linear-gradient(0deg, #4CAF50 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-invalid .form-control, .input-group.input-group-dynamic.is-invalid .form-control:focus, .input-group.input-group-static.is-invalid .form-control, .input-group.input-group-static.is-invalid .form-control:focus {\n    background-image: linear-gradient(0deg, #F44335 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0);\n    border-radius: 0 !important; }\n  .input-group.input-group-dynamic.is-filled.is-focused .form-label, .input-group.input-group-dynamic.is-filled .form-label, .input-group.input-group-static.is-filled.is-focused .form-label, .input-group.input-group-static.is-filled .form-label {\n    top: -1rem; }\n  .input-group.input-group-outline .form-control {\n    background: none;\n    border: 1px solid #d2d6da;\n    border-radius: 0.375rem;\n    border-top-left-radius: 0.375rem !important;\n    border-bottom-left-radius: 0.375rem !important;\n    padding: 0.625rem 0.75rem !important;\n    line-height: 1.3 !important; }\n    .input-group.input-group-outline .form-control.form-control-lg {\n      padding: 0.75rem 0.75rem !important; }\n    .input-group.input-group-outline .form-control.form-control-sm {\n      padding: 0.25rem 0.75rem !important; }\n    .input-group.input-group-outline .form-control[disabled] {\n      cursor: not-allowed;\n      border-style: dashed; }\n  .input-group.input-group-outline .form-label {\n    display: flex;\n    line-height: 3.925 !important;\n    top: -0.375rem;\n    margin-bottom: 0; }\n    .input-group.input-group-outline .form-label:before {\n      content: \"\";\n      margin-right: 4px;\n      border-left: solid 1px transparent;\n      border-radius: 4px 0; }\n    .input-group.input-group-outline .form-label:after {\n      content: \"\";\n      flex-grow: 1;\n      margin-left: 4px;\n      border-right: solid 1px transparent;\n      border-radius: 0 5px; }\n    .input-group.input-group-outline .form-label:before, .input-group.input-group-outline .form-label:after {\n      content: \"\";\n      border-top: solid 1px;\n      border-top-color: #d2d6da;\n      pointer-events: none;\n      margin-top: 0.375rem;\n      box-sizing: border-box;\n      display: block;\n      height: 0.5rem;\n      width: 0.625rem;\n      border-width: 1px 0 0;\n      border-color: transparent; }\n  .input-group.input-group-outline.is-focused .form-label + .form-control, .input-group.input-group-outline.is-filled .form-label + .form-control {\n    border-color: #e91e63 !important;\n    border-top-color: transparent !important;\n    box-shadow: inset 1px 0 #e91e63, inset -1px 0 #e91e63, inset 0 -1px #e91e63; }\n  .input-group.input-group-outline.is-focused .form-label, .input-group.input-group-outline.is-filled .form-label {\n    width: 100%;\n    height: 100%;\n    font-size: 0.6875rem !important;\n    color: #e91e63;\n    display: flex;\n    line-height: 1.25 !important; }\n    .input-group.input-group-outline.is-focused .form-label:before, .input-group.input-group-outline.is-focused .form-label:after, .input-group.input-group-outline.is-filled .form-label:before, .input-group.input-group-outline.is-filled .form-label:after {\n      opacity: 1; }\n    .input-group.input-group-outline.is-focused .form-label:before, .input-group.input-group-outline.is-focused .form-label:after, .input-group.input-group-outline.is-filled .form-label:before, .input-group.input-group-outline.is-filled .form-label:after {\n      border-top-color: #e91e63;\n      box-shadow: inset 0 1px #e91e63; }\n  .input-group.input-group-outline.is-valid .form-control {\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3e%3cpath fill='%2366d432' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");\n    background-repeat: no-repeat;\n    background-position: right 0.75rem center;\n    background-size: 1rem 1rem; }\n  .input-group.input-group-outline.is-valid.is-focused .form-label + .form-control, .input-group.input-group-outline.is-valid.is-filled .form-label + .form-control {\n    border-color: #4CAF50 !important;\n    box-shadow: inset 1px 0 #4CAF50, inset -1px 0 #4CAF50, inset 0 -1px #4CAF50;\n    border-top-color: transparent !important; }\n  .input-group.input-group-outline.is-valid.is-focused .form-label, .input-group.input-group-outline.is-valid.is-filled .form-label {\n    color: #4CAF50; }\n    .input-group.input-group-outline.is-valid.is-focused .form-label:before, .input-group.input-group-outline.is-valid.is-focused .form-label:after, .input-group.input-group-outline.is-valid.is-filled .form-label:before, .input-group.input-group-outline.is-valid.is-filled .form-label:after {\n      border-top-color: #4CAF50;\n      box-shadow: inset 0 1px #4CAF50; }\n  .input-group.input-group-outline.is-invalid .form-control {\n    background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd5c70' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd5c70' stroke='none'/%3e%3c/svg%3e\");\n    background-repeat: no-repeat;\n    background-position: right 0.75rem center;\n    background-size: 1rem 1rem; }\n  .input-group.input-group-outline.is-invalid.is-focused .form-label + .form-control, .input-group.input-group-outline.is-invalid.is-filled .form-label + .form-control {\n    border-color: #F44335 !important;\n    box-shadow: inset 1px 0 #F44335, inset -1px 0 #F44335, inset 0 -1px #F44335;\n    border-top-color: transparent !important; }\n  .input-group.input-group-outline.is-invalid.is-focused .form-label, .input-group.input-group-outline.is-invalid.is-filled .form-label {\n    color: #F44335; }\n    .input-group.input-group-outline.is-invalid.is-focused .form-label:before, .input-group.input-group-outline.is-invalid.is-focused .form-label:after, .input-group.input-group-outline.is-invalid.is-filled .form-label:before, .input-group.input-group-outline.is-invalid.is-filled .form-label:after {\n      border-top-color: #F44335;\n      box-shadow: inset 0 1px #F44335; }\n  .input-group.input-group-outline.input-group-sm .form-label,\n  .input-group.input-group-outline.input-group-sm label, .input-group.input-group-dynamic.input-group-sm .form-label,\n  .input-group.input-group-dynamic.input-group-sm label, .input-group.input-group-static.input-group-sm .form-label,\n  .input-group.input-group-static.input-group-sm label {\n    font-size: 0.75rem; }\n  .input-group.input-group-outline.input-group-lg .form-label,\n  .input-group.input-group-outline.input-group-lg label, .input-group.input-group-dynamic.input-group-lg .form-label,\n  .input-group.input-group-dynamic.input-group-lg label, .input-group.input-group-static.input-group-lg .form-label,\n  .input-group.input-group-static.input-group-lg label {\n    font-size: 0.975rem; }\n  .input-group.input-group-static .form-control {\n    width: 100%; }\n  .input-group.input-group-static label {\n    margin-left: 0;\n    margin-bottom: 0; }\n\n.form-check:not(.form-switch) .form-check-input {\n  float: initial !important;\n  margin-left: auto !important; }\n  .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"], .form-check:not(.form-switch) .form-check-input[type=\"radio\"] {\n    border: 1px solid #d1d7e1;\n    margin-top: 0.25rem;\n    position: relative; }\n    .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:checked, .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:checked {\n      border-color: #e91e63; }\n  .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"] {\n    background-image: none; }\n    .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:after {\n      transition: opacity 0.25s ease-in-out;\n      font-family: \"FontAwesome\";\n      content: \"\\f00c\";\n      width: 100%;\n      height: 100%;\n      color: #fff;\n      position: absolute;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      font-size: 0.67rem;\n      opacity: 0; }\n    .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:checked {\n      background: #e91e63; }\n      .form-check:not(.form-switch) .form-check-input[type=\"checkbox\"]:checked:after {\n        opacity: 1; }\n  .form-check:not(.form-switch) .form-check-input[type=\"radio\"] {\n    transition: border 0s;\n    background: transparent; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:after {\n      transition: opacity 0.25s ease-in-out;\n      content: \"\";\n      position: absolute;\n      width: 0.8375rem;\n      height: 0.8375rem;\n      border-radius: 50%;\n      background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%), var(--bs-gradient);\n      opacity: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      margin: auto; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:checked {\n      padding: 6px; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:checked:after {\n      opacity: 1; }\n    .form-check:not(.form-switch) .form-check-input[type=\"radio\"]:active {\n      box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 0 0 12px rgba(53, 71, 102, 0.1);\n      border-radius: 50rem;\n      transition: 0.05s ease; }\n\n.form-check-label,\n.form-check-input[type=\"checkbox\"] {\n  cursor: pointer; }\n\n.form-check-label {\n  font-size: 0.875rem;\n  font-weight: 400; }\n\n.form-check-input {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none; }\n\n.form-switch .form-check-input {\n  position: relative;\n  background-color: #ced4da;\n  height: 0.9375rem;\n  width: 1.875rem; }\n  .form-switch .form-check-input:after {\n    transition: transform 0.25s ease-in-out, background-color 0.25s ease-in-out;\n    content: \"\";\n    width: 1.25rem;\n    height: 1.25rem;\n    border-radius: 50%;\n    border: 1px solid #ced4da;\n    position: absolute;\n    background-color: #fff;\n    transform: translateX(1px);\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n    top: -2.5px;\n    left: -5px; }\n  .form-switch .form-check-input:checked:after {\n    transform: translateX(21px);\n    border-color: #42424a; }\n  .form-switch .form-check-input:checked {\n    border-color: #42424a;\n    background-color: #42424a; }\n    .form-switch .form-check-input:checked:active:after {\n      box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 0 0 15px rgba(53, 71, 102, 0.1); }\n  .form-switch .form-check-input:active:after {\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 0 0 15px rgba(0, 0, 0, 0.1); }\n\n.form-select {\n  transition: 0.2s ease; }\n\nlabel,\n.form-label {\n  font-size: 0.875rem;\n  font-weight: 400;\n  margin-bottom: 0.5rem;\n  color: #7b809a;\n  margin-left: 0.25rem; }\n\n.input-group .form-label {\n  position: absolute;\n  top: 0.6125rem;\n  margin-left: 0;\n  transition: 0.2s ease all; }\n\n.form-control {\n  border: none; }\n  .form-control.is-invalid {\n    border: 1px solid #d2d6da;\n    padding: 0.625rem 0.75rem;\n    line-height: 1.3 !important; }\n    .form-control.is-invalid:focus {\n      box-shadow: 0 0 0 2px rgba(253, 92, 112, 0.6); }\n  .form-control.is-valid {\n    border: 1px solid #d2d6da;\n    padding: 0.625rem 0.75rem;\n    line-height: 1.3 !important; }\n    .form-control.is-valid:focus {\n      box-shadow: 0 0 0 2px rgba(102, 212, 50, 0.65); }\n  .form-control[disabled] {\n    padding: 0.625rem 0.75rem;\n    line-height: 1.45 !important; }\n\n.input-group .input-group-text {\n  position: absolute;\n  padding: .75rem 0;\n  right: 0;\n  border-right: 0 !important; }\n  .input-group .input-group-text i {\n    color: #6c757d; }\n\n.input-group.input-group-static .input-group-text {\n  bottom: 0; }\n\n.footer .nav-link {\n  color: #344767;\n  font-weight: 400;\n  font-size: 0.875rem;\n  padding-top: 0;\n  padding-bottom: 0.25rem; }\n  .footer .nav-link:hover {\n    opacity: 1 !important;\n    transition: opacity 0.3 ease; }\n\n.footer .footer-logo {\n  max-width: 2rem; }\n\n.bg-gradient-primary {\n  background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }\n\n.bg-gradient-secondary {\n  background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%); }\n\n.bg-gradient-success {\n  background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%); }\n\n.bg-gradient-info {\n  background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%); }\n\n.bg-gradient-warning {\n  background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%); }\n\n.bg-gradient-danger {\n  background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%); }\n\n.bg-gradient-light {\n  background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%); }\n\n.bg-gradient-dark {\n  background-image: linear-gradient(195deg, #42424a 0%, #191919 100%); }\n\n.bg-gradient-faded-primary {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(233, 30, 99, 0.6) 0, #c1134e 100%); }\n\n.bg-gradient-faded-secondary {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(123, 128, 154, 0.6) 0, #626780 100%); }\n\n.bg-gradient-faded-success {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(76, 175, 80, 0.6) 0, #3d8b40 100%); }\n\n.bg-gradient-faded-info {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(26, 115, 232, 0.6) 0, #135cbc 100%); }\n\n.bg-gradient-faded-warning {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(251, 140, 0, 0.6) 0, #c87000 100%); }\n\n.bg-gradient-faded-danger {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(244, 67, 53, 0.6) 0, #e91d0d 100%); }\n\n.bg-gradient-faded-light {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(240, 242, 245, 0.6) 0, #d1d7e1 100%); }\n\n.bg-gradient-faded-dark {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(52, 71, 103, 0.6) 0, #233045 100%); }\n\n.bg-gradient-faded-white {\n  background-image: radial-gradient(370px circle at 80% 50%, rgba(255, 255, 255, 0.6) 0, #e6e6e6 100%); }\n\n.bg-gradient-faded-primary-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(233, 30, 99, 0.3) 0, #e91e63 100%); }\n\n.bg-gradient-faded-secondary-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(123, 128, 154, 0.3) 0, #7b809a 100%); }\n\n.bg-gradient-faded-success-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(76, 175, 80, 0.3) 0, #4CAF50 100%); }\n\n.bg-gradient-faded-info-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(26, 115, 232, 0.3) 0, #1A73E8 100%); }\n\n.bg-gradient-faded-warning-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(251, 140, 0, 0.3) 0, #fb8c00 100%); }\n\n.bg-gradient-faded-danger-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(244, 67, 53, 0.3) 0, #F44335 100%); }\n\n.bg-gradient-faded-light-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(240, 242, 245, 0.3) 0, #f0f2f5 100%); }\n\n.bg-gradient-faded-dark-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(52, 71, 103, 0.3) 0, #344767 100%); }\n\n.bg-gradient-faded-white-vertical {\n  background-image: radial-gradient(200px circle at 50% 70%, rgba(255, 255, 255, 0.3) 0, #fff 100%); }\n\n.material-icons {\n  font-family: 'Material Icons Round';\n  font-weight: normal;\n  font-style: normal;\n  font-size: 20px;\n  /* Preferred icon size */\n  display: inline-block;\n  line-height: 1;\n  text-transform: none;\n  letter-spacing: normal;\n  word-wrap: normal;\n  white-space: nowrap;\n  direction: ltr;\n  /* Support for all WebKit browsers. */\n  -webkit-font-smoothing: antialiased;\n  /* Support for Safari and Chrome. */\n  text-rendering: optimizeLegibility;\n  /* Support for Firefox. */\n  -moz-osx-font-smoothing: grayscale;\n  /* Support for IE. */\n  font-feature-settings: 'liga'; }\n\n.nav.nav-pills .nav-link .material-icons {\n  top: 3px; }\n\n.icon-shape {\n  width: 48px;\n  height: 48px;\n  background-position: center;\n  border-radius: 0.5rem; }\n  .icon-shape i {\n    color: #fff;\n    opacity: 0.8;\n    top: 11px;\n    position: relative; }\n  .icon-shape .ni {\n    top: 14px; }\n\n.icon-xxs {\n  width: 20px;\n  height: 20px; }\n  .icon-xxs i {\n    top: 0;\n    font-size: 0.65rem; }\n\n.icon-xs {\n  width: 24px;\n  height: 24px; }\n  .icon-xs i {\n    top: -1px;\n    font-size: 0.75rem; }\n\n.icon-sm {\n  width: 32px;\n  height: 32px; }\n  .icon-sm i {\n    top: 4px;\n    font-size: 0.875rem; }\n\n.icon-md {\n  width: 48px;\n  height: 48px; }\n  .icon-md i {\n    top: 30%;\n    font-size: 1.125rem; }\n  .icon-md.icon-striped {\n    background-position-x: 85px;\n    background-position-y: 85px; }\n    .icon-md.icon-striped i {\n      top: 11%;\n      margin-left: -10px;\n      font-size: 0.875rem; }\n\n.icon-lg {\n  width: 64px;\n  height: 64px; }\n  .icon-lg i {\n    top: 31%;\n    font-size: 1.5rem; }\n  .icon-lg.icon-striped {\n    background-position-x: 111px;\n    background-position-y: 111px; }\n    .icon-lg.icon-striped i {\n      top: 21%;\n      margin-left: -15px; }\n\n.icon-xl {\n  width: 100px;\n  height: 100px;\n  border-radius: 0.5rem; }\n  .icon-xl i {\n    top: 35%;\n    font-size: 2.1rem; }\n  .icon-xl.icon-striped {\n    background-position-x: 80px;\n    background-position-y: 80px; }\n    .icon-xl.icon-striped i {\n      top: 30%;\n      margin-left: -15px; }\n\n.info-horizontal {\n  text-align: left !important; }\n  .info-horizontal .icon {\n    float: left; }\n  .info-horizontal .description {\n    overflow: hidden; }\n\nsvg.text-primary .color-foreground {\n  fill: #EC407A; }\n\nsvg.text-primary .color-background {\n  fill: #D81B60; }\n\nsvg.text-secondary .color-foreground {\n  fill: #747b8a; }\n\nsvg.text-secondary .color-background {\n  fill: #495361; }\n\nsvg.text-info .color-foreground {\n  fill: #49a3f1; }\n\nsvg.text-info .color-background {\n  fill: #1A73E8; }\n\nsvg.text-warning .color-foreground {\n  fill: #FFA726; }\n\nsvg.text-warning .color-background {\n  fill: #FB8C00; }\n\nsvg.text-danger .color-foreground {\n  fill: #EF5350; }\n\nsvg.text-danger .color-background {\n  fill: #E53935; }\n\nsvg.text-success .color-foreground {\n  fill: #66BB6A; }\n\nsvg.text-success .color-background {\n  fill: #43A047; }\n\nsvg.text-dark .color-foreground {\n  fill: #42424a; }\n\nsvg.text-dark .color-background {\n  fill: #191919; }\n\n.blur {\n  box-shadow: inset 0px 0px 2px #fefefed1;\n  -webkit-backdrop-filter: saturate(200%) blur(30px);\n  backdrop-filter: saturate(200%) blur(30px);\n  background-color: rgba(255, 255, 255, 0.8) !important; }\n  .blur.saturation-less {\n    -webkit-backdrop-filter: saturate(20%) blur(30px);\n    backdrop-filter: saturate(20%) blur(30px); }\n  .blur.blur-rounded {\n    border-radius: 40px; }\n  .blur.blur-light {\n    background-color: rgba(255, 255, 255, 0.4); }\n  .blur.blur-dark {\n    background-color: rgba(0, 0, 0, 0.3); }\n\n.shadow-blur {\n  box-shadow: inset 0 0px 1px 1px rgba(254, 254, 254, 0.9), 0 20px 27px 0 rgba(0, 0, 0, 0.05) !important; }\n\n.shadow-card {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; }\n\n.navbar-blur {\n  -webkit-backdrop-filter: saturate(200%) blur(30px);\n  backdrop-filter: saturate(200%) blur(30px);\n  background-color: rgba(255, 255, 255, 0.58) !important; }\n\n.blur-section {\n  -webkit-backdrop-filter: saturate(200%) blur(30px);\n  backdrop-filter: saturate(200%) blur(30px); }\n  .blur-section.blur-gradient-primary {\n    background-image: linear-gradient(195deg, rgba(236, 64, 122, 0.95) 0%, rgba(216, 27, 96, 0.95) 100%); }\n\n*.move-on-hover {\n  transition: 0.2s ease-out;\n  overflow: hidden;\n  transform-origin: 50% 0;\n  transform-origin: 50% 0;\n  transform: perspective(999px) rotateX(0deg) translate3d(0, 0, 0);\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  will-change: transform, box-shadow; }\n  *.move-on-hover:hover {\n    transform: perspective(999px) rotateX(7deg) translate3d(0px, -4px, 5px); }\n\n*.gradient-animation {\n  background: linear-gradient(-45deg, #49a3f1, #F44335, #fb8c00, #EC407A, #344767);\n  background-size: 400% 400% !important;\n  -webkit-animation: gradient 10s ease infinite;\n          animation: gradient 10s ease infinite; }\n\nhr.vertical {\n  position: absolute;\n  background-color: transparent;\n  height: 100%;\n  right: 0;\n  top: 0;\n  width: 1px; }\n  hr.vertical.light {\n    background-color: #ffffff94; }\n  hr.vertical.dark {\n    background-color: #7b809a33; }\n  hr.vertical.gray-light {\n    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)); }\n\nhr.horizontal {\n  background-color: transparent; }\n  hr.horizontal.light {\n    background-color: #ffffff94; }\n  hr.horizontal.dark {\n    background-color: #7b809a33; }\n  hr.horizontal.gray-light {\n    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)); }\n\n.lock-size {\n  width: 1.7rem;\n  height: 1.7rem; }\n\n.border-radius-xs {\n  border-radius: 0.1rem; }\n\n.border-radius-sm {\n  border-radius: 0.125rem; }\n\n.border-radius-md {\n  border-radius: 0.375rem; }\n\n.border-radius-lg {\n  border-radius: 0.5rem; }\n\n.border-radius-xl {\n  border-radius: 0.75rem; }\n\n.border-radius-2xl {\n  border-radius: 1rem; }\n\n.border-radius-section {\n  border-radius: 10rem; }\n\n.border-bottom-end-radius-0 {\n  border-bottom-right-radius: 0; }\n\n.border-top-end-radius-0 {\n  border-top-right-radius: 0; }\n\n.border-bottom-start-radius-0 {\n  border-bottom-left-radius: 0; }\n\n.border-top-start-radius-0 {\n  border-top-left-radius: 0; }\n\n.border-dashed {\n  border-style: dashed; }\n\n.z-index-sticky {\n  z-index: 1020; }\n\n.waves {\n  position: relative;\n  width: 100%;\n  height: 16vh;\n  margin-bottom: -7px;\n  /*Fix for safari gap*/\n  min-height: 100px;\n  max-height: 150px; }\n  .waves.waves-sm {\n    height: 50px;\n    min-height: 50px; }\n  .waves.no-animation .moving-waves > use {\n    -webkit-animation: none;\n            animation: none; }\n\n.wave-rotate {\n  transform: rotate(180deg); }\n\n/* Animation for the waves */\n.moving-waves > use {\n  -webkit-animation: move-forever 40s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;\n          animation: move-forever 40s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; }\n\n.moving-waves > use:nth-child(1) {\n  -webkit-animation-delay: -2s;\n          animation-delay: -2s;\n  -webkit-animation-duration: 11s;\n          animation-duration: 11s; }\n\n.moving-waves > use:nth-child(2) {\n  -webkit-animation-delay: -4s;\n          animation-delay: -4s;\n  -webkit-animation-duration: 13s;\n          animation-duration: 13s; }\n\n.moving-waves > use:nth-child(3) {\n  -webkit-animation-delay: -3s;\n          animation-delay: -3s;\n  -webkit-animation-duration: 15s;\n          animation-duration: 15s; }\n\n.moving-waves > use:nth-child(4) {\n  -webkit-animation-delay: -4s;\n          animation-delay: -4s;\n  -webkit-animation-duration: 20s;\n          animation-duration: 20s; }\n\n.moving-waves > use:nth-child(5) {\n  -webkit-animation-delay: -4s;\n          animation-delay: -4s;\n  -webkit-animation-duration: 25s;\n          animation-duration: 25s; }\n\n.moving-waves > use:nth-child(6) {\n  -webkit-animation-delay: -3s;\n          animation-delay: -3s;\n  -webkit-animation-duration: 30s;\n          animation-duration: 30s; }\n\n@-webkit-keyframes move-forever {\n  0% {\n    transform: translate3d(-90px, 0, 0); }\n  100% {\n    transform: translate3d(85px, 0, 0); } }\n\n@keyframes move-forever {\n  0% {\n    transform: translate3d(-90px, 0, 0); }\n  100% {\n    transform: translate3d(85px, 0, 0); } }\n\n/*Shrinking for mobile*/\n@media (max-width: 767.98px) {\n  .waves {\n    height: 40px;\n    min-height: 40px; }\n  hr.horizontal {\n    background-color: transparent; }\n    hr.horizontal:not(.dark) {\n      background-image: linear-gradient(to right, rgba(255, 255, 255, 0), white, rgba(255, 255, 255, 0)); }\n    hr.horizontal.vertical {\n      transform: rotate(90deg); }\n    hr.horizontal.dark {\n      background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)); } }\n\n.overflow-visible {\n  overflow: visible !important; }\n\n.popover .popover-header {\n  font-weight: 600; }\n\n.bg-cover {\n  background-size: cover; }\n\n.mask {\n  position: absolute;\n  background-size: cover;\n  background-position: center center;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 0.8; }\n\n.cursor-pointer {\n  cursor: pointer; }\n\n.transform-translate-50 {\n  transform: translate(0, -50%); }\n\n@media (min-width: 992px) {\n  .virtual-reality .sidenav {\n    margin-top: 2rem;\n    -webkit-animation-name: fadeInBottom;\n            animation-name: fadeInBottom;\n    -webkit-animation-fill-mode: both;\n            animation-fill-mode: both;\n    -webkit-animation-duration: 1.5s;\n            animation-duration: 1.5s;\n    transform: scale(0.6);\n    left: 18% !important;\n    position: absolute; } }\n\n.choices .choices__list {\n  background: no-repeat bottom, 50% calc(100% - 1px);\n  background-size: 0 100%, 100% 100%;\n  transition: 0.2s ease; }\n  .choices .choices__list.choices__list--single .choices__item--selectable {\n    margin-bottom: 0.5rem; }\n  .choices .choices__list.choices__list--single, .choices .choices__list.choices__list--single:focus {\n    background-image: linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #d2d2d2 1px, rgba(209, 209, 209, 0) 0); }\n  .choices .choices__list.choices__list--dropdown {\n    background: #fff; }\n\n.choices.is-focused .choices__list {\n  background-size: 100% 100%, 100% 100%; }\n\n.border-right-after:after {\n  content: \"\";\n  position: absolute;\n  right: 0;\n  top: 3vh;\n  height: 70%;\n  width: 50%;\n  border-right: 1px solid #dee2e6; }\n\n.navbar {\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.16); }\n  .navbar .navbar-brand {\n    color: #344767;\n    font-size: 0.875rem; }\n  .navbar .nav-link {\n    color: #344767;\n    padding: 0.5rem 1rem;\n    font-weight: 400;\n    font-size: 0.875rem; }\n  .navbar.navbar-absolute {\n    position: absolute;\n    width: 100%;\n    z-index: 1; }\n  .navbar.navbar-transparent .nav-link, .navbar.navbar-transparent .nav-link i {\n    color: #fff; }\n  .navbar.navbar-transparent .nav-link:hover, .navbar.navbar-transparent .nav-link:focus {\n    color: rgba(255, 255, 255, 0.75); }\n  .navbar.navbar-transparent .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar {\n    background: #fff; }\n  .navbar.navbar-transparent .navbar-collapse {\n    border-radius: 0.75rem; }\n  .navbar.navbar-dark .navbar-collapse.show .dropdown-header.text-dark,\n  .navbar.navbar-dark .navbar-collapse.collapsing .dropdown-header.text-dark {\n    color: #fff !important; }\n  .navbar .sidenav-toggler-inner {\n    width: 18px; }\n    .navbar .sidenav-toggler-inner .sidenav-toggler-line {\n      transition: all 0.15s ease;\n      background: #7b809a;\n      border-radius: 0.1rem;\n      position: relative;\n      display: block;\n      height: 2px; }\n      .navbar .sidenav-toggler-inner .sidenav-toggler-line:not(:last-child) {\n        margin-bottom: 3px; }\n  .g-sidenav-show.g-sidenav-pinned .navbar .sidenav-toggler-inner .sidenav-toggler-line:first-child,\n  .g-sidenav-show.g-sidenav-pinned .navbar .sidenav-toggler-inner .sidenav-toggler-line:last-child {\n    width: 13px;\n    transform: translateX(5px); }\n\n.navbar-light {\n  background-color: #fff !important; }\n  .navbar-light .navbar-toggler {\n    border: none; }\n    .navbar-light .navbar-toggler:focus {\n      box-shadow: none; }\n\n.navbar-toggler .navbar-toggler-icon {\n  background-image: none; }\n  .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar {\n    display: block;\n    position: relative;\n    width: 22px;\n    height: 1px;\n    border-radius: 1px;\n    background: #6c757d;\n    transition: all 0.2s;\n    margin: 0 auto; }\n    .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar.bar2, .navbar-toggler .navbar-toggler-icon .navbar-toggler-bar.bar3 {\n      margin-top: 7px; }\n\n.navbar-toggler[aria-expanded=\"true\"] .navbar-toggler-bar.bar1 {\n  transform: rotate(45deg);\n  transform-origin: 10% 10%;\n  margin-top: 4px; }\n\n.navbar-toggler[aria-expanded=\"true\"] .navbar-toggler-bar.bar2 {\n  opacity: 0; }\n\n.navbar-toggler[aria-expanded=\"true\"] .navbar-toggler-bar.bar3 {\n  transform: rotate(-45deg);\n  transform-origin: 10% 90%;\n  margin-top: 3px; }\n\n@media (max-width: 991.98px) {\n  .navbar.navbar-transparent .navbar-collapse {\n    padding-top: 0.5rem;\n    padding-bottom: 0.5rem;\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }\n  .navbar.navbar-transparent .navbar-collapse.collapsing {\n    background: #fff; }\n  .navbar.navbar-transparent .navbar-collapse.show {\n    background: #fff; }\n    .navbar.navbar-transparent .navbar-collapse.show .nav-link,\n    .navbar.navbar-transparent .navbar-collapse.show i {\n      color: #344767; }\n  .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-collapse {\n    display: flex !important;\n    flex-basis: auto; }\n  .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-nav {\n    flex-direction: row; }\n  .navbar .navbar-collapse .navbar-nav .dropdown .dropdown-menu {\n    box-shadow: none !important; }\n    .navbar .navbar-collapse .navbar-nav .dropdown .dropdown-menu:before {\n      display: none !important; } }\n\n@media (max-width: 767.98px) {\n  .navbar-collapse {\n    position: relative; }\n    .navbar-collapse .navbar-nav {\n      width: 100%; }\n      .navbar-collapse .navbar-nav .nav-item.dropdown {\n        position: static; }\n        .navbar-collapse .navbar-nav .nav-item.dropdown .dropdown-menu {\n          left: 0;\n          right: 0; }\n          .navbar-collapse .navbar-nav .nav-item.dropdown .dropdown-menu.show:before {\n            content: none; } }\n\n@media (max-width: 575.98px) {\n  .navbar-nav .nav-item.dropdown .dropdown-menu {\n    left: 0;\n    right: auto; } }\n\n.navbar-vertical .navbar-brand > img,\n.navbar-vertical .navbar-brand-img {\n  max-width: 100%;\n  max-height: 2rem; }\n\n.navbar-vertical .navbar-nav .nav-link {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  font-weight: 300;\n  color: #fff; }\n  .navbar-vertical .navbar-nav .nav-link > i {\n    min-width: 1.8rem;\n    font-size: 1.5rem;\n    line-height: 1.5rem;\n    text-align: center; }\n  .navbar-vertical .navbar-nav .nav-link .dropdown-menu {\n    border: none; }\n    .navbar-vertical .navbar-nav .nav-link .dropdown-menu .dropdown-menu {\n      margin-left: 0.5rem; }\n  .navbar-vertical .navbar-nav .nav-link .avatar {\n    width: 1.875rem;\n    height: 1.875rem; }\n\n.navbar-vertical .navbar-nav .nav-sm .nav-link {\n  font-size: 0.8125rem; }\n\n.navbar-vertical .navbar-nav .nav-link {\n  display: flex;\n  align-items: center;\n  white-space: nowrap; }\n\n.navbar-vertical .navbar-heading {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  font-size: 0.75rem;\n  text-transform: uppercase;\n  letter-spacing: 0.04em; }\n\n.navbar-vertical.navbar-expand-xs {\n  display: block;\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  width: 100%;\n  max-width: 15.625rem !important;\n  overflow-y: auto;\n  padding: 0;\n  box-shadow: none; }\n  .navbar-vertical.navbar-expand-xs .navbar-collapse {\n    display: block;\n    overflow: auto;\n    height: calc(100vh - 360px); }\n  .navbar-vertical.navbar-expand-xs > [class*=\"container\"] {\n    flex-direction: column;\n    align-items: stretch;\n    min-height: 100%;\n    padding-left: 0;\n    padding-right: 0; }\n    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-xs > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n  .navbar-vertical.navbar-expand-xs.fixed-start {\n    left: 0; }\n  .navbar-vertical.navbar-expand-xs.fixed-end {\n    right: 0; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link {\n    padding-top: 0.75rem;\n    padding-bottom: 0.75rem;\n    margin: 0 1rem;\n    margin-bottom: 1.5px; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link .nav-link-text,\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link .sidenav-mini-icon,\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link .sidenav-normal,\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav-link i {\n      pointer-events: none; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav .nav-item {\n    width: 100%; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav > .nav-item {\n    margin-top: 0.125rem; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav > .nav-item .icon .ni {\n      top: 0; }\n  .navbar-vertical.navbar-expand-xs .lavalamp-object {\n    width: calc(100% - 1rem) !important;\n    background: theme-color(\"primary\");\n    color: color-yiq(#e91e63);\n    margin-right: 0.5rem;\n    margin-left: 0.5rem;\n    padding-left: 1rem;\n    padding-right: 1rem;\n    border-radius: 0.125rem; }\n  .navbar-vertical.navbar-expand-xs .navbar-nav .nav .nav-link {\n    padding-top: 0.75rem;\n    padding-bottom: 0.75rem;\n    padding-left: 15px; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav .nav-link > span.sidenav-normal {\n      transition: all 0.1s ease 0s; }\n    .navbar-vertical.navbar-expand-xs .navbar-nav .nav .nav-link.active {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem; }\n\n@media (min-width: 576px) {\n  .navbar-vertical.navbar-expand-sm {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-sm .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-sm > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 576px) and (-ms-high-contrast: none), (min-width: 576px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-sm > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 576px) {\n    .navbar-vertical.navbar-expand-sm.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-sm.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-sm .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-sm .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-sm .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 768px) {\n  .navbar-vertical.navbar-expand-md {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-md .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-md > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 768px) and (-ms-high-contrast: none), (min-width: 768px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-md > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 768px) {\n    .navbar-vertical.navbar-expand-md.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-md.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-md .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-md .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-md .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-md .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-md .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 992px) {\n  .navbar-vertical.navbar-expand-lg {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-lg .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-lg > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 992px) and (-ms-high-contrast: none), (min-width: 992px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-lg > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 992px) {\n    .navbar-vertical.navbar-expand-lg.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-lg.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-lg .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-lg .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-lg .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 1200px) {\n  .navbar-vertical.navbar-expand-xl {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-xl .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-xl > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 1200px) and (-ms-high-contrast: none), (min-width: 1200px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-xl > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 1200px) {\n    .navbar-vertical.navbar-expand-xl.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-xl.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-xl .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-xl .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-xl .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n@media (min-width: 1400px) {\n  .navbar-vertical.navbar-expand-xxl {\n    display: block;\n    position: fixed;\n    top: 0;\n    bottom: 0;\n    width: 100%;\n    max-width: 15.625rem !important;\n    overflow-y: auto;\n    padding: 0;\n    box-shadow: none; }\n    .navbar-vertical.navbar-expand-xxl .navbar-collapse {\n      display: block;\n      overflow: auto;\n      height: calc(100vh - 360px); }\n    .navbar-vertical.navbar-expand-xxl > [class*=\"container\"] {\n      flex-direction: column;\n      align-items: stretch;\n      min-height: 100%;\n      padding-left: 0;\n      padding-right: 0; } }\n    @media all and (min-width: 1400px) and (-ms-high-contrast: none), (min-width: 1400px) and (-ms-high-contrast: active) {\n      .navbar-vertical.navbar-expand-xxl > [class*=\"container\"] {\n        min-height: none;\n        height: 100%; } }\n\n@media (min-width: 1400px) {\n    .navbar-vertical.navbar-expand-xxl.fixed-start {\n      left: 0; }\n    .navbar-vertical.navbar-expand-xxl.fixed-end {\n      right: 0; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      margin: 0 1rem;\n      margin-bottom: 1.5px; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link .nav-link-text,\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link .sidenav-mini-icon,\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link .sidenav-normal,\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-link i {\n        pointer-events: none; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav .nav-item {\n      width: 100%; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav > .nav-item {\n      margin-top: 0.125rem; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav > .nav-item .icon .ni {\n        top: 0; }\n    .navbar-vertical.navbar-expand-xxl .lavalamp-object {\n      width: calc(100% - 1rem) !important;\n      background: theme-color(\"primary\");\n      color: color-yiq(#e91e63);\n      margin-right: 0.5rem;\n      margin-left: 0.5rem;\n      padding-left: 1rem;\n      padding-right: 1rem;\n      border-radius: 0.125rem; }\n    .navbar-vertical.navbar-expand-xxl .navbar-nav .nav .nav-link {\n      padding-top: 0.75rem;\n      padding-bottom: 0.75rem;\n      padding-left: 15px; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav .nav-link > span.sidenav-normal {\n        transition: all 0.1s ease 0s; }\n      .navbar-vertical.navbar-expand-xxl .navbar-nav .nav .nav-link.active {\n        padding-top: 0.75rem;\n        padding-bottom: 0.75rem; } }\n\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"primary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #7b809a 0%, #7b809a 100%); }\n\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"secondary\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #7b809a 0%, #7b809a 100%); }\n\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #4CAF50 0%, #4CAF50 100%); }\n\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"success\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #4CAF50 0%, #4CAF50 100%); }\n\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #1A73E8 0%, #1A73E8 100%); }\n\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"info\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #1A73E8 0%, #1A73E8 100%); }\n\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #fb8c00 0%, #fb8c00 100%); }\n\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"warning\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #fb8c00 0%, #fb8c00 100%); }\n\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #F44335 0%, #F44335 100%); }\n\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"danger\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #F44335 0%, #F44335 100%); }\n\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #f0f2f5 0%, #f0f2f5 100%); }\n\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"light\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #f0f2f5 0%, #f0f2f5 100%); }\n\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #344767 0%, #344767 100%); }\n\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"dark\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #344767 0%, #344767 100%); }\n\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n  background-image: linear-gradient(195deg, #fff 0%, #fff 100%); }\n\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n.sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n  background-color: rgba(199, 199, 199, 0.2); }\n  .sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .sidenav[data-color=\"white\"] .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n    background-image: linear-gradient(195deg, #fff 0%, #fff 100%); }\n\n.main-content,\n.sidenav {\n  transition: all 0.2s ease-in-out; }\n\n.sidenav {\n  z-index: 999; }\n  .sidenav .navbar-brand,\n  .sidenav .navbar-heading {\n    display: block; }\n  @media (min-width: 1200px) {\n    .sidenav:hover {\n      max-width: 15.625rem; }\n    .sidenav .sidenav-toggler {\n      padding: 1.5rem; }\n    .sidenav.fixed-start + .main-content {\n      margin-left: 17.125rem; }\n    .sidenav.fixed-end + .main-content {\n      margin-right: 17.125rem; } }\n  .sidenav .navbar-heading .docs-mini {\n    padding-left: 3px; }\n  .sidenav .navbar-heading {\n    transition: all 0.1s ease; }\n  .sidenav .navbar-brand {\n    padding: 1.5rem 2rem; }\n  .sidenav .collapse .nav-item .nav-link.active {\n    color: #fff !important; }\n    .sidenav .collapse .nav-item .nav-link.active i {\n      color: #fff !important; }\n\n.sidenav-header {\n  height: 4.875rem; }\n\n.sidenav-footer .card.card-background:after {\n  opacity: 0.65; }\n\n.g-sidenav-show .sidenav .nav-item .collapse {\n  height: auto;\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .g-sidenav-show .sidenav .nav-item .collapse {\n      transition: none; } }\n\n.g-sidenav-show .sidenav .nav-link-text {\n  transition: 0.3s ease;\n  opacity: 1; }\n\n.g-sidenav-show.rtl .navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"]:after {\n  margin-left: 0; }\n\n@media (max-width: 1199.98px) {\n  .g-sidenav-show.rtl .sidenav {\n    transform: translateX(17.125rem); }\n  .g-sidenav-show:not(.rtl) .sidenav {\n    transform: translateX(-17.125rem); }\n  .g-sidenav-show .sidenav.fixed-start + .main-content {\n    margin-left: 0 !important; }\n  .g-sidenav-show.g-sidenav-pinned .sidenav {\n    transform: translateX(0); } }\n\n.navbar-vertical.bg-white {\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }\n  .navbar-vertical.bg-white .navbar-nav .nav-link.active {\n    box-shadow: none; }\n\n.navbar-vertical.bg-transparent .navbar-nav .nav-link.active:after, .navbar-vertical.bg-white .navbar-nav .nav-link.active:after {\n  color: rgba(206, 212, 218, 0.7) !important; }\n\n.navbar-vertical .navbar-nav .nav-link.active {\n  font-weight: 400;\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  border-radius: 0.375rem;\n  margin-top: 1.5px;\n  margin-bottom: 1.5px; }\n\n.navbar-vertical .navbar-nav > .nav-item .nav-link.active {\n  color: #fff;\n  border-right-width: 0;\n  border-bottom-width: 0;\n  background-color: rgba(199, 199, 199, 0.2); }\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active,\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active {\n    background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item.active .nav-link.active span,\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item.active .nav-link.active span {\n      color: #fff; }\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n  .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active {\n    background-color: rgba(199, 199, 199, 0.2); }\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapse .nav-item .nav-link.active + .collapse .nav-item .nav-link.active,\n    .navbar-vertical .navbar-nav > .nav-item .nav-link.active + .collapsing .nav-item .nav-link.active + .collapse .nav-item .nav-link.active {\n      background-image: linear-gradient(195deg, #e91e63 0%, #e91e63 100%); }\n\n.navbar-main {\n  transition: box-shadow 0.25s ease-in, background-color 0.25s ease-in; }\n  .navbar-main.fixed-top {\n    width: calc(100% - (15.625rem + 1.5rem * 3)); }\n  .navbar-main.fixed-top + [class*=\"container\"] {\n    margin-top: 7.1875rem !important; }\n\n.navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"]:after {\n  display: inline-block;\n  font-style: normal;\n  font-variant: normal;\n  text-rendering: auto;\n  -webkit-font-smoothing: antialiased;\n  font-family: 'Font Awesome 5 Free';\n  font-weight: 700;\n  content: \"\\f107\";\n  margin-left: auto;\n  color: rgba(206, 212, 218, 0.7);\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"]:after {\n      transition: none; } }\n\n.navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"][aria-expanded=\"true\"]:after {\n  color: #CED4DA;\n  transform: rotate(180deg); }\n\n.navbar-vertical .navbar-nav .nav-link[data-bs-toggle=\"collapse\"].active:after {\n  color: #fff; }\n\n.navbar-vertical .navbar-nav .nav-item .collapse .nav,\n.navbar-vertical .navbar-nav .nav-item .collapsing .nav {\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .navbar-nav .nav-item .collapse .nav,\n    .navbar-vertical .navbar-nav .nav-item .collapsing .nav {\n      transition: none; } }\n  .navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item .nav-link,\n  .navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item .nav-link {\n    position: relative;\n    background-color: transparent;\n    box-shadow: none;\n    color: rgba(206, 212, 218, 0.7); }\n    .navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item .nav-link.active,\n    .navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item .nav-link.active {\n      color: #CED4DA; }\n  .navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item.active .nav-link,\n  .navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item.active .nav-link {\n    color: #CED4DA; }\n\n.navbar-vertical.blur .navbar-nav > .nav-item .nav-link {\n  background-color: transparent;\n  box-shadow: none; }\n\n.navbar-vertical .navbar-brand .navbar-brand-img,\n.navbar-vertical .navbar-brand span {\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .navbar-brand .navbar-brand-img,\n    .navbar-vertical .navbar-brand span {\n      transition: none; } }\n\n.navbar-vertical .nav-item .nav-link span.sidenav-mini-icon {\n  transition: all 0.2s ease-in-out;\n  text-align: center;\n  min-width: 1.8rem; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .nav-item .nav-link span.sidenav-mini-icon {\n      transition: none; } }\n\n.navbar-vertical .docs-info {\n  transition: all 0.2s ease-in-out; }\n  @media (prefers-reduced-motion: reduce) {\n    .navbar-vertical .docs-info {\n      transition: none; } }\n\n.navbar-vertical .nav-item .nav-link {\n  margin-top: 3px;\n  margin-bottom: 3px;\n  border-radius: 0.375rem;\n  margin-bottom: 1.5px;\n  margin-top: 1.5px; }\n  .navbar-vertical .nav-item .nav-link + .collapse .nav .nav-item > .nav-link,\n  .navbar-vertical .nav-item .nav-link + .collapsing .nav .nav-item > .nav-link {\n    margin-top: 1.5px;\n    margin-bottom: 1.5px; }\n    .navbar-vertical .nav-item .nav-link + .collapse .nav .nav-item > .nav-link + .collapse .nav .nav-item .nav-link,\n    .navbar-vertical .nav-item .nav-link + .collapse .nav .nav-item > .nav-link + .collapsing .nav .nav-item .nav-link,\n    .navbar-vertical .nav-item .nav-link + .collapsing .nav .nav-item > .nav-link + .collapse .nav .nav-item .nav-link,\n    .navbar-vertical .nav-item .nav-link + .collapsing .nav .nav-item > .nav-link + .collapsing .nav .nav-item .nav-link {\n      margin-top: 1.5px;\n      margin-bottom: 1.5px; }\n\n.navbar-vertical .nav-item:hover .nav-link {\n  background-color: rgba(199, 199, 199, 0.2);\n  border-radius: 0.375rem; }\n  .navbar-vertical .nav-item:hover .nav-link + .collapse .nav .nav-item:hover > .nav-link {\n    background-color: rgba(199, 199, 199, 0.2);\n    border-radius: 0.375rem; }\n  .navbar-vertical .nav-item:hover .nav-link + .collapse .nav .nav-item + .collapse .nav .nav-item:hover .nav-link {\n    background-color: rgba(199, 199, 199, 0.2);\n    border-radius: 0.375rem; }\n\n@media (min-width: 1200px) {\n  .g-sidenav-hidden.rtl .main-content {\n    margin-right: 6rem !important; }\n  .g-sidenav-hidden.rtl .navbar-vertical:hover {\n    max-width: 15.625rem !important; }\n  .g-sidenav-hidden.rtl .navbar-vertical .nav-item .nav-link .material-icons-round {\n    margin-right: 2px; }\n  .g-sidenav-hidden.rtl .sidenav:hover + .main-content {\n    margin-right: 17.125rem !important; }\n  .g-sidenav-hidden .navbar-vertical {\n    max-width: 6rem !important; }\n    .g-sidenav-hidden .navbar-vertical.fixed-start + .main-content {\n      margin-left: 7.5rem; }\n    .g-sidenav-hidden .navbar-vertical .navbar-brand img {\n      width: auto !important; }\n    .g-sidenav-hidden .navbar-vertical .navbar-brand span {\n      opacity: 0; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .icon {\n      padding: 10px; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .material-icons-round {\n      margin-left: 2px; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .nav-link-text,\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .sidenav-normal {\n      opacity: 0;\n      width: 0; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link .sidenav-mini-icon {\n      min-width: 1.8rem;\n      margin-left: 0.15rem !important; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .nav-link[data-bs-toggle=\"collapse\"]:after {\n      content: \"\";\n      opacity: 0; }\n    .g-sidenav-hidden .navbar-vertical .nav-item .collapse .nav {\n      margin-left: 0 !important;\n      padding-left: 0 !important; }\n      .g-sidenav-hidden .navbar-vertical .nav-item .collapse .nav .nav-item .nav-link {\n        margin-left: 1rem; }\n        .g-sidenav-hidden .navbar-vertical .nav-item .collapse .nav .nav-item .nav-link[data-bs-toggle=\"collapse\"]:after {\n          content: \"\\f107\"; }\n    .g-sidenav-hidden .navbar-vertical .card.card-background .icon-shape {\n      margin-bottom: 0 !important; }\n    .g-sidenav-hidden .navbar-vertical .card.card-background .docs-info {\n      opacity: 0;\n      width: 0;\n      height: 0; }\n    .g-sidenav-hidden .navbar-vertical:hover {\n      max-width: 15.625rem !important; }\n      .g-sidenav-hidden .navbar-vertical:hover.fixed-start + .main-content {\n        margin-left: 17.125rem; }\n      .g-sidenav-hidden .navbar-vertical:hover .navbar-brand span {\n        opacity: 1; }\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .nav-link .nav-link-text,\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .nav-link .sidenav-normal {\n        opacity: 1;\n        width: auto; }\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .nav-link[data-bs-toggle=\"collapse\"]:after {\n        content: \"\\f107\";\n        opacity: 1; }\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .collapse .nav .nav-item .collapse .nav,\n      .g-sidenav-hidden .navbar-vertical:hover .nav-item .collapse .nav .nav-item .collapsing .nav {\n        margin-left: 0 !important;\n        padding-left: 0 !important; }\n      .g-sidenav-hidden .navbar-vertical:hover .card.card-background .icon-shape {\n        margin-bottom: 1rem !important; }\n      .g-sidenav-hidden .navbar-vertical:hover .card.card-background .docs-info {\n        opacity: 1;\n        width: auto;\n        height: auto; } }\n\n.nav.nav-pills {\n  background: #f8f9fa;\n  border-radius: 0.75rem;\n  position: relative; }\n  .nav.nav-pills.nav-pills-vertical {\n    border-radius: 1.1875rem; }\n    .nav.nav-pills.nav-pills-vertical .nav-link.active {\n      border-radius: 0.875rem; }\n  .nav.nav-pills .nav-link {\n    z-index: 3;\n    color: #344767;\n    border-radius: 0.5rem;\n    background-color: inherit; }\n    .nav.nav-pills .nav-link.active {\n      -webkit-animation: 0.2s ease;\n              animation: 0.2s ease; }\n    .nav.nav-pills .nav-link:hover:not(.active) {\n      color: #344767; }\n  .nav.nav-pills.nav-pills-primary {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-primary .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-primary .moving-tab .nav-link.active {\n      background: #EC407A;\n      color: #EC407A; }\n  .nav.nav-pills.nav-pills-info {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-info .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-info .moving-tab .nav-link.active {\n      background: #49a3f1;\n      color: #49a3f1; }\n  .nav.nav-pills.nav-pills-success {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-success .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-success .moving-tab .nav-link.active {\n      background: #66BB6A;\n      color: #66BB6A; }\n  .nav.nav-pills.nav-pills-warning {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-warning .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-warning .moving-tab .nav-link.active {\n      background: #FFA726;\n      color: #FFA726; }\n  .nav.nav-pills.nav-pills-danger {\n    background: #fff;\n    color: #fff; }\n    .nav.nav-pills.nav-pills-danger .nav-link.active {\n      color: #fff; }\n    .nav.nav-pills.nav-pills-danger .moving-tab .nav-link.active {\n      background: #EF5350;\n      color: #EF5350; }\n  .nav.nav-pills .nav-item {\n    z-index: 3; }\n\n.moving-tab {\n  z-index: 1 !important; }\n  .moving-tab .nav-link {\n    color: #fff;\n    transition: .2s ease;\n    border-radius: 0.5rem; }\n    .moving-tab .nav-link.active {\n      color: #fff;\n      font-weight: 600;\n      box-shadow: 0px 1px 5px 1px #ddd;\n      -webkit-animation: 0.2s ease;\n              animation: 0.2s ease;\n      background: #fff; }\n    .moving-tab .nav-link:hover:not(.active) {\n      color: #344767; }\n\n.page-item.active .page-link {\n  box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07); }\n\n.page-item .page-link,\n.page-item span {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #7b809a;\n  padding: 0;\n  margin: 0 3px;\n  border-radius: 50% !important;\n  width: 36px;\n  height: 36px;\n  font-size: 0.875rem; }\n\n.pagination-lg .page-item .page-link,\n.pagination-lg .page-item span {\n  width: 46px;\n  height: 46px;\n  line-height: 46px; }\n\n.pagination-sm .page-item .page-link,\n.pagination-sm .page-item span {\n  width: 30px;\n  height: 30px;\n  line-height: 30px; }\n\n.pagination.pagination-primary .page-item.active > .page-link, .pagination.pagination-primary .page-item.active > .page-link:focus, .pagination.pagination-primary .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%);\n  border: none; }\n\n.pagination.pagination-secondary .page-item.active > .page-link, .pagination.pagination-secondary .page-item.active > .page-link:focus, .pagination.pagination-secondary .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #747b8a 0%, #495361 100%);\n  border: none; }\n\n.pagination.pagination-success .page-item.active > .page-link, .pagination.pagination-success .page-item.active > .page-link:focus, .pagination.pagination-success .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #66BB6A 0%, #43A047 100%);\n  border: none; }\n\n.pagination.pagination-info .page-item.active > .page-link, .pagination.pagination-info .page-item.active > .page-link:focus, .pagination.pagination-info .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #49a3f1 0%, #1A73E8 100%);\n  border: none; }\n\n.pagination.pagination-warning .page-item.active > .page-link, .pagination.pagination-warning .page-item.active > .page-link:focus, .pagination.pagination-warning .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #FFA726 0%, #FB8C00 100%);\n  border: none; }\n\n.pagination.pagination-danger .page-item.active > .page-link, .pagination.pagination-danger .page-item.active > .page-link:focus, .pagination.pagination-danger .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #EF5350 0%, #E53935 100%);\n  border: none; }\n\n.pagination.pagination-light .page-item.active > .page-link, .pagination.pagination-light .page-item.active > .page-link:focus, .pagination.pagination-light .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #EBEFF4 0%, #CED4DA 100%);\n  border: none; }\n\n.pagination.pagination-dark .page-item.active > .page-link, .pagination.pagination-dark .page-item.active > .page-link:focus, .pagination.pagination-dark .page-item.active > .page-link:hover {\n  background-image: linear-gradient(195deg, #42424a 0%, #191919 100%);\n  border: none; }\n\n.popover {\n  box-shadow: 0 0.3125rem 0.625rem 0 rgba(0, 0, 0, 0.12); }\n\n.popover .popover-header {\n  font-weight: 600; }\n\n.progress-bar {\n  height: 6px;\n  border-radius: 0.125rem; }\n\n.progress {\n  overflow: visible; }\n  .progress.progress-sm {\n    height: 4px; }\n  .progress.progress-lg {\n    height: 20px; }\n\n.rtl .breadcrumb .breadcrumb-item + .breadcrumb-item::before {\n  float: right;\n  padding-left: 0.5rem;\n  padding-right: 0; }\n\n.rtl .sidenav .navbar-nav {\n  width: 100%;\n  padding-right: 0; }\n\n.rtl .fixed-plugin .fixed-plugin-button {\n  left: 30px;\n  right: auto; }\n\n.rtl .fixed-plugin .card {\n  left: -360px !important;\n  right: auto; }\n\n.rtl .fixed-plugin.show .card {\n  right: auto;\n  left: 0 !important; }\n\n.rtl .timeline .timeline-content {\n  margin-right: 45px;\n  margin-left: 0; }\n\n.rtl .timeline .timeline-step {\n  transform: translateX(50%); }\n\n.rtl .timeline.timeline-one-side:before {\n  right: 1rem; }\n\n.rtl .timeline.timeline-one-side .timeline-step {\n  right: 1rem; }\n\n.rtl .form-check.form-switch .form-check-input:after {\n  transform: translateX(-1px); }\n\n.rtl .form-check.form-switch .form-check-input:checked:after {\n  transform: translateX(21px); }\n\n.rtl .avatar-group .avatar + .avatar {\n  margin-left: 0;\n  margin-right: -1rem; }\n\n.rtl .dropdown .dropdown-menu {\n  left: 0; }\n\n.rtl .input-group .input-group-text {\n  border-left: 0;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.rtl .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {\n  margin-right: -1px;\n  border-top-left-radius: 0.375rem;\n  border-bottom-left-radius: 0.375rem; }\n\n.rtl .input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3),\n.rtl .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {\n  border-top-right-radius: 0.375rem;\n  border-bottom-right-radius: 0.375rem; }\n\n.ripple {\n  display: block;\n  position: absolute;\n  background: rgba(255, 255, 255, 0.3);\n  border-radius: 100%;\n  transform: scale(0);\n  -webkit-animation: ripple 0.65s linear;\n          animation: ripple 0.65s linear; }\n\n@-webkit-keyframes ripple {\n  100% {\n    opacity: 0;\n    transform: scale(2.5); } }\n\n@keyframes ripple {\n  100% {\n    opacity: 0;\n    transform: scale(2.5); } }\n\n.btn.btn-facebook {\n  background-color: #3b5998;\n  color: #fff; }\n  .btn.btn-facebook:focus, .btn.btn-facebook:hover {\n    background-color: #344e86;\n    color: #fff; }\n  .btn.btn-facebook:active, .btn.btn-facebook:focus, .btn.btn-facebook:active:focus {\n    box-shadow: none; }\n  .btn.btn-facebook.btn-simple {\n    color: #344e86;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-facebook.btn-simple:hover, .btn.btn-facebook.btn-simple:focus, .btn.btn-facebook.btn-simple:hover:focus, .btn.btn-facebook.btn-simple:active, .btn.btn-facebook.btn-simple:hover:focus:active {\n      color: #344e86;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-facebook.btn-neutral {\n    color: #3b5998;\n    background-color: #fff; }\n    .btn.btn-facebook.btn-neutral:hover, .btn.btn-facebook.btn-neutral:focus, .btn.btn-facebook.btn-neutral:active {\n      color: #344e86; }\n\n.btn.btn-twitter {\n  background-color: #55acee;\n  color: #fff; }\n  .btn.btn-twitter:focus, .btn.btn-twitter:hover {\n    background-color: #3ea1ec;\n    color: #fff; }\n  .btn.btn-twitter:active, .btn.btn-twitter:focus, .btn.btn-twitter:active:focus {\n    box-shadow: none; }\n  .btn.btn-twitter.btn-simple {\n    color: #3ea1ec;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-twitter.btn-simple:hover, .btn.btn-twitter.btn-simple:focus, .btn.btn-twitter.btn-simple:hover:focus, .btn.btn-twitter.btn-simple:active, .btn.btn-twitter.btn-simple:hover:focus:active {\n      color: #3ea1ec;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-twitter.btn-neutral {\n    color: #55acee;\n    background-color: #fff; }\n    .btn.btn-twitter.btn-neutral:hover, .btn.btn-twitter.btn-neutral:focus, .btn.btn-twitter.btn-neutral:active {\n      color: #3ea1ec; }\n\n.btn.btn-pinterest {\n  background-color: #cc2127;\n  color: #fff; }\n  .btn.btn-pinterest:focus, .btn.btn-pinterest:hover {\n    background-color: #b21d22;\n    color: #fff; }\n  .btn.btn-pinterest:active, .btn.btn-pinterest:focus, .btn.btn-pinterest:active:focus {\n    box-shadow: none; }\n  .btn.btn-pinterest.btn-simple {\n    color: #b21d22;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-pinterest.btn-simple:hover, .btn.btn-pinterest.btn-simple:focus, .btn.btn-pinterest.btn-simple:hover:focus, .btn.btn-pinterest.btn-simple:active, .btn.btn-pinterest.btn-simple:hover:focus:active {\n      color: #b21d22;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-pinterest.btn-neutral {\n    color: #cc2127;\n    background-color: #fff; }\n    .btn.btn-pinterest.btn-neutral:hover, .btn.btn-pinterest.btn-neutral:focus, .btn.btn-pinterest.btn-neutral:active {\n      color: #b21d22; }\n\n.btn.btn-linkedin {\n  background-color: #0077B5;\n  color: #fff; }\n  .btn.btn-linkedin:focus, .btn.btn-linkedin:hover {\n    background-color: #00669c;\n    color: #fff; }\n  .btn.btn-linkedin:active, .btn.btn-linkedin:focus, .btn.btn-linkedin:active:focus {\n    box-shadow: none; }\n  .btn.btn-linkedin.btn-simple {\n    color: #00669c;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-linkedin.btn-simple:hover, .btn.btn-linkedin.btn-simple:focus, .btn.btn-linkedin.btn-simple:hover:focus, .btn.btn-linkedin.btn-simple:active, .btn.btn-linkedin.btn-simple:hover:focus:active {\n      color: #00669c;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-linkedin.btn-neutral {\n    color: #0077B5;\n    background-color: #fff; }\n    .btn.btn-linkedin.btn-neutral:hover, .btn.btn-linkedin.btn-neutral:focus, .btn.btn-linkedin.btn-neutral:active {\n      color: #00669c; }\n\n.btn.btn-dribbble {\n  background-color: #ea4c89;\n  color: #fff; }\n  .btn.btn-dribbble:focus, .btn.btn-dribbble:hover {\n    background-color: #e73177;\n    color: #fff; }\n  .btn.btn-dribbble:active, .btn.btn-dribbble:focus, .btn.btn-dribbble:active:focus {\n    box-shadow: none; }\n  .btn.btn-dribbble.btn-simple {\n    color: #e73177;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-dribbble.btn-simple:hover, .btn.btn-dribbble.btn-simple:focus, .btn.btn-dribbble.btn-simple:hover:focus, .btn.btn-dribbble.btn-simple:active, .btn.btn-dribbble.btn-simple:hover:focus:active {\n      color: #e73177;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-dribbble.btn-neutral {\n    color: #ea4c89;\n    background-color: #fff; }\n    .btn.btn-dribbble.btn-neutral:hover, .btn.btn-dribbble.btn-neutral:focus, .btn.btn-dribbble.btn-neutral:active {\n      color: #e73177; }\n\n.btn.btn-github {\n  background-color: #24292E;\n  color: #fff; }\n  .btn.btn-github:focus, .btn.btn-github:hover {\n    background-color: #171a1d;\n    color: #fff; }\n  .btn.btn-github:active, .btn.btn-github:focus, .btn.btn-github:active:focus {\n    box-shadow: none; }\n  .btn.btn-github.btn-simple {\n    color: #171a1d;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-github.btn-simple:hover, .btn.btn-github.btn-simple:focus, .btn.btn-github.btn-simple:hover:focus, .btn.btn-github.btn-simple:active, .btn.btn-github.btn-simple:hover:focus:active {\n      color: #171a1d;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-github.btn-neutral {\n    color: #24292E;\n    background-color: #fff; }\n    .btn.btn-github.btn-neutral:hover, .btn.btn-github.btn-neutral:focus, .btn.btn-github.btn-neutral:active {\n      color: #171a1d; }\n\n.btn.btn-youtube {\n  background-color: #e52d27;\n  color: #fff; }\n  .btn.btn-youtube:focus, .btn.btn-youtube:hover {\n    background-color: #d41f1a;\n    color: #fff; }\n  .btn.btn-youtube:active, .btn.btn-youtube:focus, .btn.btn-youtube:active:focus {\n    box-shadow: none; }\n  .btn.btn-youtube.btn-simple {\n    color: #d41f1a;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-youtube.btn-simple:hover, .btn.btn-youtube.btn-simple:focus, .btn.btn-youtube.btn-simple:hover:focus, .btn.btn-youtube.btn-simple:active, .btn.btn-youtube.btn-simple:hover:focus:active {\n      color: #d41f1a;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-youtube.btn-neutral {\n    color: #e52d27;\n    background-color: #fff; }\n    .btn.btn-youtube.btn-neutral:hover, .btn.btn-youtube.btn-neutral:focus, .btn.btn-youtube.btn-neutral:active {\n      color: #d41f1a; }\n\n.btn.btn-instagram {\n  background-color: #125688;\n  color: #fff; }\n  .btn.btn-instagram:focus, .btn.btn-instagram:hover {\n    background-color: #0e456d;\n    color: #fff; }\n  .btn.btn-instagram:active, .btn.btn-instagram:focus, .btn.btn-instagram:active:focus {\n    box-shadow: none; }\n  .btn.btn-instagram.btn-simple {\n    color: #0e456d;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-instagram.btn-simple:hover, .btn.btn-instagram.btn-simple:focus, .btn.btn-instagram.btn-simple:hover:focus, .btn.btn-instagram.btn-simple:active, .btn.btn-instagram.btn-simple:hover:focus:active {\n      color: #0e456d;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-instagram.btn-neutral {\n    color: #125688;\n    background-color: #fff; }\n    .btn.btn-instagram.btn-neutral:hover, .btn.btn-instagram.btn-neutral:focus, .btn.btn-instagram.btn-neutral:active {\n      color: #0e456d; }\n\n.btn.btn-reddit {\n  background-color: #ff4500;\n  color: #fff; }\n  .btn.btn-reddit:focus, .btn.btn-reddit:hover {\n    background-color: #e03d00;\n    color: #fff; }\n  .btn.btn-reddit:active, .btn.btn-reddit:focus, .btn.btn-reddit:active:focus {\n    box-shadow: none; }\n  .btn.btn-reddit.btn-simple {\n    color: #e03d00;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-reddit.btn-simple:hover, .btn.btn-reddit.btn-simple:focus, .btn.btn-reddit.btn-simple:hover:focus, .btn.btn-reddit.btn-simple:active, .btn.btn-reddit.btn-simple:hover:focus:active {\n      color: #e03d00;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-reddit.btn-neutral {\n    color: #ff4500;\n    background-color: #fff; }\n    .btn.btn-reddit.btn-neutral:hover, .btn.btn-reddit.btn-neutral:focus, .btn.btn-reddit.btn-neutral:active {\n      color: #e03d00; }\n\n.btn.btn-tumblr {\n  background-color: #35465c;\n  color: #fff; }\n  .btn.btn-tumblr:focus, .btn.btn-tumblr:hover {\n    background-color: #2a3749;\n    color: #fff; }\n  .btn.btn-tumblr:active, .btn.btn-tumblr:focus, .btn.btn-tumblr:active:focus {\n    box-shadow: none; }\n  .btn.btn-tumblr.btn-simple {\n    color: #2a3749;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-tumblr.btn-simple:hover, .btn.btn-tumblr.btn-simple:focus, .btn.btn-tumblr.btn-simple:hover:focus, .btn.btn-tumblr.btn-simple:active, .btn.btn-tumblr.btn-simple:hover:focus:active {\n      color: #2a3749;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-tumblr.btn-neutral {\n    color: #35465c;\n    background-color: #fff; }\n    .btn.btn-tumblr.btn-neutral:hover, .btn.btn-tumblr.btn-neutral:focus, .btn.btn-tumblr.btn-neutral:active {\n      color: #2a3749; }\n\n.btn.btn-behance {\n  background-color: #1769ff;\n  color: #fff; }\n  .btn.btn-behance:focus, .btn.btn-behance:hover {\n    background-color: #0057f7;\n    color: #fff; }\n  .btn.btn-behance:active, .btn.btn-behance:focus, .btn.btn-behance:active:focus {\n    box-shadow: none; }\n  .btn.btn-behance.btn-simple {\n    color: #0057f7;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-behance.btn-simple:hover, .btn.btn-behance.btn-simple:focus, .btn.btn-behance.btn-simple:hover:focus, .btn.btn-behance.btn-simple:active, .btn.btn-behance.btn-simple:hover:focus:active {\n      color: #0057f7;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-behance.btn-neutral {\n    color: #1769ff;\n    background-color: #fff; }\n    .btn.btn-behance.btn-neutral:hover, .btn.btn-behance.btn-neutral:focus, .btn.btn-behance.btn-neutral:active {\n      color: #0057f7; }\n\n.btn.btn-vimeo {\n  background-color: #1AB7EA;\n  color: #fff; }\n  .btn.btn-vimeo:focus, .btn.btn-vimeo:hover {\n    background-color: #13a3d2;\n    color: #fff; }\n  .btn.btn-vimeo:active, .btn.btn-vimeo:focus, .btn.btn-vimeo:active:focus {\n    box-shadow: none; }\n  .btn.btn-vimeo.btn-simple {\n    color: #13a3d2;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-vimeo.btn-simple:hover, .btn.btn-vimeo.btn-simple:focus, .btn.btn-vimeo.btn-simple:hover:focus, .btn.btn-vimeo.btn-simple:active, .btn.btn-vimeo.btn-simple:hover:focus:active {\n      color: #13a3d2;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-vimeo.btn-neutral {\n    color: #1AB7EA;\n    background-color: #fff; }\n    .btn.btn-vimeo.btn-neutral:hover, .btn.btn-vimeo.btn-neutral:focus, .btn.btn-vimeo.btn-neutral:active {\n      color: #13a3d2; }\n\n.btn.btn-slack {\n  background-color: #3aaf85;\n  color: #fff; }\n  .btn.btn-slack:focus, .btn.btn-slack:hover {\n    background-color: #329874;\n    color: #fff; }\n  .btn.btn-slack:active, .btn.btn-slack:focus, .btn.btn-slack:active:focus {\n    box-shadow: none; }\n  .btn.btn-slack.btn-simple {\n    color: #329874;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none; }\n    .btn.btn-slack.btn-simple:hover, .btn.btn-slack.btn-simple:focus, .btn.btn-slack.btn-simple:hover:focus, .btn.btn-slack.btn-simple:active, .btn.btn-slack.btn-simple:hover:focus:active {\n      color: #329874;\n      background: transparent !important;\n      box-shadow: none !important; }\n  .btn.btn-slack.btn-neutral {\n    color: #3aaf85;\n    background-color: #fff; }\n    .btn.btn-slack.btn-neutral:hover, .btn.btn-slack.btn-neutral:focus, .btn.btn-slack.btn-neutral:active {\n      color: #329874; }\n\n.table thead th {\n  padding: 0.75rem 1.5rem;\n  text-transform: capitalize;\n  letter-spacing: 0px;\n  border-bottom: 1px solid #f0f2f5; }\n\n.table th {\n  font-weight: 600; }\n\n.table td .progress {\n  height: 3px;\n  width: 120px;\n  margin: 0; }\n  .table td .progress .progress-bar {\n    height: 3px; }\n\n.table td,\n.table th {\n  white-space: nowrap; }\n\n.table.align-items-center td,\n.table.align-items-center th {\n  vertical-align: middle; }\n\n.table tbody tr:last-child td {\n  border-width: 0; }\n\n.table > :not(:last-child) > :last-child > * {\n  border-bottom-color: #f0f2f5; }\n\n.table > :not(:first-child) {\n  border-top: 1px solid currentColor; }\n\n.timeline {\n  position: relative; }\n  .timeline:before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 1rem;\n    height: 100%;\n    border-right: 2px solid #e5e5e5; }\n  .timeline.timeline-dark:before {\n    border-right-color: #4a4a4a; }\n\n.timeline-block {\n  position: relative; }\n  .timeline-block:after {\n    content: \"\";\n    display: table;\n    clear: both; }\n  .timeline-block:first-child {\n    margin-top: 0; }\n  .timeline-block:last-child {\n    margin-bottom: 0; }\n\n.timeline-step {\n  position: absolute;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  left: 0;\n  width: 26px;\n  height: 26px;\n  border-radius: 50%;\n  background: #fff;\n  text-align: center;\n  transform: translateX(-50%);\n  font-size: 1rem;\n  font-weight: 600;\n  z-index: 1; }\n  .timeline-step svg, .timeline-step i {\n    line-height: 1.4; }\n\n.timeline-content {\n  position: relative;\n  margin-left: 45px;\n  padding-top: 0.35rem;\n  position: relative;\n  top: -6px; }\n  .timeline-content:after {\n    content: \"\";\n    display: table;\n    clear: both; }\n\n@media (min-width: 992px) {\n  .timeline:before {\n    left: 50%;\n    margin-left: -1px; }\n  .timeline-step {\n    left: 50%; }\n  .timeline-content {\n    width: 38%; }\n  .timeline-block:nth-child(even) .timeline-content {\n    float: right; } }\n\n.timeline-one-side:before {\n  left: 1rem; }\n\n.timeline-one-side .timeline-step {\n  left: 1rem; }\n\n.timeline-one-side .timeline-content {\n  width: auto; }\n\n@media (min-width: 992px) {\n  .timeline-one-side .timeline-content {\n    max-width: 30rem; } }\n\n.timeline-one-side .timeline-block:nth-child(even) .timeline-content {\n  float: none; }\n\n.tilt {\n  transform-style: preserve-3d; }\n  .tilt .up {\n    transform: translateZ(50px) scale(0.7) !important;\n    transition: all 0.5s; }\n\n.bs-tooltip-auto[x-placement^=right] .tooltip-arrow,\n.bs-tooltip-right .tooltip-arrow {\n  left: 1px; }\n\n.bs-tooltip-auto[x-placement^=left] .tooltip-arrow,\n.bs-tooltip-left .tooltip-arrow {\n  right: 1px; }\n\nhtml * {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale; }\n\nbody {\n  font-weight: 400;\n  line-height: 1.6; }\n\nh1, .h1, .h1 {\n  font-size: 3rem;\n  line-height: 1.25;\n  letter-spacing: 0; }\n  @media (max-width: 575.98px) {\n    h1, .h1, .h1 {\n      font-size: calc(1.425rem + 2.1vw); } }\n\nh2, .h2, .h2 {\n  font-size: 2.25rem;\n  line-height: 1.3;\n  letter-spacing: 0.05rem; }\n  @media (max-width: 575.98px) {\n    h2, .h2, .h2 {\n      font-size: calc(1.35rem + 1.2vw); } }\n\nh3, .h3, .h3 {\n  font-size: 1.875rem;\n  line-height: 1.375; }\n  @media (max-width: 575.98px) {\n    h3, .h3, .h3 {\n      font-size: calc(1.3125rem + 0.75vw); } }\n\nh4, .h4, .h4 {\n  font-size: 1.5rem;\n  line-height: 1.375; }\n  @media (max-width: 575.98px) {\n    h4, .h4, .h4 {\n      font-size: calc(1.275rem + 0.3vw); } }\n\nh5, .h5, .h5 {\n  font-size: 1.25rem;\n  line-height: 1.375; }\n  @media (max-width: 575.98px) {\n    h5, .h5, .h5 {\n      font-size: 1.25rem; } }\n\nh6, .h6, .h6 {\n  font-size: 1rem;\n  line-height: 1.625; }\n\np, .p {\n  font-size: 1rem;\n  font-weight: 400;\n  line-height: 1.6; }\n\n.lead {\n  font-size: 1.25rem;\n  font-weight: 400;\n  line-height: 1.625; }\n\nh1, .h1, .h1, h2, .h2, .h2, h3, .h3, .h3 {\n  font-weight: 600;\n  font-family: \"Roboto Slab\", sans-serif; }\n\nh4, .h4, .h4, h5, .h5, .h5, h6, .h6, .h6 {\n  font-weight: 600; }\n\nh1, .h1, .h1, h2, .h2, .h2, h3, .h3, .h3, h4, .h4, .h4 {\n  letter-spacing: -0.05rem; }\n\na {\n  letter-spacing: 0rem;\n  color: #344767; }\n\n.text-sm {\n  line-height: 1.5; }\n\n.text-xs {\n  line-height: 1.25; }\n\np, .p {\n  font-size: 1rem; }\n\n.lead {\n  font-size: 1.25rem; }\n\n.text-lg {\n  font-size: 1.125rem !important; }\n\n.text-md {\n  font-size: 1rem !important; }\n\n.text-sm {\n  font-size: 0.875rem !important; }\n\n.text-xs {\n  font-size: 0.75rem !important; }\n\n.text-xxs {\n  font-size: 0.65rem !important; }\n\np {\n  line-height: 1.625;\n  font-weight: 300; }\n\n.text-sans-serif {\n  font-family: \"Roboto\", Helvetica, Arial, sans-serif !important; }\n\n.text-monospace {\n  font-family: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !important; }\n\n.text-justify {\n  text-align: justify !important; }\n\n.text-wrap {\n  white-space: normal !important; }\n\n.text-nowrap {\n  white-space: nowrap !important; }\n\n.text-truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap; }\n\n.font-weight-light {\n  font-weight: 300 !important; }\n\n.font-weight-lighter {\n  font-weight: lighter !important; }\n\n.font-weight-normal {\n  font-weight: 400 !important; }\n\n.font-weight-bold {\n  font-weight: 600 !important; }\n\n.font-weight-bolder {\n  font-weight: 700 !important; }\n\n.font-italic {\n  font-style: italic !important; }\n\n.text-gradient {\n  background-clip: text;\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  position: relative;\n  z-index: 1; }\n  .text-gradient.text-primary {\n    background-image: linear-gradient(195deg, #EC407A, #D81B60); }\n  .text-gradient.text-info {\n    background-image: linear-gradient(195deg, #49a3f1, #1A73E8); }\n  .text-gradient.text-success {\n    background-image: linear-gradient(195deg, #66BB6A, #43A047); }\n  .text-gradient.text-warning {\n    background-image: linear-gradient(195deg, #FFA726, #FB8C00); }\n  .text-gradient.text-danger {\n    background-image: linear-gradient(195deg, #EF5350, #E53935); }\n  .text-gradient.text-dark {\n    background-image: linear-gradient(195deg, #42424a, #191919); }\n\n.blockquote {\n  border-left: 3px solid #6c757d; }\n  .blockquote > span {\n    font-style: italic; }\n\n.text-muted {\n  color: #7b809a !important; }\n\n.text-black-50 {\n  color: rgba(0, 0, 0, 0.5) !important; }\n\n.text-white-50 {\n  color: rgba(255, 255, 255, 0.5) !important; }\n\n.text-decoration-none {\n  text-decoration: none !important; }\n\n.text-break {\n  word-wrap: break-word !important; }\n\n.text-reset {\n  color: inherit !important; }\n\n.letter-wider {\n  letter-spacing: 0.05rem; }\n\n.letter-normal {\n  letter-spacing: 0rem; }\n\n.letter-tighter {\n  letter-spacing: -0.05rem; }\n\n.text-lighter {\n  font-weight: lighter; }\n\n.text-light {\n  font-weight: 300; }\n\n.text-normal {\n  font-weight: 400; }\n\n.text-bold {\n  font-weight: 600; }\n\n.text-bolder {\n  font-weight: 700; }\n\n.text-2xl {\n  font-size: 1.5rem; }\n\n.text-3xl {\n  font-size: 1.875rem; }\n\n.text-4xl {\n  font-size: 2rem; }\n\n.text-5xl {\n  font-size: 2.25rem; }\n\n.text-6xl {\n  font-size: 3rem; }\n\n.text-7xl {\n  font-size: 3.75rem; }\n\n.text-8xl {\n  font-size: 4rem; }\n\n.text-9xl {\n  font-size: 5rem; }\n\n.flatpickr-calendar {\n  background: transparent;\n  opacity: 0;\n  display: none;\n  text-align: center;\n  visibility: hidden;\n  padding: 0;\n  -webkit-animation: none;\n  animation: none;\n  direction: ltr;\n  border: 0;\n  font-size: 14px;\n  line-height: 24px;\n  border-radius: 0.75rem;\n  position: absolute;\n  width: 307.875px;\n  box-sizing: border-box;\n  touch-action: manipulation;\n  background: #fff;\n  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  transform: scale(0.95) !important; }\n\n.flatpickr-calendar.open,\n.flatpickr-calendar.inline {\n  opacity: 1;\n  max-height: 640px;\n  visibility: visible;\n  transform: scale(1) !important; }\n\n.flatpickr-calendar.open {\n  display: inline-block;\n  z-index: 99999; }\n\n.flatpickr-calendar.animate.open {\n  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);\n  animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1); }\n\n.flatpickr-calendar.inline {\n  display: block;\n  position: relative;\n  top: 2px; }\n\n.flatpickr-calendar.static {\n  position: absolute;\n  top: calc(100% + 2px); }\n\n.flatpickr-calendar.static.open {\n  z-index: 999;\n  display: block; }\n\n.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {\n  box-shadow: none !important; }\n\n.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {\n  box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6; }\n\n.flatpickr-calendar .hasWeeks .dayContainer,\n.flatpickr-calendar .hasTime .dayContainer {\n  border-bottom: 0;\n  border-bottom-right-radius: 0;\n  border-bottom-left-radius: 0; }\n\n.flatpickr-calendar .hasWeeks .dayContainer {\n  border-left: 0; }\n\n.flatpickr-calendar.hasTime .flatpickr-time {\n  height: 40px;\n  border-top: 1px solid #e6e6e6; }\n\n.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {\n  height: auto; }\n\n.flatpickr-calendar:before,\n.flatpickr-calendar:after {\n  position: absolute;\n  display: block;\n  pointer-events: none;\n  border: solid transparent;\n  content: '';\n  height: 0;\n  width: 0;\n  left: 22px; }\n\n.flatpickr-calendar.rightMost:before,\n.flatpickr-calendar.arrowRight:before,\n.flatpickr-calendar.rightMost:after,\n.flatpickr-calendar.arrowRight:after {\n  left: auto;\n  right: 22px; }\n\n.flatpickr-calendar.arrowCenter:before,\n.flatpickr-calendar.arrowCenter:after {\n  left: 50%;\n  right: 50%; }\n\n.flatpickr-calendar:before {\n  border-width: 5px;\n  margin: 0 -5px; }\n\n.flatpickr-calendar:after {\n  border-width: 4px;\n  margin: 0 -4px; }\n\n.flatpickr-calendar.arrowTop:before,\n.flatpickr-calendar.arrowTop:after {\n  bottom: 100%; }\n\n.flatpickr-calendar.arrowTop:before {\n  border-bottom-color: #fff; }\n\n.flatpickr-calendar.arrowTop:after {\n  border-bottom-color: #fff; }\n\n.flatpickr-calendar.arrowBottom:before,\n.flatpickr-calendar.arrowBottom:after {\n  top: 100%; }\n\n.flatpickr-calendar.arrowBottom:before {\n  border-top-color: #e6e6e6; }\n\n.flatpickr-calendar.arrowBottom:after {\n  border-top-color: #fff; }\n\n.flatpickr-calendar:focus {\n  outline: 0; }\n\n.flatpickr-wrapper {\n  position: relative;\n  display: inline-block; }\n\n.flatpickr-months {\n  display: flex; }\n\n.flatpickr-months .flatpickr-month {\n  background: transparent;\n  color: #344767;\n  fill: rgba(0, 0, 0, 0.8);\n  height: 34px;\n  line-height: 1;\n  text-align: center;\n  position: relative;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n  overflow: hidden;\n  flex: 1; }\n\n.flatpickr-months .flatpickr-prev-month,\n.flatpickr-months .flatpickr-next-month {\n  text-decoration: none;\n  cursor: pointer;\n  position: absolute;\n  top: 0;\n  height: 34px;\n  padding: 10px;\n  z-index: 3;\n  color: rgba(0, 0, 0, 0.9);\n  fill: rgba(0, 0, 0, 0.9); }\n\n.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,\n.flatpickr-months .flatpickr-next-month.flatpickr-disabled {\n  display: none; }\n\n.flatpickr-months .flatpickr-prev-month i,\n.flatpickr-months .flatpickr-next-month i {\n  position: relative; }\n\n.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,\n.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {\n  /*\n      /*rtl:begin:ignore*/\n  /*\n      */\n  left: 0;\n  /*\n      /*rtl:end:ignore*/\n  /*\n      */ }\n\n/*\n      /*rtl:begin:ignore*/\n/*\n      /*rtl:end:ignore*/\n.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,\n.flatpickr-months .flatpickr-next-month.flatpickr-next-month {\n  /*\n      /*rtl:begin:ignore*/\n  /*\n      */\n  right: 0;\n  /*\n      /*rtl:end:ignore*/\n  /*\n      */ }\n\n/*\n      /*rtl:begin:ignore*/\n/*\n      /*rtl:end:ignore*/\n.flatpickr-months .flatpickr-prev-month:hover,\n.flatpickr-months .flatpickr-next-month:hover {\n  color: #959ea9; }\n\n.flatpickr-months .flatpickr-prev-month:hover svg,\n.flatpickr-months .flatpickr-next-month:hover svg {\n  fill: #f64747; }\n\n.flatpickr-months .flatpickr-prev-month svg,\n.flatpickr-months .flatpickr-next-month svg {\n  width: 14px;\n  height: 14px; }\n\n.flatpickr-months .flatpickr-prev-month svg path,\n.flatpickr-months .flatpickr-next-month svg path {\n  transition: fill 0.1s;\n  fill: inherit; }\n\n.numInputWrapper {\n  position: relative;\n  height: auto; }\n\n.numInputWrapper input,\n.numInputWrapper span {\n  display: inline-block; }\n\n.numInputWrapper input {\n  width: 100%; }\n\n.numInputWrapper input::-ms-clear {\n  display: none; }\n\n.numInputWrapper input::-webkit-outer-spin-button,\n.numInputWrapper input::-webkit-inner-spin-button {\n  margin: 0;\n  -webkit-appearance: none; }\n\n.numInputWrapper span {\n  position: absolute;\n  right: 0;\n  width: 14px;\n  padding: 0 4px 0 2px;\n  height: 50%;\n  line-height: 50%;\n  opacity: 0;\n  cursor: pointer;\n  border: 1px solid rgba(57, 57, 57, 0.15);\n  box-sizing: border-box; }\n\n.numInputWrapper span:hover {\n  background: rgba(0, 0, 0, 0.1); }\n\n.numInputWrapper span:active {\n  background: rgba(0, 0, 0, 0.2); }\n\n.numInputWrapper span:after {\n  display: block;\n  content: \"\";\n  position: absolute; }\n\n.numInputWrapper span.arrowUp {\n  top: 0;\n  border-bottom: 0; }\n\n.numInputWrapper span.arrowUp:after {\n  border-left: 4px solid transparent;\n  border-right: 4px solid transparent;\n  border-bottom: 4px solid rgba(57, 57, 57, 0.6);\n  top: 26%; }\n\n.numInputWrapper span.arrowDown {\n  top: 50%; }\n\n.numInputWrapper span.arrowDown:after {\n  border-left: 4px solid transparent;\n  border-right: 4px solid transparent;\n  border-top: 4px solid rgba(57, 57, 57, 0.6);\n  top: 40%; }\n\n.numInputWrapper span svg {\n  width: inherit;\n  height: auto; }\n\n.numInputWrapper span svg path {\n  fill: rgba(0, 0, 0, 0.5); }\n\n.numInputWrapper:hover {\n  background: rgba(0, 0, 0, 0.05); }\n\n.numInputWrapper:hover span {\n  opacity: 1; }\n\n.flatpickr-current-month {\n  font-size: 135%;\n  line-height: inherit;\n  font-weight: 300;\n  color: inherit;\n  position: absolute;\n  width: 75%;\n  left: 12.5%;\n  padding: 7.48px 0 0 0;\n  line-height: 1;\n  height: 34px;\n  display: inline-block;\n  text-align: center;\n  transform: translate3d(0px, 0px, 0px); }\n\n.flatpickr-current-month span.cur-month {\n  font-family: inherit;\n  font-weight: 700;\n  color: inherit;\n  display: inline-block;\n  margin-left: 0.5ch;\n  padding: 0; }\n\n.flatpickr-current-month span.cur-month:hover {\n  background: rgba(0, 0, 0, 0.05); }\n\n.flatpickr-current-month .numInputWrapper {\n  width: 6ch;\n  width: 7ch\\0;\n  display: inline-block; }\n\n.flatpickr-current-month .numInputWrapper span.arrowUp:after {\n  border-bottom-color: rgba(0, 0, 0, 0.9); }\n\n.flatpickr-current-month .numInputWrapper span.arrowDown:after {\n  border-top-color: rgba(0, 0, 0, 0.9); }\n\n.flatpickr-current-month input.cur-year {\n  background: transparent;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: text;\n  padding: 0 0 0 0.5ch;\n  margin: 0;\n  display: inline-block;\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: 300;\n  line-height: inherit;\n  height: auto;\n  border: 0;\n  border-radius: 0;\n  vertical-align: initial;\n  -webkit-appearance: textfield;\n  -moz-appearance: textfield;\n  appearance: textfield; }\n\n.flatpickr-current-month input.cur-year:focus {\n  outline: 0; }\n\n.flatpickr-current-month input.cur-year[disabled],\n.flatpickr-current-month input.cur-year[disabled]:hover {\n  font-size: 100%;\n  color: rgba(0, 0, 0, 0.5);\n  background: transparent;\n  pointer-events: none; }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months {\n  appearance: menulist;\n  background: transparent;\n  border: none;\n  border-radius: 0;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: pointer;\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: 300;\n  height: auto;\n  line-height: inherit;\n  margin: -1px 0 0 0;\n  outline: none;\n  padding: 0 0 0 0.5ch;\n  position: relative;\n  vertical-align: initial;\n  -webkit-box-sizing: border-box;\n  -webkit-appearance: menulist;\n  -moz-appearance: menulist;\n  width: auto; }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months:focus,\n.flatpickr-current-month .flatpickr-monthDropdown-months:active {\n  outline: none; }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months:hover {\n  background: rgba(0, 0, 0, 0.05); }\n\n.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {\n  background-color: transparent;\n  outline: none;\n  padding: 0; }\n\n.flatpickr-weekdays {\n  background: transparent;\n  text-align: center;\n  overflow: hidden;\n  width: 100%;\n  display: flex;\n  align-items: center;\n  height: 28px; }\n\n.flatpickr-weekdays .flatpickr-weekdaycontainer {\n  display: flex;\n  flex: 1; }\n\nspan.flatpickr-weekday {\n  cursor: default;\n  font-size: 90%;\n  background: transparent;\n  color: rgba(0, 0, 0, 0.54);\n  line-height: 1;\n  margin: 0;\n  text-align: center;\n  display: block;\n  flex: 1;\n  font-weight: bolder; }\n\n.dayContainer,\n.flatpickr-weeks {\n  padding: 1px 0 0 0; }\n\n.flatpickr-days {\n  position: relative;\n  overflow: hidden;\n  display: flex;\n  align-items: flex-start;\n  width: 307.875px; }\n\n.flatpickr-days:focus {\n  outline: 0; }\n\n.dayContainer {\n  padding: 0;\n  outline: 0;\n  text-align: left;\n  width: 307.875px;\n  min-width: 307.875px;\n  max-width: 307.875px;\n  box-sizing: border-box;\n  display: inline-block;\n  display: flex;\n  flex-wrap: wrap;\n  -ms-flex-wrap: wrap;\n  justify-content: space-around;\n  transform: translate3d(0px, 0px, 0px);\n  opacity: 1; }\n\n.dayContainer + .dayContainer {\n  box-shadow: -1px 0 0 #e6e6e6; }\n\n.flatpickr-day {\n  background: none;\n  border: 1px solid transparent;\n  border-radius: 150px;\n  box-sizing: border-box;\n  color: #344767;\n  cursor: pointer;\n  font-weight: 400;\n  width: 14.2857143%;\n  flex-basis: 14.2857143%;\n  max-width: 39px;\n  height: 39px;\n  line-height: 39px;\n  margin: 0;\n  display: inline-block;\n  position: relative;\n  justify-content: center;\n  text-align: center; }\n\n.flatpickr-day.inRange,\n.flatpickr-day.prevMonthDay.inRange,\n.flatpickr-day.nextMonthDay.inRange,\n.flatpickr-day.today.inRange,\n.flatpickr-day.prevMonthDay.today.inRange,\n.flatpickr-day.nextMonthDay.today.inRange,\n.flatpickr-day:hover,\n.flatpickr-day.prevMonthDay:hover,\n.flatpickr-day.nextMonthDay:hover,\n.flatpickr-day:focus,\n.flatpickr-day.prevMonthDay:focus,\n.flatpickr-day.nextMonthDay:focus {\n  cursor: pointer;\n  outline: 0;\n  background: #e6e6e6;\n  border-color: #e6e6e6; }\n\n.flatpickr-day.today {\n  border-color: #959ea9; }\n\n.flatpickr-day.today:hover,\n.flatpickr-day.today:focus {\n  border-color: #959ea9;\n  background: #959ea9;\n  color: #fff; }\n\n.flatpickr-day.selected,\n.flatpickr-day.startRange,\n.flatpickr-day.endRange,\n.flatpickr-day.selected.inRange,\n.flatpickr-day.startRange.inRange,\n.flatpickr-day.endRange.inRange,\n.flatpickr-day.selected:focus,\n.flatpickr-day.startRange:focus,\n.flatpickr-day.endRange:focus,\n.flatpickr-day.selected:hover,\n.flatpickr-day.startRange:hover,\n.flatpickr-day.endRange:hover,\n.flatpickr-day.selected.prevMonthDay,\n.flatpickr-day.startRange.prevMonthDay,\n.flatpickr-day.endRange.prevMonthDay,\n.flatpickr-day.selected.nextMonthDay,\n.flatpickr-day.startRange.nextMonthDay,\n.flatpickr-day.endRange.nextMonthDay {\n  background: #569ff7;\n  box-shadow: none;\n  color: #fff;\n  border-color: #569ff7; }\n\n.flatpickr-day.selected.startRange,\n.flatpickr-day.startRange.startRange,\n.flatpickr-day.endRange.startRange {\n  border-radius: 50px 0 0 50px; }\n\n.flatpickr-day.selected.endRange,\n.flatpickr-day.startRange.endRange,\n.flatpickr-day.endRange.endRange {\n  border-radius: 0 50px 50px 0; }\n\n.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {\n  box-shadow: -10px 0 0 #569ff7; }\n\n.flatpickr-day.selected.startRange.endRange,\n.flatpickr-day.startRange.startRange.endRange,\n.flatpickr-day.endRange.startRange.endRange {\n  border-radius: 50px; }\n\n.flatpickr-day.inRange {\n  border-radius: 0;\n  box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6; }\n\n.flatpickr-day.flatpickr-disabled,\n.flatpickr-day.flatpickr-disabled:hover,\n.flatpickr-day.prevMonthDay,\n.flatpickr-day.nextMonthDay,\n.flatpickr-day.notAllowed,\n.flatpickr-day.notAllowed.prevMonthDay,\n.flatpickr-day.notAllowed.nextMonthDay {\n  color: rgba(57, 57, 57, 0.3);\n  background: transparent;\n  border-color: transparent;\n  cursor: default; }\n\n.flatpickr-day.flatpickr-disabled,\n.flatpickr-day.flatpickr-disabled:hover {\n  cursor: not-allowed;\n  color: rgba(57, 57, 57, 0.1); }\n\n.flatpickr-day.week.selected {\n  border-radius: 0;\n  box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7; }\n\n.flatpickr-day.hidden {\n  visibility: hidden; }\n\n.rangeMode .flatpickr-day {\n  margin-top: 1px; }\n\n.flatpickr-weekwrapper {\n  float: left; }\n\n.flatpickr-weekwrapper .flatpickr-weeks {\n  padding: 0 12px;\n  box-shadow: 1px 0 0 #e6e6e6; }\n\n.flatpickr-weekwrapper .flatpickr-weekday {\n  float: none;\n  width: 100%;\n  line-height: 28px; }\n\n.flatpickr-weekwrapper span.flatpickr-day,\n.flatpickr-weekwrapper span.flatpickr-day:hover {\n  display: block;\n  width: 100%;\n  max-width: none;\n  color: rgba(57, 57, 57, 0.3);\n  background: transparent;\n  cursor: default;\n  border: none; }\n\n.flatpickr-innerContainer {\n  display: block;\n  display: flex;\n  box-sizing: border-box;\n  overflow: hidden; }\n\n.flatpickr-rContainer {\n  display: inline-block;\n  padding: 0;\n  box-sizing: border-box; }\n\n.flatpickr-time {\n  text-align: center;\n  outline: 0;\n  display: block;\n  height: 0;\n  line-height: 40px;\n  max-height: 40px;\n  box-sizing: border-box;\n  overflow: hidden;\n  display: flex; }\n\n.flatpickr-time:after {\n  content: \"\";\n  display: table;\n  clear: both; }\n\n.flatpickr-time .numInputWrapper {\n  flex: 1;\n  width: 40%;\n  height: 40px;\n  float: left; }\n\n.flatpickr-time .numInputWrapper span.arrowUp:after {\n  border-bottom-color: #393939; }\n\n.flatpickr-time .numInputWrapper span.arrowDown:after {\n  border-top-color: #393939; }\n\n.flatpickr-time.hasSeconds .numInputWrapper {\n  width: 26%; }\n\n.flatpickr-time.time24hr .numInputWrapper {\n  width: 49%; }\n\n.flatpickr-time input {\n  background: transparent;\n  box-shadow: none;\n  border: 0;\n  border-radius: 0;\n  text-align: center;\n  margin: 0;\n  padding: 0;\n  height: inherit;\n  line-height: inherit;\n  color: #393939;\n  font-size: 14px;\n  position: relative;\n  box-sizing: border-box;\n  -webkit-appearance: textfield;\n  -moz-appearance: textfield;\n  appearance: textfield; }\n\n.flatpickr-time input.flatpickr-hour {\n  font-weight: bold; }\n\n.flatpickr-time input.flatpickr-minute,\n.flatpickr-time input.flatpickr-second {\n  font-weight: 400; }\n\n.flatpickr-time input:focus {\n  outline: 0;\n  border: 0; }\n\n.flatpickr-time .flatpickr-time-separator,\n.flatpickr-time .flatpickr-am-pm {\n  height: inherit;\n  float: left;\n  line-height: inherit;\n  color: #393939;\n  font-weight: bold;\n  width: 2%;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n  align-self: center; }\n\n.flatpickr-time .flatpickr-am-pm {\n  outline: 0;\n  width: 18%;\n  cursor: pointer;\n  text-align: center;\n  font-weight: 400; }\n\n.flatpickr-time input:hover,\n.flatpickr-time .flatpickr-am-pm:hover,\n.flatpickr-time input:focus,\n.flatpickr-time .flatpickr-am-pm:focus {\n  background: #eee; }\n\n.flatpickr-input[readonly] {\n  cursor: pointer; }\n\n@-webkit-keyframes fpFadeInDown {\n  from {\n    opacity: 0;\n    transform: translate3d(0, -20px, 0); }\n  to {\n    opacity: 1;\n    transform: translate3d(0, 0, 0); } }\n\n@keyframes fpFadeInDown {\n  from {\n    opacity: 0;\n    transform: translate3d(0, -20px, 0); }\n  to {\n    opacity: 1;\n    transform: translate3d(0, 0, 0); } }\n\n.datepicker.flatpickr-input {\n  background-color: #fff; }\n\n.flatpickr-calendar.open {\n  margin-left: 0px;\n  margin-top: 4px; }\n\n.flatpickr-calendar.arrowBottom {\n  margin-top: -20px; }\n\n.flatpickr-calendar .flatpickr-innerContainer {\n  margin-top: 15px !important; }\n\n.flatpickr-calendar .numInputWrapper span {\n  border: none;\n  border-bottom: 1px solid rgba(57, 57, 57, 0.15); }\n\n.flatpickr-calendar .numInputWrapper:hover .arrowUp,\n.flatpickr-calendar .numInputWrapper:hover .arrowDown {\n  margin-top: 3px; }\n\n.flatpickr-calendar .flatpickr-day.today, .flatpickr-calendar .flatpickr-day.selected, .flatpickr-calendar .flatpickr-day.startRange, .flatpickr-calendar .flatpickr-day.endRange {\n  background: #e91e63 !important;\n  color: #fff;\n  border: none; }\n\n.flatpickr-calendar .flatpickr-day.inRange {\n  background: rgba(94, 114, 228, 0.28);\n  border: none;\n  box-shadow: -5px 0 0 #D7DCF8, 5px 0 0 #D7DCF8; }\n\n.flatpickr-calendar .flatpickr-day:not(.selected):hover, .flatpickr-calendar .flatpickr-day:not(.selected):focus {\n  background: rgba(94, 114, 228, 0.28);\n  border: none; }\n\n.flatpickr-calendar .flatpickr-time input:hover,\n.flatpickr-calendar .flatpickr-time .flatpickr-am-pm:hover,\n.flatpickr-calendar .flatpickr-time input:focus,\n.flatpickr-calendar .flatpickr-time .flatpickr-am-pm:focus {\n  background: rgba(94, 114, 228, 0.28); }\n\n.flatpickr.form-control {\n  background: #fff; }\n\n.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)) {\n  box-shadow: -10px 0 0 #e91e63; }\n\n/*! nouislider - 14.6.3 - 11/19/2020 */\n/* Functional styling;\n * These styles are required for noUiSlider to function.\n * You don't need to change these rules to apply your design.\n */\n.noUi-target,\n.noUi-target * {\n  -webkit-touch-callout: none;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  -webkit-user-select: none;\n  touch-action: none;\n  -ms-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  box-sizing: border-box; }\n\n.noUi-target {\n  position: relative; }\n\n.noUi-base,\n.noUi-connects {\n  width: 100%;\n  height: 2px;\n  position: relative;\n  z-index: 1;\n  top: 0; }\n\n/* Wrapper for all connect elements.\n */\n.noUi-connects {\n  z-index: 0;\n  overflow: hidden; }\n\n.noUi-connect,\n.noUi-origin {\n  will-change: transform;\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  -ms-transform-origin: 0 0;\n  -webkit-transform-origin: 0 0;\n  -webkit-transform-style: preserve-3d;\n  transform-origin: 0 0;\n  transform-style: flat; }\n\n.noUi-connect {\n  height: 100%;\n  width: 100%;\n  border-radius: 0.25rem; }\n\n.noUi-origin {\n  height: 10%;\n  width: 10%; }\n\n/* Offset direction\n */\n.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {\n  left: 0;\n  right: auto; }\n\n/* Give origins 0 height/width so they don't interfere with clicking the\n * connect elements.\n */\n.noUi-vertical .noUi-origin {\n  width: 0; }\n\n.noUi-horizontal .noUi-origin {\n  height: 0; }\n\n.noUi-handle {\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  position: absolute; }\n\n.noUi-touch-area {\n  height: 100%;\n  width: 100%; }\n\n.noUi-state-tap .noUi-connect,\n.noUi-state-tap .noUi-origin {\n  transition: transform 0.3s; }\n\n.noUi-state-drag * {\n  cursor: inherit !important; }\n\n/* Slider size and handle placement;\n */\n.noUi-horizontal {\n  height: 2px; }\n\n.noUi-horizontal .noUi-handle {\n  border-radius: 50%;\n  background-color: #fff;\n  box-shadow: 0 1px 13px 0 rgba(0, 0, 0, 0.2);\n  height: 14px;\n  width: 14px;\n  cursor: pointer;\n  margin-top: -6px;\n  outline: none;\n  right: -10px; }\n\n.noUi-vertical {\n  width: 3px; }\n\n.noUi-vertical .noUi-handle {\n  width: 28px;\n  height: 34px;\n  right: -6px;\n  top: -17px; }\n\n.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {\n  left: -17px;\n  right: auto; }\n\n/* Styling;\n * Giving the connect element a border radius causes issues with using transform: scale\n */\n.noUi-target {\n  background: #f0f2f5;\n  border-radius: .25rem; }\n\n.noUi-connects {\n  border-radius: 3px; }\n\n.noUi-connect {\n  background: #e91e63; }\n\n/* Handles and cursors;\n */\n.noUi-draggable {\n  cursor: ew-resize; }\n\n.noUi-vertical .noUi-draggable {\n  cursor: ns-resize; }\n\n.noUi-handle {\n  border: 1px solid #e91e63;\n  border-radius: 3px;\n  background: #fff;\n  cursor: default;\n  box-shadow: inset 0 0 1px #fff, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;\n  webkit-transition: .3s ease 0s;\n  -moz-transition: .3s ease 0s;\n  -ms-transition: .3s ease 0s;\n  -o-transform: .3s ease 0s;\n  transition: .3s ease 0s; }\n\n.noUi-active {\n  box-shadow: inset 0 0 1px #fff, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;\n  transform: scale3d(1.5, 1.5, 1); }\n\n/* Disabled state;\n */\n[disabled] .noUi-connect {\n  background: #B8B8B8; }\n\n[disabled].noUi-target,\n[disabled].noUi-handle,\n[disabled] .noUi-handle {\n  cursor: not-allowed; }\n\n/* Base;\n *\n */\n.noUi-pips,\n.noUi-pips * {\n  box-sizing: border-box; }\n\n.noUi-pips {\n  position: absolute;\n  color: #999; }\n\n/* Values;\n *\n */\n.noUi-value {\n  position: absolute;\n  white-space: nowrap;\n  text-align: center; }\n\n.noUi-value-sub {\n  color: #ccc;\n  font-size: 10px; }\n\n/* Markings;\n *\n */\n.noUi-marker {\n  position: absolute;\n  background: #CCC; }\n\n.noUi-marker-sub {\n  background: #AAA; }\n\n.noUi-marker-large {\n  background: #AAA; }\n\n/* Horizontal layout;\n *\n */\n.noUi-pips-horizontal {\n  padding: 10px 0;\n  height: 80px;\n  top: 100%;\n  left: 0;\n  width: 100%; }\n\n.noUi-value-horizontal {\n  transform: translate(-50%, 50%); }\n\n.noUi-rtl .noUi-value-horizontal {\n  transform: translate(50%, 50%); }\n\n.noUi-marker-horizontal.noUi-marker {\n  margin-left: -1px;\n  width: 2px;\n  height: 5px; }\n\n.noUi-marker-horizontal.noUi-marker-sub {\n  height: 10px; }\n\n.noUi-marker-horizontal.noUi-marker-large {\n  height: 15px; }\n\n/* Vertical layout;\n *\n */\n.noUi-pips-vertical {\n  padding: 0 10px;\n  height: 100%;\n  top: 0;\n  left: 100%; }\n\n.noUi-value-vertical {\n  transform: translate(0, -50%);\n  padding-left: 25px; }\n\n.noUi-rtl .noUi-value-vertical {\n  transform: translate(0, 50%); }\n\n.noUi-marker-vertical.noUi-marker {\n  width: 5px;\n  height: 2px;\n  margin-top: -1px; }\n\n.noUi-marker-vertical.noUi-marker-sub {\n  width: 10px; }\n\n.noUi-marker-vertical.noUi-marker-large {\n  width: 15px; }\n\n.noUi-tooltip {\n  display: block;\n  position: absolute;\n  border: 1px solid #D9D9D9;\n  border-radius: 3px;\n  background: #fff;\n  color: #000;\n  padding: 5px;\n  text-align: center;\n  white-space: nowrap; }\n\n.noUi-horizontal .noUi-tooltip {\n  transform: translate(-50%, 0);\n  left: 50%;\n  bottom: 120%; }\n\n.noUi-vertical .noUi-tooltip {\n  transform: translate(0, -50%);\n  top: 50%;\n  right: 120%; }\n\n.noUi-horizontal .noUi-origin > .noUi-tooltip {\n  transform: translate(50%, 0);\n  left: auto;\n  bottom: 10px; }\n\n.noUi-vertical .noUi-origin > .noUi-tooltip {\n  transform: translate(0, -18px);\n  top: auto;\n  right: 28px; }\n\n/* PrismJS 1.23.0\nhttps://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */\n/**\n * prism.js default theme for JavaScript, CSS and HTML\n * Based on dabblet (http://dabblet.com)\n * @author Lea Verou\n */\ncode[class*=\"language-\"],\npre[class*=\"language-\"] {\n  color: black;\n  background: none;\n  text-shadow: 0 1px white;\n  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n  font-size: 1em;\n  text-align: left;\n  white-space: pre;\n  word-spacing: normal;\n  word-break: normal;\n  word-wrap: normal;\n  line-height: 1.5;\n  -moz-tab-size: 4;\n  -o-tab-size: 4;\n  tab-size: 4;\n  -webkit-hyphens: none;\n  -ms-hyphens: none;\n  hyphens: none; }\n\npre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection,\ncode[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n  text-shadow: none;\n  background: #b3d4fc; }\n\npre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection, code[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n  text-shadow: none;\n  background: #b3d4fc; }\n\npre[class*=\"language-\"]::selection, pre[class*=\"language-\"] ::selection,\ncode[class*=\"language-\"]::selection, code[class*=\"language-\"] ::selection {\n  text-shadow: none;\n  background: #b3d4fc; }\n\n@media print {\n  code[class*=\"language-\"],\n  pre[class*=\"language-\"] {\n    text-shadow: none; } }\n\n/* Code blocks */\npre[class*=\"language-\"] {\n  padding: 1em;\n  overflow: auto;\n  border-radius: .75rem; }\n\n:not(pre) > code[class*=\"language-\"],\npre[class*=\"language-\"] {\n  background: #f8f9fa; }\n\n/* Inline code */\n:not(pre) > code[class*=\"language-\"] {\n  padding: .1em;\n  border-radius: .3em;\n  white-space: normal; }\n\n.token.comment,\n.token.prolog,\n.token.doctype,\n.token.cdata {\n  color: slategray; }\n\n.token.punctuation {\n  color: #999; }\n\n.token.namespace {\n  opacity: .7; }\n\n.token.property,\n.token.tag,\n.token.boolean,\n.token.number,\n.token.constant,\n.token.symbol,\n.token.deleted {\n  color: #905; }\n\n.token.selector,\n.token.attr-name,\n.token.string,\n.token.char,\n.token.builtin,\n.token.inserted {\n  color: #690; }\n\n.token.operator,\n.token.entity,\n.token.url,\n.language-css .token.string,\n.style .token.string {\n  color: #9a6e3a;\n  /* This background color was intended by the author of this theme. */\n  background: rgba(255, 255, 255, 0.5); }\n\n.token.atrule,\n.token.attr-value,\n.token.keyword {\n  color: #07a; }\n\n.token.function,\n.token.class-name {\n  color: #DD4A68; }\n\n.token.regex,\n.token.important,\n.token.variable {\n  color: #e90; }\n\n.token.important,\n.token.bold {\n  font-weight: bold; }\n\n.token.italic {\n  font-style: italic; }\n\n.token.entity {\n  cursor: help; }\n\n/*\n * Container style\n */\n.ps {\n  overflow: hidden !important;\n  overflow-anchor: none;\n  -ms-overflow-style: none;\n  touch-action: auto;\n  -ms-touch-action: auto; }\n\n/*\n * Scrollbar rail styles\n */\n.ps__rail-x {\n  display: none;\n  opacity: 0;\n  transition: background-color .2s linear, opacity .2s linear;\n  -webkit-transition: background-color .2s linear, opacity .2s linear;\n  height: 15px;\n  /* there must be 'bottom' or 'top' for ps__rail-x */\n  bottom: 0px;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps__rail-y {\n  display: none;\n  opacity: 0;\n  transition: background-color .2s linear, opacity .2s linear;\n  -webkit-transition: background-color .2s linear, opacity .2s linear;\n  width: 15px;\n  /* there must be 'right' or 'left' for ps__rail-y */\n  right: 0;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps--active-x > .ps__rail-x,\n.ps--active-y > .ps__rail-y {\n  display: block;\n  background-color: transparent; }\n\n.ps:hover > .ps__rail-x,\n.ps:hover > .ps__rail-y,\n.ps--focus > .ps__rail-x,\n.ps--focus > .ps__rail-y,\n.ps--scrolling-x > .ps__rail-x,\n.ps--scrolling-y > .ps__rail-y {\n  opacity: 0.6; }\n\n.ps .ps__rail-x:hover,\n.ps .ps__rail-y:hover,\n.ps .ps__rail-x:focus,\n.ps .ps__rail-y:focus,\n.ps .ps__rail-x.ps--clicking,\n.ps .ps__rail-y.ps--clicking {\n  background-color: #eee;\n  opacity: 0.9; }\n\n/*\n * Scrollbar thumb styles\n */\n.ps__thumb-x {\n  background-color: #aaa;\n  border-radius: 6px;\n  transition: background-color .2s linear, height .2s ease-in-out;\n  -webkit-transition: background-color .2s linear, height .2s ease-in-out;\n  height: 6px;\n  /* there must be 'bottom' for ps__thumb-x */\n  bottom: 2px;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps__thumb-y {\n  background-color: #aaa;\n  border-radius: 6px;\n  transition: background-color .2s linear, width .2s ease-in-out;\n  -webkit-transition: background-color .2s linear, width .2s ease-in-out;\n  width: 6px;\n  /* there must be 'right' for ps__thumb-y */\n  right: 2px;\n  /* please don't change 'position' */\n  position: absolute; }\n\n.ps__rail-x:hover > .ps__thumb-x,\n.ps__rail-x:focus > .ps__thumb-x,\n.ps__rail-x.ps--clicking .ps__thumb-x {\n  background-color: #999;\n  height: 11px; }\n\n.ps__rail-y:hover > .ps__thumb-y,\n.ps__rail-y:focus > .ps__thumb-y,\n.ps__rail-y.ps--clicking .ps__thumb-y {\n  background-color: #999;\n  width: 11px; }\n\n/* MS supports */\n@supports (-ms-overflow-style: none) {\n  .ps {\n    overflow: auto !important; } }\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n  .ps {\n    overflow: auto !important; } }\n\n/*# sourceMappingURL=material-dashboard.css.map */\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/css/nucleo-icons.css",
    "content": "/*--------------------------------\n\nhermes-dashboard-icons Web Font - built using nucleoapp.com\nLicense - nucleoapp.com/license/\n\n-------------------------------- */\n@font-face {\n  font-family: 'NucleoIcons';\n  src: url('../fonts/nucleo-icons.eot');\n  src: url('../fonts/nucleo-icons.eot') format('embedded-opentype'), url('../fonts/nucleo-icons.woff2') format('woff2'), url('../fonts/nucleo-icons.woff') format('woff'), url('../fonts/nucleo-icons.ttf') format('truetype'), url('../fonts/nucleo-icons.svg') format('svg');\n  font-weight: normal;\n  font-style: normal;\n}\n\n/*------------------------\n    base class definition\n-------------------------*/\n.ni {\n  display: inline-block;\n  font: normal normal normal 14px/1 NucleoIcons;\n  font-size: inherit;\n  text-rendering: auto;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n/*------------------------\n  change icon size\n-------------------------*/\n.ni-lg {\n  font-size: 1.33333333em;\n  line-height: 0.75em;\n  vertical-align: -15%;\n}\n\n.ni-2x {\n  font-size: 2em;\n}\n\n.ni-3x {\n  font-size: 3em;\n}\n\n.ni-4x {\n  font-size: 4em;\n}\n\n.ni-5x {\n  font-size: 5em;\n}\n\n/*----------------------------------\n  add a square/circle background\n-----------------------------------*/\n.ni.square,\n.ni.circle {\n  padding: 0.33333333em;\n  vertical-align: -16%;\n  background-color: #eee;\n}\n\n.ni.circle {\n  border-radius: 50%;\n}\n\n/*------------------------\n  list icons\n-------------------------*/\n.ni-ul {\n  padding-left: 0;\n  margin-left: 2.14285714em;\n  list-style-type: none;\n}\n\n.ni-ul>li {\n  position: relative;\n}\n\n.ni-ul>li>.ni {\n  position: absolute;\n  left: -1.57142857em;\n  top: 0.14285714em;\n  text-align: center;\n}\n\n.ni-ul>li>.ni.lg {\n  top: 0;\n  left: -1.35714286em;\n}\n\n.ni-ul>li>.ni.circle,\n.ni-ul>li>.ni.square {\n  top: -0.19047619em;\n  left: -1.9047619em;\n}\n\n/*------------------------\n  spinning icons\n-------------------------*/\n.ni.spin {\n  -webkit-animation: nc-spin 2s infinite linear;\n  -moz-animation: nc-spin 2s infinite linear;\n  animation: nc-spin 2s infinite linear;\n}\n\n@-webkit-keyframes nc-spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n  }\n\n  100% {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n@-moz-keyframes nc-spin {\n  0% {\n    -moz-transform: rotate(0deg);\n  }\n\n  100% {\n    -moz-transform: rotate(360deg);\n  }\n}\n\n@keyframes nc-spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n    -moz-transform: rotate(0deg);\n    -ms-transform: rotate(0deg);\n    -o-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n\n  100% {\n    -webkit-transform: rotate(360deg);\n    -moz-transform: rotate(360deg);\n    -ms-transform: rotate(360deg);\n    -o-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n\n/*------------------------\n  rotated/flipped icons\n-------------------------*/\n.ni.rotate-90 {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);\n  -webkit-transform: rotate(90deg);\n  -moz-transform: rotate(90deg);\n  -ms-transform: rotate(90deg);\n  -o-transform: rotate(90deg);\n  transform: rotate(90deg);\n}\n\n.ni.rotate-180 {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);\n  -webkit-transform: rotate(180deg);\n  -moz-transform: rotate(180deg);\n  -ms-transform: rotate(180deg);\n  -o-transform: rotate(180deg);\n  transform: rotate(180deg);\n}\n\n.ni.rotate-270 {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);\n  -webkit-transform: rotate(270deg);\n  -moz-transform: rotate(270deg);\n  -ms-transform: rotate(270deg);\n  -o-transform: rotate(270deg);\n  transform: rotate(270deg);\n}\n\n.ni.flip-y {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);\n  -webkit-transform: scale(-1, 1);\n  -moz-transform: scale(-1, 1);\n  -ms-transform: scale(-1, 1);\n  -o-transform: scale(-1, 1);\n  transform: scale(-1, 1);\n}\n\n.ni.flip-x {\n  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);\n  -webkit-transform: scale(1, -1);\n  -moz-transform: scale(1, -1);\n  -ms-transform: scale(1, -1);\n  -o-transform: scale(1, -1);\n  transform: scale(1, -1);\n}\n\n/*------------------------\n    font icons\n-------------------------*/\n\n.ni-active-40::before {\n  content: \"\\ea02\";\n}\n\n.ni-air-baloon::before {\n  content: \"\\ea03\";\n}\n\n.ni-album-2::before {\n  content: \"\\ea04\";\n}\n\n.ni-align-center::before {\n  content: \"\\ea05\";\n}\n\n.ni-align-left-2::before {\n  content: \"\\ea06\";\n}\n\n.ni-ambulance::before {\n  content: \"\\ea07\";\n}\n\n.ni-app::before {\n  content: \"\\ea08\";\n}\n\n.ni-archive-2::before {\n  content: \"\\ea09\";\n}\n\n.ni-atom::before {\n  content: \"\\ea0a\";\n}\n\n.ni-badge::before {\n  content: \"\\ea0b\";\n}\n\n.ni-bag-17::before {\n  content: \"\\ea0c\";\n}\n\n.ni-basket::before {\n  content: \"\\ea0d\";\n}\n\n.ni-bell-55::before {\n  content: \"\\ea0e\";\n}\n\n.ni-bold-down::before {\n  content: \"\\ea0f\";\n}\n\n.ni-bold-left::before {\n  content: \"\\ea10\";\n}\n\n.ni-bold-right::before {\n  content: \"\\ea11\";\n}\n\n.ni-bold-up::before {\n  content: \"\\ea12\";\n}\n\n.ni-bold::before {\n  content: \"\\ea13\";\n}\n\n.ni-book-bookmark::before {\n  content: \"\\ea14\";\n}\n\n.ni-books::before {\n  content: \"\\ea15\";\n}\n\n.ni-box-2::before {\n  content: \"\\ea16\";\n}\n\n.ni-briefcase-24::before {\n  content: \"\\ea17\";\n}\n\n.ni-building::before {\n  content: \"\\ea18\";\n}\n\n.ni-bulb-61::before {\n  content: \"\\ea19\";\n}\n\n.ni-bullet-list-67::before {\n  content: \"\\ea1a\";\n}\n\n.ni-bus-front-12::before {\n  content: \"\\ea1b\";\n}\n\n.ni-button-pause::before {\n  content: \"\\ea1c\";\n}\n\n.ni-button-play::before {\n  content: \"\\ea1d\";\n}\n\n.ni-button-power::before {\n  content: \"\\ea1e\";\n}\n\n.ni-calendar-grid-58::before {\n  content: \"\\ea1f\";\n}\n\n.ni-camera-compact::before {\n  content: \"\\ea20\";\n}\n\n.ni-caps-small::before {\n  content: \"\\ea21\";\n}\n\n.ni-cart::before {\n  content: \"\\ea22\";\n}\n\n.ni-chart-bar-32::before {\n  content: \"\\ea23\";\n}\n\n.ni-chart-pie-35::before {\n  content: \"\\ea24\";\n}\n\n.ni-chat-round::before {\n  content: \"\\ea25\";\n}\n\n.ni-check-bold::before {\n  content: \"\\ea26\";\n}\n\n.ni-circle-08::before {\n  content: \"\\ea27\";\n}\n\n.ni-cloud-download-95::before {\n  content: \"\\ea28\";\n}\n\n.ni-cloud-upload-96::before {\n  content: \"\\ea29\";\n}\n\n.ni-compass-04::before {\n  content: \"\\ea2a\";\n}\n\n.ni-controller::before {\n  content: \"\\ea2b\";\n}\n\n.ni-credit-card::before {\n  content: \"\\ea2c\";\n}\n\n.ni-curved-next::before {\n  content: \"\\ea2d\";\n}\n\n.ni-delivery-fast::before {\n  content: \"\\ea2e\";\n}\n\n.ni-diamond::before {\n  content: \"\\ea2f\";\n}\n\n.ni-email-83::before {\n  content: \"\\ea30\";\n}\n\n.ni-fat-add::before {\n  content: \"\\ea31\";\n}\n\n.ni-fat-delete::before {\n  content: \"\\ea32\";\n}\n\n.ni-fat-remove::before {\n  content: \"\\ea33\";\n}\n\n.ni-favourite-28::before {\n  content: \"\\ea34\";\n}\n\n.ni-folder-17::before {\n  content: \"\\ea35\";\n}\n\n.ni-glasses-2::before {\n  content: \"\\ea36\";\n}\n\n.ni-hat-3::before {\n  content: \"\\ea37\";\n}\n\n.ni-headphones::before {\n  content: \"\\ea38\";\n}\n\n.ni-html5::before {\n  content: \"\\ea39\";\n}\n\n.ni-istanbul::before {\n  content: \"\\ea3a\";\n}\n\n.ni-key-25::before {\n  content: \"\\ea3b\";\n}\n\n.ni-laptop::before {\n  content: \"\\ea3c\";\n}\n\n.ni-like-2::before {\n  content: \"\\ea3d\";\n}\n\n.ni-lock-circle-open::before {\n  content: \"\\ea3e\";\n}\n\n.ni-map-big::before {\n  content: \"\\ea3f\";\n}\n\n.ni-mobile-button::before {\n  content: \"\\ea40\";\n}\n\n.ni-money-coins::before {\n  content: \"\\ea41\";\n}\n\n.ni-note-03::before {\n  content: \"\\ea42\";\n}\n\n.ni-notification-70::before {\n  content: \"\\ea43\";\n}\n\n.ni-palette::before {\n  content: \"\\ea44\";\n}\n\n.ni-paper-diploma::before {\n  content: \"\\ea45\";\n}\n\n.ni-pin-3::before {\n  content: \"\\ea46\";\n}\n\n.ni-planet::before {\n  content: \"\\ea47\";\n}\n\n.ni-ruler-pencil::before {\n  content: \"\\ea48\";\n}\n\n.ni-satisfied::before {\n  content: \"\\ea49\";\n}\n\n.ni-scissors::before {\n  content: \"\\ea4a\";\n}\n\n.ni-send::before {\n  content: \"\\ea4b\";\n}\n\n.ni-settings-gear-65::before {\n  content: \"\\ea4c\";\n}\n\n.ni-settings::before {\n  content: \"\\ea4d\";\n}\n\n.ni-single-02::before {\n  content: \"\\ea4e\";\n}\n\n.ni-single-copy-04::before {\n  content: \"\\ea4f\";\n}\n\n.ni-sound-wave::before {\n  content: \"\\ea50\";\n}\n\n.ni-spaceship::before {\n  content: \"\\ea51\";\n}\n\n.ni-square-pin::before {\n  content: \"\\ea52\";\n}\n\n.ni-support-16::before {\n  content: \"\\ea53\";\n}\n\n.ni-tablet-button::before {\n  content: \"\\ea54\";\n}\n\n.ni-tag::before {\n  content: \"\\ea55\";\n}\n\n.ni-tie-bow::before {\n  content: \"\\ea56\";\n}\n\n.ni-time-alarm::before {\n  content: \"\\ea57\";\n}\n\n.ni-trophy::before {\n  content: \"\\ea58\";\n}\n\n.ni-tv-2::before {\n  content: \"\\ea59\";\n}\n\n.ni-umbrella-13::before {\n  content: \"\\ea5a\";\n}\n\n.ni-user-run::before {\n  content: \"\\ea5b\";\n}\n\n.ni-vector::before {\n  content: \"\\ea5c\";\n}\n\n.ni-watch-time::before {\n  content: \"\\ea5d\";\n}\n\n.ni-world::before {\n  content: \"\\ea5e\";\n}\n\n.ni-zoom-split-in::before {\n  content: \"\\ea5f\";\n}\n\n.ni-collection::before {\n  content: \"\\ea60\";\n}\n\n.ni-image::before {\n  content: \"\\ea61\";\n}\n\n.ni-shop::before {\n  content: \"\\ea62\";\n}\n\n.ni-ungroup::before {\n  content: \"\\ea63\";\n}\n\n.ni-world-2::before {\n  content: \"\\ea64\";\n}\n\n.ni-ui-04::before {\n  content: \"\\ea65\";\n}\n\n\n/* all icon font classes list here */"
  },
  {
    "path": "src/material-stubs/resources/material/assets/css/nucleo-svg.css",
    "content": "/* Generated using nucleoapp.com */\n/* --------------------------------\n\nIcon colors\n\n-------------------------------- */\n\n.icon {\n  display: inline-block;\n  /* icon primary color */\n  color: #111111;\n  height: 1em;\n  width: 1em;\n}\n\n.icon use {\n  /* icon secondary color - fill */\n  fill: #7ea6f6;\n}\n\n.icon.icon-outline use {\n  /* icon secondary color - stroke */\n  stroke: #7ea6f6;\n}\n\n/* --------------------------------\n\nChange icon size\n\n-------------------------------- */\n\n.icon-xs {\n  height: 0.5em;\n  width: 0.5em;\n}\n\n.icon-sm {\n  height: 0.8em;\n  width: 0.8em;\n}\n\n.icon-lg {\n  height: 1.6em;\n  width: 1.6em;\n}\n\n.icon-xl {\n  height: 2em;\n  width: 2em;\n}\n\n/* -------------------------------- \n\nAlign icon and text \n\n-------------------------------- */\n\n.icon-text-aligner {\n  /* add this class to parent element that contains icon + text */\n  display: flex;\n  align-items: center;\n}\n\n.icon-text-aligner .icon {\n  color: inherit;\n  margin-right: 0.4em;\n}\n\n.icon-text-aligner .icon use {\n  color: inherit;\n  fill: currentColor;\n}\n\n.icon-text-aligner .icon.icon-outline use {\n  stroke: currentColor;\n}\n\n/* -------------------------------- \n\nIcon reset values - used to enable color customizations\n\n-------------------------------- */\n\n.icon {\n  fill: currentColor;\n  stroke: none;\n}\n\n.icon.icon-outline {\n  fill: none;\n  stroke: currentColor;\n}\n\n.icon use {\n  stroke: none;\n}\n\n.icon.icon-outline use {\n  fill: none;\n}\n\n/* -------------------------------- \n\nStroke effects - Nucleo outline icons\n\n- 16px icons -> up to 1px stroke (16px outline icons do not support stroke changes)\n- 24px, 32px icons -> up to 2px stroke\n- 48px, 64px icons -> up to 4px stroke\n\n-------------------------------- */\n\n.icon-outline.icon-stroke-1 {\n  stroke-width: 1px;\n}\n\n.icon-outline.icon-stroke-2 {\n  stroke-width: 2px;\n}\n\n.icon-outline.icon-stroke-3 {\n  stroke-width: 3px;\n}\n\n.icon-outline.icon-stroke-4 {\n  stroke-width: 4px;\n}\n\n.icon-outline.icon-stroke-1 use,\n.icon-outline.icon-stroke-3 use {\n  -webkit-transform: translateX(0.5px) translateY(0.5px);\n  -moz-transform: translateX(0.5px) translateY(0.5px);\n  -ms-transform: translateX(0.5px) translateY(0.5px);\n  -o-transform: translateX(0.5px) translateY(0.5px);\n  transform: translateX(0.5px) translateY(0.5px);\n}"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/datatables.js",
    "content": "/**\n * Minified by jsDelivr using Terser v5.3.5.\n * Original file: /npm/simple-datatables@3.0.2/dist/umd/simple-datatables.js\n *\n * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files\n */\n!function(t){if(\"object\"==typeof exports&&\"undefined\"!=typeof module)module.exports=t();else if(\"function\"==typeof define&&define.amd)define([],t);else{(\"undefined\"!=typeof window?window:\"undefined\"!=typeof global?global:\"undefined\"!=typeof self?self:this).simpleDatatables=t()}}((function(){return function t(e,s,i){function a(r,h){if(!s[r]){if(!e[r]){var o=\"function\"==typeof require&&require;if(!h&&o)return o(r,!0);if(n)return n(r,!0);var l=new Error(\"Cannot find module '\"+r+\"'\");throw l.code=\"MODULE_NOT_FOUND\",l}var d=s[r]={exports:{}};e[r][0].call(d.exports,(function(t){return a(e[r][1][t]||t)}),d,d.exports,t,e,s,i)}return s[r].exports}for(var n=\"function\"==typeof require&&require,r=0;r<i.length;r++)a(i[r]);return a}({1:[function(t,e,s){(function(t){(function(){\"use strict\";function e(t,e){return t(e={exports:{}},e.exports),e.exports}\"undefined\"!=typeof globalThis?globalThis:\"undefined\"!=typeof window?window:void 0!==t||\"undefined\"!=typeof self&&self;var i=e((function(t,e){t.exports=function(){var t=\"millisecond\",e=\"second\",s=\"minute\",i=\"hour\",a=\"day\",n=\"week\",r=\"month\",h=\"quarter\",o=\"year\",l=\"date\",d=/^(\\d{4})[-/]?(\\d{1,2})?[-/]?(\\d{0,2})[^0-9]*(\\d{1,2})?:?(\\d{1,2})?:?(\\d{1,2})?[.:]?(\\d+)?$/,c=/\\[([^\\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,u={name:\"en\",weekdays:\"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday\".split(\"_\"),months:\"January_February_March_April_May_June_July_August_September_October_November_December\".split(\"_\")},p=function(t,e,s){var i=String(t);return!i||i.length>=e?t:\"\"+Array(e+1-i.length).join(s)+t},f={s:p,z:function(t){var e=-t.utcOffset(),s=Math.abs(e),i=Math.floor(s/60),a=s%60;return(e<=0?\"+\":\"-\")+p(i,2,\"0\")+\":\"+p(a,2,\"0\")},m:function t(e,s){if(e.date()<s.date())return-t(s,e);var i=12*(s.year()-e.year())+(s.month()-e.month()),a=e.clone().add(i,r),n=s-a<0,h=e.clone().add(i+(n?-1:1),r);return+(-(i+(s-a)/(n?a-h:h-a))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(d){return{M:r,y:o,w:n,d:a,D:l,h:i,m:s,s:e,ms:t,Q:h}[d]||String(d||\"\").toLowerCase().replace(/s$/,\"\")},u:function(t){return void 0===t}},g=\"en\",m={};m[g]=u;var b=function(t){return t instanceof C},y=function(t,e,s){var i;if(!t)return g;if(\"string\"==typeof t)m[t]&&(i=t),e&&(m[t]=e,i=t);else{var a=t.name;m[a]=t,i=a}return!s&&i&&(g=i),i||!s&&g},v=function(t,e){if(b(t))return t.clone();var s=\"object\"==typeof e?e:{};return s.date=t,s.args=arguments,new C(s)},w=f;w.l=y,w.i=b,w.w=function(t,e){return v(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var C=function(){function u(t){this.$L=y(t.locale,null,!0),this.parse(t)}var p=u.prototype;return p.parse=function(t){this.$d=function(t){var e=t.date,s=t.utc;if(null===e)return new Date(NaN);if(w.u(e))return new Date;if(e instanceof Date)return new Date(e);if(\"string\"==typeof e&&!/Z$/i.test(e)){var i=e.match(d);if(i){var a=i[2]-1||0,n=(i[7]||\"0\").substring(0,3);return s?new Date(Date.UTC(i[1],a,i[3]||1,i[4]||0,i[5]||0,i[6]||0,n)):new Date(i[1],a,i[3]||1,i[4]||0,i[5]||0,i[6]||0,n)}}return new Date(e)}(t),this.$x=t.x||{},this.init()},p.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},p.$utils=function(){return w},p.isValid=function(){return!(\"Invalid Date\"===this.$d.toString())},p.isSame=function(t,e){var s=v(t);return this.startOf(e)<=s&&s<=this.endOf(e)},p.isAfter=function(t,e){return v(t)<this.startOf(e)},p.isBefore=function(t,e){return this.endOf(e)<v(t)},p.$g=function(t,e,s){return w.u(t)?this[e]:this.set(s,t)},p.unix=function(){return Math.floor(this.valueOf()/1e3)},p.valueOf=function(){return this.$d.getTime()},p.startOf=function(t,h){var d=this,c=!!w.u(h)||h,u=w.p(t),p=function(t,e){var s=w.w(d.$u?Date.UTC(d.$y,e,t):new Date(d.$y,e,t),d);return c?s:s.endOf(a)},f=function(t,e){return w.w(d.toDate()[t].apply(d.toDate(\"s\"),(c?[0,0,0,0]:[23,59,59,999]).slice(e)),d)},g=this.$W,m=this.$M,b=this.$D,y=\"set\"+(this.$u?\"UTC\":\"\");switch(u){case o:return c?p(1,0):p(31,11);case r:return c?p(1,m):p(0,m+1);case n:var v=this.$locale().weekStart||0,C=(g<v?g+7:g)-v;return p(c?b-C:b+(6-C),m);case a:case l:return f(y+\"Hours\",0);case i:return f(y+\"Minutes\",1);case s:return f(y+\"Seconds\",2);case e:return f(y+\"Milliseconds\",3);default:return this.clone()}},p.endOf=function(t){return this.startOf(t,!1)},p.$set=function(n,h){var d,c=w.p(n),u=\"set\"+(this.$u?\"UTC\":\"\"),p=(d={},d[a]=u+\"Date\",d[l]=u+\"Date\",d[r]=u+\"Month\",d[o]=u+\"FullYear\",d[i]=u+\"Hours\",d[s]=u+\"Minutes\",d[e]=u+\"Seconds\",d[t]=u+\"Milliseconds\",d)[c],f=c===a?this.$D+(h-this.$W):h;if(c===r||c===o){var g=this.clone().set(l,1);g.$d[p](f),g.init(),this.$d=g.set(l,Math.min(this.$D,g.daysInMonth())).$d}else p&&this.$d[p](f);return this.init(),this},p.set=function(t,e){return this.clone().$set(t,e)},p.get=function(t){return this[w.p(t)]()},p.add=function(t,h){var l,d=this;t=Number(t);var c=w.p(h),u=function(e){var s=v(d);return w.w(s.date(s.date()+Math.round(e*t)),d)};if(c===r)return this.set(r,this.$M+t);if(c===o)return this.set(o,this.$y+t);if(c===a)return u(1);if(c===n)return u(7);var p=(l={},l[s]=6e4,l[i]=36e5,l[e]=1e3,l)[c]||1,f=this.$d.getTime()+t*p;return w.w(f,this)},p.subtract=function(t,e){return this.add(-1*t,e)},p.format=function(t){var e=this;if(!this.isValid())return\"Invalid Date\";var s=t||\"YYYY-MM-DDTHH:mm:ssZ\",i=w.z(this),a=this.$locale(),n=this.$H,r=this.$m,h=this.$M,o=a.weekdays,l=a.months,d=function(t,i,a,n){return t&&(t[i]||t(e,s))||a[i].substr(0,n)},u=function(t){return w.s(n%12||12,t,\"0\")},p=a.meridiem||function(t,e,s){var i=t<12?\"AM\":\"PM\";return s?i.toLowerCase():i},f={YY:String(this.$y).slice(-2),YYYY:this.$y,M:h+1,MM:w.s(h+1,2,\"0\"),MMM:d(a.monthsShort,h,l,3),MMMM:d(l,h),D:this.$D,DD:w.s(this.$D,2,\"0\"),d:String(this.$W),dd:d(a.weekdaysMin,this.$W,o,2),ddd:d(a.weekdaysShort,this.$W,o,3),dddd:o[this.$W],H:String(n),HH:w.s(n,2,\"0\"),h:u(1),hh:u(2),a:p(n,r,!0),A:p(n,r,!1),m:String(r),mm:w.s(r,2,\"0\"),s:String(this.$s),ss:w.s(this.$s,2,\"0\"),SSS:w.s(this.$ms,3,\"0\"),Z:i};return s.replace(c,(function(t,e){return e||f[t]||i.replace(\":\",\"\")}))},p.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},p.diff=function(t,l,d){var c,u=w.p(l),p=v(t),f=6e4*(p.utcOffset()-this.utcOffset()),g=this-p,m=w.m(this,p);return m=(c={},c[o]=m/12,c[r]=m,c[h]=m/3,c[n]=(g-f)/6048e5,c[a]=(g-f)/864e5,c[i]=g/36e5,c[s]=g/6e4,c[e]=g/1e3,c)[u]||g,d?m:w.a(m)},p.daysInMonth=function(){return this.endOf(r).$D},p.$locale=function(){return m[this.$L]},p.locale=function(t,e){if(!t)return this.$L;var s=this.clone(),i=y(t,e,!0);return i&&(s.$L=i),s},p.clone=function(){return w.w(this.$d,this)},p.toDate=function(){return new Date(this.valueOf())},p.toJSON=function(){return this.isValid()?this.toISOString():null},p.toISOString=function(){return this.$d.toISOString()},p.toString=function(){return this.$d.toUTCString()},u}(),x=C.prototype;return v.prototype=x,[[\"$ms\",t],[\"$s\",e],[\"$m\",s],[\"$H\",i],[\"$W\",a],[\"$M\",r],[\"$y\",o],[\"$D\",l]].forEach((function(t){x[t[1]]=function(e){return this.$g(e,t[0],t[1])}})),v.extend=function(t,e){return t.$i||(t(e,C,v),t.$i=!0),v},v.locale=y,v.isDayjs=b,v.unix=function(t){return v(1e3*t)},v.en=m[g],v.Ls=m,v.p={},v}()})),a=e((function(t,e){var s,i,a,n,r,h,o,l,d,c,u,p,f;t.exports=(s={LTS:\"h:mm:ss A\",LT:\"h:mm A\",L:\"MM/DD/YYYY\",LL:\"MMMM D, YYYY\",LLL:\"MMMM D, YYYY h:mm A\",LLLL:\"dddd, MMMM D, YYYY h:mm A\"},i=function(t,e){return t.replace(/(\\[[^\\]]+])|(LTS?|l{1,4}|L{1,4})/g,(function(t,i,a){var n=a&&a.toUpperCase();return i||e[a]||s[a]||e[n].replace(/(\\[[^\\]]+])|(MMMM|MM|DD|dddd)/g,(function(t,e,s){return e||s.slice(1)}))}))},a=/(\\[[^[]*\\])|([-:/.()\\s]+)|(A|a|YYYY|YY?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g,o={},d=[/[+-]\\d\\d:?(\\d\\d)?/,function(t){(this.zone||(this.zone={})).offset=function(t){if(!t)return 0;var e=t.match(/([+-]|\\d\\d)/g),s=60*e[1]+(+e[2]||0);return 0===s?0:\"+\"===e[0]?-s:s}(t)}],c=function(t){var e=o[t];return e&&(e.indexOf?e:e.s.concat(e.f))},u=function(t,e){var s,i=o.meridiem;if(i){for(var a=1;a<=24;a+=1)if(t.indexOf(i(a,0,e))>-1){s=a>12;break}}else s=t===(e?\"pm\":\"PM\");return s},p={A:[h=/\\d*[^\\s\\d-:/()]+/,function(t){this.afternoon=u(t,!1)}],a:[h,function(t){this.afternoon=u(t,!0)}],S:[/\\d/,function(t){this.milliseconds=100*+t}],SS:[n=/\\d\\d/,function(t){this.milliseconds=10*+t}],SSS:[/\\d{3}/,function(t){this.milliseconds=+t}],s:[r=/\\d\\d?/,(l=function(t){return function(e){this[t]=+e}})(\"seconds\")],ss:[r,l(\"seconds\")],m:[r,l(\"minutes\")],mm:[r,l(\"minutes\")],H:[r,l(\"hours\")],h:[r,l(\"hours\")],HH:[r,l(\"hours\")],hh:[r,l(\"hours\")],D:[r,l(\"day\")],DD:[n,l(\"day\")],Do:[h,function(t){var e=o.ordinal,s=t.match(/\\d+/);if(this.day=s[0],e)for(var i=1;i<=31;i+=1)e(i).replace(/\\[|\\]/g,\"\")===t&&(this.day=i)}],M:[r,l(\"month\")],MM:[n,l(\"month\")],MMM:[h,function(t){var e=c(\"months\"),s=(c(\"monthsShort\")||e.map((function(t){return t.substr(0,3)}))).indexOf(t)+1;if(s<1)throw new Error;this.month=s%12||s}],MMMM:[h,function(t){var e=c(\"months\").indexOf(t)+1;if(e<1)throw new Error;this.month=e%12||e}],Y:[/[+-]?\\d+/,l(\"year\")],YY:[n,function(t){t=+t,this.year=t+(t>68?1900:2e3)}],YYYY:[/\\d{4}/,l(\"year\")],Z:d,ZZ:d},f=function(t,e,s){try{var n=function(t){for(var e=(t=i(t,o&&o.formats)).match(a),s=e.length,n=0;n<s;n+=1){var r=e[n],h=p[r],l=h&&h[0],d=h&&h[1];e[n]=d?{regex:l,parser:d}:r.replace(/^\\[|\\]$/g,\"\")}return function(t){for(var i={},a=0,n=0;a<s;a+=1){var r=e[a];if(\"string\"==typeof r)n+=r.length;else{var h=r.regex,o=r.parser,l=t.substr(n),d=h.exec(l)[0];o.call(i,d),t=t.replace(d,\"\")}}return function(t){var e=t.afternoon;if(void 0!==e){var s=t.hours;e?s<12&&(t.hours+=12):12===s&&(t.hours=0),delete t.afternoon}}(i),i}}(e)(t),r=n.year,h=n.month,l=n.day,d=n.hours,c=n.minutes,u=n.seconds,f=n.milliseconds,g=n.zone,m=new Date,b=l||(r||h?1:m.getDate()),y=r||m.getFullYear(),v=0;r&&!h||(v=h>0?h-1:m.getMonth());var w=d||0,C=c||0,x=u||0,M=f||0;return g?new Date(Date.UTC(y,v,b,w,C,x,M+60*g.offset*1e3)):s?new Date(Date.UTC(y,v,b,w,C,x,M)):new Date(y,v,b,w,C,x,M)}catch(t){return new Date(\"\")}},function(t,e,s){s.p.customParseFormat=!0;var i=e.prototype,a=i.parse;i.parse=function(t){var e=t.date,i=t.utc,n=t.args;this.$u=i;var r=n[1];if(\"string\"==typeof r){var h=!0===n[2],l=!0===n[3],d=h||l,c=n[2];l&&(c=n[2]),o=this.$locale(),!h&&c&&(o=s.Ls[c]),this.$d=f(e,r,i),this.init(),c&&!0!==c&&(this.$L=this.locale(c).$L),d&&e!==this.format(r)&&(this.$d=new Date(\"\")),o={}}else if(r instanceof Array)for(var u=r.length,p=1;p<=u;p+=1){n[1]=r[p-1];var g=s.apply(this,n);if(g.isValid()){this.$d=g.$d,this.$L=g.$L,this.init();break}p===u&&(this.$d=new Date(\"\"))}else a.call(this,t)}})}));i.extend(a),s.parseDate=(t,e)=>{let s=!1;if(e)switch(e){case\"ISO_8601\":s=t;break;case\"RFC_2822\":s=i(t,\"ddd, MM MMM YYYY HH:mm:ss ZZ\").format(\"YYYYMMDD\");break;case\"MYSQL\":s=i(t,\"YYYY-MM-DD hh:mm:ss\").format(\"YYYYMMDD\");break;case\"UNIX\":s=i(t).unix();break;default:s=i(t,e).format(\"YYYYMMDD\")}return s}}).call(this)}).call(this,\"undefined\"!=typeof global?global:\"undefined\"!=typeof self?self:\"undefined\"!=typeof window?window:{})},{}],2:[function(t,e,s){\"use strict\";Object.defineProperty(s,\"__esModule\",{value:!0});const i=t=>\"[object Object]\"===Object.prototype.toString.call(t),a=(t,e)=>{const s=document.createElement(t);if(e&&\"object\"==typeof e)for(const t in e)\"html\"===t?s.innerHTML=e[t]:s.setAttribute(t,e[t]);return s},n=t=>{t instanceof NodeList?t.forEach((t=>n(t))):t.innerHTML=\"\"},r=(t,e,s)=>a(\"li\",{class:t,html:`<a href=\"#\" data-page=\"${e}\">${s}</a>`}),h=(t,e)=>{let s,i;1===e?(s=0,i=t.length):-1===e&&(s=t.length-1,i=-1);for(let a=!0;a;){a=!1;for(let n=s;n!=i;n+=e)if(t[n+e]&&t[n].value>t[n+e].value){const s=t[n],i=t[n+e],r=s;t[n]=i,t[n+e]=r,a=!0}}return t};class o{constructor(t,e){return this.dt=t,this.rows=e,this}build(t){const e=a(\"tr\");let s=this.dt.headings;return s.length||(s=t.map((()=>\"\"))),s.forEach(((s,i)=>{const n=a(\"td\");t[i]&&t[i].length||(t[i]=\"\"),n.innerHTML=t[i],n.data=t[i],e.appendChild(n)})),e}render(t){return t}add(t){if(Array.isArray(t)){const e=this.dt;Array.isArray(t[0])?t.forEach((t=>{e.data.push(this.build(t))})):e.data.push(this.build(t)),e.data.length&&(e.hasRows=!0),this.update(),e.columns().rebuild()}}remove(t){const e=this.dt;Array.isArray(t)?(t.sort(((t,e)=>e-t)),t.forEach((t=>{e.data.splice(t,1)}))):\"all\"==t?e.data=[]:e.data.splice(t,1),e.data.length||(e.hasRows=!1),this.update(),e.columns().rebuild()}update(){this.dt.data.forEach(((t,e)=>{t.dataIndex=e}))}}class l{constructor(t){return this.dt=t,this}swap(t){if(t.length&&2===t.length){const e=[];this.dt.headings.forEach(((t,s)=>{e.push(s)}));const s=t[0],i=t[1],a=e[i];e[i]=e[s],e[s]=a,this.order(e)}}order(t){let e,s,i,a,n,r,h;const o=[[],[],[],[]],l=this.dt;t.forEach(((t,i)=>{n=l.headings[t],r=\"false\"!==n.getAttribute(\"data-sortable\"),e=n.cloneNode(!0),e.originalCellIndex=i,e.sortable=r,o[0].push(e),l.hiddenColumns.includes(t)||(s=n.cloneNode(!0),s.originalCellIndex=i,s.sortable=r,o[1].push(s))})),l.data.forEach(((e,s)=>{i=e.cloneNode(!1),a=e.cloneNode(!1),i.dataIndex=a.dataIndex=s,null!==e.searchIndex&&void 0!==e.searchIndex&&(i.searchIndex=a.searchIndex=e.searchIndex),t.forEach((t=>{h=e.cells[t].cloneNode(!0),h.data=e.cells[t].data,i.appendChild(h),l.hiddenColumns.includes(t)||(h=e.cells[t].cloneNode(!0),h.data=e.cells[t].data,a.appendChild(h))})),o[2].push(i),o[3].push(a)})),l.headings=o[0],l.activeHeadings=o[1],l.data=o[2],l.activeRows=o[3],l.update()}hide(t){if(t.length){const e=this.dt;t.forEach((t=>{e.hiddenColumns.includes(t)||e.hiddenColumns.push(t)})),this.rebuild()}}show(t){if(t.length){let e;const s=this.dt;t.forEach((t=>{e=s.hiddenColumns.indexOf(t),e>-1&&s.hiddenColumns.splice(e,1)})),this.rebuild()}}visible(t){let e;const s=this.dt;return t=t||s.headings.map((t=>t.originalCellIndex)),isNaN(t)?Array.isArray(t)&&(e=[],t.forEach((t=>{e.push(!s.hiddenColumns.includes(t))}))):e=!s.hiddenColumns.includes(t),e}add(t){let e;const s=document.createElement(\"th\");if(!this.dt.headings.length)return this.dt.insert({headings:[t.heading],data:t.data.map((t=>[t]))}),void this.rebuild();this.dt.hiddenHeader?s.innerHTML=\"\":t.heading.nodeName?s.appendChild(t.heading):s.innerHTML=t.heading,this.dt.headings.push(s),this.dt.data.forEach(((s,i)=>{t.data[i]&&(e=document.createElement(\"td\"),t.data[i].nodeName?e.appendChild(t.data[i]):e.innerHTML=t.data[i],e.data=e.innerHTML,t.render&&(e.innerHTML=t.render.call(this,e.data,e,s)),s.appendChild(e))})),t.type&&s.setAttribute(\"data-type\",t.type),t.format&&s.setAttribute(\"data-format\",t.format),t.hasOwnProperty(\"sortable\")&&(s.sortable=t.sortable,s.setAttribute(\"data-sortable\",!0===t.sortable?\"true\":\"false\")),this.rebuild(),this.dt.renderHeader()}remove(t){Array.isArray(t)?(t.sort(((t,e)=>e-t)),t.forEach((t=>this.remove(t)))):(this.dt.headings.splice(t,1),this.dt.data.forEach((e=>{e.removeChild(e.cells[t])}))),this.rebuild()}filter(t,e,s,i){const a=this.dt;if(a.filterState||(a.filterState={originalData:a.data}),!a.filterState[t]){const e=[...i,()=>!0];a.filterState[t]=function(){let t=0;return()=>e[t++%e.length]}()}const n=a.filterState[t](),r=Array.from(a.filterState.originalData).filter((e=>{const s=e.cells[t],i=s.hasAttribute(\"data-content\")?s.getAttribute(\"data-content\"):s.innerText;return\"function\"==typeof n?n(i):i===n}));a.data=r,this.rebuild(),a.update(),s||a.emit(\"datatable.sort\",t,e)}sort(e,s,i){const a=this.dt;if(a.hasHeadings&&(e<0||e>a.headings.length))return!1;const n=a.options.filters&&a.options.filters[a.headings[e].textContent];if(n&&0!==n.length)return void this.filter(e,s,i,n);a.sorting=!0,i||a.emit(\"datatable.sorting\",e,s);let r=a.data;const o=[],l=[];let d=0,c=0;const u=a.headings[e],p=[];if(\"date\"===u.getAttribute(\"data-type\")){let e=!1;u.hasAttribute(\"data-format\")&&(e=u.getAttribute(\"data-format\")),p.push(Promise.resolve().then((function(){return t(\"./date-cd1c23ce.js\")})).then((({parseDate:t})=>s=>t(s,e))))}Promise.all(p).then((t=>{const n=t[0];let p,f;Array.from(r).forEach((t=>{const s=t.cells[e],i=s.hasAttribute(\"data-content\")?s.getAttribute(\"data-content\"):s.innerText;let a;a=n?n(i):\"string\"==typeof i?i.replace(/(\\$|,|\\s|%)/g,\"\"):i,parseFloat(a)==a?l[c++]={value:Number(a),row:t}:o[d++]={value:\"string\"==typeof i?i.toLowerCase():i,row:t}})),s||(s=u.classList.contains(\"asc\")?\"desc\":\"asc\"),\"desc\"==s?(p=h(o,-1),f=h(l,-1),u.classList.remove(\"asc\"),u.classList.add(\"desc\")):(p=h(l,1),f=h(o,1),u.classList.remove(\"desc\"),u.classList.add(\"asc\")),a.lastTh&&u!=a.lastTh&&(a.lastTh.classList.remove(\"desc\"),a.lastTh.classList.remove(\"asc\")),a.lastTh=u,r=p.concat(f),a.data=[];const g=[];r.forEach(((t,e)=>{a.data.push(t.row),null!==t.row.searchIndex&&void 0!==t.row.searchIndex&&g.push(e)})),a.searchData=g,this.rebuild(),a.update(),i||a.emit(\"datatable.sort\",e,s)}))}rebuild(){let t,e,s,i;const a=this.dt,n=[];a.activeRows=[],a.activeHeadings=[],a.headings.forEach(((t,e)=>{t.originalCellIndex=e,t.sortable=\"false\"!==t.getAttribute(\"data-sortable\"),a.hiddenColumns.includes(e)||a.activeHeadings.push(t)})),a.data.forEach(((r,h)=>{t=r.cloneNode(!1),e=r.cloneNode(!1),t.dataIndex=e.dataIndex=h,null!==r.searchIndex&&void 0!==r.searchIndex&&(t.searchIndex=e.searchIndex=r.searchIndex),Array.from(r.cells).forEach((n=>{s=n.cloneNode(!0),s.data=n.data,t.appendChild(s),a.hiddenColumns.includes(s.cellIndex)||(i=s.cloneNode(!0),i.data=s.data,e.appendChild(i))})),n.push(t),a.activeRows.push(e)})),a.data=n,a.update()}}const d=function(t){let e=!1,s=!1;if((t=t||this.options.data).headings){e=a(\"thead\");const s=a(\"tr\");t.headings.forEach((t=>{const e=a(\"th\",{html:t});s.appendChild(e)})),e.appendChild(s)}t.data&&t.data.length&&(s=a(\"tbody\"),t.data.forEach((e=>{if(t.headings&&t.headings.length!==e.length)throw new Error(\"The number of rows do not match the number of headings.\");const i=a(\"tr\");e.forEach((t=>{const e=a(\"td\",{html:t});i.appendChild(e)})),s.appendChild(i)}))),e&&(null!==this.table.tHead&&this.table.removeChild(this.table.tHead),this.table.appendChild(e)),s&&(this.table.tBodies.length&&this.table.removeChild(this.table.tBodies[0]),this.table.appendChild(s))},c={sortable:!0,searchable:!0,paging:!0,perPage:10,perPageSelect:[5,10,15,20,25],nextPrev:!0,firstLast:!1,prevText:\"&lsaquo;\",nextText:\"&rsaquo;\",firstText:\"&laquo;\",lastText:\"&raquo;\",ellipsisText:\"&hellip;\",ascText:\"▴\",descText:\"▾\",truncatePager:!0,pagerDelta:2,scrollY:\"\",fixedColumns:!0,fixedHeight:!1,header:!0,hiddenHeader:!1,footer:!1,labels:{placeholder:\"Search...\",perPage:\"{select} entries per page\",noRows:\"No entries found\",info:\"Showing {start} to {end} of {rows} entries\"},layout:{top:\"{select}{search}\",bottom:\"{info}{pager}\"}};class u{constructor(t,e={}){if(this.initialized=!1,this.options={...c,...e,layout:{...c.layout,...e.layout},labels:{...c.labels,...e.labels}},\"string\"==typeof t&&(t=document.querySelector(t)),this.initialLayout=t.innerHTML,this.initialSortable=this.options.sortable,this.options.header||(this.options.sortable=!1),null===t.tHead&&(!this.options.data||this.options.data&&!this.options.data.headings)&&(this.options.sortable=!1),t.tBodies.length&&!t.tBodies[0].rows.length&&this.options.data&&!this.options.data.data)throw new Error(\"You seem to be using the data option, but you've not defined any rows.\");this.table=t,this.listeners={onResize:t=>this.onResize(t)},this.init()}static extend(t,e){\"function\"==typeof e?u.prototype[t]=e:u[t]=e}init(t){if(this.initialized||this.table.classList.contains(\"dataTable-table\"))return!1;Object.assign(this.options,t||{}),this.currentPage=1,this.onFirstPage=!0,this.hiddenColumns=[],this.columnRenderers=[],this.selectedColumns=[],this.render(),setTimeout((()=>{this.emit(\"datatable.init\"),this.initialized=!0,this.options.plugins&&Object.entries(this.options.plugins).forEach((([t,e])=>{this[t]&&\"function\"==typeof this[t]&&(this[t]=this[t](e,{createElement:a}),e.enabled&&this[t].init&&\"function\"==typeof this[t].init&&this[t].init())}))}),10)}render(t){if(t){switch(t){case\"page\":this.renderPage();break;case\"pager\":this.renderPager();break;case\"header\":this.renderHeader()}return!1}const e=this.options;let s=\"\";if(e.data&&d.call(this),this.body=this.table.tBodies[0],this.head=this.table.tHead,this.foot=this.table.tFoot,this.body||(this.body=a(\"tbody\"),this.table.appendChild(this.body)),this.hasRows=this.body.rows.length>0,!this.head){const t=a(\"thead\"),s=a(\"tr\");this.hasRows&&(Array.from(this.body.rows[0].cells).forEach((()=>{s.appendChild(a(\"th\"))})),t.appendChild(s)),this.head=t,this.table.insertBefore(this.head,this.body),this.hiddenHeader=e.hiddenHeader}if(this.headings=[],this.hasHeadings=this.head.rows.length>0,this.hasHeadings&&(this.header=this.head.rows[0],this.headings=[].slice.call(this.header.cells)),e.header||this.head&&this.table.removeChild(this.table.tHead),e.footer?this.head&&!this.foot&&(this.foot=a(\"tfoot\",{html:this.head.innerHTML}),this.table.appendChild(this.foot)):this.foot&&this.table.removeChild(this.table.tFoot),this.wrapper=a(\"div\",{class:\"dataTable-wrapper dataTable-loading\"}),s+=\"<div class='dataTable-top'>\",s+=e.layout.top,s+=\"</div>\",e.scrollY.length?s+=`<div class='dataTable-container' style='height: ${e.scrollY}; overflow-Y: auto;'></div>`:s+=\"<div class='dataTable-container'></div>\",s+=\"<div class='dataTable-bottom'>\",s+=e.layout.bottom,s+=\"</div>\",s=s.replace(\"{info}\",e.paging?\"<div class='dataTable-info'></div>\":\"\"),e.paging&&e.perPageSelect){let t=\"<div class='dataTable-dropdown'><label>\";t+=e.labels.perPage,t+=\"</label></div>\";const i=a(\"select\",{class:\"dataTable-selector\"});e.perPageSelect.forEach((t=>{const s=t===e.perPage,a=new Option(t,t,s,s);i.add(a)})),t=t.replace(\"{select}\",i.outerHTML),s=s.replace(\"{select}\",t)}else s=s.replace(\"{select}\",\"\");if(e.searchable){const t=`<div class='dataTable-search'><input class='dataTable-input' placeholder='${e.labels.placeholder}' type='text'></div>`;s=s.replace(\"{search}\",t)}else s=s.replace(\"{search}\",\"\");this.hasHeadings&&this.render(\"header\"),this.table.classList.add(\"dataTable-table\");const i=a(\"nav\",{class:\"dataTable-pagination\"}),n=a(\"ul\",{class:\"dataTable-pagination-list\"});i.appendChild(n),s=s.replace(/\\{pager\\}/g,i.outerHTML),this.wrapper.innerHTML=s,this.container=this.wrapper.querySelector(\".dataTable-container\"),this.pagers=this.wrapper.querySelectorAll(\".dataTable-pagination-list\"),this.label=this.wrapper.querySelector(\".dataTable-info\"),this.table.parentNode.replaceChild(this.wrapper,this.table),this.container.appendChild(this.table),this.rect=this.table.getBoundingClientRect(),this.data=Array.from(this.body.rows),this.activeRows=this.data.slice(),this.activeHeadings=this.headings.slice(),this.update(),this.setColumns(),this.fixHeight(),this.fixColumns(),e.header||this.wrapper.classList.add(\"no-header\"),e.footer||this.wrapper.classList.add(\"no-footer\"),e.sortable&&this.wrapper.classList.add(\"sortable\"),e.searchable&&this.wrapper.classList.add(\"searchable\"),e.fixedHeight&&this.wrapper.classList.add(\"fixed-height\"),e.fixedColumns&&this.wrapper.classList.add(\"fixed-columns\"),this.bindEvents()}renderPage(){if(this.hasHeadings&&(n(this.header),this.activeHeadings.forEach((t=>this.header.appendChild(t)))),this.hasRows&&this.totalPages){this.currentPage>this.totalPages&&(this.currentPage=1);const t=this.currentPage-1,e=document.createDocumentFragment();this.pages[t].forEach((t=>e.appendChild(this.rows().render(t)))),this.clear(e),this.onFirstPage=1===this.currentPage,this.onLastPage=this.currentPage===this.lastPage}else this.setMessage(this.options.labels.noRows);let t,e=0,s=0,i=0;if(this.totalPages&&(e=this.currentPage-1,s=e*this.options.perPage,i=s+this.pages[e].length,s+=1,t=this.searching?this.searchData.length:this.data.length),this.label&&this.options.labels.info.length){const e=this.options.labels.info.replace(\"{start}\",s).replace(\"{end}\",i).replace(\"{page}\",this.currentPage).replace(\"{pages}\",this.totalPages).replace(\"{rows}\",t);this.label.innerHTML=t?e:\"\"}1==this.currentPage&&this.fixHeight()}renderPager(){if(n(this.pagers),this.totalPages>1){const t=\"pager\",e=document.createDocumentFragment(),s=this.onFirstPage?1:this.currentPage-1,i=this.onLastPage?this.totalPages:this.currentPage+1;this.options.firstLast&&e.appendChild(r(t,1,this.options.firstText)),this.options.nextPrev&&e.appendChild(r(t,s,this.options.prevText));let n=this.links;this.options.truncatePager&&(n=((t,e,s,i,n)=>{let r;const h=2*(i=i||2);let o=e-i,l=e+i;const d=[],c=[];e<4-i+h?l=3+h:e>s-(3-i+h)&&(o=s-(2+h));for(let e=1;e<=s;e++)if(1==e||e==s||e>=o&&e<=l){const s=t[e-1];s.classList.remove(\"active\"),d.push(s)}return d.forEach((e=>{const s=e.children[0].getAttribute(\"data-page\");if(r){const e=r.children[0].getAttribute(\"data-page\");if(s-e==2)c.push(t[e]);else if(s-e!=1){const t=a(\"li\",{class:\"ellipsis\",html:`<a href=\"#\">${n}</a>`});c.push(t)}}c.push(e),r=e})),c})(this.links,this.currentPage,this.pages.length,this.options.pagerDelta,this.options.ellipsisText)),this.links[this.currentPage-1].classList.add(\"active\"),n.forEach((t=>{t.classList.remove(\"active\"),e.appendChild(t)})),this.links[this.currentPage-1].classList.add(\"active\"),this.options.nextPrev&&e.appendChild(r(t,i,this.options.nextText)),this.options.firstLast&&e.appendChild(r(t,this.totalPages,this.options.lastText)),this.pagers.forEach((t=>{t.appendChild(e.cloneNode(!0))}))}}renderHeader(){this.labels=[],this.headings&&this.headings.length&&this.headings.forEach(((t,e)=>{if(this.labels[e]=t.textContent,t.firstElementChild&&t.firstElementChild.classList.contains(\"dataTable-sorter\")&&(t.innerHTML=t.firstElementChild.innerHTML),t.sortable=\"false\"!==t.getAttribute(\"data-sortable\"),t.originalCellIndex=e,this.options.sortable&&t.sortable){const e=a(\"a\",{href:\"#\",class:\"dataTable-sorter\",html:t.innerHTML});t.innerHTML=\"\",t.setAttribute(\"data-sortable\",\"\"),t.appendChild(e)}})),this.fixColumns()}bindEvents(){const t=this.options;if(t.perPageSelect){const e=this.wrapper.querySelector(\".dataTable-selector\");e&&e.addEventListener(\"change\",(()=>{t.perPage=parseInt(e.value,10),this.update(),this.fixHeight(),this.emit(\"datatable.perpage\",t.perPage)}),!1)}t.searchable&&(this.input=this.wrapper.querySelector(\".dataTable-input\"),this.input&&this.input.addEventListener(\"keyup\",(()=>this.search(this.input.value)),!1)),this.wrapper.addEventListener(\"click\",(e=>{const s=e.target.closest(\"a\");s&&\"a\"===s.nodeName.toLowerCase()&&(s.hasAttribute(\"data-page\")?(this.page(s.getAttribute(\"data-page\")),e.preventDefault()):t.sortable&&s.classList.contains(\"dataTable-sorter\")&&\"false\"!=s.parentNode.getAttribute(\"data-sortable\")&&(this.columns().sort(this.headings.indexOf(s.parentNode)),e.preventDefault()))}),!1),window.addEventListener(\"resize\",this.listeners.onResize)}onResize(){this.rect=this.container.getBoundingClientRect(),this.rect.width&&this.fixColumns()}setColumns(t){t||this.data.forEach((t=>{Array.from(t.cells).forEach((t=>{t.data=t.innerHTML}))})),this.options.columns&&this.headings.length&&this.options.columns.forEach((t=>{Array.isArray(t.select)||(t.select=[t.select]),t.hasOwnProperty(\"render\")&&\"function\"==typeof t.render&&(this.selectedColumns=this.selectedColumns.concat(t.select),this.columnRenderers.push({columns:t.select,renderer:t.render})),t.select.forEach((e=>{const s=this.headings[e];t.type&&s.setAttribute(\"data-type\",t.type),t.format&&s.setAttribute(\"data-format\",t.format),t.hasOwnProperty(\"sortable\")&&s.setAttribute(\"data-sortable\",t.sortable),t.hasOwnProperty(\"hidden\")&&!1!==t.hidden&&this.columns().hide([e]),t.hasOwnProperty(\"sort\")&&1===t.select.length&&this.columns().sort(t.select[0],t.sort,!0)}))})),this.hasRows&&(this.data.forEach(((t,e)=>{t.dataIndex=e,Array.from(t.cells).forEach((t=>{t.data=t.innerHTML}))})),this.selectedColumns.length&&this.data.forEach((t=>{Array.from(t.cells).forEach(((e,s)=>{this.selectedColumns.includes(s)&&this.columnRenderers.forEach((i=>{i.columns.includes(s)&&(e.innerHTML=i.renderer.call(this,e.data,e,t))}))}))})),this.columns().rebuild()),this.render(\"header\")}destroy(){this.table.innerHTML=this.initialLayout,this.table.classList.remove(\"dataTable-table\"),this.wrapper.parentNode.replaceChild(this.table,this.wrapper),this.initialized=!1,window.removeEventListener(\"resize\",this.listeners.onResize)}update(){this.wrapper.classList.remove(\"dataTable-empty\"),this.paginate(this),this.render(\"page\"),this.links=[];let t=this.pages.length;for(;t--;){const e=t+1;this.links[t]=r(0===t?\"active\":\"\",e,e)}this.sorting=!1,this.render(\"pager\"),this.rows().update(),this.emit(\"datatable.update\")}paginate(){const t=this.options.perPage;let e=this.activeRows;return this.searching&&(e=[],this.searchData.forEach((t=>e.push(this.activeRows[t])))),this.options.paging?this.pages=e.map(((s,i)=>i%t==0?e.slice(i,i+t):null)).filter((t=>t)):this.pages=[e],this.totalPages=this.lastPage=this.pages.length,this.totalPages}fixColumns(){if((this.options.scrollY.length||this.options.fixedColumns)&&this.activeHeadings&&this.activeHeadings.length){let t,e=!1;if(this.columnWidths=[],this.table.tHead){if(this.options.scrollY.length&&(e=a(\"thead\"),e.appendChild(a(\"tr\")),e.style.height=\"0px\",this.headerTable&&(this.table.tHead=this.headerTable.tHead)),this.activeHeadings.forEach((t=>{t.style.width=\"\"})),this.activeHeadings.forEach(((t,s)=>{const i=t.offsetWidth,n=i/this.rect.width*100;if(t.style.width=n+\"%\",this.columnWidths[s]=i,this.options.scrollY.length){const t=a(\"th\");e.firstElementChild.appendChild(t),t.style.width=n+\"%\",t.style.paddingTop=\"0\",t.style.paddingBottom=\"0\",t.style.border=\"0\"}})),this.options.scrollY.length){const t=this.table.parentElement;if(!this.headerTable){this.headerTable=a(\"table\",{class:\"dataTable-table\"});const e=a(\"div\",{class:\"dataTable-headercontainer\"});e.appendChild(this.headerTable),t.parentElement.insertBefore(e,t)}const s=this.table.tHead;this.table.replaceChild(e,s),this.headerTable.tHead=s,this.headerTable.parentElement.style.paddingRight=this.headerTable.clientWidth-this.table.clientWidth+parseInt(this.headerTable.parentElement.style.paddingRight||\"0\",10)+\"px\",t.scrollHeight>t.clientHeight&&(t.style.overflowY=\"scroll\")}}else{t=[],e=a(\"thead\");const s=a(\"tr\");Array.from(this.table.tBodies[0].rows[0].cells).forEach((()=>{const e=a(\"th\");s.appendChild(e),t.push(e)})),e.appendChild(s),this.table.insertBefore(e,this.body);const i=[];t.forEach(((t,e)=>{const s=t.offsetWidth,a=s/this.rect.width*100;i.push(a),this.columnWidths[e]=s})),this.data.forEach((t=>{Array.from(t.cells).forEach(((t,e)=>{this.columns(t.cellIndex).visible()&&(t.style.width=i[e]+\"%\")}))})),this.table.removeChild(e)}}}fixHeight(){this.options.fixedHeight&&(this.container.style.height=null,this.rect=this.container.getBoundingClientRect(),this.container.style.height=this.rect.height+\"px\")}search(t){return!!this.hasRows&&(t=t.toLowerCase(),this.currentPage=1,this.searching=!0,this.searchData=[],t.length?(this.clear(),this.data.forEach(((e,s)=>{const i=this.searchData.includes(e);t.split(\" \").reduce(((t,s)=>{let i=!1,a=null,n=null;for(let t=0;t<e.cells.length;t++)if(a=e.cells[t],n=a.hasAttribute(\"data-content\")?a.getAttribute(\"data-content\"):a.textContent,n.toLowerCase().includes(s)&&this.columns(a.cellIndex).visible()){i=!0;break}return t&&i}),!0)&&!i?(e.searchIndex=s,this.searchData.push(s)):e.searchIndex=null})),this.wrapper.classList.add(\"search-results\"),this.searchData.length?this.update():(this.wrapper.classList.remove(\"search-results\"),this.setMessage(this.options.labels.noRows)),void this.emit(\"datatable.search\",t,this.searchData)):(this.searching=!1,this.update(),this.emit(\"datatable.search\",t,this.searchData),this.wrapper.classList.remove(\"search-results\"),!1))}page(t){return t!=this.currentPage&&(isNaN(t)||(this.currentPage=parseInt(t,10)),!(t>this.pages.length||t<0)&&(this.render(\"page\"),this.render(\"pager\"),void this.emit(\"datatable.page\",t)))}sortColumn(t,e){this.columns().sort(t,e)}insert(t){let e=[];if(i(t)){if(t.headings&&!this.hasHeadings&&!this.hasRows){const e=a(\"tr\");t.headings.forEach((t=>{const s=a(\"th\",{html:t});e.appendChild(s)})),this.head.appendChild(e),this.header=e,this.headings=[].slice.call(e.cells),this.hasHeadings=!0,this.options.sortable=this.initialSortable,this.render(\"header\"),this.activeHeadings=this.headings.slice()}t.data&&Array.isArray(t.data)&&(e=t.data)}else Array.isArray(t)&&t.forEach((t=>{const s=[];Object.entries(t).forEach((([t,e])=>{const i=this.labels.indexOf(t);i>-1&&(s[i]=e)})),e.push(s)}));e.length&&(this.rows().add(e),this.hasRows=!0),this.update(),this.setColumns(),this.fixColumns()}refresh(){this.options.searchable&&(this.input.value=\"\",this.searching=!1),this.currentPage=1,this.onFirstPage=!0,this.update(),this.emit(\"datatable.refresh\")}clear(t){this.body&&n(this.body);let e=this.body;this.body||(e=this.table),t&&(\"string\"==typeof t&&(document.createDocumentFragment().innerHTML=t),e.appendChild(t))}export(t){if(!this.hasHeadings&&!this.hasRows)return!1;const e=this.activeHeadings;let s=[];const a=[];let n,r,h,o;if(!i(t))return!1;const l={download:!0,skipColumn:[],lineDelimiter:\"\\n\",columnDelimiter:\",\",tableName:\"myTable\",replacer:null,space:4,...t};if(l.type){if(\"txt\"!==l.type&&\"csv\"!==l.type||(s[0]=this.header),l.selection)if(isNaN(l.selection)){if(Array.isArray(l.selection))for(n=0;n<l.selection.length;n++)s=s.concat(this.pages[l.selection[n]-1])}else s=s.concat(this.pages[l.selection-1]);else s=s.concat(this.activeRows);if(s.length){if(\"txt\"===l.type||\"csv\"===l.type){for(h=\"\",n=0;n<s.length;n++){for(r=0;r<s[n].cells.length;r++)if(!l.skipColumn.includes(e[r].originalCellIndex)&&this.columns(e[r].originalCellIndex).visible()){let t=s[n].cells[r].textContent;t=t.trim(),t=t.replace(/\\s{2,}/g,\" \"),t=t.replace(/\\n/g,\"  \"),t=t.replace(/\"/g,'\"\"'),t=t.replace(/#/g,\"%23\"),t.includes(\",\")&&(t=`\"${t}\"`),h+=t+l.columnDelimiter}h=h.trim().substring(0,h.length-1),h+=l.lineDelimiter}h=h.trim().substring(0,h.length-1),l.download&&(h=\"data:text/csv;charset=utf-8,\"+h)}else if(\"sql\"===l.type){for(h=`INSERT INTO \\`${l.tableName}\\` (`,n=0;n<e.length;n++)!l.skipColumn.includes(e[n].originalCellIndex)&&this.columns(e[n].originalCellIndex).visible()&&(h+=`\\`${e[n].textContent}\\`,`);for(h=h.trim().substring(0,h.length-1),h+=\") VALUES \",n=0;n<s.length;n++){for(h+=\"(\",r=0;r<s[n].cells.length;r++)!l.skipColumn.includes(e[r].originalCellIndex)&&this.columns(e[r].originalCellIndex).visible()&&(h+=`\"${s[n].cells[r].textContent}\",`);h=h.trim().substring(0,h.length-1),h+=\"),\"}h=h.trim().substring(0,h.length-1),h+=\";\",l.download&&(h=\"data:application/sql;charset=utf-8,\"+h)}else if(\"json\"===l.type){for(r=0;r<s.length;r++)for(a[r]=a[r]||{},n=0;n<e.length;n++)!l.skipColumn.includes(e[n].originalCellIndex)&&this.columns(e[n].originalCellIndex).visible()&&(a[r][e[n].textContent]=s[r].cells[n].textContent);h=JSON.stringify(a,l.replacer,l.space),l.download&&(h=\"data:application/json;charset=utf-8,\"+h)}return l.download&&(l.filename=l.filename||\"datatable_export\",l.filename+=\".\"+l.type,h=encodeURI(h),o=document.createElement(\"a\"),o.href=h,o.download=l.filename,document.body.appendChild(o),o.click(),document.body.removeChild(o)),h}}return!1}import(t){let e=!1;if(!i(t))return!1;const s={lineDelimiter:\"\\n\",columnDelimiter:\",\",...t};if(s.data.length||i(s.data)){if(\"csv\"===s.type){e={data:[]};const t=s.data.split(s.lineDelimiter);t.length&&(s.headings&&(e.headings=t[0].split(s.columnDelimiter),t.shift()),t.forEach(((t,i)=>{e.data[i]=[];const a=t.split(s.columnDelimiter);a.length&&a.forEach((t=>{e.data[i].push(t)}))})))}else if(\"json\"===s.type){const t=(t=>{let e=!1;try{e=JSON.parse(t)}catch(t){return!1}return!(null===e||!Array.isArray(e)&&!i(e))&&e})(s.data);t&&(e={headings:[],data:[]},t.forEach(((t,s)=>{e.data[s]=[],Object.entries(t).forEach((([t,i])=>{e.headings.includes(t)||e.headings.push(t),e.data[s].push(i)}))})))}i(s.data)&&(e=s.data),e&&this.insert(e)}return!1}print(){const t=this.activeHeadings,e=this.activeRows,s=a(\"table\"),i=a(\"thead\"),n=a(\"tbody\"),r=a(\"tr\");t.forEach((t=>{r.appendChild(a(\"th\",{html:t.textContent}))})),i.appendChild(r),e.forEach((t=>{const e=a(\"tr\");Array.from(t.cells).forEach((t=>{e.appendChild(a(\"td\",{html:t.textContent}))})),n.appendChild(e)})),s.appendChild(i),s.appendChild(n);const h=window.open();h.document.body.appendChild(s),h.print()}setMessage(t){let e=1;this.hasRows?e=this.data[0].cells.length:this.activeHeadings.length&&(e=this.activeHeadings.length),this.wrapper.classList.add(\"dataTable-empty\"),this.label&&(this.label.innerHTML=\"\"),this.totalPages=0,this.render(\"pager\"),this.clear(a(\"tr\",{html:`<td class=\"dataTables-empty\" colspan=\"${e}\">${t}</td>`}))}columns(t){return new l(this,t)}rows(t){return new o(this,t)}on(t,e){this.events=this.events||{},this.events[t]=this.events[t]||[],this.events[t].push(e)}off(t,e){this.events=this.events||{},t in this.events!=0&&this.events[t].splice(this.events[t].indexOf(e),1)}emit(t){if(this.events=this.events||{},t in this.events!=0)for(let e=0;e<this.events[t].length;e++)this.events[t][e].apply(this,Array.prototype.slice.call(arguments,1))}}s.DataTable=u},{\"./date-cd1c23ce.js\":1}]},{},[2])(2)}));\n//# sourceMappingURL=/sm/b71d1fdf2e18834149b01e90c6fb68c49c8720f6f79466e6360b5d5b6793e05e.map\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/docs.js",
    "content": "(function () {\n  let navbarToggler = document.getElementsByClassName(\"ct-docs-navbar-toggler\")[0];\n  navbarToggler.addEventListener(\"click\", function() {\n    let sidebarCollapseLinks = document.getElementsByClassName(\"ct-docs-sidebar-collapse-links\")[0];\n    if (sidebarCollapseLinks.style.maxHeight) {\n      sidebarCollapseLinks.style.maxHeight = null;\n      sidebarCollapseLinks.style.padding = null;\n      sidebarCollapseLinks.style.display = null;\n    } else {\n      sidebarCollapseLinks.style.display = \"block\";\n      // the 48 is for the padding heights as well\n      // 2rem + 1rem = 3rem = 3 * 16 px = 48px\n      sidebarCollapseLinks.style.maxHeight = sidebarCollapseLinks.scrollHeight + 48 + \"px\";\n      sidebarCollapseLinks.style.padding = \"2rem 0 1rem\";\n    }\n  })\n  // navbar dropdowns init\n  let dropdowns = document.getElementsByClassName(\"ct-docs-nav-item-dropdown\");\n  for (var i = 0; i < dropdowns.length; i++) {\n    dropdowns[i].addEventListener(\"mouseenter\", dropdownEvent);\n    dropdowns[i].addEventListener(\"mouseleave\", dropdownEvent);\n  }\n  function dropdownEvent(event) {\n    let currentEventTarget = event.currentTarget;\n    let dropdownMenu = currentEventTarget.getElementsByClassName(\"ct-docs-navbar-dropdown-menu\")[0];\n    if(dropdownMenu.classList.contains(\"ct-docs-navbar-dropdown-menu-show\")) {\n      dropdownMenu.style.display = null;\n      dropdownMenu.classList.remove(\"ct-docs-navbar-dropdown-menu-show\");\n    } else {\n      dropdownMenu.style.display = \"block\";\n      dropdownMenu.classList.add(\"ct-docs-navbar-dropdown-menu-show\");\n    }\n  }\n})();\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/jkanban.js",
    "content": "(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c=\"function\"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error(\"Cannot find module '\"+i+\"'\");throw a.code=\"MODULE_NOT_FOUND\",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u=\"function\"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){\n/**\n * jKanban\n * Vanilla Javascript plugin for manage kanban boards\n *\n * @site: http://www.riccardotartaglia.it/jkanban/\n * @author: Riccardo Tartaglia\n */\n\n//Require dragula\nvar dragula = require(\"dragula\");\n\n(function() {\n  this.jKanban = function() {\n    var self = this;\n    var __DEFAULT_ITEM_HANDLE_OPTIONS = {\n      enabled: false\n    }\n    this._disallowedItemProperties = [\n      \"id\",\n      \"title\",\n      \"click\",\n      \"drag\",\n      \"dragend\",\n      \"drop\",\n      \"order\"\n    ];\n    this.element = \"\";\n    this.container = \"\";\n    this.boardContainer = [];\n    this.handlers = [];\n    this.dragula = dragula;\n    this.drake = \"\";\n    this.drakeBoard = \"\";\n    this.addItemButton = false;\n    this.buttonContent = \"+\";\n    this.itemHandleOptions = __DEFAULT_ITEM_HANDLE_OPTIONS;\n    var defaults = {\n      element: \"\",\n      gutter: \"15px\",\n      widthBoard: \"250px\",\n      responsive: \"700\",\n      responsivePercentage: false,\n      boards: [],\n      dragBoards: true,\n      dragItems: true, //whether can drag cards or not, useful when set permissions on it.\n      addItemButton: false,\n      buttonContent: \"+\",\n      itemHandleOptions: __DEFAULT_ITEM_HANDLE_OPTIONS,\n      dragEl: function(el, source) {},\n      dragendEl: function(el) {},\n      dropEl: function(el, target, source, sibling) {},\n      dragBoard: function(el, source) {},\n      dragendBoard: function(el) {},\n      dropBoard: function(el, target, source, sibling) {},\n      click: function(el) {},\n      buttonClick: function(el, boardId) {}\n    };\n\n    if (arguments[0] && typeof arguments[0] === \"object\") {\n      this.options = __extendDefaults(defaults, arguments[0]);\n    }\n\n    this.__getCanMove = function(handle) {\n      if (!self.options.itemHandleOptions.enabled) {\n        return !!self.options.dragItems;\n      }\n\n      if (self.options.itemHandleOptions.handleClass) {\n        return handle.classList.contains(self.options.itemHandleOptions.handleClass);\n      }\n\n      return handle.classList.contains(\"item_handle\")\n    }\n\n    this.init = function() {\n      //set initial boards\n      __setBoard();\n      //set drag with dragula\n      if (window.innerWidth > self.options.responsive) {\n        //Init Drag Board\n        self.drakeBoard = self\n          .dragula([self.container], {\n            moves: function(el, source, handle, sibling) {\n              if (!self.options.dragBoards) return false;\n              return (\n                handle.classList.contains(\"kanban-board-header\") ||\n                handle.classList.contains(\"kanban-title-board\")\n              );\n            },\n            accepts: function(el, target, source, sibling) {\n              return target.classList.contains(\"kanban-container\");\n            },\n            revertOnSpill: true,\n            direction: \"horizontal\"\n          })\n          .on(\"drag\", function(el, source) {\n            el.classList.add(\"is-moving\");\n            self.options.dragBoard(el, source);\n            if (typeof el.dragfn === \"function\") el.dragfn(el, source);\n          })\n          .on(\"dragend\", function(el) {\n            __updateBoardsOrder();\n            el.classList.remove(\"is-moving\");\n            self.options.dragendBoard(el);\n            if (typeof el.dragendfn === \"function\") el.dragendfn(el);\n          })\n          .on(\"drop\", function(el, target, source, sibling) {\n            el.classList.remove(\"is-moving\");\n            self.options.dropBoard(el, target, source, sibling);\n            if (typeof el.dropfn === \"function\")\n              el.dropfn(el, target, source, sibling);\n          });\n\n        //Init Drag Item\n        self.drake = self\n          .dragula(self.boardContainer, {\n            moves: function(el, source, handle, sibling) {\n              return self.__getCanMove(handle);\n            },\n            revertOnSpill: true\n          })\n          .on(\"cancel\", function(el, container, source) {\n            self.enableAllBoards();\n          })\n          .on(\"drag\", function(el, source) {\n            var elClass = el.getAttribute(\"class\");\n            if (elClass !== \"\" && elClass.indexOf(\"not-draggable\") > -1) {\n              self.drake.cancel(true);\n              return;\n            }\n\n            el.classList.add(\"is-moving\");\n            var boardJSON = __findBoardJSON(source.parentNode.dataset.id);\n            if (boardJSON.dragTo !== undefined) {\n              self.options.boards.map(function(board) {\n                if (\n                  boardJSON.dragTo.indexOf(board.id) === -1 &&\n                  board.id !== source.parentNode.dataset.id\n                ) {\n                  self.findBoard(board.id).classList.add(\"disabled-board\");\n                }\n              });\n            }\n\n            self.options.dragEl(el, source);\n            if (el !== null && typeof el.dragfn === \"function\")\n              el.dragfn(el, source);\n          })\n          .on(\"dragend\", function(el) {\n            self.options.dragendEl(el);\n            if (el !== null && typeof el.dragendfn === \"function\")\n              el.dragendfn(el);\n          })\n          .on(\"drop\", function(el, target, source, sibling) {\n            self.enableAllBoards();\n\n            var boardJSON = __findBoardJSON(source.parentNode.dataset.id);\n            if (boardJSON.dragTo !== undefined) {\n              if (\n                boardJSON.dragTo.indexOf(target.parentNode.dataset.id) === -1 &&\n                target.parentNode.dataset.id !== source.parentNode.dataset.id\n              ) {\n                self.drake.cancel(true);\n              }\n            }\n            if (el !== null) {\n              var result = self.options.dropEl(el, target, source, sibling);\n              if (result === false) {\n                self.drake.cancel(true);\n              }\n              el.classList.remove(\"is-moving\");\n              if (typeof el.dropfn === \"function\")\n                el.dropfn(el, target, source, sibling);\n            }\n          });\n      }\n    };\n\n    this.enableAllBoards = function() {\n      var allB = document.querySelectorAll(\".kanban-board\");\n      if (allB.length > 0 && allB !== undefined) {\n        for (var i = 0; i < allB.length; i++) {\n          allB[i].classList.remove(\"disabled-board\");\n        }\n      }\n    };\n\n    this.addElement = function(boardID, element) {\n      var board = self.element.querySelector(\n        '[data-id=\"' + boardID + '\"] .kanban-drag'\n      );\n      var nodeItem = document.createElement(\"div\");\n      nodeItem.classList.add(\"kanban-item\");\n      if (typeof element.id !== \"undefined\" && element.id !== \"\") {\n        nodeItem.setAttribute(\"data-eid\", element.id);\n      }\n      if(element.class && Array.isArray(element.class)) {\n\telement.class.forEach( function(cl){\n\t  nodeItem.classList.add(cl);\n\t})\n      }\n      nodeItem.innerHTML = __buildItemTitle(element.title);\n      //add function\n      nodeItem.clickfn = element.click;\n      nodeItem.dragfn = element.drag;\n      nodeItem.dragendfn = element.dragend;\n      nodeItem.dropfn = element.drop;\n      __appendCustomProperties(nodeItem, element);\n      __onclickHandler(nodeItem);\n      if (self.options.itemHandleOptions.enabled) {\n        nodeItem.style.cursor = \"default\";\n      }\n      board.appendChild(nodeItem);\n      return self;\n    };\n\n    this.addForm = function(boardID, formItem) {\n      var board = self.element.querySelector(\n        '[data-id=\"' + boardID + '\"] .kanban-drag'\n      );\n      var _attribute = formItem.getAttribute(\"class\");\n      formItem.setAttribute(\"class\", _attribute + \" not-draggable\");\n      board.appendChild(formItem);\n      return self;\n    };\n\n    this.addBoards = function(boards, isInit) {\n      if (self.options.responsivePercentage) {\n        self.container.style.width = \"100%\";\n        self.options.gutter = \"1%\";\n        if (window.innerWidth > self.options.responsive) {\n          var boardWidth = (100 - boards.length * 2) / boards.length;\n        } else {\n          var boardWidth = 100 - boards.length * 2;\n        }\n      } else {\n        var boardWidth = self.options.widthBoard;\n      }\n      var addButton = self.options.addItemButton;\n      var buttonContent = self.options.buttonContent;\n\n      //for on all the boards\n      for (var boardkey in boards) {\n        // single board\n        var board = boards[boardkey];\n        if (!isInit) {\n          self.options.boards.push(board);\n        }\n\n        if (!self.options.responsivePercentage) {\n          //add width to container\n          if (self.container.style.width === \"\") {\n            self.container.style.width =\n              parseInt(boardWidth) + parseInt(self.options.gutter) * 2 + \"px\";\n          } else {\n            self.container.style.width =\n              parseInt(self.container.style.width) +\n              parseInt(boardWidth) +\n              parseInt(self.options.gutter) * 2 +\n              \"px\";\n          }\n        }\n        //create node\n        var boardNode = document.createElement(\"div\");\n        boardNode.dataset.id = board.id;\n        boardNode.dataset.order = self.container.childNodes.length + 1;\n        boardNode.classList.add(\"kanban-board\");\n        //set style\n        if (self.options.responsivePercentage) {\n          boardNode.style.width = boardWidth + \"%\";\n        } else {\n          boardNode.style.width = boardWidth;\n        }\n        boardNode.style.marginLeft = self.options.gutter;\n        boardNode.style.marginRight = self.options.gutter;\n        // header board\n        var headerBoard = document.createElement(\"header\");\n        if (board.class !== \"\" && board.class !== undefined)\n          var allClasses = board.class.split(\",\");\n        else allClasses = [];\n        headerBoard.classList.add(\"kanban-board-header\");\n        allClasses.map(function(value) {\n          headerBoard.classList.add(value);\n        });\n        headerBoard.innerHTML =\n          '<div class=\"kanban-title-board\">' + board.title + \"</div>\";\n        // if add button is true, add button to the board\n        if (addButton) {\n          var btn = document.createElement(\"BUTTON\");\n          var t = document.createTextNode(buttonContent);\n          btn.setAttribute(\n            \"class\",\n            \"kanban-title-button btn btn-sm btn-white\"\n          );\n          btn.appendChild(t);\n          //var buttonHtml = '<button class=\"kanban-title-button btn btn-default btn-xs\">'+buttonContent+'</button>'\n          headerBoard.appendChild(btn);\n          __onButtonClickHandler(btn, board.id);\n        }\n        //content board\n        var contentBoard = document.createElement(\"main\");\n        contentBoard.classList.add(\"kanban-drag\");\n        if (board.bodyClass !== \"\" && board.bodyClass !== undefined)\n          var bodyClasses = board.bodyClass.split(\",\");\n        else bodyClasses = [];\n        bodyClasses.map(function(value) {\n          contentBoard.classList.add(value);\n        });\n        //add drag to array for dragula\n        self.boardContainer.push(contentBoard);\n        for (var itemkey in board.item) {\n          //create item\n          var itemKanban = board.item[itemkey];\n          var nodeItem = document.createElement(\"div\");\n          nodeItem.classList.add(\"kanban-item\");\n          if (itemKanban.id) {\n            nodeItem.dataset.eid = itemKanban.id;\n          }\n          if(itemKanban.class && Array.isArray(itemKanban.class)) {\n            itemKanban.class.forEach( function(cl){\n              nodeItem.classList.add(cl);\n            })\n          }\n          nodeItem.innerHTML = __buildItemTitle(itemKanban.title);\n          //add function\n          nodeItem.clickfn = itemKanban.click;\n          nodeItem.dragfn = itemKanban.drag;\n          nodeItem.dragendfn = itemKanban.dragend;\n          nodeItem.dropfn = itemKanban.drop;\n          __appendCustomProperties(nodeItem, itemKanban);\n          //add click handler of item\n          __onclickHandler(nodeItem);\n          if (self.options.itemHandleOptions.enabled) {\n            nodeItem.style.cursor = \"default\";\n          }\n          contentBoard.appendChild(nodeItem);\n        }\n        //footer board\n        var footerBoard = document.createElement(\"footer\");\n        //board assembly\n        boardNode.appendChild(headerBoard);\n        boardNode.appendChild(contentBoard);\n        boardNode.appendChild(footerBoard);\n        //board add\n        self.container.appendChild(boardNode);\n      }\n      return self;\n    };\n\n    this.findBoard = function(id) {\n      var el = self.element.querySelector('[data-id=\"' + id + '\"]');\n      return el;\n    };\n\n    this.getParentBoardID = function(el) {\n      if (typeof el === \"string\") {\n        el = self.element.querySelector('[data-eid=\"' + el + '\"]');\n      }\n      if (el === null) {\n        return null;\n      }\n      return el.parentNode.parentNode.dataset.id;\n    };\n\n    this.moveElement = function(targetBoardID, elementID, element) {\n      if (targetBoardID === this.getParentBoardID(elementID)) {\n        return;\n      }\n\n      this.removeElement(elementID);\n      return this.addElement(targetBoardID, element);\n    };\n\n    this.replaceElement = function(el, element) {\n      var nodeItem = el;\n      if (typeof nodeItem === \"string\") {\n        nodeItem = self.element.querySelector('[data-eid=\"' + el + '\"]');\n      }\n      nodeItem.innerHTML = element.title;\n      // add function\n      nodeItem.clickfn = element.click;\n      nodeItem.dragfn = element.drag;\n      nodeItem.dragendfn = element.dragend;\n      nodeItem.dropfn = element.drop;\n      __appendCustomProperties(nodeItem, element);\n      return self;\n    };\n\n    this.findElement = function(id) {\n      var el = self.element.querySelector('[data-eid=\"' + id + '\"]');\n      return el;\n    };\n\n    this.getBoardElements = function(id) {\n      var board = self.element.querySelector(\n        '[data-id=\"' + id + '\"] .kanban-drag'\n      );\n      return board.childNodes;\n    };\n\n    this.removeElement = function(el) {\n      if (typeof el === \"string\")\n        el = self.element.querySelector('[data-eid=\"' + el + '\"]');\n      if (el !== null) {\n        el.remove();\n      }\n      return self;\n    };\n\n    this.removeBoard = function(board) {\n      var boardElement = null;\n      if (typeof board === \"string\")\n        boardElement = self.element.querySelector('[data-id=\"' + board + '\"]');\n      if (boardElement !== null) {\n        boardElement.remove();\n      }\n\n      // remove thboard in options.boards\n\t    for(var i = 0; i < self.options.boards.length; i++) {\n\t\t    if(self.options.boards[i].id === board) {\n\t\t\t    self.options.boards.splice(i, 1);\n\t\t\t    break;\n\t\t    }\n\t    }\n\n      return self;\n    };\n\n    // board button on click function\n    this.onButtonClick = function(el) {};\n    //PRIVATE FUNCTION\n    function __extendDefaults(source, properties) {\n      var property;\n      for (property in properties) {\n        if (properties.hasOwnProperty(property)) {\n          source[property] = properties[property];\n        }\n      }\n      return source;\n    }\n\n    function __setBoard() {\n      self.element = document.querySelector(self.options.element);\n      //create container\n      var boardContainer = document.createElement(\"div\");\n      boardContainer.classList.add(\"kanban-container\");\n      self.container = boardContainer;\n      //add boards\n      self.addBoards(self.options.boards, true);\n      //appends to container\n      self.element.appendChild(self.container);\n    }\n\n    function __onclickHandler(nodeItem, clickfn) {\n      nodeItem.addEventListener(\"click\", function(e) {\n        e.preventDefault();\n        self.options.click(this);\n        if (typeof this.clickfn === \"function\") this.clickfn(this);\n      });\n    }\n\n    function __onButtonClickHandler(nodeItem, boardId) {\n      nodeItem.addEventListener(\"click\", function(e) {\n        e.preventDefault();\n        self.options.buttonClick(this, boardId);\n        // if(typeof(this.clickfn) === 'function')\n        //     this.clickfn(this);\n      });\n    }\n\n    function __findBoardJSON(id) {\n      var el = [];\n      self.options.boards.map(function(board) {\n        if (board.id === id) {\n          return el.push(board);\n        }\n      });\n      return el[0];\n    }\n\n    function __appendCustomProperties(element, parentObject) {\n      for (var propertyName in parentObject) {\n        if (self._disallowedItemProperties.indexOf(propertyName) > -1) {\n          continue;\n        }\n\n        element.setAttribute(\n          \"data-\" + propertyName,\n          parentObject[propertyName]\n        );\n      }\n    }\n\n    function __updateBoardsOrder() {\n      var index = 1;\n      for (var i = 0; i < self.container.childNodes.length; i++) {\n        self.container.childNodes[i].dataset.order = index++;\n      }\n    }\n\n    function __buildItemTitle(title) {\n      var result = title;\n      if (self.options.itemHandleOptions.enabled) {\n        if ((self.options.itemHandleOptions.customHandler || undefined) === undefined) {\n          var customCssHandler = self.options.itemHandleOptions.customCssHandler;\n          var customCssIconHandler = self.options.itemHandleOptions.customCssIconHandler;\n          if ((customCssHandler || undefined) === undefined) {\n            customCssHandler = \"drag_handler\";\n          }\n          if ((customCssIconHandler || undefined) === undefined) {\n            customCssIconHandler = customCssHandler + \"_icon\";\n          }\n\n          result = \"<div class='item_handle \"+customCssHandler+\"'><i class='item_handle \"+customCssIconHandler+\"'></i></div><div>\" + result + \"</div>\";\n        } else {\n          result = self.options.itemHandleOptions.customHandler.replace(\"%s\", result);\n        }\n      }\n      return result;\n    }\n\n    //init plugin\n    this.init();\n  };\n})();\n\n},{\"dragula\":9}],2:[function(require,module,exports){\nmodule.exports = function atoa (a, n) { return Array.prototype.slice.call(a, n); }\n\n},{}],3:[function(require,module,exports){\n'use strict';\n\nvar ticky = require('ticky');\n\nmodule.exports = function debounce (fn, args, ctx) {\n  if (!fn) { return; }\n  ticky(function run () {\n    fn.apply(ctx || null, args || []);\n  });\n};\n\n},{\"ticky\":11}],4:[function(require,module,exports){\n'use strict';\n\nvar atoa = require('atoa');\nvar debounce = require('./debounce');\n\nmodule.exports = function emitter (thing, options) {\n  var opts = options || {};\n  var evt = {};\n  if (thing === undefined) { thing = {}; }\n  thing.on = function (type, fn) {\n    if (!evt[type]) {\n      evt[type] = [fn];\n    } else {\n      evt[type].push(fn);\n    }\n    return thing;\n  };\n  thing.once = function (type, fn) {\n    fn._once = true; // thing.off(fn) still works!\n    thing.on(type, fn);\n    return thing;\n  };\n  thing.off = function (type, fn) {\n    var c = arguments.length;\n    if (c === 1) {\n      delete evt[type];\n    } else if (c === 0) {\n      evt = {};\n    } else {\n      var et = evt[type];\n      if (!et) { return thing; }\n      et.splice(et.indexOf(fn), 1);\n    }\n    return thing;\n  };\n  thing.emit = function () {\n    var args = atoa(arguments);\n    return thing.emitterSnapshot(args.shift()).apply(this, args);\n  };\n  thing.emitterSnapshot = function (type) {\n    var et = (evt[type] || []).slice(0);\n    return function () {\n      var args = atoa(arguments);\n      var ctx = this || thing;\n      if (type === 'error' && opts.throws !== false && !et.length) { throw args.length === 1 ? args[0] : args; }\n      et.forEach(function emitter (listen) {\n        if (opts.async) { debounce(listen, args, ctx); } else { listen.apply(ctx, args); }\n        if (listen._once) { thing.off(type, listen); }\n      });\n      return thing;\n    };\n  };\n  return thing;\n};\n\n},{\"./debounce\":3,\"atoa\":2}],5:[function(require,module,exports){\n(function (global){\n'use strict';\n\nvar customEvent = require('custom-event');\nvar eventmap = require('./eventmap');\nvar doc = global.document;\nvar addEvent = addEventEasy;\nvar removeEvent = removeEventEasy;\nvar hardCache = [];\n\nif (!global.addEventListener) {\n  addEvent = addEventHard;\n  removeEvent = removeEventHard;\n}\n\nmodule.exports = {\n  add: addEvent,\n  remove: removeEvent,\n  fabricate: fabricateEvent\n};\n\nfunction addEventEasy (el, type, fn, capturing) {\n  return el.addEventListener(type, fn, capturing);\n}\n\nfunction addEventHard (el, type, fn) {\n  return el.attachEvent('on' + type, wrap(el, type, fn));\n}\n\nfunction removeEventEasy (el, type, fn, capturing) {\n  return el.removeEventListener(type, fn, capturing);\n}\n\nfunction removeEventHard (el, type, fn) {\n  var listener = unwrap(el, type, fn);\n  if (listener) {\n    return el.detachEvent('on' + type, listener);\n  }\n}\n\nfunction fabricateEvent (el, type, model) {\n  var e = eventmap.indexOf(type) === -1 ? makeCustomEvent() : makeClassicEvent();\n  if (el.dispatchEvent) {\n    el.dispatchEvent(e);\n  } else {\n    el.fireEvent('on' + type, e);\n  }\n  function makeClassicEvent () {\n    var e;\n    if (doc.createEvent) {\n      e = doc.createEvent('Event');\n      e.initEvent(type, true, true);\n    } else if (doc.createEventObject) {\n      e = doc.createEventObject();\n    }\n    return e;\n  }\n  function makeCustomEvent () {\n    return new customEvent(type, { detail: model });\n  }\n}\n\nfunction wrapperFactory (el, type, fn) {\n  return function wrapper (originalEvent) {\n    var e = originalEvent || global.event;\n    e.target = e.target || e.srcElement;\n    e.preventDefault = e.preventDefault || function preventDefault () { e.returnValue = false; };\n    e.stopPropagation = e.stopPropagation || function stopPropagation () { e.cancelBubble = true; };\n    e.which = e.which || e.keyCode;\n    fn.call(el, e);\n  };\n}\n\nfunction wrap (el, type, fn) {\n  var wrapper = unwrap(el, type, fn) || wrapperFactory(el, type, fn);\n  hardCache.push({\n    wrapper: wrapper,\n    element: el,\n    type: type,\n    fn: fn\n  });\n  return wrapper;\n}\n\nfunction unwrap (el, type, fn) {\n  var i = find(el, type, fn);\n  if (i) {\n    var wrapper = hardCache[i].wrapper;\n    hardCache.splice(i, 1); // free up a tad of memory\n    return wrapper;\n  }\n}\n\nfunction find (el, type, fn) {\n  var i, item;\n  for (i = 0; i < hardCache.length; i++) {\n    item = hardCache[i];\n    if (item.element === el && item.type === type && item.fn === fn) {\n      return i;\n    }\n  }\n}\n\n}).call(this,typeof global !== \"undefined\" ? global : typeof self !== \"undefined\" ? self : typeof window !== \"undefined\" ? window : {})\n},{\"./eventmap\":6,\"custom-event\":7}],6:[function(require,module,exports){\n(function (global){\n'use strict';\n\nvar eventmap = [];\nvar eventname = '';\nvar ron = /^on/;\n\nfor (eventname in global) {\n  if (ron.test(eventname)) {\n    eventmap.push(eventname.slice(2));\n  }\n}\n\nmodule.exports = eventmap;\n\n}).call(this,typeof global !== \"undefined\" ? global : typeof self !== \"undefined\" ? self : typeof window !== \"undefined\" ? window : {})\n},{}],7:[function(require,module,exports){\n(function (global){\n\nvar NativeCustomEvent = global.CustomEvent;\n\nfunction useNative () {\n  try {\n    var p = new NativeCustomEvent('cat', { detail: { foo: 'bar' } });\n    return  'cat' === p.type && 'bar' === p.detail.foo;\n  } catch (e) {\n  }\n  return false;\n}\n\n/**\n * Cross-browser `CustomEvent` constructor.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent.CustomEvent\n *\n * @public\n */\n\nmodule.exports = useNative() ? NativeCustomEvent :\n\n// IE >= 9\n'function' === typeof document.createEvent ? function CustomEvent (type, params) {\n  var e = document.createEvent('CustomEvent');\n  if (params) {\n    e.initCustomEvent(type, params.bubbles, params.cancelable, params.detail);\n  } else {\n    e.initCustomEvent(type, false, false, void 0);\n  }\n  return e;\n} :\n\n// IE <= 8\nfunction CustomEvent (type, params) {\n  var e = document.createEventObject();\n  e.type = type;\n  if (params) {\n    e.bubbles = Boolean(params.bubbles);\n    e.cancelable = Boolean(params.cancelable);\n    e.detail = params.detail;\n  } else {\n    e.bubbles = false;\n    e.cancelable = false;\n    e.detail = void 0;\n  }\n  return e;\n}\n\n}).call(this,typeof global !== \"undefined\" ? global : typeof self !== \"undefined\" ? self : typeof window !== \"undefined\" ? window : {})\n},{}],8:[function(require,module,exports){\n'use strict';\n\nvar cache = {};\nvar start = '(?:^|\\\\s)';\nvar end = '(?:\\\\s|$)';\n\nfunction lookupClass (className) {\n  var cached = cache[className];\n  if (cached) {\n    cached.lastIndex = 0;\n  } else {\n    cache[className] = cached = new RegExp(start + className + end, 'g');\n  }\n  return cached;\n}\n\nfunction addClass (el, className) {\n  var current = el.className;\n  if (!current.length) {\n    el.className = className;\n  } else if (!lookupClass(className).test(current)) {\n    el.className += ' ' + className;\n  }\n}\n\nfunction rmClass (el, className) {\n  el.className = el.className.replace(lookupClass(className), ' ').trim();\n}\n\nmodule.exports = {\n  add: addClass,\n  rm: rmClass\n};\n\n},{}],9:[function(require,module,exports){\n(function (global){\n'use strict';\n\nvar emitter = require('contra/emitter');\nvar crossvent = require('crossvent');\nvar classes = require('./classes');\nvar doc = document;\nvar documentElement = doc.documentElement;\n\nfunction dragula (initialContainers, options) {\n  var len = arguments.length;\n  if (len === 1 && Array.isArray(initialContainers) === false) {\n    options = initialContainers;\n    initialContainers = [];\n  }\n  var _mirror; // mirror image\n  var _source; // source container\n  var _item; // item being dragged\n  var _offsetX; // reference x\n  var _offsetY; // reference y\n  var _moveX; // reference move x\n  var _moveY; // reference move y\n  var _initialSibling; // reference sibling when grabbed\n  var _currentSibling; // reference sibling now\n  var _copy; // item used for copying\n  var _renderTimer; // timer for setTimeout renderMirrorImage\n  var _lastDropTarget = null; // last container item was over\n  var _grabbed; // holds mousedown context until first mousemove\n\n  var o = options || {};\n  if (o.moves === void 0) { o.moves = always; }\n  if (o.accepts === void 0) { o.accepts = always; }\n  if (o.invalid === void 0) { o.invalid = invalidTarget; }\n  if (o.containers === void 0) { o.containers = initialContainers || []; }\n  if (o.isContainer === void 0) { o.isContainer = never; }\n  if (o.copy === void 0) { o.copy = false; }\n  if (o.copySortSource === void 0) { o.copySortSource = false; }\n  if (o.revertOnSpill === void 0) { o.revertOnSpill = false; }\n  if (o.removeOnSpill === void 0) { o.removeOnSpill = false; }\n  if (o.direction === void 0) { o.direction = 'vertical'; }\n  if (o.ignoreInputTextSelection === void 0) { o.ignoreInputTextSelection = true; }\n  if (o.mirrorContainer === void 0) { o.mirrorContainer = doc.body; }\n\n  var drake = emitter({\n    containers: o.containers,\n    start: manualStart,\n    end: end,\n    cancel: cancel,\n    remove: remove,\n    destroy: destroy,\n    canMove: canMove,\n    dragging: false\n  });\n\n  if (o.removeOnSpill === true) {\n    drake.on('over', spillOver).on('out', spillOut);\n  }\n\n  events();\n\n  return drake;\n\n  function isContainer (el) {\n    return drake.containers.indexOf(el) !== -1 || o.isContainer(el);\n  }\n\n  function events (remove) {\n    var op = remove ? 'remove' : 'add';\n    touchy(documentElement, op, 'mousedown', grab);\n    touchy(documentElement, op, 'mouseup', release);\n  }\n\n  function eventualMovements (remove) {\n    var op = remove ? 'remove' : 'add';\n    touchy(documentElement, op, 'mousemove', startBecauseMouseMoved);\n  }\n\n  function movements (remove) {\n    var op = remove ? 'remove' : 'add';\n    crossvent[op](documentElement, 'selectstart', preventGrabbed); // IE8\n    crossvent[op](documentElement, 'click', preventGrabbed);\n  }\n\n  function destroy () {\n    events(true);\n    release({});\n  }\n\n  function preventGrabbed (e) {\n    if (_grabbed) {\n      e.preventDefault();\n    }\n  }\n\n  function grab (e) {\n    _moveX = e.clientX;\n    _moveY = e.clientY;\n\n    var ignore = whichMouseButton(e) !== 1 || e.metaKey || e.ctrlKey;\n    if (ignore) {\n      return; // we only care about honest-to-god left clicks and touch events\n    }\n    var item = e.target;\n    var context = canStart(item);\n    if (!context) {\n      return;\n    }\n    _grabbed = context;\n    eventualMovements();\n    if (e.type === 'mousedown') {\n      if (isInput(item)) { // see also: https://github.com/bevacqua/dragula/issues/208\n        item.focus(); // fixes https://github.com/bevacqua/dragula/issues/176\n      } else {\n        e.preventDefault(); // fixes https://github.com/bevacqua/dragula/issues/155\n      }\n    }\n  }\n\n  function startBecauseMouseMoved (e) {\n    if (!_grabbed) {\n      return;\n    }\n    if (whichMouseButton(e) === 0) {\n      release({});\n      return; // when text is selected on an input and then dragged, mouseup doesn't fire. this is our only hope\n    }\n    // truthy check fixes #239, equality fixes #207\n    if (e.clientX !== void 0 && e.clientX === _moveX && e.clientY !== void 0 && e.clientY === _moveY) {\n      return;\n    }\n    if (o.ignoreInputTextSelection) {\n      var clientX = getCoord('clientX', e);\n      var clientY = getCoord('clientY', e);\n      var elementBehindCursor = doc.elementFromPoint(clientX, clientY);\n      if (isInput(elementBehindCursor)) {\n        return;\n      }\n    }\n\n    var grabbed = _grabbed; // call to end() unsets _grabbed\n    eventualMovements(true);\n    movements();\n    end();\n    start(grabbed);\n\n    var offset = getOffset(_item);\n    _offsetX = getCoord('pageX', e) - offset.left;\n    _offsetY = getCoord('pageY', e) - offset.top;\n\n    classes.add(_copy || _item, 'gu-transit');\n    renderMirrorImage();\n    drag(e);\n  }\n\n  function canStart (item) {\n    if (drake.dragging && _mirror) {\n      return;\n    }\n    if (isContainer(item)) {\n      return; // don't drag container itself\n    }\n    var handle = item;\n    while (getParent(item) && isContainer(getParent(item)) === false) {\n      if (o.invalid(item, handle)) {\n        return;\n      }\n      item = getParent(item); // drag target should be a top element\n      if (!item) {\n        return;\n      }\n    }\n    var source = getParent(item);\n    if (!source) {\n      return;\n    }\n    if (o.invalid(item, handle)) {\n      return;\n    }\n\n    var movable = o.moves(item, source, handle, nextEl(item));\n    if (!movable) {\n      return;\n    }\n\n    return {\n      item: item,\n      source: source\n    };\n  }\n\n  function canMove (item) {\n    return !!canStart(item);\n  }\n\n  function manualStart (item) {\n    var context = canStart(item);\n    if (context) {\n      start(context);\n    }\n  }\n\n  function start (context) {\n    if (isCopy(context.item, context.source)) {\n      _copy = context.item.cloneNode(true);\n      drake.emit('cloned', _copy, context.item, 'copy');\n    }\n\n    _source = context.source;\n    _item = context.item;\n    _initialSibling = _currentSibling = nextEl(context.item);\n\n    drake.dragging = true;\n    drake.emit('drag', _item, _source);\n  }\n\n  function invalidTarget () {\n    return false;\n  }\n\n  function end () {\n    if (!drake.dragging) {\n      return;\n    }\n    var item = _copy || _item;\n    drop(item, getParent(item));\n  }\n\n  function ungrab () {\n    _grabbed = false;\n    eventualMovements(true);\n    movements(true);\n  }\n\n  function release (e) {\n    ungrab();\n\n    if (!drake.dragging) {\n      return;\n    }\n    var item = _copy || _item;\n    var clientX = getCoord('clientX', e);\n    var clientY = getCoord('clientY', e);\n    var elementBehindCursor = getElementBehindPoint(_mirror, clientX, clientY);\n    var dropTarget = findDropTarget(elementBehindCursor, clientX, clientY);\n    if (dropTarget && ((_copy && o.copySortSource) || (!_copy || dropTarget !== _source))) {\n      drop(item, dropTarget);\n    } else if (o.removeOnSpill) {\n      remove();\n    } else {\n      cancel();\n    }\n  }\n\n  function drop (item, target) {\n    var parent = getParent(item);\n    if (_copy && o.copySortSource && target === _source) {\n      parent.removeChild(_item);\n    }\n    if (isInitialPlacement(target)) {\n      drake.emit('cancel', item, _source, _source);\n    } else {\n      drake.emit('drop', item, target, _source, _currentSibling);\n    }\n    cleanup();\n  }\n\n  function remove () {\n    if (!drake.dragging) {\n      return;\n    }\n    var item = _copy || _item;\n    var parent = getParent(item);\n    if (parent) {\n      parent.removeChild(item);\n    }\n    drake.emit(_copy ? 'cancel' : 'remove', item, parent, _source);\n    cleanup();\n  }\n\n  function cancel (revert) {\n    if (!drake.dragging) {\n      return;\n    }\n    var reverts = arguments.length > 0 ? revert : o.revertOnSpill;\n    var item = _copy || _item;\n    var parent = getParent(item);\n    var initial = isInitialPlacement(parent);\n    if (initial === false && reverts) {\n      if (_copy) {\n        if (parent) {\n          parent.removeChild(_copy);\n        }\n      } else {\n        _source.insertBefore(item, _initialSibling);\n      }\n    }\n    if (initial || reverts) {\n      drake.emit('cancel', item, _source, _source);\n    } else {\n      drake.emit('drop', item, parent, _source, _currentSibling);\n    }\n    cleanup();\n  }\n\n  function cleanup () {\n    var item = _copy || _item;\n    ungrab();\n    removeMirrorImage();\n    if (item) {\n      classes.rm(item, 'gu-transit');\n    }\n    if (_renderTimer) {\n      clearTimeout(_renderTimer);\n    }\n    drake.dragging = false;\n    if (_lastDropTarget) {\n      drake.emit('out', item, _lastDropTarget, _source);\n    }\n    drake.emit('dragend', item);\n    _source = _item = _copy = _initialSibling = _currentSibling = _renderTimer = _lastDropTarget = null;\n  }\n\n  function isInitialPlacement (target, s) {\n    var sibling;\n    if (s !== void 0) {\n      sibling = s;\n    } else if (_mirror) {\n      sibling = _currentSibling;\n    } else {\n      sibling = nextEl(_copy || _item);\n    }\n    return target === _source && sibling === _initialSibling;\n  }\n\n  function findDropTarget (elementBehindCursor, clientX, clientY) {\n    var target = elementBehindCursor;\n    while (target && !accepted()) {\n      target = getParent(target);\n    }\n    return target;\n\n    function accepted () {\n      var droppable = isContainer(target);\n      if (droppable === false) {\n        return false;\n      }\n\n      var immediate = getImmediateChild(target, elementBehindCursor);\n      var reference = getReference(target, immediate, clientX, clientY);\n      var initial = isInitialPlacement(target, reference);\n      if (initial) {\n        return true; // should always be able to drop it right back where it was\n      }\n      return o.accepts(_item, target, _source, reference);\n    }\n  }\n\n  function drag (e) {\n    if (!_mirror) {\n      return;\n    }\n    e.preventDefault();\n\n    var clientX = getCoord('clientX', e);\n    var clientY = getCoord('clientY', e);\n    var x = clientX - _offsetX;\n    var y = clientY - _offsetY;\n\n    _mirror.style.left = x + 'px';\n    _mirror.style.top = y + 'px';\n\n    var item = _copy || _item;\n    var elementBehindCursor = getElementBehindPoint(_mirror, clientX, clientY);\n    var dropTarget = findDropTarget(elementBehindCursor, clientX, clientY);\n    var changed = dropTarget !== null && dropTarget !== _lastDropTarget;\n    if (changed || dropTarget === null) {\n      out();\n      _lastDropTarget = dropTarget;\n      over();\n    }\n    var parent = getParent(item);\n    if (dropTarget === _source && _copy && !o.copySortSource) {\n      if (parent) {\n        parent.removeChild(item);\n      }\n      return;\n    }\n    var reference;\n    var immediate = getImmediateChild(dropTarget, elementBehindCursor);\n    if (immediate !== null) {\n      reference = getReference(dropTarget, immediate, clientX, clientY);\n    } else if (o.revertOnSpill === true && !_copy) {\n      reference = _initialSibling;\n      dropTarget = _source;\n    } else {\n      if (_copy && parent) {\n        parent.removeChild(item);\n      }\n      return;\n    }\n    if (\n      (reference === null && changed) ||\n      reference !== item &&\n      reference !== nextEl(item)\n    ) {\n      _currentSibling = reference;\n      dropTarget.insertBefore(item, reference);\n      drake.emit('shadow', item, dropTarget, _source);\n    }\n    function moved (type) { drake.emit(type, item, _lastDropTarget, _source); }\n    function over () { if (changed) { moved('over'); } }\n    function out () { if (_lastDropTarget) { moved('out'); } }\n  }\n\n  function spillOver (el) {\n    classes.rm(el, 'gu-hide');\n  }\n\n  function spillOut (el) {\n    if (drake.dragging) { classes.add(el, 'gu-hide'); }\n  }\n\n  function renderMirrorImage () {\n    if (_mirror) {\n      return;\n    }\n    var rect = _item.getBoundingClientRect();\n    _mirror = _item.cloneNode(true);\n    _mirror.style.width = getRectWidth(rect) + 'px';\n    _mirror.style.height = getRectHeight(rect) + 'px';\n    classes.rm(_mirror, 'gu-transit');\n    classes.add(_mirror, 'gu-mirror');\n    o.mirrorContainer.appendChild(_mirror);\n    touchy(documentElement, 'add', 'mousemove', drag);\n    classes.add(o.mirrorContainer, 'gu-unselectable');\n    drake.emit('cloned', _mirror, _item, 'mirror');\n  }\n\n  function removeMirrorImage () {\n    if (_mirror) {\n      classes.rm(o.mirrorContainer, 'gu-unselectable');\n      touchy(documentElement, 'remove', 'mousemove', drag);\n      getParent(_mirror).removeChild(_mirror);\n      _mirror = null;\n    }\n  }\n\n  function getImmediateChild (dropTarget, target) {\n    var immediate = target;\n    while (immediate !== dropTarget && getParent(immediate) !== dropTarget) {\n      immediate = getParent(immediate);\n    }\n    if (immediate === documentElement) {\n      return null;\n    }\n    return immediate;\n  }\n\n  function getReference (dropTarget, target, x, y) {\n    var horizontal = o.direction === 'horizontal';\n    var reference = target !== dropTarget ? inside() : outside();\n    return reference;\n\n    function outside () { // slower, but able to figure out any position\n      var len = dropTarget.children.length;\n      var i;\n      var el;\n      var rect;\n      for (i = 0; i < len; i++) {\n        el = dropTarget.children[i];\n        rect = el.getBoundingClientRect();\n        if (horizontal && (rect.left + rect.width / 2) > x) { return el; }\n        if (!horizontal && (rect.top + rect.height / 2) > y) { return el; }\n      }\n      return null;\n    }\n\n    function inside () { // faster, but only available if dropped inside a child element\n      var rect = target.getBoundingClientRect();\n      if (horizontal) {\n        return resolve(x > rect.left + getRectWidth(rect) / 2);\n      }\n      return resolve(y > rect.top + getRectHeight(rect) / 2);\n    }\n\n    function resolve (after) {\n      return after ? nextEl(target) : target;\n    }\n  }\n\n  function isCopy (item, container) {\n    return typeof o.copy === 'boolean' ? o.copy : o.copy(item, container);\n  }\n}\n\nfunction touchy (el, op, type, fn) {\n  var touch = {\n    mouseup: 'touchend',\n    mousedown: 'touchstart',\n    mousemove: 'touchmove'\n  };\n  var pointers = {\n    mouseup: 'pointerup',\n    mousedown: 'pointerdown',\n    mousemove: 'pointermove'\n  };\n  var microsoft = {\n    mouseup: 'MSPointerUp',\n    mousedown: 'MSPointerDown',\n    mousemove: 'MSPointerMove'\n  };\n  if (global.navigator.pointerEnabled) {\n    crossvent[op](el, pointers[type], fn);\n  } else if (global.navigator.msPointerEnabled) {\n    crossvent[op](el, microsoft[type], fn);\n  } else {\n    crossvent[op](el, touch[type], fn);\n    crossvent[op](el, type, fn);\n  }\n}\n\nfunction whichMouseButton (e) {\n  if (e.touches !== void 0) { return e.touches.length; }\n  if (e.which !== void 0 && e.which !== 0) { return e.which; } // see https://github.com/bevacqua/dragula/issues/261\n  if (e.buttons !== void 0) { return e.buttons; }\n  var button = e.button;\n  if (button !== void 0) { // see https://github.com/jquery/jquery/blob/99e8ff1baa7ae341e94bb89c3e84570c7c3ad9ea/src/event.js#L573-L575\n    return button & 1 ? 1 : button & 2 ? 3 : (button & 4 ? 2 : 0);\n  }\n}\n\nfunction getOffset (el) {\n  var rect = el.getBoundingClientRect();\n  return {\n    left: rect.left + getScroll('scrollLeft', 'pageXOffset'),\n    top: rect.top + getScroll('scrollTop', 'pageYOffset')\n  };\n}\n\nfunction getScroll (scrollProp, offsetProp) {\n  if (typeof global[offsetProp] !== 'undefined') {\n    return global[offsetProp];\n  }\n  if (documentElement.clientHeight) {\n    return documentElement[scrollProp];\n  }\n  return doc.body[scrollProp];\n}\n\nfunction getElementBehindPoint (point, x, y) {\n  var p = point || {};\n  var state = p.className;\n  var el;\n  p.className += ' gu-hide';\n  el = doc.elementFromPoint(x, y);\n  p.className = state;\n  return el;\n}\n\nfunction never () { return false; }\nfunction always () { return true; }\nfunction getRectWidth (rect) { return rect.width || (rect.right - rect.left); }\nfunction getRectHeight (rect) { return rect.height || (rect.bottom - rect.top); }\nfunction getParent (el) { return el.parentNode === doc ? null : el.parentNode; }\nfunction isInput (el) { return el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT' || isEditable(el); }\nfunction isEditable (el) {\n  if (!el) { return false; } // no parents were editable\n  if (el.contentEditable === 'false') { return false; } // stop the lookup\n  if (el.contentEditable === 'true') { return true; } // found a contentEditable element in the chain\n  return isEditable(getParent(el)); // contentEditable is set to 'inherit'\n}\n\nfunction nextEl (el) {\n  return el.nextElementSibling || manually();\n  function manually () {\n    var sibling = el;\n    do {\n      sibling = sibling.nextSibling;\n    } while (sibling && sibling.nodeType !== 1);\n    return sibling;\n  }\n}\n\nfunction getEventHost (e) {\n  // on touchend event, we have to use `e.changedTouches`\n  // see http://stackoverflow.com/questions/7192563/touchend-event-properties\n  // see https://github.com/bevacqua/dragula/issues/34\n  if (e.targetTouches && e.targetTouches.length) {\n    return e.targetTouches[0];\n  }\n  if (e.changedTouches && e.changedTouches.length) {\n    return e.changedTouches[0];\n  }\n  return e;\n}\n\nfunction getCoord (coord, e) {\n  var host = getEventHost(e);\n  var missMap = {\n    pageX: 'clientX', // IE8\n    pageY: 'clientY' // IE8\n  };\n  if (coord in missMap && !(coord in host) && missMap[coord] in host) {\n    coord = missMap[coord];\n  }\n  return host[coord];\n}\n\nmodule.exports = dragula;\n\n}).call(this,typeof global !== \"undefined\" ? global : typeof self !== \"undefined\" ? self : typeof window !== \"undefined\" ? window : {})\n},{\"./classes\":8,\"contra/emitter\":4,\"crossvent\":5}],10:[function(require,module,exports){\n// shim for using process in browser\nvar process = module.exports = {};\n\n// cached from whatever global is present so that test runners that stub it\n// don't break things.  But we need to wrap it in a try catch in case it is\n// wrapped in strict mode code which doesn't define any globals.  It's inside a\n// function because try/catches deoptimize in certain engines.\n\nvar cachedSetTimeout;\nvar cachedClearTimeout;\n\nfunction defaultSetTimout() {\n    throw new Error('setTimeout has not been defined');\n}\nfunction defaultClearTimeout () {\n    throw new Error('clearTimeout has not been defined');\n}\n(function () {\n    try {\n        if (typeof setTimeout === 'function') {\n            cachedSetTimeout = setTimeout;\n        } else {\n            cachedSetTimeout = defaultSetTimout;\n        }\n    } catch (e) {\n        cachedSetTimeout = defaultSetTimout;\n    }\n    try {\n        if (typeof clearTimeout === 'function') {\n            cachedClearTimeout = clearTimeout;\n        } else {\n            cachedClearTimeout = defaultClearTimeout;\n        }\n    } catch (e) {\n        cachedClearTimeout = defaultClearTimeout;\n    }\n} ())\nfunction runTimeout(fun) {\n    if (cachedSetTimeout === setTimeout) {\n        //normal enviroments in sane situations\n        return setTimeout(fun, 0);\n    }\n    // if setTimeout wasn't available but was latter defined\n    if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) {\n        cachedSetTimeout = setTimeout;\n        return setTimeout(fun, 0);\n    }\n    try {\n        // when when somebody has screwed with setTimeout but no I.E. maddness\n        return cachedSetTimeout(fun, 0);\n    } catch(e){\n        try {\n            // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally\n            return cachedSetTimeout.call(null, fun, 0);\n        } catch(e){\n            // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error\n            return cachedSetTimeout.call(this, fun, 0);\n        }\n    }\n\n\n}\nfunction runClearTimeout(marker) {\n    if (cachedClearTimeout === clearTimeout) {\n        //normal enviroments in sane situations\n        return clearTimeout(marker);\n    }\n    // if clearTimeout wasn't available but was latter defined\n    if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) {\n        cachedClearTimeout = clearTimeout;\n        return clearTimeout(marker);\n    }\n    try {\n        // when when somebody has screwed with setTimeout but no I.E. maddness\n        return cachedClearTimeout(marker);\n    } catch (e){\n        try {\n            // When we are in I.E. but the script has been evaled so I.E. doesn't  trust the global object when called normally\n            return cachedClearTimeout.call(null, marker);\n        } catch (e){\n            // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error.\n            // Some versions of I.E. have different rules for clearTimeout vs setTimeout\n            return cachedClearTimeout.call(this, marker);\n        }\n    }\n\n\n\n}\nvar queue = [];\nvar draining = false;\nvar currentQueue;\nvar queueIndex = -1;\n\nfunction cleanUpNextTick() {\n    if (!draining || !currentQueue) {\n        return;\n    }\n    draining = false;\n    if (currentQueue.length) {\n        queue = currentQueue.concat(queue);\n    } else {\n        queueIndex = -1;\n    }\n    if (queue.length) {\n        drainQueue();\n    }\n}\n\nfunction drainQueue() {\n    if (draining) {\n        return;\n    }\n    var timeout = runTimeout(cleanUpNextTick);\n    draining = true;\n\n    var len = queue.length;\n    while(len) {\n        currentQueue = queue;\n        queue = [];\n        while (++queueIndex < len) {\n            if (currentQueue) {\n                currentQueue[queueIndex].run();\n            }\n        }\n        queueIndex = -1;\n        len = queue.length;\n    }\n    currentQueue = null;\n    draining = false;\n    runClearTimeout(timeout);\n}\n\nprocess.nextTick = function (fun) {\n    var args = new Array(arguments.length - 1);\n    if (arguments.length > 1) {\n        for (var i = 1; i < arguments.length; i++) {\n            args[i - 1] = arguments[i];\n        }\n    }\n    queue.push(new Item(fun, args));\n    if (queue.length === 1 && !draining) {\n        runTimeout(drainQueue);\n    }\n};\n\n// v8 likes predictible objects\nfunction Item(fun, array) {\n    this.fun = fun;\n    this.array = array;\n}\nItem.prototype.run = function () {\n    this.fun.apply(null, this.array);\n};\nprocess.title = 'browser';\nprocess.browser = true;\nprocess.env = {};\nprocess.argv = [];\nprocess.version = ''; // empty string to avoid regexp issues\nprocess.versions = {};\n\nfunction noop() {}\n\nprocess.on = noop;\nprocess.addListener = noop;\nprocess.once = noop;\nprocess.off = noop;\nprocess.removeListener = noop;\nprocess.removeAllListeners = noop;\nprocess.emit = noop;\nprocess.prependListener = noop;\nprocess.prependOnceListener = noop;\n\nprocess.listeners = function (name) { return [] }\n\nprocess.binding = function (name) {\n    throw new Error('process.binding is not supported');\n};\n\nprocess.cwd = function () { return '/' };\nprocess.chdir = function (dir) {\n    throw new Error('process.chdir is not supported');\n};\nprocess.umask = function() { return 0; };\n\n},{}],11:[function(require,module,exports){\n(function (setImmediate){\nvar si = typeof setImmediate === 'function', tick;\nif (si) {\n  tick = function (fn) { setImmediate(fn); };\n} else {\n  tick = function (fn) { setTimeout(fn, 0); };\n}\n\nmodule.exports = tick;\n}).call(this,require(\"timers\").setImmediate)\n},{\"timers\":12}],12:[function(require,module,exports){\n(function (setImmediate,clearImmediate){\nvar nextTick = require('process/browser.js').nextTick;\nvar apply = Function.prototype.apply;\nvar slice = Array.prototype.slice;\nvar immediateIds = {};\nvar nextImmediateId = 0;\n\n// DOM APIs, for completeness\n\nexports.setTimeout = function() {\n  return new Timeout(apply.call(setTimeout, window, arguments), clearTimeout);\n};\nexports.setInterval = function() {\n  return new Timeout(apply.call(setInterval, window, arguments), clearInterval);\n};\nexports.clearTimeout =\nexports.clearInterval = function(timeout) { timeout.close(); };\n\nfunction Timeout(id, clearFn) {\n  this._id = id;\n  this._clearFn = clearFn;\n}\nTimeout.prototype.unref = Timeout.prototype.ref = function() {};\nTimeout.prototype.close = function() {\n  this._clearFn.call(window, this._id);\n};\n\n// Does not start the time, just sets up the members needed.\nexports.enroll = function(item, msecs) {\n  clearTimeout(item._idleTimeoutId);\n  item._idleTimeout = msecs;\n};\n\nexports.unenroll = function(item) {\n  clearTimeout(item._idleTimeoutId);\n  item._idleTimeout = -1;\n};\n\nexports._unrefActive = exports.active = function(item) {\n  clearTimeout(item._idleTimeoutId);\n\n  var msecs = item._idleTimeout;\n  if (msecs >= 0) {\n    item._idleTimeoutId = setTimeout(function onTimeout() {\n      if (item._onTimeout)\n        item._onTimeout();\n    }, msecs);\n  }\n};\n\n// That's not how node.js implements it but the exposed api is the same.\nexports.setImmediate = typeof setImmediate === \"function\" ? setImmediate : function(fn) {\n  var id = nextImmediateId++;\n  var args = arguments.length < 2 ? false : slice.call(arguments, 1);\n\n  immediateIds[id] = true;\n\n  nextTick(function onNextTick() {\n    if (immediateIds[id]) {\n      // fn.call() is faster so we optimize for the common use-case\n      // @see http://jsperf.com/call-apply-segu\n      if (args) {\n        fn.apply(null, args);\n      } else {\n        fn.call(null);\n      }\n      // Prevent ids from leaking\n      exports.clearImmediate(id);\n    }\n  });\n\n  return id;\n};\n\nexports.clearImmediate = typeof clearImmediate === \"function\" ? clearImmediate : function(id) {\n  delete immediateIds[id];\n};\n}).call(this,require(\"timers\").setImmediate,require(\"timers\").clearImmediate)\n},{\"process/browser.js\":10,\"timers\":12}]},{},[1]);\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/material-dashboard.js",
    "content": "\"use strict\";\n(function() {\n  var isWindows = navigator.platform.indexOf('Win') > -1 ? true : false;\n\n  if (isWindows) {\n    // if we are on windows OS we activate the perfectScrollbar function\n    if (document.getElementsByClassName('main-content')[0]) {\n      var mainpanel = document.querySelector('.main-content');\n      var ps = new PerfectScrollbar(mainpanel);\n    };\n\n    if (document.getElementsByClassName('sidenav')[0]) {\n      var sidebar = document.querySelector('.sidenav');\n      var ps1 = new PerfectScrollbar(sidebar);\n    };\n\n    if (document.getElementsByClassName('navbar-collapse')[0]) {\n      var fixedplugin = document.querySelector('.navbar-collapse');\n      var ps2 = new PerfectScrollbar(fixedplugin);\n    };\n\n    if (document.getElementsByClassName('fixed-plugin')[0]) {\n      var fixedplugin = document.querySelector('.fixed-plugin');\n      var ps3 = new PerfectScrollbar(fixedplugin);\n    };\n  };\n})();\n\n// Verify navbar blur on scroll\nif (document.getElementById('navbarBlur')) {\n  navbarBlurOnScroll('navbarBlur');\n}\n\n// initialization of Tooltips\nvar tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle=\"tooltip\"]'))\nvar tooltipList = tooltipTriggerList.map(function(tooltipTriggerEl) {\n  return new bootstrap.Tooltip(tooltipTriggerEl)\n})\n\n// when input is focused add focused class for style\nfunction focused(el) {\n  if (el.parentElement.classList.contains('input-group')) {\n    el.parentElement.classList.add('focused');\n  }\n}\n\n// when input is focused remove focused class for style\nfunction defocused(el) {\n  if (el.parentElement.classList.contains('input-group')) {\n    el.parentElement.classList.remove('focused');\n  }\n}\n\n// helper for adding on all elements multiple attributes\nfunction setAttributes(el, options) {\n  Object.keys(options).forEach(function(attr) {\n    el.setAttribute(attr, options[attr]);\n  })\n}\n\n// adding on inputs attributes for calling the focused and defocused functions\nif (document.querySelectorAll('.input-group').length != 0) {\n  var allInputs = document.querySelectorAll('input.form-control');\n  allInputs.forEach(el => setAttributes(el, {\n    \"onfocus\": \"focused(this)\",\n    \"onfocusout\": \"defocused(this)\"\n  }));\n}\n\n\n// Fixed Plugin\n\nif (document.querySelector('.fixed-plugin')) {\n  var fixedPlugin = document.querySelector('.fixed-plugin');\n  var fixedPlugin = document.querySelector('.fixed-plugin');\n  var fixedPluginButton = document.querySelector('.fixed-plugin-button');\n  var fixedPluginButtonNav = document.querySelector('.fixed-plugin-button-nav');\n  var fixedPluginCard = document.querySelector('.fixed-plugin .card');\n  var fixedPluginCloseButton = document.querySelectorAll('.fixed-plugin-close-button');\n  var navbar = document.getElementById('navbarBlur');\n  var buttonNavbarFixed = document.getElementById('navbarFixed');\n\n  if (fixedPluginButton) {\n    fixedPluginButton.onclick = function() {\n      if (!fixedPlugin.classList.contains('show')) {\n        fixedPlugin.classList.add('show');\n      } else {\n        fixedPlugin.classList.remove('show');\n      }\n    }\n  }\n\n  if (fixedPluginButtonNav) {\n    fixedPluginButtonNav.onclick = function() {\n      if (!fixedPlugin.classList.contains('show')) {\n        fixedPlugin.classList.add('show');\n      } else {\n        fixedPlugin.classList.remove('show');\n      }\n    }\n  }\n\n  fixedPluginCloseButton.forEach(function(el) {\n    el.onclick = function() {\n      fixedPlugin.classList.remove('show');\n    }\n  })\n\n  document.querySelector('body').onclick = function(e) {\n    if (e.target != fixedPluginButton && e.target != fixedPluginButtonNav && e.target.closest('.fixed-plugin .card') != fixedPluginCard) {\n      fixedPlugin.classList.remove('show');\n    }\n  }\n\n  if (navbar) {\n    if (navbar.getAttribute('data-scroll') == 'true' && buttonNavbarFixed) {\n      buttonNavbarFixed.setAttribute(\"checked\", \"true\");\n    }\n  }\n\n}\n\n//Set Sidebar Color\nfunction sidebarColor(a) {\n  var parent = document.querySelector(\".nav-link.active\");\n  var color = a.getAttribute(\"data-color\");\n\n  if (parent.classList.contains('bg-gradient-primary')) {\n    parent.classList.remove('bg-gradient-primary');\n  }\n  if (parent.classList.contains('bg-gradient-dark')) {\n    parent.classList.remove('bg-gradient-dark');\n  }\n  if (parent.classList.contains('bg-gradient-info')) {\n    parent.classList.remove('bg-gradient-info');\n  }\n  if (parent.classList.contains('bg-gradient-success')) {\n    parent.classList.remove('bg-gradient-success');\n  }\n  if (parent.classList.contains('bg-gradient-warning')) {\n    parent.classList.remove('bg-gradient-warning');\n  }\n  if (parent.classList.contains('bg-gradient-danger')) {\n    parent.classList.remove('bg-gradient-danger');\n  }\n  parent.classList.add('bg-gradient-' + color);\n}\n\n// Set Sidebar Type\nfunction sidebarType(a) {\n  var parent = a.parentElement.children;\n  var color = a.getAttribute(\"data-class\");\n  var body = document.querySelector(\"body\");\n  var bodyWhite = document.querySelector(\"body:not(.dark-version)\");\n  var bodyDark = body.classList.contains('dark-version');\n\n  var colors = [];\n\n  for (var i = 0; i < parent.length; i++) {\n    parent[i].classList.remove('active');\n    colors.push(parent[i].getAttribute('data-class'));\n  }\n\n  if (!a.classList.contains('active')) {\n    a.classList.add('active');\n  } else {\n    a.classList.remove('active');\n  }\n\n  var sidebar = document.querySelector('.sidenav');\n\n  for (var i = 0; i < colors.length; i++) {\n    sidebar.classList.remove(colors[i]);\n  }\n\n  sidebar.classList.add(color);\n\n\n  // Remove text-white/text-dark classes\n  if (color == 'bg-transparent' || color == 'bg-white') {\n    var textWhites = document.querySelectorAll('.sidenav .text-white');\n    for (let i = 0; i < textWhites.length; i++) {\n      textWhites[i].classList.remove('text-white');\n      textWhites[i].classList.add('text-dark');\n    }\n  } else {\n    var textDarks = document.querySelectorAll('.sidenav .text-dark');\n    for (let i = 0; i < textDarks.length; i++) {\n      textDarks[i].classList.add('text-white');\n      textDarks[i].classList.remove('text-dark');\n    }\n  }\n\n  if (color == 'bg-transparent' && bodyDark) {\n    var textDarks = document.querySelectorAll('.navbar-brand .text-dark');\n    for (let i = 0; i < textDarks.length; i++) {\n      textDarks[i].classList.add('text-white');\n      textDarks[i].classList.remove('text-dark');\n    }\n  }\n\n  // Remove logo-white/logo-dark\n\n  if ((color == 'bg-transparent' || color == 'bg-white') && bodyWhite) {\n    var navbarBrand = document.querySelector('.navbar-brand-img');\n    var navbarBrandImg = navbarBrand.src;\n\n    if (navbarBrandImg.includes('logo-ct.png')) {\n      var navbarBrandImgNew = navbarBrandImg.replace(\"logo-ct\", \"logo-ct-dark\");\n      navbarBrand.src = navbarBrandImgNew;\n    }\n  } else {\n    var navbarBrand = document.querySelector('.navbar-brand-img');\n    var navbarBrandImg = navbarBrand.src;\n    if (navbarBrandImg.includes('logo-ct-dark.png')) {\n      var navbarBrandImgNew = navbarBrandImg.replace(\"logo-ct-dark\", \"logo-ct\");\n      navbarBrand.src = navbarBrandImgNew;\n    }\n  }\n\n  if (color == 'bg-white' && bodyDark) {\n    var navbarBrand = document.querySelector('.navbar-brand-img');\n    var navbarBrandImg = navbarBrand.src;\n\n    if (navbarBrandImg.includes('logo-ct.png')) {\n      var navbarBrandImgNew = navbarBrandImg.replace(\"logo-ct\", \"logo-ct-dark\");\n      navbarBrand.src = navbarBrandImgNew;\n    }\n  }\n}\n\n// Set Navbar Fixed\nfunction navbarFixed(el) {\n  let classes = ['position-sticky', 'blur', 'shadow-blur', 'mt-4', 'left-auto', 'top-1', 'z-index-sticky'];\n  const navbar = document.getElementById('navbarBlur');\n\n  if (!el.getAttribute(\"checked\")) {\n    navbar.classList.add(...classes);\n    navbar.setAttribute('navbar-scroll', 'true');\n    navbarBlurOnScroll('navbarBlur');\n    el.setAttribute(\"checked\", \"true\");\n  } else {\n    navbar.classList.remove(...classes);\n    navbar.setAttribute('navbar-scroll', 'false');\n    navbarBlurOnScroll('navbarBlur');\n    el.removeAttribute(\"checked\");\n  }\n};\n\n\n// Set Navbar Minimized\nfunction navbarMinimize(el) {\n  var sidenavShow = document.getElementsByClassName('g-sidenav-show')[0];\n\n  if (!el.getAttribute(\"checked\")) {\n    sidenavShow.classList.remove('g-sidenav-pinned');\n    sidenavShow.classList.add('g-sidenav-hidden');\n    el.setAttribute(\"checked\", \"true\");\n  } else {\n    sidenavShow.classList.remove('g-sidenav-hidden');\n    sidenavShow.classList.add('g-sidenav-pinned');\n    el.removeAttribute(\"checked\");\n  }\n}\n\n// Navbar blur on scroll\nfunction navbarBlurOnScroll(id) {\n  const navbar = document.getElementById(id);\n  let navbarScrollActive = navbar ? navbar.getAttribute(\"data-scroll\") : false;\n  let scrollDistance = 5;\n  let classes = ['blur', 'shadow-blur', 'left-auto'];\n  let toggleClasses = ['shadow-none'];\n\n  if (navbarScrollActive == 'true') {\n    window.onscroll = debounce(function() {\n      if (window.scrollY > scrollDistance) {\n        blurNavbar();\n      } else {\n        transparentNavbar();\n      }\n    }, 10);\n  } else {\n    window.onscroll = debounce(function() {\n      transparentNavbar();\n    }, 10);\n  }\n\n  var isWindows = navigator.platform.indexOf('Win') > -1 ? true : false;\n\n  if (isWindows) {\n    var content = document.querySelector('.main-content');\n    if (navbarScrollActive == 'true') {\n      content.addEventListener('ps-scroll-y', debounce(function() {\n        if (content.scrollTop > scrollDistance) {\n          blurNavbar();\n        } else {\n          transparentNavbar();\n        }\n      }, 10));\n    } else {\n      content.addEventListener('ps-scroll-y', debounce(function() {\n        transparentNavbar();\n      }, 10));\n    }\n  }\n\n  function blurNavbar() {\n    navbar.classList.add(...classes)\n    navbar.classList.remove(...toggleClasses)\n\n    toggleNavLinksColor('blur');\n  }\n\n  function transparentNavbar() {\n    navbar.classList.remove(...classes)\n    navbar.classList.add(...toggleClasses)\n\n    toggleNavLinksColor('transparent');\n  }\n\n  function toggleNavLinksColor(type) {\n    let navLinks = document.querySelectorAll('.navbar-main .nav-link')\n    let navLinksToggler = document.querySelectorAll('.navbar-main .sidenav-toggler-line')\n\n    if (type === \"blur\") {\n      navLinks.forEach(element => {\n        element.classList.remove('text-body')\n      });\n\n      navLinksToggler.forEach(element => {\n        element.classList.add('bg-dark')\n      });\n    } else if (type === \"transparent\") {\n      navLinks.forEach(element => {\n        element.classList.add('text-body')\n      });\n\n      navLinksToggler.forEach(element => {\n        element.classList.remove('bg-dark')\n      });\n    }\n  }\n}\n\n// Debounce Function\n// Returns a function, that, as long as it continues to be invoked, will not\n// be triggered. The function will be called after it stops being called for\n// N milliseconds. If `immediate` is passed, trigger the function on the\n// leading edge, instead of the trailing.\nfunction debounce(func, wait, immediate) {\n  var timeout;\n  return function() {\n    var context = this,\n      args = arguments;\n    var later = function() {\n      timeout = null;\n      if (!immediate) func.apply(context, args);\n    };\n    var callNow = immediate && !timeout;\n    clearTimeout(timeout);\n    timeout = setTimeout(later, wait);\n    if (callNow) func.apply(context, args);\n  };\n};\n\n// initialization of Toasts\ndocument.addEventListener(\"DOMContentLoaded\", function() {\n  var toastElList = [].slice.call(document.querySelectorAll(\".toast\"));\n\n  var toastList = toastElList.map(function(toastEl) {\n    return new bootstrap.Toast(toastEl);\n  });\n\n  var toastButtonList = [].slice.call(document.querySelectorAll(\".toast-btn\"));\n\n  toastButtonList.map(function(toastButtonEl) {\n    toastButtonEl.addEventListener(\"click\", function() {\n      var toastToTrigger = document.getElementById(toastButtonEl.dataset.target);\n\n      if (toastToTrigger) {\n        var toast = bootstrap.Toast.getInstance(toastToTrigger);\n        toast.show();\n      }\n    });\n  });\n});\n\n// Tabs navigation\n\nvar total = document.querySelectorAll('.nav-pills');\n\nfunction initNavs() {\n  total.forEach(function(item, i) {\n    var moving_div = document.createElement('div');\n    var first_li = item.querySelector('li:first-child .nav-link');\n    var tab = first_li.cloneNode();\n    tab.innerHTML = \"-\";\n\n    moving_div.classList.add('moving-tab', 'position-absolute', 'nav-link');\n    moving_div.appendChild(tab);\n    item.appendChild(moving_div);\n\n    var list_length = item.getElementsByTagName(\"li\").length;\n\n    moving_div.style.padding = '0px';\n    moving_div.style.width = item.querySelector('li:nth-child(1)').offsetWidth + 'px';\n    moving_div.style.transform = 'translate3d(0px, 0px, 0px)';\n    moving_div.style.transition = '.5s ease';\n\n    item.onmouseover = function(event) {\n      let target = getEventTarget(event);\n      let li = target.closest('li'); // get reference\n      if (li) {\n        let nodes = Array.from(li.closest('ul').children); // get array\n        let index = nodes.indexOf(li) + 1;\n        item.querySelector('li:nth-child(' + index + ') .nav-link').onclick = function() {\n          moving_div = item.querySelector('.moving-tab');\n          let sum = 0;\n          if (item.classList.contains('flex-column')) {\n            for (var j = 1; j <= nodes.indexOf(li); j++) {\n              sum += item.querySelector('li:nth-child(' + j + ')').offsetHeight;\n            }\n            moving_div.style.transform = 'translate3d(0px,' + sum + 'px, 0px)';\n            moving_div.style.height = item.querySelector('li:nth-child(' + j + ')').offsetHeight;\n          } else {\n            for (var j = 1; j <= nodes.indexOf(li); j++) {\n              sum += item.querySelector('li:nth-child(' + j + ')').offsetWidth;\n            }\n            moving_div.style.transform = 'translate3d(' + sum + 'px, 0px, 0px)';\n            moving_div.style.width = item.querySelector('li:nth-child(' + index + ')').offsetWidth + 'px';\n          }\n        }\n      }\n    }\n  });\n}\n\nsetTimeout(function() {\n  initNavs();\n}, 100);\n\n// Tabs navigation resize\n\nwindow.addEventListener('resize', function(event) {\n  total.forEach(function(item, i) {\n    item.querySelector('.moving-tab').remove();\n    var moving_div = document.createElement('div');\n    var tab = item.querySelector(\".nav-link.active\").cloneNode();\n    tab.innerHTML = \"-\";\n\n    moving_div.classList.add('moving-tab', 'position-absolute', 'nav-link');\n    moving_div.appendChild(tab);\n\n    item.appendChild(moving_div);\n\n    moving_div.style.padding = '0px';\n    moving_div.style.transition = '.5s ease';\n\n    let li = item.querySelector(\".nav-link.active\").parentElement;\n\n    if (li) {\n      let nodes = Array.from(li.closest('ul').children); // get array\n      let index = nodes.indexOf(li) + 1;\n\n      let sum = 0;\n      if (item.classList.contains('flex-column')) {\n        for (var j = 1; j <= nodes.indexOf(li); j++) {\n          sum += item.querySelector('li:nth-child(' + j + ')').offsetHeight;\n        }\n        moving_div.style.transform = 'translate3d(0px,' + sum + 'px, 0px)';\n        moving_div.style.width = item.querySelector('li:nth-child(' + index + ')').offsetWidth + 'px';\n        moving_div.style.height = item.querySelector('li:nth-child(' + j + ')').offsetHeight;\n      } else {\n        for (var j = 1; j <= nodes.indexOf(li); j++) {\n          sum += item.querySelector('li:nth-child(' + j + ')').offsetWidth;\n        }\n        moving_div.style.transform = 'translate3d(' + sum + 'px, 0px, 0px)';\n        moving_div.style.width = item.querySelector('li:nth-child(' + index + ')').offsetWidth + 'px';\n\n      }\n    }\n  });\n\n  if (window.innerWidth < 991) {\n    total.forEach(function(item, i) {\n      if (!item.classList.contains('flex-column')) {\n        item.classList.remove('flex-row');\n        item.classList.add('flex-column', 'on-resize');\n        let li = item.querySelector(\".nav-link.active\").parentElement;\n        let nodes = Array.from(li.closest('ul').children); // get array\n        let index = nodes.indexOf(li) + 1;\n        let sum = 0;\n        for (var j = 1; j <= nodes.indexOf(li); j++) {\n          sum += item.querySelector('li:nth-child(' + j + ')').offsetHeight;\n        }\n        var moving_div = document.querySelector('.moving-tab');\n        moving_div.style.width = item.querySelector('li:nth-child(1)').offsetWidth + 'px';\n        moving_div.style.transform = 'translate3d(0px,' + sum + 'px, 0px)';\n\n      }\n    });\n  } else {\n    total.forEach(function(item, i) {\n      if (item.classList.contains('on-resize')) {\n        item.classList.remove('flex-column', 'on-resize');\n        item.classList.add('flex-row');\n        let li = item.querySelector(\".nav-link.active\").parentElement;\n        let nodes = Array.from(li.closest('ul').children); // get array\n        let index = nodes.indexOf(li) + 1;\n        let sum = 0;\n        for (var j = 1; j <= nodes.indexOf(li); j++) {\n          sum += item.querySelector('li:nth-child(' + j + ')').offsetWidth;\n        }\n        var moving_div = document.querySelector('.moving-tab');\n        moving_div.style.transform = 'translate3d(' + sum + 'px, 0px, 0px)';\n        moving_div.style.width = item.querySelector('li:nth-child(' + index + ')').offsetWidth + 'px';\n      }\n    })\n  }\n});\n\n// Function to remove flex row on mobile devices\nif (window.innerWidth < 991) {\n  total.forEach(function(item, i) {\n    if (item.classList.contains('flex-row')) {\n      item.classList.remove('flex-row');\n      item.classList.add('flex-column', 'on-resize');\n    }\n  });\n}\n\nfunction getEventTarget(e) {\n  e = e || window.event;\n  return e.target || e.srcElement;\n}\n\n// End tabs navigation\n\nwindow.onload = function() {\n  // Material Design Input function\n  var inputs = document.querySelectorAll('input');\n\n  for (var i = 0; i < inputs.length; i++) {\n    inputs[i].addEventListener('focus', function(e) {\n      this.parentElement.classList.add('is-focused');\n    }, false);\n\n    inputs[i].onkeyup = function(e) {\n      if (this.value != \"\") {\n        this.parentElement.classList.add('is-filled');\n      } else {\n        this.parentElement.classList.remove('is-filled');\n      }\n    };\n\n    inputs[i].addEventListener('focusout', function(e) {\n      if (this.value != \"\") {\n        this.parentElement.classList.add('is-filled');\n      }\n      this.parentElement.classList.remove('is-focused');\n    }, false);\n  }\n\n  // Ripple Effect\n  var ripples = document.querySelectorAll('.btn');\n\n  for (var i = 0; i < ripples.length; i++) {\n    ripples[i].addEventListener('click', function(e) {\n      var targetEl = e.target;\n      var rippleDiv = targetEl.querySelector('.ripple');\n\n      rippleDiv = document.createElement('span');\n      rippleDiv.classList.add('ripple');\n      rippleDiv.style.width = rippleDiv.style.height = Math.max(targetEl.offsetWidth, targetEl.offsetHeight) + 'px';\n      targetEl.appendChild(rippleDiv);\n\n      rippleDiv.style.left = (e.offsetX - rippleDiv.offsetWidth / 2) + 'px';\n      rippleDiv.style.top = (e.offsetY - rippleDiv.offsetHeight / 2) + 'px';\n      rippleDiv.classList.add('ripple');\n      setTimeout(function() {\n        rippleDiv.parentElement.removeChild(rippleDiv);\n      }, 600);\n    }, false);\n  }\n};\n\n// Toggle Sidenav\nconst iconNavbarSidenav = document.getElementById('iconNavbarSidenav');\nconst iconSidenav = document.getElementById('iconSidenav');\nconst sidenav = document.getElementById('sidenav-main');\nlet body = document.getElementsByTagName('body')[0];\nlet className = 'g-sidenav-pinned';\n\nif (iconNavbarSidenav) {\n  iconNavbarSidenav.addEventListener(\"click\", toggleSidenav);\n}\n\nif (iconSidenav) {\n  iconSidenav.addEventListener(\"click\", toggleSidenav);\n}\n\nfunction toggleSidenav() {\n  if (body.classList.contains(className)) {\n    body.classList.remove(className);\n    setTimeout(function() {\n      sidenav.classList.remove('bg-white');\n    }, 100);\n    sidenav.classList.remove('bg-transparent');\n\n  } else {\n    body.classList.add(className);\n    sidenav.classList.add('bg-white');\n    sidenav.classList.remove('bg-transparent');\n    iconSidenav.classList.remove('d-none');\n  }\n}\n\n// Resize navbar color depends on configurator active type of sidenav\n\nlet referenceButtons = document.querySelector('[data-class]');\n\nwindow.addEventListener(\"resize\", navbarColorOnResize);\n\nfunction navbarColorOnResize() {\n  if (window.innerWidth > 1200) {\n    if (referenceButtons.classList.contains('active') && referenceButtons.getAttribute('data-class') === 'bg-transparent') {\n      sidenav.classList.remove('bg-white');\n    } else {\n      sidenav.classList.add('bg-white');\n    }\n  } else {\n    sidenav.classList.add('bg-white');\n    sidenav.classList.remove('bg-transparent');\n  }\n}\n\n// Deactivate sidenav type buttons on resize and small screens\nwindow.addEventListener(\"resize\", sidenavTypeOnResize);\nwindow.addEventListener(\"load\", sidenavTypeOnResize);\n\nfunction sidenavTypeOnResize() {\n  let elements = document.querySelectorAll('[onclick=\"sidebarType(this)\"]');\n  if (window.innerWidth < 1200) {\n    elements.forEach(function(el) {\n      el.classList.add('disabled');\n    });\n  } else {\n    elements.forEach(function(el) {\n      el.classList.remove('disabled');\n    });\n  }\n}\n\n\n// Light Mode / Dark Mode\nfunction darkMode(el) {\n  const body = document.getElementsByTagName('body')[0];\n  const hr = document.querySelectorAll('div:not(.sidenav) > hr');\n  const hr_card = document.querySelectorAll('div:not(.bg-gradient-dark) hr');\n  const text_btn = document.querySelectorAll('button:not(.btn) > .text-dark');\n  const text_span = document.querySelectorAll('span.text-dark, .breadcrumb .text-dark');\n  const text_span_white = document.querySelectorAll('span.text-white, .breadcrumb .text-white');\n  const text_strong = document.querySelectorAll('strong.text-dark');\n  const text_strong_white = document.querySelectorAll('strong.text-white');\n  const text_nav_link = document.querySelectorAll('a.nav-link.text-dark');\n  const text_nav_link_white = document.querySelectorAll('a.nav-link.text-white');\n  const secondary = document.querySelectorAll('.text-secondary');\n  const bg_gray_100 = document.querySelectorAll('.bg-gray-100');\n  const bg_gray_600 = document.querySelectorAll('.bg-gray-600');\n  const btn_text_dark = document.querySelectorAll('.btn.btn-link.text-dark, .material-icons.text-dark');\n  const btn_text_white = document.querySelectorAll('.btn.btn-link.text-white, .material-icons.text-white');\n  const card_border = document.querySelectorAll('.card.border');\n  const card_border_dark = document.querySelectorAll('.card.border.border-dark');\n\n  const svg = document.querySelectorAll('g');\n\n  if (!el.getAttribute(\"checked\")) {\n    body.classList.add('dark-version');\n    for (var i = 0; i < hr.length; i++) {\n      if (hr[i].classList.contains('dark')) {\n        hr[i].classList.remove('dark');\n        hr[i].classList.add('light');\n      }\n    }\n\n    for (var i = 0; i < hr_card.length; i++) {\n      if (hr_card[i].classList.contains('dark')) {\n        hr_card[i].classList.remove('dark');\n        hr_card[i].classList.add('light');\n      }\n    }\n    for (var i = 0; i < text_btn.length; i++) {\n      if (text_btn[i].classList.contains('text-dark')) {\n        text_btn[i].classList.remove('text-dark');\n        text_btn[i].classList.add('text-white');\n      }\n    }\n    for (var i = 0; i < text_span.length; i++) {\n      if (text_span[i].classList.contains('text-dark')) {\n        text_span[i].classList.remove('text-dark');\n        text_span[i].classList.add('text-white');\n      }\n    }\n    for (var i = 0; i < text_strong.length; i++) {\n      if (text_strong[i].classList.contains('text-dark')) {\n        text_strong[i].classList.remove('text-dark');\n        text_strong[i].classList.add('text-white');\n      }\n    }\n    for (var i = 0; i < text_nav_link.length; i++) {\n      if (text_nav_link[i].classList.contains('text-dark')) {\n        text_nav_link[i].classList.remove('text-dark');\n        text_nav_link[i].classList.add('text-white');\n      }\n    }\n    for (var i = 0; i < secondary.length; i++) {\n      if (secondary[i].classList.contains('text-secondary')) {\n        secondary[i].classList.remove('text-secondary');\n        secondary[i].classList.add('text-white');\n        secondary[i].classList.add('opacity-8');\n      }\n    }\n    for (var i = 0; i < bg_gray_100.length; i++) {\n      if (bg_gray_100[i].classList.contains('bg-gray-100')) {\n        bg_gray_100[i].classList.remove('bg-gray-100');\n        bg_gray_100[i].classList.add('bg-gray-600');\n      }\n    }\n    for (var i = 0; i < btn_text_dark.length; i++) {\n      btn_text_dark[i].classList.remove('text-dark');\n      btn_text_dark[i].classList.add('text-white');\n    }\n    for (var i = 0; i < svg.length; i++) {\n      if (svg[i].hasAttribute('fill')) {\n        svg[i].setAttribute('fill', '#fff');\n      }\n    }\n    for (var i = 0; i < card_border.length; i++) {\n      card_border[i].classList.add('border-dark');\n    }\n    el.setAttribute(\"checked\", \"true\");\n  } else {\n    body.classList.remove('dark-version');\n    for (var i = 0; i < hr.length; i++) {\n      if (hr[i].classList.contains('light')) {\n        hr[i].classList.add('dark');\n        hr[i].classList.remove('light');\n      }\n    }\n    for (var i = 0; i < hr_card.length; i++) {\n      if (hr_card[i].classList.contains('light')) {\n        hr_card[i].classList.add('dark');\n        hr_card[i].classList.remove('light');\n      }\n    }\n    for (var i = 0; i < text_btn.length; i++) {\n      if (text_btn[i].classList.contains('text-white')) {\n        text_btn[i].classList.remove('text-white');\n        text_btn[i].classList.add('text-dark');\n      }\n    }\n    for (var i = 0; i < text_span_white.length; i++) {\n      if (text_span_white[i].classList.contains('text-white') && !text_span_white[i].closest('.sidenav') && !text_span_white[i].closest('.card.bg-gradient-dark')) {\n        text_span_white[i].classList.remove('text-white');\n        text_span_white[i].classList.add('text-dark');\n      }\n    }\n    for (var i = 0; i < text_strong_white.length; i++) {\n      if (text_strong_white[i].classList.contains('text-white')) {\n        text_strong_white[i].classList.remove('text-white');\n        text_strong_white[i].classList.add('text-dark');\n      }\n    }\n    for (var i = 0; i < text_nav_link_white.length; i++) {\n      if (text_nav_link_white[i].classList.contains('text-white') && !text_nav_link_white[i].closest('.sidenav')) {\n        text_nav_link_white[i].classList.remove('text-white');\n        text_nav_link_white[i].classList.add('text-dark');\n      }\n    }\n    for (var i = 0; i < secondary.length; i++) {\n      if (secondary[i].classList.contains('text-white')) {\n        secondary[i].classList.remove('text-white');\n        secondary[i].classList.remove('opacity-8');\n        secondary[i].classList.add('text-dark');\n      }\n    }\n    for (var i = 0; i < bg_gray_600.length; i++) {\n      if (bg_gray_600[i].classList.contains('bg-gray-600')) {\n        bg_gray_600[i].classList.remove('bg-gray-600');\n        bg_gray_600[i].classList.add('bg-gray-100');\n      }\n    }\n    for (var i = 0; i < svg.length; i++) {\n      if (svg[i].hasAttribute('fill')) {\n        svg[i].setAttribute('fill', '#252f40');\n      }\n    }\n    for (var i = 0; i < btn_text_white.length; i++) {\n      if (!btn_text_white[i].closest('.card.bg-gradient-dark')) {\n        btn_text_white[i].classList.remove('text-white');\n        btn_text_white[i].classList.add('text-dark');\n      }\n    }\n    for (var i = 0; i < card_border_dark.length; i++) {\n      card_border_dark[i].classList.remove('border-dark');\n    }\n    el.removeAttribute(\"checked\");\n  }\n};"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/multistep-form.js",
    "content": "//DOM elements\nconst DOMstrings = {\n  stepsBtnClass: 'multisteps-form__progress-btn',\n  stepsBtns: document.querySelectorAll(`.multisteps-form__progress-btn`),\n  stepsBar: document.querySelector('.multisteps-form__progress'),\n  stepsForm: document.querySelector('.multisteps-form__form'),\n  stepsFormTextareas: document.querySelectorAll('.multisteps-form__textarea'),\n  stepFormPanelClass: 'multisteps-form__panel',\n  stepFormPanels: document.querySelectorAll('.multisteps-form__panel'),\n  stepPrevBtnClass: 'js-btn-prev',\n  stepNextBtnClass: 'js-btn-next' };\n\n\n//remove class from a set of items\nconst removeClasses = (elemSet, className) => {\n\n  elemSet.forEach(elem => {\n\n    elem.classList.remove(className);\n\n  });\n\n};\n\n//return exect parent node of the element\nconst findParent = (elem, parentClass) => {\n\n  let currentNode = elem;\n\n  while (!currentNode.classList.contains(parentClass)) {\n    currentNode = currentNode.parentNode;\n  }\n\n  return currentNode;\n\n};\n\n//get active button step number\nconst getActiveStep = elem => {\n  return Array.from(DOMstrings.stepsBtns).indexOf(elem);\n};\n\n//set all steps before clicked (and clicked too) to active\nconst setActiveStep = activeStepNum => {\n\n  //remove active state from all the state\n  removeClasses(DOMstrings.stepsBtns, 'js-active');\n\n  //set picked items to active\n  DOMstrings.stepsBtns.forEach((elem, index) => {\n\n    if (index <= activeStepNum) {\n      elem.classList.add('js-active');\n    }\n\n  });\n};\n\n//get active panel\nconst getActivePanel = () => {\n\n  let activePanel;\n\n  DOMstrings.stepFormPanels.forEach(elem => {\n\n    if (elem.classList.contains('js-active')) {\n\n      activePanel = elem;\n\n    }\n\n  });\n\n  return activePanel;\n\n};\n\n//open active panel (and close unactive panels)\nconst setActivePanel = activePanelNum => {\n\n  //remove active class from all the panels\n  removeClasses(DOMstrings.stepFormPanels, 'js-active');\n\n  //show active panel\n  DOMstrings.stepFormPanels.forEach((elem, index) => {\n    if (index === activePanelNum) {\n\n      elem.classList.add('js-active');\n\n      setFormHeight(elem);\n\n    }\n  });\n\n};\n\n//set form height equal to current panel height\nconst formHeight = activePanel => {\n\n  const activePanelHeight = activePanel.offsetHeight;\n\n  DOMstrings.stepsForm.style.height = `${activePanelHeight}px`;\n\n};\n\nconst setFormHeight = () => {\n  const activePanel = getActivePanel();\n\n  formHeight(activePanel);\n};\n\n//STEPS BAR CLICK FUNCTION\nDOMstrings.stepsBar.addEventListener('click', e => {\n\n  //check if click target is a step button\n  const eventTarget = e.target;\n\n  if (!eventTarget.classList.contains(`${DOMstrings.stepsBtnClass}`)) {\n    return;\n  }\n\n  //get active button step number\n  const activeStep = getActiveStep(eventTarget);\n\n  //set all steps before clicked (and clicked too) to active\n  setActiveStep(activeStep);\n\n  //open active panel\n  setActivePanel(activeStep);\n});\n\n//PREV/NEXT BTNS CLICK\nDOMstrings.stepsForm.addEventListener('click', e => {\n\n  const eventTarget = e.target;\n\n  //check if we clicked on `PREV` or NEXT` buttons\n  if (!(eventTarget.classList.contains(`${DOMstrings.stepPrevBtnClass}`) || eventTarget.classList.contains(`${DOMstrings.stepNextBtnClass}`)))\n  {\n    return;\n  }\n\n  //find active panel\n  const activePanel = findParent(eventTarget, `${DOMstrings.stepFormPanelClass}`);\n\n  let activePanelNum = Array.from(DOMstrings.stepFormPanels).indexOf(activePanel);\n\n  //set active step and active panel onclick\n  if (eventTarget.classList.contains(`${DOMstrings.stepPrevBtnClass}`)) {\n    activePanelNum--;\n\n  } else {\n\n    activePanelNum++;\n\n  }\n\n  setActiveStep(activePanelNum);\n  setActivePanel(activePanelNum);\n\n});\n\n//SETTING PROPER FORM HEIGHT ONLOAD\nwindow.addEventListener('load', setFormHeight, false);\n\n//SETTING PROPER FORM HEIGHT ONRESIZE\nwindow.addEventListener('resize', setFormHeight, false);\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/plugins/Chart.extension.js",
    "content": "//\n// Chart extension for making the bars rounded\n// Code from: https://codepen.io/jedtrow/full/ygRYgo\n//\n\nChart.elements.Rectangle.prototype.draw = function() {\n\n  var ctx = this._chart.ctx;\n  var vm = this._view;\n  var left, right, top, bottom, signX, signY, borderSkipped, radius;\n  var borderWidth = vm.borderWidth;\n  // Set Radius Here\n  // If radius is large enough to cause drawing errors a max radius is imposed\n  var cornerRadius = 6;\n\n  if (!vm.horizontal) {\n    // bar\n    left = vm.x - vm.width / 2;\n    right = vm.x + vm.width / 2;\n    top = vm.y;\n    bottom = vm.base;\n    signX = 1;\n    signY = bottom > top ? 1 : -1;\n    borderSkipped = vm.borderSkipped || 'bottom';\n  } else {\n    // horizontal bar\n    left = vm.base;\n    right = vm.x;\n    top = vm.y - vm.height / 2;\n    bottom = vm.y + vm.height / 2;\n    signX = right > left ? 1 : -1;\n    signY = 1;\n    borderSkipped = vm.borderSkipped || 'left';\n  }\n\n  // Canvas doesn't allow us to stroke inside the width so we can\n  // adjust the sizes to fit if we're setting a stroke on the line\n  if (borderWidth) {\n    // borderWidth shold be less than bar width and bar height.\n    var barSize = Math.min(Math.abs(left - right), Math.abs(top - bottom));\n    borderWidth = borderWidth > barSize ? barSize : borderWidth;\n    var halfStroke = borderWidth / 2;\n    // Adjust borderWidth when bar top position is near vm.base(zero).\n    var borderLeft = left + (borderSkipped !== 'left' ? halfStroke * signX : 0);\n    var borderRight = right + (borderSkipped !== 'right' ? -halfStroke * signX : 0);\n    var borderTop = top + (borderSkipped !== 'top' ? halfStroke * signY : 0);\n    var borderBottom = bottom + (borderSkipped !== 'bottom' ? -halfStroke * signY : 0);\n    // not become a vertical line?\n    if (borderLeft !== borderRight) {\n      top = borderTop;\n      bottom = borderBottom;\n    }\n    // not become a horizontal line?\n    if (borderTop !== borderBottom) {\n      left = borderLeft;\n      right = borderRight;\n    }\n  }\n\n  ctx.beginPath();\n  ctx.fillStyle = vm.backgroundColor;\n  ctx.strokeStyle = vm.borderColor;\n  ctx.lineWidth = borderWidth;\n\n  // Corner points, from bottom-left to bottom-right clockwise\n  // | 1 2 |\n  // | 0 3 |\n  var corners = [\n    [left, bottom],\n    [left, top],\n    [right, top],\n    [right, bottom]\n  ];\n\n  // Find first (starting) corner with fallback to 'bottom'\n  var borders = ['bottom', 'left', 'top', 'right'];\n  var startCorner = borders.indexOf(borderSkipped, 0);\n  if (startCorner === -1) {\n    startCorner = 0;\n  }\n\n  function cornerAt(index) {\n    return corners[(startCorner + index) % 4];\n  }\n\n  // Draw rectangle from 'startCorner'\n  var corner = cornerAt(0);\n  ctx.moveTo(corner[0], corner[1]);\n\n  for (var i = 1; i < 4; i++) {\n    corner = cornerAt(i);\n    nextCornerId = i + 1;\n    if (nextCornerId == 4) {\n      nextCornerId = 0\n    }\n\n    nextCorner = cornerAt(nextCornerId);\n\n    width = corners[2][0] - corners[1][0];\n    height = corners[0][1] - corners[1][1];\n    x = corners[1][0];\n    y = corners[1][1];\n\n    var radius = cornerRadius;\n\n    // Fix radius being too large\n    if (radius > height / 2) {\n      radius = height / 2;\n    }\n    if (radius > width / 2) {\n      radius = width / 2;\n    }\n\n    ctx.moveTo(x + radius, y);\n    ctx.lineTo(x + width - radius, y);\n    ctx.quadraticCurveTo(x + width, y, x + width, y + radius);\n    ctx.lineTo(x + width, y + height - radius);\n    ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);\n    ctx.lineTo(x + radius, y + height);\n    ctx.quadraticCurveTo(x, y + height, x, y + height - radius);\n    ctx.lineTo(x, y + radius);\n    ctx.quadraticCurveTo(x, y, x + radius, y);\n\n  }\n\n  ctx.fill();\n  if (borderWidth) {\n    ctx.stroke();\n  }\n};"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/plugins/bootstrap-notify.js",
    "content": "/*\n\n\n\n     Creative Tim Modifications\n\n     Lines: 238, 239 was changed from top: 5px to top: 50% and we added margin-top: -13px. In this way the close button will be aligned vertically\n     Line:222 - modified when the icon is set, we add the class \"alert-with-icon\", so there will be enough space for the icon.\n\n\n\n\n*/\n\n\n/*\n * Project: Bootstrap Notify = v3.1.5\n * Description: Turns standard Bootstrap alerts into \"Growl-like\" notifications.\n * Author: Mouse0270 aka Robert McIntosh\n * License: MIT License\n * Website: https://github.com/mouse0270/bootstrap-growl\n */\n\n/* global define:false, require: false, jQuery:false */\n\n(function(factory) {\n  if (typeof define === 'function' && define.amd) {\n    // AMD. Register as an anonymous module.\n    define(['jquery'], factory);\n  } else if (typeof exports === 'object') {\n    // Node/CommonJS\n    factory(require('jquery'));\n  } else {\n    // Browser globals\n    factory(jQuery);\n  }\n}(function($) {\n  // Create the defaults once\n  var defaults = {\n    element: 'body',\n    position: null,\n    type: \"info\",\n    allow_dismiss: true,\n    allow_duplicates: true,\n    newest_on_top: false,\n    showProgressbar: false,\n    placement: {\n      from: \"top\",\n      align: \"right\"\n    },\n    offset: 20,\n    spacing: 10,\n    z_index: 1060,\n    delay: 5000,\n    timer: 1000,\n    url_target: '_blank',\n    mouse_over: null,\n    animate: {\n      enter: 'animated fadeInDown',\n      exit: 'animated fadeOutUp'\n    },\n    onShow: null,\n    onShown: null,\n    onClose: null,\n    onClosed: null,\n    onClick: null,\n    icon_type: 'class',\n    template: '<div data-notify=\"container\" class=\"col-xs-11 col-sm-4 alert alert-{0}\" role=\"alert\"><button type=\"button\" aria-hidden=\"true\" class=\"close\" data-notify=\"dismiss\"><i class=\"tim-icons icon-simple-remove\"></i></button><span data-notify=\"icon\"></span> <span data-notify=\"title\">{1}</span> <span data-notify=\"message\">{2}</span><div class=\"progress\" data-notify=\"progressbar\"><div class=\"progress-bar progress-bar-{0}\" role=\"progressbar\" aria-valuenow=\"0\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 0%;\"></div></div><a href=\"{3}\" target=\"{4}\" data-notify=\"url\"></a></div>'\n  };\n\n  String.format = function() {\n    var args = arguments;\n    var str = arguments[0];\n    return str.replace(/(\\{\\{\\d\\}\\}|\\{\\d\\})/g, function(str) {\n      if (str.substring(0, 2) === \"{{\") return str;\n      var num = parseInt(str.match(/\\d/)[0]);\n      return args[num + 1];\n    });\n  };\n\n  function isDuplicateNotification(notification) {\n    var isDupe = false;\n\n    $('[data-notify=\"container\"]').each(function(i, el) {\n      var $el = $(el);\n      var title = $el.find('[data-notify=\"title\"]').html().trim();\n      var message = $el.find('[data-notify=\"message\"]').html().trim();\n\n      // The input string might be different than the actual parsed HTML string!\n      // (<br> vs <br /> for example)\n      // So we have to force-parse this as HTML here!\n      var isSameTitle = title === $(\"<div>\" + notification.settings.content.title + \"</div>\").html().trim();\n      var isSameMsg = message === $(\"<div>\" + notification.settings.content.message + \"</div>\").html().trim();\n      var isSameType = $el.hasClass('alert-' + notification.settings.type);\n\n      if (isSameTitle && isSameMsg && isSameType) {\n        //we found the dupe. Set the var and stop checking.\n        isDupe = true;\n      }\n      return !isDupe;\n    });\n\n    return isDupe;\n  }\n\n  function Notify(element, content, options) {\n    // Setup Content of Notify\n    var contentObj = {\n      content: {\n        message: typeof content === 'object' ? content.message : content,\n        title: content.title ? content.title : '',\n        icon: content.icon ? content.icon : '',\n        url: content.url ? content.url : '#',\n        target: content.target ? content.target : '-'\n      }\n    };\n\n    options = $.extend(true, {}, contentObj, options);\n    this.settings = $.extend(true, {}, defaults, options);\n    this._defaults = defaults;\n    if (this.settings.content.target === \"-\") {\n      this.settings.content.target = this.settings.url_target;\n    }\n    this.animations = {\n      start: 'webkitAnimationStart oanimationstart MSAnimationStart animationstart',\n      end: 'webkitAnimationEnd oanimationend MSAnimationEnd animationend'\n    };\n\n    if (typeof this.settings.offset === 'number') {\n      this.settings.offset = {\n        x: this.settings.offset,\n        y: this.settings.offset\n      };\n    }\n\n    //if duplicate messages are not allowed, then only continue if this new message is not a duplicate of one that it already showing\n    if (this.settings.allow_duplicates || (!this.settings.allow_duplicates && !isDuplicateNotification(this))) {\n      this.init();\n    }\n  }\n\n  $.extend(Notify.prototype, {\n    init: function() {\n      var self = this;\n\n      this.buildNotify();\n      if (this.settings.content.icon) {\n        this.setIcon();\n      }\n      if (this.settings.content.url != \"#\") {\n        this.styleURL();\n      }\n      this.styleDismiss();\n      this.placement();\n      this.bind();\n\n      this.notify = {\n        $ele: this.$ele,\n        update: function(command, update) {\n          var commands = {};\n          if (typeof command === \"string\") {\n            commands[command] = update;\n          } else {\n            commands = command;\n          }\n          for (var cmd in commands) {\n            switch (cmd) {\n              case \"type\":\n                this.$ele.removeClass('alert-' + self.settings.type);\n                this.$ele.find('[data-notify=\"progressbar\"] > .progress-bar').removeClass('progress-bar-' + self.settings.type);\n                self.settings.type = commands[cmd];\n                this.$ele.addClass('alert-' + commands[cmd]).find('[data-notify=\"progressbar\"] > .progress-bar').addClass('progress-bar-' + commands[cmd]);\n                break;\n              case \"icon\":\n                var $icon = this.$ele.find('[data-notify=\"icon\"]');\n                if (self.settings.icon_type.toLowerCase() === 'class') {\n                  $icon.removeClass(self.settings.content.icon).addClass(commands[cmd]);\n                } else {\n                  if (!$icon.is('img')) {\n                    $icon.find('img');\n                  }\n                  $icon.attr('src', commands[cmd]);\n                }\n                self.settings.content.icon = commands[command];\n                break;\n              case \"progress\":\n                var newDelay = self.settings.delay - (self.settings.delay * (commands[cmd] / 100));\n                this.$ele.data('notify-delay', newDelay);\n                this.$ele.find('[data-notify=\"progressbar\"] > div').attr('aria-valuenow', commands[cmd]).css('width', commands[cmd] + '%');\n                break;\n              case \"url\":\n                this.$ele.find('[data-notify=\"url\"]').attr('href', commands[cmd]);\n                break;\n              case \"target\":\n                this.$ele.find('[data-notify=\"url\"]').attr('target', commands[cmd]);\n                break;\n              default:\n                this.$ele.find('[data-notify=\"' + cmd + '\"]').html(commands[cmd]);\n            }\n          }\n          var posX = this.$ele.outerHeight() + parseInt(self.settings.spacing) + parseInt(self.settings.offset.y);\n          self.reposition(posX);\n        },\n        close: function() {\n          self.close();\n        }\n      };\n\n    },\n    buildNotify: function() {\n      var content = this.settings.content;\n      this.$ele = $(String.format(this.settings.template, this.settings.type, content.title, content.message, content.url, content.target));\n      this.$ele.attr('data-notify-position', this.settings.placement.from + '-' + this.settings.placement.align);\n      if (!this.settings.allow_dismiss) {\n        this.$ele.find('[data-notify=\"dismiss\"]').css('display', 'none');\n      }\n      if ((this.settings.delay <= 0 && !this.settings.showProgressbar) || !this.settings.showProgressbar) {\n        this.$ele.find('[data-notify=\"progressbar\"]').remove();\n      }\n    },\n    setIcon: function() {\n      this.$ele.addClass('alert-with-icon');\n\n      if (this.settings.icon_type.toLowerCase() === 'class') {\n        this.$ele.find('[data-notify=\"icon\"]').addClass(this.settings.content.icon);\n      } else {\n        if (this.$ele.find('[data-notify=\"icon\"]').is('img')) {\n          this.$ele.find('[data-notify=\"icon\"]').attr('src', this.settings.content.icon);\n        } else {\n          this.$ele.find('[data-notify=\"icon\"]').append('<img src=\"' + this.settings.content.icon + '\" alt=\"Notify Icon\" />');\n        }\n      }\n    },\n    styleDismiss: function() {\n      this.$ele.find('[data-notify=\"dismiss\"]').css({\n        position: 'absolute',\n        right: '10px',\n        top: '50%',\n        marginTop: '-13px',\n        zIndex: this.settings.z_index + 2\n      });\n    },\n    styleURL: function() {\n      this.$ele.find('[data-notify=\"url\"]').css({\n        backgroundImage: 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)',\n        height: '100%',\n        left: 0,\n        position: 'absolute',\n        top: 0,\n        width: '100%',\n        zIndex: this.settings.z_index + 1\n      });\n    },\n    placement: function() {\n      var self = this,\n        offsetAmt = this.settings.offset.y,\n        css = {\n          display: 'inline-block',\n          margin: '0px auto',\n          position: this.settings.position ? this.settings.position : (this.settings.element === 'body' ? 'fixed' : 'absolute'),\n          transition: 'all .5s ease-in-out',\n          zIndex: this.settings.z_index\n        },\n        hasAnimation = false,\n        settings = this.settings;\n\n      $('[data-notify-position=\"' + this.settings.placement.from + '-' + this.settings.placement.align + '\"]:not([data-closing=\"true\"])').each(function() {\n        offsetAmt = Math.max(offsetAmt, parseInt($(this).css(settings.placement.from)) + parseInt($(this).outerHeight()) + parseInt(settings.spacing));\n      });\n      if (this.settings.newest_on_top === true) {\n        offsetAmt = this.settings.offset.y;\n      }\n      css[this.settings.placement.from] = offsetAmt + 'px';\n\n      switch (this.settings.placement.align) {\n        case \"left\":\n        case \"right\":\n          css[this.settings.placement.align] = this.settings.offset.x + 'px';\n          break;\n        case \"center\":\n          css.left = 0;\n          css.right = 0;\n          break;\n      }\n      this.$ele.css(css).addClass(this.settings.animate.enter);\n      $.each(Array('webkit-', 'moz-', 'o-', 'ms-', ''), function(index, prefix) {\n        self.$ele[0].style[prefix + 'AnimationIterationCount'] = 1;\n      });\n\n      $(this.settings.element).append(this.$ele);\n\n      if (this.settings.newest_on_top === true) {\n        offsetAmt = (parseInt(offsetAmt) + parseInt(this.settings.spacing)) + this.$ele.outerHeight();\n        this.reposition(offsetAmt);\n      }\n\n      if ($.isFunction(self.settings.onShow)) {\n        self.settings.onShow.call(this.$ele);\n      }\n\n      this.$ele.one(this.animations.start, function() {\n        hasAnimation = true;\n      }).one(this.animations.end, function() {\n        self.$ele.removeClass(self.settings.animate.enter);\n        if ($.isFunction(self.settings.onShown)) {\n          self.settings.onShown.call(this);\n        }\n      });\n\n      setTimeout(function() {\n        if (!hasAnimation) {\n          if ($.isFunction(self.settings.onShown)) {\n            self.settings.onShown.call(this);\n          }\n        }\n      }, 600);\n    },\n    bind: function() {\n      var self = this;\n\n      this.$ele.find('[data-notify=\"dismiss\"]').on('click', function() {\n        self.close();\n      });\n\n      if ($.isFunction(self.settings.onClick)) {\n        this.$ele.on('click', function(event) {\n          if (event.target != self.$ele.find('[data-notify=\"dismiss\"]')[0]) {\n            self.settings.onClick.call(this, event);\n          }\n        });\n      }\n\n      this.$ele.mouseover(function() {\n        $(this).data('data-hover', \"true\");\n      }).mouseout(function() {\n        $(this).data('data-hover', \"false\");\n      });\n      this.$ele.data('data-hover', \"false\");\n\n      if (this.settings.delay > 0) {\n        self.$ele.data('notify-delay', self.settings.delay);\n        var timer = setInterval(function() {\n          var delay = parseInt(self.$ele.data('notify-delay')) - self.settings.timer;\n          if ((self.$ele.data('data-hover') === 'false' && self.settings.mouse_over === \"pause\") || self.settings.mouse_over != \"pause\") {\n            var percent = ((self.settings.delay - delay) / self.settings.delay) * 100;\n            self.$ele.data('notify-delay', delay);\n            self.$ele.find('[data-notify=\"progressbar\"] > div').attr('aria-valuenow', percent).css('width', percent + '%');\n          }\n          if (delay <= -(self.settings.timer)) {\n            clearInterval(timer);\n            self.close();\n          }\n        }, self.settings.timer);\n      }\n    },\n    close: function() {\n      var self = this,\n        posX = parseInt(this.$ele.css(this.settings.placement.from)),\n        hasAnimation = false;\n\n      this.$ele.attr('data-closing', 'true').addClass(this.settings.animate.exit);\n      self.reposition(posX);\n\n      if ($.isFunction(self.settings.onClose)) {\n        self.settings.onClose.call(this.$ele);\n      }\n\n      this.$ele.one(this.animations.start, function() {\n        hasAnimation = true;\n      }).one(this.animations.end, function() {\n        $(this).remove();\n        if ($.isFunction(self.settings.onClosed)) {\n          self.settings.onClosed.call(this);\n        }\n      });\n\n      setTimeout(function() {\n        if (!hasAnimation) {\n          self.$ele.remove();\n          if (self.settings.onClosed) {\n            self.settings.onClosed(self.$ele);\n          }\n        }\n      }, 600);\n    },\n    reposition: function(posX) {\n      var self = this,\n        notifies = '[data-notify-position=\"' + this.settings.placement.from + '-' + this.settings.placement.align + '\"]:not([data-closing=\"true\"])',\n        $elements = this.$ele.nextAll(notifies);\n      if (this.settings.newest_on_top === true) {\n        $elements = this.$ele.prevAll(notifies);\n      }\n      $elements.each(function() {\n        $(this).css(self.settings.placement.from, posX);\n        posX = (parseInt(posX) + parseInt(self.settings.spacing)) + $(this).outerHeight();\n      });\n    }\n  });\n\n  $.notify = function(content, options) {\n    var plugin = new Notify(this, content, options);\n    return plugin.notify;\n  };\n  $.notifyDefaults = function(options) {\n    defaults = $.extend(true, {}, defaults, options);\n    return defaults;\n  };\n\n  $.notifyClose = function(selector) {\n\n    if (typeof selector === \"undefined\" || selector === \"all\") {\n      $('[data-notify]').find('[data-notify=\"dismiss\"]').trigger('click');\n    } else if (selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger') {\n      $('.alert-' + selector + '[data-notify]').find('[data-notify=\"dismiss\"]').trigger('click');\n    } else if (selector) {\n      $(selector + '[data-notify]').find('[data-notify=\"dismiss\"]').trigger('click');\n    } else {\n      $('[data-notify-position=\"' + selector + '\"]').find('[data-notify=\"dismiss\"]').trigger('click');\n    }\n  };\n\n  $.notifyCloseExcept = function(selector) {\n\n    if (selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger') {\n      $('[data-notify]').not('.alert-' + selector).find('[data-notify=\"dismiss\"]').trigger('click');\n    } else {\n      $('[data-notify]').not(selector).find('[data-notify=\"dismiss\"]').trigger('click');\n    }\n  };\n\n\n}));"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/plugins/world.js",
    "content": "! function(t, e) {\n  \"object\" == typeof exports && \"undefined\" != typeof module ? module.exports = e() : \"function\" == typeof define && define.amd ? define(e) : (t = \"undefined\" != typeof globalThis ? globalThis : t || self).jsVectorMap = e()\n}(this, (function() {\n  \"use strict\";\n  Element.prototype.matches || (Element.prototype.matches = Element.prototype.matchesSelector || Element.prototype.mozMatchesSelector || Element.prototype.msMatchesSelector || Element.prototype.oMatchesSelector || Element.prototype.webkitMatchesSelector || function(t) {\n    for (var e = (this.document || this.ownerDocument).querySelectorAll(t), i = e.length; --i >= 0 && e.item(i) !== this;);\n    return i > -1\n  }), Object.assign || Object.defineProperty(Object, \"assign\", {\n    enumerable: !1,\n    configurable: !0,\n    writable: !0,\n    value: function(t) {\n      if (null == t) throw new TypeError(\"Cannot convert first argument to object\");\n      for (var e = Object(t), i = 1; i < arguments.length; i++) {\n        var s = arguments[i];\n        if (null != s) {\n          s = Object(s);\n          for (var a = Object.keys(Object(s)), r = 0, n = a.length; r < n; r++) {\n            var o = a[r],\n              h = Object.getOwnPropertyDescriptor(s, o);\n            void 0 !== h && h.enumerable && (e[o] = s[o])\n          }\n        }\n      }\n      return e\n    }\n  });\n  var t = {},\n    e = 1,\n    i = function(i, s, a, r) {\n      void 0 === r && (r = {}), t[\"jvm:\" + s + \"::\" + e++] = {\n        selector: i,\n        handler: a\n      }, i.addEventListener(s, a, r)\n    },\n    s = function(e, i, s) {\n      var a = i.split(\":\")[1];\n      e.removeEventListener(a, s), delete t[i]\n    },\n    a = function() {\n      return t\n    },\n    r = function() {\n      function t(t) {\n        return t instanceof Element ? (this.selector = t, this) : (this.selector = document.querySelector(t), this)\n      }\n      var e = t.prototype;\n      return e.on = function(t, e, s) {\n        return void 0 === s && (s = {}), i(this.selector, t, e, s), this\n      }, e.delegate = function(t, e, i) {\n        for (var s in e = e.split(\" \")) this.on(e[s], (function(e) {\n          var s = e.target;\n          s.matches(t) && i.call(s, e)\n        }))\n      }, e.css = function(t) {\n        for (var e in t) this.selector.style[e] = t[e];\n        return this\n      }, e.text = function(t) {\n        return t ? (this.selector.textContent = t, this) : this.selector.textContent\n      }, e.attr = function(t, e) {\n        return t && e ? (this.selector.setAttribute(t, e), this) : this.selector.getAttribute(t)\n      }, e.addClass = function(t) {\n        return this.selector.classList ? (this.selector.classList.add(t), this) : (-1 == this.selector.className.split(\" \").indexOf(t) && (this.selector.className += \" \" + t), this)\n      }, e.append = function(t) {\n        return this.selector.appendChild(t), this\n      }, e.show = function() {\n        this.css({\n          display: \"block\"\n        })\n      }, e.hide = function() {\n        this.css({\n          display: \"none\"\n        })\n      }, e.height = function() {\n        return this.selector.offsetHeight\n      }, e.width = function() {\n        return this.selector.offsetWidth\n      }, t\n    }(),\n    n = function(t) {\n      return function(t) {\n        return !!t && \"object\" == typeof t\n      }(t) && ! function(t) {\n        var e = Object.prototype.toString.call(t);\n        return \"[object RegExp]\" === e || \"[object Date]\" === e || function(t) {\n          return t.$$typeof === o\n        }(t)\n      }(t)\n    };\n  var o = \"function\" == typeof Symbol && Symbol.for ? Symbol.for(\"react.element\") : 60103;\n\n  function h(t, e) {\n    return !1 !== e.clone && e.isMergeableObject(t) ? d((i = t, Array.isArray(i) ? [] : {}), t, e) : t;\n    var i\n  }\n\n  function l(t, e, i) {\n    return t.concat(e).map((function(t) {\n      return h(t, i)\n    }))\n  }\n\n  function c(t) {\n    return Object.keys(t).concat(function(t) {\n      return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(t).filter((function(e) {\n        return t.propertyIsEnumerable(e)\n      })) : []\n    }(t))\n  }\n\n  function u(t, e) {\n    try {\n      return e in t\n    } catch (t) {\n      return !1\n    }\n  }\n\n  function p(t, e, i) {\n    var s = {};\n    return i.isMergeableObject(t) && c(t).forEach((function(e) {\n      s[e] = h(t[e], i)\n    })), c(e).forEach((function(a) {\n      (function(t, e) {\n        return u(t, e) && !(Object.hasOwnProperty.call(t, e) && Object.propertyIsEnumerable.call(t, e))\n      })(t, a) || (u(t, a) && i.isMergeableObject(e[a]) ? s[a] = function(t, e) {\n        if (!e.customMerge) return d;\n        var i = e.customMerge(t);\n        return \"function\" == typeof i ? i : d\n      }(a, i)(t[a], e[a], i) : s[a] = h(e[a], i))\n    })), s\n  }\n  var d = function(t, e, i) {\n      (i = i || {}).arrayMerge = i.arrayMerge || l, i.isMergeableObject = i.isMergeableObject || n, i.cloneUnlessOtherwiseSpecified = h;\n      var s = Array.isArray(e);\n      return s === Array.isArray(t) ? s ? i.arrayMerge(t, e, i) : p(t, e, i) : h(e, i)\n    },\n    f = {\n      isImageUrl: function(t) {\n        return /\\.(jpg|gif|png)$/.test(t)\n      },\n      createElement: function(t, e, i, s) {\n        void 0 === s && (s = !1);\n        var a = document.createElement(t);\n        return i && (a[s ? \"innerHTML\" : \"textContent\"] = i), e && (a.className = e), a\n      },\n      removeElement: function(t) {\n        t.parentNode.removeChild(t)\n      },\n      $: function(t) {\n        return new r(t)\n      },\n      hyphenate: function(t) {\n        return t.replace(/[\\w]([A-Z])/g, (function(t) {\n          return t[0] + \"-\" + t[1]\n        })).toLowerCase()\n      },\n      isFunc: function(t) {\n        return \"function\" == typeof t\n      },\n      isObj: function(t) {\n        return \"object\" == typeof t\n      },\n      isStr: function(t) {\n        return \"string\" == typeof t\n      },\n      isArr: function(t) {\n        return Array.isArray(t)\n      },\n      merge: function(t, e) {\n        return Object.assign(t, e)\n      },\n      mergeDeeply: function(t, e) {\n        return d(t, e)\n      },\n      keys: function(t) {\n        return Object.keys(t)\n      }\n    };\n\n  function m(t, e) {\n    t.prototype = Object.create(e.prototype), t.prototype.constructor = t, g(t, e)\n  }\n\n  function g(t, e) {\n    return (g = Object.setPrototypeOf || function(t, e) {\n      return t.__proto__ = e, t\n    })(t, e)\n  }\n  var v = function() {\n      function t(t, e) {\n        this._name = t, this.node = this.createElement(t), e && this.set(e)\n      }\n      var e = t.prototype;\n      return e.createElement = function(t) {\n        return document.createElementNS(\"http://www.w3.org/2000/svg\", t)\n      }, e.addClass = function(t) {\n        this.node.setAttribute(\"class\", t)\n      }, e.getBBox = function() {\n        return this.node.getBBox()\n      }, e.set = function(t, e) {\n        if (f.isObj(t))\n          for (var i in t) this.applyAttr(i, t[i]);\n        else this.applyAttr(t, e)\n      }, e.get = function(t) {\n        return this.style.initial[t]\n      }, e.applyAttr = function(t, e) {\n        this.node.setAttribute(f.hyphenate(t), e)\n      }, e.remove = function() {\n        this.node.parentNode.removeChild(this.node)\n      }, t\n    }(),\n    y = function(t) {\n      function e(e, i, s) {\n        var a;\n        return void 0 === s && (s = {}), (a = t.call(this, e, i) || this).isHovered = !1, a.isSelected = !1, a.style = s, a.style.current = {}, a.updateStyle(), a\n      }\n      m(e, t);\n      var i = e.prototype;\n      return i.setStyle = function(t, e) {\n        var i;\n        f.isObj(t) ? f.merge(this.style.current, t) : f.merge(this.style.current, ((i = {})[t] = e, i));\n        this.updateStyle()\n      }, i.updateStyle = function() {\n        var t = {};\n        f.merge(t, this.style.initial), f.merge(t, this.style.current), this.isHovered && f.merge(t, this.style.hover), this.isSelected && (f.merge(t, this.style.selected), this.isHovered && f.merge(t, this.style.selectedHover)), this.set(t)\n      }, e\n    }(v),\n    b = function(t) {\n      function e(e, i) {\n        return t.call(this, \"text\", e, i) || this\n      }\n      return m(e, t), e.prototype.applyAttr = function(e, i) {\n        \"text\" === e ? this.node.textContent = i : t.prototype.applyAttr.call(this, e, i)\n      }, e\n    }(y),\n    S = function(t) {\n      function e(e, i) {\n        return t.call(this, \"image\", e, i) || this\n      }\n      return m(e, t), e.prototype.applyAttr = function(e, i) {\n        var s;\n        \"image\" === e ? (f.isObj(i) ? (s = i.url, this.offset = i.offset || [0, 0]) : (s = i, this.offset = [0, 0]), this.node.setAttributeNS(\"http://www.w3.org/1999/xlink\", \"href\", s), this.width = 23, this.height = 23, this.applyAttr(\"width\", this.width), this.applyAttr(\"height\", this.height), this.applyAttr(\"x\", this.cx - this.width / 2 + this.offset[0]), this.applyAttr(\"y\", this.cy - this.height / 2 + this.offset[1])) : \"cx\" == e ? (this.cx = i, this.width && this.applyAttr(\"x\", i - this.width / 2 + this.offset[0])) : \"cy\" == e ? (this.cy = i, this.height && this.applyAttr(\"y\", i - this.height / 2 + this.offset[1])) : t.prototype.applyAttr.apply(this, arguments)\n      }, e\n    }(y),\n    w = function(t) {\n      function e(e) {\n        var i;\n        return (i = t.call(this, \"svg\") || this)._container = e, i._defsElement = new v(\"defs\"), i._rootElement = new v(\"g\", {\n          id: \"jvm-regions-group\"\n        }), i.node.appendChild(i._defsElement.node), i.node.appendChild(i._rootElement.node), i._container.append(i.node), i\n      }\n      m(e, t);\n      var i = e.prototype;\n      return i.setSize = function(t, e) {\n        this.node.setAttribute(\"width\", t), this.node.setAttribute(\"height\", e)\n      }, i.applyTransformParams = function(t, e, i) {\n        this._rootElement.node.setAttribute(\"transform\", \"scale(\" + t + \") translate(\" + e + \", \" + i + \")\")\n      }, i.createPath = function(t, e) {\n        var i = new y(\"path\", t, e);\n        return i.node.setAttribute(\"fill-rule\", \"evenodd\"), this.add(i)\n      }, i.createCircle = function(t, e, i) {\n        var s = new y(\"circle\", t, e);\n        return this.add(s, i)\n      }, i.createLine = function(t, e, i) {\n        var s = new y(\"line\", t, e);\n        return this.add(s, i)\n      }, i.createText = function(t, e, i) {\n        var s = new b(t, e);\n        return this.add(s, i)\n      }, i.createImage = function(t, e, i) {\n        var s = new S(t, e);\n        return this.add(s, i)\n      }, i.createGroup = function(t) {\n        var e = new v(\"g\");\n        return this.node.appendChild(e.node), t && (e.node.id = t), e.canvas = this, e\n      }, i.add = function(t, e) {\n        return (e = e || this._rootElement).node.appendChild(t.node), t\n      }, e\n    }(v);\n\n  function k(t, e, i) {\n    var s = f.$(e),\n      a = -1 === s.attr(\"class\").indexOf(\"jvm-region\") ? \"marker\" : \"region\",\n      r = \"region\" === a ? s.attr(\"data-code\") : s.attr(\"data-index\"),\n      n = a + \":select\";\n    return i && (n = a + \".tooltip:show\"), {\n      event: n,\n      type: a,\n      code: r,\n      element: \"region\" === a ? t.regions[r].element : t.markers[r].element,\n      tooltipText: \"region\" === a ? t.mapData.paths[r].name || \"\" : t.markers[r].config.name || \"\"\n    }\n  }\n  var x = function() {\n      function t() {}\n      var e = t.prototype;\n      return e.getLabelText = function(t, e) {\n        if (e) {\n          if (f.isFunc(e.render)) {\n            var i = [];\n            return this.config.marker && i.push(this.config.marker), i.push(t), e.render.apply(this, i)\n          }\n          return t\n        }\n      }, e.getLabelOffsets = function(t, e) {\n        return f.isFunc(e.offsets) ? e.offsets(t) : f.isArr(e.offsets) ? e.offsets[t] : [0, 0]\n      }, e.setStyle = function(t, e) {\n        this.shape.setStyle(t, e)\n      }, e.remove = function() {\n        this.shape.remove(), this.label && this.label.remove()\n      }, e.hover = function(t) {\n        this._setStatus(\"isHovered\", t)\n      }, e.select = function(t) {\n        this._setStatus(\"isSelected\", t)\n      }, e._setStatus = function(t, e) {\n        this.shape[t] = e, this.shape.updateStyle(), this[t] = e, this.label && (this.label[t] = e, this.label.updateStyle())\n      }, t\n    }(),\n    M = function(t) {\n      function e(e) {\n        var i, s = e.map,\n          a = e.code,\n          r = e.path,\n          n = e.style,\n          o = e.label,\n          h = e.labelStyle,\n          l = e.labelsGroup;\n        (i = t.call(this) || this).config = arguments[0], i.canvas = s.canvas, i.map = s, i.shape = i.canvas.createPath({\n          d: r,\n          dataCode: a\n        }, n), i.shape.addClass(\"jvm-region jvm-element\");\n        var c = i.shape.getBBox(),\n          u = i.getLabelText(a, o);\n        if (o && u) {\n          var p = i.getLabelOffsets(a);\n          i.labelX = c.x + c.width / 2 + p[0], i.labelY = c.y + c.height / 2 + p[1], i.label = i.canvas.createText({\n            text: u,\n            textAnchor: \"middle\",\n            alignmentBaseline: \"central\",\n            dataCode: a,\n            x: i.labelX,\n            y: i.labelY\n          }, h, l), i.label.addClass(\"jvm-region jvm-element\")\n        }\n        return i\n      }\n      return m(e, t), e.prototype.updateLabelPosition = function() {\n        this.label && this.label.set({\n          x: this.labelX * this.map.scale + this.map.transX * this.map.scale,\n          y: this.labelY * this.map.scale + this.map.transY * this.map.scale\n        })\n      }, e\n    }(x);\n  var _ = function(t) {\n    function e(e) {\n      var i, s = e.index,\n        a = e.map,\n        r = e.style,\n        n = e.x1,\n        o = e.y1,\n        h = e.x2,\n        l = e.y2,\n        c = e.group;\n      return (i = t.call(this) || this).shape = a.canvas.createLine({\n        x1: n,\n        y1: o,\n        x2: h,\n        y2: l,\n        dataIndex: s\n      }, r, c), i.shape.addClass(\"jvm-line\"), i\n    }\n    return m(e, t), e\n  }(x);\n\n  function j(t, e) {\n    return t.toLowerCase() + \":to:\" + e.toLowerCase()\n  }\n  var E = function(t) {\n    function e(e) {\n      var i, s = e.index,\n        a = e.style,\n        r = e.label,\n        n = e.cx,\n        o = e.cy,\n        h = e.map,\n        l = e.group;\n      return (i = t.call(this) || this)._map = h, i._isImage = !!a.initial.image, i.config = arguments[0], i.shape = h.canvas[i._isImage ? \"createImage\" : \"createCircle\"]({\n        dataIndex: s,\n        cx: n,\n        cy: o\n      }, i._getStyle(), l), i.shape.addClass(\"jvm-marker jvm-element\"), i._isImage && i.updateLabelPosition(), r && i._createLabel(i.config), i\n    }\n    m(e, t);\n    var i = e.prototype;\n    return i.updateLabelPosition = function() {\n      this.label && this.label.set({\n        x: this._labelX * this._map.scale + this._offsets[0] + this._map.transX * this._map.scale + 5 + (this._isImage ? (this.shape.width || 0) / 2 : this.shape.node.r.baseVal.value),\n        y: this._labelY * this._map.scale + this._map.transY * this._map.scale + this._offsets[1]\n      })\n    }, i._createLabel = function(t) {\n      var e = t.index,\n        i = t.map,\n        s = t.label,\n        a = t.labelsGroup,\n        r = t.cx,\n        n = t.cy,\n        o = t.marker,\n        h = t.isRecentlyCreated,\n        l = this.getLabelText(e, s);\n      this._labelX = r / i.scale - i.transX, this._labelY = n / i.scale - i.transY, this._offsets = h && o.offsets ? o.offsets : this.getLabelOffsets(e, s), this.label = i.canvas.createText({\n        text: l,\n        dataIndex: e,\n        x: this._labelX,\n        y: this._labelY,\n        dy: \"0.6ex\"\n      }, i.params.markerLabelStyle, a), this.label.addClass(\"jvm-marker jvm-element\"), h && this.updateLabelPosition()\n    }, i._getStyle = function() {\n      var t = {};\n      return this._isImage ? t.initial = {\n        image: this.config.style.initial.image\n      } : t = this.config.style, t\n    }, e\n  }(x);\n  var O = function() {\n      function t(t) {\n        void 0 === t && (t = {}), this._options = t, this._map = this._options.map, this._series = this._options.series, this._body = f.createElement(\"div\", \"jvm-legend\"), this._options.cssClass && this._body.setAttribute(\"class\", this._options.cssClass), t.vertical ? this._map.legendVertical.appendChild(this._body) : this._map.legendHorizontal.appendChild(this._body), this.render()\n      }\n      return t.prototype.render = function() {\n        var t, e, i, s = this._series.scale.getTicks(),\n          a = f.createElement(\"div\", \"jvm-legend-inner\");\n        if (this._body.innderHTML = \"\", this._options.title) {\n          var r = f.createElement(\"div\", \"jvm-legend-title\", this._options.title);\n          this._body.appendChild(r)\n        }\n        this._body.appendChild(a);\n        for (var n = 0; n < s.length; n++) {\n          switch (t = f.createElement(\"div\", \"jvm-legend-tick\"), e = f.createElement(\"div\", \"jvm-legend-tick-sample\"), this._series.config.attribute) {\n            case \"fill\":\n              f.isImageUrl(s[n].value) ? e.style.background = \"url(\" + s[n].value + \")\" : e.style.background = s[n].value;\n              break;\n            case \"stroke\":\n              e.style.background = s[n].value;\n              break;\n            case \"image\":\n              e.style.background = \"url(\" + (f.isObj(s[n].value) ? s[n].value.url : s[n].value) + \") no-repeat center center\", e.style.backgroundSize = \"cover\"\n          }\n          t.appendChild(e), i = s[n].label, this._options.labelRender && (i = this._options.labelRender(i));\n          var o = f.createElement(\"div\", \"jvm-legend-tick-text\", i);\n          t.appendChild(o), a.appendChild(t)\n        }\n      }, t\n    }(),\n    C = function() {\n      function t(t) {\n        this._scale = t\n      }\n      var e = t.prototype;\n      return e.getValue = function(t) {\n        return this._scale[t]\n      }, e.getTicks = function() {\n        var t = [];\n        for (var e in this._scale) t.push({\n          label: e,\n          value: this._scale[e]\n        });\n        return t\n      }, t\n    }(),\n    X = function() {\n      function t(t, e, i) {\n        void 0 === t && (t = {}), this._map = i, this._elements = e, this._values = t.values || {}, this.config = t, this.config.attribute = t.attribute || \"fill\", t.attributes && this.setAttributes(t.attributes), f.isObj(t.scale) && (this.scale = new C(t.scale)), this.config.legend && (this.legend = new O(f.merge({\n          map: this._map,\n          series: this\n        }, this.config.legend))), this.setValues(this._values)\n      }\n      var e = t.prototype;\n      return e.setValues = function(t) {\n        var e = {};\n        for (var i in t) t[i] && (e[i] = this.scale.getValue(t[i]));\n        this.setAttributes(e)\n      }, e.setAttributes = function(t) {\n        for (var e in t) this._elements[e] && this._elements[e].element.setStyle(this.config.attribute, t[e])\n      }, e.clear = function() {\n        var t, e = {};\n        for (t in this._values) this._elements[t] && (e[t] = this._elements[t].element.shape.style.initial[this.config.attribute]);\n        this.setAttributes(e), this._values = {}\n      }, t\n    }();\n  var Y = {\n    mill: function(t, e, i) {\n      return {\n        x: this.radius * (e - i) * this.radDeg,\n        y: -this.radius * Math.log(Math.tan((45 + .4 * t) * this.radDeg)) / .8\n      }\n    },\n    merc: function(t, e, i) {\n      return {\n        x: this.radius * (e - i) * this.radDeg,\n        y: -this.radius * Math.log(Math.tan(Math.PI / 4 + t * Math.PI / 360))\n      }\n    },\n    aea: function(t, e, i) {\n      var s = i * this.radDeg,\n        a = 29.5 * this.radDeg,\n        r = 45.5 * this.radDeg,\n        n = t * this.radDeg,\n        o = e * this.radDeg,\n        h = (Math.sin(a) + Math.sin(r)) / 2,\n        l = Math.cos(a) * Math.cos(a) + 2 * h * Math.sin(a),\n        c = h * (o - s),\n        u = Math.sqrt(l - 2 * h * Math.sin(n)) / h,\n        p = Math.sqrt(l - 2 * h * Math.sin(0)) / h;\n      return {\n        x: u * Math.sin(c) * this.radius,\n        y: -(p - u * Math.cos(c)) * this.radius\n      }\n    },\n    lcc: function(t, e, i) {\n      var s = i * this.radDeg,\n        a = e * this.radDeg,\n        r = 33 * this.radDeg,\n        n = 45 * this.radDeg,\n        o = t * this.radDeg,\n        h = Math.log(Math.cos(r) * (1 / Math.cos(n))) / Math.log(Math.tan(Math.PI / 4 + n / 2) * (1 / Math.tan(Math.PI / 4 + r / 2))),\n        l = Math.cos(r) * Math.pow(Math.tan(Math.PI / 4 + r / 2), h) / h,\n        c = l * Math.pow(1 / Math.tan(Math.PI / 4 + o / 2), h),\n        u = l * Math.pow(1 / Math.tan(Math.PI / 4 + 0), h);\n      return {\n        x: c * Math.sin(h * (a - s)) * this.radius,\n        y: -(u - c * Math.cos(h * (a - s))) * this.radius\n      }\n    }\n  };\n  Y.degRad = 180 / Math.PI, Y.radDeg = Math.PI / 180, Y.radius = 6381372;\n  var L = function() {\n    function t(t, e) {\n      var i = t.scale,\n        s = t.values;\n      this._scale = i, this._values = s, this._fromColor = this.hexToRgb(i[0]), this._toColor = this.hexToRgb(i[1]), this._map = e, this.setMinMaxValues(s), this.visualize()\n    }\n    var e = t.prototype;\n    return e.setMinMaxValues = function(t) {\n      for (var e in this.min = Number.MAX_VALUE, this.max = 0, t)(e = parseFloat(t[e])) > this.max && (this.max = e), e < this.min && (this.min = e)\n    }, e.visualize = function() {\n      var t, e = {};\n      for (var i in this._values) t = parseFloat(this._values[i]), isNaN(t) || (e[i] = this.getValue(t));\n      this.setAttributes(e)\n    }, e.setAttributes = function(t) {\n      for (var e in t) this._map.regions[e] && this._map.regions[e].element.setStyle(\"fill\", t[e])\n    }, e.getValue = function(t) {\n      for (var e, i = \"#\", s = 0; s < 3; s++) i += (1 === (e = Math.round(this._fromColor[s] + (this._toColor[s] - this._fromColor[s]) * ((t - this.min) / (this.max - this.min))).toString(16)).length ? \"0\" : \"\") + e;\n      return i\n    }, e.hexToRgb = function(t) {\n      var e = 0,\n        i = 0,\n        s = 0;\n      return 4 == t.length ? (e = \"0x\" + t[1] + t[1], i = \"0x\" + t[2] + t[2], s = \"0x\" + t[3] + t[3]) : 7 == t.length && (e = \"0x\" + t[1] + t[2], i = \"0x\" + t[3] + t[4], s = \"0x\" + t[5] + t[6]), [parseInt(e), parseInt(i), parseInt(s)]\n    }, t\n  }();\n  var T = Object.freeze({\n      __proto__: null,\n      handleContainerEvents: function() {\n        var t, e, i = this,\n          s = !1,\n          a = this;\n        this.params.draggable && (this.container.on(\"mousemove\", (function(i) {\n          return s && (a.transX -= (t - i.pageX) / a.scale, a.transY -= (e - i.pageY) / a.scale, a.applyTransform(), t = i.pageX, e = i.pageY), !1\n        })).on(\"mousedown\", (function(i) {\n          return s = !0, t = i.pageX, e = i.pageY, !1\n        })), f.$(\"body\").on(\"mouseup\", (function() {\n          s = !1\n        }))), this.params.zoomOnScroll && this.container.on(\"wheel\", (function(t) {\n          var e = 0;\n          e = (t.deltaY || -t.wheelDelta || t.detail) >> 10 || 1, e *= 75;\n          var s = i.container.selector.getBoundingClientRect(),\n            r = t.pageX - s.left - window.pageXOffset,\n            n = t.pageY - s.top - window.pageYOffset,\n            o = Math.pow(1 + a.params.zoomOnScrollSpeed / 1e3, -1.5 * e);\n          a.tooltip && a.tooltip.hide(), a.setScale(a.scale * o, r, n)\n        }), {\n          passive: !0\n        })\n      },\n      handleElementEvents: function() {\n        var t = this;\n        this.container.delegate(\".jvm-element\", \"mouseover mouseout\", (function(e) {\n          var i = k(t, this, !0),\n            s = t.params.showTooltip;\n          \"mouseover\" === e.type ? e.defaultPrevented || (i.element.hover(!0), s && (t.tooltip.text(i.tooltipText), t.tooltip.show(), t.emit(i.event, [t.tooltip, i.code]))) : (i.element.hover(!1), s && t.tooltip.hide())\n        })), this.container.delegate(\".jvm-element\", \"mouseup\", (function(e) {\n          var i = k(t, this);\n          if (\"region\" === i.type && t.params.regionsSelectable || \"marker\" === i.type && t.params.markersSelectable && !e.defaultPrevented) {\n            var s = i.element;\n            t.params[i.type + \"sSelectableOne\"] && t.clearSelected(i.type + \"s\"), i.element.isSelected ? s.select(!1) : s.select(!0), t.emit(i.event, [i.code, s.isSelected, t.getSelected(i.type + \"s\")])\n          }\n        }))\n      },\n      handleZoomButtons: function() {\n        var t = this,\n          e = this,\n          s = f.createElement(\"div\", \"jvm-zoom-btn jvm-zoomin\", \"&#43;\", !0),\n          a = f.createElement(\"div\", \"jvm-zoom-btn jvm-zoomout\", \"&#x2212\", !0);\n        this.container.append(s).append(a), i(s, \"click\", (function() {\n          t.setScale(e.scale * e.params.zoomStep, e.width / 2, e.height / 2, !1, e.params.zoomAnimate)\n        })), i(a, \"click\", (function() {\n          t.setScale(e.scale / e.params.zoomStep, e.width / 2, e.height / 2, !1, e.params.zoomAnimate)\n        }))\n      },\n      bindContainerTouchEvents: function() {\n        var t, e, i, s, a, r, n, o = this,\n          h = function(h) {\n            var l, c, u, p, d = h.touches;\n            if (\"touchstart\" == h.type && (n = 0), 1 == d.length) 1 == n && (u = o.transX, p = o.transY, o.transX -= (i - d[0].pageX) / o.scale, o.transY -= (s - d[0].pageY) / o.scale, o.tooltip.hide(), o.applyTransform(), u == o.transX && p == o.transY || h.preventDefault()), i = d[0].pageX, s = d[0].pageY;\n            else if (2 == d.length)\n              if (2 == n) c = Math.sqrt(Math.pow(d[0].pageX - d[1].pageX, 2) + Math.pow(d[0].pageY - d[1].pageY, 2)) / e, o.setScale(t * c, a, r), o.tooltip.hide(), h.preventDefault();\n              else {\n                var f = o.container.selector.getBoundingClientRect();\n                l = {\n                  top: f.top + window.scrollY,\n                  left: f.left + window.scrollX\n                }, a = d[0].pageX > d[1].pageX ? d[1].pageX + (d[0].pageX - d[1].pageX) / 2 : d[0].pageX + (d[1].pageX - d[0].pageX) / 2, r = d[0].pageY > d[1].pageY ? d[1].pageY + (d[0].pageY - d[1].pageY) / 2 : d[0].pageY + (d[1].pageY - d[0].pageY) / 2, a -= l.left, r -= l.top, t = o.scale, e = Math.sqrt(Math.pow(d[0].pageX - d[1].pageX, 2) + Math.pow(d[0].pageY - d[1].pageY, 2))\n              } n = d.length\n          };\n        this.container.on(\"touchstart\", h).on(\"touchmove\", h)\n      },\n      createRegions: function() {\n        var t, e;\n        for (t in this.regionLabelsGroup = this.regionLabelsGroup || this.canvas.createGroup(\"jvm-regions-labels-group\"), this.mapData.paths) e = new M({\n          map: this,\n          code: t,\n          path: this.mapData.paths[t].path,\n          style: f.merge({}, this.params.regionStyle),\n          labelStyle: this.params.regionLabelStyle,\n          labelsGroup: this.regionLabelsGroup,\n          label: this.params.labels && this.params.labels.regions\n        }), this.regions[t] = {\n          config: this.mapData.paths[t],\n          element: e\n        }\n      },\n      createLines: function(t, e, i) {\n        var s = this;\n        void 0 === i && (i = !1);\n        var a, r = !1,\n          n = !1;\n        for (var o in this.linesGroup = this.linesGroup || this.canvas.createGroup(\"jvm-lines-group\"), t) {\n          var h = t[o];\n          for (var l in e) {\n            var c = i ? e[l].config : e[l];\n            c.name === h.from && (r = this.getMarkerPosition(c)), c.name === h.to && (n = this.getMarkerPosition(c))\n          }!1 !== r && !1 !== n && (a = new _({\n            index: o,\n            map: this,\n            style: f.mergeDeeply({\n              initial: this.params.lineStyle\n            }, {\n              initial: h.style || {}\n            }),\n            x1: r.x,\n            y1: r.y,\n            x2: n.x,\n            y2: n.y,\n            group: this.linesGroup\n          }), i && Object.keys(this.lines).forEach((function(e) {\n            e === j(t[0].from, t[0].to) && s.lines[e].element.remove()\n          })), this.lines[j(h.from, h.to)] = {\n            element: a,\n            config: h\n          })\n        }\n      },\n      createMarkers: function(t, e) {\n        var i, s, a, r, n = this;\n        for (var o in void 0 === t && (t = {}), void 0 === e && (e = !1), this.markersGroup = this.markersGroup || this.canvas.createGroup(\"jvm-markers-group\"), this.markerLabelsGroup = this.markerLabelsGroup || this.canvas.createGroup(\"jvm-markers-labels-group\"), t) {\n          if (i = t[o], a = this.getMarkerPosition(i), r = i.coords.join(\":\"), e) {\n            if (f.keys(this.markers).filter((function(t) {\n                return n.markers[t]._uid === r\n              })).length) continue;\n            o = f.keys(this.markers).length\n          }!1 !== a && (s = new E({\n            index: o,\n            map: this,\n            style: f.mergeDeeply(this.params.markerStyle, {\n              initial: i.style || {}\n            }),\n            label: this.params.labels && this.params.labels.markers,\n            labelsGroup: this.markerLabelsGroup,\n            cx: a.x,\n            cy: a.y,\n            group: this.markersGroup,\n            marker: i,\n            isRecentlyCreated: e\n          }), this.markers[o] && this.removeMarkers([o]), this.markers[o] = {\n            _uid: r,\n            config: i,\n            element: s\n          })\n        }\n      },\n      createTooltip: function() {\n        var t = this,\n          e = f.createElement(\"div\", \"jvm-tooltip\");\n        this.tooltip = f.$(document.body.appendChild(e)), this.container.on(\"mousemove\", (function(i) {\n          if (\"block\" === t.tooltip.selector.style.display) {\n            var s = t.container.selector.querySelector(\"#jvm-regions-group\").getBoundingClientRect(),\n              a = e.getBoundingClientRect(),\n              r = a.height,\n              n = a.width,\n              o = i.clientY <= s.top + r + 5,\n              h = i.pageY - r - 5,\n              l = i.pageX - n - 5;\n            o && (h += r + 5, l -= 10), i.clientX < s.left + n + 5 && (l = i.pageX + 5 + 2, o && (l += 10)), t.tooltip.css({\n              top: h + \"px\",\n              left: l + \"px\"\n            })\n          }\n        }))\n      },\n      createSeries: function() {\n        for (var t in this.series = {\n            markers: [],\n            regions: []\n          }, this.params.series)\n          for (var e = 0; e < this.params.series[t].length; e++) this.series[t][e] = new X(this.params.series[t][e], this[t], this)\n      },\n      applyTransform: function() {\n        var t, e, i, s;\n        this.defaultWidth * this.scale <= this.width ? (t = (this.width - this.defaultWidth * this.scale) / (2 * this.scale), i = (this.width - this.defaultWidth * this.scale) / (2 * this.scale)) : (t = 0, i = (this.width - this.defaultWidth * this.scale) / this.scale), this.defaultHeight * this.scale <= this.height ? (e = (this.height - this.defaultHeight * this.scale) / (2 * this.scale), s = (this.height - this.defaultHeight * this.scale) / (2 * this.scale)) : (e = 0, s = (this.height - this.defaultHeight * this.scale) / this.scale), this.transY > e ? this.transY = e : this.transY < s && (this.transY = s), this.transX > t ? this.transX = t : this.transX < i && (this.transX = i), this.canvas.applyTransformParams(this.scale, this.transX, this.transY), this.markers && this.repositionMarkers(), this.lines && this.repositionLines(), this.repositionLabels()\n      },\n      setFocus: function(t) {\n        var e = this;\n        void 0 === t && (t = {});\n        var i, s = [];\n        if (t.region ? s.push(t.region) : t.regions && (s = t.regions), s.length) return s.forEach((function(t) {\n          if (e.regions[t]) {\n            var s = e.regions[t].element.shape.getBBox();\n            s && (i = void 0 === i ? s : {\n              x: Math.min(i.x, s.x),\n              y: Math.min(i.y, s.y),\n              width: Math.max(i.x + i.width, s.x + s.width) - Math.min(i.x, s.x),\n              height: Math.max(i.y + i.height, s.y + s.height) - Math.min(i.y, s.y)\n            })\n          }\n        })), this.setScale(Math.min(this.width / i.width, this.height / i.height), -(i.x + i.width / 2), -(i.y + i.height / 2), !0, t.animate);\n        if (t.coords) {\n          var a = this.coordsToPoint(t.coords[0], t.coords[1]),\n            r = this.transX - a.x / this.scale,\n            n = this.transY - a.y / this.scale;\n          return this.setScale(t.scale * this.baseScale, r, n, !0, t.animate)\n        }\n      },\n      resize: function() {\n        var t = this.baseScale;\n        this.width / this.height > this.defaultWidth / this.defaultHeight ? (this.baseScale = this.height / this.defaultHeight, this.baseTransX = Math.abs(this.width - this.defaultWidth * this.baseScale) / (2 * this.baseScale)) : (this.baseScale = this.width / this.defaultWidth, this.baseTransY = Math.abs(this.height - this.defaultHeight * this.baseScale) / (2 * this.baseScale)), this.scale *= this.baseScale / t, this.transX *= this.baseScale / t, this.transY *= this.baseScale / t\n      },\n      setScale: function(t, e, i, s, a) {\n        var r, n, o, h, l, c, u, p, d, f, m = this,\n          g = 0,\n          v = Math.abs(Math.round(60 * (t - this.scale) / Math.max(t, this.scale)));\n        t > this.params.zoomMax * this.baseScale ? t = this.params.zoomMax * this.baseScale : t < this.params.zoomMin * this.baseScale && (t = this.params.zoomMin * this.baseScale), void 0 !== e && void 0 !== i && (r = t / this.scale, s ? (d = e + this.defaultWidth * (this.width / (this.defaultWidth * t)) / 2, f = i + this.defaultHeight * (this.height / (this.defaultHeight * t)) / 2) : (d = this.transX - (r - 1) / t * e, f = this.transY - (r - 1) / t * i)), a && v > 0 ? (o = this.scale, h = (t - o) / v, l = this.transX * this.scale, u = this.transY * this.scale, c = (d * t - l) / v, p = (f * t - u) / v, n = setInterval((function() {\n          g += 1, m.scale = o + h * g, m.transX = (l + c * g) / m.scale, m.transY = (u + p * g) / m.scale, m.applyTransform(), g == v && (clearInterval(n), m.emit(\"viewport:changed\", [m.scale, m.transX, m.transY]))\n        }), 10)) : (this.transX = d, this.transY = f, this.scale = t, this.applyTransform(), this.emit(\"viewport:changed\", [this.scale, this.transX, this.transY]))\n      },\n      updateSize: function() {\n        this.width = this.container.width(), this.height = this.container.height(), this.resize(), this.canvas.setSize(this.width, this.height), this.applyTransform()\n      },\n      coordsToPoint: function(t, e) {\n        var i, s, a, r = z.maps[this.params.map].projection,\n          n = r.centralMeridian;\n        return i = Y[r.type](t, e, n), !!(s = this.getInsetForPoint(i.x, i.y)) && (a = s.bbox, i.x = (i.x - a[0].x) / (a[1].x - a[0].x) * s.width * this.scale, i.y = (i.y - a[0].y) / (a[1].y - a[0].y) * s.height * this.scale, {\n          x: i.x + this.transX * this.scale + s.left * this.scale,\n          y: i.y + this.transY * this.scale + s.top * this.scale\n        })\n      },\n      getInsetForPoint: function(t, e) {\n        var i, s, a = z.maps[this.params.map].insets;\n        for (i = 0; i < a.length; i++)\n          if (t > (s = a[i].bbox)[0].x && t < s[1].x && e > s[0].y && e < s[1].y) return a[i]\n      },\n      getMarkerPosition: function(t) {\n        var e = t.coords;\n        return z.maps[this.params.map].projection ? this.coordsToPoint.apply(this, e) : {\n          x: e[0] * this.scale + this.transX * this.scale,\n          y: e[1] * this.scale + this.transY * this.scale\n        }\n      },\n      repositionLines: function() {\n        var t = !1,\n          e = !1;\n        for (var i in this.lines) {\n          for (var s in this.markers) {\n            var a = this.markers[s];\n            a.config.name === this.lines[i].config.from && (t = this.getMarkerPosition(a.config)), a.config.name === this.lines[i].config.to && (e = this.getMarkerPosition(a.config))\n          }!1 !== t && !1 !== e && this.lines[i].element.setStyle({\n            x1: t.x,\n            y1: t.y,\n            x2: e.x,\n            y2: e.y\n          })\n        }\n      },\n      repositionMarkers: function() {\n        var t;\n        for (var e in this.markers) !1 !== (t = this.getMarkerPosition(this.markers[e].config)) && this.markers[e].element.setStyle({\n          cx: t.x,\n          cy: t.y\n        })\n      },\n      repositionLabels: function() {\n        var t = this.params.labels;\n        if (t) {\n          if (t.regions)\n            for (var e in this.regions) this.regions[e].element.updateLabelPosition();\n          if (t.markers)\n            for (var i in this.markers) this.markers[i].element.updateLabelPosition()\n        }\n      },\n      visualizeData: function(t) {\n        f.isObj(t) && (this.dataVisualization = new L(t, this))\n      }\n    }),\n    A = {\n      onViewportChange: \"viewport:changed\",\n      onRegionSelected: \"region:select\",\n      onMarkerSelected: \"marker:select\",\n      onRegionTooltipShow: \"region.tooltip:show\",\n      onMarkerTooltipShow: \"marker.tooltip:show\",\n      onLoaded: \"map:loaded\"\n    },\n    z = function() {\n      function t(e) {\n        if (void 0 === e && (e = {}), this.params = f.mergeDeeply(t.defaults, e), !t.maps[this.params.map]) throw new Error(\"Attempt to use map which was not loaded: \" + e.map);\n        this.mapData = t.maps[this.params.map], this.regions = {}, this.markers = {}, this.lines = {}, this.defaultWidth = this.mapData.width, this.defaultHeight = this.mapData.height, this.height = 0, this.width = 0, this.scale = 1, this.baseScale = 1, this.transX = 0, this.transY = 0, this.baseTransX = 0, this.baseTransY = 0, this.selector = e.selector, \"loading\" !== window.document.readyState ? this.init(e.selector) : window.addEventListener(\"DOMContentLoaded\", this.init.bind(this, e.selector))\n      }\n      var e = t.prototype;\n      return e.init = function(t) {\n        var e = this.params;\n        this.container = f.$(t).addClass(\"jvm-container\"), this.canvas = new w(this.container, this.width, this.height), this.setBackgroundColor(e.backgroundColor), this.handleContainerEvents(), this.createRegions(), this.updateSize(), this.createLines(e.lines || {}, e.markers || {}), this.createMarkers(e.markers), this.handleElementEvents(), this.repositionLabels(), e.showTooltip && this.createTooltip(), e.zoomButtons && this.handleZoomButtons(), e.selectedRegions && this.setSelected(\"regions\", e.selectedRegions), e.selectedMarkers && this.setSelected(\"markers\", e.selectedMarkers), e.focusOn && this.setFocus(e.focusOn), e.visualizeData && this.visualizeData(e.visualizeData), e.bindTouchEvents && (\"ontouchstart\" in window || window.DocumentTouch && document instanceof DocumentTouch) && this.bindContainerTouchEvents(), e.series && (this.container.append(this.legendHorizontal = f.createElement(\"div\", \"jvm-series-container jvm-series-h\")).append(this.legendVertical = f.createElement(\"div\", \"jvm-series-container jvm-series-v\")), this.createSeries()), this.emit(\"map:loaded\", [this])\n      }, e.emit = function(t, e) {\n        for (var i in A) A[i] === t && f.isFunc(this.params[i]) && this.params[i].apply(this, e)\n      }, e.setBackgroundColor = function(t) {\n        this.container.css({\n          backgroundColor: t\n        })\n      }, e.getSelected = function(t) {\n        var e, i = [];\n        for (e in this[t]) this[t][e].element.isSelected && i.push(e);\n        return i\n      }, e.clearSelected = function(t) {\n        var e = this;\n        this.getSelected(t).forEach((function(i) {\n          e[t][i].element.select(!1)\n        }))\n      }, e.setSelected = function(t, e) {\n        var i = this;\n        e.forEach((function(e) {\n          i[t][e] && i[t][e].element.select(!0)\n        }))\n      }, e.getSelectedRegions = function() {\n        return this.getSelected(\"regions\")\n      }, e.clearSelectedRegions = function() {\n        var t = this;\n        this.getSelected(\"regions\").forEach((function(e) {\n          t.regions[e].element.select(!1)\n        }))\n      }, e.getSelectedMarkers = function() {\n        return this.getSelected(\"markers\")\n      }, e.clearSelectedMarkers = function() {\n        var t = this;\n        this.getSelected(\"markers\").forEach((function(e) {\n          t.markers[e].element.select(!1)\n        }))\n      }, e.addMarker = function(t) {\n        console.warn(\"`addMarker` method is depreacted, please use `addMarkers` instead.\"), this.createMarkers([t], !0)\n      }, e.addMarkers = function(t) {\n        this.createMarkers(t, !0)\n      }, e.removeMarkers = function(t) {\n        var e = this;\n        t || (t = Object.keys(this.markers)), t.forEach((function(t) {\n          e.markers[t].element.remove(), delete e.markers[t]\n        }))\n      }, e.addLine = function(t, e, i) {\n        void 0 === i && (i = {}), this.createLines([{\n          from: t,\n          to: e,\n          style: i\n        }], this.markers, !0)\n      }, e.reset = function() {\n        for (var t in this.series)\n          for (var e = 0; e < this.series[t].length; e++) this.series[t][e].clear();\n        this.legendHorizontal && (f.removeElement(this.legendHorizontal), this.legendHorizontal = null), this.legendVertical && (f.removeElement(this.legendVertical), this.legendVertical = null), this.scale = this.baseScale, this.transX = this.baseTransX, this.transY = this.baseTransY, this.applyTransform(), this.clearSelectedMarkers(), this.clearSelectedRegions(), this.removeMarkers()\n      }, e.destroy = function(t) {\n        var e = this;\n        void 0 === t && (t = !0);\n        var i = a(),\n          r = this.tooltip.selector,\n          n = Object.keys;\n        f.removeElement(r), n(i).forEach((function(t) {\n          s(i[t].selector, t, i[t].handler)\n        })), t && n(this).forEach((function(t) {\n          try {\n            delete e[t]\n          } catch (t) {}\n        }))\n      }, e.extend = function(e, i) {\n        t.prototype[e] = i\n      }, e.getUtils = function() {\n        return f\n      }, t\n    }();\n  z.maps = {}, z.defaults = {\n    map: \"world\",\n    backgroundColor: \"tranparent\",\n    draggable: !0,\n    zoomButtons: !0,\n    zoomOnScroll: !0,\n    zoomOnScrollSpeed: 3,\n    zoomMax: 12,\n    zoomMin: 1,\n    zoomAnimate: !0,\n    showTooltip: !0,\n    zoomStep: 1.5,\n    bindTouchEvents: !0,\n    lineStyle: {\n      stroke: \"#808080\",\n      strokeWidth: 1,\n      strokeLinecap: \"round\"\n    },\n    markersSelectable: !1,\n    markersSelectableOne: !1,\n    markerStyle: {\n      initial: {\n        r: 7,\n        fill: \"#374151\",\n        fillOpacity: 1,\n        stroke: \"#FFF\",\n        strokeWidth: 5,\n        strokeOpacity: .5\n      },\n      hover: {\n        fill: \"#3cc0ff\",\n        cursor: \"pointer\"\n      },\n      selected: {\n        fill: \"blue\"\n      },\n      selectedHover: {}\n    },\n    markerLabelStyle: {\n      initial: {\n        fontFamily: \"Verdana\",\n        fontSize: 12,\n        fontWeight: 500,\n        cursor: \"default\",\n        fill: \"#374151\"\n      },\n      hover: {\n        cursor: \"pointer\"\n      },\n      selected: {},\n      selectedHover: {}\n    },\n    regionsSelectable: !1,\n    regionsSelectableOne: !1,\n    regionStyle: {\n      initial: {\n        fill: \"#dee2e8\",\n        fillOpacity: 1,\n        stroke: \"none\",\n        strokeWidth: 0\n      },\n      hover: {\n        fillOpacity: .7,\n        cursor: \"pointer\"\n      },\n      selected: {\n        fill: \"#9ca3af\"\n      },\n      selectedHover: {}\n    },\n    regionLabelStyle: {\n      initial: {\n        fontFamily: \"Verdana\",\n        fontSize: \"12\",\n        fontWeight: \"bold\",\n        cursor: \"default\",\n        fill: \"#35373e\"\n      },\n      hover: {\n        cursor: \"pointer\"\n      }\n    }\n  }, Object.assign(z.prototype, T);\n  var P = function() {\n    function t(t) {\n      if (void 0 === t && (t = {}), !t.selector) throw new Error(\"Selector is not given.\");\n      return new z(t)\n    }\n    return t.prototype.addMap = function(t, e) {\n      z.maps[t] = e\n    }, t\n  }();\n  return window.jsVectorMap = P\n}));\n\n\njsVectorMap.prototype.addMap(\"world\", {\n  insets: [{\n    width: 900,\n    top: 0,\n    left: 0,\n    height: 440.70631074413296,\n    bbox: [{\n      y: -12671671.123330014,\n      x: -20004297.151525836\n    }, {\n      y: 6930392.025135122,\n      x: 20026572.39474939\n    }]\n  }],\n  paths: {\n    BD: {\n      path: \"M651.84,230.21l-0.6,-2.0l-1.36,-1.71l-2.31,-0.11l-0.41,0.48l0.2,0.94l-0.53,0.99l-0.72,-0.36l-0.68,0.35l-1.2,-0.36l-0.37,-2.0l-0.81,-1.86l0.39,-1.46l-0.22,-0.47l-1.14,-0.53l0.29,-0.5l1.48,-0.94l0.03,-0.65l-1.55,-1.22l0.55,-1.14l1.61,0.94l1.04,0.15l0.18,1.54l0.34,0.35l5.64,0.63l-0.84,1.64l-1.22,0.34l-0.77,1.51l0.07,0.47l1.37,1.37l0.67,-0.19l0.42,-1.39l1.21,3.84l-0.03,1.21l-0.33,-0.15l-0.4,0.28Z\",\n      name: \"Bangladesh\"\n    },\n    BE: {\n      path: \"M429.29,144.05l1.91,0.24l2.1,-0.63l2.63,1.99l-0.21,1.66l-0.69,0.4l-0.18,1.2l-1.66,-1.13l-1.39,0.15l-2.73,-2.7l-1.17,-0.18l-0.16,-0.52l1.54,-0.5Z\",\n      name: \"Belgium\"\n    },\n    BF: {\n      path: \"M421.42,247.64l-0.11,0.95l0.34,1.16l1.4,1.71l0.07,1.1l0.32,0.37l2.55,0.51l-0.04,1.28l-0.38,0.53l-1.07,0.21l-0.72,1.18l-0.63,0.21l-3.22,-0.25l-0.94,0.39l-5.4,-0.05l-0.39,0.38l0.16,2.73l-1.23,-0.43l-1.17,0.1l-0.89,0.57l-2.27,-1.72l-0.13,-1.11l0.61,-0.96l0.02,-0.93l1.87,-1.98l0.44,-1.81l0.43,-0.39l1.28,0.26l1.05,-0.52l0.47,-0.73l1.84,-1.09l0.55,-0.83l2.2,-1.0l1.15,-0.3l0.72,0.45l1.13,-0.01Z\",\n      name: \"Burkina Faso\"\n    },\n    BG: {\n      path: \"M491.65,168.18l-0.86,0.88l-0.91,2.17l0.48,1.34l-1.6,-0.24l-2.55,0.95l-0.28,1.51l-1.8,0.22l-2.0,-1.0l-1.92,0.79l-1.42,-0.07l-0.15,-1.63l-1.05,-0.97l0.0,-0.8l1.2,-1.57l0.01,-0.56l-1.14,-1.23l-0.05,-0.94l0.88,0.97l0.88,-0.2l1.91,0.47l3.68,0.16l1.42,-0.81l2.72,-0.66l2.55,1.24Z\",\n      name: \"Bulgaria\"\n    },\n    BA: {\n      path: \"M463.49,163.65l2.1,0.5l1.72,-0.03l1.52,0.68l-0.36,0.78l0.08,0.45l1.04,1.02l-0.25,0.98l-1.81,1.15l-0.38,1.38l-1.67,-0.87l-0.89,-1.2l-2.11,-1.83l-1.63,-2.22l0.23,-0.57l0.48,0.38l0.55,-0.06l0.43,-0.51l0.94,-0.06Z\",\n      name: \"Bosnia and Herz.\"\n    },\n    BN: {\n      path: \"M707.48,273.58l0.68,-0.65l1.41,-0.91l-0.15,1.63l-0.81,-0.05l-0.61,0.58l-0.53,-0.6Z\",\n      name: \"Brunei\"\n    },\n    BO: {\n      path: \"M263.83,340.69l-3.09,-0.23l-0.38,0.23l-0.7,1.52l-1.31,-1.53l-3.28,-0.64l-2.37,2.4l-1.31,0.26l-0.88,-3.26l-1.3,-2.86l0.74,-2.37l-0.13,-0.43l-1.2,-1.01l-0.37,-1.89l-1.08,-1.55l1.45,-2.56l-0.96,-2.33l0.47,-1.06l-0.34,-0.73l0.91,-1.32l0.16,-3.84l0.5,-1.18l-1.81,-3.41l2.46,0.07l0.8,-0.85l3.4,-1.91l2.66,-0.35l-0.19,1.38l0.3,1.07l-0.05,1.97l2.72,2.27l2.88,0.49l0.89,0.86l1.79,0.58l0.98,0.7l1.71,0.05l1.17,0.61l0.6,2.7l-0.7,0.54l0.96,2.99l0.37,0.28l4.3,0.1l-0.25,1.2l0.27,1.02l1.43,0.9l0.5,1.35l-0.41,1.86l-0.65,1.08l0.12,1.35l-2.69,-1.65l-2.4,-0.03l-4.36,0.76l-1.49,2.5l-0.11,1.52l-0.75,2.37Z\",\n      name: \"Bolivia\"\n    },\n    JP: {\n      path: \"M781.12,166.87l1.81,0.68l1.62,-0.97l0.39,2.42l-3.35,0.75l-2.23,2.88l-3.63,-1.9l-0.56,0.2l-1.26,3.05l-2.16,0.03l-0.29,-2.51l1.08,-2.03l2.45,-0.16l0.37,-0.33l1.25,-5.94l2.47,2.71l2.03,1.12ZM773.56,187.34l-0.91,2.22l0.37,1.52l-1.14,1.75l-3.02,1.26l-4.58,0.27l-3.34,3.01l-1.25,-0.8l-0.09,-1.9l-0.46,-0.38l-4.35,0.62l-3.0,1.32l-2.85,0.05l-0.37,0.27l0.13,0.44l2.32,1.89l-1.54,4.34l-1.26,0.9l-0.79,-0.7l0.56,-2.27l-0.21,-0.45l-1.47,-0.75l-0.74,-1.4l2.12,-0.84l1.26,-1.7l2.45,-1.42l1.83,-1.91l4.78,-0.81l2.6,0.57l0.44,-0.21l2.39,-4.66l1.29,1.06l0.5,0.01l5.1,-4.02l1.69,-3.73l-0.38,-3.4l0.9,-1.61l2.14,-0.44l1.23,3.72l-0.07,2.18l-2.23,2.84l-0.04,3.16ZM757.78,196.26l0.19,0.56l-1.01,1.21l-1.16,-0.68l-1.28,0.65l-0.69,1.45l-1.02,-0.5l0.01,-0.93l1.14,-1.38l1.57,0.14l0.85,-0.98l1.4,0.46Z\",\n      name: \"Japan\"\n    },\n    BI: {\n      path: \"M495.45,295.49l-1.08,-2.99l1.14,-0.11l0.64,-1.19l0.76,0.09l0.65,1.83l-2.1,2.36Z\",\n      name: \"Burundi\"\n    },\n    BJ: {\n      path: \"M429.57,255.75l-0.05,0.8l0.5,1.34l-0.42,0.86l0.17,0.79l-1.81,2.12l-0.57,1.76l-0.08,5.42l-1.41,0.2l-0.48,-1.36l0.11,-5.71l-0.52,-0.7l-0.2,-1.35l-1.48,-1.48l0.21,-0.9l0.89,-0.43l0.42,-0.92l1.27,-0.36l1.22,-1.34l0.61,-0.0l1.62,1.24Z\",\n      name: \"Benin\"\n    },\n    BT: {\n      path: \"M650.32,213.86l0.84,0.71l-0.12,1.1l-3.76,-0.11l-1.57,0.4l-1.93,-0.87l1.48,-1.96l1.13,-0.57l1.63,0.57l1.33,0.08l0.99,0.65Z\",\n      name: \"Bhutan\"\n    },\n    JM: {\n      path: \"M228.38,239.28l-0.8,0.4l-2.26,-1.06l0.84,-0.23l2.14,0.3l1.17,0.56l-1.08,0.03Z\",\n      name: \"Jamaica\"\n    },\n    BW: {\n      path: \"M483.92,330.07l2.27,4.01l2.83,2.86l0.96,0.31l0.78,2.43l2.13,0.61l1.02,0.76l-3.0,1.64l-2.32,2.02l-1.54,2.69l-1.52,0.45l-0.64,1.94l-1.34,0.52l-1.85,-0.12l-1.21,-0.74l-1.35,-0.3l-1.22,0.62l-0.75,1.37l-2.31,1.9l-1.4,0.21l-0.35,-0.59l0.16,-1.75l-1.48,-2.54l-0.62,-0.43l-0.0,-7.1l2.08,-0.08l0.39,-0.4l0.07,-8.9l5.19,-0.93l0.8,0.89l0.51,0.07l1.5,-0.95l2.21,-0.49Z\",\n      name: \"Botswana\"\n    },\n    BR: {\n      path: \"M259.98,275.05l3.24,0.7l0.65,-0.53l4.55,-1.32l1.08,-1.06l-0.02,-0.63l0.55,-0.05l0.28,0.28l-0.26,0.87l0.22,0.48l0.73,0.32l0.4,0.81l-0.62,0.86l-0.4,2.13l0.82,2.56l1.69,1.43l1.43,0.2l3.17,-1.68l3.18,0.3l0.65,-0.75l-0.27,-0.92l1.9,-0.09l2.39,0.99l1.06,-0.61l0.84,0.78l1.2,-0.18l1.18,-1.06l0.84,-1.94l1.36,-2.11l0.37,-0.05l1.89,5.45l1.33,0.59l0.05,1.28l-1.77,1.94l0.02,0.56l1.02,0.87l4.07,0.36l0.08,2.16l0.66,0.29l1.74,-1.5l6.97,2.32l1.02,1.22l-0.35,1.18l0.49,0.5l2.81,-0.74l4.77,1.3l3.75,-0.08l3.57,2.0l3.29,2.86l1.93,0.72l2.12,0.12l0.71,0.62l1.21,4.51l-0.95,3.98l-4.72,5.06l-1.64,2.92l-1.72,2.05l-0.8,0.3l-0.72,2.03l0.18,4.75l-0.94,5.53l-0.81,1.13l-0.43,3.36l-2.55,3.5l-0.4,2.51l-1.86,1.04l-0.67,1.53l-2.54,0.01l-3.94,1.01l-1.83,1.2l-2.87,0.82l-3.03,2.19l-2.2,2.83l-0.36,2.0l0.4,1.58l-0.44,2.6l-0.51,1.2l-1.77,1.54l-2.75,4.78l-3.83,3.42l-1.24,2.74l-1.18,1.15l-0.36,-0.83l0.95,-1.14l0.01,-0.5l-1.52,-1.97l-4.56,-3.32l-1.03,-0.0l-2.38,-2.02l-0.81,-0.0l5.34,-5.45l3.77,-2.58l0.22,-2.46l-1.35,-1.81l-0.91,0.07l0.58,-2.33l0.01,-1.54l-1.11,-0.83l-1.75,0.3l-0.44,-3.11l-0.52,-0.95l-1.88,-0.88l-1.24,0.47l-2.17,-0.41l0.15,-3.21l-0.62,-1.34l0.66,-0.73l-0.22,-1.34l0.66,-1.13l0.44,-2.04l-0.61,-1.83l-1.4,-0.86l-0.2,-0.75l0.34,-1.39l-0.38,-0.5l-4.52,-0.1l-0.72,-2.22l0.59,-0.42l-0.03,-1.1l-0.5,-0.87l-0.32,-1.7l-1.45,-0.76l-1.63,-0.02l-1.05,-0.72l-1.6,-0.48l-1.13,-0.99l-2.69,-0.4l-2.47,-2.06l0.13,-4.35l-0.45,-0.45l-3.46,0.5l-3.44,1.94l-0.6,0.74l-2.9,-0.17l-1.47,0.42l-0.72,-0.18l0.15,-3.52l-0.63,-0.34l-1.94,1.41l-1.87,-0.06l-0.83,-1.18l-1.37,-0.26l0.21,-1.01l-1.35,-1.49l-0.88,-1.91l0.56,-0.6l-0.0,-0.81l1.29,-0.62l0.22,-0.43l-0.22,-1.19l0.61,-0.91l0.15,-0.99l2.65,-1.58l1.99,-0.47l0.42,-0.36l2.06,0.11l0.42,-0.33l1.19,-8.0l-0.41,-1.56l-1.1,-1.0l0.01,-1.33l1.91,-0.42l0.08,-0.96l-0.33,-0.43l-1.14,-0.2l-0.02,-0.83l4.47,0.05l0.82,-0.67l0.82,1.81l0.8,0.07l1.15,1.1l2.26,-0.05l0.71,-0.83l2.78,-0.96l0.48,-1.13l1.6,-0.64l0.24,-0.47l-0.48,-0.82l-1.83,-0.19l-0.36,-3.22Z\",\n      name: \"Brazil\"\n    },\n    BS: {\n      path: \"M226.4,223.87l-0.48,-1.15l-0.84,-0.75l0.36,-1.11l0.95,1.95l0.01,1.06ZM225.56,216.43l-1.87,0.29l-0.04,-0.22l0.74,-0.14l1.17,0.06Z\",\n      name: \"Bahamas\"\n    },\n    BY: {\n      path: \"M493.84,128.32l0.29,0.7l0.49,0.23l1.19,-0.38l2.09,0.72l0.19,1.26l-0.45,1.24l1.57,2.26l0.89,0.59l0.17,0.81l1.58,0.56l0.4,0.5l-0.53,0.41l-1.87,-0.11l-0.73,0.38l-0.13,0.52l1.04,2.74l-1.91,0.26l-0.89,0.99l-0.11,1.18l-2.73,-0.04l-0.53,-0.62l-0.52,-0.08l-0.75,0.46l-0.91,-0.42l-1.92,-0.07l-2.75,-0.79l-2.6,-0.28l-2.0,0.07l-1.5,0.92l-0.67,0.07l-0.08,-1.22l-0.59,-1.19l1.36,-0.88l0.01,-1.35l-0.7,-1.41l-0.07,-1.0l2.16,-0.02l2.72,-1.3l0.75,-2.04l1.91,-1.04l0.2,-0.41l-0.19,-1.25l3.8,-1.78l2.3,0.77Z\",\n      name: \"Belarus\"\n    },\n    BZ: {\n      path: \"M198.03,244.38l0.1,-4.49l0.69,-0.06l0.74,-1.3l0.34,0.28l-0.4,1.3l0.17,0.58l-0.34,2.25l-1.3,1.42Z\",\n      name: \"Belize\"\n    },\n    RU: {\n      path: \"M491.55,115.25l2.55,-1.85l-0.01,-0.65l-2.2,-1.5l7.32,-6.76l1.03,-2.11l-0.13,-0.49l-3.46,-2.52l0.86,-2.7l-2.11,-2.81l1.56,-3.67l-2.77,-4.52l2.15,-2.99l-0.08,-0.55l-3.65,-2.73l0.3,-2.54l1.81,-0.37l4.26,-1.77l2.42,-1.45l4.06,2.61l6.79,1.04l9.34,4.85l1.78,1.88l0.14,2.46l-2.55,2.02l-3.9,1.06l-11.07,-3.14l-2.06,0.53l-0.13,0.7l3.94,2.94l0.31,5.86l0.26,0.36l5.14,2.24l0.58,-0.29l0.32,-1.94l-1.35,-1.78l1.13,-1.09l6.13,2.42l2.11,-0.98l0.18,-0.56l-1.51,-2.67l5.41,-3.76l2.07,0.22l2.26,1.41l0.57,-0.16l1.46,-2.87l-0.05,-0.44l-1.92,-2.32l1.12,-2.32l-1.32,-2.27l5.87,1.16l1.04,1.75l-2.59,0.43l-0.33,0.4l0.02,2.36l2.46,1.83l3.87,-0.91l0.86,-2.8l13.69,-5.65l0.99,0.11l-1.92,2.06l0.23,0.67l3.11,0.45l2.0,-1.48l4.56,-0.12l3.64,-1.73l2.65,2.44l0.56,-0.01l2.85,-2.88l-0.01,-0.57l-2.35,-2.29l0.9,-1.01l7.14,1.3l3.41,1.36l9.05,4.97l0.51,-0.11l1.67,-2.27l-0.05,-0.53l-2.43,-2.21l-0.06,-0.78l-0.34,-0.36l-2.52,-0.36l0.64,-1.93l-1.32,-3.46l-0.06,-1.21l4.48,-4.06l1.69,-4.29l1.6,-0.81l6.23,1.18l0.44,2.21l-2.29,3.64l0.06,0.5l1.47,1.39l0.76,3.0l-0.56,6.03l2.69,2.82l-0.96,2.57l-4.86,5.95l0.23,0.64l2.86,0.61l0.42,-0.17l0.93,-1.4l2.64,-1.03l0.87,-2.24l2.09,-1.96l0.07,-0.5l-1.36,-2.28l1.09,-2.69l-0.32,-0.55l-2.47,-0.33l-0.5,-2.06l1.94,-4.38l-0.06,-0.42l-2.96,-3.4l4.12,-2.88l0.16,-0.4l-0.51,-2.93l0.54,-0.05l1.13,2.25l-0.96,4.35l0.27,0.47l2.68,0.84l0.5,-0.51l-1.02,-2.99l3.79,-1.66l5.01,-0.24l4.53,2.61l0.48,-0.06l0.07,-0.48l-2.18,-3.82l-0.23,-4.67l3.98,-0.9l5.97,0.21l5.49,-0.64l0.27,-0.65l-1.83,-2.31l2.56,-2.9l2.87,-0.17l4.8,-2.47l6.54,-0.67l1.03,-1.42l6.25,-0.45l2.32,1.11l5.53,-2.7l4.5,0.08l0.39,-0.28l0.66,-2.15l2.26,-2.12l5.69,-2.11l3.21,1.29l-2.46,0.94l-0.25,0.42l0.34,0.35l5.41,0.77l0.61,2.33l0.58,0.25l2.2,-1.22l7.13,0.07l5.51,2.47l1.79,1.72l-0.53,2.24l-9.16,4.15l-1.97,1.52l0.16,0.71l6.77,1.91l2.16,-0.78l1.13,2.74l0.67,0.11l1.01,-1.15l3.81,-0.73l7.7,0.77l0.54,1.99l0.36,0.29l10.47,0.71l0.43,-0.38l0.13,-3.23l4.87,0.78l3.95,-0.02l3.83,2.4l1.03,2.71l-1.35,1.79l0.02,0.5l3.15,3.64l4.07,1.96l0.53,-0.18l2.23,-4.47l3.95,1.93l4.16,-1.21l4.73,1.39l2.05,-1.26l3.94,0.62l0.43,-0.55l-1.68,-4.02l2.89,-1.8l22.31,3.03l2.16,2.75l6.55,3.51l10.29,-0.81l4.82,0.73l1.85,1.66l-0.29,3.08l0.25,0.41l3.08,1.26l3.56,-0.88l4.35,-0.11l4.8,0.87l4.57,-0.47l4.23,3.79l0.43,0.07l3.1,-1.4l0.16,-0.6l-1.88,-2.62l0.85,-1.52l7.71,1.21l5.22,-0.26l7.09,2.09l9.59,5.22l6.35,4.11l-0.2,2.38l1.88,1.41l0.6,-0.42l-0.48,-2.53l6.15,0.57l4.4,3.51l-1.97,1.43l-4.0,0.41l-0.36,0.39l-0.06,3.79l-0.74,0.62l-2.07,-0.11l-1.91,-1.39l-3.14,-1.11l-0.78,-1.85l-2.72,-0.68l-2.63,0.49l-1.04,-1.1l0.46,-1.31l-0.5,-0.51l-3.0,0.98l-0.22,0.58l0.99,1.7l-1.21,1.48l-3.04,1.68l-3.12,-0.28l-0.4,0.23l0.09,0.46l2.2,2.09l1.46,3.2l1.15,1.1l0.24,1.33l-0.42,0.67l-4.63,-0.77l-6.96,2.9l-2.19,0.44l-7.6,5.06l-0.84,1.45l-3.61,-2.37l-6.24,2.82l-0.94,-1.15l-0.53,-0.08l-2.28,1.52l-3.2,-0.49l-0.44,0.27l-0.78,2.37l-3.05,3.78l0.09,1.47l0.29,0.36l2.54,0.72l-0.29,4.53l-1.97,0.11l-0.35,0.26l-1.07,2.94l0.8,1.45l-3.91,1.58l-1.05,3.95l-3.48,0.77l-0.3,0.3l-0.72,3.29l-3.09,2.65l-0.7,-1.74l-2.44,-12.44l1.16,-4.71l2.04,-2.06l0.22,-1.64l3.8,-0.86l4.46,-4.61l4.28,-3.81l4.48,-3.01l2.17,-5.63l-0.42,-0.54l-3.04,0.33l-1.77,3.31l-5.86,3.86l-1.86,-4.25l-0.45,-0.23l-6.46,1.3l-6.47,6.44l-0.01,0.55l1.58,1.74l-8.24,1.17l0.15,-2.2l-0.34,-0.42l-3.89,-0.56l-3.25,1.81l-7.62,-0.62l-8.45,1.19l-17.71,15.41l0.22,0.7l3.74,0.41l1.36,2.17l2.43,0.76l1.88,-1.68l2.4,0.2l3.4,3.54l0.08,2.6l-1.95,3.42l-0.21,3.9l-1.1,5.06l-3.71,4.54l-0.87,2.21l-8.29,8.89l-3.19,1.7l-1.32,0.03l-1.45,-1.36l-0.49,-0.04l-2.27,1.5l0.41,-3.65l-0.59,-2.47l1.75,-0.89l2.91,0.53l0.42,-0.2l1.68,-3.03l0.87,-3.46l0.97,-1.18l1.32,-2.88l-0.45,-0.56l-4.14,0.95l-2.19,1.25l-3.41,-0.0l-1.06,-2.93l-2.97,-2.3l-4.28,-1.06l-1.75,-5.07l-2.66,-5.01l-2.29,-1.29l-3.75,-1.01l-3.44,0.08l-3.18,0.62l-2.24,1.77l0.05,0.66l1.18,0.69l0.02,1.43l-1.33,1.05l-2.26,3.51l-0.04,1.43l-3.16,1.84l-2.82,-1.16l-3.01,0.23l-1.35,-1.07l-1.5,-0.35l-3.9,2.31l-3.22,0.52l-2.27,0.79l-3.05,-0.51l-2.21,0.03l-1.48,-1.6l-2.6,-1.63l-2.63,-0.43l-5.46,1.01l-3.23,-1.25l-0.72,-2.57l-5.2,-1.24l-2.75,-1.36l-0.5,0.12l-2.59,3.45l0.84,2.1l-2.06,1.93l-3.41,-0.77l-2.42,-0.12l-1.83,-1.54l-2.53,-0.05l-2.42,-0.98l-3.86,1.57l-4.72,2.78l-3.3,0.75l-1.55,-1.92l-3.0,0.41l-1.11,-1.33l-1.62,-0.59l-1.31,-1.94l-1.38,-0.6l-3.7,0.79l-3.31,-1.83l-0.51,0.11l-0.99,1.29l-5.29,-8.05l-2.96,-2.48l0.65,-0.77l0.01,-0.51l-0.5,-0.11l-6.2,3.21l-1.84,0.15l0.15,-1.39l-0.26,-0.42l-3.22,-1.17l-2.46,0.7l-0.69,-3.16l-0.32,-0.31l-4.5,-0.75l-2.47,1.47l-6.19,1.27l-1.29,0.86l-9.51,1.3l-1.15,1.17l-0.03,0.53l1.47,1.9l-1.89,0.69l-0.22,0.56l0.31,0.6l-2.11,1.44l0.03,0.68l3.75,2.12l-0.39,0.98l-3.23,-0.13l-0.86,0.86l-3.09,-1.59l-3.97,0.07l-2.66,1.35l-8.32,-3.56l-4.07,0.06l-5.39,3.68l-0.39,2.0l-2.03,-1.5l-0.59,0.13l-2.0,3.59l0.57,0.93l-1.28,2.16l0.06,0.48l2.13,2.17l1.95,0.04l1.37,1.82l-0.23,1.46l0.25,0.43l0.83,0.33l-0.8,1.31l-2.49,0.62l-2.49,3.2l0.0,0.49l2.17,2.78l-0.15,2.18l2.5,3.24l-1.58,1.59l-0.7,-0.13l-1.63,-1.72l-2.29,-0.84l-0.94,-1.31l-2.34,-0.63l-1.48,0.4l-0.43,-0.47l-3.51,-1.48l-5.76,-1.01l-0.45,0.19l-2.89,-2.34l-2.9,-1.2l-1.53,-1.29l1.29,-0.43l2.08,-2.61l-0.05,-0.55l-0.89,-0.79l3.05,-1.06l0.27,-0.42l-0.07,-0.69l-0.49,-0.35l-1.73,0.39l0.04,-0.68l1.04,-0.72l2.66,-0.48l0.4,-1.32l-0.5,-1.6l0.92,-1.54l0.03,-1.17l-0.29,-0.37l-3.69,-1.06l-1.41,0.02l-1.42,-1.41l-2.19,0.38l-2.77,-1.01l-0.03,-0.59l-0.89,-1.43l-2.0,-0.32l-0.11,-0.54l0.49,-0.53l0.01,-0.53l-1.6,-1.9l-3.58,0.02l-0.88,0.73l-0.46,-0.07l-1.0,-2.79l2.22,-0.02l0.97,-0.74l0.07,-0.57l-0.9,-1.04l-1.35,-0.48l-0.11,-0.7l-0.95,-0.58l-1.38,-1.99l0.46,-0.98l-0.51,-1.96l-2.45,-0.84l-1.21,0.3l-0.46,-0.76l-2.46,-0.83l-0.72,-1.87l-0.21,-1.69l-0.99,-0.85l0.85,-1.17l-0.7,-3.21l1.66,-1.97l-0.16,-0.79ZM749.2,170.72l-0.6,0.4l-0.13,0.16l-0.01,-0.51l0.74,-0.05ZM874.85,67.94l-5.63,0.48l-0.26,-0.84l3.15,-1.89l1.94,0.01l3.19,1.16l-2.39,1.09ZM797.39,48.49l-2.0,1.36l-3.8,-0.42l-4.25,-1.8l0.35,-0.97l9.69,1.83ZM783.67,46.12l-1.63,3.09l-8.98,-0.13l-4.09,1.14l-4.54,-2.97l1.16,-3.01l3.05,-0.89l6.5,0.22l8.54,2.56ZM778.2,134.98l-0.56,-0.9l0.27,-0.12l0.29,1.01ZM778.34,135.48l0.94,3.53l-0.05,3.38l1.05,3.39l2.18,5.0l-2.89,-0.83l-0.49,0.26l-1.54,4.65l2.42,3.5l-0.04,1.13l-1.24,-1.24l-0.61,0.06l-1.09,1.61l-0.28,-1.61l0.27,-3.1l-0.28,-3.4l0.58,-2.47l0.11,-4.39l-1.46,-3.36l0.21,-4.32l2.15,-1.46l0.07,-0.34ZM771.95,56.61l1.76,-1.42l2.89,-0.42l3.28,1.71l0.14,0.6l-3.27,0.03l-4.81,-0.5ZM683.76,31.09l-13.01,1.93l4.03,-6.35l1.82,-0.56l1.73,0.34l5.99,2.98l-0.56,1.66ZM670.85,27.93l-5.08,0.64l-6.86,-1.57l-3.99,-2.05l-2.1,-4.16l-2.6,-0.87l5.72,-3.5l5.2,-1.28l4.69,2.85l5.59,5.4l-0.56,4.53ZM564.15,68.94l-0.64,0.17l-7.85,-0.57l-0.86,-2.04l-4.28,-1.17l-0.28,-1.94l2.27,-0.89l0.25,-0.39l-0.08,-2.38l4.81,-3.97l-0.15,-0.7l-1.47,-0.38l5.3,-3.81l0.15,-0.44l-0.58,-1.94l5.28,-2.51l8.21,-3.27l8.28,-0.96l4.35,-1.94l4.6,-0.64l1.36,1.61l-1.34,1.28l-16.43,4.94l-7.97,4.88l-7.74,9.63l0.66,4.14l4.16,3.27ZM548.81,18.48l-5.5,1.18l-0.58,1.02l-2.59,0.84l-2.13,-1.07l1.12,-1.42l-0.3,-0.65l-2.33,-0.07l1.68,-0.36l3.47,-0.06l0.42,1.29l0.66,0.16l1.38,-1.34l2.15,-0.88l2.94,1.01l-0.39,0.36ZM477.37,133.15l-4.08,0.05l-2.56,-0.32l0.33,-0.87l3.17,-1.03l3.24,0.96l-0.09,1.23Z\",\n      name: \"Russia\"\n    },\n    RW: {\n      path: \"M497.0,288.25l0.71,1.01l-0.11,1.09l-1.63,0.03l-1.04,1.39l-0.83,-0.11l0.51,-1.2l0.08,-1.34l0.42,-0.41l0.7,0.14l1.19,-0.61Z\",\n      name: \"Rwanda\"\n    },\n    RS: {\n      path: \"M469.4,163.99l0.42,-0.5l-0.01,-0.52l-1.15,-1.63l1.43,-0.62l1.33,0.12l1.17,1.06l0.46,1.13l1.34,0.64l0.35,1.35l1.46,0.9l0.76,-0.29l0.2,0.69l-0.48,0.78l0.22,1.12l1.05,1.22l-0.77,0.8l-0.37,1.52l-1.21,0.08l0.24,-0.64l-0.39,-0.54l-2.08,-1.64l-0.9,0.05l-0.48,0.94l-2.12,-1.37l0.53,-1.6l-1.11,-1.37l0.51,-1.1l-0.41,-0.57Z\",\n      name: \"Serbia\"\n    },\n    LT: {\n      path: \"M486.93,129.3l0.17,1.12l-1.81,0.98l-0.72,2.02l-2.47,1.18l-2.1,-0.02l-0.73,-1.05l-1.06,-0.3l-0.09,-1.87l-3.56,-1.13l-0.43,-2.36l2.48,-0.94l4.12,0.22l2.25,-0.31l0.52,0.69l1.24,0.21l2.19,1.56Z\",\n      name: \"Lithuania\"\n    },\n    LU: {\n      path: \"M436.08,149.45l-0.48,-0.07l0.3,-1.28l0.27,0.4l-0.09,0.96Z\",\n      name: \"Luxembourg\"\n    },\n    LR: {\n      path: \"M399.36,265.97l0.18,1.54l-0.48,0.99l0.08,0.47l2.47,1.8l-0.33,2.8l-2.65,-1.13l-5.78,-4.61l0.58,-1.32l2.1,-2.33l0.86,-0.22l0.77,1.14l-0.14,0.85l0.59,0.87l1.0,0.14l0.76,-0.99Z\",\n      name: \"Liberia\"\n    },\n    RO: {\n      path: \"M487.53,154.23l0.6,0.24l2.87,3.98l-0.17,2.69l0.45,1.42l1.32,0.81l1.35,-0.42l0.76,0.36l0.02,0.31l-0.83,0.45l-0.59,-0.22l-0.54,0.3l-0.62,3.3l-1.0,-0.22l-2.07,-1.13l-2.95,0.71l-1.25,0.76l-3.51,-0.15l-1.89,-0.47l-0.87,0.16l-0.82,-1.3l0.29,-0.26l-0.06,-0.64l-1.09,-0.34l-0.56,0.5l-1.05,-0.64l-0.39,-1.39l-1.36,-0.65l-0.35,-1.0l-0.83,-0.75l1.54,-0.54l2.66,-4.21l2.4,-1.24l2.96,0.34l1.48,0.73l0.79,-0.45l1.78,-0.3l0.75,-0.74l0.79,0.0Z\",\n      name: \"Romania\"\n    },\n    GW: {\n      path: \"M386.23,253.6l-0.29,0.84l0.15,0.6l-2.21,0.59l-0.86,0.96l-1.04,-0.83l-1.09,-0.23l-0.54,-1.06l-0.66,-0.49l2.41,-0.48l4.13,0.1Z\",\n      name: \"Guinea-Bissau\"\n    },\n    GT: {\n      path: \"M195.08,249.77l-2.48,-0.37l-1.03,-0.45l-1.14,-0.89l0.3,-0.99l-0.24,-0.68l0.96,-1.66l2.98,-0.01l0.4,-0.37l-0.19,-1.28l-1.67,-1.4l0.51,-0.4l0.0,-1.05l3.85,0.02l-0.21,4.53l0.4,0.43l1.46,0.38l-1.48,0.98l-0.35,0.7l0.12,0.57l-2.2,1.96Z\",\n      name: \"Guatemala\"\n    },\n    GR: {\n      path: \"M487.07,174.59l-0.59,1.43l-0.37,0.21l-2.84,-0.35l-3.03,0.77l-0.18,0.68l1.28,1.23l-0.61,0.23l-1.14,0.0l-1.2,-1.39l-0.63,0.03l-0.53,1.01l0.56,1.76l1.03,1.19l-0.56,0.38l-0.05,0.62l2.52,2.12l0.02,0.87l-1.78,-0.59l-0.48,0.56l0.5,1.0l-1.07,0.2l-0.3,0.53l0.75,2.01l-0.98,0.02l-1.84,-1.12l-1.37,-4.2l-2.21,-2.95l-0.11,-0.56l1.04,-1.28l0.2,-0.95l0.85,-0.66l0.03,-0.46l1.32,-0.21l1.01,-0.64l1.22,0.05l0.65,-0.56l2.26,-0.0l1.82,-0.75l1.85,1.0l2.28,-0.28l0.35,-0.39l0.01,-0.77l0.34,0.22ZM480.49,192.16l0.58,0.4l-0.68,-0.12l0.11,-0.28ZM482.52,192.82l2.51,0.06l0.24,0.32l-1.99,0.13l-0.77,-0.51Z\",\n      name: \"Greece\"\n    },\n    GQ: {\n      path: \"M448.79,279.62l0.02,2.22l-4.09,0.0l0.69,-2.27l3.38,0.05Z\",\n      name: \"Eq. Guinea\"\n    },\n    GY: {\n      path: \"M277.42,270.07l-0.32,1.83l-1.32,0.57l-0.23,0.46l-0.28,2.0l1.11,1.82l0.83,0.19l0.32,1.25l1.13,1.62l-1.21,-0.19l-1.08,0.71l-1.77,0.5l-0.44,0.46l-0.86,-0.09l-1.32,-1.01l-0.77,-2.27l0.36,-1.9l0.68,-1.23l-0.57,-1.17l-0.74,-0.43l0.12,-1.16l-0.9,-0.69l-1.1,0.09l-1.31,-1.48l0.53,-0.72l-0.04,-0.84l1.99,-0.86l0.05,-0.59l-0.71,-0.78l0.14,-0.57l1.66,-1.24l1.36,0.77l1.41,1.49l0.06,1.15l0.37,0.38l0.8,0.05l2.06,1.86Z\",\n      name: \"Guyana\"\n    },\n    GE: {\n      path: \"M521.71,168.93l5.29,0.89l4.07,2.01l1.41,-0.44l2.07,0.56l0.68,1.1l1.07,0.55l-0.12,0.59l0.98,1.29l-1.01,-0.13l-1.81,-0.83l-0.94,0.47l-3.23,0.43l-2.29,-1.39l-2.33,0.05l0.21,-0.97l-0.76,-2.26l-1.45,-1.12l-1.43,-0.39l-0.41,-0.42Z\",\n      name: \"Georgia\"\n    },\n    GB: {\n      path: \"M412.61,118.72l-2.19,3.22l-0.0,0.45l5.13,-0.3l-0.53,2.37l-2.2,3.12l0.29,0.63l2.37,0.21l2.33,4.3l1.76,0.69l2.2,5.12l2.94,0.77l-0.23,1.62l-1.15,0.88l-0.1,0.52l0.82,1.42l-1.86,1.43l-3.3,-0.02l-4.12,0.87l-1.04,-0.58l-0.47,0.06l-1.51,1.41l-2.12,-0.34l-1.86,1.18l-0.6,-0.29l3.19,-3.0l2.16,-0.69l0.28,-0.41l-0.34,-0.36l-3.73,-0.53l-0.4,-0.76l2.2,-0.87l0.17,-0.61l-1.26,-1.67l0.36,-1.7l3.38,0.28l0.43,-0.33l0.37,-1.99l-1.79,-2.49l-3.11,-0.72l-0.38,-0.59l0.79,-1.35l-0.04,-0.46l-0.82,-0.97l-0.61,0.01l-0.68,0.84l-0.1,-2.34l-1.23,-1.88l0.85,-3.47l1.77,-2.68l1.85,0.26l2.17,-0.22ZM406.26,132.86l-1.01,1.77l-1.57,-0.59l-1.16,0.01l0.37,-1.54l-0.39,-1.39l1.45,-0.1l2.3,1.84Z\",\n      name: \"United Kingdom\"\n    },\n    GA: {\n      path: \"M453.24,279.52l-0.08,0.98l0.7,1.29l2.36,0.24l-0.98,2.63l1.18,1.79l0.25,1.78l-0.29,1.52l-0.6,0.93l-1.84,-0.09l-1.23,-1.11l-0.66,0.23l-0.15,0.84l-1.42,0.26l-1.02,0.7l-0.11,0.52l0.77,1.35l-1.34,0.97l-3.94,-4.3l-1.44,-2.45l0.06,-0.6l0.54,-0.81l1.05,-3.46l4.17,-0.07l0.4,-0.4l-0.02,-2.66l2.39,0.21l1.25,-0.27Z\",\n      name: \"Gabon\"\n    },\n    GN: {\n      path: \"M391.8,254.11l0.47,0.8l1.11,-0.32l0.98,0.7l1.07,0.2l2.26,-1.22l0.64,0.44l1.13,1.56l-0.48,1.4l0.8,0.3l-0.08,0.48l0.46,0.68l-0.35,1.36l1.05,2.61l-1.0,0.69l0.03,1.41l-0.72,-0.06l-1.08,1.0l-0.24,-0.27l0.07,-1.11l-1.05,-1.54l-1.79,0.21l-0.35,-2.01l-1.6,-2.18l-2.0,-0.0l-1.31,0.54l-1.95,2.18l-1.86,-2.19l-1.2,-0.78l-0.3,-1.11l-0.8,-0.85l0.65,-0.72l0.81,-0.03l1.64,-0.8l0.23,-1.87l2.67,0.64l0.89,-0.3l1.21,0.15Z\",\n      name: \"Guinea\"\n    },\n    GM: {\n      path: \"M379.31,251.39l0.1,-0.35l2.43,-0.07l0.74,-0.61l0.51,-0.03l0.77,0.49l-1.03,-0.3l-1.87,0.9l-1.65,-0.04ZM384.03,250.91l0.91,0.05l0.75,-0.24l-0.59,0.31l-1.08,-0.13Z\",\n      name: \"Gambia\"\n    },\n    GL: {\n      path: \"M353.02,1.2l14.69,4.67l-3.68,1.89l-22.97,0.86l-0.36,0.27l0.12,0.43l1.55,1.18l8.79,-0.66l7.48,2.07l4.86,-1.77l1.66,1.73l-2.53,3.19l-0.01,0.48l0.46,0.15l6.35,-2.2l12.06,-2.31l7.24,1.13l1.09,1.99l-9.79,4.01l-1.44,1.32l-7.87,0.98l-0.35,0.41l0.38,0.38l5.07,0.24l-2.53,3.58l-2.07,3.81l0.08,6.05l2.57,3.11l-3.22,0.2l-4.12,1.66l-0.05,0.72l4.45,2.65l0.51,3.75l-2.3,0.4l-0.25,0.64l2.79,3.69l-4.82,0.31l-0.36,0.29l0.16,0.44l2.62,1.8l-0.59,1.22l-3.3,0.7l-3.45,0.01l-0.29,0.68l3.03,3.12l0.02,1.34l-4.4,-1.73l-1.72,1.35l0.15,0.66l3.31,1.15l3.13,2.71l0.81,3.16l-3.85,0.75l-4.89,-4.26l-0.47,-0.03l-0.17,0.44l0.79,2.86l-2.71,2.21l-0.13,0.44l0.37,0.27l8.73,0.34l-12.32,6.64l-7.24,1.48l-2.94,0.08l-2.69,1.75l-3.43,4.41l-5.24,2.84l-1.73,0.18l-7.12,2.1l-2.15,2.52l-0.13,2.99l-1.19,2.45l-4.01,3.09l-0.14,0.44l0.97,2.9l-2.28,6.48l-3.1,0.2l-3.83,-3.07l-4.86,-0.02l-2.25,-1.93l-1.7,-3.79l-4.3,-4.84l-1.21,-2.49l-0.44,-3.8l-3.32,-3.63l0.84,-2.86l-1.56,-1.7l2.28,-4.6l3.83,-1.74l1.03,-1.96l0.52,-3.47l-0.59,-0.41l-4.17,2.21l-2.07,0.58l-2.72,-1.28l-0.15,-2.71l0.85,-2.09l2.01,-0.06l5.06,1.2l0.46,-0.23l-0.14,-0.49l-6.54,-4.47l-2.67,0.55l-1.58,-0.86l2.56,-4.01l-0.03,-0.48l-1.5,-1.74l-4.98,-8.5l-3.13,-1.96l0.03,-1.88l-0.24,-0.37l-6.85,-3.02l-5.36,-0.38l-12.7,0.58l-2.78,-1.57l-3.66,-2.77l5.73,-1.45l5.0,-0.28l0.38,-0.38l-0.35,-0.41l-10.67,-1.38l-5.3,-2.06l0.25,-1.54l18.41,-5.26l1.22,-2.27l-0.25,-0.55l-6.14,-1.86l1.68,-1.77l8.55,-4.03l3.59,-0.63l0.3,-0.54l-0.88,-2.27l5.47,-1.47l7.65,-0.95l7.55,-0.05l3.04,1.85l6.48,-3.27l5.81,2.22l3.56,0.5l5.16,1.94l0.5,-0.21l-0.17,-0.52l-5.71,-3.13l0.28,-2.13l8.12,-3.6l8.7,0.28l3.35,-2.34l8.71,-0.6l19.93,0.8Z\",\n      name: \"Greenland\"\n    },\n    KW: {\n      path: \"M540.81,207.91l0.37,0.86l-0.17,0.76l0.6,1.53l-0.95,0.04l-0.82,-1.28l-1.57,-0.18l1.31,-1.88l1.22,0.17Z\",\n      name: \"Kuwait\"\n    },\n    GH: {\n      path: \"M420.53,257.51l-0.01,0.72l0.96,1.2l0.24,3.73l0.59,0.95l-0.51,2.1l0.19,1.41l1.02,2.21l-6.97,2.84l-1.8,-0.57l0.04,-0.89l-1.02,-2.04l0.61,-2.65l1.07,-2.32l-0.96,-6.47l5.01,0.07l0.94,-0.39l0.61,0.11Z\",\n      name: \"Ghana\"\n    },\n    OM: {\n      path: \"M568.09,230.93l-0.91,1.67l-1.22,0.04l-0.6,0.76l-0.41,1.51l0.27,1.58l-1.16,0.05l-1.56,0.97l-0.76,1.74l-1.62,0.05l-0.98,0.65l-0.17,1.15l-0.89,0.52l-1.49,-0.18l-2.4,0.94l-2.47,-5.4l7.35,-2.71l1.67,-5.23l-1.12,-2.09l0.05,-0.83l0.67,-1.0l0.07,-1.05l0.9,-0.42l-0.05,-2.07l0.7,-0.01l1.0,1.62l1.51,1.08l3.3,0.84l1.73,2.29l0.81,0.37l-1.23,2.35l-0.99,0.79Z\",\n      name: \"Oman\"\n    },\n    _2: {\n      path: \"M531.15,258.94l1.51,0.12l5.13,-0.95l5.3,-1.48l-0.01,4.4l-2.67,3.39l-1.85,0.01l-8.04,-2.94l-2.55,-3.17l1.12,-1.71l2.04,2.34Z\",\n      name: \"Somaliland\"\n    },\n    _1: {\n      path: \"M472.77,172.64l-1.08,-1.29l0.96,-0.77l0.29,-0.83l1.98,1.64l-0.36,0.67l-1.79,0.58Z\",\n      name: \"Kosovo\"\n    },\n    _0: {\n      path: \"M504.91,192.87l0.34,0.01l0.27,-0.07l-0.29,0.26l-0.31,-0.2Z\",\n      name: \"N. Cyprus\"\n    },\n    JO: {\n      path: \"M518.64,201.38l-5.14,1.56l-0.19,0.65l2.16,2.39l-0.89,1.14l-1.71,0.34l-1.71,1.8l-2.34,-0.37l1.21,-4.32l0.56,-4.07l2.8,0.94l4.46,-2.71l0.79,2.66Z\",\n      name: \"Jordan\"\n    },\n    HR: {\n      path: \"M455.59,162.84l1.09,0.07l-0.82,0.94l-0.27,-1.01ZM456.96,162.92l0.62,-0.41l1.73,0.45l0.42,-0.4l-0.01,-0.59l0.86,-0.52l0.2,-1.05l1.63,-0.68l2.57,1.68l2.07,0.6l0.87,-0.31l1.05,1.57l-0.52,0.63l-1.05,-0.56l-1.68,0.04l-2.1,-0.5l-1.29,0.06l-0.57,0.49l-0.59,-0.47l-0.62,0.16l-0.46,1.7l1.79,2.42l2.79,2.75l-1.18,-0.87l-2.21,-0.87l-1.67,-1.78l0.13,-0.63l-1.05,-1.19l-0.32,-1.27l-1.42,-0.43Z\",\n      name: \"Croatia\"\n    },\n    HT: {\n      path: \"M237.05,238.38l-1.16,0.43l-0.91,-0.55l0.05,-0.2l2.02,0.31ZM237.53,238.43l1.06,0.12l-0.05,0.01l-1.01,-0.12ZM239.25,238.45l0.79,-0.51l0.06,-0.62l-1.02,-1.0l0.02,-0.82l-0.3,-0.4l-0.93,-0.32l3.16,0.45l0.02,1.84l-0.48,0.34l-0.08,0.58l0.54,0.72l-1.78,-0.26Z\",\n      name: \"Haiti\"\n    },\n    HU: {\n      path: \"M462.08,157.89l0.65,-1.59l-0.09,-0.44l0.64,-0.0l0.39,-0.34l0.1,-0.69l1.75,0.87l2.32,-0.37l0.43,-0.66l3.49,-0.78l0.69,-0.78l0.57,-0.14l2.57,0.93l0.67,-0.23l1.03,0.65l0.08,0.37l-1.42,0.71l-2.59,4.14l-1.8,0.53l-1.68,-0.1l-2.74,1.23l-1.85,-0.54l-2.54,-1.66l-0.66,-1.1Z\",\n      name: \"Hungary\"\n    },\n    HN: {\n      path: \"M199.6,249.52l-1.7,-1.21l0.06,-0.94l3.04,-2.14l2.37,0.28l1.27,-0.09l1.1,-0.52l1.3,0.28l1.14,-0.25l1.38,0.37l2.23,1.37l-2.36,0.93l-1.23,-0.39l-0.88,1.3l-1.28,0.99l-0.98,-0.22l-0.42,0.52l-0.96,0.05l-0.36,0.41l0.04,0.88l-0.52,0.6l-0.3,0.04l-0.3,-0.55l-0.66,-0.31l0.11,-0.67l-0.48,-0.65l-0.87,-0.26l-0.73,0.2Z\",\n      name: \"Honduras\"\n    },\n    PR: {\n      path: \"M256.17,238.73l-0.26,0.27l-2.83,0.05l-0.07,-0.55l1.95,-0.1l1.22,0.33Z\",\n      name: \"Puerto Rico\"\n    },\n    PS: {\n      path: \"M509.21,203.07l0.1,-0.06l-0.02,0.03l-0.09,0.03ZM509.36,202.91l-0.02,-0.63l-0.33,-0.16l0.31,-1.09l0.24,0.1l-0.2,1.78Z\",\n      name: \"Palestine\"\n    },\n    PT: {\n      path: \"M401.84,187.38l-0.64,0.47l-1.13,-0.35l-0.91,0.17l0.28,-1.78l-0.24,-1.78l-1.25,-0.56l-0.45,-0.84l0.17,-1.66l1.01,-1.18l0.69,-2.92l-0.04,-1.39l-0.59,-1.9l1.3,-0.85l0.84,1.35l3.1,-0.3l0.46,0.99l-1.05,0.94l-0.03,2.16l-0.41,0.57l-0.08,1.1l-0.79,0.18l-0.26,0.59l0.91,1.6l-0.63,1.75l0.76,1.09l-1.1,1.52l0.07,1.05Z\",\n      name: \"Portugal\"\n    },\n    PY: {\n      path: \"M274.9,336.12l0.74,1.52l-0.16,3.45l0.32,0.41l2.64,0.5l1.11,-0.47l1.4,0.59l0.36,0.6l0.53,3.42l1.27,0.4l0.98,-0.38l0.51,0.27l-0.0,1.18l-1.21,5.32l-2.09,1.9l-1.8,0.4l-4.71,-0.98l2.2,-3.63l-0.32,-1.5l-2.78,-1.28l-3.03,-1.94l-2.07,-0.44l-4.34,-4.06l0.91,-2.9l0.08,-1.42l1.07,-2.04l4.13,-0.72l2.18,0.03l2.05,1.17l0.03,0.59Z\",\n      name: \"Paraguay\"\n    },\n    PA: {\n      path: \"M213.8,263.68l0.26,-1.52l-0.36,-0.26l-0.01,-0.49l0.44,-0.1l0.93,1.4l1.26,0.03l0.77,0.49l1.38,-0.23l2.51,-1.11l0.86,-0.72l3.45,0.85l1.4,1.18l0.41,1.74l-0.21,0.34l-0.53,-0.12l-0.47,0.29l-0.16,0.6l-0.68,-1.28l0.45,-0.49l-0.19,-0.66l-0.47,-0.13l-0.54,-0.84l-1.5,-0.75l-1.1,0.16l-0.75,0.99l-1.62,0.84l-0.18,0.96l0.85,0.97l-0.58,0.45l-0.69,0.08l-0.34,-1.18l-1.27,0.03l-0.71,-1.05l-2.59,-0.46Z\",\n      name: \"Panama\"\n    },\n    PG: {\n      path: \"M808.58,298.86l2.54,2.56l-0.13,0.26l-0.33,0.12l-0.87,-0.78l-1.22,-2.16ZM801.41,293.04l0.5,0.29l0.26,0.27l-0.49,-0.35l-0.27,-0.21ZM803.17,294.58l0.59,0.5l0.08,1.06l-0.29,-0.91l-0.38,-0.65ZM796.68,298.41l0.52,0.75l1.43,-0.19l2.27,-1.81l-0.01,-1.43l1.12,0.16l-0.04,1.1l-0.7,1.28l-1.12,0.18l-0.62,0.79l-2.46,1.11l-1.17,-0.0l-3.08,-1.25l3.41,0.0l0.45,-0.68ZM789.15,303.55l2.31,1.8l1.59,2.61l1.34,0.13l-0.06,0.66l0.31,0.43l1.06,0.24l0.06,0.65l2.25,1.05l-1.22,0.13l-0.72,-0.63l-4.56,-0.65l-3.22,-2.87l-1.49,-2.34l-3.27,-1.1l-2.38,0.72l-1.59,0.86l-0.2,0.42l0.27,1.55l-1.55,0.68l-1.36,-0.4l-2.21,-0.09l-0.08,-15.41l8.39,2.93l2.95,2.4l0.6,1.64l4.02,1.49l0.31,0.68l-1.76,0.21l-0.33,0.52l0.55,1.68Z\",\n      name: \"Papua New Guinea\"\n    },\n    PE: {\n      path: \"M244.96,295.21l-1.26,-0.07l-0.57,0.42l-1.93,0.45l-2.98,1.75l-0.36,1.36l-0.58,0.8l0.12,1.37l-1.24,0.59l-0.22,1.22l-0.62,0.84l1.04,2.27l1.28,1.44l-0.41,0.84l0.32,0.57l1.48,0.13l1.16,1.37l2.21,0.07l1.63,-1.08l-0.13,3.02l0.3,0.4l1.14,0.29l1.31,-0.34l1.9,3.59l-0.48,0.85l-0.17,3.85l-0.94,1.59l0.35,0.75l-0.47,1.07l0.98,1.97l-2.1,3.82l-0.98,0.5l-2.17,-1.28l-0.39,-1.16l-4.95,-2.58l-4.46,-2.79l-1.84,-1.51l-0.91,-1.84l0.3,-0.96l-2.11,-3.33l-4.82,-9.68l-1.04,-1.2l-0.87,-1.94l-3.4,-2.48l0.58,-1.18l-1.13,-2.23l0.66,-1.49l1.45,-1.15l-0.6,0.98l0.07,0.92l0.47,0.36l1.74,0.03l0.97,1.17l0.54,0.07l1.42,-1.03l0.6,-1.84l1.42,-2.02l3.04,-1.04l2.73,-2.62l0.86,-1.74l-0.1,-1.87l1.44,1.02l0.9,1.25l1.06,0.59l1.7,2.73l1.86,0.31l1.45,-0.61l0.96,0.39l1.36,-0.19l1.45,0.89l-1.4,2.21l0.31,0.61l0.59,0.05l0.47,0.5Z\",\n      name: \"Peru\"\n    },\n    PK: {\n      path: \"M615.09,192.34l-1.83,1.81l-2.6,0.39l-3.73,-0.68l-1.58,1.33l-0.09,0.42l1.77,4.39l1.7,1.23l-1.69,1.27l-0.12,2.14l-2.33,2.64l-1.6,2.8l-2.46,2.67l-3.03,-0.07l-2.76,2.83l0.05,0.6l1.5,1.11l0.26,1.9l1.44,1.5l0.37,1.68l-5.01,-0.01l-1.78,1.7l-1.42,-0.52l-0.76,-1.87l-2.27,-2.15l-11.61,0.86l0.71,-2.34l3.43,-1.32l0.25,-0.44l-0.21,-1.24l-1.2,-0.65l-0.28,-2.46l-2.29,-1.14l-1.28,-1.94l2.82,0.94l2.62,-0.38l1.42,0.33l0.76,-0.56l1.71,0.19l3.25,-1.14l0.27,-0.36l0.08,-2.19l1.18,-1.32l1.68,0.0l0.58,-0.82l1.6,-0.3l1.19,0.16l0.98,-0.78l0.02,-1.88l0.93,-1.47l1.48,-0.66l0.19,-0.55l-0.66,-1.25l2.04,-0.11l0.69,-1.01l-0.02,-1.16l1.11,-1.06l-0.17,-1.78l-0.49,-1.03l1.15,-0.98l5.42,-0.91l2.6,-0.82l1.6,1.16l0.97,2.34l3.45,0.97Z\",\n      name: \"Pakistan\"\n    },\n    PH: {\n      path: \"M737.01,263.84l0.39,2.97l-0.44,1.18l-0.55,-1.53l-0.67,-0.14l-1.17,1.28l0.65,2.09l-0.42,0.69l-2.48,-1.23l-0.57,-1.49l0.65,-1.03l-0.1,-0.54l-1.59,-1.19l-0.56,0.08l-0.65,0.87l-1.23,0.0l-1.58,0.97l0.83,-1.8l2.56,-1.42l0.65,0.84l0.45,0.13l1.9,-0.69l0.56,-1.11l1.5,-0.06l0.38,-0.43l-0.09,-1.19l1.21,0.71l0.36,2.02ZM733.59,256.58l0.05,0.75l0.08,0.26l-0.8,-0.42l-0.18,-0.71l0.85,0.12ZM734.08,256.1l-0.12,-1.12l-1.0,-1.27l1.36,0.03l0.53,0.73l0.51,2.04l-1.27,-0.4ZM733.76,257.68l0.38,0.98l-0.32,0.15l-0.07,-1.13ZM724.65,238.43l1.46,0.7l0.72,-0.31l-0.32,1.17l0.79,1.71l-0.57,1.84l-1.53,1.04l-0.39,2.25l0.56,2.04l1.63,0.57l1.16,-0.27l2.71,1.23l-0.19,1.08l0.76,0.84l-0.08,0.36l-1.4,-0.9l-0.88,-1.27l-0.66,0.0l-0.38,0.55l-1.6,-1.31l-2.15,0.36l-0.87,-0.39l0.07,-0.61l0.66,-0.55l-0.01,-0.62l-0.75,-0.59l-0.72,0.44l-0.74,-0.87l-0.39,-2.49l0.32,0.27l0.66,-0.28l0.26,-3.97l0.7,-2.02l1.14,0.0ZM731.03,258.87l-0.88,0.85l-1.19,1.94l-1.05,-1.19l0.93,-1.1l0.32,-1.47l0.52,-0.06l-0.27,1.15l0.22,0.45l0.49,-0.12l1.0,-1.32l-0.08,0.85ZM726.83,255.78l0.83,0.38l1.17,-0.0l-0.02,0.48l-2.0,1.4l0.03,-2.26ZM724.81,252.09l-0.38,1.27l-1.42,-1.95l1.2,0.05l0.6,0.63ZM716.55,261.82l1.1,-0.95l0.03,-0.03l-0.28,0.36l-0.85,0.61ZM719.22,259.06l0.04,-0.06l0.8,-1.53l0.16,0.75l-1.0,0.84Z\",\n      name: \"Philippines\"\n    },\n    PL: {\n      path: \"M468.44,149.42l-1.11,-1.54l-1.86,-0.33l-0.48,-1.05l-1.72,-0.37l-0.65,0.69l-0.72,-0.36l0.11,-0.61l-0.33,-0.46l-1.75,-0.27l-1.04,-0.93l-0.94,-1.94l0.16,-1.22l-0.62,-1.8l-0.78,-1.07l0.57,-1.04l-0.48,-1.43l1.41,-0.83l6.91,-2.71l2.14,0.5l0.52,0.91l5.51,0.44l4.55,-0.05l1.07,0.31l0.48,0.84l0.15,1.58l0.65,1.2l-0.01,0.99l-1.27,0.58l-0.19,0.54l0.73,1.48l0.08,1.55l1.2,2.76l-0.17,0.58l-1.23,0.44l-2.27,2.72l0.18,0.95l-1.97,-1.03l-1.98,0.4l-1.36,-0.28l-1.24,0.58l-1.07,-0.97l-1.16,0.24Z\",\n      name: \"Poland\"\n    },\n    ZM: {\n      path: \"M481.47,313.3l0.39,0.31l2.52,0.14l0.99,1.17l2.01,0.35l1.4,-0.64l0.69,1.17l1.78,0.33l1.84,2.35l2.23,0.18l0.4,-0.43l-0.21,-2.74l-0.62,-0.3l-0.48,0.32l-1.98,-1.17l0.72,-5.29l-0.51,-1.18l0.57,-1.3l3.68,-0.62l0.26,0.63l1.21,0.63l0.9,-0.22l2.16,0.67l1.33,0.71l1.07,1.02l0.56,1.87l-0.88,2.7l0.43,2.09l-0.73,0.87l-0.76,2.37l0.59,0.68l-6.6,1.83l-0.29,0.44l0.19,1.45l-1.68,0.35l-1.43,1.02l-0.38,0.87l-0.87,0.26l-3.48,3.69l-4.16,-0.53l-1.52,-1.0l-1.77,-0.13l-1.83,0.52l-3.04,-3.4l0.11,-7.59l4.82,0.03l0.39,-0.49l-0.18,-0.76l0.33,-0.83l-0.4,-1.36l0.24,-1.05Z\",\n      name: \"Zambia\"\n    },\n    EH: {\n      path: \"M384.42,230.28l0.25,-0.79l1.06,-1.29l0.8,-3.51l3.38,-2.78l0.7,-1.81l0.06,4.84l-1.98,0.2l-0.94,1.59l0.39,3.56l-3.7,-0.01ZM392.01,218.1l0.7,-1.8l1.77,-0.24l2.09,0.34l0.95,-0.62l1.28,-0.07l-0.0,2.51l-6.79,-0.12Z\",\n      name: \"W. Sahara\"\n    },\n    EE: {\n      path: \"M485.71,115.04l2.64,0.6l2.56,0.11l-1.6,1.91l0.61,3.54l-0.81,0.87l-1.78,-0.01l-3.22,-1.76l-1.8,0.45l0.21,-1.53l-0.58,-0.41l-0.69,0.34l-1.26,-1.03l-0.17,-1.63l2.83,-0.92l3.05,-0.52Z\",\n      name: \"Estonia\"\n    },\n    EG: {\n      path: \"M492.06,205.03l1.46,0.42l2.95,-1.64l2.04,-0.21l1.53,0.3l0.59,1.19l0.69,0.04l0.41,-0.64l1.81,0.58l1.95,0.16l1.04,-0.51l1.42,4.08l-2.03,4.54l-1.66,-1.77l-1.76,-3.85l-0.64,-0.12l-0.36,0.67l1.04,2.88l3.44,6.95l1.78,3.04l2.03,2.65l-0.36,0.53l0.23,2.01l2.7,2.19l-28.41,0.0l0.0,-18.96l-0.73,-2.2l0.59,-1.56l-0.32,-1.26l0.68,-0.99l3.06,-0.04l4.82,1.52Z\",\n      name: \"Egypt\"\n    },\n    ZA: {\n      path: \"M467.14,373.21l-0.13,-1.96l-0.68,-1.56l0.7,-0.68l-0.13,-2.33l-4.56,-8.19l0.77,-0.86l0.6,0.45l0.69,1.31l2.83,0.72l1.5,-0.26l2.24,-1.39l0.19,-9.55l1.35,2.3l-0.21,1.5l0.61,1.2l0.4,0.19l1.79,-0.27l2.6,-2.07l0.69,-1.32l0.96,-0.48l2.19,1.04l2.04,0.13l1.77,-0.65l0.85,-2.12l1.38,-0.33l1.59,-2.76l2.15,-1.89l3.41,-1.87l2.0,0.45l1.02,-0.28l0.99,0.2l1.75,5.29l-0.38,3.25l-0.81,-0.23l-1.0,0.46l-0.87,1.68l-0.05,1.16l1.97,1.84l1.47,-0.29l0.69,-1.18l1.09,0.01l-0.76,3.69l-0.58,1.09l-2.2,1.79l-3.17,4.76l-2.8,2.83l-3.57,2.88l-2.53,1.05l-1.22,0.14l-0.51,0.7l-1.18,-0.32l-1.39,0.5l-2.59,-0.52l-1.61,0.33l-1.18,-0.11l-2.55,1.1l-2.1,0.44l-1.6,1.07l-0.85,0.05l-0.93,-0.89l-0.93,-0.15l-0.97,-1.13l-0.25,0.05ZM491.45,364.19l0.62,-0.93l1.48,-0.59l1.18,-2.19l-0.07,-0.49l-1.99,-1.69l-1.66,0.56l-1.43,1.14l-1.34,1.73l0.02,0.51l1.88,2.11l1.31,-0.16Z\",\n      name: \"South Africa\"\n    },\n    EC: {\n      path: \"M231.86,285.53l0.29,1.59l-0.69,1.45l-2.61,2.51l-3.13,1.11l-1.53,2.18l-0.49,1.68l-1.0,0.73l-1.02,-1.11l-1.78,-0.16l0.67,-1.15l-0.24,-0.86l1.25,-2.13l-0.54,-1.09l-0.67,-0.08l-0.72,0.87l-0.87,-0.64l0.35,-0.69l-0.36,-1.96l0.81,-0.51l0.45,-1.51l0.92,-1.57l-0.07,-0.97l2.65,-1.33l2.75,1.35l0.77,1.05l2.12,0.35l0.76,-0.32l1.96,1.21Z\",\n      name: \"Ecuador\"\n    },\n    AL: {\n      path: \"M470.32,171.8l0.74,0.03l0.92,0.89l-0.17,1.95l0.36,1.28l1.01,0.82l-1.82,2.83l-0.19,-0.61l-1.25,-0.89l-0.18,-1.2l0.53,-2.82l-0.54,-1.47l0.6,-0.83Z\",\n      name: \"Albania\"\n    },\n    AO: {\n      path: \"M461.55,300.03l1.26,3.15l1.94,2.36l2.47,-0.53l1.25,0.32l0.44,-0.18l0.93,-1.92l1.31,-0.08l0.41,-0.44l0.47,-0.0l-0.1,0.41l0.39,0.49l2.65,-0.02l0.03,1.19l0.48,1.01l-0.34,1.52l0.18,1.55l0.83,1.04l-0.13,2.85l0.54,0.39l3.96,-0.41l-0.1,1.79l0.39,1.05l-0.24,1.43l-4.7,-0.03l-0.4,0.39l-0.12,8.13l2.92,3.49l-3.83,0.88l-5.89,-0.36l-1.88,-1.24l-10.47,0.22l-1.3,-1.01l-1.85,-0.16l-2.4,0.77l-0.15,-1.06l0.33,-2.16l1.0,-3.45l1.35,-3.2l2.24,-2.8l0.33,-2.06l-0.13,-1.53l-0.8,-1.08l-1.21,-2.87l0.87,-1.62l-1.27,-4.12l-1.17,-1.53l2.47,-0.63l7.03,0.03ZM451.71,298.87l-0.47,-1.25l1.25,-1.11l0.32,0.3l-0.99,1.03l-0.12,1.03Z\",\n      name: \"Angola\"\n    },\n    KZ: {\n      path: \"M552.8,172.89l0.46,-1.27l-0.48,-1.05l-2.96,-1.19l-1.06,-2.58l-1.37,-0.87l-0.03,-0.3l1.95,0.23l0.45,-0.38l0.08,-1.96l1.75,-0.41l2.1,0.45l0.48,-0.33l0.45,-3.04l-0.45,-2.09l-0.41,-0.31l-2.42,0.15l-2.36,-0.73l-2.87,1.37l-2.17,0.61l-0.85,-0.34l0.13,-1.61l-1.6,-2.12l-2.02,-0.08l-1.78,-1.82l1.29,-2.18l-0.57,-0.95l1.62,-2.91l2.21,1.63l0.63,-0.27l0.29,-2.22l4.92,-3.43l3.71,-0.08l8.4,3.6l2.92,-1.36l3.77,-0.06l3.11,1.66l0.51,-0.11l0.6,-0.81l3.31,0.13l0.39,-0.25l0.63,-1.57l-0.17,-0.5l-3.5,-1.98l1.87,-1.27l-0.13,-1.03l1.98,-0.72l0.18,-0.62l-1.59,-2.06l0.81,-0.82l9.23,-1.18l1.33,-0.88l6.18,-1.26l2.26,-1.42l4.08,0.68l0.73,3.33l0.51,0.3l2.48,-0.8l2.79,1.02l-0.17,1.56l0.43,0.44l2.55,-0.24l4.89,-2.53l0.03,0.32l3.15,2.61l5.56,8.47l0.65,0.02l1.12,-1.46l3.15,1.74l3.76,-0.78l1.15,0.49l1.14,1.8l1.84,0.76l0.99,1.29l3.35,-0.25l1.02,1.52l-1.6,1.81l-1.93,0.28l-0.34,0.38l-0.11,3.05l-1.13,1.16l-4.75,-1.0l-0.46,0.27l-1.76,5.47l-1.1,0.59l-4.91,1.23l-0.27,0.54l2.1,4.97l-1.37,0.63l-0.23,0.41l0.13,1.13l-0.88,-0.25l-1.42,-1.13l-7.89,-0.4l-0.92,0.31l-3.73,-1.22l-1.42,0.63l-0.53,1.66l-3.72,-0.94l-1.85,0.43l-0.76,1.4l-4.65,2.62l-1.13,2.08l-0.44,0.01l-0.92,-1.4l-2.87,-0.09l-0.45,-2.14l-0.38,-0.32l-0.8,-0.01l0.0,-2.96l-3.0,-2.22l-7.31,0.58l-2.35,-2.68l-6.71,-3.69l-6.45,1.83l-0.29,0.39l0.1,10.85l-0.7,0.08l-1.62,-2.17l-1.83,-0.96l-3.11,0.59l-0.64,0.51Z\",\n      name: \"Kazakhstan\"\n    },\n    ET: {\n      path: \"M516.04,247.79l1.1,0.84l1.63,-0.45l0.68,0.47l1.63,0.03l2.01,0.94l1.73,1.66l1.64,2.07l-1.52,2.04l0.16,1.72l0.39,0.38l2.05,0.0l-0.36,1.03l2.86,3.58l8.32,3.08l1.31,0.02l-6.32,6.75l-3.1,0.11l-2.36,1.77l-1.47,0.04l-0.86,0.79l-1.38,-0.0l-1.32,-0.81l-2.29,1.05l-0.76,0.98l-3.29,-0.41l-3.07,-2.07l-1.8,-0.07l-0.62,-0.6l0.0,-1.24l-0.28,-0.38l-1.15,-0.37l-1.4,-2.59l-1.19,-0.68l-0.47,-1.0l-1.27,-1.23l-1.16,-0.22l0.43,-0.72l1.45,-0.28l0.41,-0.95l-0.03,-2.21l0.68,-2.44l1.05,-0.63l1.43,-3.06l1.57,-1.37l1.02,-2.51l0.35,-1.88l2.52,0.46l0.44,-0.24l0.58,-1.43Z\",\n      name: \"Ethiopia\"\n    },\n    ZW: {\n      path: \"M498.91,341.09l-1.11,-0.22l-0.92,0.28l-2.09,-0.44l-1.5,-1.11l-1.89,-0.43l-0.62,-1.4l-0.01,-0.84l-0.3,-0.38l-0.97,-0.25l-2.71,-2.74l-1.92,-3.32l3.83,0.45l3.73,-3.82l1.08,-0.44l0.26,-0.77l1.25,-0.9l1.41,-0.26l0.5,0.89l1.99,-0.05l1.72,1.17l1.11,0.17l1.05,0.66l0.01,2.99l-0.59,3.76l0.38,0.86l-0.23,1.23l-0.39,0.35l-0.63,1.81l-2.43,2.75Z\",\n      name: \"Zimbabwe\"\n    },\n    ES: {\n      path: \"M416.0,169.21l1.07,1.17l4.61,1.38l1.06,-0.57l2.6,1.26l2.71,-0.3l0.09,1.12l-2.14,1.8l-3.11,0.61l-0.31,0.31l-0.2,0.89l-1.54,1.69l-0.97,2.4l0.84,1.74l-1.32,1.27l-0.48,1.68l-1.88,0.65l-1.66,2.07l-5.36,-0.01l-1.79,1.08l-0.89,0.98l-0.88,-0.17l-0.79,-0.82l-0.68,-1.59l-2.37,-0.63l-0.11,-0.5l1.21,-1.82l-0.77,-1.13l0.61,-1.68l-0.76,-1.62l0.87,-0.49l0.09,-1.25l0.42,-0.6l0.03,-2.11l0.99,-0.69l0.13,-0.5l-1.03,-1.73l-1.46,-0.11l-0.61,0.38l-1.06,0.0l-0.52,-1.23l-0.53,-0.21l-1.32,0.67l-0.01,-1.49l-0.75,-0.96l3.03,-1.88l2.99,0.53l3.32,-0.02l2.63,0.51l6.01,-0.06Z\",\n      name: \"Spain\"\n    },\n    ER: {\n      path: \"M520.38,246.23l3.42,2.43l3.5,3.77l0.84,0.54l-0.95,-0.01l-3.51,-3.89l-2.33,-1.15l-1.73,-0.07l-0.91,-0.51l-1.26,0.51l-1.34,-1.02l-0.61,0.17l-0.66,1.61l-2.35,-0.43l-0.17,-0.67l1.29,-5.29l0.61,-0.61l1.95,-0.53l0.87,-1.01l1.17,2.41l0.68,2.33l1.49,1.43Z\",\n      name: \"Eritrea\"\n    },\n    ME: {\n      path: \"M468.91,172.53l-1.22,-1.02l0.47,-1.81l0.89,-0.72l2.26,1.51l-0.5,0.57l-0.75,-0.27l-1.14,1.73Z\",\n      name: \"Montenegro\"\n    },\n    MD: {\n      path: \"M488.41,153.73l1.4,-0.27l1.72,0.93l1.07,0.15l0.85,0.65l-0.14,0.84l0.96,0.85l1.12,2.47l-1.15,-0.07l-0.66,-0.41l-0.52,0.25l-0.09,0.86l-1.08,1.89l-0.27,-0.86l0.25,-1.34l-0.16,-1.6l-3.29,-4.34Z\",\n      name: \"Moldova\"\n    },\n    MG: {\n      path: \"M545.91,319.14l0.4,3.03l0.62,1.21l-0.21,1.02l-0.57,-0.8l-0.69,-0.01l-0.47,0.76l0.41,2.12l-0.18,0.87l-0.73,0.78l-0.15,2.14l-4.71,15.2l-1.06,2.88l-3.92,1.64l-3.12,-1.49l-0.6,-1.21l-0.19,-2.4l-0.86,-2.05l-0.21,-1.77l0.38,-1.62l1.21,-0.75l0.01,-0.76l1.19,-2.04l0.23,-1.66l-1.06,-2.99l-0.19,-2.21l0.81,-1.33l0.32,-1.46l4.63,-1.22l3.44,-3.0l0.85,-1.4l-0.08,-0.7l0.78,-0.04l1.38,-1.77l0.13,-1.64l0.45,-0.61l1.16,1.69l0.59,1.6Z\",\n      name: \"Madagascar\"\n    },\n    MA: {\n      path: \"M378.78,230.02l0.06,-0.59l0.92,-0.73l0.82,-1.37l-0.09,-1.04l0.79,-1.7l1.31,-1.58l0.96,-0.59l0.66,-1.55l0.09,-1.47l0.81,-1.48l1.72,-1.07l1.55,-2.69l1.16,-0.96l2.44,-0.39l1.94,-1.82l1.31,-0.78l2.09,-2.28l-0.51,-3.65l1.24,-3.7l1.5,-1.75l4.46,-2.57l2.37,-4.47l1.44,0.01l1.68,1.21l2.32,-0.19l3.47,0.65l0.8,1.54l0.16,1.71l0.86,2.96l0.56,0.59l-0.26,0.61l-3.05,0.44l-1.26,1.05l-1.33,0.22l-0.33,0.37l-0.09,1.78l-2.68,1.0l-1.07,1.42l-4.47,1.13l-4.04,2.01l-0.54,4.64l-1.15,0.06l-0.92,0.61l-1.96,-0.35l-2.42,0.54l-0.74,1.9l-0.86,0.4l-1.14,3.26l-3.53,3.01l-0.8,3.55l-0.96,1.1l-0.29,0.82l-4.95,0.18Z\",\n      name: \"Morocco\"\n    },\n    UZ: {\n      path: \"M598.64,172.75l-1.63,1.52l0.06,0.64l1.85,1.12l1.97,-0.64l2.21,1.17l-2.52,1.68l-2.59,-0.22l-0.18,-0.41l0.46,-1.23l-0.45,-0.53l-3.35,0.69l-2.1,3.51l-1.87,-0.12l-1.03,1.51l0.22,0.55l1.64,0.62l0.46,1.83l-1.19,2.49l-2.66,-0.53l0.05,-1.36l-0.26,-0.39l-3.3,-1.23l-2.56,-1.4l-4.4,-3.34l-1.34,-3.14l-1.08,-0.6l-2.58,0.13l-0.69,-0.44l-0.47,-2.52l-3.37,-1.6l-0.43,0.05l-2.07,1.72l-2.1,1.01l-0.21,0.47l0.28,1.01l-1.91,0.03l-0.09,-10.5l5.99,-1.7l6.19,3.54l2.71,2.84l7.05,-0.67l2.71,2.01l-0.17,2.81l0.39,0.42l0.9,0.02l0.44,2.14l0.38,0.32l2.94,0.09l0.95,1.42l1.28,-0.24l1.05,-2.04l4.43,-2.5Z\",\n      name: \"Uzbekistan\"\n    },\n    MM: {\n      path: \"M673.9,230.21l-1.97,1.57l-0.57,0.96l-1.4,0.6l-1.36,1.05l-1.99,0.36l-1.08,2.66l-0.91,0.4l-0.19,0.55l1.21,2.27l2.52,3.43l-0.79,1.91l-0.74,0.41l-0.17,0.52l0.65,1.37l1.61,1.95l0.25,2.58l0.9,2.13l-1.92,3.57l0.68,-2.25l-0.81,-1.74l0.19,-2.65l-1.05,-1.53l-1.24,-6.17l-1.12,-2.26l-0.6,-0.13l-4.34,3.02l-2.39,-0.65l0.77,-2.84l-0.52,-2.61l-1.91,-2.96l0.25,-0.75l-0.29,-0.51l-1.33,-0.3l-1.61,-1.93l-0.1,-1.3l0.82,-0.24l0.04,-1.64l1.02,-0.52l0.21,-0.45l-0.23,-0.95l0.54,-0.96l0.08,-2.22l1.46,0.45l0.47,-0.2l1.12,-2.19l0.16,-1.35l1.33,-2.16l-0.0,-1.52l2.89,-1.66l1.63,0.44l0.5,-0.44l-0.17,-1.4l0.64,-0.36l0.08,-1.04l0.77,-0.11l0.71,1.35l1.06,0.69l-0.03,3.86l-2.38,2.37l-0.3,3.15l0.46,0.43l2.28,-0.38l0.51,2.08l1.47,0.67l-0.6,1.8l0.19,0.48l2.97,1.48l1.64,-0.55l0.02,0.32Z\",\n      name: \"Myanmar\"\n    },\n    ML: {\n      path: \"M392.61,254.08l-0.19,-2.37l-0.99,-0.87l-0.44,-1.3l-0.09,-1.28l0.81,-0.58l0.35,-1.24l2.37,0.65l1.31,-0.47l0.86,0.15l0.66,-0.56l9.83,-0.04l0.38,-0.28l0.56,-1.8l-0.44,-0.65l-2.35,-21.95l3.27,-0.04l16.7,11.38l0.74,1.31l2.5,1.09l0.02,1.38l0.44,0.39l2.34,-0.21l0.01,5.38l-1.28,1.61l-0.26,1.49l-5.31,0.57l-1.07,0.92l-2.9,0.1l-0.86,-0.48l-1.38,0.36l-2.4,1.08l-0.6,0.87l-1.85,1.09l-0.43,0.7l-0.79,0.39l-1.44,-0.21l-0.81,0.84l-0.34,1.64l-1.91,2.02l-0.06,1.03l-0.67,1.22l0.13,1.16l-0.97,0.39l-0.23,-0.64l-0.52,-0.24l-1.35,0.4l-0.34,0.55l-2.69,-0.28l-0.37,-0.35l-0.02,-0.9l-0.65,-0.35l0.45,-0.64l-0.03,-0.53l-2.12,-2.44l-0.76,-0.01l-2.0,1.16l-0.78,-0.15l-0.8,-0.67l-1.21,0.23Z\",\n      name: \"Mali\"\n    },\n    MN: {\n      path: \"M676.61,146.48l3.81,1.68l5.67,-1.0l2.37,0.41l2.34,1.5l1.79,1.75l2.29,-0.03l3.12,0.52l2.47,-0.81l3.41,-0.59l3.53,-2.21l1.25,0.29l1.53,1.13l2.27,-0.21l-2.66,5.01l0.64,1.68l0.47,0.21l1.32,-0.38l2.38,0.48l2.02,-1.11l1.76,0.89l2.06,2.02l-0.13,0.53l-1.72,-0.29l-3.77,0.46l-1.88,0.99l-1.76,1.99l-3.71,1.17l-2.45,1.6l-3.83,-0.87l-0.41,0.17l-1.31,1.99l1.04,2.24l-1.52,0.9l-1.74,1.57l-2.79,1.02l-3.78,0.13l-4.05,1.05l-2.77,1.52l-1.16,-0.85l-2.94,0.0l-3.62,-1.79l-2.58,-0.49l-3.4,0.41l-5.12,-0.67l-2.63,0.06l-1.31,-1.6l-1.4,-3.0l-1.48,-0.33l-3.13,-1.94l-6.16,-0.93l-0.71,-1.06l0.86,-3.82l-1.93,-2.71l-3.5,-1.18l-1.95,-1.58l-0.5,-1.72l2.34,-0.52l4.75,-2.8l3.62,-1.47l2.18,0.97l2.46,0.05l1.81,1.53l2.46,0.12l3.95,0.71l2.43,-2.28l0.08,-0.48l-0.9,-1.72l2.24,-2.98l2.62,1.27l4.94,1.17l0.43,2.24Z\",\n      name: \"Mongolia\"\n    },\n    MK: {\n      path: \"M472.8,173.98l0.49,-0.71l3.57,-0.71l1.0,0.77l0.13,1.45l-0.65,0.53l-1.15,-0.05l-1.12,0.67l-1.39,0.22l-0.79,-0.55l-0.29,-1.03l0.19,-0.6Z\",\n      name: \"Macedonia\"\n    },\n    MW: {\n      path: \"M505.5,309.31l0.85,1.95l0.15,2.86l-0.69,1.65l0.71,1.8l0.06,1.28l0.49,0.64l0.07,1.06l0.4,0.55l0.8,-0.23l0.55,0.61l0.69,-0.21l0.34,0.6l0.19,2.94l-1.04,0.62l-0.54,1.25l-1.11,-1.08l-0.16,-1.56l0.51,-1.31l-0.32,-1.3l-0.99,-0.65l-0.82,0.12l-2.36,-1.64l0.63,-1.96l0.82,-1.18l-0.46,-2.01l0.9,-2.86l-0.94,-2.51l0.96,0.18l0.29,0.4Z\",\n      name: \"Malawi\"\n    },\n    MR: {\n      path: \"M407.36,220.66l-2.58,0.03l-0.39,0.44l2.42,22.56l0.36,0.43l-0.39,1.24l-9.75,0.04l-0.56,0.53l-0.91,-0.11l-1.27,0.45l-1.61,-0.66l-0.97,0.03l-0.36,0.29l-0.38,1.35l-0.42,0.23l-2.93,-3.4l-2.96,-1.52l-1.62,-0.03l-1.27,0.54l-1.12,-0.2l-0.65,0.4l-0.08,-0.49l0.68,-1.29l0.31,-2.43l-0.57,-3.91l0.23,-1.21l-0.69,-1.5l-1.15,-1.02l0.25,-0.39l9.58,0.02l0.4,-0.45l-0.46,-3.68l0.47,-1.04l2.12,-0.21l0.36,-0.4l-0.08,-6.4l7.81,0.13l0.41,-0.4l0.01,-3.31l7.76,5.35Z\",\n      name: \"Mauritania\"\n    },\n    UG: {\n      path: \"M498.55,276.32l0.7,-0.46l1.65,0.5l1.96,-0.57l1.7,0.01l1.45,-0.98l0.91,1.33l1.33,3.95l-2.57,4.03l-1.46,-0.4l-2.54,0.91l-1.37,1.61l-0.01,0.81l-2.42,-0.01l-2.26,1.01l-0.17,-1.59l0.58,-1.04l0.14,-1.94l1.37,-2.28l1.78,-1.58l-0.17,-0.65l-0.72,-0.24l0.13,-2.43Z\",\n      name: \"Uganda\"\n    },\n    MY: {\n      path: \"M717.47,273.46l-1.39,0.65l-2.12,-0.41l-2.88,-0.0l-0.38,0.28l-0.84,2.75l-0.99,0.96l-1.21,3.29l-1.73,0.45l-2.45,-0.68l-1.39,0.31l-1.33,1.15l-1.59,-0.14l-1.41,0.44l-1.44,-1.19l-0.18,-0.73l1.34,0.53l1.93,-0.47l0.75,-2.22l4.02,-1.03l2.75,-3.21l0.82,0.94l0.64,-0.05l0.4,-0.65l0.96,0.06l0.42,-0.36l0.24,-2.68l1.81,-1.64l1.21,-1.86l0.63,-0.01l1.07,1.05l0.34,1.28l3.44,1.35l-0.06,0.35l-1.37,0.1l-0.35,0.54l0.32,0.88ZM673.68,269.59l0.17,1.09l0.47,0.33l1.65,-0.3l0.87,-0.94l1.61,1.52l0.98,1.56l-0.12,2.81l0.41,2.29l0.95,0.9l0.88,2.44l-1.27,0.12l-5.1,-3.67l-0.34,-1.29l-1.37,-1.59l-0.33,-1.97l-0.88,-1.4l0.25,-1.68l-0.46,-1.05l1.63,0.84Z\",\n      name: \"Malaysia\"\n    },\n    MX: {\n      path: \"M133.12,200.41l0.2,0.47l9.63,3.33l6.96,-0.02l0.4,-0.4l0.0,-0.74l3.77,0.0l3.55,2.93l1.39,2.83l1.52,1.04l2.08,0.82l0.47,-0.14l1.46,-2.0l1.73,-0.04l1.59,0.98l2.05,3.35l1.47,1.56l1.26,3.14l2.18,1.02l2.26,0.58l-1.18,3.72l-0.42,5.04l1.79,4.89l1.62,1.89l0.61,1.52l1.2,1.42l2.55,0.66l1.37,1.1l7.54,-1.89l1.86,-1.3l1.14,-4.3l4.1,-1.21l3.57,-0.11l0.32,0.3l-0.06,0.94l-1.26,1.45l-0.67,1.71l0.38,0.7l-0.72,2.27l-0.49,-0.3l-1.0,0.08l-1.0,1.39l-0.47,-0.11l-0.53,0.47l-4.26,-0.02l-0.4,0.4l-0.0,1.06l-1.1,0.26l0.1,0.44l1.82,1.44l0.56,0.91l-3.19,0.21l-1.21,2.09l0.24,0.72l-0.2,0.44l-2.24,-2.18l-1.45,-0.93l-2.22,-0.69l-1.52,0.22l-3.07,1.16l-10.55,-3.85l-2.86,-1.96l-3.78,-0.92l-1.08,-1.19l-2.62,-1.43l-1.18,-1.54l-0.38,-0.81l0.66,-0.63l-0.18,-0.53l0.52,-0.76l0.01,-0.91l-2.0,-3.82l-2.21,-2.63l-2.53,-2.09l-1.19,-1.62l-2.2,-1.17l-0.3,-0.43l0.34,-1.48l-0.21,-0.45l-1.23,-0.6l-1.36,-1.2l-0.59,-1.78l-1.54,-0.47l-2.44,-2.55l-0.16,-0.9l-1.33,-2.03l-0.84,-1.99l-0.16,-1.33l-1.81,-1.1l-0.97,0.05l-1.31,-0.7l-0.57,0.22l-0.4,1.12l0.72,3.77l3.51,3.89l0.28,0.78l0.53,0.26l0.41,1.43l1.33,1.73l1.58,1.41l0.8,2.39l1.43,2.41l0.13,1.32l0.37,0.36l1.04,0.08l1.67,2.28l-0.85,0.76l-0.66,-1.51l-1.68,-1.54l-2.91,-1.87l0.06,-1.82l-0.54,-1.68l-2.91,-2.03l-0.55,0.09l-1.95,-1.1l-0.88,-0.94l0.68,-0.08l0.93,-1.01l0.08,-1.78l-1.93,-1.94l-1.46,-0.77l-3.75,-7.56l4.88,-0.42Z\",\n      name: \"Mexico\"\n    },\n    VU: {\n      path: \"M839.04,322.8l0.22,1.14l-0.44,0.03l-0.2,-1.45l0.42,0.27Z\",\n      name: \"Vanuatu\"\n    },\n    FR: {\n      path: \"M444.48,172.62l-0.64,1.78l-0.58,-0.31l-0.49,-1.72l0.4,-0.89l1.0,-0.72l0.3,1.85ZM429.64,147.1l1.78,1.58l1.46,-0.13l2.1,1.42l1.35,0.27l1.23,0.83l3.04,0.5l-1.03,1.85l-0.3,2.12l-0.41,0.32l-0.95,-0.24l-0.5,0.43l0.06,0.61l-1.81,1.92l-0.04,1.42l0.55,0.38l0.88,-0.36l0.61,0.97l-0.03,1.0l0.57,0.91l-0.75,1.09l0.65,2.39l1.27,0.57l-0.18,0.82l-2.01,1.53l-4.77,-0.8l-3.82,1.0l-0.53,1.85l-2.49,0.34l-2.71,-1.31l-1.16,0.57l-4.31,-1.29l-0.72,-0.86l1.19,-1.78l0.39,-6.45l-2.58,-3.3l-1.9,-1.66l-3.72,-1.23l-0.19,-1.72l2.81,-0.61l4.12,0.81l0.47,-0.48l-0.6,-2.77l1.94,0.95l5.83,-2.54l0.92,-2.74l1.6,-0.49l0.24,0.78l1.36,0.33l1.05,1.19ZM289.01,278.39l-0.81,0.8l-0.78,0.12l-0.5,-0.66l-0.56,-0.1l-0.91,0.6l-0.46,-0.22l1.09,-2.96l-0.96,-1.77l-0.17,-1.49l1.07,-1.77l2.32,0.75l2.51,2.01l0.3,0.74l-2.14,3.96Z\",\n      name: \"France\"\n    },\n    FI: {\n      path: \"M492.17,76.39l-0.23,3.5l3.52,2.63l-2.08,2.88l-0.02,0.44l2.8,4.56l-1.59,3.31l2.16,3.24l-0.94,2.39l0.14,0.47l3.44,2.51l-0.77,1.62l-7.52,6.95l-4.5,0.31l-4.38,1.37l-3.8,0.74l-1.44,-1.96l-2.17,-1.11l0.5,-3.66l-1.16,-3.33l1.09,-2.08l2.21,-2.42l5.67,-4.32l1.64,-0.83l0.21,-0.42l-0.46,-2.02l-3.38,-1.89l-0.75,-1.43l-0.22,-6.74l-6.79,-4.8l0.8,-0.62l2.54,2.12l3.46,-0.12l3.0,0.96l2.51,-2.11l1.17,-3.08l3.55,-1.38l2.76,1.53l-0.95,2.79Z\",\n      name: \"Finland\"\n    },\n    FJ: {\n      path: \"M871.53,326.34l-2.8,1.05l-0.08,-0.23l2.97,-1.21l-0.1,0.39ZM867.58,329.25l0.43,0.37l-0.27,0.88l-1.24,0.28l-1.04,-0.24l-0.14,-0.66l0.63,-0.58l0.92,0.26l0.7,-0.31Z\",\n      name: \"Fiji\"\n    },\n    FK: {\n      path: \"M274.36,425.85l1.44,1.08l-0.47,0.73l-3.0,0.89l-0.96,-1.0l-0.52,-0.05l-1.83,1.29l-0.73,-0.88l2.46,-1.64l1.93,0.76l1.67,-1.19Z\",\n      name: \"Falkland Is.\"\n    },\n    NI: {\n      path: \"M202.33,252.67l0.81,-0.18l1.03,-1.02l-0.04,-0.88l0.68,-0.0l0.63,-0.54l0.97,0.22l1.53,-1.26l0.58,-0.99l1.17,0.34l2.41,-0.94l0.13,1.32l-0.81,1.94l0.1,2.74l-0.36,0.37l-0.11,1.75l-0.47,0.81l0.18,1.14l-1.73,-0.85l-0.71,0.27l-1.47,-0.6l-0.52,0.16l-4.01,-3.81Z\",\n      name: \"Nicaragua\"\n    },\n    NL: {\n      path: \"M430.31,143.39l0.6,-0.5l2.13,-4.8l3.2,-1.33l1.74,0.08l0.33,0.8l-0.59,2.92l-0.5,0.99l-1.26,0.0l-0.4,0.45l0.33,2.7l-2.2,-1.78l-2.62,0.58l-0.75,-0.11Z\",\n      name: \"Netherlands\"\n    },\n    NO: {\n      path: \"M491.44,67.41l6.8,2.89l-2.29,0.86l-0.15,0.65l2.33,2.38l-4.98,1.79l0.84,-2.45l-0.18,-0.48l-3.55,-1.8l-3.89,1.52l-1.42,3.38l-2.12,1.72l-2.64,-1.0l-3.11,0.21l-2.66,-2.22l-0.5,-0.01l-1.41,1.1l-1.44,0.17l-0.35,0.35l-0.32,2.47l-4.32,-0.64l-0.44,0.29l-0.58,2.11l-2.45,0.2l-4.15,7.68l-3.88,5.76l0.78,1.62l-0.64,1.16l-2.24,-0.06l-0.38,0.24l-1.66,3.89l0.15,5.17l1.57,2.04l-0.78,4.16l-2.02,2.48l-0.85,1.63l-1.3,-1.75l-0.58,-0.07l-4.87,4.19l-3.1,0.79l-3.16,-1.7l-0.85,-3.77l-0.77,-8.55l2.14,-2.31l6.55,-3.27l5.02,-4.17l10.63,-13.84l10.98,-8.7l5.35,-1.91l4.34,0.12l3.69,-3.64l4.49,0.19l4.37,-0.89ZM484.55,20.04l4.26,1.75l-3.1,2.55l-7.1,0.65l-7.08,-0.9l-0.37,-1.31l-0.37,-0.29l-3.44,-0.1l-2.08,-2.0l6.87,-1.44l3.9,1.31l2.39,-1.64l6.13,1.4ZM481.69,33.93l-4.45,1.74l-3.54,-0.99l1.12,-0.9l0.05,-0.58l-1.06,-1.22l4.22,-0.89l1.09,1.97l2.57,0.87ZM466.44,24.04l7.43,3.77l-5.41,1.86l-1.58,4.08l-2.26,1.2l-1.12,4.11l-2.61,0.18l-4.79,-2.86l1.84,-1.54l-0.1,-0.68l-3.69,-1.53l-4.77,-4.51l-1.73,-3.89l6.11,-1.82l1.54,1.92l3.57,-0.08l1.2,-1.96l3.32,-0.18l3.05,1.92Z\",\n      name: \"Norway\"\n    },\n    NA: {\n      path: \"M474.26,330.66l-0.97,0.04l-0.38,0.4l-0.07,8.9l-2.09,0.08l-0.39,0.4l-0.0,17.42l-1.98,1.23l-1.17,0.17l-2.44,-0.66l-0.48,-1.13l-0.99,-0.74l-0.54,0.05l-0.9,1.01l-1.53,-1.68l-0.93,-1.88l-1.99,-8.56l-0.06,-3.12l-0.33,-1.52l-2.3,-3.34l-1.91,-4.83l-1.96,-2.43l-0.12,-1.57l2.33,-0.79l1.43,0.07l1.81,1.13l10.23,-0.25l1.84,1.23l5.87,0.35ZM474.66,330.64l6.51,-1.6l1.9,0.39l-1.69,0.4l-1.31,0.83l-1.12,-0.94l-4.29,0.92Z\",\n      name: \"Namibia\"\n    },\n    NC: {\n      path: \"M838.78,341.24l-0.33,0.22l-2.9,-1.75l-3.26,-3.37l1.65,0.83l4.85,4.07Z\",\n      name: \"New Caledonia\"\n    },\n    NE: {\n      path: \"M454.75,226.53l1.33,1.37l0.48,0.07l1.27,-0.7l0.53,3.52l0.94,0.83l0.17,0.92l0.81,0.69l-0.44,0.95l-0.96,5.26l-0.13,3.22l-3.04,2.31l-1.22,3.57l1.02,1.24l-0.0,1.46l0.39,0.4l1.13,0.04l-0.9,1.25l-1.47,-2.42l-0.86,-0.29l-2.09,1.37l-1.74,-0.67l-1.45,-0.17l-0.85,0.35l-1.36,-0.07l-1.64,1.09l-1.06,0.05l-2.94,-1.28l-1.44,0.59l-1.01,-0.03l-0.97,-0.94l-2.7,-0.98l-2.69,0.3l-0.87,0.64l-0.47,1.6l-0.75,1.16l-0.12,1.53l-1.57,-1.1l-1.31,0.24l0.03,-0.81l-0.32,-0.41l-2.59,-0.52l-0.15,-1.16l-1.35,-1.6l-0.29,-1.0l0.13,-0.84l1.29,-0.08l1.08,-0.92l3.31,-0.22l2.22,-0.41l0.32,-0.34l0.2,-1.47l1.39,-1.88l-0.01,-5.66l3.36,-1.12l7.24,-5.12l8.42,-4.92l3.69,1.06Z\",\n      name: \"Niger\"\n    },\n    NG: {\n      path: \"M456.32,253.89l0.64,0.65l-0.28,1.04l-2.11,2.01l-2.03,5.18l-1.37,1.16l-1.15,3.18l-1.33,0.66l-1.46,-0.97l-1.21,0.16l-1.38,1.36l-0.91,0.24l-1.79,4.06l-2.33,0.81l-1.11,-0.07l-0.86,0.5l-1.71,-0.05l-1.19,-1.39l-0.89,-1.89l-1.77,-1.66l-3.95,-0.08l0.07,-5.21l0.42,-1.43l1.95,-2.3l-0.14,-0.91l0.43,-1.18l-0.53,-1.41l0.25,-2.92l0.72,-1.07l0.32,-1.34l0.46,-0.39l2.47,-0.28l2.34,0.89l1.15,1.02l1.28,0.04l1.22,-0.58l3.03,1.27l1.49,-0.14l1.36,-1.0l1.33,0.07l0.82,-0.35l3.45,0.8l1.82,-1.32l1.84,2.67l0.66,0.16Z\",\n      name: \"Nigeria\"\n    },\n    NZ: {\n      path: \"M857.8,379.65l1.86,3.12l0.44,0.18l0.3,-0.38l0.03,-1.23l0.38,0.27l0.57,2.31l2.02,0.94l1.81,0.27l1.57,-1.06l0.7,0.18l-1.15,3.59l-1.98,0.11l-0.74,1.2l0.2,1.11l-2.42,3.98l-1.49,0.92l-1.04,-0.85l1.21,-2.05l-0.81,-2.01l-2.63,-1.25l0.04,-0.57l1.82,-1.19l0.43,-2.34l-0.16,-2.03l-0.95,-1.82l-0.06,-0.72l-3.11,-3.64l-0.79,-1.52l1.56,1.45l1.76,0.66l0.65,2.34ZM853.83,393.59l0.57,1.24l0.59,0.16l1.42,-0.97l0.46,0.79l0.0,1.03l-2.47,3.48l-1.26,1.2l-0.06,0.5l0.55,0.87l-1.41,0.07l-2.33,1.38l-2.03,5.02l-3.02,2.16l-2.06,-0.06l-1.71,-1.04l-2.47,-0.2l-0.27,-0.73l1.22,-2.1l3.05,-2.94l1.62,-0.59l4.02,-2.82l1.57,-1.67l1.07,-2.16l0.88,-0.7l0.48,-1.75l1.24,-0.97l0.35,0.79Z\",\n      name: \"New Zealand\"\n    },\n    NP: {\n      path: \"M641.14,213.62l0.01,3.19l-1.74,0.04l-4.8,-0.86l-1.58,-1.39l-3.37,-0.34l-7.65,-3.7l0.8,-2.09l2.33,-1.7l1.77,0.75l2.49,1.76l1.38,0.41l0.99,1.35l1.9,0.52l1.99,1.17l5.49,0.9Z\",\n      name: \"Nepal\"\n    },\n    CI: {\n      path: \"M407.4,259.27l0.86,0.42l0.56,0.9l1.13,0.53l1.19,-0.61l0.97,-0.08l1.42,0.54l0.6,3.24l-1.03,2.08l-0.65,2.84l1.06,2.33l-0.06,0.53l-2.54,-0.47l-1.66,0.03l-3.06,0.46l-4.11,1.6l0.32,-3.06l-1.18,-1.31l-1.32,-0.66l0.42,-0.85l-0.2,-1.4l0.5,-0.67l0.01,-1.59l0.84,-0.32l0.26,-0.5l-1.15,-3.01l0.12,-0.5l0.51,-0.25l0.66,0.31l1.93,0.02l0.67,-0.71l0.71,-0.14l0.25,0.69l0.57,0.22l1.4,-0.61Z\",\n      name: \"Côte d'Ivoire\"\n    },\n    CH: {\n      path: \"M444.62,156.35l-0.29,0.87l0.18,0.53l1.13,0.58l1.0,0.1l-0.1,0.65l-0.79,0.38l-1.72,-0.37l-0.45,0.23l-0.45,1.04l-0.75,0.06l-0.84,-0.4l-1.32,1.0l-0.96,0.12l-0.88,-0.55l-0.81,-1.3l-0.49,-0.16l-0.63,0.26l0.02,-0.65l1.71,-1.66l0.1,-0.56l0.93,0.08l0.58,-0.46l1.99,0.02l0.66,-0.61l2.19,0.79Z\",\n      name: \"Switzerland\"\n    },\n    CO: {\n      path: \"M242.07,254.93l-1.7,0.59l-0.59,1.18l-1.7,1.69l-0.38,1.93l-0.67,1.43l0.31,0.57l1.03,0.13l0.25,0.9l0.57,0.64l-0.04,2.34l1.64,1.42l3.16,-0.24l1.26,0.28l1.67,2.06l0.41,0.13l4.09,-0.39l0.45,0.22l-0.92,1.95l-0.2,1.8l0.52,1.83l0.75,1.05l-1.12,1.1l0.07,0.63l0.84,0.51l0.74,1.29l-0.39,-0.45l-0.59,-0.01l-0.71,0.74l-4.71,-0.05l-0.4,0.41l0.03,1.57l0.33,0.39l1.11,0.2l-1.68,0.4l-0.29,0.38l-0.01,1.82l1.16,1.14l0.34,1.25l-1.05,7.05l-1.04,-0.87l1.26,-1.99l-0.13,-0.56l-2.18,-1.23l-1.38,0.2l-1.14,-0.38l-1.27,0.61l-1.55,-0.26l-1.38,-2.46l-1.23,-0.75l-0.85,-1.2l-1.67,-1.19l-0.86,0.13l-2.11,-1.32l-1.01,0.31l-1.8,-0.29l-0.52,-0.91l-3.09,-1.68l0.77,-0.52l-0.1,-1.12l0.41,-0.64l1.34,-0.32l2.0,-2.88l-0.11,-0.57l-0.66,-0.43l0.39,-1.38l-0.52,-2.1l0.49,-0.83l-0.4,-2.13l-0.97,-1.35l0.17,-0.66l0.86,-0.08l0.47,-0.75l-0.46,-1.63l1.41,-0.07l1.8,-1.69l0.93,-0.24l0.3,-0.38l0.45,-2.76l1.22,-1.0l1.44,-0.04l0.45,-0.5l1.91,0.12l2.93,-1.84l1.15,-1.14l0.91,0.46l-0.25,0.45Z\",\n      name: \"Colombia\"\n    },\n    CN: {\n      path: \"M740.23,148.97l4.57,1.3l2.8,2.17l0.98,2.9l0.38,0.27l3.8,0.0l2.32,-1.28l3.29,-0.75l-0.96,2.09l-1.02,1.28l-0.85,3.4l-1.52,2.73l-2.76,-0.5l-2.4,1.13l-0.21,0.45l0.64,2.57l-0.32,3.2l-0.94,0.06l-0.37,0.89l-0.91,-1.01l-0.64,0.07l-0.92,1.57l-3.73,1.25l-0.26,0.48l0.26,1.06l-1.5,-0.08l-1.09,-0.86l-0.56,0.06l-1.67,2.06l-2.7,1.56l-2.03,1.88l-3.4,0.83l-1.93,1.4l-1.15,0.34l0.33,-0.7l-0.41,-0.89l1.79,-1.79l0.02,-0.54l-1.32,-1.56l-0.48,-0.1l-2.24,1.09l-2.83,2.06l-1.51,1.83l-2.28,0.13l-1.55,1.49l-0.04,0.5l1.32,1.97l2.0,0.58l0.31,1.35l1.98,0.84l3.0,-1.96l2.0,1.02l1.49,0.11l0.22,0.83l-3.37,0.86l-1.12,1.48l-2.5,1.52l-1.29,1.99l0.14,0.56l2.57,1.48l0.97,2.7l3.17,4.63l-0.03,1.66l-1.35,0.65l-0.2,0.51l0.6,1.47l1.4,0.91l-0.89,3.82l-1.43,0.38l-3.85,6.44l-2.27,3.11l-6.78,4.57l-2.73,0.29l-1.45,1.04l-0.62,-0.61l-0.55,-0.01l-1.36,1.25l-3.39,1.27l-2.61,0.4l-1.1,2.79l-0.81,0.09l-0.49,-1.42l0.5,-0.85l-0.25,-0.59l-3.36,-0.84l-1.3,0.4l-2.31,-0.62l-0.94,-0.84l0.33,-1.28l-0.3,-0.49l-2.19,-0.46l-1.13,-0.93l-0.47,-0.02l-2.06,1.36l-4.29,0.28l-2.76,1.05l-0.28,0.43l0.32,2.53l-0.59,-0.03l-0.19,-1.34l-0.55,-0.34l-1.68,0.7l-2.46,-1.23l0.62,-1.87l-0.26,-0.51l-1.37,-0.44l-0.54,-2.22l-0.45,-0.3l-2.13,0.35l0.24,-2.48l2.39,-2.4l0.03,-4.31l-1.19,-0.92l-0.78,-1.49l-0.41,-0.21l-1.41,0.19l-1.98,-0.3l0.46,-1.07l-1.17,-1.7l-0.55,-0.11l-1.63,1.05l-2.25,-0.57l-2.89,1.73l-2.25,1.98l-1.75,0.29l-1.17,-0.71l-3.31,-0.65l-1.48,0.79l-1.04,1.27l-0.12,-1.17l-0.54,-0.34l-1.44,0.54l-5.55,-0.86l-1.98,-1.16l-1.89,-0.54l-0.99,-1.35l-1.34,-0.37l-2.55,-1.79l-2.01,-0.84l-1.21,0.56l-5.57,-3.45l-0.53,-2.31l1.19,0.25l0.48,-0.37l0.08,-1.42l-0.98,-1.56l0.15,-2.44l-2.69,-3.32l-4.12,-1.23l-0.67,-2.0l-1.92,-1.48l-0.38,-0.7l-0.51,-3.01l-1.52,-0.66l-0.7,0.13l-0.48,-2.05l0.55,-0.51l-0.09,-0.82l2.03,-1.19l1.6,-0.54l2.56,0.38l0.42,-0.22l0.85,-1.7l3.0,-0.33l1.1,-1.26l4.05,-1.77l0.39,-0.91l-0.17,-1.44l1.45,-0.67l0.2,-0.52l-2.07,-4.9l4.51,-1.12l1.37,-0.73l1.89,-5.51l4.98,0.86l1.51,-1.7l0.11,-2.87l1.99,-0.38l1.83,-2.06l0.49,-0.13l0.68,2.08l2.23,1.77l3.44,1.16l1.55,2.29l-0.92,3.49l0.96,1.67l6.54,1.13l2.95,1.87l1.47,0.35l1.06,2.62l1.53,1.91l3.05,0.08l5.14,0.67l3.37,-0.41l2.36,0.43l3.65,1.8l3.06,0.04l1.45,0.88l2.87,-1.59l3.95,-1.02l3.83,-0.14l3.06,-1.14l1.77,-1.6l1.72,-1.01l0.17,-0.49l-1.1,-2.05l1.02,-1.54l4.02,0.8l2.45,-1.61l3.76,-1.19l1.96,-2.13l1.63,-0.83l3.51,-0.4l1.92,0.34l0.46,-0.3l0.17,-1.5l-2.27,-2.22l-2.11,-1.09l-2.18,1.11l-2.32,-0.47l-1.29,0.32l-0.4,-0.82l2.73,-5.16l3.02,1.06l3.53,-2.06l0.18,-1.68l2.16,-3.35l1.49,-1.35l-0.03,-1.85l-1.07,-0.85l1.54,-1.26l2.98,-0.59l3.23,-0.09l3.64,0.99l2.04,1.16l3.29,6.71l0.92,3.19ZM696.92,237.31l-1.87,1.08l-1.63,-0.64l-0.06,-1.79l1.03,-0.98l2.58,-0.69l1.16,0.05l0.3,0.54l-0.98,1.06l-0.53,1.37Z\",\n      name: \"China\"\n    },\n    CM: {\n      path: \"M457.92,257.49l1.05,1.91l-1.4,0.16l-1.05,-0.23l-0.45,0.22l-0.54,1.19l0.08,0.45l1.48,1.47l1.05,0.45l1.01,2.46l-1.52,2.99l-0.68,0.68l-0.13,3.69l2.38,3.84l1.09,0.8l0.24,2.48l-3.67,-1.14l-11.27,-0.13l0.23,-1.79l-0.98,-1.66l-1.19,-0.54l-0.44,-0.97l-0.6,-0.42l1.71,-4.27l0.75,-0.13l1.38,-1.36l0.65,-0.03l1.71,0.99l1.93,-1.12l1.14,-3.18l1.38,-1.17l2.0,-5.14l2.17,-2.13l0.3,-1.64l-0.86,-0.88l0.03,-0.33l0.94,1.28l0.07,3.22Z\",\n      name: \"Cameroon\"\n    },\n    CL: {\n      path: \"M246.5,429.18l-3.14,1.83l-0.57,3.16l-0.64,0.05l-2.68,-1.06l-2.82,-2.33l-3.04,-1.89l-0.69,-1.85l0.63,-2.14l-1.21,-2.11l-0.31,-5.37l1.01,-2.91l2.57,-2.38l-0.18,-0.68l-3.16,-0.77l2.05,-2.47l0.77,-4.65l2.32,0.9l0.54,-0.29l1.31,-6.31l-0.22,-0.44l-1.68,-0.8l-0.56,0.28l-0.7,3.36l-0.81,-0.22l1.56,-9.41l1.15,-2.24l-0.71,-2.82l-0.18,-2.84l1.01,-0.33l3.26,-9.14l1.07,-4.22l-0.56,-4.21l0.74,-2.34l-0.29,-3.27l1.46,-3.34l2.04,-16.59l-0.66,-7.76l1.03,-0.53l0.54,-0.9l0.79,1.14l0.32,1.78l1.25,1.16l-0.69,2.55l1.33,2.9l0.97,3.59l0.46,0.29l1.5,-0.3l0.11,0.23l-0.76,2.44l-2.57,1.23l-0.23,0.37l0.08,4.33l-0.46,0.77l0.56,1.21l-1.58,1.51l-1.68,2.62l-0.89,2.47l0.2,2.7l-1.48,2.73l1.12,5.09l0.64,0.61l-0.01,2.29l-1.38,2.68l0.01,2.4l-1.89,2.04l0.02,2.75l0.69,2.57l-1.43,1.13l-1.26,5.68l0.39,3.51l-0.97,0.89l0.58,3.5l1.02,1.14l-0.65,1.02l0.15,0.57l1.0,0.53l0.16,0.69l-1.03,0.85l0.26,1.75l-0.89,4.03l-1.31,2.66l0.24,1.75l-0.71,1.83l-1.99,1.7l0.3,3.67l0.88,1.19l1.58,0.01l0.01,2.21l1.04,1.95l5.98,0.63ZM248.69,430.79l0.0,7.33l0.4,0.4l3.52,0.05l-0.44,0.75l-1.94,0.98l-2.49,-0.37l-1.88,-1.06l-2.55,-0.49l-5.59,-3.71l-2.38,-2.63l4.1,2.48l3.32,1.23l0.45,-0.12l1.29,-1.57l0.83,-2.32l2.05,-1.24l1.31,0.29Z\",\n      name: \"Chile\"\n    },\n    CA: {\n      path: \"M280.06,145.6l-1.67,2.88l0.07,0.49l0.5,0.04l1.46,-0.98l1.0,0.42l-0.56,0.72l0.17,0.62l2.22,0.89l1.35,-0.71l1.95,0.78l-0.66,2.01l0.5,0.51l1.32,-0.42l0.98,3.17l-0.91,2.41l-0.8,0.08l-1.23,-0.45l0.47,-2.25l-0.89,-0.83l-0.48,0.06l-2.78,2.63l-0.34,-0.02l1.02,-0.85l-0.14,-0.69l-2.4,-0.77l-7.4,0.08l-0.17,-0.41l1.3,-0.94l0.02,-0.64l-0.73,-0.58l1.85,-1.74l2.57,-5.16l1.47,-1.79l1.99,-1.05l0.46,0.06l-1.53,2.45ZM68.32,74.16l4.13,0.95l4.02,2.14l2.61,0.4l2.47,-1.89l2.88,-1.31l3.85,0.48l3.71,-1.94l3.82,-1.04l1.56,1.68l0.49,0.08l1.87,-1.04l0.65,-1.98l1.24,0.35l4.16,3.94l0.54,0.01l2.75,-2.49l0.26,2.59l0.49,0.35l3.08,-0.73l1.04,-1.27l2.73,0.23l3.83,1.86l5.86,1.61l3.47,0.75l2.44,-0.26l2.73,1.78l-2.98,1.81l-0.19,0.41l0.31,0.32l4.53,0.92l6.87,-0.5l2.0,-0.69l2.49,2.39l0.53,0.02l2.72,-2.16l-0.02,-0.64l-2.16,-1.54l1.15,-1.06l4.83,-0.61l1.84,0.95l2.48,2.31l3.01,-0.23l4.55,1.92l3.85,-0.67l3.61,0.1l0.41,-0.44l-0.25,-2.36l1.79,-0.61l3.49,1.32l-0.01,3.77l0.31,0.39l0.45,-0.22l1.48,-3.16l1.74,0.1l0.41,-0.3l1.13,-4.37l-2.78,-3.11l-2.8,-1.74l0.19,-4.64l2.71,-3.07l2.98,0.67l2.41,1.95l3.19,4.8l-1.99,1.97l0.21,0.68l4.33,0.84l-0.01,4.15l0.25,0.37l0.44,-0.09l3.07,-3.15l2.54,2.39l-0.61,3.33l2.42,2.88l0.61,0.0l2.61,-3.08l1.88,-3.82l0.17,-4.58l6.72,0.94l3.13,2.04l0.13,1.82l-1.76,2.19l-0.01,0.49l1.66,2.16l-0.26,1.71l-4.68,2.8l-3.28,0.61l-2.47,-1.2l-0.55,0.23l-0.73,2.04l-2.38,3.43l-0.74,1.77l-2.74,2.57l-3.44,0.25l-2.21,1.78l-0.28,2.53l-2.82,0.55l-3.12,3.22l-2.72,4.31l-1.03,3.17l-0.14,4.31l0.33,0.41l3.44,0.57l2.24,5.95l0.45,0.23l3.4,-0.69l4.52,1.51l2.43,1.31l1.91,1.73l3.1,0.96l2.62,1.46l6.6,0.54l-0.35,2.74l0.81,3.53l1.81,3.78l3.83,3.3l0.45,0.04l2.1,-1.28l1.37,-3.69l-1.31,-5.38l-1.45,-1.58l3.57,-1.47l2.84,-2.46l1.52,-2.8l-0.25,-2.55l-1.7,-3.07l-2.85,-2.61l2.8,-3.95l-1.08,-3.37l-0.79,-5.67l1.36,-0.7l6.76,1.41l2.12,-0.96l5.12,3.36l1.05,1.61l4.08,0.26l-0.06,2.87l0.83,4.7l0.3,0.32l2.16,0.54l1.73,2.06l0.5,0.09l3.63,-2.03l2.52,-4.19l1.26,-1.32l7.6,11.72l-0.92,2.04l0.16,0.51l3.3,1.97l2.22,1.98l4.1,0.98l1.43,0.99l0.95,2.79l2.1,0.68l0.84,1.08l0.17,3.45l-3.37,2.26l-4.22,1.24l-3.06,2.63l-4.06,0.51l-5.35,-0.69l-6.39,0.2l-2.3,2.41l-3.26,1.51l-6.47,7.15l-0.06,0.48l0.44,0.19l2.13,-0.52l4.17,-4.24l5.12,-2.62l3.52,-0.3l1.69,1.21l-2.12,2.21l0.81,3.47l1.02,2.61l3.47,1.6l4.14,-0.45l2.15,-2.8l0.26,1.48l1.14,0.8l-2.56,1.69l-5.5,1.82l-2.54,1.27l-2.74,2.15l-1.4,-0.16l-0.07,-2.01l4.14,-2.44l0.18,-0.45l-0.39,-0.29l-6.63,0.45l-1.39,-1.49l-0.14,-4.43l-1.11,-0.91l-1.82,0.39l-0.66,-0.66l-0.6,0.03l-1.91,2.39l-0.82,2.52l-0.8,1.27l-1.67,0.56l-0.46,0.76l-8.31,0.07l-1.21,0.62l-2.35,1.97l-0.71,-0.14l-1.37,0.96l-1.12,-0.48l-4.74,1.26l-0.9,1.17l0.21,0.62l1.73,0.3l-1.81,0.31l-1.85,0.81l-2.11,-0.13l-2.95,1.78l-0.69,-0.09l1.39,-2.1l1.73,-1.21l0.1,-2.29l1.16,-1.99l0.49,0.53l2.03,0.42l1.2,-1.16l0.02,-0.47l-2.66,-3.51l-2.28,-0.61l-5.64,-0.71l-0.4,-0.57l-0.79,0.13l0.2,-0.41l-0.22,-0.55l-0.68,-0.26l0.19,-1.26l-0.78,-0.73l0.31,-0.64l-0.29,-0.57l-2.6,-0.44l-0.75,-1.63l-0.94,-0.66l-4.31,-0.65l-1.13,1.19l-1.48,0.59l-0.85,1.06l-2.83,-0.76l-2.09,0.39l-2.39,-0.97l-4.24,-0.7l-0.57,-0.4l-0.41,-1.63l-0.4,-0.3l-0.85,0.02l-0.39,0.4l-0.01,0.85l-69.13,-0.01l-6.51,-4.52l-4.5,-1.38l-1.26,-2.66l0.33,-1.93l-0.23,-0.43l-3.01,-1.35l-0.55,-2.77l-2.89,-2.38l-0.04,-1.45l1.39,-1.83l-0.28,-2.55l-4.16,-2.2l-4.07,-6.6l-4.02,-3.22l-1.3,-1.88l-0.5,-0.13l-2.51,1.21l-2.23,1.87l-3.85,-3.88l-2.44,-1.04l-2.22,-0.13l0.03,-37.49ZM260.37,148.65l3.04,0.76l2.26,1.2l-3.78,-0.95l-1.53,-1.01ZM249.4,3.81l6.68,0.49l5.32,0.79l4.26,1.57l-0.07,1.1l-5.85,2.53l-6.02,1.21l-2.39,1.39l-0.18,0.45l0.39,0.29l4.01,-0.02l-4.65,2.82l-4.2,1.74l-4.19,4.59l-5.03,0.92l-1.67,1.15l-7.47,0.59l-0.37,0.37l0.32,0.42l2.41,0.49l-0.81,0.47l-0.12,0.59l1.83,2.41l-2.02,1.59l-3.81,1.51l-1.32,2.16l-3.38,1.53l-0.22,0.48l0.35,1.19l0.4,0.29l3.88,-0.18l0.03,0.61l-6.33,2.95l-6.41,-1.4l-7.43,0.79l-3.72,-0.62l-4.4,-0.25l-0.23,-1.83l4.29,-1.11l0.28,-0.51l-1.1,-3.45l1.0,-0.25l6.58,2.28l0.47,-0.16l-0.05,-0.49l-3.41,-3.45l-3.58,-0.98l1.48,-1.55l4.34,-1.29l0.97,-2.19l-0.16,-0.48l-3.42,-2.13l-0.81,-2.26l6.2,0.22l2.24,0.58l3.91,-2.1l0.2,-0.43l-0.35,-0.32l-5.64,-0.67l-8.73,0.36l-4.26,-1.9l-2.12,-2.4l-2.78,-1.66l-0.41,-1.52l3.31,-1.03l2.93,-0.2l4.91,-0.99l3.7,-2.27l2.87,0.3l2.62,1.67l0.56,-0.14l1.82,-3.2l3.13,-0.94l4.44,-0.69l7.53,-0.26l1.48,0.67l7.19,-1.06l10.8,0.79ZM203.85,57.54l0.01,0.42l1.97,2.97l0.68,-0.02l2.24,-3.72l5.95,-1.86l4.01,4.64l-0.35,2.91l0.5,0.43l4.95,-1.36l2.32,-1.8l5.31,2.28l3.27,2.11l0.3,1.84l0.48,0.33l4.42,-0.99l2.64,2.87l5.97,1.77l2.06,1.72l2.11,3.71l-4.19,1.86l-0.01,0.73l5.9,2.83l3.94,0.94l3.78,3.95l3.46,0.25l-0.63,2.37l-4.11,4.47l-2.76,-1.56l-3.9,-3.94l-3.59,0.41l-0.33,0.34l-0.19,2.72l2.63,2.38l3.42,1.89l0.94,0.97l1.55,3.75l-0.7,2.29l-2.74,-0.92l-6.25,-3.15l-0.51,0.13l0.05,0.52l6.07,5.69l0.18,0.59l-6.09,-1.39l-5.31,-2.24l-2.63,-1.66l0.6,-0.77l-0.12,-0.6l-7.39,-4.01l-0.59,0.37l0.03,0.79l-6.73,0.6l-1.69,-1.1l1.36,-2.46l4.51,-0.07l5.15,-0.52l0.31,-0.6l-0.74,-1.3l0.78,-1.84l3.21,-4.05l-0.67,-2.35l-1.11,-1.6l-3.84,-2.1l-4.35,-1.28l0.91,-0.63l0.06,-0.61l-2.65,-2.75l-2.34,-0.36l-1.89,-1.46l-0.53,0.03l-1.24,1.23l-4.36,0.55l-9.04,-0.99l-9.26,-1.98l-1.6,-1.22l2.22,-1.77l0.13,-0.44l-0.38,-0.27l-3.22,-0.02l-0.72,-4.25l1.83,-4.04l2.42,-1.85l5.5,-1.1l-1.39,2.35ZM261.19,159.33l2.07,0.61l1.44,-0.04l-1.15,0.63l-2.94,-1.23l-0.4,-0.68l0.36,-0.37l0.61,1.07ZM230.83,84.39l-2.37,0.18l-0.49,-1.63l0.93,-2.09l1.94,-0.51l1.62,0.99l0.02,1.52l-1.66,1.54ZM229.43,58.25l0.11,0.65l-4.87,-0.21l-2.72,0.62l-3.1,-2.57l0.08,-1.26l0.86,-0.23l5.57,0.51l4.08,2.5ZM222.0,105.02l-0.72,1.49l-0.63,-0.19l-0.48,-0.84l0.81,-0.99l0.65,0.05l0.37,0.46ZM183.74,38.32l2.9,1.7l4.79,-0.01l1.84,1.46l-0.49,1.68l0.23,0.48l2.82,1.14l1.76,1.26l7.01,0.65l4.1,-1.1l5.03,-0.43l3.93,0.35l2.48,1.77l0.46,1.7l-1.3,1.1l-3.56,1.01l-3.23,-0.59l-7.17,0.76l-5.09,0.09l-3.99,-0.6l-6.42,-1.54l-0.79,-2.51l-0.3,-2.49l-2.64,-2.5l-5.32,-0.72l-2.52,-1.4l0.68,-1.57l4.78,0.31ZM207.38,91.35l0.4,1.56l0.56,0.26l1.06,-0.52l1.32,0.96l5.42,2.57l0.2,1.68l0.46,0.35l1.68,-0.28l1.15,0.85l-1.55,0.87l-3.61,-0.88l-1.32,-1.69l-0.57,-0.06l-2.45,2.1l-3.12,1.79l-0.7,-1.87l-0.42,-0.26l-2.16,0.24l1.39,-1.39l0.32,-3.14l0.76,-3.35l1.18,0.22ZM215.49,102.6l-2.67,1.95l-1.4,-0.07l-0.3,-0.58l1.53,-1.48l2.84,0.18ZM202.7,24.12l2.53,1.59l-2.87,1.4l-4.53,4.05l-4.25,0.38l-5.03,-0.68l-2.45,-2.04l0.03,-1.62l1.82,-1.37l0.14,-0.45l-0.38,-0.27l-4.45,0.04l-2.59,-1.76l-1.41,-2.29l1.57,-2.32l1.62,-1.66l2.44,-0.39l0.25,-0.65l-0.6,-0.74l4.86,-0.25l3.24,3.11l8.16,2.3l1.9,3.61ZM187.47,59.2l-2.76,3.49l-2.38,-0.15l-1.44,-3.84l0.04,-2.2l1.19,-1.88l2.3,-1.23l5.07,0.17l4.11,1.02l-3.24,3.72l-2.88,0.89ZM186.07,48.79l-1.08,1.53l-3.34,-0.34l-2.56,-1.1l1.03,-1.75l3.25,-1.23l1.95,1.58l0.75,1.3ZM185.71,35.32l-5.3,-0.2l-0.32,-0.71l4.31,0.07l1.3,0.84ZM180.68,32.48l-3.34,1.0l-1.79,-1.1l-0.98,-1.87l-0.15,-1.73l4.1,0.53l2.67,1.7l-0.51,1.47ZM180.9,76.31l-1.1,1.08l-3.13,-1.23l-2.12,0.43l-2.71,-1.57l1.72,-1.09l1.55,-1.72l3.81,1.9l1.98,2.2ZM169.74,54.87l2.96,0.97l4.17,-0.57l0.41,0.88l-2.14,2.11l0.09,0.64l3.55,1.92l-0.4,3.72l-3.79,1.65l-2.17,-0.35l-1.72,-1.74l-6.02,-3.5l0.03,-0.85l4.68,0.54l0.4,-0.21l-0.05,-0.45l-2.48,-2.81l2.46,-1.95ZM174.45,40.74l1.37,1.73l0.07,2.44l-1.05,3.45l-3.79,0.47l-2.32,-0.69l0.05,-2.64l-0.44,-0.41l-3.68,0.35l-0.12,-3.1l2.45,0.1l3.67,-1.73l3.41,0.29l0.37,-0.26ZM170.05,31.55l0.67,1.56l-3.33,-0.49l-4.22,-1.77l-4.35,-0.16l1.4,-0.94l-0.06,-0.7l-2.81,-1.23l-0.12,-1.39l4.39,0.68l6.62,1.98l1.81,2.47ZM134.5,58.13l-1.02,1.82l0.45,0.58l5.4,-1.39l3.33,2.29l0.49,-0.03l2.6,-2.23l1.94,1.32l2.0,4.5l0.7,0.06l1.3,-2.29l-1.63,-4.46l1.69,-0.54l2.31,0.71l2.65,1.81l2.49,7.92l8.48,4.27l-0.19,1.35l-3.79,0.33l-0.26,0.67l1.4,1.49l-0.58,1.1l-4.23,-0.64l-4.43,-1.19l-3.0,0.28l-4.66,1.47l-10.52,1.04l-1.43,-2.02l-3.42,-1.2l-2.21,0.43l-2.51,-2.86l4.84,-1.05l3.6,0.19l3.27,-0.78l0.31,-0.39l-0.31,-0.39l-4.84,-1.06l-8.79,0.27l-0.85,-1.07l5.26,-1.66l0.27,-0.45l-0.4,-0.34l-3.8,0.06l-3.81,-1.06l1.81,-3.01l1.66,-1.79l6.48,-2.81l1.97,0.71ZM158.7,56.61l-1.7,2.44l-3.2,-2.75l0.37,-0.3l3.11,-0.18l1.42,0.79ZM149.61,42.73l1.01,1.89l0.5,0.18l2.14,-0.82l2.23,0.19l0.36,2.04l-1.33,2.09l-8.28,0.76l-6.35,2.15l-3.41,0.1l-0.19,-0.96l4.9,-2.08l0.23,-0.46l-0.41,-0.31l-11.25,0.59l-2.89,-0.74l3.04,-4.44l2.14,-1.32l6.81,1.69l4.58,3.06l4.37,0.39l0.36,-0.63l-3.36,-4.6l1.85,-1.53l2.18,0.51l0.77,2.26ZM144.76,34.41l-4.36,1.44l-3.0,-1.4l1.46,-1.24l3.47,-0.52l2.96,0.71l-0.52,1.01ZM145.13,29.83l-1.9,0.66l-3.67,-0.0l2.27,-1.61l3.3,0.95ZM118.92,65.79l-6.03,2.02l-1.33,-1.9l-5.38,-2.28l2.59,-5.05l2.16,-3.14l-0.02,-0.48l-1.97,-2.41l7.64,-0.7l3.6,1.02l6.3,0.27l4.42,2.95l-2.53,0.98l-6.24,3.43l-3.1,3.28l-0.11,2.01ZM129.54,35.53l-0.28,3.37l-1.72,1.62l-2.33,0.28l-4.61,2.19l-3.86,0.76l-2.64,-0.87l3.72,-3.4l5.01,-3.34l3.72,0.07l3.0,-0.67ZM111.09,152.69l-0.67,0.24l-3.85,-1.37l-0.83,-1.17l-2.12,-1.07l-0.66,-1.02l-2.4,-0.55l-0.74,-1.71l6.02,1.45l2.0,2.55l2.52,1.39l0.73,1.27ZM87.8,134.64l0.89,0.29l1.86,-0.21l-0.65,3.34l1.69,2.33l-1.31,-1.33l-0.99,-1.62l-1.17,-0.98l-0.33,-1.82Z\",\n      name: \"Canada\"\n    },\n    CG: {\n      path: \"M466.72,276.48l-0.1,1.03l-1.25,2.97l-0.19,3.62l-0.46,1.78l-0.23,0.63l-1.61,1.19l-1.21,1.39l-1.09,2.43l0.04,2.09l-3.25,3.24l-0.5,-0.24l-0.5,-0.83l-1.36,-0.02l-0.98,0.89l-1.68,-0.99l-1.54,1.24l-1.52,-1.96l1.57,-1.14l0.11,-0.52l-0.77,-1.35l2.1,-0.66l0.39,-0.73l1.05,0.82l2.21,0.11l1.12,-1.37l0.37,-1.81l-0.27,-2.09l-1.13,-1.5l1.0,-2.69l-0.13,-0.45l-0.92,-0.58l-1.6,0.17l-0.51,-0.94l0.1,-0.61l2.75,0.09l3.97,1.24l0.51,-0.33l0.17,-1.28l1.24,-2.21l1.28,-1.14l2.76,0.49Z\",\n      name: \"Congo\"\n    },\n    CF: {\n      path: \"M461.16,278.2l-0.26,-1.19l-1.09,-0.77l-0.84,-1.17l-0.29,-1.0l-1.04,-1.15l0.08,-3.43l0.58,-0.49l1.16,-2.35l1.85,-0.17l0.61,-0.62l0.97,0.58l3.15,-0.96l2.48,-1.92l0.02,-0.96l2.81,0.02l2.36,-1.17l1.93,-2.85l1.16,-0.93l1.11,-0.3l0.27,0.86l1.34,1.47l-0.39,2.01l0.3,1.01l4.01,2.75l0.17,0.93l2.63,2.31l0.6,1.44l2.08,1.4l-3.84,-0.21l-1.94,0.88l-1.23,-0.49l-2.67,1.2l-1.29,-0.18l-0.51,0.36l-0.6,1.22l-3.35,-0.65l-1.57,-0.91l-2.42,-0.83l-1.45,0.91l-0.97,1.27l-0.26,1.56l-3.22,-0.43l-1.49,1.33l-0.94,1.62Z\",\n      name: \"Central African Rep.\"\n    },\n    CD: {\n      path: \"M487.01,272.38l2.34,-0.14l1.35,1.84l1.34,0.45l0.86,-0.39l1.21,0.12l1.07,-0.41l0.54,0.89l2.04,1.54l-0.14,2.72l0.7,0.54l-1.38,1.13l-1.53,2.54l-0.17,2.05l-0.59,1.08l-0.02,1.72l-0.72,0.84l-0.66,3.01l0.63,1.32l-0.44,4.26l0.64,1.47l-0.37,1.22l0.86,1.8l1.53,1.41l0.3,1.26l0.44,0.5l-4.08,0.75l-0.92,1.81l0.51,1.34l-0.74,5.43l0.17,0.38l2.45,1.46l0.54,-0.1l0.12,1.62l-1.28,-0.01l-1.85,-2.35l-1.94,-0.45l-0.48,-1.13l-0.55,-0.2l-1.41,0.74l-1.71,-0.3l-1.01,-1.18l-2.49,-0.19l-0.44,-0.77l-1.98,-0.21l-2.88,0.36l0.11,-2.41l-0.85,-1.13l-0.16,-1.36l0.32,-1.73l-0.46,-0.89l-0.04,-1.49l-0.4,-0.39l-2.53,0.02l0.1,-0.41l-0.39,-0.49l-1.28,0.01l-0.43,0.45l-1.62,0.32l-0.83,1.79l-1.09,-0.28l-2.4,0.52l-1.37,-1.91l-1.3,-3.3l-0.38,-0.27l-7.39,-0.03l-2.46,0.42l0.5,-0.45l0.37,-1.47l0.66,-0.38l0.92,0.08l0.73,-0.82l0.87,0.02l0.31,0.68l1.4,0.36l3.59,-3.63l0.01,-2.23l1.02,-2.29l2.69,-2.39l0.43,-0.99l0.49,-1.96l0.17,-3.51l1.25,-2.95l0.36,-3.14l0.86,-1.13l1.1,-0.66l3.57,1.73l3.65,0.73l0.46,-0.21l0.8,-1.46l1.24,0.19l2.61,-1.17l0.81,0.44l1.04,-0.03l0.59,-0.66l0.7,-0.16l1.81,0.25Z\",\n      name: \"Dem. Rep. Congo\"\n    },\n    CZ: {\n      path: \"M458.46,144.88l1.22,1.01l1.47,0.23l0.13,0.93l1.36,0.68l0.54,-0.2l0.24,-0.55l1.15,0.25l0.53,1.09l1.68,0.18l0.6,0.84l-1.04,0.73l-0.96,1.28l-1.6,0.17l-0.55,0.56l-1.04,-0.46l-1.05,0.15l-2.12,-0.96l-1.05,0.34l-1.2,1.12l-1.56,-0.87l-2.57,-2.1l-0.53,-1.88l4.7,-2.52l0.71,0.26l0.9,-0.28Z\",\n      name: \"Czech Rep.\"\n    },\n    CY: {\n      path: \"M504.36,193.47l0.43,0.28l-1.28,0.57l-0.92,-0.28l-0.24,-0.46l2.01,-0.13Z\",\n      name: \"Cyprus\"\n    },\n    CR: {\n      path: \"M211.34,258.05l0.48,0.99l1.6,1.6l-0.54,0.45l0.29,1.42l-0.25,1.19l-1.09,-0.59l-0.05,-1.25l-2.46,-1.42l-0.28,-0.77l-0.66,-0.45l-0.45,-0.0l-0.11,1.04l-1.32,-0.95l0.31,-1.3l-0.36,-0.6l0.31,-0.27l1.42,0.58l1.29,-0.14l0.56,0.56l0.74,0.17l0.55,-0.27Z\",\n      name: \"Costa Rica\"\n    },\n    CU: {\n      path: \"M221.21,227.25l1.27,1.02l2.19,-0.28l4.43,3.33l2.08,0.43l-0.1,0.38l0.36,0.5l1.75,0.1l1.48,0.84l-3.11,0.51l-4.15,-0.03l0.77,-0.67l-0.04,-0.64l-1.2,-0.74l-1.49,-0.16l-0.7,-0.61l-0.56,-1.4l-0.4,-0.25l-1.34,0.1l-2.2,-0.66l-0.88,-0.58l-3.18,-0.4l-0.27,-0.16l0.58,-0.74l-0.36,-0.29l-2.72,-0.05l-1.7,1.29l-0.91,0.03l-0.61,0.69l-1.01,0.22l1.11,-1.29l1.01,-0.52l3.69,-1.01l3.98,0.21l2.21,0.84Z\",\n      name: \"Cuba\"\n    },\n    SZ: {\n      path: \"M500.35,351.36l0.5,2.04l-0.38,0.89l-1.05,0.21l-1.23,-1.2l-0.02,-0.64l0.83,-1.57l1.34,0.27Z\",\n      name: \"Swaziland\"\n    },\n    SY: {\n      path: \"M511.0,199.79l0.05,-1.33l0.54,-1.36l1.28,-0.99l0.13,-0.45l-0.41,-1.11l-1.14,-0.36l-0.19,-1.74l0.52,-1.0l1.29,-1.21l0.2,-1.18l0.59,0.23l2.62,-0.76l1.36,0.52l2.06,-0.01l2.95,-1.08l3.25,-0.26l-0.67,0.94l-1.28,0.66l-0.21,0.4l0.23,2.01l-0.88,3.19l-10.15,5.73l-2.15,-0.85Z\",\n      name: \"Syria\"\n    },\n    KG: {\n      path: \"M621.35,172.32l-3.87,1.69l-0.96,1.18l-3.04,0.34l-1.13,1.86l-2.36,-0.35l-1.99,0.63l-2.39,1.4l0.06,0.95l-0.4,0.37l-4.52,0.43l-3.02,-0.93l-2.37,0.17l0.11,-0.79l2.32,0.42l1.13,-0.88l1.99,0.2l3.21,-2.14l-0.03,-0.69l-2.97,-1.57l-1.94,0.65l-1.22,-0.74l1.71,-1.58l-0.12,-0.67l-0.36,-0.15l0.32,-0.77l1.36,-0.35l4.02,1.02l0.49,-0.3l0.35,-1.59l1.09,-0.48l3.42,1.22l1.11,-0.31l7.64,0.39l1.16,1.0l1.23,0.39Z\",\n      name: \"Kyrgyzstan\"\n    },\n    KE: {\n      path: \"M506.26,284.69l1.87,-2.56l0.93,-2.15l-1.38,-4.08l-1.06,-1.6l2.82,-2.75l0.79,0.26l0.12,1.41l0.86,0.83l1.9,0.11l3.28,2.13l3.57,0.44l1.05,-1.12l1.96,-0.9l0.82,0.68l1.16,0.09l-1.78,2.45l0.03,9.12l1.3,1.94l-1.37,0.78l-0.67,1.03l-1.08,0.46l-0.34,1.67l-0.81,1.07l-0.45,1.55l-0.68,0.56l-3.2,-2.23l-0.35,-1.58l-8.86,-4.98l0.14,-1.6l-0.57,-1.04Z\",\n      name: \"Kenya\"\n    },\n    SS: {\n      path: \"M481.71,263.34l1.07,-0.72l1.2,-3.18l1.36,-0.26l1.61,1.99l0.87,0.34l1.1,-0.41l1.5,0.07l0.57,0.53l2.49,0.0l0.44,-0.63l1.07,-0.4l0.45,-0.84l0.59,-0.33l1.9,1.33l1.6,-0.2l2.83,-3.33l-0.32,-2.21l1.59,-0.52l-0.24,1.6l0.3,1.83l1.35,1.18l0.2,1.87l0.35,0.41l0.02,1.53l-0.23,0.47l-1.42,0.25l-0.85,1.44l0.3,0.6l1.4,0.16l1.11,1.08l0.59,1.13l1.03,0.53l1.28,2.36l-4.41,3.98l-1.74,0.01l-1.89,0.55l-1.47,-0.52l-1.15,0.57l-2.96,-2.62l-1.3,0.49l-1.06,-0.15l-0.79,0.39l-0.82,-0.22l-1.8,-2.7l-1.91,-1.1l-0.66,-1.5l-2.62,-2.32l-0.18,-0.94l-2.37,-1.6Z\",\n      name: \"S. Sudan\"\n    },\n    SR: {\n      path: \"M283.12,270.19l2.1,0.53l-1.08,1.95l0.2,1.72l0.93,1.49l-0.59,2.03l-0.43,0.71l-1.12,-0.42l-1.32,0.22l-0.93,-0.2l-0.46,0.26l-0.25,0.73l0.33,0.7l-0.89,-0.13l-1.39,-1.97l-0.31,-1.34l-0.97,-0.31l-0.89,-1.47l0.35,-1.61l1.45,-0.82l0.33,-1.87l2.61,0.44l0.57,-0.47l1.75,-0.16Z\",\n      name: \"Suriname\"\n    },\n    KH: {\n      path: \"M689.52,249.39l0.49,1.45l-0.28,2.74l-4.0,1.86l-0.16,0.6l0.68,0.95l-2.06,0.17l-2.05,0.97l-1.82,-0.32l-2.12,-3.7l-0.55,-2.85l1.4,-1.85l3.02,-0.45l2.23,0.35l2.01,0.98l0.51,-0.14l0.95,-1.48l1.74,0.74Z\",\n      name: \"Cambodia\"\n    },\n    SV: {\n      path: \"M195.8,250.13l1.4,-1.19l2.24,1.45l0.98,-0.27l0.44,0.2l-0.27,1.05l-1.14,-0.03l-3.64,-1.21Z\",\n      name: \"El Salvador\"\n    },\n    SK: {\n      path: \"M476.82,151.17l-1.14,1.9l-2.73,-0.92l-0.82,0.2l-0.74,0.8l-3.46,0.73l-0.47,0.69l-1.76,0.33l-1.88,-1.0l-0.18,-0.81l0.38,-0.75l1.87,-0.32l1.74,-1.89l0.83,0.16l0.79,-0.34l1.51,1.04l1.34,-0.63l1.25,0.3l1.65,-0.42l1.81,0.95Z\",\n      name: \"Slovakia\"\n    },\n    KR: {\n      path: \"M737.51,185.84l0.98,-0.1l0.87,-1.17l2.69,-0.32l0.33,-0.29l1.76,2.79l0.58,1.76l0.02,3.12l-0.8,1.32l-2.21,0.55l-1.93,1.13l-1.8,0.19l-0.2,-1.1l0.43,-2.28l-0.95,-2.56l1.43,-0.37l0.23,-0.62l-1.43,-2.06Z\",\n      name: \"Korea\"\n    },\n    SI: {\n      path: \"M456.18,162.07l-0.51,-1.32l0.18,-1.05l1.69,0.2l1.42,-0.71l2.09,-0.07l0.62,-0.51l0.21,0.47l-1.61,0.67l-0.44,1.34l-0.66,0.24l-0.26,0.82l-1.22,-0.49l-0.84,0.46l-0.69,-0.04Z\",\n      name: \"Slovenia\"\n    },\n    KP: {\n      path: \"M736.77,185.16l-0.92,-0.42l-0.88,0.62l-1.21,-0.88l0.96,-1.15l0.59,-2.59l-0.46,-0.74l-2.09,-0.77l1.64,-1.52l2.72,-1.58l1.58,-1.91l1.11,0.78l2.17,0.11l0.41,-0.5l-0.3,-1.22l3.52,-1.18l0.94,-1.4l0.98,1.08l-2.19,2.18l0.01,2.14l-1.06,0.54l-1.41,1.4l-1.7,0.52l-1.25,1.09l-0.14,1.98l0.94,0.45l1.15,1.04l-0.13,0.26l-2.6,0.29l-1.13,1.29l-1.22,0.08Z\",\n      name: \"Dem. Rep. Korea\"\n    },\n    SO: {\n      path: \"M525.13,288.48l-1.13,-1.57l-0.03,-8.86l2.66,-3.38l1.67,-0.13l2.13,-1.69l3.41,-0.23l7.08,-7.55l2.91,-3.69l0.08,-4.82l2.98,-0.67l1.24,-0.86l0.45,-0.0l-0.2,3.0l-1.21,3.62l-2.73,5.97l-2.13,3.65l-5.03,6.16l-8.56,6.4l-2.78,3.08l-0.8,1.56Z\",\n      name: \"Somalia\"\n    },\n    SN: {\n      path: \"M390.09,248.21l0.12,1.55l0.49,1.46l0.96,0.82l0.05,1.28l-1.26,-0.19l-0.75,0.33l-1.84,-0.61l-5.84,-0.13l-2.54,0.51l-0.22,-1.03l1.77,0.04l2.01,-0.91l1.03,0.48l1.09,0.04l1.29,-0.62l0.14,-0.58l-0.51,-0.74l-1.81,0.25l-1.13,-0.63l-0.79,0.04l-0.72,0.61l-2.31,0.06l-0.92,-1.77l-0.81,-0.64l0.64,-0.35l2.46,-3.74l1.04,0.19l1.38,-0.56l1.19,-0.02l2.72,1.37l3.03,3.48Z\",\n      name: \"Senegal\"\n    },\n    SL: {\n      path: \"M394.46,264.11l-1.73,1.98l-0.58,1.33l-2.07,-1.06l-1.22,-1.26l-0.65,-2.39l1.16,-0.96l0.67,-1.17l1.21,-0.52l1.66,0.0l1.03,1.64l0.52,2.41Z\",\n      name: \"Sierra Leone\"\n    },\n    SB: {\n      path: \"M826.69,311.6l-0.61,0.09l-0.2,-0.33l0.37,0.15l0.44,0.09ZM824.18,307.38l-0.26,-0.3l-0.31,-0.91l0.03,0.0l0.54,1.21ZM823.04,309.33l-1.66,-0.22l-0.2,-0.52l1.16,0.28l0.69,0.46ZM819.28,304.68l1.14,0.65l0.02,0.03l-0.81,-0.44l-0.35,-0.23Z\",\n      name: \"Solomon Is.\"\n    },\n    SA: {\n      path: \"M537.53,210.34l2.0,0.24l0.9,1.32l1.49,-0.06l0.87,2.08l1.29,0.76l0.51,0.99l1.56,1.03l-0.1,1.9l0.32,0.9l1.58,2.47l0.76,0.53l0.7,-0.04l1.68,4.23l7.53,1.33l0.51,-0.29l0.77,1.25l-1.55,4.87l-7.29,2.52l-7.3,1.03l-2.34,1.17l-1.88,2.74l-0.76,0.28l-0.82,-0.78l-0.91,0.12l-2.88,-0.51l-3.51,0.25l-0.86,-0.56l-0.57,0.15l-0.66,1.27l0.16,1.11l-0.43,0.32l-0.93,-1.4l-0.33,-1.16l-1.23,-0.88l-1.27,-2.06l-0.78,-2.22l-1.73,-1.79l-1.14,-0.48l-1.54,-2.31l-0.21,-3.41l-1.44,-2.93l-1.27,-1.16l-1.33,-0.57l-1.31,-3.37l-0.77,-0.67l-0.97,-1.97l-2.8,-4.03l-1.06,-0.17l0.37,-1.96l0.2,-0.72l2.74,0.3l1.08,-0.84l0.6,-0.94l1.74,-0.35l0.65,-1.03l0.71,-0.4l0.1,-0.62l-2.06,-2.28l4.39,-1.22l0.48,-0.37l2.77,0.69l3.66,1.9l7.03,5.5l4.87,0.3Z\",\n      name: \"Saudi Arabia\"\n    },\n    SE: {\n      path: \"M480.22,89.3l-4.03,1.17l-2.43,2.86l0.26,2.57l-8.77,6.64l-1.78,5.79l1.78,2.68l2.22,1.96l-2.07,3.77l-2.72,1.13l-0.95,6.04l-1.29,3.01l-2.74,-0.31l-0.4,0.22l-1.31,2.59l-2.34,0.13l-0.75,-3.09l-2.08,-4.03l-1.83,-4.96l1.0,-1.93l2.14,-2.7l0.83,-4.45l-1.6,-2.17l-0.15,-4.94l1.48,-3.39l2.58,-0.15l0.87,-1.59l-0.78,-1.57l3.76,-5.59l4.04,-7.48l2.17,0.01l0.39,-0.29l0.57,-2.07l4.37,0.64l0.46,-0.34l0.33,-2.56l1.1,-0.13l6.94,4.87l0.06,6.32l0.66,1.36Z\",\n      name: \"Sweden\"\n    },\n    SD: {\n      path: \"M505.98,259.4l-0.34,-0.77l-1.17,-0.9l-0.26,-1.61l0.29,-1.81l-0.34,-0.46l-1.16,-0.17l-0.54,0.59l-1.23,0.11l-0.28,0.65l0.53,0.65l0.17,1.22l-2.44,3.0l-0.96,0.19l-2.39,-1.4l-0.95,0.52l-0.38,0.78l-1.11,0.41l-0.29,0.5l-1.94,0.0l-0.54,-0.52l-1.81,-0.09l-0.95,0.4l-2.45,-2.35l-2.07,0.54l-0.73,1.26l-0.6,2.1l-1.25,0.58l-0.75,-0.62l0.27,-2.65l-1.48,-1.78l-0.22,-1.48l-0.92,-0.96l-0.02,-1.29l-0.57,-1.16l-0.68,-0.16l0.69,-1.29l-0.18,-1.14l0.65,-0.62l0.03,-0.55l-0.36,-0.41l1.55,-2.97l1.91,0.16l0.43,-0.4l-0.1,-10.94l2.49,-0.01l0.4,-0.4l-0.0,-4.82l29.02,0.0l0.64,2.04l-0.49,0.66l0.36,2.69l0.93,3.16l2.12,1.55l-0.89,1.04l-1.72,0.39l-0.98,0.9l-1.43,5.65l0.24,1.15l-0.38,2.06l-0.96,2.38l-1.53,1.31l-1.32,2.91l-1.22,0.86l-0.37,1.34Z\",\n      name: \"Sudan\"\n    },\n    DO: {\n      path: \"M241.8,239.2l0.05,-0.65l-0.46,-0.73l0.42,-0.44l0.19,-1.0l-0.09,-1.53l1.66,0.01l1.99,0.63l0.33,0.67l1.28,0.19l0.33,0.76l1.0,0.08l0.8,0.62l-0.45,0.51l-1.13,-0.47l-1.88,-0.01l-1.27,0.59l-0.75,-0.55l-1.01,0.54l-0.79,1.4l-0.23,-0.61Z\",\n      name: \"Dominican Rep.\"\n    },\n    DJ: {\n      path: \"M528.43,256.18l-0.45,0.66l-0.58,-0.25l-1.51,0.13l-0.18,-1.01l1.45,-1.95l0.83,0.17l0.77,-0.44l0.2,1.0l-1.2,0.51l-0.06,0.7l0.73,0.47Z\",\n      name: \"Djibouti\"\n    },\n    DK: {\n      path: \"M452.28,129.07l-1.19,2.24l-2.13,-1.6l-0.23,-0.95l2.98,-0.95l0.57,1.26ZM447.74,126.31l-0.26,0.57l-0.88,-0.07l-1.8,2.53l0.48,1.69l-1.09,0.36l-1.61,-0.39l-0.89,-1.69l-0.07,-3.43l0.96,-1.73l2.02,-0.2l1.09,-1.07l1.33,-0.67l-0.05,1.06l-0.73,1.41l0.3,1.0l1.2,0.64Z\",\n      name: \"Denmark\"\n    },\n    DE: {\n      path: \"M453.14,155.55l-0.55,-0.36l-1.2,-0.1l-1.87,0.57l-2.13,-0.13l-0.56,0.63l-0.86,-0.6l-0.96,0.09l-2.57,-0.93l-0.85,0.67l-1.47,-0.02l0.24,-1.75l1.23,-2.14l-0.28,-0.59l-3.52,-0.58l-0.92,-0.66l0.12,-1.2l-0.48,-0.88l0.27,-2.17l-0.37,-3.03l1.41,-0.22l0.63,-1.26l0.66,-3.19l-0.41,-1.18l0.26,-0.39l1.66,-0.15l0.33,0.54l0.62,0.07l1.7,-1.69l-0.54,-3.02l1.37,0.33l1.31,-0.37l0.31,1.18l2.25,0.71l-0.02,0.92l0.5,0.4l2.55,-0.65l1.34,-0.87l2.57,1.24l1.06,0.98l0.48,1.44l-0.57,0.74l-0.0,0.48l0.87,1.15l0.57,1.64l-0.14,1.29l0.82,1.7l-1.5,-0.07l-0.56,0.57l-4.47,2.15l-0.22,0.54l0.68,2.26l2.58,2.16l-0.66,1.11l-0.79,0.36l-0.23,0.43l0.32,1.87Z\",\n      name: \"Germany\"\n    },\n    YE: {\n      path: \"M528.27,246.72l0.26,-0.42l-0.22,-1.01l0.19,-1.5l0.92,-0.69l-0.07,-1.35l0.39,-0.75l1.01,0.47l3.34,-0.27l3.76,0.41l0.95,0.81l1.36,-0.58l1.74,-2.62l2.18,-1.09l6.86,-0.94l2.48,5.41l-1.64,0.76l-0.56,1.9l-6.23,2.16l-2.29,1.8l-1.93,0.05l-1.41,1.02l-4.24,0.74l-1.72,1.49l-3.28,0.19l-0.52,-1.18l0.02,-1.51l-1.34,-3.29Z\",\n      name: \"Yemen\"\n    },\n    AT: {\n      path: \"M462.89,152.8l0.04,2.25l-1.07,0.0l-0.33,0.63l0.36,0.51l-1.04,2.13l-2.02,0.07l-1.33,0.7l-5.29,-0.99l-0.47,-0.93l-0.44,-0.21l-2.47,0.55l-0.42,0.51l-3.18,-0.81l0.43,-0.91l1.12,0.78l0.6,-0.17l0.25,-0.58l1.93,0.12l1.86,-0.56l1.0,0.08l0.68,0.57l0.62,-0.15l0.26,-0.77l-0.3,-1.78l0.8,-0.44l0.68,-1.15l1.52,0.85l0.47,-0.06l1.34,-1.25l0.64,-0.17l1.81,0.92l1.28,-0.11l0.7,0.37Z\",\n      name: \"Austria\"\n    },\n    DZ: {\n      path: \"M441.46,188.44l-0.32,1.07l0.39,2.64l-0.54,2.16l-1.58,1.82l0.37,2.39l1.91,1.55l0.18,0.8l1.42,1.03l1.84,7.23l0.12,1.16l-0.57,5.0l0.2,1.51l-0.87,0.99l-0.02,0.51l1.41,1.86l0.14,1.2l0.89,1.48l0.5,0.16l0.98,-0.41l1.73,1.08l0.82,1.23l-8.22,4.81l-7.23,5.11l-3.43,1.13l-2.3,0.21l-0.28,-1.59l-2.56,-1.09l-0.67,-1.25l-26.12,-17.86l0.01,-3.47l3.77,-1.88l2.44,-0.41l2.12,-0.75l1.08,-1.42l2.81,-1.05l0.35,-2.08l1.33,-0.29l1.04,-0.94l3.47,-0.69l0.46,-1.08l-0.1,-0.45l-0.58,-0.52l-0.82,-2.81l-0.19,-1.83l-0.78,-1.49l2.03,-1.31l2.63,-0.48l1.7,-1.22l2.31,-0.84l8.24,-0.73l1.49,0.38l2.28,-1.1l2.46,-0.02l0.92,0.6l1.35,-0.05Z\",\n      name: \"Algeria\"\n    },\n    US: {\n      path: \"M892.72,99.2l1.31,0.53l1.41,-0.37l1.89,0.98l1.89,0.42l-1.32,0.58l-2.9,-1.53l-2.08,0.22l-0.26,-0.15l0.07,-0.67ZM183.22,150.47l0.37,1.47l1.12,0.85l4.23,0.7l2.39,0.98l2.17,-0.38l1.85,0.5l-1.55,0.65l-3.49,2.61l-0.16,0.77l0.5,0.39l2.33,-0.61l1.77,1.02l5.15,-2.4l-0.31,0.65l0.25,0.56l1.36,0.38l1.71,1.16l4.7,-0.88l0.67,0.85l1.31,0.21l0.58,0.58l-1.34,0.17l-2.18,-0.32l-3.6,0.89l-2.71,3.25l0.35,0.9l0.59,-0.0l0.55,-0.6l-1.36,4.65l0.29,3.09l0.67,1.58l0.61,0.45l1.77,-0.44l1.6,-1.96l0.14,-2.21l-0.82,-1.96l0.11,-1.13l1.19,-2.37l0.44,-0.33l0.48,0.75l0.4,-0.29l0.4,-1.37l0.6,-0.47l0.24,-0.8l1.69,0.49l1.65,1.08l-0.03,2.37l-1.27,1.13l-0.0,1.13l0.87,0.36l1.66,-1.29l0.5,0.17l0.5,2.6l-2.49,3.75l0.17,0.61l1.54,0.62l1.48,0.17l1.92,-0.44l4.72,-2.15l2.16,-1.8l-0.05,-1.24l0.75,-0.22l3.92,0.36l2.12,-1.05l0.21,-0.4l-0.28,-1.48l3.27,-2.4l8.32,-0.02l0.56,-0.82l1.9,-0.77l0.93,-1.51l0.74,-2.37l1.58,-1.98l0.92,0.62l1.47,-0.47l0.8,0.66l-0.0,4.09l1.96,2.6l-2.34,1.31l-5.37,2.09l-1.83,2.72l0.02,1.79l0.83,1.59l0.54,0.23l-6.19,0.94l-2.2,0.89l-0.23,0.48l0.45,0.29l2.99,-0.46l-2.19,0.56l-1.13,0.0l-0.15,-0.32l-0.48,0.08l-0.76,0.82l0.22,0.67l0.32,0.06l-0.41,1.62l-1.27,1.58l-1.48,-1.07l-0.49,-0.04l-0.16,0.46l0.52,1.58l0.61,0.59l0.03,0.79l-0.95,1.38l-1.21,-1.22l-0.27,-2.27l-0.35,-0.35l-0.42,0.25l-0.48,1.27l0.33,1.41l-0.97,-0.27l-0.48,0.24l0.18,0.5l1.52,0.83l0.1,2.52l0.79,0.51l0.52,3.42l-1.42,1.88l-2.47,0.8l-1.71,1.66l-1.31,0.25l-1.27,1.03l-0.43,0.99l-2.69,1.78l-2.64,3.03l-0.45,2.12l0.45,2.08l0.85,2.38l1.09,1.9l0.04,1.2l1.16,3.06l-0.18,2.69l-0.55,1.43l-0.47,0.21l-0.89,-0.23l-0.49,-1.18l-0.87,-0.56l-2.75,-5.16l0.48,-1.68l-0.72,-1.78l-2.01,-2.38l-1.12,-0.53l-2.72,1.18l-1.47,-1.35l-1.57,-0.68l-2.99,0.31l-2.17,-0.3l-2.0,0.19l-1.15,0.46l-0.19,0.58l0.39,0.63l0.14,1.34l-0.84,-0.2l-0.84,0.46l-1.58,-0.07l-2.08,-1.44l-2.09,0.33l-1.91,-0.62l-3.73,0.84l-2.39,2.07l-2.54,1.22l-1.45,1.41l-0.61,1.38l0.34,3.71l-0.29,0.02l-3.5,-1.33l-1.25,-3.11l-1.44,-1.5l-2.24,-3.56l-1.76,-1.09l-2.27,-0.01l-1.71,2.07l-1.76,-0.69l-1.16,-0.74l-1.52,-2.98l-3.93,-3.16l-4.34,-0.0l-0.4,0.4l-0.0,0.74l-6.5,0.02l-9.02,-3.14l-0.34,-0.71l-5.7,0.49l-0.43,-1.29l-1.62,-1.61l-1.14,-0.38l-0.55,-0.88l-1.28,-0.13l-1.01,-0.77l-2.22,-0.27l-0.43,-0.3l-0.36,-1.58l-2.4,-2.83l-2.01,-3.85l-0.06,-0.9l-2.92,-3.26l-0.33,-2.29l-1.3,-1.66l0.52,-2.37l-0.09,-2.57l-0.78,-2.3l0.95,-2.82l0.61,-5.68l-0.47,-4.27l-1.46,-4.08l3.19,0.79l1.26,2.83l0.69,0.08l0.69,-1.14l-1.1,-4.79l68.76,-0.0l0.4,-0.4l0.14,-0.86ZM32.44,67.52l1.73,1.97l0.55,0.05l0.99,-0.79l3.65,0.24l-0.09,0.62l0.32,0.45l3.83,0.77l2.61,-0.43l5.19,1.4l4.84,0.43l1.89,0.57l3.42,-0.7l6.14,1.87l-0.03,38.06l0.38,0.4l2.39,0.11l2.31,0.98l3.9,3.99l0.55,0.04l2.4,-2.03l2.16,-1.04l1.2,1.71l3.95,3.14l4.09,6.63l4.2,2.29l0.06,1.83l-1.02,1.23l-1.16,-1.08l-2.04,-1.03l-0.67,-2.89l-3.28,-3.03l-1.65,-3.57l-6.35,-0.32l-2.82,-1.01l-5.26,-3.85l-6.77,-2.04l-3.53,0.3l-4.81,-1.69l-3.25,-1.63l-2.78,0.8l-0.28,0.46l0.44,2.21l-3.91,0.96l-2.26,1.27l-2.3,0.65l-0.27,-1.65l1.05,-3.42l2.49,-1.09l0.16,-0.6l-0.69,-0.96l-0.55,-0.1l-3.19,2.12l-1.78,2.56l-3.55,2.61l-0.04,0.61l1.56,1.52l-2.07,2.29l-5.11,2.57l-0.77,1.66l-3.76,1.77l-0.92,1.73l-2.69,1.38l-1.81,-0.22l-6.95,3.32l-3.97,0.91l4.85,-2.5l2.59,-1.86l3.26,-0.52l1.19,-1.4l3.42,-2.1l2.59,-2.27l0.42,-2.68l1.23,-2.1l-0.04,-0.46l-0.45,-0.11l-2.68,1.03l-0.63,-0.49l-0.53,0.03l-1.05,1.04l-1.36,-1.54l-0.66,0.08l-0.32,0.62l-0.58,-1.14l-0.56,-0.16l-2.41,1.42l-1.07,-0.0l-0.17,-1.75l0.3,-1.71l-1.61,-1.33l-3.41,0.59l-1.96,-1.63l-1.57,-0.84l-0.15,-2.21l-1.7,-1.43l0.82,-1.88l1.99,-2.12l0.88,-1.92l1.71,-0.24l2.04,0.51l1.87,-1.77l1.91,0.25l1.91,-1.23l0.17,-0.43l-0.47,-1.82l-1.07,-0.7l1.39,-1.17l0.12,-0.45l-0.39,-0.26l-1.65,0.07l-2.66,0.88l-0.75,0.78l-1.92,-0.8l-3.46,0.44l-3.44,-0.91l-1.06,-1.61l-2.65,-1.99l2.91,-1.43l5.5,-2.0l1.52,0.0l-0.26,1.62l0.41,0.46l5.29,-0.16l0.3,-0.65l-2.03,-2.59l-3.14,-1.68l-1.79,-2.12l-2.4,-1.83l-3.09,-1.24l1.04,-1.69l4.23,-0.14l3.36,-2.07l0.73,-2.27l2.39,-1.99l2.42,-0.52l4.65,-1.97l2.46,0.23l3.71,-2.35l3.5,0.89ZM37.6,123.41l-2.25,1.23l-0.95,-0.69l-0.29,-1.24l3.21,-1.63l1.42,0.21l0.67,0.7l-1.8,1.42ZM31.06,234.03l0.98,0.47l0.74,0.87l-1.77,1.07l-0.44,-1.53l0.49,-0.89ZM29.34,232.07l0.18,0.05l0.08,0.05l-0.16,0.03l-0.11,-0.14ZM25.16,230.17l0.05,-0.03l0.18,0.22l-0.13,-0.01l-0.1,-0.18ZM5.89,113.26l-1.08,0.41l-2.21,-1.12l1.53,-0.4l1.62,0.28l0.14,0.83Z\",\n      name: \"United States\"\n    },\n    LV: {\n      path: \"M489.16,122.85l0.96,0.66l0.22,1.65l0.68,1.76l-3.65,1.7l-2.23,-1.58l-1.29,-0.26l-0.68,-0.77l-2.42,0.34l-4.16,-0.23l-2.47,0.9l0.06,-1.98l1.13,-2.06l1.95,-1.02l2.12,2.58l2.01,-0.07l0.38,-0.33l0.44,-2.52l1.76,-0.53l3.06,1.7l2.15,0.07Z\",\n      name: \"Latvia\"\n    },\n    UY: {\n      path: \"M286.85,372.74l-0.92,1.5l-2.59,1.44l-1.69,-0.52l-1.42,0.26l-2.39,-1.19l-1.52,0.08l-1.27,-1.3l0.16,-1.5l0.56,-0.79l-0.02,-2.73l1.21,-4.74l1.19,-0.21l2.37,2.0l1.08,0.03l4.36,3.17l1.22,1.6l-0.96,1.5l0.61,1.4Z\",\n      name: \"Uruguay\"\n    },\n    LB: {\n      path: \"M510.37,198.01l-0.88,0.51l1.82,-3.54l0.62,0.08l0.22,0.61l-1.13,0.88l-0.65,1.47Z\",\n      name: \"Lebanon\"\n    },\n    LA: {\n      path: \"M689.54,248.53l-1.76,-0.74l-0.49,0.15l-0.94,1.46l-1.32,-0.64l0.62,-0.98l0.11,-2.17l-2.04,-2.42l-0.25,-2.65l-1.9,-2.1l-2.15,-0.31l-0.78,0.91l-1.12,0.06l-1.05,-0.4l-2.06,1.2l-0.04,-1.59l0.61,-2.68l-0.36,-0.49l-1.35,-0.1l-0.11,-1.23l-0.96,-0.88l1.96,-1.89l0.39,0.36l1.33,0.07l0.42,-0.45l-0.34,-2.66l0.7,-0.21l1.28,1.81l1.11,2.35l0.36,0.23l2.82,0.02l0.71,1.67l-1.39,0.65l-0.72,0.93l0.13,0.6l2.91,1.51l3.6,5.25l1.88,1.78l0.56,1.62l-0.35,1.96Z\",\n      name: \"Lao PDR\"\n    },\n    TW: {\n      path: \"M724.01,226.68l-0.74,1.48l-0.9,-1.52l-0.25,-1.74l1.38,-2.44l1.73,-1.74l0.64,0.44l-1.85,5.52Z\",\n      name: \"Taiwan\"\n    },\n    TT: {\n      path: \"M266.64,259.32l0.28,-1.16l1.13,-0.22l-0.06,1.2l-1.35,0.18Z\",\n      name: \"Trinidad and Tobago\"\n    },\n    TR: {\n      path: \"M513.21,175.47l3.64,1.17l3.05,-0.44l2.1,0.26l3.11,-1.56l2.46,-0.13l2.19,1.33l0.33,0.82l-0.22,1.33l0.25,0.44l2.28,1.13l-1.17,0.57l-0.21,0.45l0.75,3.2l-0.41,1.16l1.13,1.92l-0.55,0.22l-0.9,-0.67l-2.91,-0.37l-1.24,0.46l-4.23,0.41l-2.81,1.05l-1.91,0.01l-1.52,-0.53l-2.58,0.75l-0.66,-0.45l-0.62,0.3l-0.12,1.45l-0.89,0.84l-0.47,-0.67l0.79,-1.3l-0.41,-0.2l-1.43,0.23l-2.0,-0.63l-2.02,1.65l-3.51,0.3l-2.13,-1.53l-2.7,-0.1l-0.86,1.24l-1.38,0.27l-2.29,-1.44l-2.71,-0.01l-1.37,-2.65l-1.68,-1.52l1.07,-1.99l-0.09,-0.49l-1.27,-1.12l2.37,-2.41l3.7,-0.11l1.28,-2.24l4.49,0.37l3.21,-1.97l2.81,-0.82l3.99,-0.06l4.29,2.07ZM488.79,176.72l-1.72,1.31l-0.5,-0.88l1.37,-2.57l-0.7,-0.85l1.7,-0.63l1.8,0.34l0.46,1.17l1.76,0.78l-2.87,0.32l-1.3,1.01Z\",\n      name: \"Turkey\"\n    },\n    LK: {\n      path: \"M624.16,268.99l-1.82,0.48l-0.99,-1.67l-0.42,-3.46l0.95,-3.43l1.21,0.98l2.26,4.19l-0.34,2.33l-0.85,0.58Z\",\n      name: \"Sri Lanka\"\n    },\n    TN: {\n      path: \"M448.1,188.24l-1.0,1.27l-0.02,1.32l0.84,0.88l-0.28,2.09l-1.53,1.32l-0.12,0.42l0.48,1.54l1.42,0.32l0.53,1.11l0.9,0.52l-0.11,1.67l-3.54,2.64l-0.1,2.38l-0.58,0.3l-0.96,-4.45l-1.54,-1.25l-0.16,-0.78l-1.92,-1.56l-0.18,-1.76l1.51,-1.62l0.59,-2.34l-0.38,-2.78l0.42,-1.21l2.45,-1.05l1.29,0.26l-0.06,1.11l0.58,0.38l1.47,-0.73Z\",\n      name: \"Tunisia\"\n    },\n    TL: {\n      path: \"M734.55,307.93l-0.1,-0.97l4.5,-0.86l-2.82,1.28l-1.59,0.55Z\",\n      name: \"Timor-Leste\"\n    },\n    TM: {\n      path: \"M553.03,173.76l-0.04,0.34l-0.09,-0.22l0.13,-0.12ZM555.87,172.66l0.45,-0.1l1.48,0.74l2.06,2.43l4.07,-0.18l0.38,-0.51l-0.32,-1.19l1.92,-0.94l1.91,-1.59l2.94,1.39l0.43,2.47l1.19,0.67l2.58,-0.13l0.62,0.4l1.32,3.12l4.54,3.44l2.67,1.45l3.06,1.14l-0.04,1.05l-1.33,-0.75l-0.59,0.19l-0.32,0.84l-2.2,0.81l-0.46,2.13l-1.21,0.74l-1.91,0.42l-0.73,1.33l-1.56,0.31l-2.22,-0.94l-0.2,-2.17l-0.38,-0.36l-1.73,-0.09l-2.76,-2.46l-2.14,-0.4l-2.84,-1.48l-1.78,-0.27l-1.24,0.53l-1.57,-0.08l-2.0,1.69l-1.7,0.43l-0.36,-1.58l0.36,-2.98l-0.22,-0.4l-1.65,-0.84l0.54,-1.69l-0.34,-0.52l-1.22,-0.13l0.36,-1.64l2.22,0.59l2.2,-0.95l0.12,-0.65l-1.77,-1.74l-0.66,-1.57Z\",\n      name: \"Turkmenistan\"\n    },\n    TJ: {\n      path: \"M597.75,178.82l-2.54,-0.44l-0.47,0.34l-0.24,1.7l0.43,0.45l2.64,-0.22l3.18,0.95l4.39,-0.41l0.56,2.37l0.52,0.29l0.67,-0.24l1.11,0.49l0.21,2.13l-3.76,-0.21l-1.8,1.32l-1.76,0.74l-0.61,-0.58l0.21,-2.23l-0.64,-0.49l-0.07,-0.93l-1.36,-0.66l-0.45,0.07l-1.08,1.01l-0.55,1.48l-1.31,-0.05l-0.95,1.16l-0.9,-0.35l-1.86,0.74l1.26,-2.83l-0.54,-2.17l-1.67,-0.82l0.33,-0.66l2.18,-0.04l1.19,-1.63l0.76,-1.79l2.43,-0.5l-0.26,1.0l0.73,1.05Z\",\n      name: \"Tajikistan\"\n    },\n    LS: {\n      path: \"M491.06,363.48l-0.49,0.15l-1.49,-1.67l1.1,-1.43l2.19,-1.44l1.51,1.27l-0.98,1.82l-1.23,0.38l-0.62,0.93Z\",\n      name: \"Lesotho\"\n    },\n    TH: {\n      path: \"M670.27,255.86l-1.41,3.87l0.15,2.0l0.38,0.36l1.38,0.07l0.9,2.04l0.55,2.34l1.4,1.44l1.61,0.38l0.96,0.97l-0.5,0.64l-1.1,0.2l-0.34,-1.18l-2.04,-1.1l-0.63,0.23l-0.63,-0.62l-0.48,-1.3l-2.56,-2.63l-0.73,0.41l0.95,-3.89l2.16,-4.22ZM670.67,254.77l-0.92,-2.18l-0.26,-2.61l-2.14,-3.06l0.71,-0.49l0.89,-2.59l-3.61,-5.45l0.87,-0.51l1.05,-2.58l1.74,-0.18l2.6,-1.59l0.76,0.56l0.13,1.39l0.37,0.36l1.23,0.09l-0.51,2.28l0.05,2.42l0.6,0.34l2.43,-1.42l0.77,0.39l1.47,-0.07l0.71,-0.88l1.48,0.14l1.71,1.88l0.25,2.65l1.92,2.11l-0.1,1.89l-0.61,0.86l-2.22,-0.33l-3.5,0.64l-1.6,2.12l0.36,2.58l-1.51,-0.79l-1.84,-0.01l0.28,-1.52l-0.4,-0.47l-2.21,0.01l-0.4,0.37l-0.19,2.74l-0.34,0.93Z\",\n      name: \"Thailand\"\n    },\n    TF: {\n      path: \"M596.68,420.38l-3.2,0.18l-0.05,-1.26l0.39,-1.41l1.3,0.78l2.08,0.35l-0.52,1.36Z\",\n      name: \"Fr. S. Antarctic Lands\"\n    },\n    TG: {\n      path: \"M422.7,257.63l-0.09,1.23l1.53,1.52l0.08,1.09l0.5,0.65l-0.11,5.62l0.49,1.47l-1.31,0.35l-1.02,-2.13l-0.18,-1.12l0.53,-2.19l-0.63,-1.16l-0.22,-3.68l-1.01,-1.4l0.07,-0.28l1.37,0.03Z\",\n      name: \"Togo\"\n    },\n    TD: {\n      path: \"M480.25,235.49l0.12,9.57l-2.1,0.05l-1.14,1.89l-0.69,1.63l0.34,0.73l-0.66,0.91l0.24,0.89l-0.86,1.95l0.45,0.5l0.6,-0.1l0.34,0.64l0.03,1.38l0.9,1.04l-1.45,0.43l-1.27,1.03l-1.83,2.76l-2.16,1.07l-2.31,-0.15l-0.86,0.25l-0.26,0.49l0.17,0.61l-2.11,1.68l-2.85,0.87l-1.09,-0.57l-0.73,0.66l-1.12,0.1l-1.1,-3.12l-1.25,-0.64l-1.22,-1.22l0.29,-0.64l3.01,0.04l0.35,-0.6l-1.3,-2.2l-0.08,-3.31l-0.97,-1.66l0.22,-1.04l-0.38,-0.48l-1.22,-0.04l0.0,-1.25l-0.98,-1.07l0.96,-3.01l3.25,-2.65l0.13,-3.33l0.95,-5.18l0.52,-1.07l-0.1,-0.48l-0.91,-0.78l-0.2,-0.96l-0.8,-0.58l-0.55,-3.65l2.1,-1.2l19.57,9.83Z\",\n      name: \"Chad\"\n    },\n    LY: {\n      path: \"M483.48,203.15l-0.75,1.1l0.29,1.39l-0.6,1.83l0.73,2.14l0.0,24.12l-2.48,0.01l-0.41,0.85l-19.41,-9.76l-4.41,2.28l-1.37,-1.33l-3.82,-1.1l-1.14,-1.65l-1.98,-1.23l-1.22,0.32l-0.66,-1.11l-0.17,-1.26l-1.28,-1.69l0.87,-1.19l-0.07,-4.34l0.43,-2.27l-0.86,-3.45l1.13,-0.76l0.22,-1.16l-0.2,-1.03l3.48,-2.61l0.29,-1.94l2.45,0.8l1.18,-0.21l1.98,0.44l3.15,1.18l1.37,2.54l5.72,1.67l2.64,1.35l1.61,-0.72l1.29,-1.34l-0.44,-2.34l0.66,-1.13l1.67,-1.21l1.57,-0.35l3.14,0.53l1.08,1.28l3.99,0.78l0.36,0.54Z\",\n      name: \"Libya\"\n    },\n    AE: {\n      path: \"M550.76,223.97l1.88,-0.4l3.84,0.02l4.78,-4.75l0.19,0.36l0.26,1.58l-0.81,0.01l-0.39,0.35l-0.08,2.04l-0.81,0.63l-0.01,0.96l-0.66,0.99l-0.39,1.41l-7.08,-1.25l-0.7,-1.96Z\",\n      name: \"United Arab Emirates\"\n    },\n    VE: {\n      path: \"M240.68,256.69l0.53,0.75l-0.02,1.06l-1.07,1.78l0.95,2.0l0.42,0.22l1.4,-0.44l0.56,-1.83l-0.77,-1.17l-0.1,-1.47l2.82,-0.93l0.26,-0.49l-0.28,-0.96l0.3,-0.28l0.66,1.31l1.96,0.26l1.4,1.22l0.08,0.68l0.39,0.35l4.81,-0.22l1.49,1.11l1.92,0.31l1.67,-0.84l0.22,-0.6l3.44,-0.14l-0.17,0.55l0.86,1.19l2.19,0.35l1.67,1.1l0.37,1.86l0.41,0.32l1.55,0.17l-1.66,1.35l-0.22,0.92l0.65,0.97l-1.67,0.54l-0.3,0.4l0.04,0.99l-0.56,0.57l-0.01,0.55l1.85,2.27l-0.66,0.69l-4.47,1.29l-0.72,0.54l-3.69,-0.9l-0.71,0.27l-0.02,0.7l0.91,0.53l-0.08,1.54l0.35,1.58l0.35,0.31l1.66,0.17l-1.3,0.52l-0.48,1.13l-2.68,0.91l-0.6,0.77l-1.57,0.13l-1.17,-1.13l-0.8,-2.52l-1.25,-1.26l1.02,-1.23l-1.29,-2.95l0.18,-1.62l1.0,-2.21l-0.2,-0.49l-1.14,-0.46l-4.02,0.36l-1.82,-2.1l-1.57,-0.33l-2.99,0.22l-1.06,-0.97l0.25,-1.23l-0.2,-1.01l-0.59,-0.69l-0.29,-1.06l-1.08,-0.39l0.78,-2.79l1.9,-2.11Z\",\n      name: \"Venezuela\"\n    },\n    AF: {\n      path: \"M600.7,188.88l-1.57,1.3l-0.1,0.48l0.8,2.31l-1.09,1.04l-0.03,1.27l-0.48,0.71l-2.16,-0.08l-0.37,0.59l0.78,1.48l-1.38,0.69l-1.06,1.69l0.06,1.7l-0.65,0.52l-0.91,-0.21l-1.91,0.36l-0.48,0.77l-1.88,0.13l-1.4,1.56l-0.18,2.32l-2.91,1.02l-1.65,-0.23l-0.71,0.55l-1.41,-0.3l-2.41,0.39l-3.52,-1.17l1.96,-2.35l-0.21,-1.78l-0.3,-0.34l-1.63,-0.4l-0.19,-1.58l-0.75,-2.03l0.95,-1.36l-0.19,-0.6l-0.73,-0.28l1.47,-4.8l2.14,0.9l2.12,-0.36l0.74,-1.34l1.77,-0.39l1.54,-0.92l0.63,-2.31l1.87,-0.5l0.49,-0.81l0.94,0.56l2.13,0.11l2.55,0.92l1.95,-0.83l0.65,0.43l0.56,-0.13l0.69,-1.12l1.57,-0.08l0.72,-1.66l0.79,-0.74l0.8,0.39l-0.17,0.56l0.71,0.58l-0.08,2.39l1.11,0.95ZM601.37,188.71l1.73,-0.71l1.43,-1.18l4.03,0.35l-2.23,0.74l-4.95,0.8Z\",\n      name: \"Afghanistan\"\n    },\n    IQ: {\n      path: \"M530.82,187.47l0.79,0.66l1.26,-0.28l1.46,3.08l1.63,0.94l0.14,1.23l-1.22,1.05l-0.53,2.52l1.73,2.67l3.12,1.62l1.15,1.88l-0.38,1.85l0.39,0.48l0.41,-0.0l0.02,1.07l0.76,0.94l-2.47,-0.1l-1.71,2.44l-4.31,-0.2l-7.02,-5.48l-3.73,-1.94l-2.88,-0.73l-0.85,-2.87l5.45,-3.02l0.95,-3.43l-0.19,-1.96l1.27,-0.7l1.22,-1.7l0.87,-0.36l2.69,0.34Z\",\n      name: \"Iraq\"\n    },\n    IS: {\n      path: \"M384.14,88.06l-0.37,2.61l2.54,2.51l-2.9,2.75l-9.19,3.4l-9.25,-1.66l1.7,-1.22l-0.1,-0.7l-4.05,-1.47l2.96,-0.53l0.33,-0.43l-0.11,-1.2l-0.33,-0.36l-4.67,-0.85l1.28,-2.04l3.45,-0.56l3.77,2.72l0.44,0.02l3.64,-2.16l3.3,1.08l3.98,-2.16l3.58,0.26Z\",\n      name: \"Iceland\"\n    },\n    IR: {\n      path: \"M533.43,187.16l-1.27,-2.15l0.42,-0.98l-0.71,-3.04l1.03,-0.5l0.33,0.83l1.26,1.35l2.05,0.51l1.11,-0.16l2.89,-2.11l0.62,-0.14l0.39,0.46l-0.72,1.2l0.06,0.49l1.56,1.53l0.65,0.04l0.67,1.81l2.56,0.83l1.87,1.48l3.69,0.49l3.91,-0.76l0.47,-0.73l2.17,-0.6l1.66,-1.54l1.51,0.08l1.18,-0.53l1.59,0.24l2.83,1.48l1.88,0.3l2.77,2.47l1.77,0.18l0.18,1.99l-1.68,5.49l0.24,0.5l0.61,0.23l-0.82,1.48l0.8,2.18l0.19,1.71l0.3,0.34l1.63,0.4l0.15,1.32l-2.15,2.35l-0.01,0.53l2.21,3.03l2.34,1.24l0.06,2.14l1.24,0.72l0.11,0.69l-3.31,1.27l-1.08,3.03l-9.68,-1.68l-0.99,-3.05l-1.43,-0.73l-2.17,0.46l-2.47,1.26l-2.83,-0.82l-2.46,-2.02l-2.41,-0.8l-3.42,-6.06l-0.48,-0.2l-1.18,0.39l-1.44,-0.82l-0.5,0.08l-0.65,0.74l-0.97,-1.01l-0.02,-1.31l-0.71,-0.39l0.26,-1.81l-1.29,-2.11l-3.13,-1.63l-1.58,-2.43l0.5,-1.9l1.31,-1.26l-0.19,-1.66l-1.74,-1.1l-1.57,-3.3Z\",\n      name: \"Iran\"\n    },\n    AM: {\n      path: \"M536.99,182.33l-0.28,0.03l-1.23,-2.13l-0.93,0.01l-0.62,-0.66l-0.69,-0.07l-0.96,-0.81l-1.56,-0.62l0.19,-1.12l-0.26,-0.79l2.72,-0.36l1.09,1.01l-0.17,0.92l1.02,0.78l-0.47,0.62l0.08,0.56l2.04,1.23l0.04,1.4Z\",\n      name: \"Armenia\"\n    },\n    IT: {\n      path: \"M451.59,158.63l3.48,0.94l-0.21,1.17l0.3,0.83l-1.49,-0.24l-2.04,1.1l-0.21,0.39l0.13,1.45l-0.25,1.12l0.82,1.57l2.39,1.63l1.31,2.54l2.79,2.43l2.05,0.08l0.21,0.23l-0.39,0.33l0.09,0.67l4.05,1.97l2.17,1.76l-0.16,0.36l-1.17,-1.08l-2.18,-0.49l-0.44,0.2l-1.05,1.91l0.14,0.54l1.57,0.95l-0.19,0.98l-1.06,0.33l-1.25,2.34l-0.37,0.08l0.0,-0.33l1.0,-2.45l-1.73,-3.17l-1.12,-0.51l-0.88,-1.33l-1.51,-0.51l-1.27,-1.25l-1.75,-0.18l-4.12,-3.21l-1.62,-1.65l-1.03,-3.19l-3.53,-1.36l-1.3,0.51l-1.69,1.41l0.16,-0.72l-0.28,-0.47l-1.14,-0.33l-0.53,-1.96l0.72,-0.78l0.04,-0.48l-0.65,-1.17l0.8,0.39l1.4,-0.23l1.11,-0.84l0.52,0.35l1.19,-0.1l0.75,-1.2l1.53,0.33l1.36,-0.56l0.35,-1.14l1.08,0.32l0.68,-0.64l1.98,-0.44l0.42,0.82ZM459.19,184.75l-0.65,1.65l0.32,1.05l-0.31,0.89l-1.5,-0.85l-4.5,-1.67l0.19,-0.82l2.67,0.23l3.78,-0.48ZM443.93,176.05l1.18,1.66l-0.3,3.32l-1.06,-0.01l-0.77,0.73l-0.53,-0.44l-0.1,-3.37l-0.39,-1.22l1.04,0.01l0.92,-0.68Z\",\n      name: \"Italy\"\n    },\n    VN: {\n      path: \"M690.56,230.25l-2.7,1.82l-2.09,2.46l-0.63,1.95l4.31,6.45l2.32,1.65l1.43,1.94l1.11,4.59l-0.32,4.24l-1.93,1.54l-2.84,1.61l-2.11,2.15l-2.73,2.06l-0.59,-1.05l0.63,-1.53l-0.13,-0.47l-1.34,-1.04l1.51,-0.71l2.55,-0.18l0.3,-0.63l-0.82,-1.14l4.0,-2.07l0.31,-3.05l-0.57,-1.77l0.42,-2.66l-0.73,-1.97l-1.86,-1.76l-3.63,-5.29l-2.72,-1.46l0.36,-0.47l1.5,-0.64l0.21,-0.52l-0.97,-2.27l-0.37,-0.24l-2.83,-0.02l-2.24,-3.9l0.83,-0.4l4.39,-0.29l2.06,-1.31l1.15,0.89l1.88,0.4l-0.17,1.51l1.35,1.16l1.67,0.45Z\",\n      name: \"Vietnam\"\n    },\n    AR: {\n      path: \"M249.29,428.93l-2.33,-0.52l-5.83,-0.43l-0.89,-1.66l0.05,-2.37l-0.45,-0.4l-1.43,0.18l-0.67,-0.91l-0.2,-3.13l1.88,-1.47l0.79,-2.04l-0.25,-1.7l1.3,-2.68l0.91,-4.15l-0.22,-1.69l0.85,-0.45l0.2,-0.44l-0.27,-1.16l-0.98,-0.68l0.59,-0.92l-0.05,-0.5l-1.04,-1.07l-0.52,-3.1l0.97,-0.86l-0.42,-3.58l1.2,-5.43l1.38,-0.98l0.16,-0.43l-0.75,-2.79l-0.01,-2.43l1.78,-1.75l0.06,-2.57l1.43,-2.85l0.01,-2.58l-0.69,-0.74l-1.09,-4.52l1.47,-2.7l-0.18,-2.79l0.85,-2.35l1.59,-2.46l1.73,-1.64l0.05,-0.52l-0.6,-0.84l0.44,-0.85l-0.07,-4.19l2.7,-1.44l0.86,-2.75l-0.21,-0.71l1.76,-2.01l2.9,0.57l1.38,1.78l0.68,-0.08l0.87,-1.87l2.39,0.09l4.95,4.77l2.17,0.49l3.0,1.92l2.47,1.0l0.25,0.82l-2.37,3.93l0.23,0.59l5.39,1.16l2.12,-0.44l2.45,-2.16l0.5,-2.38l0.76,-0.31l0.98,1.2l-0.04,1.8l-3.67,2.51l-2.85,2.66l-3.43,3.88l-1.3,5.07l0.01,2.72l-0.54,0.73l-0.36,3.28l3.14,2.64l-0.16,2.11l1.4,1.11l-0.1,1.09l-2.29,3.52l-3.55,1.49l-4.92,0.6l-2.71,-0.29l-0.43,0.51l0.5,1.65l-0.49,2.1l0.38,1.42l-1.19,0.83l-2.36,0.38l-2.3,-1.04l-1.38,0.83l0.41,3.64l1.69,0.91l1.4,-0.71l0.36,0.76l-2.04,0.86l-2.01,1.89l-0.97,4.63l-2.34,0.1l-2.09,1.78l-0.61,2.75l2.46,2.31l2.17,0.63l-0.7,2.32l-2.83,1.73l-1.73,3.86l-2.17,1.22l-1.16,1.67l0.75,3.76l1.04,1.28ZM256.71,438.88l-2.0,0.15l-1.4,-1.22l-3.82,-0.1l-0.0,-5.83l1.6,3.05l3.26,2.07l3.08,0.78l-0.71,1.1Z\",\n      name: \"Argentina\"\n    },\n    AU: {\n      path: \"M705.8,353.26l0.26,0.04l0.17,-0.47l-0.48,-1.42l0.92,1.11l0.45,0.15l0.27,-0.39l-0.1,-1.56l-1.98,-3.63l1.09,-3.31l-0.24,-1.57l0.34,-0.62l0.38,1.06l0.43,-0.19l0.99,-1.7l1.91,-0.83l1.29,-1.15l1.81,-0.91l0.96,-0.17l0.92,0.26l1.92,-0.95l1.47,-0.28l1.03,-0.8l1.43,0.04l2.78,-0.84l1.36,-1.15l0.71,-1.45l1.41,-1.26l0.3,-2.58l1.27,-1.59l0.78,1.65l0.54,0.19l1.07,-0.51l0.15,-0.6l-0.73,-1.0l0.45,-0.71l0.78,0.39l0.58,-0.3l0.28,-1.82l1.87,-2.14l1.12,-0.39l0.28,-0.58l0.62,0.17l0.53,-0.73l1.87,-0.57l1.65,1.05l1.35,1.48l3.39,0.38l0.43,-0.54l-0.46,-1.23l1.05,-1.79l1.04,-0.61l0.14,-0.55l-0.25,-0.41l0.88,-1.17l1.31,-0.77l1.3,0.27l2.1,-0.48l0.31,-0.4l-0.05,-1.3l-0.92,-0.77l1.48,0.56l1.41,1.07l2.11,0.65l0.81,-0.2l1.4,0.7l1.69,-0.66l0.8,0.19l0.64,-0.33l0.71,0.77l-1.33,1.94l-0.71,0.07l-0.35,0.51l0.24,0.86l-1.52,2.35l0.12,1.05l2.15,1.65l1.97,0.85l3.04,2.36l1.97,0.65l0.55,0.88l2.72,0.85l1.84,-1.1l2.07,-5.97l-0.42,-3.59l0.3,-1.73l0.47,-0.87l-0.31,-0.68l1.09,-3.28l0.46,-0.47l0.4,0.71l0.16,1.51l0.65,0.52l0.16,1.04l0.85,1.21l0.12,2.38l0.9,2.0l0.57,0.18l1.3,-0.78l1.69,1.7l-0.2,1.08l0.53,2.2l0.39,1.3l0.68,0.48l0.6,1.95l-0.19,1.48l0.81,1.76l6.01,3.69l-0.11,0.76l1.38,1.58l0.95,2.77l0.58,0.22l0.72,-0.41l0.8,0.9l0.61,0.01l0.46,2.41l4.81,4.71l0.66,2.02l-0.07,3.31l1.14,2.2l-0.13,2.24l-1.1,3.68l0.03,1.64l-0.47,1.89l-1.05,2.4l-1.9,1.47l-1.72,3.51l-2.38,6.09l-0.24,2.82l-1.14,0.8l-2.85,0.15l-2.31,1.19l-2.51,2.25l-3.09,-1.57l0.3,-1.15l-0.54,-0.47l-1.5,0.63l-2.01,1.94l-7.12,-2.18l-1.48,-1.63l-1.14,-3.74l-1.45,-1.26l-1.81,-0.26l0.56,-1.18l-0.61,-2.1l-0.72,-0.1l-1.14,1.82l-0.9,0.21l0.63,-0.82l0.36,-1.55l0.92,-1.31l-0.13,-2.34l-0.7,-0.22l-2.0,2.34l-1.51,0.93l-0.94,2.01l-1.35,-0.81l-0.02,-1.52l-1.57,-2.04l-1.09,-0.88l0.24,-0.33l-0.14,-0.59l-3.21,-1.69l-1.83,-0.12l-2.54,-1.35l-4.58,0.28l-6.02,1.9l-2.53,-0.13l-2.62,1.41l-2.13,0.63l-1.49,2.6l-3.49,0.31l-2.29,-0.5l-3.48,0.43l-1.6,1.47l-0.81,-0.04l-2.37,1.63l-3.26,-0.1l-3.72,-2.21l0.04,-1.05l1.19,-0.46l0.49,-0.89l0.21,-2.97l-0.28,-1.64l-1.34,-2.86l-0.38,-1.47l0.05,-1.72l-0.95,-1.7l-0.18,-0.97l-1.01,-0.99l-0.29,-1.98l-1.13,-1.75ZM784.92,393.44l2.65,1.02l3.23,-0.96l1.09,0.14l0.15,3.06l-0.85,1.13l-0.17,1.63l-0.87,-0.24l-1.57,1.91l-1.68,-0.18l-1.4,-2.36l-0.37,-2.04l-1.39,-2.51l0.04,-0.8l1.15,0.18Z\",\n      name: \"Australia\"\n    },\n    IL: {\n      path: \"M507.76,203.05l0.4,-0.78l0.18,0.4l-0.33,1.03l0.52,0.44l0.68,-0.22l-0.86,3.6l-1.16,-3.32l0.59,-0.74l-0.03,-0.41ZM508.73,200.34l0.37,-1.02l0.64,0.0l0.52,-0.51l-0.49,1.53l-0.56,-0.24l-0.48,0.23Z\",\n      name: \"Israel\"\n    },\n    IN: {\n      path: \"M623.34,207.03l-1.24,1.04l-0.97,2.55l0.22,0.51l8.04,3.87l3.42,0.37l1.57,1.38l4.92,0.88l2.18,-0.04l0.38,-0.3l0.29,-1.24l-0.32,-1.64l0.14,-0.87l0.82,-0.31l0.45,2.48l2.28,1.02l1.77,-0.38l4.14,0.1l0.38,-0.36l0.18,-1.66l-0.5,-0.65l1.37,-0.29l2.25,-1.99l2.7,-1.62l1.93,0.62l1.8,-0.98l0.79,1.14l-0.68,0.91l0.26,0.63l2.42,0.36l0.09,0.47l-0.83,0.75l0.13,1.07l-1.52,-0.29l-3.24,1.86l-0.13,1.78l-1.32,2.14l-0.18,1.39l-0.93,1.82l-1.64,-0.5l-0.52,0.37l-0.09,2.63l-0.56,1.11l0.19,0.81l-0.53,0.27l-1.18,-3.73l-1.08,-0.27l-0.38,0.31l-0.24,1.0l-0.66,-0.66l0.54,-1.06l1.22,-0.34l1.15,-2.25l-0.24,-0.56l-1.57,-0.47l-4.34,-0.28l-0.18,-1.56l-0.35,-0.35l-1.11,-0.12l-1.91,-1.12l-0.56,0.17l-0.88,1.82l0.11,0.49l1.36,1.07l-1.09,0.69l-0.69,1.11l0.18,0.56l1.24,0.57l-0.32,1.54l0.85,1.94l0.36,2.01l-0.22,0.59l-4.58,0.52l-0.33,0.42l0.13,1.8l-1.17,1.36l-3.65,1.81l-2.79,3.03l-4.32,3.28l-0.18,1.27l-4.65,1.79l-0.77,2.16l0.64,5.3l-1.06,2.49l-0.01,3.94l-1.24,0.28l-1.14,1.93l0.39,0.84l-1.68,0.53l-1.04,1.83l-0.65,0.47l-2.06,-2.05l-2.1,-6.02l-2.2,-3.64l-1.05,-4.75l-2.29,-3.57l-1.76,-8.2l0.01,-3.11l-0.49,-2.53l-0.55,-0.29l-3.53,1.52l-1.53,-0.27l-2.86,-2.77l0.85,-0.67l0.08,-0.55l-0.74,-1.03l-2.67,-2.06l1.24,-1.32l5.34,0.01l0.39,-0.49l-0.5,-2.29l-1.42,-1.46l-0.27,-1.93l-1.43,-1.2l2.31,-2.37l3.05,0.06l2.62,-2.85l1.6,-2.81l2.4,-2.73l0.07,-2.04l1.97,-1.48l-0.02,-0.65l-1.93,-1.31l-0.82,-1.78l-0.8,-2.21l0.9,-0.89l3.59,0.65l2.92,-0.42l2.33,-2.19l2.31,2.85l-0.24,2.13l0.99,1.59l-0.05,0.82l-1.34,-0.28l-0.47,0.48l0.7,3.06l2.62,1.99l2.99,1.65Z\",\n      name: \"India\"\n    },\n    TZ: {\n      path: \"M495.56,296.42l2.8,-3.12l-0.02,-0.81l-0.64,-1.3l0.68,-0.52l0.14,-1.47l-0.76,-1.25l0.31,-0.11l2.26,0.03l-0.51,2.76l0.76,1.3l0.5,0.12l1.05,-0.53l1.19,-0.12l0.61,0.24l1.43,-0.62l0.1,-0.67l-0.71,-0.62l1.57,-1.7l8.65,4.86l0.32,1.53l3.34,2.33l-1.05,2.8l0.13,1.61l1.63,1.12l-0.6,1.76l-0.01,2.33l1.89,4.03l0.57,0.43l-1.46,1.08l-2.61,0.94l-1.43,-0.04l-1.06,0.77l-2.29,0.36l-2.87,-0.68l-0.83,0.07l-0.63,-0.75l-0.31,-2.78l-1.32,-1.35l-3.25,-0.77l-3.96,-1.58l-1.18,-2.41l-0.32,-1.75l-1.76,-1.49l0.42,-1.05l-0.44,-0.89l0.08,-0.96l-0.46,-0.58l0.06,-0.56Z\",\n      name: \"Tanzania\"\n    },\n    AZ: {\n      path: \"M539.29,175.73l1.33,0.32l1.94,-1.8l2.3,3.34l1.43,0.43l-1.26,0.15l-0.35,0.32l-0.8,3.14l-0.99,0.96l0.05,1.11l-1.26,-1.13l0.7,-1.18l-0.04,-0.47l-0.74,-0.86l-1.48,0.15l-2.34,1.71l-0.03,-1.27l-2.03,-1.35l0.47,-0.62l-0.08,-0.56l-1.03,-0.79l0.29,-0.43l-0.14,-0.58l-1.13,-0.86l1.89,0.68l1.69,0.06l0.37,-0.87l-0.81,-1.37l0.42,0.06l1.63,1.72ZM533.78,180.57l0.61,0.46l0.69,-0.0l0.59,1.15l-0.68,-0.15l-1.21,-1.45Z\",\n      name: \"Azerbaijan\"\n    },\n    IE: {\n      path: \"M405.08,135.42l0.35,2.06l-1.75,2.78l-4.22,1.88l-2.84,-0.4l1.73,-3.0l-1.18,-3.53l4.6,-3.74l0.32,1.15l-0.49,1.74l0.4,0.51l1.47,-0.04l1.6,0.6Z\",\n      name: \"Ireland\"\n    },\n    ID: {\n      path: \"M756.47,287.89l0.69,4.01l2.79,1.78l0.51,-0.1l2.04,-2.59l2.71,-1.43l2.05,-0.0l3.9,1.73l2.46,0.45l0.08,15.12l-1.75,-1.54l-2.54,-0.51l-0.88,0.71l-2.32,0.06l0.69,-1.33l1.45,-0.64l0.23,-0.46l-0.65,-2.74l-1.24,-2.21l-5.04,-2.29l-2.09,-0.23l-3.68,-2.27l-0.55,0.13l-0.65,1.07l-0.52,0.12l-0.55,-1.89l-1.21,-0.78l1.84,-0.62l1.72,0.05l0.39,-0.52l-0.21,-0.66l-0.38,-0.28l-3.45,-0.0l-1.13,-1.48l-2.1,-0.43l-0.52,-0.6l2.69,-0.48l1.28,-0.78l3.66,0.94l0.3,0.71ZM757.91,300.34l-0.62,0.82l-0.1,-0.8l0.59,-1.12l0.13,1.1ZM747.38,292.98l0.34,0.72l-1.22,-0.57l-4.68,-0.1l0.27,-0.62l2.78,-0.09l2.52,0.67ZM741.05,285.25l-0.67,-2.88l0.64,-2.01l0.41,0.86l1.21,0.18l0.16,0.7l-0.1,1.68l-0.84,-0.16l-0.46,0.3l-0.34,1.34ZM739.05,293.5l-0.5,0.44l-1.34,-0.36l-0.17,-0.37l1.73,-0.08l0.27,0.36ZM721.45,284.51l-0.19,1.97l2.24,2.23l0.54,0.02l1.27,-1.07l2.75,-0.5l-0.9,1.21l-2.11,0.93l-0.16,0.6l2.22,3.01l-0.3,1.07l1.36,1.74l-2.26,0.85l-0.28,-0.31l0.12,-1.19l-1.64,-1.34l0.17,-2.23l-0.56,-0.39l-1.67,0.76l-0.23,0.39l0.3,6.17l-1.1,0.25l-0.69,-0.47l0.64,-2.21l-0.39,-2.42l-0.39,-0.34l-0.8,-0.01l-0.58,-1.29l0.98,-1.6l0.35,-1.96l1.32,-3.87ZM728.59,296.27l0.38,0.49l-0.02,1.28l-0.88,0.49l-0.53,-0.47l1.04,-1.79ZM729.04,286.98l0.27,-0.05l-0.02,0.13l-0.24,-0.08ZM721.68,284.05l0.16,-0.32l1.89,-1.65l1.83,0.68l3.16,0.35l2.94,-0.1l2.39,-1.66l-1.73,2.13l-1.66,0.43l-2.41,-0.48l-4.17,0.13l-2.39,0.51ZM730.55,310.47l1.11,-1.93l2.03,-0.82l0.08,0.62l-1.45,1.67l-1.77,0.46ZM728.12,305.88l-0.1,0.38l-3.46,0.66l-2.91,-0.27l-0.0,-0.25l1.54,-0.41l1.66,0.73l1.67,-0.19l1.61,-0.65ZM722.9,310.24l-0.64,0.03l-2.26,-1.2l1.11,-0.24l1.78,1.41ZM716.26,305.77l0.88,0.51l1.28,-0.17l0.2,0.35l-4.65,0.73l0.39,-0.67l1.15,-0.02l0.75,-0.73ZM711.66,293.84l-0.38,-0.16l-2.54,1.01l-1.12,-1.44l-1.69,-0.13l-1.16,-0.75l-3.04,0.77l-1.1,-1.15l-3.31,-0.11l-0.35,-3.05l-1.35,-0.95l-1.11,-1.98l-0.33,-2.06l0.27,-2.14l0.9,-1.01l0.37,1.15l2.09,1.49l1.53,-0.48l1.82,0.08l1.38,-1.19l1.0,-0.18l2.28,0.67l2.26,-0.53l1.52,-3.64l1.01,-0.99l0.78,-2.57l4.1,0.3l-1.11,1.77l0.02,0.46l1.7,2.2l-0.23,1.39l2.07,1.71l-2.33,0.42l-0.88,1.9l0.1,2.05l-2.4,1.9l-0.06,2.45l-0.7,2.79ZM692.58,302.03l0.35,0.26l4.8,0.25l0.78,-0.97l4.17,1.09l1.13,1.68l3.69,0.45l2.13,1.04l-1.8,0.6l-2.77,-0.99l-4.8,-0.12l-5.24,-1.41l-1.84,-0.25l-1.11,0.3l-4.26,-0.97l-0.7,-1.14l-1.59,-0.13l1.18,-1.65l2.74,0.13l2.87,1.13l0.26,0.68ZM685.53,299.17l-2.22,0.04l-2.06,-2.03l-3.15,-2.01l-2.93,-3.51l-3.11,-5.33l-2.2,-2.12l-1.64,-4.06l-2.32,-1.69l-1.27,-2.07l-1.96,-1.5l-2.51,-2.65l-0.11,-0.66l4.81,0.53l2.15,2.38l3.31,2.74l2.35,2.66l2.7,0.17l1.95,1.59l1.54,2.17l1.59,0.95l-0.84,1.71l0.15,0.52l1.44,0.87l0.79,0.1l0.4,1.58l0.87,1.4l1.96,0.39l1.0,1.31l-0.6,3.01l-0.09,3.5Z\",\n      name: \"Indonesia\"\n    },\n    UA: {\n      path: \"M492.5,162.44l1.28,-2.49l1.82,0.19l0.66,-0.23l0.09,-0.71l-0.25,-0.75l-0.79,-0.72l-0.33,-1.21l-0.86,-0.62l-0.02,-1.19l-1.13,-0.86l-1.15,-0.19l-2.04,-1.0l-1.66,0.32l-0.66,0.47l-0.92,-0.0l-0.84,0.78l-2.48,0.7l-1.18,-0.71l-3.07,-0.36l-0.89,0.43l-0.24,-0.55l-1.11,-0.7l0.35,-0.93l1.26,-1.02l-0.54,-1.23l2.04,-2.43l1.4,-0.62l0.25,-1.19l-1.04,-2.39l0.83,-0.13l1.28,-0.84l1.8,-0.07l2.47,0.26l2.86,0.81l1.88,0.06l0.86,0.44l1.04,-0.41l0.77,0.66l2.18,-0.15l0.92,0.3l0.52,-0.34l0.15,-1.53l0.56,-0.54l2.85,-0.05l0.84,-0.72l3.04,-0.18l1.23,1.46l-0.48,0.77l0.21,1.03l0.36,0.32l1.8,0.14l0.93,2.08l3.18,1.15l1.94,-0.45l1.67,1.49l1.4,-0.03l3.35,0.96l0.02,0.54l-0.96,1.59l0.47,1.97l-0.26,0.7l-2.36,0.28l-1.29,0.89l-0.23,1.38l-1.83,0.27l-1.58,0.97l-2.41,0.21l-2.16,1.17l-0.21,0.38l0.34,2.26l1.23,0.75l2.13,-0.08l-0.14,0.31l-2.65,0.53l-3.23,1.69l-0.87,-0.39l0.42,-1.1l-0.25,-0.52l-2.21,-0.73l2.35,-1.06l0.12,-0.65l-0.93,-0.82l-3.62,-0.74l-0.13,-0.89l-0.46,-0.34l-2.61,0.59l-0.91,1.69l-1.71,2.04l-0.86,-0.4l-1.62,0.27Z\",\n      name: \"Ukraine\"\n    },\n    QA: {\n      path: \"M549.33,221.64l-0.76,-0.23l-0.14,-1.64l0.84,-1.29l0.47,0.52l0.04,1.34l-0.45,1.3Z\",\n      name: \"Qatar\"\n    },\n    MZ: {\n      path: \"M508.58,318.75l-0.34,-2.57l0.51,-2.05l3.55,0.63l2.5,-0.38l1.02,-0.76l1.49,0.01l2.74,-0.98l1.66,-1.2l0.5,9.24l0.41,1.23l-0.68,1.67l-0.93,1.71l-1.5,1.5l-5.16,2.28l-2.78,2.73l-1.02,0.53l-1.71,1.8l-0.98,0.57l-0.35,2.41l1.16,1.94l0.49,2.17l0.43,0.31l-0.06,2.06l-0.39,1.17l0.5,0.72l-0.25,0.73l-0.92,0.83l-5.12,2.39l-1.22,1.36l0.21,1.13l0.58,0.39l-0.11,0.72l-1.22,-0.01l-0.73,-2.97l0.42,-3.09l-1.78,-5.37l2.49,-2.81l0.69,-1.89l0.44,-0.43l0.28,-1.53l-0.39,-0.93l0.59,-3.65l-0.01,-3.26l-1.49,-1.16l-1.2,-0.22l-1.74,-1.17l-1.92,0.01l-0.29,-2.08l7.06,-1.96l1.28,1.09l0.89,-0.1l0.67,0.44l0.1,0.73l-0.51,1.29l0.19,1.81l1.75,1.83l0.65,-0.13l0.71,-1.65l1.17,-0.86l-0.26,-3.47l-1.05,-1.85l-1.04,-0.94Z\",\n      name: \"Mozambique\"\n    }\n  },\n  height: 440.70631074413296,\n  width: 900,\n  projection: {\n    type: \"mill\",\n    centralMeridian: 11.5\n  }\n});\n\n// world merc\n\njsVectorMap.prototype.addMap(\"world_merc\", {\n  \"insets\": [{\n    \"width\": 900,\n    \"top\": 0,\n    \"height\": 583.0802520919394,\n    \"bbox\": [{\n      \"y\": -18449355.69035302,\n      \"x\": -20004297.151525836\n    }, {\n      \"y\": 7485321.539093307,\n      \"x\": 20026572.394749384\n    }],\n    \"left\": 0\n  }],\n  \"paths\": {\n    \"BD\": {\n      \"path\": \"M651.84,359.63l-0.6,-2.05l-1.36,-1.76l-2.31,-0.11l-0.41,0.48l0.2,0.98l-0.54,1.03l-0.71,-0.37l-0.68,0.36l-1.19,-0.37l-0.37,-2.06l-0.81,-1.92l0.39,-1.52l-0.21,-0.46l-1.16,-0.55l0.3,-0.55l1.48,-0.98l0.03,-0.64l-1.56,-1.27l0.56,-1.2l1.6,0.97l1.04,0.16l0.18,1.62l0.33,0.35l5.65,0.65l-0.86,1.73l-1.21,0.35l-0.77,1.56l0.07,0.46l1.37,1.41l0.68,-0.19l0.42,-1.44l1.21,3.96l-0.03,1.26l-0.32,-0.15l-0.41,0.28Z\",\n      \"name\": \"Bangladesh\"\n    },\n    \"BE\": {\n      \"path\": \"M429.3,264.88l1.93,0.28l2.07,-0.74l1.41,1.55l1.25,0.86l-0.23,2.13l-0.68,0.42l-0.18,1.46l-1.63,-1.32l-1.4,0.17l-2.72,-3.22l-1.17,-0.21l-0.2,-0.77l1.57,-0.62Z\",\n      \"name\": \"Belgium\"\n    },\n    \"BF\": {\n      \"path\": \"M421.42,377.38l-0.11,0.96l0.34,1.18l1.4,1.73l0.07,1.11l0.32,0.37l2.56,0.52l-0.04,1.3l-0.38,0.54l-1.07,0.21l-0.73,1.19l-0.63,0.21l-3.22,-0.25l-0.94,0.39l-5.4,-0.05l-0.39,0.38l0.16,2.75l-1.23,-0.43l-1.17,0.1l-0.89,0.57l-2.27,-1.73l-0.13,-1.12l0.61,-0.96l0.01,-0.93l1.87,-2.0l0.44,-1.83l0.43,-0.39l1.28,0.26l1.05,-0.52l0.47,-0.73l1.84,-1.1l0.55,-0.84l2.2,-1.01l1.15,-0.31l0.72,0.46l1.13,-0.01Z\",\n      \"name\": \"Burkina Faso\"\n    },\n    \"BG\": {\n      \"path\": \"M491.72,293.09l-0.93,1.06l-0.91,2.45l0.52,1.52l-1.65,-0.27l-2.55,1.06l-0.27,1.69l-1.79,0.25l-2.03,-1.11l-1.92,0.88l-1.4,-0.07l-0.15,-1.87l-1.09,-1.09l0.34,-1.71l0.91,-1.02l0.01,-0.52l-1.15,-1.41l-0.06,-1.14l0.44,0.87l0.46,0.21l0.87,-0.23l1.91,0.53l3.68,0.18l1.44,-0.92l2.7,-0.74l1.67,1.16l0.95,0.26Z\",\n      \"name\": \"Bulgaria\"\n    },\n    \"BA\": {\n      \"path\": \"M463.49,287.91l2.09,0.57l1.72,-0.03l1.56,0.78l-0.4,0.99l1.14,1.61l-0.27,1.19l-1.82,1.31l-0.37,1.54l-1.65,-0.96l-0.89,-1.36l-2.11,-2.07l-1.65,-2.57l0.25,-0.7l0.45,0.41l0.59,-0.06l0.43,-0.59l0.92,-0.06Z\",\n      \"name\": \"Bosnia and Herz.\"\n    },\n    \"BN\": {\n      \"path\": \"M707.48,403.47l0.69,-0.65l1.41,-0.91l-0.15,1.64l-0.81,-0.05l-0.61,0.58l-0.53,-0.6Z\",\n      \"name\": \"Brunei\"\n    },\n    \"BO\": {\n      \"path\": \"M263.83,471.11l-3.09,-0.24l-0.38,0.24l-0.7,1.56l-1.31,-1.57l-3.28,-0.66l-2.38,2.47l-1.3,0.27l-0.88,-3.36l-1.31,-2.93l0.74,-2.43l-0.12,-0.42l-1.2,-1.03l-0.37,-1.92l-1.09,-1.59l1.46,-2.61l-0.97,-2.36l0.48,-1.07l-0.35,-0.74l0.91,-1.33l0.16,-3.89l0.5,-1.18l-1.81,-3.45l2.46,0.08l0.8,-0.85l3.4,-1.92l2.66,-0.35l-0.19,1.39l0.3,1.07l-0.05,1.98l2.72,2.29l2.88,0.49l0.89,0.87l1.79,0.59l0.98,0.71l1.71,0.05l1.17,0.61l0.6,2.74l-0.7,0.54l0.96,3.03l0.37,0.28l4.3,0.1l-0.25,1.22l0.27,1.03l1.43,0.92l0.5,1.38l-0.41,1.9l-0.65,1.11l0.13,1.37l-2.69,-1.68l-2.4,-0.03l-4.36,0.77l-1.49,2.56l-0.1,1.55l-0.75,2.44Z\",\n      \"name\": \"Bolivia\"\n    },\n    \"JP\": {\n      \"path\": \"M781.1,291.58l1.81,0.77l1.63,-1.08l0.4,2.83l-3.6,1.02l-1.98,3.05l-3.61,-2.12l-0.58,0.21l-1.27,3.44l-2.14,0.04l-0.3,-2.88l1.09,-2.32l2.44,-0.17l0.37,-0.34l1.26,-6.78l2.45,3.07l2.03,1.27ZM773.56,314.42l-0.92,2.42l0.38,1.64l-1.15,1.91l-3.02,1.35l-4.59,0.3l-3.33,3.22l-1.25,-0.86l-0.09,-2.06l-0.46,-0.38l-4.35,0.67l-3.0,1.42l-2.84,0.06l-0.37,0.26l0.11,0.44l2.34,2.04l-1.55,4.67l-1.25,0.95l-0.8,-0.75l0.56,-2.43l-0.2,-0.44l-1.47,-0.8l-0.77,-1.54l2.14,-0.91l1.27,-1.83l2.45,-1.53l1.83,-2.06l4.77,-0.88l2.6,0.61l0.45,-0.22l2.39,-5.05l1.27,1.14l0.53,0.01l5.1,-4.39l1.68,-4.08l-0.39,-3.75l0.92,-1.82l2.11,-0.49l1.24,4.16l-0.07,2.45l-2.25,3.13l-0.03,3.43ZM757.77,324.02l0.2,0.64l-1.01,1.31l-1.17,-0.72l-1.28,0.7l-0.69,1.54l-1.01,-0.53l0.01,-1.04l1.14,-1.49l1.58,0.15l0.85,-1.05l1.38,0.49Z\",\n      \"name\": \"Japan\"\n    },\n    \"BI\": {\n      \"path\": \"M495.45,425.39l-1.08,-2.99l1.14,-0.11l0.64,-1.19l0.76,0.09l0.65,1.83l-2.1,2.37Z\",\n      \"name\": \"Burundi\"\n    },\n    \"BJ\": {\n      \"path\": \"M429.57,385.57l-0.05,0.81l0.5,1.35l-0.42,0.87l0.17,0.79l-1.82,2.14l-0.57,1.77l-0.08,5.44l-1.41,0.2l-0.48,-1.36l0.11,-5.73l-0.52,-0.7l-0.2,-1.35l-1.48,-1.49l0.22,-0.91l0.89,-0.43l0.42,-0.93l1.27,-0.36l1.22,-1.35l0.61,-0.0l1.62,1.25Z\",\n      \"name\": \"Benin\"\n    },\n    \"BT\": {\n      \"path\": \"M650.32,342.67l0.85,0.75l-0.12,1.18l-3.76,-0.12l-1.57,0.41l-1.93,-0.91l1.49,-2.09l1.12,-0.6l1.62,0.6l1.33,0.09l0.98,0.68Z\",\n      \"name\": \"Bhutan\"\n    },\n    \"JM\": {\n      \"path\": \"M228.38,368.9l-0.8,0.41l-2.27,-1.09l0.84,-0.25l2.14,0.31l1.18,0.59l-1.09,0.03Z\",\n      \"name\": \"Jamaica\"\n    },\n    \"BW\": {\n      \"path\": \"M483.92,460.24l2.27,4.08l2.83,2.92l0.96,0.32l0.77,2.5l2.13,0.63l1.04,0.8l-3.01,1.7l-2.32,2.09l-1.54,2.79l-1.52,0.46l-0.64,2.01l-1.34,0.54l-1.84,-0.12l-1.21,-0.77l-1.36,-0.31l-1.22,0.64l-0.75,1.42l-2.31,1.98l-1.39,0.22l-0.36,-0.63l0.16,-1.82l-1.48,-2.63l-0.62,-0.44l-0.0,-7.35l2.08,-0.08l0.38,-0.4l0.07,-9.12l1.56,-0.08l3.63,-0.87l0.8,0.91l0.52,0.07l1.5,-0.97l2.2,-0.5Z\",\n      \"name\": \"Botswana\"\n    },\n    \"BR\": {\n      \"path\": \"M259.98,404.95l3.24,0.7l0.65,-0.53l4.55,-1.32l1.08,-1.06l-0.02,-0.64l0.55,-0.05l0.28,0.28l-0.26,0.87l0.22,0.48l0.73,0.32l0.4,0.81l-0.62,0.86l-0.4,2.13l0.82,2.56l1.69,1.43l1.43,0.2l3.17,-1.68l3.18,0.3l0.65,-0.75l-0.27,-0.92l1.9,-0.09l2.39,0.99l1.06,-0.61l0.84,0.78l1.2,-0.18l1.18,-1.06l0.84,-1.94l1.36,-2.11l0.37,-0.05l1.89,5.46l1.33,0.59l0.05,1.28l-1.77,1.94l0.02,0.56l1.02,0.87l4.07,0.36l0.08,2.16l0.66,0.29l1.74,-1.5l6.97,2.32l1.02,1.22l-0.35,1.18l0.49,0.5l2.81,-0.74l4.77,1.3l3.75,-0.08l3.57,2.0l3.29,2.86l1.93,0.73l2.12,0.12l0.71,0.62l1.21,4.52l-0.95,4.0l-4.72,5.09l-1.64,2.95l-1.72,2.07l-0.8,0.3l-0.72,2.05l0.18,4.81l-0.94,5.62l-0.81,1.15l-0.43,3.44l-2.55,3.58l-0.4,2.59l-1.86,1.08l-0.67,1.57l-2.54,0.01l-3.94,1.05l-1.83,1.24l-2.87,0.85l-3.03,2.27l-2.2,2.92l-0.36,2.08l0.4,1.64l-0.45,2.73l-0.52,1.26l-1.77,1.62l-2.75,5.05l-3.83,3.63l-1.23,2.92l-1.18,1.22l-0.37,-0.92l0.96,-1.23l0.01,-0.48l-1.52,-2.09l-4.56,-3.52l-1.03,-0.01l-2.38,-2.13l-0.85,0.0l5.38,-5.77l3.77,-2.69l0.21,-2.55l-1.34,-1.86l-0.92,0.07l0.59,-2.44l0.01,-1.59l-1.11,-0.85l-1.75,0.31l-0.44,-3.22l-0.52,-0.97l-1.88,-0.9l-1.24,0.48l-2.17,-0.43l0.15,-3.31l-0.63,-1.37l0.67,-0.74l-0.22,-1.37l0.66,-1.16l0.44,-2.08l-0.61,-1.86l-1.4,-0.87l-0.2,-0.77l0.34,-1.41l-0.38,-0.49l-4.52,-0.1l-0.72,-2.27l0.59,-0.42l-0.03,-1.12l-0.5,-0.87l-0.32,-1.71l-1.45,-0.76l-1.63,-0.02l-1.05,-0.73l-1.6,-0.48l-1.13,-1.0l-2.69,-0.41l-2.47,-2.08l0.13,-4.38l-0.45,-0.45l-3.46,0.5l-3.44,1.95l-0.6,0.74l-2.89,-0.17l-1.47,0.42l-0.72,-0.18l0.15,-3.54l-0.64,-0.34l-1.94,1.42l-1.87,-0.06l-0.83,-1.19l-1.38,-0.27l0.21,-1.01l-1.35,-1.5l-0.88,-1.92l0.56,-0.6l-0.0,-0.81l1.29,-0.62l0.22,-0.43l-0.22,-1.19l0.61,-0.91l0.15,-0.99l2.65,-1.58l1.99,-0.47l0.42,-0.36l2.06,0.11l0.42,-0.33l1.19,-8.0l-0.41,-1.56l-1.1,-1.0l0.01,-1.33l1.91,-0.42l0.08,-0.96l-0.33,-0.43l-1.14,-0.2l-0.02,-0.83l4.47,0.05l0.82,-0.67l0.82,1.81l0.8,0.07l1.15,1.1l2.26,-0.05l0.71,-0.83l2.78,-0.96l0.48,-1.13l1.6,-0.64l0.24,-0.47l-0.48,-0.83l-1.83,-0.19l-0.36,-3.22Z\",\n      \"name\": \"Brazil\"\n    },\n    \"BS\": {\n      \"path\": \"M227.69,345.88l0.0,-0.01l0.0,0.0l-0.0,0.01ZM226.4,353.1l-0.48,-1.18l-0.85,-0.78l0.36,-1.17l0.95,2.03l0.01,1.1ZM225.65,345.38l-1.96,0.32l-0.04,-0.26l0.74,-0.14l1.26,0.08Z\",\n      \"name\": \"Bahamas\"\n    },\n    \"BY\": {\n      \"path\": \"M493.82,245.43l0.3,0.93l0.53,0.25l1.16,-0.47l2.08,0.9l0.2,1.73l-0.48,1.43l1.57,2.82l0.93,0.75l0.13,0.97l1.58,0.7l0.48,0.74l-0.6,0.57l-1.85,-0.13l-0.76,0.48l-0.12,0.47l1.08,3.5l-1.96,0.33l-0.87,1.12l-0.12,1.49l-0.67,-0.22l-2.03,0.17l-0.52,-0.75l-0.57,-0.09l-0.72,0.54l-0.9,-0.5l-1.91,-0.08l-2.74,-0.95l-2.61,-0.34l-2.01,0.09l-1.52,1.11l-0.65,0.08l-0.07,-1.5l-0.64,-1.57l1.4,-1.01l0.01,-1.65l-0.7,-1.69l-0.08,-1.37l2.2,-0.03l2.72,-1.61l0.73,-2.54l2.1,-1.69l-0.2,-1.69l3.82,-2.26l2.27,0.97Z\",\n      \"name\": \"Belarus\"\n    },\n    \"BZ\": {\n      \"path\": \"M198.03,374.09l0.1,-4.57l0.69,-0.06l0.74,-1.32l0.34,0.28l-0.4,1.33l0.17,0.59l-0.34,2.3l-1.3,1.44Z\",\n      \"name\": \"Belize\"\n    },\n    \"RU\": {\n      \"path\": \"M491.5,228.55l2.65,-2.55l-0.01,-0.58l-2.35,-2.15l7.46,-9.43l1.0,-2.89l-0.09,-0.41l-3.55,-3.64l0.93,-3.78l-2.18,-4.19l1.62,-5.27l-2.85,-6.95l2.24,-4.74l-0.06,-0.43l-3.73,-4.33l0.33,-4.4l1.87,-0.61l4.26,-2.85l2.35,-2.28l3.83,4.05l6.96,1.77l9.34,7.63l1.83,2.99l0.16,4.03l-2.62,3.11l-3.84,1.55l-11.03,-4.69l-2.16,0.81l-0.14,0.63l3.99,4.45l0.31,8.71l5.34,3.55l0.64,-0.27l0.32,-2.78l-1.43,-2.53l1.23,-1.72l5.74,3.47l0.43,-0.01l2.11,-1.42l0.15,-0.48l-1.59,-4.12l5.51,-5.69l1.99,0.31l2.25,2.09l0.65,-0.16l1.46,-4.3l-2.03,-4.0l1.18,-3.78l-1.5,-3.67l5.98,1.86l1.2,3.14l-2.74,0.7l-0.3,0.39l0.02,3.61l2.07,2.45l0.43,0.11l3.87,-1.38l0.85,-4.25l13.69,-8.82l1.16,0.21l-2.17,3.65l0.26,0.59l3.11,0.7l0.4,-0.14l1.68,-2.16l4.51,-0.18l3.61,-2.68l2.61,3.78l0.67,-0.02l2.85,-4.55l-0.0,-0.43l-2.5,-3.89l1.03,-1.89l7.03,2.08l3.39,2.18l9.05,7.85l0.62,-0.13l1.64,-3.95l-2.48,-3.58l-0.07,-1.39l-0.31,-0.37l-2.62,-0.61l0.73,-3.21l-1.33,-5.76l-0.07,-2.28l4.55,-7.04l1.67,-7.53l1.59,-1.44l6.17,2.09l0.48,4.29l-2.34,6.42l1.55,2.76l0.79,5.18l-0.57,9.85l2.73,4.33l-1.02,4.26l-4.88,9.07l0.23,0.57l2.86,0.92l0.49,-0.22l0.94,-2.13l2.83,-1.82l0.65,-3.1l2.12,-3.05l-1.37,-4.06l1.14,-4.42l-0.31,-0.49l-2.47,-0.52l-0.55,-3.59l1.95,-7.61l-3.13,-6.05l4.31,-5.2l-0.45,-5.83l0.53,-0.08l1.2,4.22l-0.98,7.66l0.21,0.4l2.68,1.42l0.58,-0.43l-1.09,-5.45l3.9,-2.98l4.9,-0.41l4.5,4.5l0.49,0.06l0.17,-0.47l-2.21,-6.76l-0.24,-8.85l4.01,-1.66l5.93,0.39l5.54,-1.19l0.28,-0.55l-1.97,-4.64l2.73,-5.9l2.89,-0.36l4.78,-4.84l6.49,-1.33l1.07,-2.85l6.11,-0.9l1.91,2.17l0.58,0.02l5.5,-5.45l4.43,0.17l0.41,-0.34l0.68,-4.62l2.32,-4.63l5.58,-4.48l3.69,3.23l-3.04,2.5l0.14,0.69l5.42,1.64l0.64,5.13l0.7,0.21l2.17,-2.49l6.98,0.14l5.48,5.07l1.92,3.72l-0.59,4.98l-2.66,2.78l-6.56,5.27l-1.96,2.84l0.18,0.6l3.08,1.27l3.68,2.26l0.45,-0.02l1.76,-1.33l1.14,5.11l0.34,0.31l0.41,-0.22l1.03,-2.14l3.75,-1.32l7.65,1.4l0.57,3.81l0.35,0.34l10.47,1.28l0.45,-0.39l0.13,-6.16l4.81,1.41l3.93,-0.03l3.85,4.37l1.1,5.17l-1.42,3.65l3.15,6.24l4.05,3.25l0.63,-0.2l2.24,-7.6l3.55,3.15l0.44,0.06l4.09,-2.03l4.67,2.34l0.49,-0.1l1.68,-2.01l3.85,1.04l0.49,-0.48l-1.76,-7.3l3.0,-3.3l22.19,5.31l2.15,4.74l6.55,5.95l10.36,-1.34l4.76,1.21l1.93,2.89l-0.3,5.24l3.26,2.4l3.66,-1.4l4.3,-0.18l4.84,1.4l4.5,-0.75l4.22,6.04l0.56,0.1l3.1,-2.22l0.13,-0.49l-1.96,-4.39l0.94,-2.74l7.63,1.95l5.23,-0.41l7.05,3.36l9.59,8.27l6.43,6.42l-0.21,3.79l1.82,1.88l0.45,0.06l0.21,-0.41l-0.52,-4.08l6.13,0.86l4.58,5.48l-2.15,2.3l-3.97,0.6l-0.34,0.39l-0.06,5.64l-0.78,0.94l-1.98,-0.15l-1.91,-1.99l-3.16,-1.63l-0.77,-2.69l-2.54,-0.99l-2.81,0.69l-1.11,-1.73l0.5,-2.12l-0.56,-0.45l-3.0,1.46l-0.2,0.51l1.06,2.68l-1.31,2.33l-3.03,2.42l-3.08,-0.41l-0.37,0.63l2.22,3.03l1.47,4.59l1.16,1.53l0.26,2.04l-0.46,1.02l-4.64,-1.05l-6.95,4.01l-2.18,0.6l-7.62,6.88l-0.81,1.88l-3.15,-3.07l-0.49,-0.06l-6.18,3.75l-0.93,-1.52l-0.61,-0.09l-2.26,2.01l-3.15,-0.64l-0.47,0.3l-0.79,3.18l-3.03,4.85l0.09,1.91l0.26,0.36l2.58,0.95l-0.3,6.03l-1.97,0.14l-0.36,0.29l-1.07,3.72l0.87,1.82l-4.01,2.02l-1.04,4.88l-3.49,0.95l-0.29,0.32l-0.73,4.06l-3.07,3.18l-0.71,-2.11l-2.45,-15.41l1.17,-6.06l2.06,-2.67l0.2,-2.12l3.83,-1.13l4.47,-6.06l4.28,-5.09l4.48,-4.07l2.13,-7.67l-0.45,-0.5l-3.36,0.72l-1.47,4.3l-5.81,5.21l-1.86,-5.8l-0.49,-0.26l-6.68,1.94l-6.27,8.55l-0.01,0.46l1.74,2.54l-8.37,1.57l0.16,-3.05l-0.32,-0.41l-3.89,-0.75l-3.3,2.39l-7.61,-0.82l-8.47,1.58l-17.7,19.78l0.24,0.67l3.73,0.52l1.14,2.49l2.65,1.15l0.46,-0.13l1.47,-1.95l2.35,0.24l3.43,4.41l0.08,3.28l-1.96,4.11l-0.21,4.69l-1.11,6.02l-3.72,5.32l-0.87,2.56l-8.3,10.17l-3.18,1.92l-1.29,0.04l-1.45,-1.54l-0.53,-0.05l-2.48,1.84l0.28,-0.27l0.36,-4.08l-0.6,-2.85l1.77,-1.03l2.89,0.6l0.44,-0.22l1.71,-3.57l0.84,-3.92l0.97,-1.37l1.32,-3.37l-0.48,-0.53l-4.14,1.11l-2.19,1.46l-3.38,-0.0l-1.05,-3.43l-2.97,-2.72l-4.29,-1.26l-1.76,-6.1l-2.63,-6.06l-2.3,-1.58l-3.75,-1.25l-3.46,0.09l-3.19,0.77l-2.26,2.18l0.05,0.61l1.21,0.86l0.03,1.88l-1.34,1.28l-2.26,4.23l-0.03,1.71l-3.16,2.2l-2.8,-1.36l-3.02,0.27l-1.18,-1.17l-1.68,-0.52l-3.94,2.75l-3.21,0.62l-2.27,0.93l-3.04,-0.6l-2.21,0.03l-1.47,-1.89l-2.61,-1.95l-2.65,-0.52l-5.44,1.21l-3.23,-1.49l-0.71,-3.08l-5.2,-1.5l-2.75,-1.64l-0.54,0.13l-2.59,4.17l0.89,2.46l-2.1,2.34l-3.38,-0.91l-2.42,-0.14l-1.85,-1.84l-2.51,-0.06l-2.46,-1.17l-3.86,1.89l-4.72,3.31l-3.26,0.87l-1.17,-2.07l-0.41,-0.2l-2.97,0.48l-1.1,-1.58l-1.62,-0.7l-1.31,-2.32l-1.38,-0.72l-3.71,0.94l-3.3,-2.2l-0.56,0.12l-0.97,1.52l-5.27,-9.77l-3.03,-3.13l0.73,-1.08l-0.04,-0.5l-0.5,-0.06l-6.2,3.97l-1.82,0.18l0.16,-1.83l-0.23,-0.4l-3.22,-1.46l-2.47,0.85l-0.7,-4.0l-0.31,-0.32l-4.5,-0.95l-2.52,1.84l-6.18,1.58l-1.3,1.08l-9.51,1.62l-1.15,1.45l-0.03,0.46l1.56,2.48l-1.98,0.89l-0.21,0.52l0.35,0.85l-2.18,1.8l0.03,0.64l3.81,2.6l-0.44,1.31l-3.21,-0.16l-0.87,1.02l-3.08,-1.9l-3.97,0.08l-2.66,1.61l-8.29,-4.28l-4.1,0.06l-5.42,4.44l-0.37,2.36l-2.0,-1.76l-0.63,0.13l-2.0,4.27l0.61,1.02l-1.32,2.63l0.05,0.44l2.13,2.54l1.95,0.05l1.39,2.15l-0.23,1.74l1.12,0.83l-0.86,1.61l-2.49,0.71l-2.49,3.66l0.0,0.45l2.19,3.19l-0.16,2.44l2.54,3.7l-1.62,1.81l-0.67,-0.14l-1.63,-1.93l-2.29,-0.94l-0.94,-1.47l-2.34,-0.71l-1.48,0.44l-0.42,-0.51l-3.52,-1.68l-5.76,-1.14l-0.47,0.2l-2.87,-2.64l-2.9,-1.36l-1.63,-1.56l1.39,-0.52l2.08,-3.01l-0.04,-0.51l-0.98,-1.01l3.14,-1.27l0.25,-0.4l-0.07,-0.8l-0.5,-0.35l-1.72,0.45l0.04,-0.92l1.06,-0.85l2.31,-0.26l0.34,-0.28l0.4,-1.47l-0.51,-1.94l0.95,-1.86l0.01,-1.32l-0.27,-0.37l-3.69,-1.26l-1.41,0.02l-1.42,-1.68l-0.43,-0.12l-1.78,0.57l-2.78,-1.21l-0.01,-0.71l-0.89,-1.73l-2.01,-0.38l-0.13,-0.77l0.53,-1.15l-1.6,-2.31l-3.58,0.03l-0.92,0.88l-0.42,-0.07l-1.05,-3.54l2.29,-0.07l0.97,-0.92l0.06,-0.51l-0.9,-1.27l-1.4,-0.62l-0.06,-0.85l-0.95,-0.73l-1.43,-2.57l0.49,-1.21l-0.25,-2.07l-2.69,-1.38l-1.22,0.37l-0.45,-0.94l-2.46,-1.05l-0.74,-2.46l-0.21,-2.19l-1.07,-1.09l0.93,-1.49l-0.72,-4.29l1.7,-2.67l-0.24,-0.98ZM749.34,295.94l-0.76,0.56l-0.11,0.15l-0.01,-0.65l0.87,-0.06ZM871.96,154.57l2.04,-0.2l3.29,2.04l-0.13,0.64l-2.37,1.7l-5.54,0.79l-0.34,-1.85l3.05,-3.11ZM797.75,123.25l-2.42,3.18l-3.66,-0.78l-4.39,-3.6l0.47,-2.52l10.01,3.72ZM783.79,118.53l-1.81,6.68l-8.92,-0.26l-4.06,2.13l-4.64,-5.86l1.28,-6.57l3.04,-1.79l6.39,0.44l8.71,5.22ZM778.23,253.99l-0.64,-1.28l0.31,-0.17l0.33,1.45ZM778.36,254.55l0.92,4.28l-0.05,4.08l1.05,4.08l2.23,6.09l-2.91,-0.99l-0.51,0.27l-1.54,5.47l2.42,4.01l-0.04,1.39l-1.22,-1.41l-0.65,0.06l-1.07,1.83l-0.29,-1.88l0.28,-3.61l-0.28,-4.01l0.58,-2.92l0.11,-5.24l-1.46,-4.02l0.21,-5.38l2.23,-2.09ZM780.09,139.86l-3.31,0.05l-5.09,-1.07l2.11,-3.11l2.77,-0.74l3.29,3.15l0.23,1.71ZM683.7,87.54l-13.17,4.38l4.34,-15.76l1.75,-1.29l1.59,0.74l6.17,7.25l-0.68,4.69ZM670.82,80.26l-5.03,1.48l-6.76,-3.64l-4.04,-4.98l-1.9,-10.03l-3.29,-2.93l6.28,-10.21l5.0,-3.39l4.63,7.67l5.72,14.22l-0.6,11.8ZM564.4,160.28l-0.92,0.41l-7.78,-0.94l-0.83,-3.41l-4.32,-2.0l-0.33,-3.85l2.54,-1.96l-0.08,-4.42l4.9,-7.29l-0.16,-0.58l-1.86,-0.88l5.7,-7.68l-0.57,-4.44l5.43,-5.07l8.18,-6.55l8.25,-1.96l4.4,-4.05l4.43,-1.3l1.54,3.81l-1.55,3.04l-16.43,9.84l-7.93,9.27l-7.69,17.13l0.59,6.93l4.49,5.95ZM548.68,56.87l-5.47,3.05l-0.54,2.57l-2.49,2.05l-2.33,-2.98l1.37,-4.49l-0.35,-0.52l-4.3,-0.36l3.7,-2.13l3.34,-0.17l0.47,3.78l0.35,0.35l0.42,-0.25l1.41,-3.62l2.04,-2.24l3.21,2.97l-0.81,1.96ZM477.39,251.71l-4.1,0.06l-2.6,-0.41l0.38,-1.28l3.15,-1.29l3.25,1.22l-0.09,1.7Z\",\n      \"name\": \"Russia\"\n    },\n    \"RW\": {\n      \"path\": \"M497.0,418.15l0.71,1.01l-0.11,1.09l-1.63,0.03l-1.04,1.39l-0.83,-0.11l0.51,-1.2l0.08,-1.34l0.42,-0.41l0.7,0.14l1.19,-0.61Z\",\n      \"name\": \"Rwanda\"\n    },\n    \"RS\": {\n      \"path\": \"M469.33,288.43l0.49,-1.17l-1.2,-1.97l1.47,-0.73l1.3,0.13l1.18,1.23l0.45,1.29l1.35,0.74l0.34,1.53l1.46,1.02l0.76,-0.3l0.25,0.82l-0.51,0.87l0.22,1.27l1.08,1.41l-0.8,0.94l-0.38,1.72l-1.22,0.09l0.27,-0.81l-2.46,-2.38l-0.93,0.06l-0.47,1.05l-2.15,-1.58l0.57,-1.85l-1.13,-1.51l0.53,-1.32l-0.49,-0.55Z\",\n      \"name\": \"Serbia\"\n    },\n    \"TL\": {\n      \"path\": \"M734.55,437.87l-0.09,-0.98l4.5,-0.86l-2.82,1.28l-1.59,0.55Z\",\n      \"name\": \"Timor-Leste\"\n    },\n    \"TM\": {\n      \"path\": \"M553.03,299.38l-0.05,0.44l-0.1,-0.29l0.15,-0.15ZM555.85,298.15l0.46,-0.11l1.47,0.82l2.08,2.72l4.07,-0.21l0.38,-0.49l-0.34,-1.39l1.95,-1.07l1.9,-1.78l2.93,1.56l0.41,2.75l1.21,0.76l2.57,-0.15l0.62,0.45l1.32,3.46l4.54,3.8l2.67,1.6l3.07,1.26l-0.04,1.22l-1.32,-0.81l-0.61,0.19l-0.32,0.93l-2.19,0.86l-0.47,2.34l-1.21,0.81l-1.91,0.45l-0.73,1.44l-1.54,0.33l-2.22,-1.01l-0.2,-2.37l-0.37,-0.37l-1.72,-0.1l-2.76,-2.67l-2.14,-0.44l-2.84,-1.62l-1.78,-0.29l-1.25,0.58l-1.56,-0.09l-2.01,1.85l-1.69,0.47l-0.37,-1.75l0.36,-3.28l-0.2,-0.39l-1.68,-0.94l0.55,-1.92l-0.34,-0.51l-1.23,-0.14l0.38,-1.9l2.23,0.64l2.2,-1.06l0.12,-0.63l-1.77,-1.94l-0.69,-1.85Z\",\n      \"name\": \"Turkmenistan\"\n    },\n    \"TJ\": {\n      \"path\": \"M597.8,305.02l-0.08,0.09l-2.5,-0.5l-0.48,0.34l-0.24,1.88l0.43,0.45l2.63,-0.24l3.18,1.04l4.38,-0.45l0.56,2.63l0.54,0.29l0.66,-0.26l1.12,0.54l0.21,2.4l-3.76,-0.23l-1.81,1.45l-1.74,0.8l-0.62,-0.64l0.22,-2.47l-0.65,-0.49l-0.04,-1.02l-1.36,-0.73l-0.48,0.07l-1.08,1.11l-0.54,1.62l-1.3,-0.06l-0.96,1.26l-0.91,-0.37l-1.63,0.91l-0.24,-0.12l1.28,-3.1l-0.54,-2.38l-1.69,-0.89l0.36,-0.8l2.18,-0.05l1.19,-1.8l0.76,-1.99l2.44,-0.56l-0.28,1.13l0.36,0.91l0.43,0.25Z\",\n      \"name\": \"Tajikistan\"\n    },\n    \"RO\": {\n      \"path\": \"M487.52,276.99l0.59,0.28l2.89,4.68l-0.18,3.12l0.45,1.64l1.3,0.9l1.37,-0.47l0.76,0.41l0.03,0.46l-0.83,0.52l-0.57,-0.25l-0.55,0.3l-0.63,3.8l-0.98,-0.24l-2.1,-1.28l-2.95,0.81l-1.25,0.86l-3.49,-0.17l-1.88,-0.53l-0.87,0.17l-0.86,-1.54l0.34,-0.35l-0.05,-0.61l-0.62,-0.44l-0.51,0.04l-0.55,0.55l-1.04,-0.73l-0.17,-1.29l-1.58,-1.05l-0.34,-1.15l-0.92,-0.96l1.63,-0.65l2.66,-4.89l2.39,-1.44l2.93,0.39l1.06,0.83l0.47,0.02l0.79,-0.53l1.77,-0.34l0.76,-0.87l0.76,0.0Z\",\n      \"name\": \"Romania\"\n    },\n    \"GW\": {\n      \"path\": \"M386.23,383.41l-0.29,0.84l0.15,0.61l-2.21,0.6l-0.86,0.96l-1.04,-0.83l-1.09,-0.23l-0.54,-1.07l-0.66,-0.5l2.41,-0.49l4.13,0.1Z\",\n      \"name\": \"Guinea-Bissau\"\n    },\n    \"GT\": {\n      \"path\": \"M195.08,379.54l-2.48,-0.37l-1.03,-0.46l-1.14,-0.9l0.3,-1.01l-0.24,-0.68l0.96,-1.69l2.98,-0.01l0.4,-0.37l-0.19,-1.29l-1.68,-1.44l0.53,-0.4l0.0,-1.08l3.85,0.02l-0.21,4.61l0.4,0.43l1.48,0.38l-1.5,1.01l-0.34,0.71l0.12,0.57l-2.2,1.98Z\",\n      \"name\": \"Guatemala\"\n    },\n    \"GR\": {\n      \"path\": \"M487.09,300.31l-0.62,1.67l-0.37,0.23l-2.84,-0.38l-3.03,0.86l-0.18,0.66l1.34,1.43l-0.67,0.28l-1.12,0.0l-1.2,-1.54l-0.65,0.03l-0.52,1.05l0.56,1.95l1.06,1.34l-0.61,0.46l-0.05,0.59l2.53,2.34l0.02,1.02l-1.77,-0.64l-0.5,0.54l0.53,1.16l-1.1,0.23l-0.3,0.52l0.77,2.24l-0.99,0.02l-1.84,-1.22l-1.37,-4.59l-2.21,-3.25l-0.12,-0.67l1.06,-1.44l0.2,-1.06l0.84,-0.7l0.03,-0.55l1.33,-0.24l1.01,-0.71l1.21,0.06l0.67,-0.62l2.26,-0.01l1.8,-0.83l1.85,1.11l2.28,-0.31l0.35,-0.39l0.01,-0.9l0.35,0.26ZM480.49,319.61l0.67,0.51l-0.8,-0.16l0.13,-0.35ZM482.3,320.35l2.74,0.05l0.29,0.4l-2.04,0.15l-0.32,-0.47l-0.67,-0.13Z\",\n      \"name\": \"Greece\"\n    },\n    \"GQ\": {\n      \"path\": \"M448.79,409.52l0.02,2.22l-4.09,0.0l0.69,-2.27l3.38,0.05Z\",\n      \"name\": \"Eq. Guinea\"\n    },\n    \"GY\": {\n      \"path\": \"M277.42,399.96l-0.32,1.83l-1.32,0.57l-0.23,0.46l-0.28,2.01l1.11,1.82l0.83,0.19l0.32,1.25l1.13,1.62l-1.21,-0.19l-1.08,0.71l-1.77,0.5l-0.44,0.46l-0.86,-0.09l-1.32,-1.01l-0.77,-2.27l0.36,-1.91l0.68,-1.23l-0.57,-1.17l-0.74,-0.43l0.12,-1.16l-0.9,-0.69l-1.1,0.09l-1.31,-1.48l0.53,-0.72l-0.04,-0.84l1.99,-0.86l0.05,-0.59l-0.71,-0.78l0.14,-0.57l1.66,-1.24l1.36,0.77l1.41,1.5l0.06,1.15l0.37,0.38l0.8,0.05l2.06,1.87Z\",\n      \"name\": \"Guyana\"\n    },\n    \"GE\": {\n      \"path\": \"M521.61,293.9l5.38,1.03l3.26,1.57l0.84,0.7l1.39,-0.49l2.05,0.63l0.69,1.25l1.15,0.65l-0.2,0.63l1.05,1.54l-1.06,-0.15l-1.81,-0.93l-0.97,0.52l-3.21,0.48l-2.28,-1.55l-2.37,0.06l0.23,-1.11l-0.75,-2.51l-1.45,-1.26l-1.43,-0.44l-0.53,-0.61Z\",\n      \"name\": \"Georgia\"\n    },\n    \"GB\": {\n      \"path\": \"M412.72,233.04l-2.32,4.44l0.45,0.57l2.5,-0.63l2.22,0.02l-0.56,3.24l-2.22,4.0l0.31,0.59l2.36,0.26l2.34,5.43l1.76,0.84l2.21,6.35l2.96,0.93l-0.25,2.13l-1.17,1.09l-0.09,0.47l0.87,1.82l-1.92,1.78l-3.29,-0.02l-4.09,1.04l-1.02,-0.68l-0.52,0.07l-1.5,1.67l-2.09,-0.4l-1.88,1.4l-0.67,-0.39l3.29,-3.71l2.15,-0.83l0.25,-0.41l-0.33,-0.35l-3.72,-0.64l-0.47,-1.06l2.27,-1.1l0.17,-0.57l-1.29,-2.09l0.39,-2.22l3.35,0.34l0.44,-0.34l0.37,-2.46l-1.77,-2.98l-3.1,-0.89l-0.43,-0.84l0.8,-2.18l-0.82,-1.22l-0.67,0.01l-0.66,1.02l-0.1,-3.02l-1.24,-2.37l0.87,-4.6l1.78,-3.54l1.83,0.33l2.26,-0.3ZM406.3,251.21l-1.06,2.32l-1.53,-0.71l-1.21,0.0l0.4,-1.97l-0.42,-1.89l1.46,-0.13l2.36,2.36Z\",\n      \"name\": \"United Kingdom\"\n    },\n    \"GA\": {\n      \"path\": \"M453.24,409.42l-0.08,0.98l0.7,1.29l2.36,0.24l-0.98,2.63l1.18,1.79l0.25,1.78l-0.29,1.52l-0.6,0.93l-1.84,-0.09l-1.23,-1.11l-0.66,0.23l-0.15,0.84l-1.42,0.26l-1.02,0.7l-0.11,0.52l0.77,1.35l-1.34,0.98l-3.94,-4.31l-1.44,-2.45l0.06,-0.6l0.54,-0.81l1.05,-3.46l4.17,-0.07l0.4,-0.4l-0.02,-2.66l2.39,0.21l1.25,-0.27Z\",\n      \"name\": \"Gabon\"\n    },\n    \"GN\": {\n      \"path\": \"M391.8,383.91l0.47,0.81l1.11,-0.32l0.98,0.71l1.07,0.2l2.26,-1.23l0.63,0.44l1.13,1.58l-0.48,1.41l0.8,0.3l-0.08,0.48l0.46,0.69l-0.35,1.37l1.05,2.63l-1.0,0.69l0.03,1.42l-0.72,-0.06l-1.07,1.01l-0.24,-0.27l0.07,-1.11l-1.05,-1.55l-0.49,-0.14l-1.3,0.36l-0.35,-2.01l-1.6,-2.19l-2.0,-0.0l-1.31,0.54l-1.95,2.19l-1.86,-2.2l-1.2,-0.78l-0.3,-1.12l-0.8,-0.86l0.65,-0.73l0.81,-0.03l1.64,-0.8l0.23,-1.88l2.67,0.64l0.89,-0.31l1.21,0.15Z\",\n      \"name\": \"Guinea\"\n    },\n    \"GM\": {\n      \"path\": \"M379.31,381.18l0.1,-0.36l2.43,-0.07l0.74,-0.62l0.5,-0.03l0.83,0.53l-1.08,-0.33l-1.87,0.91l-1.65,-0.04ZM384.0,380.68l0.95,0.06l0.76,-0.23l-0.59,0.32l-1.11,-0.15Z\",\n      \"name\": \"Gambia\"\n    },\n    \"GL\": {\n      \"path\": \"M352.9,3.19l15.35,16.28l-4.35,6.99l-9.4,0.81l-13.48,1.81l-0.32,0.54l1.26,3.26l0.46,0.25l8.67,-1.96l7.39,6.05l0.55,-0.04l4.4,-4.95l1.83,5.61l-2.72,9.68l0.18,0.45l0.48,-0.06l6.34,-6.15l11.94,-6.62l7.14,3.24l1.33,6.85l-10.07,11.17l-1.42,3.42l-7.83,2.5l-0.28,0.42l0.35,0.36l5.33,0.65l-2.8,9.83l-2.03,8.69l0.08,13.63l2.84,7.11l-3.6,0.49l-4.12,3.47l-0.05,0.56l4.54,5.53l0.56,8.17l-2.39,0.81l-0.24,0.53l3.05,7.7l-5.05,0.6l-0.27,0.64l2.78,3.54l-0.72,2.75l-3.27,1.26l-3.42,0.02l-0.35,0.59l3.09,5.7l0.03,2.82l-4.32,-2.99l-0.57,0.13l-1.29,2.22l0.14,0.54l3.3,2.0l3.18,4.75l0.88,5.79l-3.85,1.25l-4.86,-7.12l-0.48,-0.14l-0.24,0.44l0.83,5.08l-2.81,3.81l0.3,0.64l9.17,0.61l-6.07,5.68l-6.74,5.42l-7.2,2.3l-2.98,0.14l-2.66,2.67l-3.44,6.75l-5.23,4.25l-1.73,0.27l-7.11,3.08l-2.15,3.69l-0.09,4.21l-1.22,3.58l-4.03,4.36l0.89,4.48l-2.31,8.95l-3.05,0.26l-3.56,-4.0l-5.12,-0.16l-2.26,-2.64l-1.69,-5.21l-4.31,-6.82l-1.24,-3.62l-0.4,-5.4l-3.39,-5.47l0.87,-4.47l-1.62,-2.41l2.37,-7.41l3.81,-2.67l1.01,-3.01l0.52,-5.6l-0.22,-0.39l-0.45,0.06l-4.16,3.58l-1.99,0.9l-2.73,-2.07l-0.16,-4.72l0.9,-3.66l1.94,-0.09l5.03,1.98l0.47,-0.14l-0.03,-0.49l-6.54,-7.53l-0.47,-0.11l-2.25,1.0l-1.7,-1.6l2.69,-7.67l-1.51,-3.12l-4.99,-15.74l-3.17,-3.76l-0.11,-4.29l-6.93,-6.07l-5.4,-0.76l-12.62,1.16l-2.75,-3.16l-4.1,-6.46l6.13,-3.31l4.96,-0.6l0.35,-0.37l-0.29,-0.42l-10.63,-2.99l-5.42,-4.66l0.32,-4.37l9.32,-6.03l9.34,-6.65l0.97,-5.04l-0.15,-0.39l-6.52,-4.97l2.06,-5.6l8.57,-10.89l3.56,-1.73l0.22,-0.41l-1.01,-7.43l5.7,-4.5l7.58,-2.82l7.37,-0.16l2.62,5.4l0.69,0.04l6.35,-9.67l5.63,6.55l3.58,1.5l5.14,5.66l0.54,0.05l0.1,-0.53l-5.89,-9.52l0.33,-7.89l8.21,-11.86l8.55,0.93l0.41,-0.25l3.12,-7.8l8.58,-2.09l19.79,2.78Z\",\n      \"name\": \"Greenland\"\n    },\n    \"GH\": {\n      \"path\": \"M420.53,387.35l-0.01,0.72l0.96,1.2l0.24,3.75l0.59,0.95l-0.51,2.1l0.19,1.41l1.02,2.22l-6.97,2.85l-1.8,-0.57l0.04,-0.89l-1.02,-2.04l0.61,-2.66l1.07,-2.33l-0.96,-6.5l5.01,0.07l0.94,-0.39l0.61,0.11Z\",\n      \"name\": \"Ghana\"\n    },\n    \"OM\": {\n      \"path\": \"M568.09,360.37l-0.91,1.71l-1.22,0.04l-0.59,0.78l-0.41,1.53l0.26,1.63l-1.16,0.05l-1.56,0.99l-0.76,1.78l-1.62,0.05l-0.98,0.66l-0.17,1.17l-0.89,0.53l-1.49,-0.18l-2.4,0.95l-2.48,-5.51l7.35,-2.77l1.67,-5.36l-1.12,-2.14l0.05,-0.87l0.67,-1.04l0.07,-1.08l0.91,-0.43l-0.05,-2.14l0.7,-0.01l1.01,1.68l1.51,1.12l3.3,0.87l1.73,2.37l0.81,0.38l-1.23,2.44l-0.99,0.81ZM561.83,347.23l-0.0,-0.01l0.01,-0.01l-0.0,0.02Z\",\n      \"name\": \"Oman\"\n    },\n    \"TN\": {\n      \"path\": \"M448.18,315.32l-1.08,1.46l-0.02,1.43l0.84,0.93l-0.29,2.3l-1.65,1.83l0.48,1.65l1.41,0.33l0.53,1.2l0.9,0.55l-0.11,1.83l-3.54,2.81l-0.09,2.52l-0.58,0.32l-0.96,-4.72l-1.54,-1.32l-0.15,-0.82l-1.93,-1.68l-0.19,-1.93l1.52,-1.74l0.59,-2.52l-0.38,-3.0l0.43,-1.35l2.45,-1.14l1.29,0.28l-0.06,1.25l0.59,0.37l1.54,-0.84Z\",\n      \"name\": \"Tunisia\"\n    },\n    \"JO\": {\n      \"path\": \"M518.65,329.54l-5.15,1.67l-0.19,0.64l2.19,2.56l-0.58,0.44l-0.33,0.78l-1.71,0.36l-1.71,1.89l-2.34,-0.38l1.21,-4.6l0.56,-4.33l2.81,0.99l4.45,-2.88l0.8,2.87Z\",\n      \"name\": \"Jordan\"\n    },\n    \"HR\": {\n      \"path\": \"M455.59,286.98l1.42,0.1l0.57,-0.46l0.74,0.44l0.98,0.07l0.43,-0.4l-0.01,-0.73l0.86,-0.57l0.21,-1.25l1.62,-0.78l2.55,1.93l2.07,0.69l0.88,-0.35l1.09,1.85l-0.56,0.77l-1.05,-0.63l-1.67,0.05l-2.1,-0.57l-1.3,0.07l-0.58,0.54l-0.57,-0.52l-0.65,0.16l-0.47,1.84l1.79,2.75l2.11,2.07l0.81,1.23l-1.27,-1.06l-2.2,-0.99l-1.73,-2.1l0.2,-0.63l-1.06,-1.38l-0.31,-1.43l-1.61,-0.56l-0.49,0.2l-0.45,0.89l-0.26,-1.24Z\",\n      \"name\": \"Croatia\"\n    },\n    \"HT\": {\n      \"path\": \"M238.65,368.15l-1.58,-0.17l-1.19,0.44l-0.91,-0.56l0.06,-0.21l3.62,0.5ZM239.22,368.07l0.82,-0.54l0.06,-0.62l-1.02,-1.03l0.02,-0.84l-0.3,-0.39l-0.93,-0.35l3.16,0.46l0.02,1.9l-0.48,0.35l-0.07,0.58l0.54,0.74l-1.81,-0.26Z\",\n      \"name\": \"Haiti\"\n    },\n    \"HU\": {\n      \"path\": \"M462.05,281.37l0.68,-1.93l-0.16,-0.54l0.71,-0.0l0.39,-0.35l0.1,-0.84l1.72,1.0l2.35,-0.43l0.43,-0.77l3.49,-0.92l0.69,-0.91l0.54,-0.15l2.55,1.09l0.69,-0.26l1.03,0.76l0.1,0.55l-1.45,0.83l-2.6,4.82l-1.79,0.61l-1.69,-0.11l-2.72,1.41l-1.83,-0.61l-2.55,-1.92l-0.7,-1.3Z\",\n      \"name\": \"Hungary\"\n    },\n    \"HN\": {\n      \"path\": \"M199.6,379.29l-1.71,-1.22l0.07,-0.96l3.04,-2.17l2.37,0.29l1.27,-0.09l1.1,-0.53l1.3,0.28l1.14,-0.26l1.37,0.37l2.25,1.39l-2.37,0.95l-1.23,-0.4l-0.88,1.31l-1.28,1.0l-0.43,-0.3l-0.55,0.08l-0.42,0.53l-0.96,0.05l-0.36,0.41l0.04,0.89l-0.52,0.6l-0.3,0.04l-0.3,-0.56l-0.66,-0.32l0.12,-0.68l-0.48,-0.66l-0.63,-0.25l-0.97,0.2Z\",\n      \"name\": \"Honduras\"\n    },\n    \"PR\": {\n      \"path\": \"M256.17,368.34l-0.27,0.28l-2.83,0.06l-0.07,-0.57l1.95,-0.1l1.23,0.34Z\",\n      \"name\": \"Puerto Rico\"\n    },\n    \"PS\": {\n      \"path\": \"M509.06,331.4l0.27,-0.17l-0.04,0.09l-0.23,0.08ZM509.37,331.14l-0.03,-0.63l-0.35,-0.18l0.32,-1.21l0.24,0.11l-0.19,1.91Z\",\n      \"name\": \"Palestine\"\n    },\n    \"PT\": {\n      \"path\": \"M401.85,314.47l-0.65,0.52l-1.11,-0.37l-0.93,0.18l0.29,-1.97l-0.24,-1.95l-1.24,-0.59l-0.47,-0.95l0.18,-1.87l1.01,-1.29l0.69,-3.25l-0.04,-1.52l-0.59,-2.16l1.29,-0.96l0.85,1.5l3.09,-0.33l0.49,1.17l-1.07,1.02l-0.03,2.43l-0.41,0.6l-0.08,1.25l-0.8,0.2l-0.26,0.57l0.93,1.79l-0.64,1.95l0.78,1.16l-1.12,1.72l0.08,1.13Z\",\n      \"name\": \"Portugal\"\n    },\n    \"PY\": {\n      \"path\": \"M274.9,466.41l0.74,1.55l-0.16,3.55l0.32,0.41l2.64,0.52l1.11,-0.48l1.4,0.6l0.36,0.62l0.53,3.53l1.27,0.41l0.98,-0.39l0.52,0.28l-0.0,1.23l-1.21,5.54l-2.09,1.99l-1.8,0.41l-4.72,-1.03l2.21,-3.81l-0.32,-1.54l-2.77,-1.32l-3.03,-2.01l-2.07,-0.45l-4.34,-4.19l0.91,-2.99l0.08,-1.45l1.07,-2.09l4.13,-0.73l2.18,0.04l2.06,1.2l0.03,0.61Z\",\n      \"name\": \"Paraguay\"\n    },\n    \"PA\": {\n      \"path\": \"M213.79,393.56l0.26,-1.53l-0.36,-0.26l-0.01,-0.5l0.44,-0.1l0.93,1.4l1.26,0.03l0.77,0.5l1.38,-0.24l2.51,-1.12l0.86,-0.72l3.45,0.85l1.4,1.19l0.41,1.75l-0.21,0.34l-0.53,-0.12l-0.47,0.29l-0.16,0.6l-0.68,-1.28l0.45,-0.49l-0.19,-0.66l-0.47,-0.13l-0.54,-0.84l-1.5,-0.75l-1.1,0.16l-0.75,0.99l-1.62,0.84l-0.18,0.96l0.85,0.97l-0.58,0.45l-0.69,0.08l-0.34,-1.18l-1.27,0.03l-0.71,-1.05l-2.59,-0.47Z\",\n      \"name\": \"Panama\"\n    },\n    \"PG\": {\n      \"path\": \"M808.58,428.76l2.54,2.57l-0.13,0.26l-0.33,0.12l-0.87,-0.78l-1.22,-2.17ZM801.41,422.94l0.51,0.29l0.26,0.27l-0.49,-0.36l-0.28,-0.21ZM803.17,424.48l0.59,0.5l0.08,1.06l-0.29,-0.91l-0.38,-0.65ZM796.68,428.31l0.52,0.75l1.43,-0.19l2.27,-1.82l-0.01,-1.43l1.12,0.16l-0.04,1.1l-0.7,1.28l-1.12,0.18l-0.62,0.79l-2.46,1.11l-1.17,-0.0l-3.08,-1.25l3.41,0.0l0.45,-0.68ZM789.15,433.47l2.31,1.81l1.59,2.62l1.34,0.14l-0.06,0.66l0.31,0.43l1.06,0.24l0.06,0.66l2.25,1.06l-1.21,0.13l-0.72,-0.64l-4.56,-0.65l-3.22,-2.89l-1.49,-2.35l-3.27,-1.11l-2.38,0.72l-1.59,0.86l-0.2,0.42l0.27,1.56l-1.55,0.69l-1.36,-0.4l-2.21,-0.09l-0.08,-15.44l8.39,2.93l2.95,2.4l0.6,1.64l4.02,1.5l0.31,0.69l-1.76,0.21l-0.33,0.52l0.55,1.68Z\",\n      \"name\": \"Papua New Guinea\"\n    },\n    \"PE\": {\n      \"path\": \"M244.97,425.11l-1.26,-0.07l-0.57,0.42l-1.93,0.45l-2.98,1.76l-0.36,1.36l-0.58,0.8l0.12,1.37l-1.24,0.6l-0.22,1.22l-0.62,0.84l1.04,2.28l1.28,1.44l-0.41,0.85l0.32,0.57l1.48,0.13l1.16,1.37l2.21,0.07l1.63,-1.08l-0.13,3.04l0.3,0.4l1.14,0.29l1.31,-0.35l1.9,3.62l-0.48,0.86l-0.17,3.89l-0.94,1.6l0.35,0.76l-0.48,1.08l0.98,2.0l-2.1,3.89l-0.97,0.51l-2.17,-1.31l-0.39,-1.18l-4.95,-2.62l-4.46,-2.82l-1.85,-1.53l-0.91,-1.87l0.3,-0.97l-2.11,-3.36l-4.82,-9.74l-1.04,-1.2l-0.87,-1.95l-3.4,-2.49l0.58,-1.18l-1.13,-2.23l0.66,-1.5l1.45,-1.15l-0.6,0.99l0.07,0.92l0.47,0.36l1.74,0.03l0.97,1.17l0.54,0.07l1.42,-1.03l0.6,-1.84l1.42,-2.02l3.04,-1.04l2.73,-2.62l0.86,-1.74l-0.1,-1.87l1.44,1.02l0.9,1.25l1.06,0.59l1.7,2.73l1.86,0.31l1.45,-0.61l0.96,0.39l1.36,-0.19l1.45,0.89l-1.4,2.21l0.31,0.61l0.59,0.05l0.47,0.5Z\",\n      \"name\": \"Peru\"\n    },\n    \"PK\": {\n      \"path\": \"M615.13,319.81l-1.88,2.0l-2.59,0.42l-3.73,-0.73l-1.6,1.43l-0.09,0.4l1.77,4.7l1.73,1.32l-1.73,1.38l-0.11,2.26l-2.34,2.8l-1.59,2.95l-2.46,2.8l-3.03,-0.07l-2.76,2.96l0.05,0.59l1.51,1.16l0.26,1.98l1.44,1.55l0.37,1.77l-5.02,-0.01l-1.78,1.76l-1.41,-0.53l-0.76,-1.94l-2.27,-2.23l-11.61,0.89l0.72,-2.47l3.43,-1.37l0.25,-0.43l-0.21,-1.29l-1.2,-0.67l-0.28,-2.57l-2.29,-1.2l-1.32,-2.09l2.85,1.0l2.62,-0.4l1.42,0.35l0.77,-0.59l1.71,0.2l3.25,-1.2l0.26,-0.36l0.08,-2.33l1.19,-1.41l1.68,0.0l0.58,-0.87l1.59,-0.32l1.2,0.17l0.98,-0.83l0.01,-1.99l0.94,-1.58l1.48,-0.71l0.19,-0.54l-0.69,-1.39l2.06,-0.12l0.69,-1.09l-0.03,-1.23l1.12,-1.15l-0.18,-1.88l-0.5,-1.14l1.17,-1.09l5.42,-0.99l2.59,-0.89l1.6,1.26l0.97,2.53l3.5,1.06Z\",\n      \"name\": \"Pakistan\"\n    },\n    \"PH\": {\n      \"path\": \"M737.01,393.71l0.39,2.98l-0.44,1.19l-0.55,-1.53l-0.67,-0.14l-1.17,1.28l0.65,2.1l-0.42,0.69l-2.48,-1.23l-0.58,-1.49l0.66,-1.03l-0.1,-0.53l-1.59,-1.19l-0.56,0.08l-0.65,0.87l-1.23,0.0l-1.58,0.97l0.83,-1.81l2.56,-1.42l0.65,0.84l0.45,0.13l1.9,-0.69l0.56,-1.12l1.5,-0.06l0.38,-0.43l-0.09,-1.2l1.21,0.72l0.36,2.03ZM733.59,386.41l0.05,0.76l0.08,0.27l-0.8,-0.42l-0.18,-0.72l0.85,0.12ZM734.08,385.93l-0.12,-1.13l-1.01,-1.29l1.36,0.03l0.53,0.73l0.51,2.06l-1.27,-0.4ZM733.76,387.52l0.39,0.99l-0.32,0.15l-0.07,-1.14ZM724.65,368.03l1.46,0.71l0.72,-0.31l-0.32,1.19l0.79,1.74l-0.57,1.88l-1.53,1.06l-0.39,2.27l0.56,2.06l1.63,0.57l1.16,-0.27l2.72,1.24l-0.19,1.1l0.77,0.85l-0.08,0.37l-1.4,-0.9l-0.88,-1.29l-0.66,0.0l-0.38,0.55l-1.6,-1.32l-2.15,0.36l-0.87,-0.4l0.07,-0.62l0.66,-0.56l-0.01,-0.62l-0.75,-0.6l-0.72,0.44l-0.73,-0.88l-0.39,-2.53l0.32,0.27l0.66,-0.28l0.26,-4.04l0.71,-2.06l1.14,0.0ZM731.03,388.72l-0.88,0.85l-1.19,1.95l-1.05,-1.2l0.93,-1.11l0.32,-1.48l0.52,-0.06l-0.27,1.16l0.22,0.45l0.49,-0.12l1.0,-1.32l-0.08,0.86ZM726.83,385.61l0.83,0.38l1.17,-0.0l-0.02,0.48l-2.0,1.41l0.02,-2.28ZM724.81,381.88l-0.39,1.29l-1.42,-1.98l1.2,0.05l0.6,0.64ZM716.54,391.7l1.12,-0.97l0.03,-0.03l-0.28,0.38l-0.87,0.63ZM719.21,388.91l0.04,-0.07l0.8,-1.54l0.16,0.76l-1.01,0.85Z\",\n      \"name\": \"Philippines\"\n    },\n    \"PL\": {\n      \"path\": \"M468.45,271.45l-1.1,-1.82l-1.87,-0.39l-0.48,-1.25l-1.72,-0.44l-0.47,0.25l-0.21,0.56l-0.72,-0.43l0.12,-0.82l-0.32,-0.45l-1.74,-0.32l-1.05,-1.13l-0.96,-2.4l0.17,-1.46l-0.62,-2.19l-0.82,-1.37l0.61,-1.22l-0.51,-1.88l1.46,-1.07l6.88,-3.37l2.12,0.62l0.15,0.81l0.38,0.33l5.51,0.54l4.53,-0.06l1.06,0.38l0.5,1.09l0.14,1.93l0.66,1.51l-0.01,1.34l-1.3,0.73l-0.17,0.5l0.74,1.83l0.07,1.86l1.22,3.37l-0.19,0.78l-1.23,0.53l-2.27,3.23l0.24,1.15l-1.99,-1.23l-2.01,0.46l-1.38,-0.32l-1.2,0.67l-1.05,-1.13l-1.17,0.27Z\",\n      \"name\": \"Poland\"\n    },\n    \"ZM\": {\n      \"path\": \"M481.47,443.27l0.39,0.31l2.52,0.15l0.99,1.18l2.01,0.36l1.4,-0.64l0.69,1.18l1.78,0.33l1.84,2.38l2.24,0.19l0.4,-0.43l-0.21,-2.77l-0.62,-0.3l-0.48,0.33l-1.98,-1.18l0.72,-5.32l-0.51,-1.19l0.58,-1.31l3.68,-0.62l0.26,0.64l1.21,0.63l0.9,-0.22l2.16,0.67l1.33,0.71l1.07,1.02l0.56,1.89l-0.88,2.72l0.43,2.1l-0.73,0.88l-0.76,2.39l0.6,0.68l-6.61,1.85l-0.29,0.44l0.19,1.47l-1.69,0.36l-1.43,1.04l-0.38,0.89l-0.87,0.26l-3.48,3.75l-4.15,-0.54l-1.52,-1.01l-1.77,-0.14l-1.82,0.53l-3.04,-3.46l0.11,-7.69l4.82,0.03l0.39,-0.49l-0.18,-0.76l0.33,-0.84l-0.4,-1.37l0.24,-1.06Z\",\n      \"name\": \"Zambia\"\n    },\n    \"EH\": {\n      \"path\": \"M384.42,359.7l0.26,-0.83l1.06,-1.32l0.8,-3.63l3.38,-2.88l0.69,-1.87l0.06,5.03l-1.98,0.21l-0.94,1.63l0.39,3.66l-3.71,-0.01ZM392.0,347.13l0.72,-1.91l1.77,-0.25l2.09,0.35l0.96,-0.65l1.27,-0.07l-0.0,2.65l-6.8,-0.12Z\",\n      \"name\": \"W. Sahara\"\n    },\n    \"EE\": {\n      \"path\": \"M485.7,228.2l2.62,0.79l2.44,-0.11l0.18,0.41l-1.67,2.62l0.66,4.56l-0.85,1.18l-1.72,-0.01l-3.21,-2.27l-1.85,0.58l0.22,-2.14l-0.62,-0.38l-0.64,0.42l-1.26,-1.35l-0.18,-2.36l2.87,-1.24l3.02,-0.69Z\",\n      \"name\": \"Estonia\"\n    },\n    \"EG\": {\n      \"path\": \"M492.06,333.38l1.47,0.44l2.95,-1.74l2.03,-0.22l1.52,0.32l0.6,1.27l0.7,0.04l0.41,-0.68l1.8,0.61l1.95,0.17l1.04,-0.54l1.43,4.34l-2.03,4.78l-1.66,-1.85l-1.76,-4.05l-0.65,-0.12l-0.35,0.67l1.04,3.03l3.44,7.26l1.77,3.16l2.04,2.76l-0.37,0.54l0.22,2.06l2.73,2.28l-28.43,0.0l0.0,-19.72l-0.73,-2.31l0.6,-1.66l-0.33,-1.32l0.69,-1.07l3.05,-0.04l4.82,1.62Z\",\n      \"name\": \"Egypt\"\n    },\n    \"ZA\": {\n      \"path\": \"M467.15,505.21l-0.13,-2.11l-0.69,-1.7l0.71,-0.7l-0.12,-2.46l-4.57,-8.67l0.78,-0.92l0.59,0.47l0.69,1.37l2.83,0.75l1.5,-0.27l2.24,-1.46l0.18,-9.94l1.35,2.39l-0.21,1.57l0.61,1.24l0.41,0.2l1.79,-0.29l2.61,-2.16l0.69,-1.37l0.95,-0.5l2.19,1.08l2.04,0.14l1.78,-0.67l0.85,-2.2l1.38,-0.34l1.59,-2.85l2.15,-1.95l3.41,-1.92l1.99,0.46l1.02,-0.28l0.99,0.2l1.75,5.47l-0.37,3.39l-0.82,-0.24l-1.0,0.47l-0.87,1.75l-0.04,1.2l1.98,1.91l1.47,-0.3l0.7,-1.24l1.09,0.01l-0.77,3.89l-0.58,1.15l-2.2,1.88l-3.17,5.02l-2.8,3.01l-3.57,3.07l-2.53,1.12l-1.22,0.15l-0.51,0.75l-1.17,-0.34l-1.4,0.54l-2.58,-0.55l-1.62,0.35l-1.19,-0.11l-2.54,1.18l-2.1,0.47l-1.6,1.15l-0.84,0.05l-0.93,-0.95l-0.93,-0.16l-0.97,-1.21l-0.25,0.05ZM491.46,495.56l0.62,-0.98l1.48,-0.62l1.18,-2.31l-0.07,-0.48l-1.99,-1.77l-1.68,0.59l-1.42,1.19l-1.34,1.82l0.02,0.49l1.88,2.23l1.32,-0.17Z\",\n      \"name\": \"South Africa\"\n    },\n    \"EC\": {\n      \"path\": \"M231.86,415.43l0.29,1.59l-0.69,1.45l-2.61,2.51l-3.13,1.11l-1.53,2.18l-0.49,1.68l-1.0,0.73l-1.02,-1.11l-1.78,-0.16l0.67,-1.15l-0.24,-0.86l1.25,-2.13l-0.54,-1.09l-0.67,-0.08l-0.72,0.87l-0.87,-0.64l0.35,-0.69l-0.36,-1.96l0.81,-0.51l0.45,-1.51l0.92,-1.57l-0.07,-0.97l2.65,-1.33l2.75,1.35l0.77,1.05l2.12,0.35l0.76,-0.32l1.96,1.21Z\",\n      \"name\": \"Ecuador\"\n    },\n    \"IT\": {\n      \"path\": \"M451.58,282.14l3.5,1.08l-0.22,1.43l0.34,1.0l-1.55,-0.28l-2.22,1.64l0.13,1.69l-0.27,1.22l0.82,1.78l2.39,1.84l1.3,2.87l2.79,2.73l2.05,0.1l0.25,0.31l-0.43,0.41l0.09,0.64l4.05,2.19l2.2,2.0l-0.17,0.42l-1.16,-1.17l-2.18,-0.54l-0.45,0.21l-1.05,2.12l0.14,0.51l1.59,1.06l-0.2,1.15l-1.06,0.36l-1.25,2.57l-0.36,0.08l0.0,-0.41l1.01,-2.65l-1.73,-3.5l-1.12,-0.56l-0.67,-1.29l-1.72,-0.75l-1.01,-1.25l-2.01,-0.35l-4.11,-3.59l-1.63,-1.87l-1.03,-3.6l-3.56,-1.55l-1.3,0.58l-1.68,1.6l0.17,-0.9l-0.27,-0.45l-1.14,-0.37l-0.55,-2.31l0.78,-1.37l-0.66,-1.44l0.81,0.44l1.41,-0.27l1.08,-0.94l0.53,0.39l1.19,-0.11l0.75,-1.38l1.51,0.37l1.39,-0.65l0.34,-1.31l1.06,0.36l0.5,-0.22l0.21,-0.51l1.95,-0.5l0.42,0.96ZM459.21,311.54l-0.67,1.87l0.33,1.12l-0.32,0.99l-1.48,-0.91l-4.52,-1.83l0.21,-0.97l2.67,0.25l3.8,-0.53ZM443.92,301.94l1.19,1.86l-0.3,3.74l-1.07,-0.01l-0.75,0.79l-0.53,-0.48l-0.1,-3.76l-0.41,-1.41l1.07,0.0l0.9,-0.74Z\",\n      \"name\": \"Italy\"\n    },\n    \"VN\": {\n      \"path\": \"M690.58,359.66l-2.72,1.89l-2.09,2.52l-0.63,1.98l4.31,6.55l2.32,1.68l1.44,1.97l1.11,4.65l-0.32,4.28l-1.93,1.55l-2.84,1.62l-2.11,2.17l-2.73,2.07l-0.59,-1.06l0.63,-1.54l-0.12,-0.47l-1.34,-1.05l1.51,-0.72l2.55,-0.18l0.3,-0.63l-0.82,-1.16l4.0,-2.09l0.31,-3.08l-0.57,-1.79l0.42,-2.69l-0.73,-1.99l-1.86,-1.79l-3.63,-5.38l-2.73,-1.5l0.37,-0.5l1.5,-0.65l0.21,-0.52l-0.97,-2.33l-0.37,-0.25l-2.83,-0.02l-2.25,-4.02l0.84,-0.42l4.39,-0.3l2.06,-1.35l1.15,0.91l1.88,0.41l-0.18,1.55l1.36,1.19l1.69,0.47Z\",\n      \"name\": \"Vietnam\"\n    },\n    \"SB\": {\n      \"path\": \"M826.68,441.55l-0.6,0.09l-0.2,-0.34l0.37,0.15l0.44,0.09ZM824.18,437.32l-0.26,-0.31l-0.31,-0.91l0.03,0.0l0.54,1.22ZM823.04,439.28l-1.66,-0.22l-0.2,-0.53l1.16,0.28l0.7,0.47ZM819.26,434.58l1.17,0.66l0.03,0.04l-0.82,-0.45l-0.38,-0.25Z\",\n      \"name\": \"Solomon Is.\"\n    },\n    \"ET\": {\n      \"path\": \"M516.04,377.54l1.1,0.85l1.63,-0.46l0.68,0.48l1.63,0.03l2.01,0.96l1.73,1.68l1.64,2.1l-1.52,2.06l0.16,1.73l0.39,0.38l2.05,0.01l-0.36,1.03l2.86,3.6l8.32,3.09l1.32,0.02l-6.33,6.76l-3.1,0.11l-2.36,1.77l-1.47,0.04l-0.86,0.79l-1.38,-0.0l-1.32,-0.81l-2.29,1.05l-0.76,0.98l-3.29,-0.41l-3.07,-2.07l-1.8,-0.07l-0.62,-0.6l0.0,-1.24l-0.28,-0.38l-1.15,-0.37l-1.4,-2.6l-1.19,-0.69l-0.47,-1.01l-1.27,-1.23l-1.16,-0.22l0.43,-0.73l1.45,-0.28l0.41,-0.95l-0.03,-2.22l0.68,-2.45l1.05,-0.63l1.43,-3.08l1.57,-1.38l1.02,-2.53l0.35,-1.9l2.52,0.47l0.44,-0.24l0.58,-1.44Z\",\n      \"name\": \"Ethiopia\"\n    },\n    \"SO\": {\n      \"path\": \"M525.13,418.38l-1.13,-1.57l-0.03,-8.86l2.66,-3.38l1.67,-0.13l2.13,-1.69l3.41,-0.23l7.08,-7.57l2.91,-3.71l0.08,-4.85l2.98,-0.67l1.24,-0.87l0.45,-0.0l-0.2,3.03l-1.21,3.64l-2.73,6.0l-2.13,3.66l-5.03,6.17l-8.56,6.4l-2.78,3.08l-0.8,1.56Z\",\n      \"name\": \"Somalia\"\n    },\n    \"ZW\": {\n      \"path\": \"M498.91,471.53l-1.1,-0.22l-0.92,0.29l-2.09,-0.46l-1.49,-1.14l-1.89,-0.44l-0.62,-1.44l-0.01,-0.86l-0.3,-0.38l-0.97,-0.26l-2.72,-2.8l-1.93,-3.41l3.83,0.46l3.74,-3.89l1.08,-0.44l0.26,-0.78l1.25,-0.91l1.41,-0.26l0.5,0.9l1.99,-0.05l1.72,1.19l1.11,0.18l1.05,0.68l0.01,3.05l-0.59,3.84l0.38,0.87l-0.23,1.26l-0.39,0.36l-0.64,1.86l-2.43,2.82Z\",\n      \"name\": \"Zimbabwe\"\n    },\n    \"ES\": {\n      \"path\": \"M415.99,294.24l1.08,1.32l4.61,1.55l1.08,-0.64l2.58,1.41l2.72,-0.33l0.09,1.34l-2.15,2.02l-3.1,0.68l-0.31,0.31l-0.2,1.01l-1.54,1.87l-0.97,2.65l0.86,1.9l-1.34,1.4l-0.49,1.86l-1.88,0.7l-1.66,2.25l-5.35,-0.01l-1.81,1.17l-0.88,1.06l-0.86,-0.18l-0.79,-0.9l-0.68,-1.73l-2.37,-0.68l-0.12,-0.6l1.21,-2.0l-0.78,-1.19l0.62,-1.89l-0.8,-1.8l0.89,-0.51l0.09,-1.41l0.42,-0.63l0.03,-2.39l1.01,-0.78l0.12,-0.47l-1.04,-1.93l-1.46,-0.12l-0.63,0.42l-1.04,0.0l-0.53,-1.39l-0.55,-0.22l-1.31,0.73l0.07,-1.41l-0.87,-1.4l3.08,-2.16l2.98,0.6l3.32,-0.02l2.62,0.58l6.01,-0.06Z\",\n      \"name\": \"Spain\"\n    },\n    \"ER\": {\n      \"path\": \"M520.38,375.96l3.42,2.46l3.5,3.81l0.85,0.55l-0.95,-0.01l-3.51,-3.92l-2.33,-1.16l-1.73,-0.07l-0.91,-0.51l-1.25,0.52l-1.34,-1.03l-0.62,0.17l-0.66,1.63l-2.34,-0.43l-0.18,-0.68l1.29,-5.37l0.62,-0.63l1.95,-0.54l0.87,-1.03l1.17,2.45l0.68,2.36l1.49,1.45Z\",\n      \"name\": \"Eritrea\"\n    },\n    \"ME\": {\n      \"path\": \"M468.91,298.06l-1.24,-1.13l0.5,-2.11l0.88,-0.81l2.29,1.73l-0.52,0.71l-0.77,-0.3l-1.14,1.91Z\",\n      \"name\": \"Montenegro\"\n    },\n    \"MD\": {\n      \"path\": \"M491.9,285.98l-0.28,-1.04l0.25,-1.54l-0.15,-1.8l-3.32,-5.2l1.4,-0.31l1.71,1.08l1.07,0.18l0.88,0.78l0.03,1.44l0.78,0.52l0.33,1.38l0.81,0.94l0.0,0.67l-1.14,-0.08l-0.7,-0.47l-0.52,0.29l-0.06,0.94l-1.08,2.21Z\",\n      \"name\": \"Moldova\"\n    },\n    \"MG\": {\n      \"path\": \"M545.91,449.15l0.4,3.06l0.63,1.22l-0.21,1.04l-0.56,-0.81l-0.69,-0.01l-0.47,0.77l0.41,2.15l-0.18,0.89l-0.72,0.79l-0.15,2.18l-5.77,18.57l-3.92,1.7l-3.12,-1.54l-0.6,-1.26l-0.19,-2.48l-0.86,-2.12l-0.21,-1.83l0.39,-1.67l1.21,-0.76l0.01,-0.79l1.19,-2.08l0.23,-1.69l-1.06,-3.05l-0.19,-2.26l0.81,-1.36l0.32,-1.49l4.63,-1.23l3.44,-3.04l0.85,-1.42l-0.09,-0.71l0.78,-0.04l1.38,-1.79l0.13,-1.65l0.45,-0.62l1.16,1.7l0.59,1.62Z\",\n      \"name\": \"Madagascar\"\n    },\n    \"MA\": {\n      \"path\": \"M378.77,359.44l0.06,-0.63l0.93,-0.75l0.82,-1.41l-0.09,-1.07l0.79,-1.77l1.31,-1.64l0.95,-0.61l0.66,-1.61l0.09,-1.52l0.81,-1.54l1.72,-1.11l1.55,-2.81l1.16,-1.0l2.44,-0.41l1.94,-1.91l1.31,-0.82l2.09,-2.4l-0.51,-3.84l1.25,-3.95l1.5,-1.88l4.46,-2.74l2.37,-4.82l1.43,0.01l1.7,1.31l2.31,-0.21l3.46,0.7l0.81,1.67l0.16,1.84l0.86,3.17l0.57,0.63l-0.27,0.69l-3.05,0.46l-1.26,1.11l-1.33,0.24l-0.33,0.37l-0.09,1.91l-2.69,1.06l-1.07,1.5l-1.89,0.72l-2.58,0.47l-4.04,2.12l-0.53,4.86l-1.16,0.07l-0.92,0.64l-1.96,-0.36l-2.42,0.56l-0.74,1.99l-0.86,0.41l-1.14,3.39l-3.53,3.11l-0.81,3.66l-0.96,1.14l-0.29,0.84l-4.94,0.19Z\",\n      \"name\": \"Morocco\"\n    },\n    \"UZ\": {\n      \"path\": \"M598.64,298.24l-1.64,1.79l0.06,0.61l1.85,1.26l1.99,-0.71l2.27,1.34l-2.58,1.91l-2.57,-0.24l-0.2,-0.5l0.47,-1.39l-0.47,-0.52l-3.35,0.77l-2.1,3.89l-1.86,-0.14l-0.39,0.23l-0.65,1.43l0.21,0.53l1.65,0.69l0.47,2.05l-1.21,2.74l-1.54,-0.54l-1.11,-0.04l0.05,-1.53l-0.25,-0.38l-3.3,-1.35l-2.56,-1.53l-4.4,-3.69l-1.33,-3.48l-1.1,-0.68l-2.57,0.15l-0.7,-0.5l-0.46,-2.81l-3.37,-1.79l-0.46,0.06l-2.07,1.94l-2.09,1.14l-0.2,0.45l0.29,1.2l-1.92,0.03l-0.09,-11.97l5.98,-1.95l6.18,4.04l2.35,3.08l7.41,-0.61l2.72,2.28l-0.18,3.21l0.39,0.42l0.89,0.02l0.45,2.42l0.38,0.33l2.93,0.1l0.96,1.58l1.29,-0.25l1.05,-2.28l3.18,-2.25l1.24,-0.54Z\",\n      \"name\": \"Uzbekistan\"\n    },\n    \"MM\": {\n      \"path\": \"M673.9,359.64l-1.97,1.62l-0.57,0.98l-1.4,0.62l-1.36,1.08l-1.99,0.36l-1.08,2.72l-0.91,0.41l-0.19,0.55l1.21,2.31l2.52,3.49l-0.79,1.95l-0.74,0.41l-0.17,0.52l0.65,1.39l1.61,1.98l0.25,2.61l0.9,2.15l-1.92,3.6l0.68,-2.27l-0.81,-1.75l0.19,-2.68l-1.05,-1.54l-1.24,-6.25l-1.12,-2.29l-0.61,-0.13l-4.33,3.06l-2.39,-0.66l0.77,-2.89l-0.52,-2.65l-1.92,-3.02l0.25,-0.78l-0.29,-0.51l-1.33,-0.31l-1.61,-1.97l-0.1,-1.35l0.82,-0.23l0.04,-1.7l1.03,-0.53l0.21,-0.44l-0.23,-0.99l0.54,-0.98l0.08,-2.3l1.45,0.46l0.48,-0.2l1.12,-2.26l0.16,-1.4l1.34,-2.25l-0.01,-1.58l2.89,-1.73l1.62,0.46l0.51,-0.43l-0.17,-1.48l0.65,-0.39l0.07,-1.08l0.77,-0.11l0.71,1.41l1.06,0.72l-0.03,4.05l-2.38,2.46l-0.3,3.26l0.47,0.43l2.27,-0.39l0.51,2.15l1.47,0.69l-0.61,1.87l0.19,0.47l2.97,1.52l1.64,-0.56l0.02,0.35Z\",\n      \"name\": \"Myanmar\"\n    },\n    \"ML\": {\n      \"path\": \"M392.61,383.9l-0.19,-2.39l-0.99,-0.88l-0.44,-1.31l-0.09,-1.3l0.81,-0.59l0.35,-1.26l2.37,0.66l1.31,-0.48l0.86,0.15l0.66,-0.57l9.83,-0.04l0.38,-0.28l0.56,-1.82l-0.44,-0.66l-2.35,-22.51l3.26,-0.04l16.7,11.72l0.74,1.34l2.5,1.11l0.02,1.42l0.44,0.39l2.34,-0.22l0.01,5.49l-1.28,1.64l-0.26,1.51l-5.31,0.58l-1.08,0.93l-2.9,0.1l-0.87,-0.48l-1.38,0.37l-2.4,1.1l-0.6,0.88l-1.86,1.1l-0.43,0.71l-0.79,0.4l-1.44,-0.21l-0.81,0.84l-0.34,1.65l-1.91,2.04l-0.06,1.04l-0.67,1.23l0.13,1.17l-0.97,0.39l-0.23,-0.65l-0.52,-0.24l-1.35,0.4l-0.34,0.55l-2.69,-0.29l-0.37,-0.36l-0.02,-0.91l-0.65,-0.35l0.45,-0.65l-0.03,-0.52l-2.12,-2.46l-0.76,-0.01l-2.0,1.17l-0.78,-0.15l-0.8,-0.67l-1.21,0.23Z\",\n      \"name\": \"Mali\"\n    },\n    \"MN\": {\n      \"path\": \"M676.61,267.85l3.78,1.95l5.69,-1.19l2.35,0.48l2.34,1.79l1.81,2.09l2.28,-0.04l3.11,0.62l2.49,-0.96l3.42,-0.7l3.51,-2.62l1.21,0.34l1.56,1.35l2.31,-0.25l-2.72,6.05l0.64,1.85l0.5,0.22l1.31,-0.44l2.36,0.55l2.04,-1.29l1.73,1.03l2.1,2.39l-0.15,0.72l-1.72,-0.34l-3.79,0.54l-1.88,1.14l-1.76,2.29l-3.71,1.35l-2.44,1.82l-3.81,-0.99l-0.44,0.19l-1.31,2.27l1.07,2.53l-1.56,1.04l-1.74,1.78l-2.78,1.14l-3.78,0.14l-4.05,1.18l-2.75,1.69l-1.16,-0.94l-2.93,0.0l-3.61,-2.0l-2.59,-0.55l-3.41,0.46l-5.11,-0.75l-2.62,0.07l-1.31,-1.82l-1.4,-3.4l-1.47,-0.37l-3.14,-2.22l-6.15,-1.06l-0.73,-1.26l0.89,-4.37l-1.73,-2.97l-3.7,-1.54l-1.96,-1.86l-0.53,-2.16l2.39,-0.63l4.75,-3.33l3.59,-1.75l2.18,1.16l2.44,0.05l1.83,1.83l2.46,0.14l3.58,0.97l0.4,-0.12l2.43,-2.72l0.07,-0.43l-0.93,-2.14l2.28,-3.66l2.59,1.52l4.94,1.41l0.44,2.74Z\",\n      \"name\": \"Mongolia\"\n    },\n    \"MK\": {\n      \"path\": \"M472.81,299.6l0.49,-0.78l3.56,-0.8l1.01,0.87l0.14,1.71l-0.66,0.59l-1.14,-0.05l-1.14,0.75l-1.37,0.24l-0.79,-0.61l-0.3,-1.19l0.2,-0.73Z\",\n      \"name\": \"Macedonia\"\n    },\n    \"MW\": {\n      \"path\": \"M505.5,439.25l0.85,1.96l0.15,2.88l-0.69,1.66l0.72,1.81l0.06,1.29l0.49,0.64l0.07,1.07l0.4,0.55l0.8,-0.23l0.55,0.62l0.7,-0.21l0.34,0.6l0.19,2.98l-1.04,0.63l-0.53,1.27l-1.11,-1.1l-0.16,-1.59l0.51,-1.33l-0.32,-1.32l-0.99,-0.65l-0.82,0.12l-2.36,-1.66l0.63,-1.99l0.82,-1.18l-0.46,-2.03l0.9,-2.88l-0.95,-2.53l0.97,0.19l0.29,0.41Z\",\n      \"name\": \"Malawi\"\n    },\n    \"MR\": {\n      \"path\": \"M407.4,349.79l-2.62,0.03l-0.39,0.44l2.42,23.13l0.37,0.43l-0.39,1.27l-9.75,0.04l-0.56,0.54l-0.91,-0.11l-1.27,0.46l-1.61,-0.66l-0.98,0.03l-0.36,0.29l-0.38,1.37l-0.42,0.24l-2.93,-3.44l-2.96,-1.55l-1.62,-0.03l-1.27,0.55l-1.12,-0.2l-0.65,0.4l-0.08,-0.51l0.68,-1.31l0.31,-2.47l-0.57,-3.99l0.23,-1.25l-0.68,-1.53l-1.16,-1.05l0.25,-0.42l9.58,0.02l0.4,-0.45l-0.46,-3.79l0.47,-1.08l2.11,-0.22l0.36,-0.4l-0.08,-6.64l7.81,0.14l0.41,-0.4l0.01,-3.47l7.8,5.59Z\",\n      \"name\": \"Mauritania\"\n    },\n    \"UG\": {\n      \"path\": \"M498.55,406.22l0.7,-0.46l1.65,0.5l1.96,-0.57l1.7,0.01l1.45,-0.98l0.91,1.33l1.33,3.95l-2.57,4.03l-1.46,-0.4l-2.54,0.91l-1.37,1.61l-0.01,0.81l-2.42,-0.01l-2.26,1.01l-0.17,-1.59l0.58,-1.04l0.14,-1.94l1.37,-2.28l1.78,-1.58l-0.17,-0.65l-0.72,-0.24l0.13,-2.43Z\",\n      \"name\": \"Uganda\"\n    },\n    \"MY\": {\n      \"path\": \"M717.48,403.36l-1.39,0.65l-2.12,-0.41l-2.88,-0.0l-0.38,0.28l-0.84,2.75l-0.99,0.96l-1.21,3.29l-1.73,0.45l-2.45,-0.68l-1.39,0.31l-1.33,1.15l-1.59,-0.14l-1.41,0.44l-1.44,-1.19l-0.18,-0.73l1.34,0.53l1.93,-0.47l0.75,-2.23l4.02,-1.03l2.75,-3.21l0.82,0.94l0.64,-0.05l0.4,-0.65l0.96,0.06l0.42,-0.36l0.24,-2.69l1.81,-1.65l1.21,-1.87l0.63,-0.01l1.07,1.06l0.34,1.28l3.44,1.35l-0.06,0.35l-1.37,0.1l-0.35,0.54l0.32,0.88ZM673.68,399.48l0.17,1.1l0.47,0.33l1.65,-0.3l0.87,-0.94l1.61,1.52l0.98,1.57l-0.12,2.81l0.41,2.29l0.95,0.9l0.88,2.44l-1.27,0.12l-5.1,-3.68l-0.34,-1.29l-1.37,-1.59l-0.33,-1.97l-0.88,-1.4l0.25,-1.68l-0.46,-1.06l1.63,0.84Z\",\n      \"name\": \"Malaysia\"\n    },\n    \"MX\": {\n      \"path\": \"M133.1,328.46l0.22,0.49l9.64,3.54l6.96,-0.02l0.4,-0.4l0.0,-0.81l3.76,0.0l3.55,3.11l1.4,2.99l1.51,1.09l2.08,0.86l0.48,-0.14l1.46,-2.1l1.72,-0.05l1.59,1.03l2.06,3.53l1.47,1.63l1.26,3.28l2.18,1.06l2.27,0.6l-1.19,3.88l-0.42,5.19l1.79,5.01l1.62,1.94l0.61,1.55l1.2,1.45l2.55,0.67l1.38,1.13l7.54,-1.93l1.86,-1.32l1.14,-4.4l4.1,-1.24l3.56,-0.11l0.32,0.31l-0.06,0.97l-1.26,1.49l-0.67,1.74l0.38,0.71l-0.73,2.32l-0.49,-0.3l-1.0,0.08l-1.0,1.41l-0.47,-0.11l-0.53,0.47l-4.26,-0.02l-0.4,0.4l-0.0,1.08l-1.1,0.26l0.1,0.44l1.82,1.46l0.56,0.94l-3.19,0.21l-1.21,2.12l0.24,0.73l-0.2,0.45l-2.24,-2.21l-1.45,-0.94l-2.22,-0.7l-1.52,0.23l-3.06,1.18l-10.55,-3.9l-2.86,-2.0l-3.78,-0.94l-1.08,-1.21l-2.62,-1.46l-1.18,-1.57l-0.39,-0.85l0.66,-0.64l-0.19,-0.55l0.53,-0.77l0.01,-0.93l-2.0,-3.91l-2.21,-2.71l-2.53,-2.16l-1.19,-1.68l-2.2,-1.21l-0.31,-0.45l0.34,-1.56l-0.21,-0.44l-1.23,-0.63l-1.36,-1.26l-0.59,-1.87l-1.53,-0.48l-2.44,-2.68l-0.15,-0.94l-1.33,-2.14l-0.84,-2.11l-0.15,-1.39l-1.81,-1.16l-0.98,0.05l-1.31,-0.74l-0.58,0.22l-0.4,1.19l0.71,3.95l3.51,4.09l0.28,0.83l0.53,0.26l0.41,1.51l1.33,1.8l1.58,1.46l0.8,2.49l1.43,2.51l0.13,1.37l0.37,0.36l1.03,0.08l1.68,2.38l-0.84,0.79l-0.66,-1.55l-1.68,-1.59l-2.91,-1.94l0.06,-1.89l-0.53,-1.73l-2.91,-2.11l-0.56,0.08l-1.95,-1.14l-0.92,-1.02l0.72,-0.08l0.93,-1.06l0.08,-1.82l-1.93,-2.04l-1.46,-0.81l-3.76,-8.06l4.87,-0.45Z\",\n      \"name\": \"Mexico\"\n    },\n    \"IL\": {\n      \"path\": \"M507.77,331.27l0.39,-0.81l0.2,0.43l-0.34,1.09l0.52,0.43l0.68,-0.23l-0.86,3.84l-1.16,-3.52l0.6,-0.8l-0.03,-0.44ZM508.72,328.43l0.38,-1.13l0.64,0.0l0.52,-0.54l0.02,0.67l-0.52,1.01l-0.55,-0.25l-0.5,0.24Z\",\n      \"name\": \"Israel\"\n    },\n    \"FR\": {\n      \"path\": \"M444.48,298.15l-0.65,2.02l-0.56,-0.34l-0.51,-1.98l0.42,-1.04l0.99,-0.8l0.31,2.13ZM429.62,268.54l1.78,1.88l1.48,-0.14l2.08,1.68l1.36,0.33l1.23,0.98l3.1,0.6l-1.08,2.26l-0.3,2.52l-0.41,0.38l-0.92,-0.28l-0.51,0.42l0.07,0.77l-1.82,2.19l-0.04,1.65l0.57,0.37l0.85,-0.41l0.62,1.14l-0.04,1.13l0.61,1.11l-0.78,1.22l0.65,2.72l1.29,0.62l-0.19,1.03l-2.02,1.73l-4.75,-0.9l-3.84,1.13l-0.52,2.09l-2.47,0.37l-2.7,-1.47l-1.18,0.64l-4.28,-1.44l-0.76,-1.02l1.21,-2.03l0.41,-7.31l-2.58,-3.82l-1.89,-1.93l-3.74,-1.44l-0.2,-2.16l2.82,-0.72l4.11,0.96l0.48,-0.46l-0.62,-3.38l1.98,1.12l5.83,-3.02l0.91,-3.28l1.57,-0.58l0.25,0.97l1.34,0.35l1.05,1.43ZM289.01,408.29l-0.81,0.8l-0.78,0.12l-0.5,-0.66l-0.56,-0.1l-0.91,0.6l-0.46,-0.22l1.09,-2.96l-0.96,-1.77l-0.17,-1.49l1.07,-1.77l2.32,0.75l2.51,2.01l0.3,0.74l-2.14,3.96Z\",\n      \"name\": \"France\"\n    },\n    \"XS\": {\n      \"path\": \"M531.15,388.78l1.52,0.12l5.13,-0.96l5.3,-1.49l-0.01,4.43l-2.67,3.4l-1.85,0.01l-8.04,-2.95l-2.55,-3.19l1.12,-1.73l2.04,2.35Z\",\n      \"name\": \"Somaliland\"\n    },\n    \"FI\": {\n      \"path\": \"M492.16,172.43l-0.28,5.17l3.67,4.26l-2.21,4.98l2.86,6.98l-1.64,5.01l2.21,4.51l-0.98,3.55l3.63,4.02l-0.84,2.48l-7.53,9.52l-4.5,0.42l-4.38,1.84l-3.74,0.97l-1.3,-2.46l-2.36,-1.68l0.53,-4.89l-1.2,-4.86l1.14,-3.04l2.23,-3.46l5.68,-6.22l1.8,-1.58l-0.4,-2.8l-3.4,-2.81l-0.79,-2.25l-0.16,-10.13l-7.02,-7.77l0.96,-1.19l2.47,3.3l3.5,-0.17l2.57,1.6l0.53,-0.09l2.46,-3.23l1.19,-5.07l3.49,-2.23l2.82,2.55l-1.01,4.77Z\",\n      \"name\": \"Finland\"\n    },\n    \"FJ\": {\n      \"path\": \"M869.95,457.1l-1.21,0.42l-0.08,-0.24l2.98,-1.23l-0.15,0.44l-1.54,0.62ZM867.58,459.4l0.43,0.38l-0.27,0.91l-1.24,0.29l-1.04,-0.25l-0.14,-0.69l0.64,-0.59l0.92,0.26l0.7,-0.31Z\",\n      \"name\": \"Fiji\"\n    },\n    \"FK\": {\n      \"path\": \"M274.37,564.69l1.48,1.33l-0.53,1.0l-2.96,1.07l-0.95,-1.2l-0.57,-0.05l-1.79,1.54l-0.79,-1.16l2.52,-2.03l1.9,0.9l0.46,-0.09l1.23,-1.32Z\",\n      \"name\": \"Falkland Is.\"\n    },\n    \"NI\": {\n      \"path\": \"M202.32,382.47l0.82,-0.18l1.03,-1.02l-0.04,-0.89l0.68,-0.0l0.63,-0.54l0.97,0.23l1.53,-1.28l0.58,-1.0l1.17,0.35l2.41,-0.95l0.13,1.34l-0.81,1.96l0.1,2.77l-0.36,0.38l-0.11,1.76l-0.47,0.81l0.18,1.15l-1.73,-0.86l-0.71,0.27l-1.47,-0.6l-0.52,0.16l-4.02,-3.85Z\",\n      \"name\": \"Nicaragua\"\n    },\n    \"NL\": {\n      \"path\": \"M430.16,264.22l0.76,-0.72l2.14,-5.88l3.19,-1.63l1.7,0.1l0.35,1.07l-0.6,3.64l-0.51,1.24l-1.24,0.0l-0.4,0.44l0.34,3.35l-2.18,-2.14l-0.43,-0.11l-2.22,0.8l-0.89,-0.15Z\",\n      \"name\": \"Netherlands\"\n    },\n    \"NO\": {\n      \"path\": \"M491.42,157.32l7.17,5.11l-2.71,1.67l-0.13,0.55l2.55,4.24l-3.9,2.61l-1.31,0.42l0.79,-4.7l-3.21,-2.91l-0.48,-0.04l-4.06,2.73l-1.21,5.15l-2.11,2.72l-2.64,-1.54l-3.04,0.32l-2.65,-3.53l-0.63,-0.01l-1.41,1.75l-1.41,0.26l-0.33,0.36l-0.33,4.08l-4.27,-0.99l-0.48,0.32l-0.6,3.44l-2.07,-0.02l-0.38,0.27l-4.15,11.7l-3.88,8.48l0.84,2.18l-0.71,1.86l-2.2,-0.09l-0.4,0.28l-1.64,5.41l0.15,7.19l1.58,2.74l-0.8,5.79l-2.04,3.34l-0.83,2.09l-1.27,-2.26l-0.65,-0.07l-4.87,5.52l-3.05,1.02l-3.16,-2.22l-0.86,-5.06l-0.78,-11.7l2.19,-3.29l6.55,-4.59l5.02,-5.96l4.64,-8.4l6.0,-12.26l11.0,-13.83l5.32,-3.11l3.99,0.38l0.38,-0.19l3.69,-6.04l4.48,0.3l4.3,-1.47ZM484.42,59.58l4.68,4.94l-3.51,7.19l-6.97,1.55l-7.03,-2.18l-0.42,-3.6l-0.37,-0.35l-3.35,-0.23l-2.51,-6.12l7.16,-3.9l3.42,3.43l0.63,-0.09l2.33,-4.19l5.93,3.56ZM482.22,93.35l-4.99,4.27l-3.84,-2.35l1.56,-3.06l-1.38,-3.53l4.4,-2.11l0.89,4.13l3.36,2.65ZM466.32,69.71l8.02,9.81l-6.13,5.05l-1.37,8.88l-2.22,2.36l-1.15,9.08l-2.49,0.35l-5.08,-6.44l2.14,-3.9l-0.08,-0.49l-3.69,-3.4l-4.82,-10.44l-1.89,-10.23l6.16,-4.58l1.22,4.4l0.41,0.29l3.57,-0.19l0.37,-0.32l0.9,-4.57l3.14,-0.43l3.02,4.76Z\",\n      \"name\": \"Norway\"\n    },\n    \"NA\": {\n      \"path\": \"M474.4,460.84l-1.11,0.05l-0.38,0.4l-0.07,9.11l-2.09,0.08l-0.38,0.4l-0.0,18.09l-1.98,1.29l-1.16,0.18l-2.43,-0.69l-0.48,-1.18l-0.99,-0.78l-0.55,0.05l-0.9,1.05l-1.52,-1.75l-0.94,-1.97l-1.99,-8.9l-0.06,-3.23l-0.33,-1.56l-2.3,-3.43l-1.91,-4.94l-1.96,-2.48l-0.12,-1.61l2.33,-0.8l1.43,0.07l1.82,1.15l10.23,-0.26l1.84,1.26l6.01,0.37ZM474.58,460.83l6.59,-1.65l1.91,0.41l-1.71,0.41l-1.31,0.85l-1.12,-0.95l-4.36,0.94Z\",\n      \"name\": \"Namibia\"\n    },\n    \"VU\": {\n      \"path\": \"M839.03,452.86l0.23,1.16l-0.44,0.03l-0.2,-1.47l0.42,0.28Z\",\n      \"name\": \"Vanuatu\"\n    },\n    \"NC\": {\n      \"path\": \"M838.79,471.67l-0.34,0.23l-2.9,-1.8l-3.27,-3.48l1.65,0.85l4.86,4.19Z\",\n      \"name\": \"New Caledonia\"\n    },\n    \"NE\": {\n      \"path\": \"M454.74,355.83l1.33,1.41l0.49,0.07l1.26,-0.72l0.53,3.62l0.94,0.85l0.17,0.94l0.82,0.72l-0.45,0.98l-0.96,5.37l-0.13,3.28l-3.05,2.34l-1.22,3.61l1.02,1.25l-0.0,1.48l0.39,0.4l1.13,0.04l-0.1,0.49l-0.45,0.09l-0.35,0.68l-1.47,-2.44l-0.86,-0.29l-2.09,1.38l-1.73,-0.67l-1.45,-0.17l-0.85,0.35l-1.36,-0.07l-1.64,1.1l-1.06,0.05l-2.94,-1.29l-1.44,0.59l-1.01,-0.03l-0.97,-0.95l-2.7,-0.99l-2.69,0.31l-0.87,0.65l-0.46,1.62l-0.74,1.17l-0.12,1.55l-1.57,-1.1l-1.31,0.24l0.03,-0.82l-0.32,-0.41l-2.59,-0.52l-0.15,-1.17l-1.36,-1.62l-0.29,-1.01l0.13,-0.85l1.29,-0.08l1.08,-0.93l3.31,-0.22l2.22,-0.41l0.32,-0.34l0.2,-1.5l1.39,-1.91l-0.01,-5.78l3.37,-1.15l7.24,-5.24l8.41,-5.07l3.69,1.09Z\",\n      \"name\": \"Niger\"\n    },\n    \"NG\": {\n      \"path\": \"M456.32,383.7l0.64,0.66l-0.28,1.06l-2.11,2.02l-2.03,5.2l-1.37,1.16l-1.15,3.19l-1.33,0.66l-1.46,-0.97l-1.21,0.16l-1.38,1.37l-0.91,0.24l-1.79,4.07l-2.33,0.81l-1.11,-0.07l-0.86,0.51l-1.71,-0.05l-1.19,-1.39l-0.89,-1.9l-1.77,-1.66l-3.95,-0.08l0.07,-5.23l0.42,-1.44l1.95,-2.32l-0.14,-0.91l0.43,-1.18l-0.53,-1.42l0.25,-2.95l0.72,-1.08l0.32,-1.35l0.46,-0.39l2.47,-0.28l2.34,0.89l1.15,1.03l1.28,0.04l1.22,-0.59l3.03,1.28l1.5,-0.14l1.36,-1.01l1.32,0.07l0.82,-0.35l3.45,0.81l1.82,-1.34l1.84,2.7l0.66,0.16Z\",\n      \"name\": \"Nigeria\"\n    },\n    \"NZ\": {\n      \"path\": \"M857.8,512.11l1.85,3.38l0.45,0.2l0.3,-0.38l0.03,-1.36l0.38,0.29l0.56,2.51l2.02,1.03l1.81,0.29l1.59,-1.16l0.7,0.2l-1.16,4.01l-1.98,0.12l-0.73,1.27l0.21,1.25l-2.44,4.45l-1.47,1.02l-0.42,-0.65l-0.66,-0.3l1.25,-2.35l-0.81,-2.16l-2.64,-1.38l0.04,-0.7l1.82,-1.29l0.42,-2.46l-0.15,-2.29l-0.96,-2.0l-0.05,-0.75l-3.11,-3.94l-0.82,-1.69l1.57,1.56l1.76,0.72l0.66,2.55ZM853.83,527.42l0.57,1.38l0.61,0.17l1.4,-1.06l0.46,0.9l0.0,1.2l-2.48,3.93l-1.26,1.36l-0.06,0.47l0.6,1.08l-1.47,0.09l-2.32,1.54l-2.04,5.78l-3.02,2.49l-2.03,-0.07l-1.72,-1.2l-2.46,-0.23l-0.29,-0.92l1.25,-2.46l3.05,-3.36l1.62,-0.67l4.01,-3.18l1.56,-1.87l1.08,-2.44l1.01,-1.01l0.35,-1.73l1.23,-1.07l0.35,0.88Z\",\n      \"name\": \"New Zealand\"\n    },\n    \"NP\": {\n      \"path\": \"M641.15,342.42l-0.0,3.36l-1.74,0.04l-4.8,-0.9l-1.59,-1.45l-3.36,-0.36l-7.66,-3.88l0.81,-2.23l2.33,-1.79l1.77,0.78l2.49,1.85l1.38,0.43l0.99,1.42l1.89,0.55l1.99,1.22l5.5,0.95Z\",\n      \"name\": \"Nepal\"\n    },\n    \"XK\": {\n      \"path\": \"M472.78,298.18l-1.1,-1.47l0.98,-0.9l0.29,-0.94l2.0,1.84l-0.4,0.85l-1.77,0.62Z\",\n      \"name\": \"Kosovo\"\n    },\n    \"CI\": {\n      \"path\": \"M407.4,389.11l0.86,0.42l0.56,0.9l1.13,0.54l1.19,-0.61l0.97,-0.08l1.42,0.54l0.6,3.25l-1.03,2.09l-0.65,2.85l1.06,2.33l-0.06,0.53l-2.54,-0.47l-1.66,0.03l-3.06,0.47l-4.11,1.61l0.32,-3.06l-1.18,-1.31l-1.32,-0.67l0.42,-0.86l-0.2,-1.4l0.5,-0.68l0.01,-1.59l0.84,-0.33l0.26,-0.5l-1.15,-3.02l0.12,-0.51l0.51,-0.25l0.66,0.31l1.93,0.02l0.67,-0.72l0.71,-0.14l0.25,0.7l0.57,0.22l1.4,-0.61Z\",\n      \"name\": \"C\\u00f4te d'Ivoire\"\n    },\n    \"CH\": {\n      \"path\": \"M444.61,279.47l-0.29,1.12l0.16,0.5l1.13,0.67l1.03,0.12l-0.12,0.88l-0.79,0.44l-1.7,-0.42l-0.47,0.25l-0.46,1.23l-0.72,0.07l-0.3,-0.39l-0.58,-0.06l-1.31,1.14l-0.93,0.13l-0.87,-0.62l-0.82,-1.51l-0.52,-0.17l-0.61,0.29l0.02,-0.85l1.73,-1.95l0.07,-0.65l0.96,0.08l0.57,-0.53l1.97,0.02l0.67,-0.71l2.16,0.92Z\",\n      \"name\": \"Switzerland\"\n    },\n    \"CO\": {\n      \"path\": \"M242.07,384.75l-1.7,0.59l-0.59,1.19l-1.7,1.7l-0.37,1.94l-0.67,1.44l0.31,0.57l1.03,0.14l0.25,0.91l0.57,0.65l-0.04,2.35l1.64,1.42l3.16,-0.24l1.26,0.28l1.67,2.06l0.41,0.13l4.09,-0.39l0.45,0.22l-0.92,1.95l-0.2,1.8l0.52,1.83l0.75,1.05l-1.12,1.1l0.07,0.63l0.84,0.51l0.74,1.3l-0.39,-0.45l-0.59,-0.01l-0.71,0.74l-4.71,-0.05l-0.4,0.41l0.03,1.57l0.33,0.39l1.11,0.2l-1.68,0.4l-0.29,0.38l-0.01,1.82l1.16,1.14l0.34,1.25l-1.05,7.05l-1.04,-0.87l1.26,-1.99l-0.13,-0.56l-2.18,-1.23l-1.38,0.2l-1.14,-0.38l-1.27,0.61l-1.55,-0.26l-1.38,-2.46l-1.23,-0.75l-0.85,-1.2l-1.67,-1.19l-0.86,0.13l-2.11,-1.32l-1.01,0.31l-1.8,-0.29l-0.52,-0.91l-3.09,-1.68l0.77,-0.52l-0.1,-1.12l0.41,-0.64l1.34,-0.32l2.0,-2.88l-0.11,-0.57l-0.67,-0.43l0.39,-1.38l-0.52,-2.11l0.49,-0.83l-0.4,-2.13l-0.97,-1.36l0.17,-0.67l0.86,-0.08l0.47,-0.75l-0.46,-1.63l1.41,-0.07l1.8,-1.7l0.93,-0.24l0.3,-0.38l0.45,-2.78l1.22,-1.01l1.44,-0.04l0.45,-0.5l1.91,0.12l2.93,-1.85l1.15,-1.15l0.91,0.47l-0.26,0.45Z\",\n      \"name\": \"Colombia\"\n    },\n    \"CN\": {\n      \"path\": \"M740.22,270.81l4.55,1.5l2.81,2.58l0.98,3.43l0.38,0.29l3.8,0.0l2.34,-1.51l3.31,-0.89l-1.01,2.59l-1.01,1.46l-0.85,3.95l-1.53,3.16l-2.73,-0.57l-2.43,1.3l-0.19,0.43l0.65,2.95l-0.32,3.68l-0.94,0.07l-0.37,0.4l0.01,0.58l-0.89,-1.11l-0.67,0.07l-0.92,1.77l-3.72,1.4l-0.25,0.46l0.28,1.25l-1.5,-0.08l-1.08,-0.96l-0.59,0.06l-1.68,2.31l-2.7,1.74l-2.03,2.08l-3.39,0.92l-1.93,1.54l-1.22,0.4l0.42,-0.81l-0.43,-1.03l1.81,-2.01l0.02,-0.51l-1.32,-1.73l-0.51,-0.11l-2.25,1.21l-2.83,2.28l-1.5,2.02l-2.27,0.14l-1.56,1.64l-0.04,0.47l1.32,2.16l2.01,0.63l0.3,1.47l1.98,0.92l0.42,-0.05l2.6,-2.09l1.99,1.1l1.5,0.12l0.24,0.97l-3.39,0.94l-1.12,1.61l-2.5,1.64l-1.29,2.15l0.13,0.55l2.57,1.6l0.97,2.9l3.17,4.94l-0.03,1.8l-1.36,0.69l-0.19,0.5l0.6,1.55l1.41,0.95l-0.9,4.05l-1.43,0.4l-3.85,6.72l-2.28,3.23l-6.78,4.72l-2.73,0.3l-1.45,1.07l-0.61,-0.62l-0.56,-0.01l-1.36,1.29l-3.39,1.31l-2.61,0.41l-1.1,2.86l-0.81,0.09l-0.5,-1.47l0.5,-0.88l-0.25,-0.59l-3.36,-0.86l-1.3,0.41l-2.3,-0.64l-0.95,-0.87l0.34,-1.33l-0.3,-0.49l-2.19,-0.48l-1.13,-0.96l-0.48,-0.03l-2.06,1.4l-4.28,0.28l-2.76,1.08l-0.28,0.43l0.32,2.61l-0.59,-0.03l-0.19,-1.39l-0.56,-0.34l-1.67,0.72l-2.47,-1.26l0.63,-1.94l-0.25,-0.5l-1.37,-0.46l-0.55,-2.3l-0.46,-0.3l-2.13,0.37l0.24,-2.6l2.39,-2.48l0.03,-4.49l-1.19,-0.94l-0.79,-1.57l-0.41,-0.22l-1.4,0.2l-2.0,-0.32l0.48,-1.12l-1.17,-1.78l-0.56,-0.11l-1.62,1.1l-2.25,-0.6l-2.89,1.82l-2.25,2.08l-1.74,0.31l-1.17,-0.74l-3.32,-0.68l-1.48,0.83l-1.04,1.32l-0.12,-1.23l-0.54,-0.34l-1.44,0.56l-5.54,-0.9l-1.98,-1.22l-1.89,-0.56l-0.99,-1.42l-1.34,-0.39l-2.55,-1.88l-2.01,-0.89l-1.21,0.59l-5.57,-3.64l-0.54,-2.5l1.19,0.26l0.49,-0.37l0.08,-1.52l-0.98,-1.65l0.16,-2.6l-2.69,-3.58l-4.12,-1.33l-0.68,-2.18l-1.91,-1.6l-0.38,-0.78l-0.5,-3.27l-1.52,-0.73l-0.7,0.14l-0.49,-2.31l0.57,-0.59l-0.13,-0.89l2.06,-1.34l1.59,-0.59l2.55,0.42l0.43,-0.23l0.85,-1.9l2.99,-0.37l1.11,-1.41l4.04,-1.97l0.39,-0.97l-0.17,-1.67l1.48,-0.77l0.19,-0.49l-2.1,-5.65l4.54,-1.3l1.38,-0.84l1.88,-6.37l4.59,1.12l0.4,-0.13l1.49,-1.91l0.11,-3.42l2.01,-0.45l1.83,-2.43l0.45,-0.15l0.67,2.44l2.23,2.08l3.44,1.35l1.58,2.72l-0.93,4.08l0.95,1.84l6.54,1.28l2.95,2.14l1.48,0.4l1.07,3.0l1.52,2.13l3.06,0.09l5.13,0.76l3.38,-0.46l2.34,0.48l3.65,2.02l3.07,0.05l0.99,0.93l0.48,0.05l2.87,-1.78l3.94,-1.15l3.84,-0.16l3.06,-1.29l1.77,-1.81l1.72,-1.14l0.16,-0.47l-1.12,-2.36l1.05,-1.82l4.03,0.9l2.45,-1.85l3.76,-1.36l1.97,-2.46l1.63,-0.96l3.49,-0.47l1.91,0.4l0.47,-0.31l0.18,-1.65l-2.27,-2.59l-2.11,-1.27l-0.44,0.02l-1.78,1.27l-2.29,-0.54l-1.28,0.37l-0.43,-1.02l2.76,-6.16l3.03,1.25l3.53,-2.45l0.15,-1.96l2.18,-4.08l1.47,-1.55l-0.03,-2.26l-1.16,-1.03l1.66,-1.66l2.96,-0.72l3.21,-0.11l3.62,1.21l2.05,1.43l3.31,8.17l0.92,3.82ZM696.92,366.89l-1.87,1.1l-1.63,-0.65l-0.06,-1.84l1.03,-1.01l2.58,-0.7l1.15,0.05l0.31,0.56l-0.98,1.09l-0.53,1.4Z\",\n      \"name\": \"China\"\n    },\n    \"CM\": {\n      \"path\": \"M457.92,387.33l1.06,1.92l-1.4,0.16l-1.05,-0.23l-0.45,0.23l-0.54,1.2l0.08,0.45l1.48,1.48l1.05,0.45l1.01,2.47l-1.52,3.0l-0.68,0.68l-0.13,3.69l2.38,3.84l1.09,0.8l0.24,2.48l-3.67,-1.14l-11.27,-0.13l0.23,-1.79l-0.98,-1.66l-1.19,-0.54l-0.44,-0.97l-0.6,-0.42l1.71,-4.28l0.75,-0.13l1.38,-1.37l0.65,-0.03l1.71,0.99l1.93,-1.12l1.14,-3.2l1.38,-1.17l2.0,-5.16l2.17,-2.15l0.3,-1.65l-0.86,-0.89l0.18,-0.37l0.8,1.32l0.07,3.24Z\",\n      \"name\": \"Cameroon\"\n    },\n    \"CL\": {\n      \"path\": \"M246.67,568.71l-3.34,2.4l-0.55,3.89l-0.62,0.06l-2.66,-1.3l-2.82,-2.86l-3.06,-2.32l-0.71,-2.33l0.65,-2.52l-1.22,-2.56l-0.31,-6.43l1.02,-3.46l2.58,-2.79l-0.19,-0.66l-3.24,-0.91l2.11,-2.91l0.78,-5.35l2.3,1.02l0.56,-0.29l1.31,-7.14l-0.2,-0.42l-1.68,-0.9l-0.58,0.28l-0.7,3.81l-0.82,-0.25l1.58,-10.59l1.15,-2.43l-0.71,-3.1l-0.18,-3.15l1.02,-0.35l3.26,-9.88l1.07,-4.5l-0.56,-4.47l0.74,-2.47l-0.29,-3.45l1.46,-3.5l2.04,-17.19l-0.67,-7.94l1.04,-0.54l0.54,-0.92l0.79,1.16l0.32,1.82l1.25,1.19l-0.69,2.61l1.33,2.98l0.97,3.7l0.47,0.29l1.49,-0.31l0.11,0.25l-0.77,2.53l-2.57,1.28l-0.22,0.37l0.08,4.51l-0.47,0.8l0.58,1.25l-1.59,1.59l-1.68,2.74l-0.89,2.6l0.21,2.85l-1.49,2.9l1.12,5.38l0.64,0.64l-0.01,2.49l-1.39,2.89l0.02,2.59l-1.89,2.18l0.02,2.98l0.7,2.85l-1.44,1.23l-1.26,6.27l0.39,3.95l-0.98,0.94l0.58,3.94l1.04,1.3l-0.69,1.22l0.14,0.54l1.01,0.61l0.18,0.88l-1.04,0.92l0.26,2.03l-0.89,4.69l-1.31,3.11l0.25,2.01l-0.73,2.21l-1.97,1.93l0.28,4.31l0.88,1.43l1.6,0.0l-0.01,2.68l1.04,2.36l6.16,0.76ZM248.69,570.67l0.0,9.15l0.4,0.4l3.58,0.07l-0.53,1.14l-1.93,1.23l-2.45,-0.46l-1.9,-1.34l-2.54,-0.61l-5.59,-4.63l-2.57,-3.5l4.23,3.11l3.32,1.53l0.5,-0.14l1.29,-1.95l0.83,-2.85l2.04,-1.51l1.3,0.35Z\",\n      \"name\": \"Chile\"\n    },\n    \"XC\": {\n      \"path\": \"M504.86,320.38l0.39,0.01l0.27,-0.07l-0.3,0.35l-0.36,-0.28Z\",\n      \"name\": \"N. Cyprus\"\n    },\n    \"CA\": {\n      \"path\": \"M280.04,266.9l-1.66,3.44l0.11,0.49l0.5,-0.0l1.44,-1.15l1.05,0.52l-0.63,0.98l0.16,0.58l2.22,1.06l1.38,-0.83l1.97,0.93l-0.68,2.46l0.52,0.48l1.3,-0.48l0.99,3.78l-0.93,2.87l-0.77,0.09l-1.25,-0.52l0.49,-2.7l-0.87,-0.87l-0.52,0.06l-2.77,3.06l-0.43,-0.04l1.14,-1.12l-0.14,-0.66l-2.4,-0.9l-7.4,0.09l-0.2,-0.58l1.35,-1.14l0.02,-0.6l-0.8,-0.75l1.91,-2.12l2.57,-6.16l1.48,-2.16l1.98,-1.26l0.5,0.08l-1.6,3.09ZM68.32,168.48l4.07,1.51l3.89,3.35l2.78,0.73l0.42,-0.15l2.16,-2.88l2.84,-2.09l3.89,0.75l3.71,-3.14l3.71,-1.66l1.54,2.72l0.62,0.1l1.99,-1.93l0.48,-2.97l1.15,0.53l4.17,6.45l0.67,0.01l2.68,-3.95l0.27,4.33l0.54,0.35l3.08,-1.17l1.05,-2.04l2.63,0.36l3.83,3.0l5.86,2.58l3.48,1.19l2.44,-0.39l2.95,3.04l-3.23,3.06l0.16,0.67l4.53,1.42l6.92,-0.76l1.96,-1.04l2.47,3.65l0.64,0.03l2.72,-3.33l-0.01,-0.52l-2.34,-2.61l1.33,-1.93l2.87,-0.3l1.88,-0.64l1.8,1.47l2.48,3.63l0.41,0.17l2.63,-0.5l4.62,2.96l3.83,-1.03l3.59,0.16l0.42,-0.43l-0.27,-3.92l1.8,-0.96l3.49,2.08l-0.01,6.03l0.34,0.4l0.44,-0.28l1.5,-4.95l1.69,0.15l0.43,-0.33l1.13,-6.89l-2.74,-4.66l-2.86,-2.89l0.19,-8.09l2.75,-5.34l2.86,1.11l2.44,3.36l3.31,8.33l-2.12,3.42l0.22,0.59l4.38,1.37l-0.01,6.85l0.29,0.39l0.45,-0.18l3.02,-4.91l2.56,3.84l-0.68,5.11l2.42,4.42l0.7,0.0l2.61,-4.74l1.86,-5.93l0.15,-7.44l3.08,0.48l3.57,1.03l3.18,3.35l0.14,3.2l-1.81,3.53l1.71,3.82l-0.29,2.9l-4.72,4.27l-3.21,0.89l-2.43,-1.77l-0.62,0.23l-0.74,3.09l-2.4,5.08l-0.73,2.58l-2.76,3.73l-3.68,0.5l-2.07,2.63l-0.15,3.32l-2.86,0.78l-3.1,4.45l-2.74,5.98l-0.98,4.09l-0.14,5.74l0.31,0.4l3.44,0.75l2.25,7.78l0.48,0.26l3.37,-0.88l4.49,1.92l2.43,1.68l1.92,2.2l3.09,1.21l2.61,1.84l6.65,0.69l-0.36,3.49l0.8,4.33l1.81,4.63l3.81,3.97l0.51,0.05l2.08,-1.51l1.37,-4.39l-1.31,-6.63l-1.54,-2.05l3.69,-1.91l2.84,-3.1l1.49,-3.43l-0.24,-3.19l-1.7,-3.97l-2.92,-3.49l2.86,-5.19l-1.09,-4.55l-0.81,-7.95l1.39,-0.99l4.1,1.4l2.62,0.54l2.14,-1.31l5.09,4.62l1.07,2.2l4.09,0.36l-0.06,3.98l0.83,6.25l2.42,1.04l1.74,2.7l0.57,0.11l3.63,-2.66l2.51,-5.54l1.22,-1.73l7.63,15.44l-0.95,2.7l0.14,0.45l3.3,2.51l2.23,2.5l4.1,1.23l1.45,1.25l0.96,3.51l2.08,0.8l0.87,1.37l0.17,4.34l-3.4,2.77l-4.22,1.5l-3.06,3.15l-4.04,0.61l-5.35,-0.82l-6.4,0.25l-2.32,2.87l-3.25,1.78l-6.48,8.38l-0.03,0.47l0.45,0.17l2.33,-0.73l3.98,-4.83l5.12,-3.08l3.49,-0.36l1.77,1.49l-2.18,2.58l0.8,4.03l1.01,2.99l3.5,1.85l4.14,-0.52l2.14,-3.2l0.24,1.68l1.22,0.99l-2.64,2.0l-5.49,2.09l-2.54,1.45l-2.73,2.43l-1.38,-0.18l-0.08,-2.39l4.16,-2.8l0.16,-0.45l-0.39,-0.28l-4.01,0.12l-2.61,0.4l-1.4,-1.73l-0.12,-5.1l-1.11,-1.06l-1.83,0.44l-0.65,-0.76l-0.63,0.03l-1.91,2.77l-0.81,2.9l-0.81,1.48l-1.66,0.64l-0.47,0.87l-8.32,0.08l-1.21,0.71l-2.33,2.23l-0.72,-0.14l-1.36,1.08l-1.12,-0.54l-4.75,1.43l-0.9,1.32l0.21,0.59l1.7,0.22l0.05,0.22l-1.84,0.36l-1.85,0.9l-1.19,-0.29l-0.92,0.15l-2.95,2.0l-0.71,-0.11l0.32,-0.68l1.12,-1.78l1.72,-1.33l0.09,-2.6l1.16,-2.28l0.48,0.59l2.03,0.48l0.42,-0.16l0.82,-1.6l-2.66,-4.02l-2.29,-0.71l-5.63,-0.81l-0.4,-0.66l-0.86,0.2l0.27,-0.64l-0.21,-0.52l-0.72,-0.32l0.32,-1.06l-0.91,-1.28l0.34,-0.82l-0.29,-0.55l-2.6,-0.52l-0.76,-1.93l-0.95,-0.76l-1.67,-0.09l-2.67,-0.67l-1.13,1.4l-1.48,0.69l-0.85,1.24l-2.8,-0.89l-2.1,0.45l-2.38,-1.13l-4.23,-0.83l-0.58,-0.48l-0.42,-1.96l-0.4,-0.32l-0.85,0.02l-0.39,0.4l-0.01,1.07l-69.11,-0.01l-6.5,-5.37l-4.5,-1.66l-1.29,-3.28l0.34,-2.39l-0.2,-0.41l-3.03,-1.66l-0.52,-3.39l-2.92,-2.97l-0.05,-1.94l1.39,-2.23l-0.07,-2.8l-4.34,-3.13l-4.08,-8.55l-4.01,-4.22l-1.31,-2.51l-0.57,-0.15l-2.51,1.6l-2.18,2.42l-3.81,-5.1l-2.44,-1.39l-2.26,-0.18l0.03,-55.45ZM265.75,272.87l-0.72,0.04l-3.11,-1.15l-1.72,-1.35l3.19,0.89l2.36,1.57ZM249.33,12.09l6.65,1.61l5.26,2.56l4.43,5.22l-0.1,4.84l-5.98,7.79l-6.13,3.67l-2.26,3.84l0.35,0.6l4.74,-0.08l-5.52,9.28l-4.14,4.52l-4.23,11.87l-5.01,2.26l-1.69,2.82l-7.4,1.42l-0.32,0.34l0.22,0.41l3.02,1.48l-1.51,2.34l2.02,6.18l-2.26,4.04l-3.94,3.58l-1.16,4.49l-3.53,3.68l0.35,2.54l0.44,0.34l3.85,-0.39l0.04,2.09l-6.37,6.12l-6.3,-2.81l-7.5,1.6l-3.7,-1.27l-4.4,-0.52l-0.28,-4.64l4.41,-2.41l0.2,-0.41l-1.19,-8.1l1.06,-0.58l6.49,4.94l0.49,-0.0l0.12,-0.48l-3.41,-7.64l-3.92,-2.37l1.85,-4.46l4.51,-3.29l0.71,-4.65l-3.55,-5.6l-0.98,-6.84l6.22,0.58l1.88,1.51l0.57,-0.08l3.91,-5.41l-0.21,-0.62l-5.64,-1.76l-8.71,0.93l-4.24,-5.03l-2.06,-6.44l-2.92,-4.92l-0.52,-5.65l3.5,-3.22l2.94,-0.62l4.91,-2.99l3.67,-6.97l2.62,0.86l2.63,5.2l0.41,0.22l0.34,-0.32l1.88,-10.36l3.17,-3.13l4.37,-2.24l7.32,-0.83l1.2,2.03l0.52,0.16l7.1,-3.49l10.71,2.64ZM203.82,140.61l1.98,5.56l0.38,0.26l0.37,-0.27l2.27,-6.74l5.84,-3.34l4.06,8.5l-0.37,5.31l0.57,0.39l4.95,-2.38l2.28,-3.11l5.2,3.94l3.34,3.74l0.31,3.32l0.54,0.34l4.32,-1.65l2.44,4.64l6.13,3.12l2.09,2.87l2.25,6.4l-4.35,3.07l-0.01,0.65l5.9,4.44l3.95,1.47l3.53,5.87l3.81,0.57l-0.69,3.91l-4.11,6.58l-2.68,-2.22l-3.9,-5.85l-0.43,-0.17l-3.24,0.78l-0.3,0.35l-0.24,3.8l2.63,3.5l3.42,2.75l0.96,1.44l1.58,5.48l-0.73,3.38l-2.67,-1.26l-6.25,-4.45l-0.52,0.05l-0.04,0.52l6.1,8.03l0.24,1.1l-6.09,-1.92l-5.3,-3.12l-2.77,-2.46l0.72,-1.31l-0.1,-0.51l-7.38,-5.75l-0.64,0.33l0.03,1.33l-6.7,0.85l-1.79,-1.68l1.46,-3.85l4.49,-0.1l5.15,-0.77l0.31,-0.54l-0.79,-2.04l0.83,-2.91l3.22,-6.15l-0.67,-3.24l-1.07,-2.43l-3.84,-3.29l-4.67,-2.18l1.24,-1.37l0.05,-0.47l-2.65,-4.44l-2.33,-0.57l-1.88,-2.37l-0.65,0.04l-1.25,2.02l-4.3,0.88l-9.0,-1.6l-5.26,-2.14l-3.98,-1.1l-1.81,-2.3l2.43,-3.26l-0.32,-0.64l-3.2,-0.03l-0.75,-7.66l1.89,-7.38l2.46,-3.41l5.58,-2.04l-1.59,4.91ZM261.18,282.95l2.07,0.7l1.54,-0.05l-0.57,0.69l-0.66,0.17l-2.92,-1.41l-0.44,-0.86l0.38,-0.46l0.61,1.23ZM230.78,185.0l-2.28,0.26l-0.54,-2.72l0.98,-3.45l1.88,-0.76l1.65,1.57l0.03,2.61l-0.24,0.76l-1.47,1.73ZM229.41,141.37l0.16,1.75l-4.89,-0.38l-2.72,1.08l-0.48,-0.34l-2.65,-4.39l0.09,-2.82l0.87,-0.43l5.47,0.92l4.14,4.61ZM222.03,214.7l-0.78,2.22l-0.56,-0.23l-0.54,-1.3l0.87,-1.54l0.57,0.07l0.44,0.77ZM183.65,102.44l3.0,3.59l4.7,-0.02l1.97,3.24l-0.41,4.19l2.83,2.3l1.84,2.54l6.99,1.27l4.2,-2.19l4.96,-0.84l3.84,0.67l2.53,3.56l0.53,3.8l-1.43,2.32l-3.48,1.88l-3.25,-1.1l-7.15,1.44l-5.04,0.16l-3.95,-1.13l-6.43,-2.95l-0.83,-5.12l-0.3,-4.98l-2.56,-4.72l-5.31,-1.46l-2.69,-3.1l0.83,-3.99l4.63,0.64ZM207.36,195.03l0.42,2.4l0.63,0.26l0.99,-0.72l1.27,1.36l5.47,3.76l0.21,2.54l0.49,0.36l1.62,-0.39l1.33,1.4l-1.71,1.36l-3.54,-1.23l-1.33,-2.43l-0.66,-0.06l-2.46,2.99l-3.05,2.47l-0.7,-2.67l-0.45,-0.29l-2.39,0.38l1.64,-2.22l0.32,-4.55l0.78,-5.03l1.13,0.31ZM215.49,211.5l-2.69,2.74l-1.33,-0.09l-0.38,-1.01l1.61,-2.18l2.82,0.04l-0.02,0.5ZM202.66,70.17l2.91,4.33l-3.3,3.83l-4.54,9.4l-4.14,0.83l-4.93,-1.5l-2.57,-4.9l0.04,-4.53l1.93,-3.49l-0.36,-0.59l-4.35,0.1l-2.61,-4.34l-1.55,-6.33l1.71,-6.55l1.67,-4.57l2.41,-1.04l0.22,-0.48l-0.96,-3.26l5.05,-0.73l3.21,8.41l8.21,6.06l1.95,9.35ZM187.39,143.67l-2.74,6.11l-2.28,-0.24l-1.49,-6.99l0.04,-4.2l1.26,-3.63l2.29,-2.28l4.96,0.3l4.35,2.01l-3.51,7.33l-2.87,1.59ZM186.12,124.07l-1.2,3.26l-3.2,-0.62l-2.75,-2.26l1.22,-4.02l3.15,-2.36l1.93,3.09l0.86,2.91ZM185.64,96.93l-0.83,0.24l-4.33,-0.68l-0.51,-2.52l4.35,0.15l1.52,1.89l-0.2,0.91ZM180.62,90.66l-3.24,2.16l-1.76,-2.41l-1.05,-4.51l-0.18,-4.75l2.69,0.43l1.32,0.77l2.85,4.19l-0.63,4.11ZM180.98,172.19l-1.22,1.91l-3.04,-1.9l-2.16,0.64l-2.93,-2.72l1.98,-2.02l1.52,-2.75l3.72,3.03l2.13,3.8ZM169.77,135.22l2.97,1.73l4.08,-1.03l0.51,2.03l-2.26,4.02l0.07,0.48l3.66,3.51l-0.43,6.97l-3.8,2.82l-2.06,-0.56l-1.71,-2.96l-6.1,-6.18l0.04,-2.04l4.64,0.95l0.44,-0.57l-2.66,-5.4l2.61,-3.78ZM174.46,107.75l1.36,3.53l0.08,5.21l-1.09,7.07l-3.71,0.89l-2.35,-1.35l0.05,-5.54l-0.47,-0.4l-3.64,0.69l-0.14,-7.04l2.56,0.16l3.62,-3.51l3.32,0.59l0.42,-0.3ZM170.01,87.71l0.84,4.38l-3.36,-1.1l-4.3,-4.01l-4.91,-0.41l2.06,-3.18l-0.05,-0.5l-2.92,-2.99l-0.16,-4.33l4.31,1.6l6.62,4.67l1.87,5.86ZM134.6,141.21l-1.16,3.7l0.55,0.48l5.29,-2.43l3.29,4.01l0.64,-0.03l2.53,-3.85l1.89,2.29l2.03,7.94l0.37,0.3l0.4,-0.26l1.28,-3.56l-1.72,-8.28l1.76,-1.01l2.22,1.24l2.69,3.29l2.45,13.62l8.57,7.16l-0.23,2.66l-3.8,0.53l-0.29,0.6l1.51,2.57l-0.67,2.03l-4.14,-1.0l-4.49,-1.91l-3.03,0.47l-4.65,2.34l-10.43,1.63l-1.41,-3.17l-3.42,-1.92l-2.23,0.65l-2.72,-5.01l5.02,-1.82l3.63,0.3l3.27,-1.29l0.25,-0.38l-0.26,-0.37l-4.84,-1.75l-5.5,0.57l-3.28,-0.14l-1.06,-2.23l5.47,-2.91l0.2,-0.46l-0.4,-0.3l-3.77,0.11l-3.96,-1.88l1.97,-5.68l1.69,-3.21l6.41,-4.99l2.07,1.35ZM158.82,138.54l-1.83,4.71l-3.34,-5.15l0.6,-0.86l2.98,-0.32l1.59,1.62ZM149.59,111.85l0.99,3.73l0.63,0.21l2.09,-1.62l2.15,0.37l0.41,4.59l-1.42,4.36l-8.24,1.45l-6.38,4.09l-3.32,0.18l-0.26,-2.47l5.03,-4.13l0.12,-0.46l-0.41,-0.24l-11.2,1.15l-3.08,-1.54l3.28,-9.52l2.11,-2.66l6.67,3.38l4.39,5.99l4.63,0.92l0.44,-0.53l-3.52,-9.7l2.01,-3.46l2.07,1.01l0.81,4.89ZM145.71,84.15l-2.55,2.05l-3.61,-0.01l0.03,-1.26l2.32,-3.45l0.99,0.43l2.82,2.24ZM144.69,94.95l-4.27,3.06l-3.27,-3.31l1.81,-3.41l3.34,-1.13l3.11,1.67l-0.73,3.12ZM118.92,155.09l-5.99,3.39l-1.29,-3.14l-5.55,-4.03l2.72,-9.3l2.17,-5.73l-2.25,-5.4l7.82,-1.34l3.61,1.91l6.24,0.5l2.31,2.51l2.44,3.4l-2.87,2.01l-6.21,6.07l-3.1,5.73l-0.05,3.42ZM129.56,96.45l-0.31,7.96l-1.8,3.53l-2.35,0.59l-4.6,4.46l-3.74,1.48l-2.92,-1.93l4.07,-7.68l5.0,-7.12l3.62,0.15l3.02,-1.45ZM111.13,275.3l-0.71,0.3l-3.83,-1.6l-0.83,-1.38l-2.13,-1.28l-0.67,-1.21l-2.4,-0.65l-0.75,-2.19l3.73,1.32l2.25,0.41l2.0,3.05l2.52,1.64l0.8,1.62ZM87.8,253.38l0.9,0.35l1.87,-0.27l-0.67,4.25l1.83,2.97l-1.42,-1.69l-0.98,-1.97l-1.19,-1.23l-0.34,-2.41Z\",\n      \"name\": \"Canada\"\n    },\n    \"CG\": {\n      \"path\": \"M466.72,406.37l-0.1,1.03l-1.25,2.97l-0.19,3.62l-0.46,1.78l-0.23,0.63l-1.61,1.19l-1.21,1.39l-1.09,2.43l0.04,2.09l-3.25,3.25l-0.5,-0.24l-0.5,-0.83l-1.36,-0.02l-0.98,0.89l-1.68,-0.99l-1.54,1.24l-1.52,-1.96l1.57,-1.14l0.11,-0.52l-0.77,-1.35l2.1,-0.66l0.39,-0.73l1.05,0.82l2.21,0.11l1.12,-1.37l0.37,-1.81l-0.27,-2.09l-1.13,-1.5l1.0,-2.69l-0.13,-0.45l-0.92,-0.58l-1.6,0.17l-0.51,-0.94l0.1,-0.61l2.75,0.09l3.97,1.24l0.51,-0.33l0.17,-1.28l1.24,-2.21l1.28,-1.14l2.76,0.49Z\",\n      \"name\": \"Congo\"\n    },\n    \"CF\": {\n      \"path\": \"M461.16,408.1l-0.26,-1.19l-1.09,-0.77l-0.84,-1.18l-0.29,-1.0l-1.04,-1.15l0.08,-3.44l0.58,-0.49l1.16,-2.36l1.85,-0.17l0.61,-0.62l0.97,0.58l3.15,-0.97l2.48,-1.92l0.02,-0.96l2.82,0.02l2.36,-1.18l1.93,-2.86l1.16,-0.94l1.11,-0.31l0.27,0.87l1.34,1.48l-0.39,2.02l0.3,1.01l4.01,2.76l0.17,0.93l2.63,2.31l0.6,1.44l2.08,1.4l-3.84,-0.21l-1.94,0.88l-1.24,-0.49l-2.67,1.2l-1.29,-0.18l-0.51,0.37l-0.6,1.22l-3.35,-0.65l-1.57,-0.91l-2.42,-0.83l-1.45,0.91l-0.97,1.28l-0.26,1.56l-3.22,-0.43l-1.49,1.33l-0.94,1.62Z\",\n      \"name\": \"Central African Rep.\"\n    },\n    \"CD\": {\n      \"path\": \"M487.01,402.27l2.34,-0.14l1.35,1.84l1.34,0.45l0.86,-0.39l1.21,0.12l1.07,-0.41l0.54,0.89l2.04,1.54l-0.14,2.72l0.7,0.54l-1.38,1.13l-1.53,2.54l-0.17,2.05l-0.59,1.08l-0.02,1.72l-0.72,0.84l-0.66,3.01l0.63,1.32l-0.44,4.26l0.64,1.47l-0.37,1.22l0.86,1.8l1.53,1.42l0.3,1.27l0.44,0.51l-4.08,0.75l-0.92,1.82l0.51,1.35l-0.74,5.46l0.17,0.38l2.45,1.47l0.54,-0.1l0.12,1.64l-1.28,-0.01l-1.85,-2.37l-1.94,-0.45l-0.48,-1.14l-0.56,-0.2l-1.41,0.74l-1.71,-0.3l-1.01,-1.19l-2.49,-0.2l-0.44,-0.77l-1.98,-0.21l-2.88,0.36l0.11,-2.42l-0.85,-1.13l-0.16,-1.36l0.32,-1.74l-0.47,-0.89l-0.04,-1.5l-0.4,-0.39l-2.53,0.02l0.1,-0.41l-0.39,-0.49l-1.28,0.01l-0.43,0.46l-1.62,0.32l-0.83,1.8l-1.09,-0.28l-2.4,0.52l-1.37,-1.91l-1.3,-3.31l-0.38,-0.27l-7.39,-0.03l-2.46,0.42l0.5,-0.45l0.37,-1.47l0.66,-0.38l0.92,0.08l0.73,-0.82l0.87,0.02l0.31,0.68l1.4,0.36l3.59,-3.63l0.01,-2.23l1.02,-2.29l2.69,-2.39l0.43,-0.99l0.49,-1.96l0.17,-3.51l1.25,-2.95l0.36,-3.15l0.86,-1.13l1.1,-0.67l3.57,1.73l3.65,0.73l0.46,-0.21l0.8,-1.46l1.24,0.19l2.61,-1.17l0.81,0.44l1.04,-0.03l0.59,-0.66l0.7,-0.16l1.81,0.25Z\",\n      \"name\": \"Dem. Rep. Congo\"\n    },\n    \"CZ\": {\n      \"path\": \"M458.44,265.89l1.23,1.2l1.49,0.27l0.09,1.1l1.36,0.81l0.58,-0.21l0.25,-0.67l1.12,0.29l0.53,1.3l1.67,0.21l0.69,1.14l-1.4,1.19l-0.12,0.65l-0.55,0.55l-1.59,0.21l-0.56,0.65l-1.03,-0.52l-1.03,0.17l-2.15,-1.12l-1.05,0.4l-1.18,1.3l-1.53,-1.0l-2.59,-2.49l-0.57,-2.36l1.48,-0.7l0.99,-1.01l1.72,-0.74l0.54,-0.59l0.73,0.29l0.87,-0.32Z\",\n      \"name\": \"Czech Rep.\"\n    },\n    \"CY\": {\n      \"path\": \"M504.35,321.02l0.49,0.34l-1.34,0.65l-0.91,-0.29l-0.26,-0.55l2.02,-0.14Z\",\n      \"name\": \"Cyprus\"\n    },\n    \"CR\": {\n      \"path\": \"M211.34,387.89l0.48,1.0l1.61,1.62l-0.54,0.45l0.3,1.42l-0.25,1.2l-1.09,-0.6l-0.05,-1.25l-2.46,-1.43l-0.28,-0.77l-0.66,-0.45l-0.45,-0.0l-0.11,1.05l-1.32,-0.95l0.31,-1.31l-0.36,-0.6l0.31,-0.27l1.42,0.58l1.29,-0.14l0.56,0.56l0.74,0.17l0.55,-0.27Z\",\n      \"name\": \"Costa Rica\"\n    },\n    \"CU\": {\n      \"path\": \"M221.21,356.57l1.27,1.05l2.18,-0.29l4.43,3.42l2.09,0.45l-0.1,0.41l0.36,0.49l1.75,0.1l1.44,0.97l-3.07,0.42l-4.17,-0.03l0.79,-0.7l-0.04,-0.63l-1.2,-0.76l-1.49,-0.16l-0.7,-0.62l-0.56,-1.44l-0.4,-0.25l-1.34,0.1l-2.2,-0.68l-0.89,-0.6l-3.18,-0.41l-0.28,-0.17l0.6,-0.76l-0.36,-0.29l-2.73,-0.05l-1.7,1.33l-0.91,0.03l-0.61,0.71l-1.03,0.22l1.14,-1.35l1.01,-0.54l3.69,-1.04l3.98,0.22l2.21,0.87Z\",\n      \"name\": \"Cuba\"\n    },\n    \"SZ\": {\n      \"path\": \"M500.35,482.11l0.5,2.14l-0.39,0.94l-1.04,0.22l-1.23,-1.25l-0.02,-0.69l0.84,-1.65l1.34,0.28Z\",\n      \"name\": \"Swaziland\"\n    },\n    \"SY\": {\n      \"path\": \"M510.98,327.85l0.08,-1.44l0.55,-1.47l1.28,-1.07l0.12,-0.44l-0.41,-1.19l-1.14,-0.38l-0.19,-1.91l0.53,-1.11l1.29,-1.31l0.19,-1.27l0.6,0.24l2.61,-0.82l1.36,0.56l2.06,-0.01l2.95,-1.17l3.29,-0.29l-0.72,1.1l-1.49,1.11l0.23,2.19l-0.89,3.46l-10.14,6.13l-2.17,-0.92Z\",\n      \"name\": \"Syria\"\n    },\n    \"KG\": {\n      \"path\": \"M621.37,297.76l-3.91,1.98l-0.95,1.31l-3.03,0.37l-1.14,2.06l-2.35,-0.39l-2.01,0.7l-2.39,1.55l0.09,1.02l-0.42,0.44l-4.5,0.47l-3.01,-1.02l-2.38,0.19l0.12,-0.96l2.3,0.46l1.14,-0.97l1.99,0.21l3.21,-2.37l-0.03,-0.67l-2.97,-1.75l-1.95,0.72l-1.27,-0.86l1.77,-1.84l-0.12,-0.64l-0.4,-0.18l0.36,-0.95l1.35,-0.39l4.01,1.14l0.5,-0.31l0.35,-1.82l1.08,-0.54l3.4,1.37l1.14,-0.35l7.61,0.43l1.15,1.13l1.27,0.45Z\",\n      \"name\": \"Kyrgyzstan\"\n    },\n    \"KE\": {\n      \"path\": \"M506.26,414.59l1.87,-2.56l0.93,-2.15l-1.38,-4.08l-1.06,-1.6l2.82,-2.75l0.79,0.26l0.12,1.41l0.86,0.83l1.9,0.11l3.28,2.13l3.57,0.44l1.05,-1.12l1.96,-0.9l0.82,0.69l1.16,0.09l-1.78,2.45l0.03,9.12l1.3,1.94l-1.37,0.78l-0.67,1.03l-1.08,0.46l-0.34,1.67l-0.81,1.07l-0.45,1.55l-0.68,0.56l-3.2,-2.23l-0.35,-1.58l-8.86,-4.98l0.14,-1.6l-0.57,-1.04Z\",\n      \"name\": \"Kenya\"\n    },\n    \"SS\": {\n      \"path\": \"M481.71,393.21l1.07,-0.73l1.2,-3.2l1.36,-0.26l1.61,2.0l0.87,0.34l1.11,-0.41l1.5,0.07l0.57,0.53l2.49,0.0l0.44,-0.63l1.07,-0.4l0.45,-0.84l0.59,-0.33l1.9,1.34l1.6,-0.2l2.83,-3.35l-0.32,-2.23l1.6,-0.53l-0.24,1.62l0.3,1.84l1.34,1.18l0.2,1.88l0.35,0.41l0.02,1.54l-0.23,0.47l-1.42,0.25l-0.85,1.44l0.3,0.6l1.4,0.17l1.12,1.08l0.59,1.13l1.03,0.53l1.28,2.37l-4.42,3.99l-1.74,0.01l-1.89,0.55l-1.47,-0.52l-1.15,0.57l-2.96,-2.62l-1.3,0.49l-1.06,-0.15l-0.79,0.39l-0.82,-0.22l-1.8,-2.7l-1.91,-1.1l-0.66,-1.5l-2.62,-2.33l-0.18,-0.94l-2.37,-1.61Z\",\n      \"name\": \"S. Sudan\"\n    },\n    \"SR\": {\n      \"path\": \"M283.12,400.08l2.1,0.53l-1.08,1.95l0.2,1.72l0.93,1.49l-0.59,2.04l-0.43,0.71l-1.12,-0.42l-1.32,0.22l-0.93,-0.2l-0.46,0.26l-0.25,0.73l0.33,0.7l-0.89,-0.13l-1.39,-1.98l-0.31,-1.34l-0.97,-0.31l-0.89,-1.47l0.35,-1.61l1.45,-0.82l0.33,-1.87l2.61,0.44l0.58,-0.47l1.75,-0.16Z\",\n      \"name\": \"Suriname\"\n    },\n    \"KH\": {\n      \"path\": \"M689.52,379.15l0.5,1.47l-0.28,2.77l-4.0,1.87l-0.16,0.59l0.69,0.97l-2.06,0.17l-2.05,0.97l-1.82,-0.32l-0.9,-1.17l-1.23,-2.56l-0.55,-2.88l1.4,-1.87l3.01,-0.46l2.23,0.35l2.01,0.99l0.51,-0.14l0.95,-1.49l1.74,0.75Z\",\n      \"name\": \"Cambodia\"\n    },\n    \"SV\": {\n      \"path\": \"M195.8,379.9l1.41,-1.21l2.24,1.46l0.98,-0.27l0.44,0.21l-0.27,1.07l-1.14,-0.03l-3.65,-1.23Z\",\n      \"name\": \"El Salvador\"\n    },\n    \"SK\": {\n      \"path\": \"M476.87,273.43l-1.2,2.33l-2.74,-1.08l-1.05,0.4l-0.52,0.78l-3.44,0.85l-0.48,0.81l-1.74,0.38l-1.88,-1.17l-0.2,-1.03l0.4,-0.94l1.02,0.01l0.86,-0.39l1.74,-2.23l0.83,0.19l0.76,-0.39l1.06,1.14l0.49,0.08l1.33,-0.74l1.26,0.34l1.63,-0.49l1.87,1.16Z\",\n      \"name\": \"Slovakia\"\n    },\n    \"KR\": {\n      \"path\": \"M737.47,312.73l1.03,-0.11l0.87,-1.28l2.69,-0.35l0.32,-0.3l1.75,3.04l0.59,1.94l0.02,3.41l-0.81,1.45l-2.22,0.59l-1.92,1.21l-1.79,0.21l-0.2,-1.21l0.44,-2.44l-0.97,-2.83l1.45,-0.41l0.23,-0.6l-1.48,-2.32Z\",\n      \"name\": \"Korea\"\n    },\n    \"SI\": {\n      \"path\": \"M456.18,286.22l-0.51,-1.56l0.2,-1.29l1.68,0.23l1.44,-0.83l2.08,-0.09l0.62,-0.56l0.24,0.62l-1.66,0.8l-0.43,1.53l-0.67,0.28l-0.24,0.94l-1.2,-0.55l-0.54,0.09l-0.33,0.43l-0.67,-0.05Z\",\n      \"name\": \"Slovenia\"\n    },\n    \"KP\": {\n      \"path\": \"M736.77,312.06l-0.91,-0.45l-0.89,0.68l-1.23,-0.97l0.49,-1.01l0.5,-0.32l0.58,-2.78l-0.45,-0.8l-1.38,-0.34l-0.75,-0.55l1.69,-1.74l2.72,-1.75l1.57,-2.11l1.1,0.86l2.17,0.12l0.41,-0.49l-0.32,-1.43l3.54,-1.33l0.93,-1.56l1.03,1.28l-1.46,1.26l-0.79,1.2l0.02,2.38l-1.08,0.61l-1.41,1.55l-1.7,0.58l-1.23,1.17l-0.16,2.14l2.12,1.67l-0.16,0.33l-2.59,0.32l-1.14,1.41l-1.21,0.08Z\",\n      \"name\": \"Dem. Rep. Korea\"\n    },\n    \"KW\": {\n      \"path\": \"M540.8,336.41l0.38,0.92l-0.17,0.78l0.61,1.64l-0.95,0.04l-0.83,-1.35l-1.59,-0.2l1.34,-2.02l1.21,0.17Z\",\n      \"name\": \"Kuwait\"\n    },\n    \"SN\": {\n      \"path\": \"M390.09,377.95l0.12,1.57l0.49,1.48l0.96,0.82l0.05,1.3l-1.26,-0.19l-0.75,0.33l-1.84,-0.62l-5.84,-0.13l-2.54,0.51l-0.22,-1.04l1.78,0.04l2.01,-0.92l1.03,0.48l1.09,0.05l1.29,-0.62l0.14,-0.58l-0.51,-0.74l-1.81,0.25l-1.13,-0.64l-0.79,0.04l-0.72,0.61l-2.31,0.06l-0.92,-1.79l-0.82,-0.65l0.64,-0.36l1.81,-3.15l0.65,-0.64l1.04,0.19l1.39,-0.56l1.19,-0.02l2.72,1.39l3.03,3.53Z\",\n      \"name\": \"Senegal\"\n    },\n    \"SL\": {\n      \"path\": \"M394.46,393.98l-1.73,1.98l-0.58,1.34l-2.07,-1.06l-1.22,-1.26l-0.65,-2.4l1.16,-0.97l0.67,-1.18l1.21,-0.52l1.66,0.0l1.03,1.65l0.52,2.42Z\",\n      \"name\": \"Sierra Leone\"\n    },\n    \"KZ\": {\n      \"path\": \"M552.75,298.52l0.51,-1.47l-0.48,-1.19l-2.96,-1.32l-1.07,-2.94l-1.37,-0.98l-0.03,-0.45l1.95,0.27l0.45,-0.38l0.09,-2.29l1.75,-0.47l2.09,0.51l0.49,-0.34l0.45,-3.5l-0.45,-2.38l-0.42,-0.32l-2.41,0.17l-2.39,-0.84l-2.87,1.59l-2.15,0.7l-0.86,-0.4l0.15,-1.86l-1.6,-2.47l-2.02,-0.09l-1.83,-2.19l1.33,-2.64l-0.61,-1.04l1.66,-3.54l2.17,1.91l0.66,-0.26l0.29,-2.7l4.94,-4.15l3.67,-0.1l8.38,4.33l2.97,-1.63l3.74,-0.08l3.1,1.99l0.56,-0.13l0.6,-0.97l3.28,0.16l0.4,-0.27l0.63,-1.89l-0.15,-0.46l-3.62,-2.47l1.99,-1.65l-0.2,-1.23l2.05,-0.92l0.17,-0.58l-1.66,-2.63l0.88,-1.1l9.22,-1.46l1.35,-1.1l6.17,-1.58l2.26,-1.78l4.05,0.85l0.74,4.22l0.54,0.3l2.46,-0.98l2.8,1.27l-0.18,2.03l0.44,0.43l2.58,-0.3l4.83,-3.09l0.03,0.36l3.16,3.23l5.57,10.31l0.69,0.03l1.11,-1.75l3.11,2.07l3.78,-0.93l1.13,0.59l1.15,2.17l1.83,0.89l1.0,1.55l0.4,0.18l2.95,-0.47l1.06,1.89l-1.65,2.2l-1.92,0.33l-0.33,0.38l-0.12,3.61l-1.14,1.37l-4.73,-1.15l-0.48,0.28l-1.76,6.36l-1.1,0.68l-4.91,1.4l-0.26,0.52l2.13,5.72l-1.4,0.73l-0.08,1.73l-0.87,-0.28l-1.43,-1.27l-7.9,-0.45l-0.92,0.34l-3.74,-1.37l-1.63,0.99l-0.31,1.59l-3.7,-1.05l-1.87,0.48l-0.76,1.57l-1.35,0.6l-3.3,2.34l-1.12,2.31l-0.42,0.01l-0.93,-1.56l-2.86,-0.1l-0.45,-2.43l-0.39,-0.33l-0.81,-0.02l0.02,-3.32l-3.0,-2.52l-4.58,0.18l-2.74,0.47l-2.34,-3.04l-6.74,-4.23l-6.45,2.1l-0.28,0.38l0.1,12.31l-0.69,0.09l-1.62,-2.42l-1.83,-1.07l-3.13,0.66l-0.68,0.6Z\",\n      \"name\": \"Kazakhstan\"\n    },\n    \"SA\": {\n      \"path\": \"M537.53,338.97l2.0,0.25l0.91,1.39l1.49,-0.06l0.88,2.19l1.29,0.79l0.51,1.03l1.56,1.08l-0.1,1.98l0.32,0.93l1.57,2.56l0.76,0.55l0.71,-0.04l1.37,4.1l7.83,1.63l0.51,-0.29l0.77,1.29l-1.56,5.0l-7.29,2.58l-7.31,1.05l-2.34,1.19l-1.88,2.79l-0.76,0.28l-0.83,-0.79l-0.91,0.12l-2.88,-0.52l-3.5,0.25l-0.86,-0.57l-0.58,0.15l-0.66,1.29l0.16,1.12l-0.43,0.33l-0.93,-1.42l-0.33,-1.18l-1.23,-0.89l-1.27,-2.1l-0.78,-2.27l-1.73,-1.83l-1.14,-0.49l-1.54,-2.37l-0.2,-3.5l-1.44,-3.02l-1.27,-1.19l-1.33,-0.58l-1.31,-3.5l-0.77,-0.7l-0.97,-2.05l-2.8,-4.2l-1.07,-0.17l0.59,-2.85l2.75,0.31l1.08,-0.88l0.6,-0.99l1.74,-0.36l0.65,-1.08l0.72,-0.43l0.1,-0.6l-2.09,-2.45l4.42,-1.3l0.48,-0.39l2.75,0.73l3.66,2.01l7.03,5.8l4.88,0.32Z\",\n      \"name\": \"Saudi Arabia\"\n    },\n    \"SE\": {\n      \"path\": \"M480.3,192.35l-4.15,1.76l-2.43,4.19l0.32,3.66l-3.86,4.45l-4.93,4.95l-1.79,7.79l1.78,3.64l2.29,2.71l-2.14,5.19l-2.69,1.39l-0.95,7.87l-1.3,3.9l-2.71,-0.39l-0.43,0.25l-1.32,3.3l-2.29,0.16l-0.75,-3.94l-2.09,-5.18l-1.86,-6.56l1.04,-2.66l2.12,-3.53l0.83,-6.02l-1.6,-2.83l-0.15,-7.02l1.52,-4.93l2.18,0.09l0.39,-0.26l0.87,-2.28l-0.85,-2.14l3.83,-8.36l4.06,-11.45l2.12,0.02l0.4,-0.33l0.59,-3.35l4.31,1.0l0.49,-0.36l0.34,-4.24l1.04,-0.19l6.98,7.72l0.07,9.8l0.74,2.18Z\",\n      \"name\": \"Sweden\"\n    },\n    \"SD\": {\n      \"path\": \"M505.98,389.25l-0.34,-0.78l-1.17,-0.91l-0.27,-1.62l0.29,-1.82l-0.34,-0.46l-1.16,-0.18l-0.54,0.59l-1.23,0.11l-0.28,0.65l0.53,0.66l0.17,1.23l-2.44,3.01l-0.96,0.2l-2.39,-1.41l-0.95,0.52l-0.38,0.78l-1.11,0.41l-0.29,0.5l-1.94,0.0l-0.54,-0.52l-1.81,-0.09l-0.95,0.41l-2.45,-2.36l-2.07,0.54l-0.73,1.27l-0.6,2.11l-1.25,0.58l-0.75,-0.62l0.27,-2.67l-1.48,-1.78l-0.22,-1.49l-0.92,-0.97l-0.02,-1.3l-0.57,-1.17l-0.69,-0.16l0.7,-1.31l-0.18,-1.15l0.65,-0.63l0.03,-0.55l-0.36,-0.42l1.56,-3.02l1.91,0.16l0.43,-0.4l-0.1,-11.14l2.49,-0.01l0.4,-0.4l-0.0,-4.96l29.02,0.0l0.65,2.11l-0.49,0.67l0.36,2.75l0.93,3.22l2.12,1.59l-0.9,1.07l-1.72,0.4l-0.98,0.91l-1.42,5.73l0.24,1.16l-0.38,2.09l-0.97,2.4l-1.53,1.32l-1.32,2.93l-1.22,0.86l-0.37,1.34Z\",\n      \"name\": \"Sudan\"\n    },\n    \"DO\": {\n      \"path\": \"M241.8,368.82l0.05,-0.67l-0.47,-0.75l0.43,-0.45l0.19,-1.02l-0.09,-1.57l1.66,0.01l1.99,0.64l0.33,0.69l1.29,0.19l0.33,0.77l0.99,0.09l0.81,0.64l-0.46,0.53l-1.13,-0.48l-1.87,-0.01l-1.27,0.6l-0.75,-0.56l-1.01,0.55l-0.79,1.43l-0.23,-0.62Z\",\n      \"name\": \"Dominican Rep.\"\n    },\n    \"DJ\": {\n      \"path\": \"M528.43,386.01l-0.45,0.67l-0.58,-0.25l-1.51,0.13l-0.18,-1.02l1.45,-1.97l0.83,0.17l0.77,-0.44l0.2,1.01l-1.21,0.52l-0.06,0.7l0.73,0.48Z\",\n      \"name\": \"Djibouti\"\n    },\n    \"DK\": {\n      \"path\": \"M452.3,246.5l-1.22,2.88l-2.11,-1.99l-0.26,-1.39l2.98,-1.2l0.61,1.7ZM447.78,242.9l-0.32,0.89l-0.89,-0.07l-1.8,3.21l0.54,2.1l-1.13,0.47l-1.58,-0.48l-0.91,-2.19l-0.07,-4.44l0.99,-2.3l2.0,-0.26l1.11,-1.38l1.3,-0.85l-0.05,1.54l-0.73,1.69l0.3,1.28l1.25,0.79Z\",\n      \"name\": \"Denmark\"\n    },\n    \"DE\": {\n      \"path\": \"M453.15,278.66l-0.56,-0.42l-1.2,-0.11l-1.89,0.66l-2.12,-0.15l-0.57,0.71l-0.83,-0.67l-0.98,0.09l-2.56,-1.08l-0.49,0.15l-0.39,0.62l-1.46,-0.02l0.26,-2.16l1.24,-2.54l-0.28,-0.57l-3.51,-0.68l-0.95,-0.81l0.12,-1.49l-0.49,-1.0l0.27,-2.61l-0.38,-3.76l1.43,-0.25l0.63,-1.53l0.65,-3.87l-0.43,-1.44l0.31,-0.56l1.61,-0.18l0.34,0.68l0.67,0.07l1.7,-2.09l-0.57,-3.77l1.35,0.41l1.33,-0.45l0.28,1.46l2.27,0.9l-0.02,1.24l0.52,0.39l2.55,-0.8l1.33,-1.07l2.53,1.51l1.08,1.24l0.51,1.88l-0.61,1.39l0.88,1.43l0.58,2.06l-0.16,1.52l0.87,2.18l-0.54,0.2l-0.49,-0.34l-0.54,0.07l-0.57,0.68l-1.71,0.73l-1.01,1.02l-1.75,0.82l-0.2,0.5l0.84,2.98l2.45,2.3l-0.71,1.4l-1.0,0.83l0.33,2.27Z\",\n      \"name\": \"Germany\"\n    },\n    \"YE\": {\n      \"path\": \"M528.26,376.46l0.26,-0.43l-0.22,-1.03l0.28,-0.61l-0.09,-0.91l0.92,-0.7l-0.08,-1.37l0.39,-0.76l1.01,0.48l3.33,-0.27l3.76,0.42l0.95,0.82l1.36,-0.59l1.74,-2.67l2.18,-1.11l6.86,-0.96l2.48,5.52l-1.64,0.77l-0.56,1.93l-6.23,2.19l-2.29,1.82l-1.93,0.05l-1.41,1.03l-4.24,0.75l-1.72,1.5l-3.28,0.19l-0.52,-1.19l0.02,-1.52l-1.34,-3.33Z\",\n      \"name\": \"Yemen\"\n    },\n    \"DZ\": {\n      \"path\": \"M441.47,315.57l-0.34,1.19l0.39,2.88l-0.55,2.35l-1.58,1.92l0.36,2.53l1.92,1.66l0.17,0.85l1.43,1.1l1.85,7.66l0.13,1.23l-0.57,5.23l0.2,1.59l-0.88,1.03l-0.02,0.5l1.41,1.93l0.14,1.24l0.89,1.54l0.5,0.17l0.97,-0.42l1.72,1.11l0.83,1.29l-8.23,4.95l-7.23,5.24l-3.43,1.15l-2.3,0.21l-0.28,-1.63l-2.56,-1.12l-0.67,-1.28l-26.12,-18.48l0.01,-3.67l3.77,-1.98l2.44,-0.43l2.12,-0.8l1.08,-1.5l2.81,-1.11l0.34,-2.2l1.34,-0.31l1.04,-1.0l3.46,-0.73l0.36,-1.59l-0.58,-0.56l-0.83,-3.02l-0.18,-1.95l-0.8,-1.65l2.06,-1.44l2.62,-0.52l1.71,-1.32l2.31,-0.91l8.23,-0.8l1.51,0.41l2.27,-1.19l2.45,-0.02l0.91,0.65l1.38,-0.05Z\",\n      \"name\": \"Algeria\"\n    },\n    \"US\": {\n      \"path\": \"M892.73,206.44l1.34,0.72l1.36,-0.5l1.85,1.36l2.21,0.69l-1.59,1.04l-2.57,-2.02l-2.38,0.18l-0.3,-0.25l0.09,-1.21ZM183.2,272.56l0.38,1.78l1.12,0.96l4.22,0.82l2.39,1.15l2.19,-0.43l2.01,0.64l-1.73,0.85l-3.49,3.04l-0.14,0.83l0.52,0.39l2.3,-0.7l1.8,1.17l5.17,-2.8l-0.37,0.89l0.24,0.53l1.35,0.45l1.71,1.35l4.7,-1.01l0.4,0.77l1.58,0.45l0.68,0.78l-1.42,0.21l-2.2,-0.37l-3.59,1.03l-2.72,3.73l0.35,0.91l0.62,-0.0l0.61,-0.75l-1.43,5.39l0.29,3.47l0.67,1.77l0.61,0.48l1.03,-0.07l0.75,-0.43l1.59,-2.19l0.13,-2.45l-0.82,-2.2l0.11,-1.33l1.2,-2.74l0.42,-0.36l0.48,0.84l0.4,-0.3l0.4,-1.6l0.59,-0.51l0.24,-0.94l1.66,0.56l1.67,1.25l-0.03,2.8l-1.28,1.3l0.02,1.21l0.87,0.37l1.67,-1.46l0.49,0.18l0.51,3.02l-2.51,4.23l0.17,0.59l1.54,0.69l1.51,0.19l1.93,-0.49l4.72,-2.41l2.16,-2.03l-0.08,-1.39l0.77,-0.26l3.91,0.4l2.14,-1.19l0.19,-0.39l-0.31,-1.71l2.31,-2.21l1.0,-0.57l8.31,-0.03l0.57,-0.94l1.9,-0.88l0.92,-1.72l0.75,-2.75l1.58,-2.29l0.94,0.69l1.44,-0.54l0.81,0.77l-0.0,4.78l1.98,3.01l-2.38,1.52l-5.36,2.37l-1.81,3.03l0.01,1.98l0.83,1.79l0.78,0.27l-6.43,1.12l-2.21,1.0l-0.21,0.48l0.45,0.28l3.52,-0.57l-2.73,0.77l-1.77,-0.26l-0.76,0.91l0.23,0.65l0.34,0.07l-0.43,1.87l-1.26,1.73l-1.46,-1.16l-0.49,-0.06l-0.18,0.46l0.52,1.74l0.61,0.64l0.03,0.92l-0.94,1.5l-1.22,-1.31l-0.28,-2.52l-0.35,-0.35l-0.42,0.27l-0.48,1.39l0.34,1.57l-0.97,-0.29l-0.48,0.22l0.16,0.5l1.54,0.91l0.1,2.78l0.78,0.52l0.53,3.76l-1.43,2.04l-2.47,0.86l-1.71,1.78l-1.31,0.27l-1.27,1.11l-0.43,1.05l-2.7,1.91l-2.64,3.21l-0.45,2.23l0.45,2.17l0.85,2.51l1.09,2.0l0.04,1.26l1.16,3.2l-0.18,2.82l-0.55,1.49l-0.47,0.22l-0.88,-0.24l-0.33,-1.01l-1.03,-0.79l-2.75,-5.4l0.46,-2.04l-0.76,-1.66l-1.95,-2.41l-1.47,-0.55l-2.38,1.23l-1.46,-1.42l-1.79,-0.75l-2.78,0.36l-2.27,-0.31l-2.03,0.23l-1.04,0.45l-0.18,0.57l0.39,0.67l0.19,1.47l-0.9,-0.23l-0.84,0.49l-1.57,-0.08l-2.08,-1.52l-2.08,0.34l-1.91,-0.65l-3.74,0.89l-2.39,2.17l-2.54,1.28l-1.45,1.47l-0.61,1.43l-0.02,1.98l0.38,1.9l-1.99,-0.55l-1.81,-0.8l-1.25,-3.25l-1.44,-1.57l-2.24,-3.73l-1.76,-1.15l-2.28,-0.01l-1.71,2.18l-1.74,-0.72l-1.16,-0.78l-1.52,-3.14l-3.94,-3.35l-4.34,-0.0l-0.4,0.4l-0.0,0.81l-6.5,0.02l-9.04,-3.34l-0.33,-0.75l-5.69,0.52l-0.43,-1.37l-1.62,-1.72l-1.14,-0.41l-0.55,-0.94l-1.27,-0.14l-1.02,-0.83l-2.22,-0.29l-0.43,-0.33l-0.36,-1.7l-2.4,-3.06l-2.02,-4.21l-0.05,-0.96l-2.93,-3.59l-0.33,-2.54l-1.3,-1.83l0.52,-2.65l-0.09,-2.87l-0.78,-2.59l0.96,-3.2l0.61,-6.46l-0.46,-4.91l-1.48,-4.8l0.09,-0.23l3.09,1.09l1.27,3.33l0.71,0.07l0.68,-1.24l-1.12,-5.71l68.79,-0.0l0.4,-0.4l0.13,-1.09ZM32.37,157.48l1.75,3.33l0.67,0.06l0.98,-1.29l3.62,0.39l-0.12,1.35l0.27,0.41l3.83,1.28l2.65,-0.7l5.14,2.3l4.86,0.72l1.87,0.93l3.47,-1.11l3.64,2.11l2.52,0.95l-0.03,56.12l0.38,0.4l2.37,0.14l2.29,1.31l3.91,5.31l0.63,0.04l2.4,-2.69l2.1,-1.34l1.18,2.24l3.95,4.14l4.1,8.6l4.22,2.91l0.06,2.46l-1.03,1.56l-1.12,-1.31l-2.06,-1.31l-0.68,-3.73l-3.26,-3.82l-1.32,-4.34l-0.33,-0.28l-6.34,-0.42l-2.8,-1.31l-5.26,-5.09l-6.77,-2.72l-3.55,0.39l-4.79,-2.25l-3.33,-2.21l-2.78,1.09l-0.25,0.43l0.46,3.15l-3.97,1.29l-2.26,1.69l-2.25,0.84l-0.29,-2.33l1.07,-4.71l2.51,-1.5l0.15,-0.53l-0.69,-1.3l-0.62,-0.11l-3.19,2.88l-1.77,3.43l-3.56,3.49l-0.04,0.53l1.65,2.14l-2.16,3.15l-5.1,3.33l-0.76,2.13l-3.78,2.28l-0.91,2.19l-2.68,1.74l-1.82,-0.27l-6.95,4.17l-3.92,1.13l2.36,-1.94l2.5,-1.4l2.58,-2.35l3.26,-0.66l1.2,-1.79l3.42,-2.69l2.56,-2.83l0.42,-3.52l1.25,-2.78l-0.09,-0.45l-0.46,-0.07l-2.63,1.33l-0.6,-0.62l-0.6,0.03l-1.02,1.31l-1.33,-1.98l-0.71,0.08l-0.3,0.77l-0.56,-1.45l-0.62,-0.17l-2.39,1.85l-1.03,-0.0l-0.18,-2.46l0.44,-1.74l-1.7,-2.14l-0.41,-0.11l-3.01,0.89l-1.94,-2.17l-1.61,-1.16l-0.11,-2.96l-1.78,-2.05l0.88,-2.78l2.01,-2.96l0.87,-2.7l1.66,-0.33l1.59,0.82l0.5,-0.12l1.86,-2.47l1.93,0.32l1.91,-1.75l-0.34,-2.97l-1.22,-1.04l1.59,-1.93l-0.33,-0.65l-1.69,0.11l-2.66,1.27l-0.72,1.08l-1.92,-1.11l-3.43,0.63l-3.41,-1.3l-1.05,-2.33l-2.87,-3.16l3.14,-2.29l5.47,-2.98l1.51,0.0l-0.29,2.67l0.42,0.44l5.29,-0.24l0.34,-0.59l-2.03,-3.88l-3.12,-2.51l-1.79,-3.25l-2.4,-2.83l-3.25,-2.04l1.19,-3.05l4.45,-0.33l3.16,-3.2l0.69,-3.62l2.43,-3.32l2.42,-0.86l4.6,-3.26l2.51,0.36l3.66,-3.91l3.4,1.47ZM37.56,239.39l-2.21,1.54l-0.94,-0.87l-0.32,-1.79l3.24,-2.14l1.37,0.26l0.77,1.05l-1.9,1.94ZM31.06,363.53l0.98,0.48l0.75,0.91l-1.77,1.1l-0.44,-1.57l0.48,-0.92ZM29.32,361.52l0.19,0.06l0.11,0.07l-0.18,0.04l-0.12,-0.16ZM25.2,359.55l0.2,0.24l-0.14,-0.02l-0.05,-0.23ZM5.91,226.07l-1.09,0.55l-2.4,-1.69l1.72,-0.6l1.6,0.37l0.17,1.37Z\",\n      \"name\": \"United States\"\n    },\n    \"UY\": {\n      \"path\": \"M286.86,504.69l-0.94,1.64l-2.58,1.54l-1.67,-0.55l-1.42,0.28l-2.4,-1.28l-1.51,0.09l-1.28,-1.4l0.16,-1.65l0.56,-0.83l-0.02,-2.91l1.22,-5.04l1.18,-0.23l2.36,2.12l1.08,0.03l4.36,3.37l1.24,1.73l-0.98,1.58l0.62,1.52Z\",\n      \"name\": \"Uruguay\"\n    },\n    \"LB\": {\n      \"path\": \"M510.37,325.96l-0.89,0.55l1.84,-3.86l0.6,0.08l0.24,0.7l-1.15,0.96l-0.64,1.57Z\",\n      \"name\": \"Lebanon\"\n    },\n    \"LA\": {\n      \"path\": \"M689.54,378.29l-1.76,-0.75l-0.5,0.15l-0.94,1.48l-1.33,-0.65l0.62,-0.99l0.11,-2.2l-2.04,-2.45l-0.25,-2.69l-1.9,-2.14l-2.15,-0.31l-0.79,0.93l-1.12,0.06l-1.06,-0.4l-2.05,1.22l-0.04,-1.63l0.61,-2.74l-0.36,-0.49l-1.35,-0.1l-0.11,-1.26l-0.97,-0.9l0.33,-0.61l1.63,-1.34l0.39,0.36l1.33,0.07l0.42,-0.45l-0.34,-2.75l0.7,-0.21l1.28,1.86l1.11,2.41l0.36,0.23l2.82,0.02l0.72,1.72l-1.4,0.67l-0.72,0.95l0.13,0.59l2.91,1.54l3.61,5.34l1.88,1.81l0.57,1.65l-0.35,1.99Z\",\n      \"name\": \"Lao PDR\"\n    },\n    \"TW\": {\n      \"path\": \"M724.01,356.0l-0.73,1.52l-0.9,-1.56l-0.26,-1.81l1.38,-2.53l1.73,-1.8l0.64,0.46l-1.86,5.73Z\",\n      \"name\": \"Taiwan\"\n    },\n    \"TT\": {\n      \"path\": \"M266.64,389.17l0.28,-1.17l1.13,-0.22l-0.06,1.21l-1.35,0.18Z\",\n      \"name\": \"Trinidad and Tobago\"\n    },\n    \"TR\": {\n      \"path\": \"M513.19,301.28l3.65,1.31l3.06,-0.48l2.09,0.29l3.13,-1.74l2.44,-0.15l2.19,1.49l0.35,0.95l-0.23,1.5l0.24,0.43l2.34,1.31l-1.23,0.67l-0.2,0.43l0.75,3.55l-0.42,1.23l1.16,2.15l-0.57,0.25l-0.9,-0.73l-2.91,-0.41l-1.25,0.5l-4.23,0.45l-2.81,1.15l-1.9,0.01l-1.54,-0.57l-2.56,0.81l-0.66,-0.49l-0.64,0.29l-0.12,1.59l-0.89,0.9l-0.49,-0.75l0.8,-1.4l-0.41,-0.19l-1.43,0.25l-2.0,-0.69l-2.04,1.79l-3.49,0.32l-2.14,-1.66l-2.7,-0.1l-0.87,1.34l-1.36,0.29l-2.28,-1.56l-2.71,-0.02l-1.37,-2.89l-1.7,-1.68l1.09,-2.23l-0.08,-0.46l-1.31,-1.28l2.41,-2.71l3.68,-0.13l0.36,-0.25l0.94,-2.24l4.48,0.41l3.23,-2.2l2.8,-0.91l3.98,-0.07l4.28,2.31ZM488.78,302.77l-1.7,1.44l-0.51,-0.99l1.37,-2.91l-0.78,-0.93l1.78,-0.74l1.78,0.37l0.45,1.31l1.81,0.89l-0.14,0.26l-2.76,0.17l-1.31,1.13Z\",\n      \"name\": \"Turkey\"\n    },\n    \"LK\": {\n      \"path\": \"M624.16,398.87l-1.82,0.48l-0.99,-1.67l-0.42,-3.47l0.95,-3.45l1.21,0.98l2.26,4.21l-0.34,2.34l-0.85,0.58Z\",\n      \"name\": \"Sri Lanka\"\n    },\n    \"LV\": {\n      \"path\": \"M489.13,238.44l0.98,0.86l0.21,2.15l0.72,2.39l-3.68,2.17l-2.21,-1.98l-1.3,-0.34l-0.27,-0.73l-0.45,-0.25l-2.41,0.44l-4.15,-0.29l-2.48,1.13l0.07,-2.68l1.15,-2.72l1.91,-1.29l2.14,3.3l2.01,-0.09l0.38,-0.35l0.45,-3.34l1.74,-0.68l3.03,2.19l2.16,0.1Z\",\n      \"name\": \"Latvia\"\n    },\n    \"LT\": {\n      \"path\": \"M486.92,246.68l0.19,1.58l-2.02,1.5l-0.54,2.27l-2.48,1.47l-2.05,-0.02l-0.5,-1.08l-1.3,-0.59l-0.07,-2.33l-1.21,-0.74l-2.38,-0.69l-0.45,-3.18l2.51,-1.21l4.09,0.28l2.23,-0.39l0.52,0.88l1.23,0.27l2.22,1.99Z\",\n      \"name\": \"Lithuania\"\n    },\n    \"LU\": {\n      \"path\": \"M436.07,271.5l-0.48,-0.1l0.29,-1.66l0.29,0.51l-0.1,1.25Z\",\n      \"name\": \"Luxembourg\"\n    },\n    \"LR\": {\n      \"path\": \"M399.36,395.85l0.18,1.54l-0.49,1.0l0.08,0.47l2.47,1.8l-0.33,2.81l-2.65,-1.13l-5.78,-4.62l0.58,-1.32l2.1,-2.34l0.86,-0.22l0.77,1.14l-0.14,0.86l0.59,0.87l1.0,0.14l0.76,-0.99Z\",\n      \"name\": \"Liberia\"\n    },\n    \"LS\": {\n      \"path\": \"M491.05,494.85l-0.48,0.15l-1.5,-1.78l1.12,-1.53l2.18,-1.51l1.52,1.34l-0.99,1.94l-1.23,0.4l-0.62,0.98Z\",\n      \"name\": \"Lesotho\"\n    },\n    \"TH\": {\n      \"path\": \"M670.27,385.68l-1.41,3.9l0.15,2.01l0.38,0.36l1.38,0.07l0.9,2.05l0.55,2.34l1.4,1.45l1.61,0.38l0.96,0.97l-0.5,0.64l-1.1,0.2l-0.34,-1.18l-2.04,-1.1l-0.63,0.23l-0.63,-0.62l-0.48,-1.3l-2.55,-2.64l-0.73,0.41l0.95,-3.91l2.16,-4.25ZM670.67,384.59l-0.92,-2.2l-0.26,-2.64l-2.14,-3.1l0.72,-0.5l0.89,-2.62l-2.62,-3.66l-0.99,-1.9l0.88,-0.52l1.05,-2.63l1.74,-0.19l2.59,-1.63l0.76,0.58l0.13,1.42l0.37,0.36l1.23,0.09l-0.52,2.34l0.05,2.46l0.6,0.33l2.43,-1.45l0.77,0.4l1.47,-0.08l0.71,-0.89l1.48,0.14l1.71,1.92l0.25,2.69l1.92,2.15l-0.1,1.92l-0.61,0.87l-2.22,-0.33l-3.5,0.65l-1.6,2.14l0.36,2.6l-1.51,-0.79l-1.85,-0.01l0.28,-1.54l-0.4,-0.47l-2.21,0.02l-0.4,0.37l-0.19,2.77l-0.34,0.94Z\",\n      \"name\": \"Thailand\"\n    },\n    \"TF\": {\n      \"path\": \"M596.66,558.28l-3.18,0.21l-0.05,-1.59l0.4,-1.7l1.28,0.9l2.08,0.42l-0.53,1.76Z\",\n      \"name\": \"Fr. S. Antarctic Lands\"\n    },\n    \"TG\": {\n      \"path\": \"M422.7,387.47l-0.1,1.24l1.53,1.53l0.08,1.1l0.5,0.65l-0.11,5.64l0.49,1.47l-1.31,0.35l-1.02,-2.13l-0.18,-1.13l0.53,-2.2l-0.63,-1.16l-0.22,-3.7l-1.01,-1.41l0.07,-0.29l1.37,0.03Z\",\n      \"name\": \"Togo\"\n    },\n    \"TD\": {\n      \"path\": \"M480.25,365.02l0.12,9.75l-2.1,0.05l-1.14,1.91l-0.69,1.65l0.34,0.73l-0.66,0.92l0.24,0.9l-0.86,1.97l0.45,0.5l0.59,-0.1l0.34,0.65l0.03,1.39l0.9,1.06l-1.45,0.43l-1.27,1.03l-1.83,2.78l-2.16,1.08l-2.31,-0.15l-0.86,0.25l-0.26,0.49l0.17,0.62l-2.11,1.69l-2.85,0.87l-1.09,-0.57l-0.73,0.67l-1.12,0.1l-1.1,-3.13l-1.25,-0.64l-1.22,-1.23l0.3,-0.65l3.01,0.04l0.35,-0.6l-1.3,-2.21l-0.08,-3.33l-0.97,-1.68l0.22,-1.06l-0.38,-0.48l-1.22,-0.04l0.0,-1.27l-0.98,-1.08l0.97,-3.05l3.25,-2.68l0.13,-3.38l0.95,-5.29l0.52,-1.1l-0.1,-0.47l-0.91,-0.8l-0.19,-0.98l-0.8,-0.6l-0.55,-3.77l2.11,-1.24l19.56,10.1Z\",\n      \"name\": \"Chad\"\n    },\n    \"LY\": {\n      \"path\": \"M483.49,331.4l-0.77,1.19l0.3,1.46l-0.6,1.92l0.73,2.26l0.0,25.02l-2.48,0.01l-0.41,0.87l-19.41,-10.02l-4.41,2.35l-1.37,-1.37l-3.82,-1.13l-1.14,-1.71l-1.98,-1.28l-1.22,0.33l-0.67,-1.15l-0.16,-1.3l-1.29,-1.77l0.88,-1.24l-0.07,-4.54l0.43,-2.38l-0.86,-3.65l1.13,-0.8l0.22,-1.23l-0.21,-1.1l3.49,-2.78l0.28,-2.06l2.44,0.85l1.18,-0.22l1.97,0.47l3.14,1.26l1.37,2.7l5.71,1.77l2.64,1.43l1.62,-0.76l1.29,-1.41l-0.45,-2.46l0.67,-1.22l1.67,-1.29l1.56,-0.37l3.13,0.56l1.09,1.36l3.98,0.83l0.38,0.6Z\",\n      \"name\": \"Libya\"\n    },\n    \"AE\": {\n      \"path\": \"M550.76,353.19l1.89,-0.42l3.84,0.02l4.77,-4.92l0.19,0.38l0.26,1.67l-0.82,0.01l-0.39,0.35l-0.08,2.12l-0.82,0.64l-0.01,1.0l-0.67,1.03l-0.39,1.45l-7.07,-1.29l-0.71,-2.04Z\",\n      \"name\": \"United Arab Emirates\"\n    },\n    \"VE\": {\n      \"path\": \"M240.68,386.52l0.53,0.75l-0.02,1.07l-1.07,1.78l0.95,2.01l0.42,0.23l1.4,-0.44l0.56,-1.84l-0.77,-1.17l-0.1,-1.49l2.83,-0.94l0.26,-0.49l-0.28,-0.97l0.3,-0.28l0.66,1.32l1.96,0.26l1.4,1.23l0.08,0.69l0.39,0.35l4.81,-0.23l1.49,1.12l1.92,0.31l1.67,-0.84l0.22,-0.61l3.44,-0.14l-0.18,0.56l0.86,1.2l2.19,0.35l1.68,1.1l0.37,1.87l0.41,0.32l1.56,0.17l-1.66,1.36l-0.22,0.92l0.66,0.98l-1.67,0.54l-0.3,0.4l0.04,0.99l-0.56,0.57l-0.01,0.55l1.85,2.27l-0.66,0.69l-4.47,1.29l-0.72,0.54l-3.69,-0.9l-0.71,0.27l-0.02,0.7l0.91,0.53l-0.08,1.55l0.35,1.58l0.35,0.31l1.66,0.17l-1.3,0.52l-0.48,1.13l-2.68,0.91l-0.6,0.77l-1.57,0.13l-1.17,-1.13l-0.8,-2.52l-1.25,-1.26l1.02,-1.23l-1.29,-2.95l0.18,-1.62l1.0,-2.21l-0.2,-0.49l-1.14,-0.47l-4.02,0.36l-1.82,-2.11l-1.57,-0.33l-2.99,0.23l-1.06,-0.98l0.25,-1.24l-0.2,-1.02l-0.59,-0.69l-0.29,-1.06l-1.08,-0.39l0.78,-2.81l1.9,-2.12Z\",\n      \"name\": \"Venezuela\"\n    },\n    \"AF\": {\n      \"path\": \"M600.86,316.06l-1.73,1.47l0.72,3.0l-1.1,1.13l-0.02,1.35l-0.49,0.78l-2.15,-0.09l-0.37,0.58l0.8,1.63l-1.4,0.74l-1.06,1.8l0.07,1.81l-0.66,0.56l-0.91,-0.22l-1.91,0.38l-0.48,0.81l-1.88,0.14l-1.49,1.9l-0.08,2.2l-2.91,1.07l-1.64,-0.24l-0.72,0.58l-1.41,-0.31l-2.4,0.41l-3.54,-1.24l1.98,-2.49l-0.21,-1.88l-0.3,-0.34l-1.63,-0.42l-0.19,-1.69l-0.76,-2.19l0.96,-1.48l-0.18,-0.59l-0.75,-0.31l1.48,-5.22l2.12,0.97l2.14,-0.38l0.74,-1.45l1.77,-0.42l1.54,-1.0l0.62,-2.51l1.88,-0.54l0.48,-0.87l0.93,0.61l2.13,0.12l2.55,1.01l1.96,-0.89l0.64,0.46l0.58,-0.13l0.69,-1.23l1.58,-0.09l0.47,-0.64l0.24,-1.17l0.79,-0.81l0.81,0.43l-0.19,0.66l0.71,0.58l-0.09,2.61l1.28,1.05ZM601.25,315.96l1.86,-0.88l1.42,-1.28l3.93,0.22l0.11,0.23l-2.26,0.81l-5.06,0.9Z\",\n      \"name\": \"Afghanistan\"\n    },\n    \"IQ\": {\n      \"path\": \"M530.81,314.51l0.79,0.72l1.26,-0.3l1.46,3.35l1.63,1.01l0.15,1.38l-1.23,1.13l-0.53,2.67l1.73,2.85l3.12,1.72l1.16,2.02l-0.38,1.98l0.39,0.48l0.41,-0.0l0.02,1.16l0.79,1.02l-2.51,-0.11l-1.71,2.58l-4.3,-0.21l-7.02,-5.78l-3.73,-2.06l-2.89,-0.78l-0.86,-3.1l5.46,-3.23l0.95,-3.7l-0.2,-2.14l1.28,-0.77l1.22,-1.86l0.86,-0.39l2.67,0.37Z\",\n      \"name\": \"Iraq\"\n    },\n    \"IS\": {\n      \"path\": \"M384.17,190.14l-0.45,3.88l2.67,3.88l-3.04,4.17l-9.15,4.83l-9.47,-2.42l1.99,-2.05l-0.1,-0.63l-4.53,-2.38l3.43,-0.89l0.3,-0.41l-0.11,-1.75l-0.3,-0.36l-4.81,-1.29l1.43,-3.39l3.37,-0.82l3.74,4.02l0.56,0.03l3.59,-3.17l2.9,1.61l0.45,-0.04l3.95,-3.21l3.58,0.38Z\",\n      \"name\": \"Iceland\"\n    },\n    \"IR\": {\n      \"path\": \"M533.43,314.24l-1.29,-2.38l0.43,-1.06l-0.72,-3.4l1.03,-0.56l0.32,0.9l1.26,1.49l2.06,0.57l1.12,-0.18l2.89,-2.33l0.6,-0.15l0.42,0.54l-0.74,1.37l0.06,0.46l1.56,1.68l0.66,0.05l0.67,1.99l2.55,0.89l1.88,1.61l3.7,0.53l3.91,-0.83l0.47,-0.8l2.17,-0.66l1.65,-1.68l1.49,0.08l1.19,-0.57l1.57,0.26l2.84,1.62l1.88,0.32l2.77,2.69l1.78,0.2l0.18,2.19l-1.69,5.93l0.23,0.49l0.64,0.26l-0.85,1.58l0.81,2.33l0.19,1.83l0.3,0.35l1.63,0.43l0.16,1.43l-2.16,2.5l-0.01,0.51l2.21,3.19l2.35,1.3l0.06,2.26l1.24,0.74l0.12,0.75l-3.31,1.33l-1.08,3.14l-9.68,-1.74l-0.99,-3.18l-1.43,-0.75l-2.18,0.48l-2.47,1.31l-2.82,-0.86l-2.46,-2.11l-2.41,-0.84l-3.42,-6.37l-0.49,-0.2l-1.17,0.41l-1.43,-0.86l-0.51,0.09l-0.64,0.77l-0.97,-1.07l-0.02,-1.4l-0.71,-0.39l0.27,-1.92l-1.29,-2.25l-3.13,-1.73l-1.59,-2.62l0.51,-2.08l1.3,-1.32l-0.19,-1.79l-1.73,-1.17l-1.57,-3.6Z\",\n      \"name\": \"Iran\"\n    },\n    \"AM\": {\n      \"path\": \"M537.0,308.96l-0.27,0.03l-1.24,-2.34l-0.92,0.01l-0.62,-0.73l-0.69,-0.08l-0.96,-0.89l-1.58,-0.69l0.2,-1.3l-0.28,-0.9l2.73,-0.41l1.13,1.15l-0.21,1.0l1.06,0.9l-0.5,0.74l0.08,0.53l2.05,1.37l0.04,1.62Z\",\n      \"name\": \"Armenia\"\n    },\n    \"AL\": {\n      \"path\": \"M470.32,297.19l0.73,0.03l0.93,0.99l0.13,0.95l-0.3,1.27l0.36,1.43l1.02,0.9l-1.82,3.2l-0.18,-0.65l-1.26,-1.0l-0.19,-1.36l0.53,-3.17l-0.55,-1.64l0.61,-0.94Z\",\n      \"name\": \"Albania\"\n    },\n    \"AO\": {\n      \"path\": \"M461.55,429.93l1.26,3.16l1.94,2.36l2.47,-0.54l1.25,0.32l0.44,-0.18l0.93,-1.92l1.31,-0.08l0.41,-0.44l0.47,-0.0l-0.1,0.41l0.39,0.49l2.65,-0.02l0.03,1.2l0.48,1.02l-0.34,1.52l0.18,1.56l0.83,1.04l-0.13,2.87l0.54,0.39l3.96,-0.41l-0.1,1.81l0.39,1.06l-0.24,1.45l-4.7,-0.03l-0.4,0.39l-0.12,8.23l2.93,3.55l-3.84,0.9l-5.89,-0.36l-1.88,-1.27l-10.47,0.23l-1.3,-1.03l-1.85,-0.16l-2.4,0.78l-0.15,-1.08l0.33,-2.2l1.0,-3.5l1.35,-3.24l2.24,-2.82l0.33,-2.07l-0.13,-1.54l-0.8,-1.08l-1.21,-2.88l0.87,-1.62l-1.27,-4.13l-1.17,-1.53l2.47,-0.63l7.03,0.03ZM451.71,428.77l-0.47,-1.26l1.25,-1.11l0.32,0.3l-0.99,1.03l-0.12,1.04Z\",\n      \"name\": \"Angola\"\n    },\n    \"AR\": {\n      \"path\": \"M258.05,471.85l1.38,1.83l0.68,-0.08l0.87,-1.93l2.39,0.09l4.94,4.92l2.17,0.51l2.99,1.99l2.47,1.04l0.26,0.88l-2.38,4.1l0.23,0.58l5.39,1.21l2.13,-0.46l2.46,-2.25l0.49,-2.47l0.76,-0.32l0.98,1.25l-0.04,1.9l-3.67,2.62l-2.85,2.79l-3.42,4.08l-1.3,5.37l0.01,2.9l-0.54,0.77l-0.36,3.52l3.15,2.82l-0.31,1.9l1.54,1.59l-0.1,1.23l-2.3,3.86l-3.55,1.64l-4.91,0.65l-2.7,-0.32l-0.43,0.5l0.5,1.83l-0.49,2.34l0.4,1.59l-1.21,0.94l-2.34,0.42l-2.29,-1.15l-1.41,0.93l0.41,3.97l1.69,1.02l1.41,-0.77l0.39,0.92l-2.08,0.99l-2.01,2.14l-0.47,3.69l-0.49,1.57l-2.34,0.12l-2.08,2.01l-0.63,3.07l2.46,2.67l2.21,0.74l-0.73,2.83l-2.84,2.04l-1.73,4.57l-2.18,1.47l-1.15,1.98l0.77,4.43l1.16,1.7l-2.44,-0.66l-5.82,-0.52l-0.91,-2.06l0.05,-2.9l-0.46,-0.4l-1.41,0.21l-0.69,-1.12l-0.2,-3.82l1.89,-1.73l0.79,-2.4l-0.26,-1.97l1.31,-3.13l0.91,-4.79l-0.23,-1.96l1.06,-0.95l-0.27,-1.32l-1.01,-0.76l0.63,-1.12l-0.05,-0.46l-1.05,-1.22l-0.53,-3.58l0.97,-0.92l-0.42,-4.02l1.21,-6.04l1.53,-1.49l-0.75,-3.06l-0.01,-2.68l1.79,-1.91l0.05,-2.76l1.43,-3.06l0.01,-2.77l-0.69,-0.77l-1.09,-4.84l1.48,-2.87l-0.19,-2.93l0.85,-2.48l1.59,-2.58l1.73,-1.72l0.05,-0.51l-0.61,-0.89l0.45,-0.89l-0.07,-4.37l2.71,-1.48l0.86,-2.84l-0.22,-0.73l1.77,-2.07l2.9,0.58ZM256.68,580.89l-1.95,0.18l-1.42,-1.53l-3.82,-0.12l-0.0,-7.37l1.57,3.7l3.26,2.57l3.18,1.01l-0.81,1.56Z\",\n      \"name\": \"Argentina\"\n    },\n    \"AU\": {\n      \"path\": \"M705.79,484.09l0.27,0.04l0.18,-0.47l-0.49,-1.51l0.92,1.16l0.45,0.15l0.28,-0.39l-0.09,-1.61l-1.99,-3.77l1.09,-3.43l-0.24,-1.62l0.34,-0.64l0.38,1.08l0.43,-0.19l0.99,-1.75l1.91,-0.85l1.29,-1.18l1.81,-0.93l0.95,-0.17l0.93,0.27l1.92,-0.97l1.46,-0.29l1.03,-0.82l1.44,0.04l2.78,-0.86l1.36,-1.18l0.71,-1.48l1.41,-1.28l0.3,-2.63l1.27,-1.61l0.78,1.67l0.54,0.19l1.07,-0.52l0.15,-0.59l-0.73,-1.02l0.45,-0.73l0.78,0.4l0.58,-0.3l0.28,-1.84l1.87,-2.17l1.12,-0.39l0.28,-0.58l0.62,0.17l0.5,-0.36l0.03,-0.38l1.87,-0.58l1.65,1.06l1.35,1.49l3.4,0.39l0.44,-0.54l-0.46,-1.24l1.05,-1.82l1.04,-0.62l0.14,-0.55l-0.25,-0.41l0.88,-1.19l1.31,-0.78l1.31,0.27l2.1,-0.48l0.31,-0.4l-0.05,-1.31l-0.92,-0.78l1.48,0.56l1.41,1.08l2.11,0.65l0.81,-0.21l1.4,0.71l1.69,-0.67l0.8,0.19l0.64,-0.33l0.71,0.78l-1.33,1.96l-0.71,0.07l-0.35,0.51l0.24,0.87l-1.52,2.38l0.12,1.06l2.15,1.66l1.97,0.86l3.04,2.4l1.97,0.66l0.54,0.89l2.72,0.87l1.84,-1.12l2.07,-6.05l-0.43,-3.63l0.3,-1.75l0.47,-0.87l-0.32,-0.69l1.09,-3.31l0.46,-0.47l0.4,0.71l0.17,1.52l0.65,0.53l0.15,1.04l0.85,1.22l0.12,2.41l0.9,2.03l0.57,0.18l1.3,-0.79l1.69,1.73l-0.2,1.09l0.53,2.23l0.39,1.32l0.68,0.49l0.6,1.99l-0.2,1.51l0.81,1.79l2.87,1.56l3.14,2.21l-0.12,0.78l1.38,1.62l0.95,2.84l0.58,0.22l0.71,-0.42l0.8,0.92l0.61,0.01l0.46,2.48l4.82,4.87l0.66,2.1l-0.07,3.44l1.15,2.31l-0.13,2.37l-1.1,3.88l0.04,1.73l-0.48,2.02l-1.05,2.56l-1.9,1.57l-1.73,3.77l-2.38,6.57l-0.24,3.08l-1.15,0.88l-2.86,0.16l-2.31,1.3l-2.5,2.46l-1.81,-1.24l-1.29,-0.49l0.31,-1.32l-0.55,-0.46l-1.5,0.69l-2.01,2.12l-7.1,-2.39l-1.49,-1.79l-1.13,-4.06l-1.45,-1.37l-1.84,-0.28l0.58,-1.28l-0.61,-2.26l-0.73,-0.1l-1.14,1.96l-0.94,0.24l0.6,-0.77l0.44,-1.84l0.99,-1.67l-0.2,-2.22l-0.28,-0.35l-0.43,0.13l-2.0,2.51l-1.51,1.0l-0.93,2.15l-1.35,-0.87l-0.01,-1.63l-1.57,-2.18l-1.11,-0.96l0.27,-0.39l-0.13,-0.58l-3.21,-1.8l-1.84,-0.13l-2.55,-1.44l-4.58,0.3l-6.02,2.02l-2.54,-0.14l-2.62,1.5l-2.13,0.67l-1.49,2.78l-3.48,0.33l-2.3,-0.54l-3.48,0.46l-1.6,1.58l-0.81,-0.03l-2.36,1.75l-3.24,-0.11l-3.72,-2.38l0.04,-1.18l1.19,-0.49l0.48,-0.93l0.21,-3.17l-0.28,-1.75l-1.34,-3.02l-0.39,-1.56l0.06,-1.8l-0.96,-1.79l-0.17,-1.0l-1.02,-1.04l-0.29,-2.09l-1.15,-1.85ZM784.91,527.24l2.67,1.14l3.23,-1.06l1.08,0.16l0.16,3.5l-0.85,1.25l-0.18,1.86l-0.27,-0.29l-0.62,0.04l-1.56,2.15l-1.66,-0.2l-1.41,-2.68l-0.37,-2.29l-1.4,-2.82l0.04,-0.96l1.14,0.2Z\",\n      \"name\": \"Australia\"\n    },\n    \"AT\": {\n      \"path\": \"M462.92,275.34l0.01,2.75l-1.06,0.01l-0.34,0.61l0.39,0.64l-1.07,2.55l-2.0,0.08l-1.34,0.81l-5.27,-1.14l-0.48,-1.1l-0.47,-0.23l-2.47,0.64l-0.42,0.58l-2.45,-0.51l-0.75,-0.44l0.44,-1.16l1.11,0.9l0.63,-0.17l0.25,-0.69l1.91,0.14l1.87,-0.66l0.97,0.09l0.68,0.66l0.65,-0.15l0.25,-0.83l-0.31,-2.16l0.82,-0.52l0.68,-1.35l1.49,0.98l0.52,-0.07l1.34,-1.47l0.61,-0.2l1.79,1.07l1.3,-0.12l0.74,0.46Z\",\n      \"name\": \"Austria\"\n    },\n    \"IN\": {\n      \"path\": \"M623.36,335.51l-1.27,1.12l-0.97,2.68l0.21,0.5l8.04,4.05l3.43,0.39l1.57,1.44l4.92,0.91l2.18,-0.04l0.38,-0.3l0.29,-1.28l-0.32,-1.72l0.15,-0.92l0.82,-0.32l0.44,2.59l2.28,1.07l1.78,-0.4l4.14,0.1l0.38,-0.36l0.18,-1.73l-0.53,-0.69l1.4,-0.31l2.25,-2.09l2.69,-1.7l1.92,0.64l1.8,-1.03l0.8,1.22l-0.69,0.98l0.26,0.63l2.42,0.38l0.09,0.52l-0.83,0.77l0.13,1.14l-1.53,-0.3l-3.24,1.94l-0.12,1.84l-1.32,2.23l-0.17,1.44l-0.93,1.89l-1.63,-0.52l-0.52,0.37l-0.09,2.72l-0.56,1.13l0.2,0.85l-0.53,0.28l-1.18,-3.85l-1.08,-0.27l-0.38,0.31l-0.24,1.03l-0.66,-0.68l0.55,-1.12l1.21,-0.35l1.15,-2.33l-0.23,-0.56l-1.58,-0.49l-4.33,-0.29l-0.19,-1.63l-0.35,-0.35l-1.11,-0.13l-1.91,-1.16l-0.57,0.17l-0.88,1.89l0.11,0.48l1.38,1.12l-1.11,0.73l-0.69,1.14l0.18,0.55l1.24,0.59l-0.32,1.59l0.85,2.01l0.36,2.08l-0.22,0.62l-4.58,0.54l-0.33,0.42l0.13,1.86l-1.18,1.39l-3.65,1.85l-2.79,3.1l-4.32,3.33l-0.18,1.29l-4.65,1.82l-0.77,2.19l0.64,5.37l-1.06,2.51l-0.01,3.97l-1.24,0.28l-1.14,1.94l0.39,0.85l-1.69,0.53l-1.04,1.84l-0.65,0.47l-2.06,-2.06l-2.1,-6.05l-2.2,-3.67l-1.05,-4.8l-2.29,-3.61l-1.76,-8.34l0.01,-3.18l-0.49,-2.59l-0.55,-0.29l-3.53,1.56l-1.52,-0.28l-2.87,-2.86l0.86,-0.7l0.08,-0.54l-0.74,-1.06l-2.68,-2.13l1.26,-1.38l5.33,0.01l0.39,-0.48l-0.5,-2.37l-1.42,-1.51l-0.27,-2.01l-1.44,-1.26l2.33,-2.5l3.05,0.07l2.62,-2.99l1.6,-2.96l2.4,-2.88l0.06,-2.16l1.98,-1.58l-0.01,-0.64l-1.93,-1.4l-0.82,-1.91l-0.81,-2.4l0.91,-0.97l3.58,0.7l2.93,-0.45l2.32,-2.35l2.31,3.07l-0.24,2.31l0.99,1.68l-0.05,0.92l-1.34,-0.3l-0.48,0.47l0.7,3.26l2.61,2.09l3.02,1.77Z\",\n      \"name\": \"India\"\n    },\n    \"TZ\": {\n      \"path\": \"M495.56,426.32l2.8,-3.13l-0.02,-0.82l-0.64,-1.3l0.68,-0.52l0.14,-1.47l-0.76,-1.25l0.31,-0.11l2.26,0.03l-0.51,2.76l0.76,1.3l0.5,0.12l1.05,-0.53l1.19,-0.12l0.61,0.24l1.43,-0.62l0.1,-0.67l-0.71,-0.62l1.57,-1.7l8.65,4.86l0.32,1.53l3.34,2.33l-1.05,2.81l0.13,1.61l1.63,1.12l-0.6,1.77l-0.01,2.33l1.89,4.05l0.57,0.44l-1.47,1.09l-2.61,0.95l-1.43,-0.04l-1.06,0.77l-2.29,0.36l-2.87,-0.69l-0.83,0.07l-0.64,-0.75l-0.31,-2.8l-1.32,-1.36l-3.25,-0.77l-3.96,-1.59l-1.18,-2.42l-0.32,-1.75l-1.76,-1.49l0.42,-1.05l-0.44,-0.89l0.08,-0.96l-0.46,-0.58l0.06,-0.56Z\",\n      \"name\": \"Tanzania\"\n    },\n    \"AZ\": {\n      \"path\": \"M539.27,301.57l1.33,0.36l0.44,-0.21l0.4,-0.78l1.11,-1.01l2.3,3.71l1.5,0.55l-1.32,0.17l-0.34,0.33l-0.81,3.49l-0.98,1.01l0.05,1.26l-1.28,-1.27l0.73,-1.34l-0.78,-1.39l-1.51,0.17l-2.32,1.87l-0.04,-1.43l-2.05,-1.48l0.5,-0.74l-0.07,-0.53l-1.07,-0.91l0.33,-0.54l-0.14,-0.55l-1.17,-1.02l1.91,0.73l1.71,0.07l0.37,-0.88l-1.01,-1.48l0.2,-0.14l0.4,0.06l1.63,1.92ZM533.76,306.94l0.63,0.52l0.69,-0.0l0.63,1.35l-0.71,-0.18l-1.25,-1.69Z\",\n      \"name\": \"Azerbaijan\"\n    },\n    \"IE\": {\n      \"path\": \"M405.07,254.34l0.37,2.67l-1.78,3.47l-4.21,2.28l-2.89,-0.5l1.83,-4.09l-1.24,-4.04l4.62,-4.68l0.33,1.5l-0.5,2.21l0.41,0.49l1.45,-0.06l1.61,0.75Z\",\n      \"name\": \"Ireland\"\n    },\n    \"ID\": {\n      \"path\": \"M756.47,417.79l0.69,4.01l2.79,1.78l0.51,-0.1l2.04,-2.59l2.71,-1.43l2.05,-0.0l3.9,1.73l2.46,0.45l0.08,15.16l-1.75,-1.55l-2.54,-0.51l-0.88,0.72l-2.32,0.06l0.69,-1.33l1.45,-0.64l0.23,-0.46l-0.65,-2.74l-1.24,-2.22l-5.04,-2.3l-2.09,-0.23l-3.68,-2.27l-0.55,0.13l-0.65,1.07l-0.52,0.12l-0.55,-1.89l-1.21,-0.78l1.84,-0.62l1.72,0.05l0.39,-0.52l-0.21,-0.66l-0.38,-0.28l-3.45,-0.0l-1.13,-1.48l-2.1,-0.43l-0.52,-0.61l2.69,-0.48l1.28,-0.78l3.66,0.94l0.3,0.71ZM757.91,430.25l-0.62,0.82l-0.1,-0.8l0.59,-1.12l0.13,1.1ZM747.38,422.88l0.34,0.72l-1.22,-0.57l-4.68,-0.1l0.27,-0.62l2.78,-0.09l2.52,0.67ZM741.05,415.14l-0.67,-2.88l0.64,-2.01l0.41,0.86l1.21,0.18l0.16,0.7l-0.1,1.68l-0.84,-0.16l-0.46,0.3l-0.34,1.34ZM739.05,423.4l-0.5,0.45l-1.34,-0.36l-0.17,-0.37l1.73,-0.08l0.27,0.36ZM721.45,414.41l-0.19,1.97l2.24,2.23l0.54,0.02l1.27,-1.07l2.75,-0.5l-0.9,1.21l-2.11,0.93l-0.16,0.6l2.22,3.01l-0.3,1.07l1.36,1.75l-2.26,0.85l-0.28,-0.31l0.12,-1.19l-1.64,-1.34l0.17,-2.24l-0.56,-0.39l-1.67,0.76l-0.23,0.39l0.3,6.18l-1.1,0.25l-0.69,-0.47l0.64,-2.21l-0.39,-2.42l-0.39,-0.34l-0.8,-0.01l-0.58,-1.29l0.98,-1.6l0.35,-1.96l1.32,-3.87ZM728.59,426.17l0.38,0.5l-0.02,1.28l-0.88,0.49l-0.53,-0.48l1.04,-1.79ZM729.04,416.88l0.27,-0.05l-0.02,0.13l-0.24,-0.08ZM721.68,413.95l0.16,-0.32l1.89,-1.65l1.83,0.68l3.16,0.35l2.94,-0.1l2.39,-1.66l-1.73,2.13l-1.66,0.43l-2.41,-0.48l-4.17,0.13l-2.39,0.51ZM730.55,440.42l1.11,-1.94l2.02,-0.82l0.08,0.62l-1.45,1.68l-1.77,0.46ZM728.12,435.8l-0.1,0.38l-3.46,0.66l-2.91,-0.27l-0.0,-0.25l1.54,-0.41l1.66,0.73l1.67,-0.19l1.61,-0.65ZM722.9,440.18l-0.64,0.03l-2.26,-1.21l1.12,-0.24l1.78,1.42ZM716.26,435.69l0.88,0.51l1.28,-0.17l0.2,0.35l-4.65,0.73l0.4,-0.67l1.15,-0.02l0.75,-0.74ZM711.66,423.74l-0.38,-0.16l-2.54,1.01l-1.12,-1.44l-1.69,-0.13l-1.16,-0.75l-3.04,0.77l-1.1,-1.15l-3.31,-0.11l-0.35,-3.05l-1.35,-0.95l-1.11,-1.98l-0.33,-2.06l0.27,-2.14l0.9,-1.01l0.37,1.15l2.09,1.49l1.53,-0.48l1.82,0.08l1.38,-1.19l1.0,-0.18l2.28,0.67l2.26,-0.53l1.52,-3.64l1.01,-0.99l0.78,-2.57l4.1,0.31l-1.11,1.77l0.02,0.46l1.7,2.2l-0.23,1.39l2.07,1.71l-2.33,0.42l-0.88,1.9l0.1,2.05l-2.4,1.9l-0.06,2.45l-0.7,2.79ZM692.58,431.94l0.35,0.26l4.8,0.25l0.78,-0.97l4.17,1.09l1.13,1.69l3.69,0.45l2.14,1.05l-1.8,0.61l-2.77,-1.0l-4.8,-0.12l-5.24,-1.42l-1.84,-0.25l-1.11,0.3l-4.26,-0.97l-0.7,-1.14l-1.59,-0.13l1.18,-1.66l2.74,0.13l2.87,1.13l0.26,0.69ZM685.53,429.08l-2.22,0.04l-2.06,-2.04l-3.15,-2.01l-2.93,-3.52l-3.11,-5.33l-2.2,-2.12l-1.64,-4.06l-2.32,-1.69l-1.27,-2.07l-1.96,-1.5l-2.51,-2.65l-0.11,-0.66l4.81,0.53l2.15,2.38l3.31,2.74l2.35,2.66l2.7,0.17l1.95,1.59l1.54,2.17l1.59,0.95l-0.84,1.71l0.15,0.52l1.44,0.87l0.79,0.1l0.4,1.58l0.87,1.4l1.96,0.39l1.0,1.31l-0.6,3.01l-0.09,3.51Z\",\n      \"name\": \"Indonesia\"\n    },\n    \"UA\": {\n      \"path\": \"M493.77,283.66l1.85,0.21l0.66,-0.27l0.1,-0.68l-0.25,-0.87l-0.8,-0.85l-0.34,-1.43l-0.87,-0.71l0.01,-1.37l-1.13,-1.01l-1.16,-0.23l-2.07,-1.18l-1.66,0.37l-0.67,0.55l-0.9,-0.0l-0.86,0.91l-1.69,0.33l-0.76,0.47l-1.18,-0.82l-3.05,-0.42l-0.9,0.48l-0.22,-0.62l-1.16,-0.85l0.86,-1.88l0.25,0.1l0.53,-0.51l-0.57,-1.53l2.08,-2.96l1.38,-0.69l0.26,-1.34l-1.09,-3.02l0.9,-0.18l1.27,-1.02l1.78,-0.08l2.45,0.31l2.87,0.98l1.87,0.08l0.85,0.53l1.06,-0.47l0.78,0.77l2.17,-0.18l0.91,0.35l0.54,-0.34l0.15,-1.9l0.58,-0.67l2.82,-0.06l0.87,-0.86l3.0,-0.22l1.29,1.86l-0.53,0.89l0.21,1.25l0.36,0.33l1.78,0.17l0.93,2.49l3.18,1.38l1.95,-0.52l1.69,1.77l1.39,-0.04l3.36,1.15l0.02,0.75l-0.97,1.91l0.49,2.26l-0.28,0.89l-2.37,0.33l-1.29,1.04l-0.21,1.6l-1.85,0.32l-1.58,1.12l-2.41,0.24l-2.16,1.36l-0.19,0.36l0.32,2.54l1.49,0.93l1.92,-0.16l-0.18,0.47l-2.65,0.61l-3.21,1.92l-0.89,-0.46l0.44,-1.33l-0.24,-0.5l-2.27,-0.86l2.41,-1.32l0.12,-0.62l-0.93,-0.95l-3.62,-0.85l-0.14,-1.08l-0.47,-0.34l-2.32,0.45l-2.91,4.52l-1.19,-0.45l-0.98,0.48l-0.36,-0.21l1.35,-2.93Z\",\n      \"name\": \"Ukraine\"\n    },\n    \"QA\": {\n      \"path\": \"M549.32,350.8l-0.76,-0.24l-0.14,-1.72l0.84,-1.35l0.47,0.54l0.04,1.41l-0.45,1.36Z\",\n      \"name\": \"Qatar\"\n    },\n    \"MZ\": {\n      \"path\": \"M508.58,448.77l-0.34,-2.6l0.51,-2.07l3.55,0.64l2.51,-0.38l1.02,-0.76l1.49,0.01l2.74,-0.99l1.66,-1.21l0.51,9.32l0.41,1.25l-0.68,1.69l-0.93,1.74l-1.5,1.52l-5.16,2.32l-2.78,2.78l-1.02,0.54l-1.71,1.84l-0.98,0.59l-0.35,2.45l1.16,1.99l0.49,2.24l0.43,0.31l-0.06,2.14l-0.39,1.21l0.5,0.73l-0.25,0.78l-0.92,0.86l-5.13,2.47l-1.22,1.39l0.21,1.17l0.59,0.4l-0.11,0.78l-1.22,-0.02l-0.73,-3.1l0.42,-3.19l-1.78,-5.56l2.49,-2.89l0.69,-1.93l0.44,-0.43l0.28,-1.57l-0.39,-0.94l0.59,-3.72l-0.01,-3.32l-1.48,-1.17l-1.2,-0.23l-1.74,-1.18l-1.92,0.0l-0.3,-2.12l7.06,-1.98l1.28,1.1l0.89,-0.1l0.67,0.45l0.1,0.75l-0.51,1.3l0.19,1.83l1.75,1.86l0.65,-0.13l0.71,-1.68l1.17,-0.86l-0.26,-3.51l-1.05,-1.87l-1.04,-0.95Z\",\n      \"name\": \"Mozambique\"\n    }\n  },\n  \"height\": 583.0802520919394,\n  \"projection\": {\n    \"type\": \"merc\",\n    \"centralMeridian\": 11.5\n  },\n  \"width\": 900.0\n})"
  },
  {
    "path": "src/material-stubs/resources/material/assets/js/prism.js",
    "content": "\n/* **********************************************\n     Begin prism-core.js\n********************************************** */\n\nvar _self = (typeof window !== 'undefined')\n\t? window   // if in browser\n\t: (\n\t\t(typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope)\n\t\t? self // if in worker\n\t\t: {}   // if in node js\n\t);\n\n/**\n * Prism: Lightweight, robust, elegant syntax highlighting\n * MIT license http://www.opensource.org/licenses/mit-license.php/\n * @author Lea Verou http://lea.verou.me\n */\n\nvar Prism = (function (_self){\n\n// Private helper vars\nvar lang = /\\blang(?:uage)?-([\\w-]+)\\b/i;\nvar uniqueId = 0;\n\n\nvar _ = {\n\tmanual: _self.Prism && _self.Prism.manual,\n\tdisableWorkerMessageHandler: _self.Prism && _self.Prism.disableWorkerMessageHandler,\n\tutil: {\n\t\tencode: function (tokens) {\n\t\t\tif (tokens instanceof Token) {\n\t\t\t\treturn new Token(tokens.type, _.util.encode(tokens.content), tokens.alias);\n\t\t\t} else if (Array.isArray(tokens)) {\n\t\t\t\treturn tokens.map(_.util.encode);\n\t\t\t} else {\n\t\t\t\treturn tokens.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/\\u00a0/g, ' ');\n\t\t\t}\n\t\t},\n\n\t\ttype: function (o) {\n\t\t\treturn Object.prototype.toString.call(o).slice(8, -1);\n\t\t},\n\n\t\tobjId: function (obj) {\n\t\t\tif (!obj['__id']) {\n\t\t\t\tObject.defineProperty(obj, '__id', { value: ++uniqueId });\n\t\t\t}\n\t\t\treturn obj['__id'];\n\t\t},\n\n\t\t// Deep clone a language definition (e.g. to extend it)\n\t\tclone: function deepClone(o, visited) {\n\t\t\tvar clone, id, type = _.util.type(o);\n\t\t\tvisited = visited || {};\n\n\t\t\tswitch (type) {\n\t\t\t\tcase 'Object':\n\t\t\t\t\tid = _.util.objId(o);\n\t\t\t\t\tif (visited[id]) {\n\t\t\t\t\t\treturn visited[id];\n\t\t\t\t\t}\n\t\t\t\t\tclone = {};\n\t\t\t\t\tvisited[id] = clone;\n\n\t\t\t\t\tfor (var key in o) {\n\t\t\t\t\t\tif (o.hasOwnProperty(key)) {\n\t\t\t\t\t\t\tclone[key] = deepClone(o[key], visited);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn clone;\n\n\t\t\t\tcase 'Array':\n\t\t\t\t\tid = _.util.objId(o);\n\t\t\t\t\tif (visited[id]) {\n\t\t\t\t\t\treturn visited[id];\n\t\t\t\t\t}\n\t\t\t\t\tclone = [];\n\t\t\t\t\tvisited[id] = clone;\n\n\t\t\t\t\to.forEach(function (v, i) {\n\t\t\t\t\t\tclone[i] = deepClone(v, visited);\n\t\t\t\t\t});\n\n\t\t\t\t\treturn clone;\n\n\t\t\t\tdefault:\n\t\t\t\t\treturn o;\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Returns the Prism language of the given element set by a `language-xxxx` or `lang-xxxx` class.\n\t\t *\n\t\t * If no language is set for the element or the element is `null` or `undefined`, `none` will be returned.\n\t\t *\n\t\t * @param {Element} element\n\t\t * @returns {string}\n\t\t */\n\t\tgetLanguage: function (element) {\n\t\t\twhile (element && !lang.test(element.className)) {\n\t\t\t\telement = element.parentElement;\n\t\t\t}\n\t\t\tif (element) {\n\t\t\t\treturn (element.className.match(lang) || [, 'none'])[1].toLowerCase();\n\t\t\t}\n\t\t\treturn 'none';\n\t\t},\n\n\t\t/**\n\t\t * Returns the script element that is currently executing.\n\t\t *\n\t\t * This does __not__ work for line script element.\n\t\t *\n\t\t * @returns {HTMLScriptElement | null}\n\t\t */\n\t\tcurrentScript: function () {\n\t\t\tif (typeof document === 'undefined') {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t\tif ('currentScript' in document) {\n\t\t\t\treturn document.currentScript;\n\t\t\t}\n\n\t\t\t// IE11 workaround\n\t\t\t// we'll get the src of the current script by parsing IE11's error stack trace\n\t\t\t// this will not work for inline scripts\n\n\t\t\ttry {\n\t\t\t\tthrow new Error();\n\t\t\t} catch (err) {\n\t\t\t\t// Get file src url from stack. Specifically works with the format of stack traces in IE.\n\t\t\t\t// A stack will look like this:\n\t\t\t\t//\n\t\t\t\t// Error\n\t\t\t\t//    at _.util.currentScript (http://localhost/components/prism-core.js:119:5)\n\t\t\t\t//    at Global code (http://localhost/components/prism-core.js:606:1)\n\n\t\t\t\tvar src = (/at [^(\\r\\n]*\\((.*):.+:.+\\)$/i.exec(err.stack) || [])[1];\n\t\t\t\tif (src) {\n\t\t\t\t\tvar scripts = document.getElementsByTagName('script');\n\t\t\t\t\tfor (var i in scripts) {\n\t\t\t\t\t\tif (scripts[i].src == src) {\n\t\t\t\t\t\t\treturn scripts[i];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn null;\n\t\t\t}\n\t\t}\n\t},\n\n\tlanguages: {\n\t\textend: function (id, redef) {\n\t\t\tvar lang = _.util.clone(_.languages[id]);\n\n\t\t\tfor (var key in redef) {\n\t\t\t\tlang[key] = redef[key];\n\t\t\t}\n\n\t\t\treturn lang;\n\t\t},\n\n\t\t/**\n\t\t * Insert a token before another token in a language literal\n\t\t * As this needs to recreate the object (we cannot actually insert before keys in object literals),\n\t\t * we cannot just provide an object, we need an object and a key.\n\t\t * @param inside The key (or language id) of the parent\n\t\t * @param before The key to insert before.\n\t\t * @param insert Object with the key/value pairs to insert\n\t\t * @param root The object that contains `inside`. If equal to Prism.languages, it can be omitted.\n\t\t */\n\t\tinsertBefore: function (inside, before, insert, root) {\n\t\t\troot = root || _.languages;\n\t\t\tvar grammar = root[inside];\n\t\t\tvar ret = {};\n\n\t\t\tfor (var token in grammar) {\n\t\t\t\tif (grammar.hasOwnProperty(token)) {\n\n\t\t\t\t\tif (token == before) {\n\t\t\t\t\t\tfor (var newToken in insert) {\n\t\t\t\t\t\t\tif (insert.hasOwnProperty(newToken)) {\n\t\t\t\t\t\t\t\tret[newToken] = insert[newToken];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Do not insert token which also occur in insert. See #1525\n\t\t\t\t\tif (!insert.hasOwnProperty(token)) {\n\t\t\t\t\t\tret[token] = grammar[token];\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tvar old = root[inside];\n\t\t\troot[inside] = ret;\n\n\t\t\t// Update references in other language definitions\n\t\t\t_.languages.DFS(_.languages, function(key, value) {\n\t\t\t\tif (value === old && key != inside) {\n\t\t\t\t\tthis[key] = ret;\n\t\t\t\t}\n\t\t\t});\n\n\t\t\treturn ret;\n\t\t},\n\n\t\t// Traverse a language definition with Depth First Search\n\t\tDFS: function DFS(o, callback, type, visited) {\n\t\t\tvisited = visited || {};\n\n\t\t\tvar objId = _.util.objId;\n\n\t\t\tfor (var i in o) {\n\t\t\t\tif (o.hasOwnProperty(i)) {\n\t\t\t\t\tcallback.call(o, i, o[i], type || i);\n\n\t\t\t\t\tvar property = o[i],\n\t\t\t\t\t    propertyType = _.util.type(property);\n\n\t\t\t\t\tif (propertyType === 'Object' && !visited[objId(property)]) {\n\t\t\t\t\t\tvisited[objId(property)] = true;\n\t\t\t\t\t\tDFS(property, callback, null, visited);\n\t\t\t\t\t}\n\t\t\t\t\telse if (propertyType === 'Array' && !visited[objId(property)]) {\n\t\t\t\t\t\tvisited[objId(property)] = true;\n\t\t\t\t\t\tDFS(property, callback, i, visited);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t},\n\tplugins: {},\n\n\thighlightAll: function(async, callback) {\n\t\t_.highlightAllUnder(document, async, callback);\n\t},\n\n\thighlightAllUnder: function(container, async, callback) {\n\t\tvar env = {\n\t\t\tcallback: callback,\n\t\t\tcontainer: container,\n\t\t\tselector: 'code[class*=\"language-\"], [class*=\"language-\"] code, code[class*=\"lang-\"], [class*=\"lang-\"] code'\n\t\t};\n\n\t\t_.hooks.run('before-highlightall', env);\n\n\t\tenv.elements = Array.prototype.slice.apply(env.container.querySelectorAll(env.selector));\n\n\t\t_.hooks.run('before-all-elements-highlight', env);\n\n\t\tfor (var i = 0, element; element = env.elements[i++];) {\n\t\t\t_.highlightElement(element, async === true, env.callback);\n\t\t}\n\t},\n\n\thighlightElement: function(element, async, callback) {\n\t\t// Find language\n\t\tvar language = _.util.getLanguage(element);\n\t\tvar grammar = _.languages[language];\n\n\t\t// Set language on the element, if not present\n\t\telement.className = element.className.replace(lang, '').replace(/\\s+/g, ' ') + ' language-' + language;\n\n\t\t// Set language on the parent, for styling\n\t\tvar parent = element.parentNode;\n\t\tif (parent && parent.nodeName.toLowerCase() === 'pre') {\n\t\t\tparent.className = parent.className.replace(lang, '').replace(/\\s+/g, ' ') + ' language-' + language;\n\t\t}\n\n\t\tvar code = element.textContent;\n\n\t\tvar env = {\n\t\t\telement: element,\n\t\t\tlanguage: language,\n\t\t\tgrammar: grammar,\n\t\t\tcode: code\n\t\t};\n\n\t\tfunction insertHighlightedCode(highlightedCode) {\n\t\t\tenv.highlightedCode = highlightedCode;\n\n\t\t\t_.hooks.run('before-insert', env);\n\n\t\t\tenv.element.innerHTML = env.highlightedCode;\n\n\t\t\t_.hooks.run('after-highlight', env);\n\t\t\t_.hooks.run('complete', env);\n\t\t\tcallback && callback.call(env.element);\n\t\t}\n\n\t\t_.hooks.run('before-sanity-check', env);\n\n\t\tif (!env.code) {\n\t\t\t_.hooks.run('complete', env);\n\t\t\tcallback && callback.call(env.element);\n\t\t\treturn;\n\t\t}\n\n\t\t_.hooks.run('before-highlight', env);\n\n\t\tif (!env.grammar) {\n\t\t\tinsertHighlightedCode(_.util.encode(env.code));\n\t\t\treturn;\n\t\t}\n\n\t\tif (async && _self.Worker) {\n\t\t\tvar worker = new Worker(_.filename);\n\n\t\t\tworker.onmessage = function(evt) {\n\t\t\t\tinsertHighlightedCode(evt.data);\n\t\t\t};\n\n\t\t\tworker.postMessage(JSON.stringify({\n\t\t\t\tlanguage: env.language,\n\t\t\t\tcode: env.code,\n\t\t\t\timmediateClose: true\n\t\t\t}));\n\t\t}\n\t\telse {\n\t\t\tinsertHighlightedCode(_.highlight(env.code, env.grammar, env.language));\n\t\t}\n\t},\n\n\thighlight: function (text, grammar, language) {\n\t\tvar env = {\n\t\t\tcode: text,\n\t\t\tgrammar: grammar,\n\t\t\tlanguage: language\n\t\t};\n\t\t_.hooks.run('before-tokenize', env);\n\t\tenv.tokens = _.tokenize(env.code, env.grammar);\n\t\t_.hooks.run('after-tokenize', env);\n\t\treturn Token.stringify(_.util.encode(env.tokens), env.language);\n\t},\n\n\tmatchGrammar: function (text, strarr, grammar, index, startPos, oneshot, target) {\n\t\tfor (var token in grammar) {\n\t\t\tif (!grammar.hasOwnProperty(token) || !grammar[token]) {\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\tvar patterns = grammar[token];\n\t\t\tpatterns = Array.isArray(patterns) ? patterns : [patterns];\n\n\t\t\tfor (var j = 0; j < patterns.length; ++j) {\n\t\t\t\tif (target && target == token + ',' + j) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tvar pattern = patterns[j],\n\t\t\t\t\tinside = pattern.inside,\n\t\t\t\t\tlookbehind = !!pattern.lookbehind,\n\t\t\t\t\tgreedy = !!pattern.greedy,\n\t\t\t\t\tlookbehindLength = 0,\n\t\t\t\t\talias = pattern.alias;\n\n\t\t\t\tif (greedy && !pattern.pattern.global) {\n\t\t\t\t\t// Without the global flag, lastIndex won't work\n\t\t\t\t\tvar flags = pattern.pattern.toString().match(/[imsuy]*$/)[0];\n\t\t\t\t\tpattern.pattern = RegExp(pattern.pattern.source, flags + 'g');\n\t\t\t\t}\n\n\t\t\t\tpattern = pattern.pattern || pattern;\n\n\t\t\t\t// Don’t cache length as it changes during the loop\n\t\t\t\tfor (var i = index, pos = startPos; i < strarr.length; pos += strarr[i].length, ++i) {\n\n\t\t\t\t\tvar str = strarr[i];\n\n\t\t\t\t\tif (strarr.length > text.length) {\n\t\t\t\t\t\t// Something went terribly wrong, ABORT, ABORT!\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (str instanceof Token) {\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (greedy && i != strarr.length - 1) {\n\t\t\t\t\t\tpattern.lastIndex = pos;\n\t\t\t\t\t\tvar match = pattern.exec(text);\n\t\t\t\t\t\tif (!match) {\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tvar from = match.index + (lookbehind && match[1] ? match[1].length : 0),\n\t\t\t\t\t\t    to = match.index + match[0].length,\n\t\t\t\t\t\t    k = i,\n\t\t\t\t\t\t    p = pos;\n\n\t\t\t\t\t\tfor (var len = strarr.length; k < len && (p < to || (!strarr[k].type && !strarr[k - 1].greedy)); ++k) {\n\t\t\t\t\t\t\tp += strarr[k].length;\n\t\t\t\t\t\t\t// Move the index i to the element in strarr that is closest to from\n\t\t\t\t\t\t\tif (from >= p) {\n\t\t\t\t\t\t\t\t++i;\n\t\t\t\t\t\t\t\tpos = p;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// If strarr[i] is a Token, then the match starts inside another Token, which is invalid\n\t\t\t\t\t\tif (strarr[i] instanceof Token) {\n\t\t\t\t\t\t\tcontinue;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Number of tokens to delete and replace with the new match\n\t\t\t\t\t\tdelNum = k - i;\n\t\t\t\t\t\tstr = text.slice(pos, p);\n\t\t\t\t\t\tmatch.index -= pos;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tpattern.lastIndex = 0;\n\n\t\t\t\t\t\tvar match = pattern.exec(str),\n\t\t\t\t\t\t\tdelNum = 1;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (!match) {\n\t\t\t\t\t\tif (oneshot) {\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\n\t\t\t\t\tif(lookbehind) {\n\t\t\t\t\t\tlookbehindLength = match[1] ? match[1].length : 0;\n\t\t\t\t\t}\n\n\t\t\t\t\tvar from = match.index + lookbehindLength,\n\t\t\t\t\t    match = match[0].slice(lookbehindLength),\n\t\t\t\t\t    to = from + match.length,\n\t\t\t\t\t    before = str.slice(0, from),\n\t\t\t\t\t    after = str.slice(to);\n\n\t\t\t\t\tvar args = [i, delNum];\n\n\t\t\t\t\tif (before) {\n\t\t\t\t\t\t++i;\n\t\t\t\t\t\tpos += before.length;\n\t\t\t\t\t\targs.push(before);\n\t\t\t\t\t}\n\n\t\t\t\t\tvar wrapped = new Token(token, inside? _.tokenize(match, inside) : match, alias, match, greedy);\n\n\t\t\t\t\targs.push(wrapped);\n\n\t\t\t\t\tif (after) {\n\t\t\t\t\t\targs.push(after);\n\t\t\t\t\t}\n\n\t\t\t\t\tArray.prototype.splice.apply(strarr, args);\n\n\t\t\t\t\tif (delNum != 1)\n\t\t\t\t\t\t_.matchGrammar(text, strarr, grammar, i, pos, true, token + ',' + j);\n\n\t\t\t\t\tif (oneshot)\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t},\n\n\ttokenize: function(text, grammar) {\n\t\tvar strarr = [text];\n\n\t\tvar rest = grammar.rest;\n\n\t\tif (rest) {\n\t\t\tfor (var token in rest) {\n\t\t\t\tgrammar[token] = rest[token];\n\t\t\t}\n\n\t\t\tdelete grammar.rest;\n\t\t}\n\n\t\t_.matchGrammar(text, strarr, grammar, 0, 0, false);\n\n\t\treturn strarr;\n\t},\n\n\thooks: {\n\t\tall: {},\n\n\t\tadd: function (name, callback) {\n\t\t\tvar hooks = _.hooks.all;\n\n\t\t\thooks[name] = hooks[name] || [];\n\n\t\t\thooks[name].push(callback);\n\t\t},\n\n\t\trun: function (name, env) {\n\t\t\tvar callbacks = _.hooks.all[name];\n\n\t\t\tif (!callbacks || !callbacks.length) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfor (var i=0, callback; callback = callbacks[i++];) {\n\t\t\t\tcallback(env);\n\t\t\t}\n\t\t}\n\t},\n\n\tToken: Token\n};\n\n_self.Prism = _;\n\nfunction Token(type, content, alias, matchedStr, greedy) {\n\tthis.type = type;\n\tthis.content = content;\n\tthis.alias = alias;\n\t// Copy of the full string this token was created from\n\tthis.length = (matchedStr || '').length|0;\n\tthis.greedy = !!greedy;\n}\n\nToken.stringify = function(o, language) {\n\tif (typeof o == 'string') {\n\t\treturn o;\n\t}\n\n\tif (Array.isArray(o)) {\n\t\treturn o.map(function(element) {\n\t\t\treturn Token.stringify(element, language);\n\t\t}).join('');\n\t}\n\n\tvar env = {\n\t\ttype: o.type,\n\t\tcontent: Token.stringify(o.content, language),\n\t\ttag: 'span',\n\t\tclasses: ['token', o.type],\n\t\tattributes: {},\n\t\tlanguage: language\n\t};\n\n\tif (o.alias) {\n\t\tvar aliases = Array.isArray(o.alias) ? o.alias : [o.alias];\n\t\tArray.prototype.push.apply(env.classes, aliases);\n\t}\n\n\t_.hooks.run('wrap', env);\n\n\tvar attributes = Object.keys(env.attributes).map(function(name) {\n\t\treturn name + '=\"' + (env.attributes[name] || '').replace(/\"/g, '&quot;') + '\"';\n\t}).join(' ');\n\n\treturn '<' + env.tag + ' class=\"' + env.classes.join(' ') + '\"' + (attributes ? ' ' + attributes : '') + '>' + env.content + '</' + env.tag + '>';\n};\n\nif (!_self.document) {\n\tif (!_self.addEventListener) {\n\t\t// in Node.js\n\t\treturn _;\n\t}\n\n\tif (!_.disableWorkerMessageHandler) {\n\t\t// In worker\n\t\t_self.addEventListener('message', function (evt) {\n\t\t\tvar message = JSON.parse(evt.data),\n\t\t\t\tlang = message.language,\n\t\t\t\tcode = message.code,\n\t\t\t\timmediateClose = message.immediateClose;\n\n\t\t\t_self.postMessage(_.highlight(code, _.languages[lang], lang));\n\t\t\tif (immediateClose) {\n\t\t\t\t_self.close();\n\t\t\t}\n\t\t}, false);\n\t}\n\n\treturn _;\n}\n\n//Get current script and highlight\nvar script = _.util.currentScript();\n\nif (script) {\n\t_.filename = script.src;\n\n\tif (script.hasAttribute('data-manual')) {\n\t\t_.manual = true;\n\t}\n}\n\nif (!_.manual) {\n\tfunction highlightAutomaticallyCallback() {\n\t\tif (!_.manual) {\n\t\t\t_.highlightAll();\n\t\t}\n\t}\n\n\t// If the document state is \"loading\", then we'll use DOMContentLoaded.\n\t// If the document state is \"interactive\" and the prism.js script is deferred, then we'll also use the\n\t// DOMContentLoaded event because there might be some plugins or languages which have also been deferred and they\n\t// might take longer one animation frame to execute which can create a race condition where only some plugins have\n\t// been loaded when Prism.highlightAll() is executed, depending on how fast resources are loaded.\n\t// See https://github.com/PrismJS/prism/issues/2102\n\tvar readyState = document.readyState;\n\tif (readyState === 'loading' || readyState === 'interactive' && script && script.defer) {\n\t\tdocument.addEventListener('DOMContentLoaded', highlightAutomaticallyCallback);\n\t} else {\n\t\tif (window.requestAnimationFrame) {\n\t\t\twindow.requestAnimationFrame(highlightAutomaticallyCallback);\n\t\t} else {\n\t\t\twindow.setTimeout(highlightAutomaticallyCallback, 16);\n\t\t}\n\t}\n}\n\nreturn _;\n\n})(_self);\n\nif (typeof module !== 'undefined' && module.exports) {\n\tmodule.exports = Prism;\n}\n\n// hack for components to work correctly in node.js\nif (typeof global !== 'undefined') {\n\tglobal.Prism = Prism;\n}\n\n\n/* **********************************************\n     Begin prism-markup.js\n********************************************** */\n\nPrism.languages.markup = {\n\t'comment': /<!--[\\s\\S]*?-->/,\n\t'prolog': /<\\?[\\s\\S]+?\\?>/,\n\t'doctype': {\n\t\tpattern: /<!DOCTYPE(?:[^>\"'[\\]]|\"[^\"]*\"|'[^']*')+(?:\\[(?:(?!<!--)[^\"'\\]]|\"[^\"]*\"|'[^']*'|<!--[\\s\\S]*?-->)*\\]\\s*)?>/i,\n\t\tgreedy: true\n\t},\n\t'cdata': /<!\\[CDATA\\[[\\s\\S]*?]]>/i,\n\t'tag': {\n\t\tpattern: /<\\/?(?!\\d)[^\\s>\\/=$<%]+(?:\\s(?:\\s*[^\\s>\\/=]+(?:\\s*=\\s*(?:\"[^\"]*\"|'[^']*'|[^\\s'\">=]+(?=[\\s>]))|(?=[\\s/>])))+)?\\s*\\/?>/i,\n\t\tgreedy: true,\n\t\tinside: {\n\t\t\t'tag': {\n\t\t\t\tpattern: /^<\\/?[^\\s>\\/]+/i,\n\t\t\t\tinside: {\n\t\t\t\t\t'punctuation': /^<\\/?/,\n\t\t\t\t\t'namespace': /^[^\\s>\\/:]+:/\n\t\t\t\t}\n\t\t\t},\n\t\t\t'attr-value': {\n\t\t\t\tpattern: /=\\s*(?:\"[^\"]*\"|'[^']*'|[^\\s'\">=]+)/i,\n\t\t\t\tinside: {\n\t\t\t\t\t'punctuation': [\n\t\t\t\t\t\t/^=/,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tpattern: /^(\\s*)[\"']|[\"']$/,\n\t\t\t\t\t\t\tlookbehind: true\n\t\t\t\t\t\t}\n\t\t\t\t\t]\n\t\t\t\t}\n\t\t\t},\n\t\t\t'punctuation': /\\/?>/,\n\t\t\t'attr-name': {\n\t\t\t\tpattern: /[^\\s>\\/]+/,\n\t\t\t\tinside: {\n\t\t\t\t\t'namespace': /^[^\\s>\\/:]+:/\n\t\t\t\t}\n\t\t\t}\n\n\t\t}\n\t},\n\t'entity': /&#?[\\da-z]{1,8};/i\n};\n\nPrism.languages.markup['tag'].inside['attr-value'].inside['entity'] =\n\tPrism.languages.markup['entity'];\n\n// Plugin to make entity title show the real entity, idea by Roman Komarov\nPrism.hooks.add('wrap', function(env) {\n\n\tif (env.type === 'entity') {\n\t\tenv.attributes['title'] = env.content.replace(/&amp;/, '&');\n\t}\n});\n\nObject.defineProperty(Prism.languages.markup.tag, 'addInlined', {\n\t/**\n\t * Adds an inlined language to markup.\n\t *\n\t * An example of an inlined language is CSS with `<style>` tags.\n\t *\n\t * @param {string} tagName The name of the tag that contains the inlined language. This name will be treated as\n\t * case insensitive.\n\t * @param {string} lang The language key.\n\t * @example\n\t * addInlined('style', 'css');\n\t */\n\tvalue: function addInlined(tagName, lang) {\n\t\tvar includedCdataInside = {};\n\t\tincludedCdataInside['language-' + lang] = {\n\t\t\tpattern: /(^<!\\[CDATA\\[)[\\s\\S]+?(?=\\]\\]>$)/i,\n\t\t\tlookbehind: true,\n\t\t\tinside: Prism.languages[lang]\n\t\t};\n\t\tincludedCdataInside['cdata'] = /^<!\\[CDATA\\[|\\]\\]>$/i;\n\n\t\tvar inside = {\n\t\t\t'included-cdata': {\n\t\t\t\tpattern: /<!\\[CDATA\\[[\\s\\S]*?\\]\\]>/i,\n\t\t\t\tinside: includedCdataInside\n\t\t\t}\n\t\t};\n\t\tinside['language-' + lang] = {\n\t\t\tpattern: /[\\s\\S]+/,\n\t\t\tinside: Prism.languages[lang]\n\t\t};\n\n\t\tvar def = {};\n\t\tdef[tagName] = {\n\t\t\tpattern: RegExp(/(<__[\\s\\S]*?>)(?:<!\\[CDATA\\[[\\s\\S]*?\\]\\]>\\s*|[\\s\\S])*?(?=<\\/__>)/.source.replace(/__/g, tagName), 'i'),\n\t\t\tlookbehind: true,\n\t\t\tgreedy: true,\n\t\t\tinside: inside\n\t\t};\n\n\t\tPrism.languages.insertBefore('markup', 'cdata', def);\n\t}\n});\n\nPrism.languages.xml = Prism.languages.extend('markup', {});\nPrism.languages.html = Prism.languages.markup;\nPrism.languages.mathml = Prism.languages.markup;\nPrism.languages.svg = Prism.languages.markup;\n\n\n/* **********************************************\n     Begin prism-css.js\n********************************************** */\n\n(function (Prism) {\n\n\tvar string = /(\"|')(?:\\\\(?:\\r\\n|[\\s\\S])|(?!\\1)[^\\\\\\r\\n])*\\1/;\n\n\tPrism.languages.css = {\n\t\t'comment': /\\/\\*[\\s\\S]*?\\*\\//,\n\t\t'atrule': {\n\t\t\tpattern: /@[\\w-]+[\\s\\S]*?(?:;|(?=\\s*\\{))/,\n\t\t\tinside: {\n\t\t\t\t'rule': /@[\\w-]+/\n\t\t\t\t// See rest below\n\t\t\t}\n\t\t},\n\t\t'url': {\n\t\t\tpattern: RegExp('url\\\\((?:' + string.source + '|[^\\n\\r()]*)\\\\)', 'i'),\n\t\t\tinside: {\n\t\t\t\t'function': /^url/i,\n\t\t\t\t'punctuation': /^\\(|\\)$/\n\t\t\t}\n\t\t},\n\t\t'selector': RegExp('[^{}\\\\s](?:[^{};\"\\']|' + string.source + ')*?(?=\\\\s*\\\\{)'),\n\t\t'string': {\n\t\t\tpattern: string,\n\t\t\tgreedy: true\n\t\t},\n\t\t'property': /[-_a-z\\xA0-\\uFFFF][-\\w\\xA0-\\uFFFF]*(?=\\s*:)/i,\n\t\t'important': /!important\\b/i,\n\t\t'function': /[-a-z0-9]+(?=\\()/i,\n\t\t'punctuation': /[(){};:,]/\n\t};\n\n\tPrism.languages.css['atrule'].inside.rest = Prism.languages.css;\n\n\tvar markup = Prism.languages.markup;\n\tif (markup) {\n\t\tmarkup.tag.addInlined('style', 'css');\n\n\t\tPrism.languages.insertBefore('inside', 'attr-value', {\n\t\t\t'style-attr': {\n\t\t\t\tpattern: /\\s*style=(\"|')(?:\\\\[\\s\\S]|(?!\\1)[^\\\\])*\\1/i,\n\t\t\t\tinside: {\n\t\t\t\t\t'attr-name': {\n\t\t\t\t\t\tpattern: /^\\s*style/i,\n\t\t\t\t\t\tinside: markup.tag.inside\n\t\t\t\t\t},\n\t\t\t\t\t'punctuation': /^\\s*=\\s*['\"]|['\"]\\s*$/,\n\t\t\t\t\t'attr-value': {\n\t\t\t\t\t\tpattern: /.+/i,\n\t\t\t\t\t\tinside: Prism.languages.css\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\talias: 'language-css'\n\t\t\t}\n\t\t}, markup.tag);\n\t}\n\n}(Prism));\n\n\n/* **********************************************\n     Begin prism-clike.js\n********************************************** */\n\nPrism.languages.clike = {\n\t'comment': [\n\t\t{\n\t\t\tpattern: /(^|[^\\\\])\\/\\*[\\s\\S]*?(?:\\*\\/|$)/,\n\t\t\tlookbehind: true\n\t\t},\n\t\t{\n\t\t\tpattern: /(^|[^\\\\:])\\/\\/.*/,\n\t\t\tlookbehind: true,\n\t\t\tgreedy: true\n\t\t}\n\t],\n\t'string': {\n\t\tpattern: /([\"'])(?:\\\\(?:\\r\\n|[\\s\\S])|(?!\\1)[^\\\\\\r\\n])*\\1/,\n\t\tgreedy: true\n\t},\n\t'class-name': {\n\t\tpattern: /(\\b(?:class|interface|extends|implements|trait|instanceof|new)\\s+|\\bcatch\\s+\\()[\\w.\\\\]+/i,\n\t\tlookbehind: true,\n\t\tinside: {\n\t\t\t'punctuation': /[.\\\\]/\n\t\t}\n\t},\n\t'keyword': /\\b(?:if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\\b/,\n\t'boolean': /\\b(?:true|false)\\b/,\n\t'function': /\\w+(?=\\()/,\n\t'number': /\\b0x[\\da-f]+\\b|(?:\\b\\d+\\.?\\d*|\\B\\.\\d+)(?:e[+-]?\\d+)?/i,\n\t'operator': /[<>]=?|[!=]=?=?|--?|\\+\\+?|&&?|\\|\\|?|[?*/~^%]/,\n\t'punctuation': /[{}[\\];(),.:]/\n};\n\n\n/* **********************************************\n     Begin prism-javascript.js\n********************************************** */\n\nPrism.languages.javascript = Prism.languages.extend('clike', {\n\t'class-name': [\n\t\tPrism.languages.clike['class-name'],\n\t\t{\n\t\t\tpattern: /(^|[^$\\w\\xA0-\\uFFFF])[_$A-Z\\xA0-\\uFFFF][$\\w\\xA0-\\uFFFF]*(?=\\.(?:prototype|constructor))/,\n\t\t\tlookbehind: true\n\t\t}\n\t],\n\t'keyword': [\n\t\t{\n\t\t\tpattern: /((?:^|})\\s*)(?:catch|finally)\\b/,\n\t\t\tlookbehind: true\n\t\t},\n\t\t{\n\t\t\tpattern: /(^|[^.])\\b(?:as|async(?=\\s*(?:function\\b|\\(|[$\\w\\xA0-\\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\\b/,\n\t\t\tlookbehind: true\n\t\t},\n\t],\n\t'number': /\\b(?:(?:0[xX](?:[\\dA-Fa-f](?:_[\\dA-Fa-f])?)+|0[bB](?:[01](?:_[01])?)+|0[oO](?:[0-7](?:_[0-7])?)+)n?|(?:\\d(?:_\\d)?)+n|NaN|Infinity)\\b|(?:\\b(?:\\d(?:_\\d)?)+\\.?(?:\\d(?:_\\d)?)*|\\B\\.(?:\\d(?:_\\d)?)+)(?:[Ee][+-]?(?:\\d(?:_\\d)?)+)?/,\n\t// Allow for all non-ASCII characters (See http://stackoverflow.com/a/2008444)\n\t'function': /#?[_$a-zA-Z\\xA0-\\uFFFF][$\\w\\xA0-\\uFFFF]*(?=\\s*(?:\\.\\s*(?:apply|bind|call)\\s*)?\\()/,\n\t'operator': /--|\\+\\+|\\*\\*=?|=>|&&|\\|\\||[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\\.{3}|\\?[.?]?|[~:]/\n});\n\nPrism.languages.javascript['class-name'][0].pattern = /(\\b(?:class|interface|extends|implements|instanceof|new)\\s+)[\\w.\\\\]+/;\n\nPrism.languages.insertBefore('javascript', 'keyword', {\n\t'regex': {\n\t\tpattern: /((?:^|[^$\\w\\xA0-\\uFFFF.\"'\\])\\s])\\s*)\\/(?:\\[(?:[^\\]\\\\\\r\\n]|\\\\.)*]|\\\\.|[^/\\\\\\[\\r\\n])+\\/[gimyus]{0,6}(?=\\s*(?:$|[\\r\\n,.;})\\]]))/,\n\t\tlookbehind: true,\n\t\tgreedy: true\n\t},\n\t// This must be declared before keyword because we use \"function\" inside the look-forward\n\t'function-variable': {\n\t\tpattern: /#?[_$a-zA-Z\\xA0-\\uFFFF][$\\w\\xA0-\\uFFFF]*(?=\\s*[=:]\\s*(?:async\\s*)?(?:\\bfunction\\b|(?:\\((?:[^()]|\\([^()]*\\))*\\)|[_$a-zA-Z\\xA0-\\uFFFF][$\\w\\xA0-\\uFFFF]*)\\s*=>))/,\n\t\talias: 'function'\n\t},\n\t'parameter': [\n\t\t{\n\t\t\tpattern: /(function(?:\\s+[_$A-Za-z\\xA0-\\uFFFF][$\\w\\xA0-\\uFFFF]*)?\\s*\\(\\s*)(?!\\s)(?:[^()]|\\([^()]*\\))+?(?=\\s*\\))/,\n\t\t\tlookbehind: true,\n\t\t\tinside: Prism.languages.javascript\n\t\t},\n\t\t{\n\t\t\tpattern: /[_$a-z\\xA0-\\uFFFF][$\\w\\xA0-\\uFFFF]*(?=\\s*=>)/i,\n\t\t\tinside: Prism.languages.javascript\n\t\t},\n\t\t{\n\t\t\tpattern: /(\\(\\s*)(?!\\s)(?:[^()]|\\([^()]*\\))+?(?=\\s*\\)\\s*=>)/,\n\t\t\tlookbehind: true,\n\t\t\tinside: Prism.languages.javascript\n\t\t},\n\t\t{\n\t\t\tpattern: /((?:\\b|\\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\\w\\xA0-\\uFFFF]))(?:[_$A-Za-z\\xA0-\\uFFFF][$\\w\\xA0-\\uFFFF]*\\s*)\\(\\s*)(?!\\s)(?:[^()]|\\([^()]*\\))+?(?=\\s*\\)\\s*\\{)/,\n\t\t\tlookbehind: true,\n\t\t\tinside: Prism.languages.javascript\n\t\t}\n\t],\n\t'constant': /\\b[A-Z](?:[A-Z_]|\\dx?)*\\b/\n});\n\nPrism.languages.insertBefore('javascript', 'string', {\n\t'template-string': {\n\t\tpattern: /`(?:\\\\[\\s\\S]|\\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}|(?!\\${)[^\\\\`])*`/,\n\t\tgreedy: true,\n\t\tinside: {\n\t\t\t'template-punctuation': {\n\t\t\t\tpattern: /^`|`$/,\n\t\t\t\talias: 'string'\n\t\t\t},\n\t\t\t'interpolation': {\n\t\t\t\tpattern: /((?:^|[^\\\\])(?:\\\\{2})*)\\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}/,\n\t\t\t\tlookbehind: true,\n\t\t\t\tinside: {\n\t\t\t\t\t'interpolation-punctuation': {\n\t\t\t\t\t\tpattern: /^\\${|}$/,\n\t\t\t\t\t\talias: 'punctuation'\n\t\t\t\t\t},\n\t\t\t\t\trest: Prism.languages.javascript\n\t\t\t\t}\n\t\t\t},\n\t\t\t'string': /[\\s\\S]+/\n\t\t}\n\t}\n});\n\nif (Prism.languages.markup) {\n\tPrism.languages.markup.tag.addInlined('script', 'javascript');\n}\n\nPrism.languages.js = Prism.languages.javascript;\n\n\n/* **********************************************\n     Begin prism-file-highlight.js\n********************************************** */\n\n(function () {\n\tif (typeof self === 'undefined' || !self.Prism || !self.document || !document.querySelector) {\n\t\treturn;\n\t}\n\n\t/**\n\t * @param {Element} [container=document]\n\t */\n\tself.Prism.fileHighlight = function(container) {\n\t\tcontainer = container || document;\n\n\t\tvar Extensions = {\n\t\t\t'js': 'javascript',\n\t\t\t'py': 'python',\n\t\t\t'rb': 'ruby',\n\t\t\t'ps1': 'powershell',\n\t\t\t'psm1': 'powershell',\n\t\t\t'sh': 'bash',\n\t\t\t'bat': 'batch',\n\t\t\t'h': 'c',\n\t\t\t'tex': 'latex'\n\t\t};\n\n\t\tArray.prototype.slice.call(container.querySelectorAll('pre[data-src]')).forEach(function (pre) {\n\t\t\t// ignore if already loaded\n\t\t\tif (pre.hasAttribute('data-src-loaded')) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// load current\n\t\t\tvar src = pre.getAttribute('data-src');\n\n\t\t\tvar language, parent = pre;\n\t\t\tvar lang = /\\blang(?:uage)?-([\\w-]+)\\b/i;\n\t\t\twhile (parent && !lang.test(parent.className)) {\n\t\t\t\tparent = parent.parentNode;\n\t\t\t}\n\n\t\t\tif (parent) {\n\t\t\t\tlanguage = (pre.className.match(lang) || [, ''])[1];\n\t\t\t}\n\n\t\t\tif (!language) {\n\t\t\t\tvar extension = (src.match(/\\.(\\w+)$/) || [, ''])[1];\n\t\t\t\tlanguage = Extensions[extension] || extension;\n\t\t\t}\n\n\t\t\tvar code = document.createElement('code');\n\t\t\tcode.className = 'language-' + language;\n\n\t\t\tpre.textContent = '';\n\n\t\t\tcode.textContent = 'Loading…';\n\n\t\t\tpre.appendChild(code);\n\n\t\t\tvar xhr = new XMLHttpRequest();\n\n\t\t\txhr.open('GET', src, true);\n\n\t\t\txhr.onreadystatechange = function () {\n\t\t\t\tif (xhr.readyState == 4) {\n\n\t\t\t\t\tif (xhr.status < 400 && xhr.responseText) {\n\t\t\t\t\t\tcode.textContent = xhr.responseText;\n\n\t\t\t\t\t\tPrism.highlightElement(code);\n\t\t\t\t\t\t// mark as loaded\n\t\t\t\t\t\tpre.setAttribute('data-src-loaded', '');\n\t\t\t\t\t}\n\t\t\t\t\telse if (xhr.status >= 400) {\n\t\t\t\t\t\tcode.textContent = '✖ Error ' + xhr.status + ' while fetching file: ' + xhr.statusText;\n\t\t\t\t\t}\n\t\t\t\t\telse {\n\t\t\t\t\t\tcode.textContent = '✖ Error: File does not exist or is empty';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t};\n\n\t\t\txhr.send(null);\n\t\t});\n\t};\n\n\tdocument.addEventListener('DOMContentLoaded', function () {\n\t\t// execute inside handler, for dropping Event as argument\n\t\tself.Prism.fileHighlight();\n\t});\n\n})();\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_accordion.scss",
    "content": ".accordion {\n  .accordion-button {\n    margin: 0 auto;\n    font-size: inherit !important;\n  }\n\n  div {\n    button[aria-expanded='true'] {\n      .collapse-close {\n        display: none;\n      }\n\n      .collapse-open {\n        display: block;\n      }\n    }\n\n    button[aria-expanded='false'] {\n      .collapse-open {\n        display: none;\n      }\n\n      .collapse-close {\n        display: block;\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_alert.scss",
    "content": "@each $state, $value in $theme-gradient-colors {\n  .alert-#{$state} {\n    @include gradient-directional(nth($value, 1) 0%, nth($value, -1) 100%, $deg: 195deg);\n  }\n}\n\n.btn-close {\n  &:focus {\n    box-shadow: none;\n  }\n}\n\n.alert-dismissible {\n  .btn-close {\n    background-image: none;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_avatars.scss",
    "content": "//\n// Avatar\n//\n\n// General styles\n\n.avatar {\n\tcolor: $white;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-size: $avatar-font-size;\n\tborder-radius: $border-radius-pill;\n\theight: $avatar-height;\n\twidth: $avatar-width;\n  transition: all .2s ease-in-out;\n\n    img {\n    \twidth: 100%;\n    }\n\n\t&.rounded-circle {\n\t\timg {\n\t\t\t@extend .rounded-circle;\n\t\t}\n\t}\n\n    + .avatar-content {\n    \tdisplay: inline-block;\n    \tmargin-left: $avatar-content-margin;\n    }\n\n\n  &.avatar-raised {\n    margin-top: -($avatar-height / 2);\n  }\n\n  &.avatar-scale-up:hover {\n    transform: scale(1.2);\n\n  }\n}\n\n// Style for the Testimonials Carousel\n.active {\n  .avatar.avatar-scale-up {\n    transform: scale(1.2);\n  }\n}\n\n\n// Avatar size variations\n\n.avatar-xxl {\n\twidth: $avatar-xxl-width !important;\n\theight: $avatar-xxl-height !important;\n\n  &.avatar-raised {\n    margin-top: -($avatar-xxl-height / 2);\n  }\n}\n\n.avatar-xl {\n\twidth: $avatar-xl-width !important;\n\theight: $avatar-xl-height !important;\n\n  &.avatar-raised {\n    margin-top: -($avatar-xl-height / 2);\n  }\n}\n\n.avatar-lg {\n\twidth: $avatar-lg-width !important;\n\theight: $avatar-lg-height !important;\n\tfont-size: $font-size-sm;\n\n  &.avatar-raised {\n    margin-top: -($avatar-lg-height / 2);\n  }\n}\n\n.avatar-sm {\n\twidth: $avatar-sm-width !important;\n\theight: $avatar-sm-height !important;\n\tfont-size: $font-size-sm;\n\n  &.avatar-raised {\n    margin-top: -($avatar-sm-height / 2);\n  }\n}\n\n.avatar-xs {\n\twidth: $avatar-xs-width !important;\n\theight: $avatar-xs-height !important;\n\tfont-size: $font-size-xs;\n\n  &.avatar-raised {\n    margin-top: -($avatar-xs-height / 2);\n  }\n}\n\n//\n// Avatar group\n//\n\n// General styles\n\n.avatar-group {\n\t.avatar {\n\t\tposition: relative;\n\t\tz-index: $avatar-group-zindex;\n\t\tborder: $avatar-group-border solid $card-bg;\n\n\t\t&:hover {\n\t\t\tz-index: $avatar-group-zindex-hover;\n\t\t}\n\t}\n\n\t.avatar + .avatar {\n\t\tmargin-left: $avatar-group-double;\n\n\t}\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_backgrounds.scss",
    "content": ".bg-primary-soft{\n  background: rgba($primary-gradient, .03);\n}\n\n.bg-info-soft{\n  background: rgba($info-gradient, .03);\n}\n\n.bg-success-soft{\n  background: rgba($success-gradient, .03);\n}\n\n.bg-warning-soft{\n  background: rgba($warning-gradient, .03);\n}\n\n.bg-danger-soft{\n  background: rgba($danger-gradient, .03);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_badge.scss",
    "content": "@each $prop, $value in $theme-colors {\n  .badge.bg-#{$prop} {\n    background: $value;\n  }\n}\n.badge {\n  text-transform: uppercase;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_breadcrumbs.scss",
    "content": "//\n// Breadcrumb\n//\n\n.breadcrumb-item {\n    font-size: $font-size-sm;\n    &.text-white{\n      &::before {\n          color: $white;\n      }\n    }\n\n}\n\n.breadcrumb-dark {\n    background-color: $breadcrumb-dark-bg;\n\n    .breadcrumb-item {\n        font-weight: 600;\n\n        a {\n            color: $breadcrumb-dark-color;\n\n            &:hover {\n                color: $breadcrumb-dark-hover-color;\n            }\n        }\n\n        + .breadcrumb-item {\n            &::before {\n                color: $breadcrumb-dark-divider-color;\n            }\n        }\n\n        &.active {\n            color: $breadcrumb-dark-active-color;\n        }\n    }\n}\n\n\n// Links\n\n.breadcrumb-links {\n    padding: 0;\n    margin: 0;\n    background: transparent;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_buttons.scss",
    "content": ".btn {\n  margin-bottom: $btn-margin-bottom;\n  letter-spacing: $btn-letter-spacing;\n  text-transform: uppercase;\n  background-size: $btn-background-size;\n  background-position-x: $btn-background-position-x;\n  position: relative;\n  overflow: hidden;\n\n  &:not([class*=\"btn-outline-\"]) {\n    border: 0;\n  }\n\n  &:active,\n  &:active:focus,\n  &:active:hover {\n    box-shadow: $btn-hover-box-shadow;\n    transform: $btn-active-hover-transform;\n    opacity: $btn-hover-opacity;\n  }\n\n  &.bg-white {\n    @include hover {\n      color: $body-color;\n    }\n  }\n\n  &.btn-link{\n    box-shadow: none;\n    font-weight: $btn-font-weight;\n\n    &:hover,\n    &:focus{\n      box-shadow: none;\n    }\n  }\n  &.btn-round {\n    border-radius: $btn-border-rounded;\n  }\n  // Button Just Icon\n\n  &.btn-icon-only {\n    width: $btn-just-icon-width;\n    height: $btn-just-icon-height;\n    padding: $btn-just-icon-padding-y $btn-just-icon-padding-x;\n  }\n\n  // Button Icon Sizes\n\n  &.btn-sm {\n    &.btn-icon-only {\n      width: $btn-just-icon-width-sm;\n      height: $btn-just-icon-height-sm;\n      padding: $btn-just-icon-padding-y-sm $btn-just-icon-padding-x-sm;\n    }\n\n    i {\n      font-size: $btn-just-icon-sm-font-size;\n    }\n  }\n\n  &.btn-lg {\n    &.btn-icon-only {\n      width: $btn-just-icon-width-lg;\n      height: $btn-just-icon-height-lg;\n      padding: $btn-just-icon-padding-y-lg $btn-just-icon-padding-x-lg;\n    }\n\n    i {\n      font-size: $btn-just-icon-lg-font-size;\n      position: $btn-just-icon-lg-position;\n      top: $btn-just-icon-lg-top;\n    }\n  }\n\n  &.btn-rounded {\n    border-radius: $btn-border-rounded;\n  }\n\n  .material-icons {\n    vertical-align: middle;\n    margin-top: $btn-material-icon-margin;\n    margin-bottom: $btn-material-icon-margin;\n    font-size: $btn-material-icon-font-size;\n    display: $btn-material-icon-display;\n    top: $btn-material-icon-top;\n  }\n}\n\n.btn-check{\n  &:checked{\n    +.btn{\n      svg{\n        .color-background{\n          fill: $white;\n        }\n      }\n      &:hover{\n        svg{\n          .color-background{\n            fill: $dark;\n          }\n        }\n      }\n    }\n  }\n}\n\n.icon-move-right {\n  i {\n    transition: $btn-icon-transition;\n  }\n  &:hover,\n  &:focus {\n    i {\n      transform: $btn-icon-transform-right;\n    }\n  }\n}\n\n.icon-move-left{\n  i {\n    transition: $btn-icon-transition;\n  }\n  &:hover,\n  &:focus {\n    i {\n      transform: $btn-icon-transform-left;\n    }\n  }\n}\n\n@each $color, $value in $theme-colors {\n  .btn-#{$color},\n  .btn.bg-gradient-#{$color} {\n    @include colored-shadows($value);\n\n    @include hover {\n      background-color: $value;\n      border-color: $value;\n\n      @include colored-shadows-hover($value);\n    }\n\n    .btn.bg-outline-#{$color} {\n      border: $border-width solid $value;\n    }\n\n    &:not(:disabled):not(.disabled).active,\n    &:not(:disabled):not(.disabled):active,\n    .show > &.dropdown-toggle {\n      color: color-yiq($value);\n      background-color: $value;\n    }\n\n    @if $value != $white and $value != $light {\n      &.focus,\n      &:focus {\n        color: $white;\n      }\n    }\n  }\n\n  .btn-outline-#{$color} {\n    box-shadow: none;\n    @include hover {\n      &:not(.active){\n        background-color: transparent;\n        opacity: .75;\n        box-shadow: none;\n        color: $value;\n      }\n    }\n  }\n}\n\n.btn-outline-white{\n  border-color: rgba($white, .75);\n  background: rgba($white, .1);\n}\n\n@each $color, $value in $btn-font-colors {\n  .btn-#{$color},\n  .btn.bg-gradient-#{$color} {\n    color: $value;\n    @include hover {\n      color: $value;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_cards-extend.scss",
    "content": "@import 'cards/card-blog';\n@import 'cards/card-horizontal';\n@import 'cards/card-profile';\n@import 'cards/card-pricing';\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_cards.scss",
    "content": ".card {\n  box-shadow: $card-box-shadow;\n\n  &[data-animation=\"true\"] {\n    .card-header {\n      @include transform-translate-y(0);\n      -webkit-transition: $header-data-animation-transition;\n      -moz-transition: $header-data-animation-transition;\n      -o-transition: $header-data-animation-transition;\n      -ms-transition: $header-data-animation-transition;\n      transition: $header-data-animation-transition;\n    }\n  }\n\n  @include hover {\n    &[data-animation=\"true\"] {\n      .card-header {\n        @include transform-translate-y(-50px);\n      }\n    }\n  }\n\n  .card-header {\n    padding: $card-header-padding;\n  }\n\n  .card-body {\n    font-family: $font-family-sans-serif;\n    padding: $card-body-padding;\n  }\n\n  &.card-plain {\n    background-color: $card-plain-bg-color;\n    box-shadow: $card-plain-box-shadow;\n  }\n\n  .card-footer {\n    padding: $card-footer-padding;\n    background-color: transparent;\n  }\n}\n\n.author {\n  display: $card-author-display;\n\n  .name > span {\n    line-height: $card-author-name-line-height;\n    font-weight: $font-weight-bold;\n    font-size: $font-size-sm;\n    color: $card-author-name-color;\n  }\n\n  .stats {\n    font-size: $font-size-sm;\n    font-weight: $font-weight-normal;\n  }\n}\n\n@import 'cards/card-background';\n@import 'cards/card-rotate';\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_components.scss",
    "content": "// Badges\n@import \"badges/badge\";\n@import \"badges/badge-circle\";\n@import \"badges/badge-dot\";\n@import \"badges/badge-floating\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_dark-version.scss",
    "content": ".dark-version {\n  background-color: $dark-version-bg-color !important;\n\n  .main-content {\n    background-color: $dark-version-bg-color !important;\n  }\n\n  .sidenav {\n    background: $dark-version-sidenav-bg-color !important;\n\n    &.bg-transparent {\n      background: transparent !important;\n\n      .navbar-nav {\n        .nav-link {\n          color: $white !important;\n        }\n      }\n      .nav {\n        .nav-link {\n          color: $white !important;\n        }\n      }\n    }\n\n    &.bg-white {\n      background: $white !important;\n\n      .navbar-nav {\n        .nav-link {\n          &.active:after {\n            color: $dark-version-caret-sidebar-color;\n          }\n        }\n      }\n      .collapse {\n        .nav-item {\n          .nav-link:not(.active) {\n            i {\n              color: $dark !important;\n            }\n          }\n          h6 {\n            color: $dark !important;\n          }\n        }\n      }\n    }\n  \n    .collapse {\n      .nav-item {\n        .nav-link {\n          i {\n            color: $white !important;\n          }\n        }\n      }\n    }\n  }\n\n  .fixed-plugin {\n    .btn {\n      &.bg-gradient-dark,\n      &.btn-outline-dark {\n        color: $white !important;\n        border: 1px solid $white !important;\n      }\n      &.active {\n        background: $white !important;\n        color: $h-color !important;\n      }\n    }\n  }\n\n  .bg-gradient-dark {\n    background-image: linear-gradient(195deg, $dark-gradient-dark, $dark-gradient-state-dark);\n  }\n\n  .card,\n  .swal2-popup,\n  .dropdown .dropdown-menu,\n  .kanban-board {\n    background: $dark-version-card-bg-color;\n    box-shadow: $dark-version-card-box-shadow;\n\n    .card-header {\n      background: transparent;\n    }\n\n    p {\n      color: $white !important;\n      opacity: .6;\n    }\n  }\n\n  .kanban-item {\n    background: transparent !important;\n    border: 1px solid;\n  }\n\n  .swal2-html-container {\n    color: $white !important;\n    opacity: .6;\n  }\n\n  h1, .h1,\n  h2, .h2,\n  h3, .h3,\n  h4, .h4,\n  h5, .h5,\n  h6, .h6,\n  a:not(.dropdown-item):not(.choices__item):not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out):not(.btn):not(.nav-link):not(.fixed-plugin-button),\n  .table thead tr th,\n  .kanban-title-board {\n    color: $white !important;\n  }\n\n  .input-group {\n    &.input-group-dynamic,\n    &.input-group-static {\n      .form-control {\n        background-image: $dark-version-input-bg-image !important;\n        background-size: 0 100%, 100% 100%;\n        &:focus {\n          background-size: 100% 100%, 100% 100%;\n        }\n      }\n    }\n\n    &.input-group-outline {\n      .form-control {\n        border-color: $dark-version-border-color !important;\n      }\n    }\n\n    .is-valid,\n    .is-invalid {\n      border-color: $dark-version-border-color !important;\n    }\n  }\n\n  .accordion {\n    .accordion-button {\n      border-color: $dark-version-border-color !important;\n      color: $white;\n      opacity: .8;\n    }\n  }\n\n  .table > :not(caption) > * > * {\n    border-color: $dark-version-border-color !important;\n    color: $dark-version-table-color !important;\n  }\n\n  label {\n    color: $dark-version-body-color !important;\n  }\n\n  .list-group-item,\n  .multisteps-form__panel {\n    background-color: transparent !important;\n  }\n\n  .nav {\n    &.bg-white {\n      background-color: $dark-version-card-bg-color !important;\n      box-shadow: $dark-version-card-box-shadow;\n    }\n\n    .nav-link[data-scroll]:hover {\n      color: $h-color !important;\n    }\n  }\n\n  .toast {\n    background-color: $dark-version-card-bg-color !important;\n    box-shadow: $dark-version-card-box-shadow;\n\n    .toast-header {\n      background: transparent;\n    }\n\n    span {\n      color: $white;\n    }\n\n    p {\n      color: $white !important;\n      opacity: .6;\n    }\n  }\n\n  .choices {\n    .choices__input {\n      background-color: transparent !important;\n      border-bottom: 1px solid $dark-version-border-color;\n      color: $white;\n    }\n    .choices__list.choices__list--dropdown {\n      background: $dark-version-card-bg-color;\n      box-shadow: $dark-version-card-box-shadow;\n    }\n  }\n\n  // Fullcalendar changes\n  .fc-theme-standard td,\n  .fc-theme-standard th {\n    border-color: $fc-theme-standard-dark-border-color;\n  }\n\n\n  // Datatable changes\n  .dataTable-sorter::after{\n    border-bottom-color: $white;\n  }\n\n  .dataTable-sorter::before{\n    border-top-color: $white;\n  }\n\n  // Quill changes\n  .ql-snow .ql-stroke {\n    stroke: $light;\n  }\n\n  .ql-snow .ql-fill, .ql-snow .ql-stroke.ql-fill{\n    fill: $light;\n  }\n\n  .ql-toolbar.ql-snow .ql-picker-label{\n    color: $light;\n  }\n\n}\n\nbody.dark-version {\n  color: $dark-version-body-color !important;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_dropdown-extend.scss",
    "content": "// MultiLevel Dropdown Style\n\n.dropdown-menu li {\n  position: relative;\n}\n\n// End MultiLevel Dropdown Style\n\n.dropdown-image {\n  background-size: cover;\n}\n\n@include media-breakpoint-up(lg) {\n  .dropdown-xl {\n    min-width: $dropdown-xl-min-width;\n  }\n\n  .dropdown-lg {\n    min-width: $dropdown-lg-min-width;\n  }\n\n  .dropdown-md {\n    min-width: $dropdown-md-min-width;\n  }\n}\n\n@include media-breakpoint-down(xl) {\n .dropdown-lg-responsive {\n   min-width: $dropdown-lg-width-responsive;\n }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_dropdown.scss",
    "content": "@include media-breakpoint-up(lg) {\n  .dropdown,\n  .dropup,\n  .dropstart,\n  .dropend {\n    .dropdown-menu {\n      box-shadow: $dropdown-box-shadow;\n      transition: $dropdown-transition;\n      cursor: pointer;\n    }\n\n    .dropdown-toggle {\n      &:after{\n        content: \"\\f107\";\n        font: normal normal normal 14px/1 FontAwesome;\n        border: none;\n        vertical-align: middle;\n        font-weight: $font-weight-bold;\n      }\n      &.show{\n        &:after{\n          transform: $dropdown-toggle-arrow-transform;\n        }\n      }\n      &:after{\n         transition: $dropdown-toggle-arrow-transition;\n      }\n    }\n  }\n\n  .dropdown {\n    &.dropdown-hover .dropdown-menu,\n    .dropdown-menu {\n      display: block;\n      position: absolute;\n      opacity: 0;\n      transform-origin: $dropdown-transform-origin;\n      inset: 0px auto auto 0px;\n      margin-top: $dropdown-mt !important;\n      pointer-events: none;\n      transform: $dropdown-transform;\n      -webkit-backface-visibility: hidden;\n      backface-visibility: hidden;\n      will-change: transform,box-shadow;\n\n      .dropdown {\n        &.dropdown-hover .dropdown-menu,\n        .dropdown-menu {\n          margin-top: 0 !important;\n        }\n      }\n    }\n\n    &.dropdown-hover:hover > .dropdown-menu,\n    .dropdown-menu.show {\n      opacity: 1;\n      pointer-events: auto;\n      visibility: visible;\n      transform: $dropdown-transform-show;\n    }\n\n    &.dropdown-hover:hover > .dropdown-menu:before,\n    .dropdown-menu.show:before {\n      top: $dropdown-hover-arrow-active-top;\n    }\n\n    &.dropdown-hover {\n      &:after {\n        content: '';\n        position: absolute;\n        left: 0;\n        bottom: $dropdown-hover-after-bottom-pos;\n        width: 100%;\n        height: 100%;\n      }\n    }\n\n    &:not(.dropdown-hover) .dropdown-menu.show {\n      margin-top: $dropdown-mt !important;\n    }\n\n    .dropdown-menu {\n      &:before {\n        font-family: \"FontAwesome\";\n        content: \"\\f0d8\";\n        position: absolute;\n        top: 0;\n        left: $dropdown-animation-arrow-left-position;\n        right: auto;\n        font-size: $dropdown-animation-arrow-font-size;\n        color: $white;\n        transition: $dropdown-animation-arrow-transition;\n      }\n    }\n\n    .dropdown-item .arrow {\n      transform: $dropdown-subitem-arrow-rotate;\n    }\n  }\n\n  .dropdown-item {\n    transition: background-color $dropdown-transition-time, color $dropdown-transition-time;\n  }\n}\n\n@include media-breakpoint-down(lg) {\n  .navbar-toggler + .navbar-collapse {\n    .dropdown:not(.nav-item) {\n      .dropdown-menu {\n        display: block;\n        opacity: 0;\n        top: 0;\n        transform-origin: $dropdown-transform-origin;\n        pointer-events: none;\n        transform: $dropdown-transform;\n        transition: $dropdown-transition;\n        -webkit-backface-visibility: hidden;\n        backface-visibility: hidden;\n        will-change: transform,box-shadow;\n        box-shadow: $dropdown-box-shadow;\n\n        &:before {\n          font-family: \"FontAwesome\";\n          content: \"\\f0d8\";\n          position: absolute;\n          top: 0;\n          left: $dropdown-animation-arrow-left-position;\n          right: auto;\n          font-size: $dropdown-animation-arrow-font-size;\n          color: $white;\n          transition: $dropdown-animation-arrow-transition;\n        }\n      }\n\n      &:not(.dropdown-hover) .dropdown-menu {\n        margin-top: $dropdown-mt !important;\n      }\n\n      .dropdown-menu.show {\n        opacity: 1;\n        pointer-events: auto;\n        visibility: visible;\n        transform: $dropdown-transform-show;\n\n        &:before {\n          top: $dropdown-hover-arrow-active-top;\n        }\n      }\n    }\n    .dropdown.nav-item .dropdown-menu {\n      background-color: transparent;\n      overflow: scroll;\n      position: relative;\n    }\n  }\n\n  .dropdown {\n    .dropdown-menu {\n      opacity: 0;\n      top: 0;\n      transform-origin: $dropdown-transform-origin;\n      pointer-events: none;\n      transform: $dropdown-multilevel-transform;\n      transition: $dropdown-transition;\n      -webkit-backface-visibility: hidden;\n      backface-visibility: hidden;\n      will-change: transform,box-shadow;\n      box-shadow: $dropdown-box-shadow;\n\n      &:before {\n        font-family: \"FontAwesome\";\n        content: \"\\f0d8\";\n        position: absolute;\n        top: 0;\n        left: $dropdown-animation-arrow-left-position;\n        right: auto;\n        font-size: $dropdown-animation-arrow-font-size;\n        color: $white;\n        transition: $dropdown-animation-arrow-transition;\n      }\n    }\n    &:not(.dropdown-hover) .dropdown-menu {\n      margin-top: $dropdown-mt !important;\n    }\n\n    .dropdown-menu.show {\n      opacity: 1;\n      pointer-events: auto;\n      visibility: visible;\n      transform: $dropdown-multilevel-transform-show;\n\n      &:before {\n        top: $dropdown-hover-arrow-active-top;\n      }\n    }\n\n    &.nav-item {\n      .dropdown-menu {\n        position: absolute;\n      }\n    }\n  }\n\n\n\n  .dropdown.nav-item .dropdown-menu-animation {\n    display: block;\n    height: 0;\n    transition: all .35s ease;\n    padding-top: 0 !important;\n    padding-bottom: 0 !important;\n    opacity: 0;\n\n    &.show {\n      height: 250px;\n      opacity: 1;\n    }\n  }\n}\n\n// MultiLevel Dropdown Style\n\n.dropdown-menu li {\n  position: relative;\n}\n\n.dropdown {\n  &.dropdown-subitem:after {\n    left: 100%;\n    bottom: 0;\n    width: 50%;\n  }\n\n  .dropdown-menu {\n    .dropdown-item + .dropdown-menu:before {\n      transform: $dropdown-subitem-arrow-rotate;\n      left: 0;\n      top: 0;\n      z-index: -1;\n      transition: left .35s ease;\n    }\n    &.dropdown-menu-end{\n      right: 0 !important;\n      left: auto !important;\n      &:before{\n        right: $dropdown-animation-arrow-left-position;\n        left: auto;\n      }\n    }\n  }\n\n  &.dropdown-subitem:hover .dropdown-item + .dropdown-menu:before {\n    left: $dropdown-subitem-left-hover;\n  }\n\n  & > .dropdown-menu {\n    .dropdown-item + .dropdown-menu {\n      transform: $dropdown-multilevel-transform-show;\n    }\n  }\n}\n\n.dropdown .dropdown-menu .dropdown-item+.dropdown-menu {\n  right: $dropdown-subitem-position-right;\n  left: auto;\n  top: 0;\n}\n// End MultiLevel Dropdown Style\n\n.dropdown-image {\n  background-size: cover;\n}\n\n@include media-breakpoint-up(lg) {\n  .dropdown-xl {\n    min-width: $dropdown-xl-min-width;\n  }\n\n  .dropdown-lg {\n    min-width: $dropdown-lg-min-width;\n  }\n\n  .dropdown-md {\n    min-width: $dropdown-md-min-width;\n  }\n}\n\n@include media-breakpoint-down(xl) {\n .dropdown-lg-responsive {\n   min-width: $dropdown-lg-width-responsive;\n }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_dropup.scss",
    "content": ".dropup {\n  .dropdown-menu {\n    box-shadow: $dropdown-box-shadow;\n    transition: $dropdown-transition;\n    cursor: pointer;\n    top: auto !important;\n    bottom: 100% !important;\n    margin-bottom: $dropup-mb !important;\n    display: block;\n    opacity: 0;\n    transform-origin: $dropup-transform-origin;\n    pointer-events: none;\n    transform: $dropup-transform;\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n    will-change: transform,box-shadow;\n\n    &.show{\n      pointer-events: auto;\n      transform: $dropup-transform-show;\n      opacity: 1;\n\n      &:after {\n        bottom: -($dropup-animation-arrow-bottom-position - 2);\n      }\n    }\n\n    &:after {\n      font-family: \"FontAwesome\";\n      content: \"\\f0d7\";\n      position: absolute;\n      z-index: -1;\n      bottom: $dropup-animation-arrow-bottom-position;\n      left: $dropdown-animation-arrow-left-position;\n      right: auto;\n      font-size: $dropdown-animation-arrow-font-size;\n      color: $white;\n      transition: $dropup-animation-arrow-transition;\n    }\n  }\n}"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_fixed-plugin.scss",
    "content": ".fixed-plugin{\n  .fixed-plugin-button{\n    background: $white;\n    border-radius: $fixed-plugin-radius;\n    bottom: $fixed-plugin-bottom;\n    right: $fixed-plugin-right;\n    font-size: $font-size-xl;\n    z-index: $fixed-plugin-button-z-index;\n    box-shadow: $fixed-plugin-box-shadow;\n    cursor: pointer;\n    i{\n      pointer-events: none;\n    }\n  }\n  .card{\n    position: fixed !important;\n    right: -$fixed-plugin-card-width;\n    top: 0;\n    height: 100%;\n    left: auto!important;\n    transform: unset !important;\n    width: $fixed-plugin-card-width;\n    border-radius: 0;\n    padding: 0 10px;\n    transition: .2s ease;\n    z-index: $fixed-plugin-card-z-index;\n  }\n\n  .badge{\n    border: 1px solid $white;\n    border-radius: 50%;\n    cursor: pointer;\n    display: inline-block;\n    height: 23px;\n    margin-right: 5px;\n    position: relative;\n    width: 23px;\n    transition: $transition-base;\n    &:hover,\n    &.active{\n      border-color: $dark;\n    }\n  }\n\n  .btn.bg-gradient-dark:not(:disabled):not(.disabled) {\n    border: 1px solid transparent;\n    &:not(.active) {\n      background-color: transparent;\n      background-image: none;\n      border: 1px solid $dark;\n      color: $dark;\n    }\n  }\n\n  &.show{\n    .card{\n      right: 0;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_floating-elements.scss",
    "content": ".floating-man {\n  width: $floating-man-width;\n}\n\n.fadeIn1 {\n  animation-duration: $fade-in-1-animation-duration;\n}\n.fadeIn2 {\n  animation-duration: $fade-in-2-animation-duration;\n}\n.fadeIn3 {\n  animation-duration: $fade-in-3-animation-duration;\n}\n.fadeIn4 {\n  animation-duration: $fade-in-4-animation-duration;\n}\n.fadeIn5 {\n  animation-duration: $fade-in-5-animation-duration;\n}\n.fadeIn1,\n.fadeIn2,\n.fadeIn3,\n.fadeIn4,\n.fadeIn5 {\n  animation-fill-mode: both;\n}\n.fadeInBottom {\n  animation-name: $fade-in-animation-name;\n}\n\n@keyframes fadeInBottom {\n  from {\n    opacity: 0;\n    transform: $fade-in-bottom-transform;\n  }\n  to {\n    opacity: 1\n  }\n}\n\n\n\n\n// Headers\n\n.header-rounded-images {\n  .shape-1 {\n    width: $shape-1-width;\n    left: $shape-1-left;\n  }\n\n  .shape-2 {\n    width: $shape-2-width;\n    left: $shape-2-left;\n  }\n\n  .shape-3 {\n    width: $shape-3-width;\n    margin-top: $shape-3-left;\n  }\n\n  .img-1 {\n    right: $shape-img-1-right;\n    width: $shape-img-1-width;\n    margin-top: $shape-img-1-margin-top;\n  }\n\n  .img-2 {\n    left: $shape-img-2-left;\n    width: $shape-img-2-width;\n    margin-top: $shape-img-2-margin-top;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_footer.scss",
    "content": ".footer {\n  .nav-link {\n    color: $dark;\n    font-weight: $font-weight-normal;\n    font-size: $font-size-sm;\n    padding-top: 0;\n    padding-bottom: $nav-link-footer-padding;\n\n    &:hover {\n      opacity: 1 !important;\n      transition: $footer-link-animation;\n    }\n  }\n  .footer-logo {\n    max-width: 2rem;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_forms.scss",
    "content": ".input-group {\n  @include border-radius($input-border-radius, 0);\n\n  &,\n  .input-group-text {\n    transition: $input-transition;\n  }\n\n  & > :not(:first-child):not(.dropdown-menu) {\n    margin-left: 0;\n  }\n\n\t.form-control {\n\t\tbox-shadow: none;\n    \n\t\t&:not(:first-child) {\n\t    border-left: 0;\n\t    padding-left: 0;\n\t\t}\n\t\t&:not(:last-child) {\n\t\t\tborder-right: 0;\n\t\t\tpadding-right: 0;\n\t\t}\n\n    & + .input-group-text {\n      border-left: 0;\n      border-right: $input-border-width solid $input-border-color;\n    }\n\t}\n\n  .input-group-text {\n    border-right: 0;\n  }\n\n\n\n  &.focused {\n    box-shadow: $input-focus-box-shadow;\n  }\n\n  &.focused .input-group-text {\n    border-color: $input-focus-border-color;\n  }\n}\n\n\n.form-group {\n  margin-bottom: 1rem;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_gradients.scss",
    "content": "@each $prop, $value in $theme-gradient-colors {\n  .bg-gradient-#{$prop} {\n    @include gradient-directional(nth($value, 1) 0%, nth($value, -1) 100%, $deg: 195deg);\n  }\n}\n\n@each $prop, $value in $theme-colors {\n  .bg-gradient-faded-#{$prop} {\n    background-image: radial-gradient(370px circle at 80% 50%,rgba($value, .6) 0,darken($value, 10%) 100%)\n  }\n}\n\n\n@each $prop, $value in $theme-colors {\n  &.bg-gradient-faded-#{$prop}-vertical{\n    background-image: radial-gradient(200px circle at 50% 70%, rgba($value, .3) 0, $value 100%);\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_header.scss",
    "content": ".page-header {\n  padding: $page-header-padding;\n  position: $page-header-position;\n  overflow: $page-header-overflow;\n  display: $page-header-display;\n  align-items: $page-header-align-items;\n  background-size: $page-header-bg-size;\n  background-position: $page-header-bg-position;\n\n  .container {\n    z-index: $page-header-conteiner-index;\n  }\n\n  video {\n    position: absolute;\n    top: $header-video-top;\n    left: $header-video-left;\n    min-width: $header-video-min-width;\n    min-height: $header-video-min-height;\n    width: auto;\n    height: auto;\n    z-index: 0;\n    transform: $header-video-min-transform;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_icons.scss",
    "content": ".material-icons {\n  font-family: 'Material Icons Round';\n  font-weight: normal;\n  font-style: normal;\n  font-size: 20px;  /* Preferred icon size */\n  display: inline-block;\n  line-height: 1;\n  text-transform: none;\n  letter-spacing: normal;\n  word-wrap: normal;\n  white-space: nowrap;\n  direction: ltr;\n\n  /* Support for all WebKit browsers. */\n  -webkit-font-smoothing: antialiased;\n  /* Support for Safari and Chrome. */\n  text-rendering: optimizeLegibility;\n\n  /* Support for Firefox. */\n  -moz-osx-font-smoothing: grayscale;\n\n  /* Support for IE. */\n  font-feature-settings: 'liga';\n}\n\n.nav.nav-pills {\n  .nav-link {\n    .material-icons {\n      top: 3px;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_info-areas.scss",
    "content": ".icon-shape {\n  width: $icon-md-width;\n  height: $icon-md-width;\n  background-position: $icon-shape-bg-position;\n  border-radius: $border-radius-lg;\n\n  i {\n    color: $white;\n    opacity: $icon-shape-icon-opacity;\n    top: $info-icon-top;\n    position: $info-icon-position;\n  }\n\n  .ni {\n    top: 14px;\n  }\n}\n\n.icon-xxs {\n  width: $icon-xxs-width;\n  height: $icon-xxs-height;\n\n  i {\n    top: $info-icon-top-xxs;\n    font-size: $font-size-xxs;\n  }\n}\n\n.icon-xs {\n  width: $icon-xs-width;\n  height: $icon-xs-height;\n\n  i {\n    top: $info-icon-top-xs;\n    font-size: $font-size-xs;\n  }\n}\n\n.icon-sm {\n  width: $icon-sm-width;\n  height: $icon-sm-height;\n\n  i {\n    top: $info-icon-top-sm;\n    font-size: $font-size-sm;\n  }\n}\n\n.icon-md {\n  width: $icon-md-width;\n  height: $icon-md-height;\n\n  i {\n    top: $info-icon-top-md;\n    font-size: $font-size-lg;\n  }\n\n  &.icon-striped {\n    background-position-x: $icon-striped-bg-md;\n    background-position-y: $icon-striped-bg-md;\n\n    i {\n      top: 11%;\n      margin-left: -10px;\n      font-size: $font-size-sm;\n    }\n  }\n}\n\n.icon-lg {\n  width: $icon-lg-width;\n  height: $icon-lg-height;\n  i {\n    top: $info-icon-top-lg;\n    font-size: $font-size-2xl;\n  }\n\n  &.icon-striped {\n    background-position-x: $icon-striped-bg-lg;\n    background-position-y: $icon-striped-bg-lg;\n\n    i {\n      top: 21%;\n      margin-left: -15px;\n    }\n  }\n}\n\n.icon-xl {\n  width: $icon-xl-width;\n  height: $icon-xl-height;\n  border-radius: $border-radius-lg;\n\n  i {\n    top: $info-icon-top-xl;\n    font-size: 2.1rem;\n  }\n\n  &.icon-striped {\n    background-position-x: $icon-striped-bg-xl;\n    background-position-y: $icon-striped-bg-xl;\n\n    i {\n      top: 30%;\n      margin-left: -15px;\n    }\n  }\n}\n\n.info-horizontal {\n  text-align: left !important;\n\n  .icon {\n    float: left;\n  }\n  .description {\n    overflow: hidden;\n  }\n}\n\n// Icon SVG fill color change\n\nsvg.text-primary {\n  .color-foreground {\n    fill: $primary-gradient;\n  }\n  .color-background {\n    fill: $primary-gradient-state;\n  }\n}\nsvg.text-secondary {\n  .color-foreground {\n    fill: $secondary-gradient;\n  }\n  .color-background {\n    fill: $secondary-gradient-state;\n  }\n}\nsvg.text-info {\n  .color-foreground {\n    fill: $info-gradient;\n  }\n  .color-background {\n    fill: $info-gradient-state;\n  }\n}\nsvg.text-warning {\n  .color-foreground {\n    fill: $warning-gradient;\n  }\n  .color-background {\n    fill: $warning-gradient-state;\n  }\n}\nsvg.text-danger {\n  .color-foreground {\n    fill: $danger-gradient;\n  }\n  .color-background {\n    fill: $danger-gradient-state;\n  }\n}\nsvg.text-success {\n  .color-foreground {\n    fill: $success-gradient;\n  }\n  .color-background {\n    fill: $success-gradient-state;\n  }\n}\nsvg.text-dark {\n  .color-foreground {\n    fill: $dark-gradient;\n  }\n  .color-background {\n    fill: $dark-gradient-state;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_list-check.scss",
    "content": "// Checklist item\n// contains the checklist entry info and checkbox\n\n.checklist-item {\n    &:before {\n        content: \"\";\n        position: absolute;\n        width: 3px;\n        height: 100%;\n        top: 0;\n        left: 0;\n        background-color: $primary;\n        border-radius: $border-radius-sm;\n    }\n}\n\n// Color variations\n\n@each $color, $value in $theme-colors {\n    .checklist-item-#{$color} {\n        &:before {\n            background-color: $value;\n        }\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_misc-extend.scss",
    "content": "\n// Perspective effect\n.change-perspective {\n  transform: $transform-perspective;\n}\n\n.change-perspective-inverse {\n  transform: $transform-perspective-inverse;\n}\n// Device Wrapper\n.device-wrapper {\n  border-radius: $device-wrapper-radius;\n  box-shadow: $device-wrapper-box-shadow;\n}\n\n// sidebar caret RTL\n.rotate-caret {\n  .collapse {\n    .nav-link:after {\n      margin-right: auto;\n      margin-left: 0;\n    }\n  }\n}\n\n.z-index2 {\n  z-index: $z-index2;\n}\n@keyframes gradient {\n  0% {\n    background-position: 0 50%;\n  }\n\n  50% {\n    background-position: 100% 50%;\n  }\n\n  100% {\n    background-position: 0 50%;\n  }\n}\n// Colored Shadow on Cards images\n.colored-shadow {\n  transform: scale($colored-shadow-scale);\n  top: $colored-shadow-top;\n  filter: blur($colored-shadow-blur);\n  position: absolute;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-size: cover;\n  z-index: -1;\n\n  &.rounded {\n    border-radius: 50% !important;\n  }\n\n  &.avatar-xs {\n    transform: scale($colored-shadow-scale-avatar);\n    width: $avatar-xs-width;\n    height: $avatar-xs-height;\n  }\n\n  &.avatar-sm {\n    transform: scale($colored-shadow-scale-avatar);\n    width: $avatar-sm-width;\n    height: $avatar-sm-height;\n  }\n\n  &.avatar-lg {\n    transform: scale($colored-shadow-scale-avatar);\n    width: $avatar-lg-width;\n    height: $avatar-lg-height;\n  }\n\n  &.avatar-xl {\n    transform: scale($colored-shadow-scale-avatar);\n    width: $avatar-xl-width;\n    height: $avatar-xl-height;\n  }\n\n  &.avatar-xxl {\n    transform: scale($colored-shadow-scale-avatar);\n    width: $avatar-xxl-width;\n    height: $avatar-xxl-height;\n  }\n}\n\n// Width in PX\n.width-32-px {\n  width: $width-32-px;\n}\n\n.width-48-px {\n  width: $width-48-px;\n}\n\n.width-64-px {\n  width: $width-64-px;\n}\n\n// Animated shapes\n.animated-blur {\n  filter: blur(40px);\n}\n\n.animated-blur-1 {\n  animation: animation-blur-one 8s infinite;\n}\n\n.animated-blur-2 {\n  animation: animation-blur-one 4s infinite;\n}\n\n.animated-blur-3 {\n  animation: animation-blur-two 6s infinite;\n}\n\n.animated-blur-4 {\n  animation: animation-blur-two 5s infinite;\n}\n@keyframes animation-blur-one {\n  0% {\n    transform: scale(.8);\n  }\n\n  25% {\n    transform: translateX(10%);\n  }\n\n  50% {\n    transform: scale(1.2);\n  }\n\n  75% {\n    transform: translateX(5%);\n  }\n\n  100% {\n    transform: scale(.8);\n  }\n}\n@keyframes animation-blur-two {\n  0% {\n    transform: scale(1.2);\n  }\n\n  50% {\n    transform: scale(.8);\n  }\n\n  100% {\n    transform: scale(1.2);\n  }\n}\n\n// Text with border\n.text-border {\n  &:after,\n  &:before {\n    content: \"\";\n    display: $text-border-display;\n    width: $text-border-width;\n    height: $text-border-height;\n    position: $text-border-position;\n    vertical-align: $text-border-vertical-align;\n  }\n\n  &:after{\n    background: $text-border-bg-color-after;\n  }\n\n  &:before{\n    background: $text-border-bg-color-before;\n  }\n\n  &:before {\n    right: $text-border-before-right;\n    margin-left: $text-border-before-ml;\n  }\n\n  &:after {\n    left: $text-border-after-left;\n    margin-right: $text-border-after-mr;\n  }\n}\n\na[data-scroll]{\n  border-radius: $border-radius-md;\n   &:hover{\n    background: $gray-200;\n    color: $h-color;\n  }\n}\n\n// Round Slider Styling\nround-slider {\n  max-width: $round-slider-m-width;\n  transition: $round-slider-transition;\n}\n\nround-slider.scaling:hover {\n  max-width: $round-slider-scale-m-width;\n}\n\n\n// Smart Home - Room Selectpicker\n.room-select {\n  .choices {\n    .choices__inner {\n      background: $white;\n      border-color: $white;\n    }\n  }\n}\n\n\n// Page Sections Breadcrumb\n@include media-breakpoint-down(lg) {\n  .page-headers-sections {\n    .container {\n      .row {\n        .col-lg-12.mx-auto > .mb-4.w-25 {\n          width: 50% !important;\n        }\n      }\n    }\n  }\n}\n@include media-breakpoint-down(sm) {\n  .page-headers-sections {\n    .container {\n      .row {\n        .col-lg-12.mx-auto > .mb-4.w-25 {\n          width: 100% !important;\n        }\n      }\n    }\n  }\n}\n// Coming Soon Page\n.transform-rotate {\n  transform: $coming-rotate-transform;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_misc.scss",
    "content": "// Blur effect\n\n.blur {\n  box-shadow: $blur-box-shadow;\n  -webkit-backdrop-filter: $blur-backdrop-filter;\n  backdrop-filter: $blur-backdrop-filter;\n  background-color: $card-background-blur !important;\n\n  &.saturation-less {\n    -webkit-backdrop-filter: $blur-backdrop-filter-less;\n    backdrop-filter: $blur-backdrop-filter-less;\n  }\n\n  &.blur-rounded {\n    border-radius: $blur-border-radius-rounded;\n  }\n\n  &.blur-light {\n    background-color: $blur-light-background;\n  }\n  &.blur-dark {\n    background-color: $blur-dark-background;\n  }\n}\n\n.shadow-blur {\n  box-shadow: $shadow-blur-box-shadow !important;\n}\n\n.shadow-card {\n  box-shadow: $card-box-shadow !important;\n}\n\n.navbar-blur {\n  -webkit-backdrop-filter: $blur-backdrop-filter;\n  backdrop-filter: $blur-backdrop-filter;\n  background-color: rgba($white, .58) !important;\n}\n\n.blur-section {\n  -webkit-backdrop-filter: $blur-backdrop-filter;\n  backdrop-filter: $blur-backdrop-filter;\n\n  &.blur-gradient-primary {\n    @include gradient-directional(rgba($primary-gradient, .95) 0%, rgba($primary-gradient-state, .95) 100%, $deg: 195deg);\n  }\n}\n\n// Transition on hover\n* {\n  &.move-on-hover {\n    -webkit-transition: $move-transition;\n    transition: $move-transition;\n    overflow: $move-overflow;\n    -webkit-transform-origin: $move-transform-origin;\n    transform-origin: $move-transform-origin;\n    transform-origin: $move-transform-origin;\n    -webkit-transform: $move-transform;\n    transform: $move-transform;\n    -webkit-backface-visibility: $move-backface-visibility;\n    backface-visibility: $move-backface-visibility;\n    will-change: $move-will-change;\n\n    &:hover {\n      -webkit-transform: $move-hover-transform;\n      transform: $move-hover-transform;\n    }\n  }\n\n  &.gradient-animation {\n    background: $gradient-animation-background;\n    background-size: $gradient-animation-bg-size !important;\n    animation: $device-wrapper-animation;\n  }\n}\n\n// Vertical Line\nhr.vertical {\n  position: absolute;\n  background-color: $hr-bg-color;\n  height: 100%;\n  right: 0;\n  top: 0;\n  width: 1px;\n\n  &.light {\n    background-color: $hr-bg-color-light;\n  }\n\n  &.dark {\n    background-color: $hr-bg-color-dark;\n  }\n\n  &.gray-light {\n    background-image: $hr-horizontal-bg-image-gray-light;\n  }\n}\n\n// Horizontal Line\nhr.horizontal {\n  background-color: $hr-bg-color;\n\n  &.light {\n    background-color: $hr-bg-color-light;\n  }\n  &.dark {\n    background-color: $hr-bg-color-dark;\n  }\n\n  &.gray-light {\n    background-image: $hr-horizontal-bg-image-gray-light;\n  }\n}\n\n// lock style\n.lock-size {\n  width: 1.7rem;\n  height: 1.7rem;\n}\n\n.border-radius-xs {\n  border-radius: $border-radius-xs;\n}\n\n.border-radius-sm {\n  border-radius: $border-radius-sm;\n}\n\n.border-radius-md {\n  border-radius: $border-radius-md;\n}\n\n.border-radius-lg {\n  border-radius: $border-radius-lg;\n}\n\n.border-radius-xl {\n  border-radius: $border-radius-xl;\n}\n\n.border-radius-2xl {\n  border-radius: $border-radius-2xl;\n}\n\n.border-radius-section {\n  border-radius: $border-radius-section;\n}\n\n.border-bottom-end-radius-0 {\n  border-bottom-right-radius: 0;\n}\n\n.border-top-end-radius-0 {\n  border-top-right-radius: 0;\n}\n\n.border-bottom-start-radius-0 {\n  border-bottom-left-radius: 0;\n}\n\n.border-top-start-radius-0 {\n  border-top-left-radius: 0;\n}\n\n.border-dashed{\n  border-style: dashed;\n}\n\n.z-index-sticky {\n  z-index: $zindex-sticky;\n}\n\n\n// moving waves animation\n.waves {\n  position: $waves-position;\n  width: $waves-width;\n  height: $waves-height;\n  margin-bottom: $waves-margin-bottom;\n  /*Fix for safari gap*/\n  min-height: $waves-min-height;\n  max-height: $waves-max-height;\n\n  &.waves-sm {\n    height: $waves-height-sm;\n    min-height: $waves-min-height-sm;\n  }\n\n  &.no-animation {\n    .moving-waves > use {\n      animation: none;\n    }\n  }\n}\n\n.wave-rotate {\n  transform: $waves-rotate;\n}\n/* Animation for the waves */\n.moving-waves > use {\n  animation: $moving-waves-animation;\n}\n\n.moving-waves > use:nth-child(1) {\n  animation-delay: $moving-waves-child-1-delay;\n  animation-duration: $moving-waves-child-1-duration;\n}\n\n.moving-waves > use:nth-child(2) {\n  animation-delay: $moving-waves-child-2-delay;\n  animation-duration: $moving-waves-child-2-duration;\n}\n\n.moving-waves > use:nth-child(3) {\n  animation-delay: $moving-waves-child-3-delay;\n  animation-duration: $moving-waves-child-3-duration;\n}\n\n.moving-waves > use:nth-child(4) {\n  animation-delay: $moving-waves-child-4-delay;\n  animation-duration: $moving-waves-child-4-duration;\n}\n\n.moving-waves > use:nth-child(5) {\n  animation-delay: $moving-waves-child-5-delay;\n  animation-duration: $moving-waves-child-5-duration;\n}\n\n.moving-waves > use:nth-child(6) {\n  animation-delay: $moving-waves-child-6-delay;\n  animation-duration: $moving-waves-child-6-duration;\n}\n@keyframes move-forever {\n  0% {\n    transform: $moving-waves-keyframe-0;\n  }\n\n  100% {\n    transform: $moving-waves-keyframe-100;\n  }\n}\n/*Shrinking for mobile*/\n@include media-breakpoint-down(md) {\n  .waves {\n    height: $waves-mobile-height;\n    min-height: $waves-mobile-height;\n  }\n\n  hr.horizontal {\n    background-color: $hr-bg;\n\n    &:not(.dark) {\n      background-image: $hr-bg-image;\n    }\n\n    &.vertical {\n      transform: $hr-transform;\n    }\n\n    &.dark {\n      background-image: $hr-bg-dark-image;\n    }\n  }\n}\n\n.overflow-visible {\n  overflow: visible !important;\n}\n\n// popover title\n.popover {\n  .popover-header {\n    font-weight: 600;\n  }\n}\n\n\n// Background Sizes\n.bg-cover{\n  background-size: cover;\n}\n\n// Mask Class\n.mask {\n  position: $mask-position;\n  background-size: $mask-bg-size;\n  background-position: $mask-bg-position;\n  top: $mask-top;\n  left: $mask-left;\n  width: $mask-width;\n  height: $mask-height;\n  opacity: $mask-opacity;\n}\n\n\n// Cursor Pointer Class\n.cursor-pointer {\n  cursor: pointer;\n}\n\n// Translate 50% Class\n.transform-translate-50{\n  transform: translate(0,-50%)\n}\n\n// VR Pages\n\n@include media-breakpoint-up(lg) {\n  .virtual-reality {\n    .sidenav {\n      margin-top: $spacer * 2;\n      animation-name: $animation-name;\n      animation-fill-mode: $animation-mode;\n      animation-duration: $animation-duration;\n      transform: $transform-scale;\n      left: $position-left !important;\n      position: absolute;\n    }\n  }\n}\n\n// Selectpicker\n\n.choices {\n  .choices__list {\n    background: $input-background;\n    background-size: $input-background-size;\n    transition: $input-transition;\n\n    &.choices__list--single {\n      .choices__item--selectable {\n        margin-bottom: 0.5rem;\n      }\n\n      &,\n      &:focus {\n        background-image: $input-background-image;\n      }\n\n\n    }\n\n    &.choices__list--dropdown {\n      background: $white;\n    }\n  }\n\n  &.is-focused {\n    .choices__list {\n      background-size: $input-background-size-focus;\n    }\n  }\n}\n\n// Vertical border w/ pseudo elem\n\n.border-right-after:after {\n  content: \"\";\n  position: absolute;\n  right: 0;\n  top: $border-right-after-top;\n  height: $border-right-after-height;\n  width: $border-right-after-width;\n  border-right: 1px solid $border-right-after-border-color;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_nav.scss",
    "content": ".nav {\n  &.nav-pills {\n    background: $nav-pills-background;\n    border-radius: $nav-pills-border-radius;\n    position: relative;\n    &.nav-pills-vertical {\n      border-radius: $nav-pills-vertical-radius;\n      .nav-link {\n        &.active {\n          border-radius: $nav-pills-vertical-link-radius;\n        }\n      }\n    }\n    .nav-link {\n      z-index: 3;\n      color: $dark;\n      border-radius: $nav-pills-link-border-radius;\n      background-color: inherit;\n      &.active {\n        animation: $nav-pills-link-active-animation;\n      }\n      &:hover:not(.active) {\n        color: $dark;\n      }\n    }\n    &.nav-pills-primary {\n      background: $white;\n      color: $white;\n      .nav-link{\n        &.active{\n          color: $white;\n        }\n      }\n      .moving-tab {\n        .nav-link.active {\n          background: $primary-gradient;\n          color: $primary-gradient;\n        }\n      }\n    }\n    &.nav-pills-info {\n      background: $white;\n      color: $white;\n      .nav-link{\n        &.active{\n          color: $white;\n        }\n      }\n      .moving-tab {\n        .nav-link.active {\n          background: $info-gradient;\n          color: $info-gradient;\n        }\n      }\n    }\n    &.nav-pills-success {\n      background: $white;\n      color: $white;\n      .nav-link{\n        &.active{\n          color: $white;\n        }\n      }\n      .moving-tab {\n        .nav-link.active {\n          background: $success-gradient;\n          color: $success-gradient;\n        }\n      }\n    }\n    &.nav-pills-warning {\n      background: $white;\n      color: $white;\n      .nav-link{\n        &.active{\n          color: $white;\n        }\n      }\n      .moving-tab {\n        .nav-link.active {\n          background: $warning-gradient;\n          color: $warning-gradient;\n        }\n      }\n    }\n    &.nav-pills-danger {\n      background: $white;\n      color: $white;\n      .nav-link{\n        &.active{\n          color: $white;\n        }\n      }\n      .moving-tab {\n        .nav-link.active {\n          background: $danger-gradient;\n          color: $danger-gradient;\n        }\n      }\n    }\n    .nav-item{\n      z-index: 3;\n    }\n  }\n}\n.moving-tab {\n  z-index: 1 !important;\n  .nav-link {\n    color: $white;\n    transition: .2s ease;\n    border-radius: $nav-pills-link-border-radius;\n    &.active {\n      color: $white;\n      font-weight: $font-weight-bold;\n      box-shadow: $nav-pills-link-box-shadow;\n      animation: $nav-pills-link-active-animation;\n      background: $white;\n    }\n    &:hover:not(.active) {\n      color: $dark;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_navbar-vertical.scss",
    "content": "//\n// Vertical navbar + Sidenav\n//\n\n.navbar-vertical {\n  .navbar-brand > img,\n  .navbar-brand-img {\n    max-width: 100%;\n    max-height: 2rem;\n  }\n  // Navbar navigaton\n  .navbar-nav {\n    // Navbar link\n    .nav-link {\n      padding-left: $navbar-padding-x;\n      padding-right: $navbar-padding-x;\n      font-weight: $navbar-nav-link-font-weight;\n      color: $white;\n      // Icon\n      > i {\n        min-width: $navbar-icon-min-width;\n        font-size: $font-size-2xl;\n        line-height: ($font-size-base * $line-height-base);\n        text-align: center;\n      }\n      // Dropdown\n      .dropdown-menu {\n        border: none;\n\n        .dropdown-menu {\n          margin-left: $dropdown-item-padding-x / 2;\n        }\n      }\n      .avatar{\n        width: $font-size-3xl;\n        height: $font-size-3xl;\n      }\n    }\n\n    .nav-sm {\n      .nav-link {\n        font-size: 0.8125rem;\n      }\n    }\n  }\n  // Navbar navigation\n  .navbar-nav .nav-link {\n    display: flex;\n    align-items: center;\n    white-space: nowrap;\n  }\n  // Navbar heading\n  .navbar-heading {\n    padding-top: $nav-link-padding-y;\n    padding-bottom: $nav-link-padding-y;\n    font-size: $font-size-xs;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n  // Expanded navbar specific styles\n  &.navbar-expand {\n    @each $breakpoint, $dimension in $grid-breakpoints {\n      &-#{$breakpoint} {\n        @include media-breakpoint-up(#{$breakpoint}) {\n          display: block;\n          position: fixed;\n          top: 0;\n          bottom: 0;\n          width: 100%;\n          max-width: $navbar-vertical-open-width !important;\n          overflow-y: auto;\n          padding: 0;\n          box-shadow: none;\n\n          .navbar-collapse {\n            display: block;\n            overflow: auto;\n            height: $navbar-vertical-inner;\n          }\n          // Container\n          > [class*=\"container\"] {\n            flex-direction: column;\n            align-items: stretch;\n            min-height: 100%;\n            padding-left: 0;\n            padding-right: 0; // Target IE 10 & 11\n            @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n            min-height: none;\n            height: 100%;\n            }\n          }\n          // Fixes the vertical navbar to the left\n          &.fixed-start {\n            left: 0;\n          }\n          // Fixed the vertical navbar to the right\n          &.fixed-end {\n            right: 0;\n          }\n          // Navbar navigation\n          .navbar-nav .nav-link {\n            padding-top: $navbar-vertical-nav-link-padding-y;\n            padding-bottom: $navbar-vertical-nav-link-padding-y;\n            margin: 0 $navbar-vertical-nav-link-padding-x;\n            margin-bottom: 1.5px;\n\n            .nav-link-text,\n            .sidenav-mini-icon,\n            .sidenav-normal,\n            i {\n              pointer-events: none;\n            }\n          }\n\n          .navbar-nav .nav-item {\n            width: 100%;\n          }\n\n          .navbar-nav > .nav-item {\n            margin-top: 0.125rem;\n\n            .icon {\n              .ni {\n                top: 0;\n              }\n            }\n          }\n\n          .lavalamp-object {\n            width: calc(100% - 1rem) !important;\n            background: theme-color(\"primary\");\n            color: color-yiq($primary);\n            margin-right: 0.5rem;\n            margin-left: 0.5rem;\n            padding-left: 1rem;\n            padding-right: 1rem;\n            border-radius: $border-radius-sm;\n          }\n          // Second level\n          .navbar-nav .nav .nav-link {\n            padding-top: $navbar-vertical-nav-link-padding-y;\n            padding-bottom: $navbar-vertical-nav-link-padding-y;\n            padding-left: 15px;\n\n            > span.sidenav-normal {\n              transition: all 0.1s ease 0s;\n            }\n            &.active{\n              padding-top: $navbar-vertical-nav-link-padding-y;\n              padding-bottom: $navbar-vertical-nav-link-padding-y;\n            }\n          }\n        }\n      }\n    }\n  }\n}\n\n.sidenav {\n  // Define colors\n  @each $color, $value in $theme-colors {\n    &[data-color=\"#{$color}\"] {\n      .navbar-nav > .nav-item .nav-link.active {\n        & + .collapse,\n        & + .collapsing{\n          .nav-item.active{\n            .nav-link.active{\n              @include gradient-directional(nth(#{$value}, 1) 0%, nth(#{$value}, -1) 100%, $deg: 195deg);\n            }\n          }\n          .nav-item{\n            .nav-link.active{\n              background-color: $navbar-vertical-hover-bg-color;\n              & + .collapse{\n                .nav-item{\n                  .nav-link.active{\n                    @include gradient-directional(nth(#{$value}, 1) 0%, nth(#{$value}, -1) 100%, $deg: 195deg);\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n// Sidenav + Main content transition\n\n.main-content,\n.sidenav {\n  transition: $transition-base;\n}\n//\n// Sidenav\n//\n\n.sidenav {\n  z-index: 999;\n\n  .navbar-brand,\n  .navbar-heading {\n    display: block;\n  }\n  @include media-breakpoint-up(xl) {\n    &:hover {\n      max-width: $navbar-vertical-open-width;\n    }\n\n    .sidenav-toggler {\n      padding: 1.5rem;\n    }\n\n    &.fixed-start + .main-content {\n      margin-left: $navbar-vertical-open-width + 1.5;\n    }\n\n    &.fixed-end + .main-content {\n      margin-right: $navbar-vertical-open-width + 1.5;\n    }\n  }\n\n  .navbar-heading .docs-mini {\n    padding-left: 3px;\n  }\n\n  .navbar-heading {\n    transition: all 0.1s ease;\n  }\n\n  .navbar-brand {\n    padding: 1.5rem 2rem;\n  }\n  .collapse {\n    .nav-item {\n      .nav-link {\n        &.active {\n          color: $white !important;\n\n          i {\n            color: $white !important;\n          }\n        }\n      }\n    }\n  }\n}\n\n.sidenav-header {\n  height: $sidenav-header-width;\n}\n\n.sidenav-footer {\n  .card {\n    &.card-background {\n      &:after {\n        opacity: $sidenav-card-opacity;\n      }\n    }\n  }\n}\n// Sidenav states\n\n.g-sidenav-show {\n  .sidenav {\n    .nav-item .collapse {\n      height: auto;\n      @include transition($transition-base);\n    }\n\n    .nav-link-text {\n      transition: 0.3s ease;\n      opacity: 1;\n    }\n  }\n  &.rtl {\n    .navbar-vertical {\n      .navbar-nav .nav-link[data-bs-toggle=\"collapse\"] {\n        &:after {\n          margin-left: 0;\n        }\n      }\n    }\n  }\n}\n// Media fixes for iPhone 5 like resolutions\n@include media-breakpoint-down(xl) {\n  .g-sidenav-show {\n    &.rtl {\n      .sidenav {\n        transform: translateX($navbar-vertical-open-width + 1.5);\n      }\n    }\n\n    &:not(.rtl) {\n      .sidenav {\n        transform: translateX(-($navbar-vertical-open-width + 1.5));\n      }\n    }\n\n    .sidenav {\n      &.fixed-start+.main-content {\n        margin-left: 0 !important;\n      }\n    }\n\n    &.g-sidenav-pinned {\n      .sidenav {\n        transform: translateX(0);\n      }\n    }\n  }\n}\n\n.navbar-vertical {\n  &.bg-white {\n    box-shadow: $card-box-shadow;\n\n    .navbar-nav {\n      .nav-link {\n        &.active {\n          box-shadow: none;\n        }\n      }\n    }\n  }\n\n  &.bg-transparent,\n  &.bg-white {\n    .navbar-nav {\n      .nav-link {\n        &.active:after {\n          color: $dark-version-caret-sidebar-color !important;\n        }\n      }\n    }\n  }\n\n  .navbar-nav .nav-link.active {\n    font-weight: $font-weight-normal;\n    box-shadow: $card-box-shadow;\n    border-radius: $border-radius-md;\n    margin-top: 1.5px;\n    margin-bottom: 1.5px;\n  }\n\n  .navbar-nav > .nav-item .nav-link.active {\n    color: $white;\n    border-right-width: 0;\n    border-bottom-width: 0;\n    background-color: $navbar-vertical-hover-bg-color;\n    & + .collapse,\n    & + .collapsing{\n      .nav-item.active{\n        .nav-link.active{\n          @include gradient-directional(nth($rose, 1) 0%, nth($rose, -1) 100%, $deg: 195deg);\n          span{\n            color: $white;\n          }\n        }\n      }\n      .nav-item{\n        .nav-link.active{\n          background-color: $navbar-vertical-hover-bg-color;\n          & + .collapse{\n            .nav-item{\n              .nav-link.active{\n                @include gradient-directional(nth($rose, 1) 0%, nth($rose, -1) 100%, $deg: 195deg);\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n\n.navbar-main {\n  transition: box-shadow $transition-base-time ease-in, background-color $transition-base-time ease-in;\n\n  &.fixed-top {\n    width: calc(100% - (#{$navbar-vertical-open-width} + #{$spacer * 1.5} * 3));\n  }\n\n  &.fixed-top + [class*=\"container\"] {\n    margin-top: 7.1875rem !important;\n  }\n}\n// Navbar Vertical Extend\n.navbar-vertical {\n  .navbar-nav .nav-link[data-bs-toggle=\"collapse\"] {\n    &:after {\n      display: inline-block;\n      font-style: normal;\n      font-variant: normal;\n      text-rendering: auto;\n      -webkit-font-smoothing: antialiased;\n      font-family: 'Font Awesome 5 Free';\n      font-weight: 700;\n      content: \"\\f107\";\n      margin-left: auto;\n      color: rgba($light-gradient-state, 0.7);\n      @include transition($transition-base);\n    }\n    // Expanded\n    &[aria-expanded=\"true\"] {\n      &:after {\n        color: $light-gradient-state;\n        transform: rotate(180deg);\n      }\n    }\n\n    &.active {\n      &:after {\n        color: $white;\n      }\n    }\n  }\n\n  .navbar-nav {\n    .nav-item {\n      .collapse,\n      .collapsing {\n        .nav {\n          @include transition($transition-base);\n\n          .nav-item {\n            .nav-link {\n              position: relative;\n              background-color: transparent;\n              box-shadow: none;\n              color: rgba($light-gradient-state, 0.7);\n\n              &.active {\n                color: $light-gradient-state;\n              }\n            }\n\n            &.active {\n              .nav-link {\n                color: $light-gradient-state;\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n\n  &.blur {\n    .navbar-nav > .nav-item {\n      .nav-link {\n        background-color: transparent;\n        box-shadow: none;\n      }\n    }\n  }\n}\n// Styles for minimized sidenav\n.navbar-vertical {\n  .navbar-brand {\n    .navbar-brand-img,\n    span {\n      @include transition($transition-base);\n    }\n  }\n\n  .nav-item {\n    .nav-link {\n      span.sidenav-mini-icon {\n        @include transition($transition-base);\n        text-align: center;\n        min-width: $navbar-icon-min-width;\n      }\n    }\n  }\n\n  .docs-info {\n    @include transition($transition-base);\n  }\n\n  .nav-item {\n    .nav-link {\n      margin-top: 3px;\n      margin-bottom: 3px;\n      border-radius: $navbar-nav-link-border-radius;\n      margin-bottom: 1.5px;\n      margin-top: 1.5px;\n\n      +.collapse,\n      +.collapsing {\n        .nav {\n          .nav-item {\n            >.nav-link {\n              margin-top: 1.5px;\n              margin-bottom: 1.5px;\n              +.collapse,\n              +.collapsing {\n                .nav {\n                  .nav-item {\n                    .nav-link {\n                      margin-top: 1.5px;\n                      margin-bottom: 1.5px;\n                    }\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n    &:hover {\n      .nav-link {\n        background-color: $navbar-vertical-hover-bg-color;\n        border-radius: $navbar-nav-link-border-radius;\n\n        +.collapse {\n          .nav {\n            .nav-item {\n              &:hover {\n                >.nav-link {\n                  background-color: $navbar-vertical-hover-bg-color;\n                  border-radius: $navbar-nav-link-border-radius;\n                }\n              }\n              +.collapse {\n                .nav {\n                  .nav-item {\n                    &:hover {\n                      .nav-link {\n                        background-color: $navbar-vertical-hover-bg-color;\n                        border-radius: $navbar-nav-link-border-radius;\n                      }\n                    }\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n\n@include media-breakpoint-up(xl) {\n  .g-sidenav-hidden {\n    &.rtl{\n      .main-content {\n        margin-right: $navbar-vertical-hidden-width !important;\n      }\n\n      .navbar-vertical {\n        &:hover {\n          max-width: $navbar-vertical-open-width !important;\n        }\n        .nav-item {\n          .nav-link {\n            .material-icons-round{\n              margin-right: $navbar-icon-material-margin-left;\n            }\n          }\n        }\n      }\n    }\n\n    &.rtl {\n      .sidenav:hover {\n        & + .main-content {\n          margin-right: $navbar-vertical-open-width + 1.5 !important;\n        }\n      }\n    }\n\n    .navbar-vertical {\n      max-width: $navbar-vertical-hidden-width !important;\n\n      &.fixed-start + .main-content {\n        margin-left: $navbar-vertical-hidden-width + 1.5;\n      }\n\n      .navbar-brand {\n        img {\n          width: auto !important;\n        }\n\n        span {\n          opacity: 0;\n        }\n      }\n\n      .nav-item {\n        .nav-link {\n          .icon {\n            padding: 10px;\n          }\n\n          .material-icons-round{\n            margin-left: $navbar-icon-material-margin-left;\n          }\n\n          .nav-link-text,\n          .sidenav-normal {\n            opacity: 0;\n            width: 0;\n          }\n\n          .sidenav-mini-icon {\n            min-width: $navbar-icon-min-width;\n            margin-left: $navbar-icon-margin-left !important;\n          }\n\n          &[data-bs-toggle=\"collapse\"]:after {\n            content: \"\";\n            opacity: 0;\n          }\n        }\n\n        .collapse {\n          .nav {\n            margin-left: 0 !important;\n            padding-left: 0 !important;\n\n            .nav-item {\n              .nav-link {\n                margin-left: $navbar-vertical-nav-link-padding-x;\n\n                &[data-bs-toggle=\"collapse\"]:after {\n                  content: \"\\f107\";\n                }\n              }\n            }\n          }\n        }\n      }\n\n      .card.card-background {\n        .icon-shape {\n          margin-bottom: 0 !important;\n        }\n\n        .docs-info {\n          opacity: 0;\n          width: 0;\n          height: 0;\n        }\n      }\n      // Hover style on sidenav minimized\n      &:hover {\n        max-width: $navbar-vertical-open-width !important;\n\n        &.fixed-start + .main-content {\n          margin-left: $navbar-vertical-open-width + 1.5;\n        }\n\n        .navbar-brand {\n          span {\n            opacity: 1;\n          }\n        }\n\n        .nav-item {\n          .nav-link {\n            .nav-link-text,\n            .sidenav-normal {\n              opacity: 1;\n              width: auto;\n            }\n\n            &[data-bs-toggle=\"collapse\"]:after {\n              content: \"\\f107\";\n              opacity: 1;\n            }\n          }\n\n          .collapse {\n            .nav {\n              .nav-item {\n                .collapse,\n                .collapsing {\n                  .nav {\n                    margin-left: 0 !important;\n                    padding-left: 0 !important;\n                  }\n                }\n              }\n            }\n          }\n        }\n\n        .card.card-background {\n          .icon-shape {\n            margin-bottom: 1rem !important;\n          }\n\n          .docs-info {\n            opacity: 1;\n            width: auto;\n            height: auto;\n          }\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_navbar.scss",
    "content": ".navbar {\n  box-shadow: $navbar-box-shadow;\n\n  .navbar-brand {\n    color: $dark;\n    @include font-size($font-size-sm);\n  }\n  .nav-link {\n    color: $dark;\n    padding: $navbar-nav-link-padding;\n    font-weight: $font-weight-normal;\n    font-size: $font-size-sm;\n  }\n\n  &.navbar-absolute {\n    position: absolute;\n    width: 100%;\n    z-index: 1;\n  }\n\n  &.navbar-transparent {\n    .nav-link {\n      &, i {\n        color: $white;\n      }\n\n\n      &:hover,\n      &:focus {\n        color: rgba($white, .75);\n      }\n    }\n\n    .navbar-toggler {\n      .navbar-toggler-icon {\n        .navbar-toggler-bar {\n          background: $white;\n        }\n      }\n    }\n\n    .navbar-collapse{\n      border-radius: $border-radius-xl;\n    }\n  }\n\n  &.navbar-dark {\n    .navbar-collapse.show,\n    .navbar-collapse.collapsing\n    {\n      .dropdown-header.text-dark{\n        color: $white !important;\n      }\n    }\n  }\n  .sidenav-toggler-inner{\n    width: $sidenav-toggler-width;\n    .sidenav-toggler-line{\n      transition: $sidenav-toggler-line-transition;\n      background: $body-color;\n      border-radius: $border-radius-xs;\n      position: relative;\n      display: block;\n      height: $sidenav-toggler-line-height;\n      &:not(:last-child){\n        margin-bottom: $sidenav-toggler-line-margin-bottom;\n      }\n    }\n  }\n  .g-sidenav-show.g-sidenav-pinned &{\n    .sidenav-toggler-inner{\n      .sidenav-toggler-line:first-child,\n      .sidenav-toggler-line:last-child {\n          width: $sidenav-toggler-line-active-width;\n          transform: $sidenav-toggler-line-transform;\n      }\n    }\n  }\n}\n\n.navbar-light {\n  background-color: $white !important;\n  .navbar-toggler{\n    border: none;\n    &:focus{\n      box-shadow: none;\n    }\n  }\n}\n\n.navbar-toggler {\n  .navbar-toggler-icon {\n    background-image: none;\n\n    .navbar-toggler-bar {\n      display: $navbar-toggler-bar-display;\n      position: $navbar-toggler-bar-position;\n      width: $navbar-toggler-bar-width;\n      height: $navbar-toggler-bar-height;\n      border-radius: $navbar-toggler-bar-radius;\n      background: $gray-600;\n      transition: $navbar-toggler-bar-transition;\n      margin: 0 auto;\n\n      &.bar2,\n      &.bar3 {\n        margin-top: $navbar-toggler-bar-margin-top;\n      }\n    }\n  }\n\n  &[aria-expanded=\"true\"] {\n    .navbar-toggler-bar {\n      &.bar1 {\n        transform: $navbar-toggler-bar-1-transform;\n        transform-origin: $navbar-toggler-bar-1-transform-origin;\n        margin-top: $navbar-toggler-bar-1-margin-top;\n      }\n\n      &.bar2 {\n        opacity: $navbar-toggler-bar-2-opacity;\n      }\n\n      &.bar3 {\n        transform: $navbar-toggler-bar-3-transform;\n        transform-origin: $navbar-toggler-bar-3-transform-origin;\n        margin-top: $navbar-toggler-bar-3-margin-top;\n      }\n    }\n  }\n}\n\n@include media-breakpoint-down(lg) {\n  .navbar {\n    &.navbar-transparent {\n      .navbar-collapse {\n        padding-top: $spacer / 2;\n        padding-bottom: $spacer / 2;\n        box-shadow: $box-shadow-lg;\n      }\n\n      .navbar-collapse.collapsing {\n        background: $white;\n      }\n\n      .navbar-collapse.show {\n        background: $white;\n        .nav-link,\n        i {\n          color: $dark;\n        }\n      }\n    }\n\n    .g-sidenav-show & {\n      &:not(.sidenav).navbar-main {\n        .navbar-collapse {\n          display: flex !important;\n          flex-basis: auto;\n        }\n\n        .navbar-nav {\n          flex-direction: row;\n        }\n      }\n\n    }\n\n    .navbar-collapse {\n      .navbar-nav {\n        .dropdown .dropdown-menu {\n          box-shadow: none !important;\n\n          &:before {\n            display: none !important;\n          }\n        }\n      }\n    }\n  }\n}\n\n@include media-breakpoint-down(md) {\n  .navbar-collapse {\n    position: relative;\n\n    .navbar-nav {\n      width: 100%;\n\n      .nav-item {\n        &.dropdown {\n          position: static;\n\n          .dropdown-menu {\n            left: 0;\n            right: 0;\n\n            &.show {\n              &:before {\n                content: none;\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n@include media-breakpoint-down(sm) {\n  .navbar-nav {\n    .nav-item {\n      &.dropdown {\n        .dropdown-menu {\n          left: 0;\n          right: auto;\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_pagination.scss",
    "content": ".page-item {\n  &.active .page-link {\n    box-shadow: $pagination-active-box-shadow;\n  }\n\n  .page-link,\n  span {\n    display: $page-link-display;\n    align-items: $page-link-align-items;\n    justify-content: $page-link-justify-content;\n    color: $secondary;\n    padding: 0;\n    margin: $page-link-margin;\n    border-radius: $page-link-radius !important;\n    width: $page-link-width;\n    height: $page-link-height;\n    font-size: $font-size-sm;\n  }\n}\n\n.pagination-lg {\n  .page-item {\n    .page-link,\n    span {\n      width: $page-link-width-lg;\n      height: $page-link-height-lg;\n      line-height: $page-link-line-height-lg;\n    }\n  }\n}\n\n.pagination-sm {\n  .page-item {\n    .page-link,\n    span {\n      width: $page-link-width-sm;\n      height: $page-link-height-sm;\n      line-height: $page-link-line-height-sm;\n    }\n  }\n}\n\n\n// Colors\n.pagination {\n  @each $name, $value in $theme-gradient-colors {\n    &.pagination-#{$name} {\n      .page-item.active > .page-link {\n        &,\n        &:focus,\n        &:hover {\n          @include gradient-directional(nth($value, 1) 0%, nth($value, -1) 100%, $deg: 195deg);\n          border: none;\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_popovers.scss",
    "content": ".popover {\n  box-shadow: $popover-box-shadow;\n}\n\n// popover title\n.popover {\n  .popover-header {\n    font-weight: 600;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_progress.scss",
    "content": ".progress-bar {\n  height: $progress-bar-height;\n  border-radius: $border-radius-sm;\n}\n\n.progress {\n  overflow: visible;\n\n  &.progress-sm {\n    height: $progress-height-sm;\n  }\n  &.progress-lg {\n    height: $progress-height-lg;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_ripple.scss",
    "content": "// Ripple effect\n\n.ripple {\n  display: block;\n  position: absolute;\n  background: rgba($white, .3);\n  border-radius: 100%;\n  transform:scale(0);\n  animation:ripple 0.65s linear;\n\n}\n\n@keyframes ripple {\n    100% {opacity: 0; transform: scale(2.5);}\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_rtl-extend.scss",
    "content": "@include media-breakpoint-up(lg) {\n  .rtl {\n    .navbar-vertical {\n      .navbar-nav {\n        .collapse,\n        .collapsing {\n          .nav-item {\n            .nav-link {\n              &:before {\n                right: $rtl-sidebar-bullet-right !important;\n                left: auto !important;\n              }\n            }\n\n            .collapse,\n            .collapsing {\n              .nav {\n                padding-right: 0;\n              }\n            }\n          }\n        }\n      }\n    }\n\n    &.g-sidenav-hidden {\n      .navbar-vertical {\n        .navbar-nav {\n          .nav-item {\n            .collapse,\n            .collapsing {\n              .nav {\n                padding-right: 0;\n              }\n            }\n          }\n        }\n\n        &:hover {\n          .navbar-nav {\n            > .nav-item {\n              .collapse,\n              .collapsing {\n                .nav {\n                  padding-right: $rtl-sidebar-hover-padding-right;\n\n                  .nav-item {\n                    .collapse,\n                    .collapsing {\n                      .nav {\n                        padding-right: 0 !important;\n                      }\n                    }\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_rtl.scss",
    "content": "// breadcrumb\n\n.rtl {\n  .breadcrumb {\n    .breadcrumb-item + .breadcrumb-item::before {\n      float: right;\n      padding-left: $breadcrumb-item-padding-x;\n      padding-right: 0;\n    }\n  }\n\n  .sidenav {\n    .navbar-nav {\n      width: 100%;\n      padding-right: 0;\n    }\n  }\n\n  .fixed-plugin {\n    .fixed-plugin-button {\n      left: $fixed-plugin-right;\n      right: auto;\n    }\n\n    .card {\n      left: -$fixed-plugin-card-width !important;\n      right: auto;\n    }\n\n    &.show {\n      .card {\n        right: auto;\n        left: 0 !important;\n      }\n    }\n  }\n\n  .timeline {\n    .timeline-content {\n      margin-right: $timeline-content-margin-left;\n      margin-left: 0;\n    }\n\n    .timeline-step {\n      transform: $timeline-step-transform-rtl;\n    }\n\n    &.timeline-one-side {\n      &:before {\n        right: $timeline-left;\n      }\n\n      .timeline-step {\n        right: $timeline-left;\n      }\n    }\n  }\n\n  .form-check {\n    &.form-switch {\n      .form-check-input {\n        &:after {\n          transform: translateX(-$form-switch-translate-x-start);\n        }\n\n        &:checked:after {\n          transform: translateX($form-switch-translate-x-end);\n        }\n      }\n    }\n  }\n\n  .avatar-group {\n    .avatar + .avatar {\n      margin-left: 0;\n      margin-right: $avatar-group-double;\n    }\n  }\n\n  .dropdown {\n    .dropdown-menu {\n      left: 0;\n    }\n  }\n\n  .input-group {\n    .input-group-text {\n      border-left: 0;\n      border-top-left-radius: 0;\n      border-bottom-left-radius: 0;\n    }\n\n    & > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {\n      margin-right: -1px;\n      border-top-left-radius: $input-border-radius;\n      border-bottom-left-radius: $input-border-radius;\n    }\n\n    &:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3),\n    &:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {\n      border-top-right-radius: $input-border-radius;\n      border-bottom-right-radius: $input-border-radius;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_social-buttons.scss",
    "content": ".btn {\n  // social buttons\n  &.btn-facebook {\n    @include social-buttons-color($facebook, $facebook-states);\n  }\n  &.btn-twitter {\n    @include social-buttons-color($twitter, $twitter-states);\n  }\n  &.btn-pinterest {\n    @include social-buttons-color($pinterest, $pinterest-states);\n  }\n  &.btn-linkedin {\n    @include social-buttons-color($linkedin, $linkedin-states);\n  }\n  &.btn-dribbble {\n    @include social-buttons-color($dribbble, $dribbble-states);\n  }\n  &.btn-github {\n    @include social-buttons-color($github, $github-states);\n  }\n  &.btn-youtube {\n    @include social-buttons-color($youtube, $youtube-states);\n  }\n  &.btn-instagram {\n    @include social-buttons-color($instagram, $instagram-states);\n  }\n  &.btn-reddit {\n    @include social-buttons-color($reddit, $reddit-states);\n  }\n  &.btn-tumblr {\n    @include social-buttons-color($tumblr, $tumblr-states);\n  }\n  &.btn-behance {\n    @include social-buttons-color($behance, $behance-states);\n  }\n  &.btn-vimeo {\n    @include social-buttons-color($vimeo, $vimeo-states);\n  }\n  &.btn-slack {\n    @include social-buttons-color($slack, $slack-states);\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_tables.scss",
    "content": "// General styles\n\n.table {\n  thead th {\n    padding: $table-head-spacer-y $table-head-spacer-x;\n    text-transform: $table-head-text-transform;\n    letter-spacing: $table-head-letter-spacing;\n    border-bottom: $table-border-width solid $table-border-color;\n  }\n\n  th {\n    font-weight: $table-head-font-weight;\n  }\n\n  td {\n    .progress {\n      height: $table-progress-height;\n      width: $table-progress-width;\n      margin: $table-progress-margin;\n\n      .progress-bar {\n        height: $table-progress-height;\n      }\n    }\n  }\n\n  td,\n  th {\n    white-space: nowrap;\n  }\n  // Vetical align table content\n  &.align-items-center {\n    td,\n    th {\n      vertical-align: middle;\n    }\n  }\n  tbody{\n    tr:last-child{\n      td{\n        border-width: 0;\n      }\n    }\n  }\n\n  > :not(:last-child) > :last-child > * {\n    border-bottom-color: $light;\n  }\n\n  > :not(:first-child) {\n    border-top: (1 * $table-border-width) solid $table-group-separator-color;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_tilt.scss",
    "content": "// Tilt Animation\n.tilt {\n  -webkit-transform-style: $tilt-transform-style;\n  transform-style: $tilt-transform-style;\n\n  .up {\n    -webkit-transform: $tilt-transform-up-transform;\n    transform: $tilt-transform-up-transform !important;\n    transition: $tilt-transform-up-transition;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_timeline.scss",
    "content": "//\n// Timeline\n//\n\n\n.timeline {\n    position: relative;\n\n    // Axis\n\n    &:before {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: $timeline-left;\n        height: 100%;\n        border-right: $timeline-axis-width solid $timeline-axis-color;\n    }\n\n    &.timeline-dark{\n      &:before {\n        border-right-color: $timeline-axis-color-dark;\n      }\n    }\n}\n\n\n\n// Timeline blocks\n\n.timeline-block {\n    position: relative;\n\n    &:after {\n        content: \"\";\n        display: table;\n        clear: both;\n    }\n\n    &:first-child {\n        margin-top: 0;\n    }\n\n    &:last-child {\n        margin-bottom: 0;\n    }\n}\n\n// Timeline steps\n\n.timeline-step {\n    position: absolute;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    left: 0;\n    width: $timeline-step-width;\n    height: $timeline-step-height;\n    border-radius: $timeline-step-radius;\n    background: $timeline-step-bg;\n    // border: $timeline-step-border-width solid $timeline-step-border-color;\n    text-align: center;\n    transform: $timeline-step-transform;\n    font-size: $font-size-base;\n    font-weight: $font-weight-bold;\n    z-index: 1;\n\n    svg, i {\n        line-height: $timeline-step-line-height;\n    }\n}\n\n\n\n// Timeline content and body\n.timeline-content {\n    position: relative;\n    margin-left: $timeline-content-margin-left;\n    padding-top: $timeline-content-padding-top;\n    position: relative;\n    top: $timeline-content-top;\n\n    &:after {\n        content: \"\";\n        display: table;\n        clear: both;\n    }\n}\n\n\n@include media-breakpoint-up(lg) {\n    .timeline {\n        &:before {\n            left: 50%;\n            margin-left: -1px;\n        }\n    }\n\n    .timeline-step {\n        left: 50%;\n    }\n\n    .timeline-content {\n\n        width: 38%;\n    }\n\n    .timeline-block:nth-child(even) .timeline-content {\n        float: right;\n    }\n}\n\n// One side timeline\n\n.timeline-one-side {\n    &:before {\n        left: $timeline-left;\n    }\n\n    .timeline-step {\n        left: $timeline-left;\n    }\n\n    .timeline-content {\n        width: auto;\n    }\n\n    @include media-breakpoint-up(lg) {\n        .timeline-content {\n            max-width: 30rem;\n        }\n    }\n}\n\n.timeline-one-side .timeline-block:nth-child(even) .timeline-content {\n    float: none;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_tooltips.scss",
    "content": ".bs-tooltip-auto[x-placement^=right] .tooltip-arrow,\n.bs-tooltip-right .tooltip-arrow {\n  left: $tooltip-arrow-left;\n}\n\n.bs-tooltip-auto[x-placement^=left] .tooltip-arrow,\n.bs-tooltip-left .tooltip-arrow {\n  right: $tooltip-arrow-right;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_typography.scss",
    "content": "html *{\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n}\nbody {\n  font-weight: $font-weight-normal;\n  line-height: $p-line-height;\n}\n\nh1, .h1 {\n  font-size: $h1-font-size;\n  line-height: $h1-line-height;\n  letter-spacing: $btn-letter-spacing;\n\n  @include media-breakpoint-down(sm) {\n    font-size: rfs-fluid-value($h1-font-size);\n  }\n}\n\nh2, .h2 {\n  font-size: $h2-font-size;\n  line-height: $h2-line-height;\n  letter-spacing: $letter-wider;\n\n  @include media-breakpoint-down(sm) {\n    font-size: rfs-fluid-value($h2-font-size);\n  }\n}\n\nh3, .h3 {\n  font-size: $h3-font-size;\n  line-height: $h3-line-height;\n\n  @include media-breakpoint-down(sm) {\n    font-size: rfs-fluid-value($h3-font-size);\n  }\n}\n\nh4, .h4 {\n  font-size: $h4-font-size;\n  line-height: $h4-line-height;\n\n  @include media-breakpoint-down(sm) {\n    font-size: rfs-fluid-value($h4-font-size);\n  }\n}\n\nh5, .h5 {\n  font-size: $h5-font-size;\n  line-height: $h5-line-height;\n\n  @include media-breakpoint-down(sm) {\n    font-size: rfs-fluid-value($h5-font-size);\n  }\n}\n\nh6, .h6 {\n  font-size: $h6-font-size;\n  line-height: $h6-line-height;\n}\n\np, .p {\n  font-size: $font-size-base;\n  font-weight: $p-font-weight;\n  line-height: $p-line-height;\n}\n\n.lead {\n  font-size: $lead-font-size;\n  font-weight: $lead-font-weight;\n  line-height: $lead-line-height;\n}\n\nh1, .h1,\nh2, .h2,\nh3, .h3 {\n  font-weight: $font-weight-bold;\n  font-family: $font-family-roboto-slab;\n}\n\nh4, .h4,\nh5, .h5,\nh6, .h6 {\n  font-weight: $font-weight-bold;\n}\n\nh1, .h1,\nh2, .h2,\nh3, .h3,\nh4, .h4 {\n  letter-spacing: $letter-tighter;\n}\n\na {\n  letter-spacing: $letter-normal;\n  color: $dark;\n}\n\n.text-sm {\n  line-height: $text-sm-line-height;\n}\n.text-xs {\n  line-height: $text-xs-line-height;\n}\n\np, .p {\n  @include font-size($p-font-size);\n}\n.lead {\n  @include font-size($lead-font-size);\n}\n.text-lg {\n  @include font-size($font-size-lg !important);\n}\n.text-md {\n  @include font-size($p-font-size !important);\n}\n.text-sm {\n  @include font-size($font-size-sm !important);\n}\n.text-xs {\n  @include font-size($font-size-xs !important);\n}\n.text-xxs {\n  @include font-size($font-size-xxs !important);\n}\n\np {\n  line-height: 1.625;\n  font-weight: $font-weight-light;\n}\n\n// stylelint-disable declaration-no-important\n//\n// Text\n//\n.text-sans-serif {\n  font-family: $font-family-sans-serif !important;\n}\n.text-monospace {\n  font-family: $font-family-monospace !important;\n}\n\n// Alignment\n.text-justify {\n  text-align: justify !important;\n}\n\n.text-wrap {\n  white-space: normal !important;\n}\n\n.text-nowrap {\n  white-space: nowrap !important;\n}\n\n.text-truncate {\n  @include text-truncate();\n}\n\n// Weight and italics\n.font-weight-light {\n  font-weight: $font-weight-light !important;\n}\n\n.font-weight-lighter {\n  font-weight: $font-weight-lighter !important;\n}\n\n.font-weight-normal {\n  font-weight: $font-weight-normal !important;\n}\n\n.font-weight-bold {\n  font-weight: $font-weight-bold !important;\n}\n\n.font-weight-bolder {\n  font-weight: $font-weight-bolder !important;\n}\n\n.font-italic {\n  font-style: italic !important;\n}\n// Contextual colors\n\n.text-gradient {\n  background-clip: $text-gradient-bg-clip;\n  -webkit-background-clip: $text-gradient-bg-clip;\n  -webkit-text-fill-color: $text-gradient-text-fill;\n  position: $text-gradient-position;\n  z-index: $text-gradient-zindex;\n\n  &.text-primary {\n    background-image: $text-gradient-bg-primary;\n  }\n  &.text-info {\n    background-image: $text-gradient-bg-info;\n  }\n  &.text-success {\n    background-image: $text-gradient-bg-success;\n  }\n  &.text-warning {\n    background-image: $text-gradient-bg-warning;\n  }\n  &.text-danger {\n    background-image: $text-gradient-bg-danger;\n  }\n  &.text-dark {\n    background-image: $text-gradient-bg-dark;\n  }\n}\n\n.blockquote {\n  border-left: 3px solid $text-muted;\n  > span {\n    font-style: italic;\n  }\n}\n\n.text-muted {\n  color: $text-secondary !important;\n}\n\n.text-black-50 {\n  color: rgba($black, .5) !important;\n}\n\n.text-white-50 {\n  color: rgba($white, .5) !important;\n}\n\n.text-decoration-none {\n  text-decoration: none !important;\n}\n\n.text-break {\n  word-wrap: break-word !important;\n}\n// Reset\n.text-reset {\n  color: inherit !important;\n}\n\n// Letter Spacing\n\n.letter-wider {\n  letter-spacing: $letter-wider;\n}\n.letter-normal {\n  letter-spacing: $letter-normal;\n}\n.letter-tighter {\n  letter-spacing: $letter-tighter;\n}\n\n// Font Weight\n\n.text-lighter {\n  font-weight: $font-weight-lighter;\n}\n.text-light {\n  font-weight: $font-weight-light;\n}\n.text-normal {\n  font-weight: $font-weight-normal;\n}\n.text-bold {\n  font-weight: $font-weight-bold;\n}\n.text-bolder {\n  font-weight: $font-weight-bolder;\n}\n\n\n// Font Size\n\n.text-2xl {\n  font-size: $font-size-2xl;\n}\n.text-3xl {\n  font-size: $font-size-3xl;\n}\n.text-4xl {\n  font-size: $font-size-4xl;\n}\n.text-5xl {\n  font-size: $font-size-5xl;\n}\n.text-6xl {\n  font-size: $font-size-6xl;\n}\n.text-7xl {\n  font-size: $font-size-7xl;\n}\n.text-8xl {\n  font-size: $font-size-8xl;\n}\n.text-9xl {\n  font-size: $font-size-9xl;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_utilities-extend.scss",
    "content": "@each $name, $value in $max-width-dim{\n  .max-width-#{$name} {\n    max-width: $value !important;\n  }\n}\n\n@each $name, $value in $width-dim{\n  .width-#{$name} {\n    width: $value !important;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_utilities.scss",
    "content": "@import \"./bootstrap/functions\";\n@import \"./bootstrap/variables\";\n@import \"./bootstrap/utilities\";\n\n$utilities: (\n  // scss-docs-start utils-vertical-align\n  \"align\": (\n    property: vertical-align,\n    class: align,\n    values: baseline top middle bottom text-bottom text-top\n  ),\n  // scss-docs-end utils-vertical-align\n  // scss-docs-start utils-float\n  \"float\": (\n    responsive: true,\n    property: float,\n    values: (\n      start: left,\n      end: right,\n      none: none,\n    )\n  ),\n  // scss-docs-end utils-float\n  // scss-docs-start utils-overflow\n  \"overflow\": (\n    property: overflow,\n    values: auto hidden visible scroll,\n  ),\n  // scss-docs-end utils-overflow\n  // scss-docs-start utils-overflow-x\n  \"overflow-x\": (\n    property: overflow-x,\n    class: overflow-x,\n    values: auto hidden visible scroll,\n  ),\n  // scss-docs-end utils-overflow-x\n  // scss-docs-start utils-overflow-y\n  \"overflow-y\": (\n    property: overflow-y,\n    class: overflow-y,\n    values: auto hidden visible scroll,\n  ),\n  // scss-docs-end utils-overflow-y\n  // scss-docs-start utils-display\n  \"display\": (\n    responsive: true,\n    print: true,\n    property: display,\n    class: d,\n    values: inline inline-block block grid table table-row table-cell flex inline-flex none\n  ),\n  // scss-docs-end utils-display\n  // scss-docs-start utils-shadow\n  \"shadow\": (\n    property: box-shadow,\n    class: shadow,\n    values: (\n      null: $box-shadow,\n      sm: $box-shadow-sm,\n      lg: $box-shadow-lg,\n      xl: $box-shadow-xl,\n      none: none,\n    )\n  ),\n  // scss-docs-start utils-colored-shadow\n  \"colored-shadow\": (\n    property: box-shadow,\n    class: shadow,\n    values: (\n      primary: $box-shadow-primary,\n      secondary: $box-shadow-secondary,\n      info: $box-shadow-info,\n      warning: $box-shadow-warning,\n      success: $box-shadow-success,\n      danger: $box-shadow-danger,\n      dark: $box-shadow-dark,\n      light: $box-shadow-light,\n    )\n  ),\n  // scss-docs-end utils-colored-shadow\n  // scss-docs-start utils-position\n  \"position\": (\n    property: position,\n    values: static relative absolute fixed sticky\n  ),\n  \"top\": (\n    property: top,\n    values: $position-values\n  ),\n  \"bottom\": (\n    property: bottom,\n    values: $position-values\n  ),\n  \"start\": (\n    property: left,\n    class: start,\n    values: $position-values\n  ),\n  \"end\": (\n    property: right,\n    class: end,\n    values: $position-values\n  ),\n  \"translate-middle\": (\n    property: transform,\n    class: translate-middle,\n    values: (\n      null: translate(-50%, -50%),\n      x: translateX(-50%),\n      y: translateY(-50%),\n    )\n  ),\n  //Scale\n  \"transform\": (\n    property: transform,\n    class: transform-scale,\n    responsive: true,\n    values: (\n      5: scale(.5),\n      6: scale(.6),\n      7: scale(.7),\n      8: scale(.8),\n      9: scale(.9),\n      10: scale(1),\n    )\n  ),\n  // scss-docs-end utils-position\n  // scss-docs-start utils-borders\n  \"border\": (\n    property: border,\n    values: (\n      null: $border-width solid $border-color,\n      0: 0,\n    )\n  ),\n  \"border-top\": (\n    property: border-top,\n    responsive: true,\n    values: (\n      null: $border-width solid $border-color,\n      0: 0,\n    )\n  ),\n  \"border-end\": (\n    property: border-right,\n    responsive: true,\n    class: border-end,\n    values: (\n      null: $border-width solid $border-color,\n      0: 0,\n    )\n  ),\n  \"border-bottom\": (\n    property: border-bottom,\n    responsive: true,\n    values: (\n      null: $border-width solid $border-color,\n      0: 0,\n    )\n  ),\n  \"border-start\": (\n    property: border-left,\n    responsive: true,\n    class: border-start,\n    values: (\n      null: $border-width solid $border-color,\n      0: 0,\n    )\n  ),\n  \"border-color\": (\n    property: border-color,\n    class: border,\n    values: map-merge($theme-colors, (\"white\": $white))\n  ),\n  \"border-width\": (\n    property: border-width,\n    class: border,\n    values: $border-widths\n  ),\n  // scss-docs-end utils-borders\n  // Sizing utilities\n  // scss-docs-start utils-sizing\n  \"width\": (\n    property: width,\n    responsive: true,\n    class: w,\n    values: $width\n  ),\n  \"max-width\": (\n    property: max-width,\n    class: mw,\n    values: (100: 100%)\n  ),\n  \"viewport-width\": (\n    property: width,\n    class: vw,\n    values: (100: 100vw)\n  ),\n  \"min-viewport-width\": (\n    property: min-width,\n    class: min-vw,\n    values: (100: 100vw)\n  ),\n  \"height\": (\n    property: height,\n    class: h,\n    values: (\n      25: 25%,\n      50: 50%,\n      75: 75%,\n      100: 100%,\n      auto: auto\n    )\n  ),\n  \"max-height\": (\n    property: max-height,\n    class: mh,\n    values: (100: 100%)\n  ),\n  \"viewport-height\": (\n    property: height,\n    class: vh,\n    values: (100: 100vh)\n  ),\n  \"min-viewport-height\": (\n    property: min-height,\n    class: min-vh,\n    values: (\n      25: $section-height-25-min-height,\n      35: $section-height-35-min-height,\n      45: $section-height-45-min-height,\n      50: $section-height-50-min-height,\n      55: $section-height-55-min-height,\n      65: $section-height-65-min-height,\n      70: $section-height-70-min-height,\n      75: $section-height-75-min-height,\n      80: $section-height-80-min-height,\n      85: $section-height-85-min-height,\n      90: $section-height-90-min-height,\n      95: $section-height-95-min-height,\n      100: 100vh\n    )\n  ),\n  // scss-docs-end utils-sizing\n  // Flex utilities\n  // scss-docs-start utils-flex\n  \"flex\": (\n    responsive: true,\n    property: flex,\n    values: (fill: 1 1 auto)\n  ),\n  \"flex-direction\": (\n    responsive: true,\n    property: flex-direction,\n    class: flex,\n    values: row column row-reverse column-reverse\n  ),\n  \"flex-grow\": (\n    responsive: true,\n    property: flex-grow,\n    class: flex,\n    values: (\n      grow-0: 0,\n      grow-1: 1,\n    )\n  ),\n  \"flex-shrink\": (\n    responsive: true,\n    property: flex-shrink,\n    class: flex,\n    values: (\n      shrink-0: 0,\n      shrink-1: 1,\n    )\n  ),\n  \"flex-wrap\": (\n    responsive: true,\n    property: flex-wrap,\n    class: flex,\n    values: wrap nowrap wrap-reverse\n  ),\n  \"gap\": (\n    responsive: true,\n    property: gap,\n    class: gap,\n    values: $spacers\n  ),\n  \"justify-content\": (\n    responsive: true,\n    property: justify-content,\n    values: (\n      start: flex-start,\n      end: flex-end,\n      center: center,\n      between: space-between,\n      around: space-around,\n      evenly: space-evenly,\n    )\n  ),\n  \"align-items\": (\n    responsive: true,\n    property: align-items,\n    values: (\n      start: flex-start,\n      end: flex-end,\n      center: center,\n      baseline: baseline,\n      stretch: stretch,\n    )\n  ),\n  \"align-content\": (\n    responsive: true,\n    property: align-content,\n    values: (\n      start: flex-start,\n      end: flex-end,\n      center: center,\n      between: space-between,\n      around: space-around,\n      stretch: stretch,\n    )\n  ),\n  \"align-self\": (\n    responsive: true,\n    property: align-self,\n    values: (\n      auto: auto,\n      start: flex-start,\n      end: flex-end,\n      center: center,\n      baseline: baseline,\n      stretch: stretch,\n    )\n  ),\n  \"order\": (\n    responsive: true,\n    property: order,\n    values: (\n      first: -1,\n      0: 0,\n      1: 1,\n      2: 2,\n      3: 3,\n      4: 4,\n      5: 5,\n      last: 6,\n    ),\n  ),\n  // scss-docs-end utils-flex\n  // Margin utilities\n  // scss-docs-start utils-spacing\n  \"margin\": (\n    responsive: true,\n    property: margin,\n    class: m,\n    values: map-merge($spacers, (auto: auto))\n  ),\n  \"margin-x\": (\n    responsive: true,\n    property: margin-right margin-left,\n    class: mx,\n    values: map-merge($spacers, (auto: auto))\n  ),\n  \"margin-y\": (\n    responsive: true,\n    property: margin-top margin-bottom,\n    class: my,\n    values: map-merge($spacers, (auto: auto))\n  ),\n  \"margin-top\": (\n    responsive: true,\n    property: margin-top,\n    class: mt,\n    values: map-merge($spacers, (auto: auto))\n  ),\n  \"margin-end\": (\n    responsive: true,\n    property: margin-right,\n    class: me,\n    values: map-merge($spacers, (auto: auto))\n  ),\n  \"margin-bottom\": (\n    responsive: true,\n    property: margin-bottom,\n    class: mb,\n    values: map-merge($spacers, (auto: auto))\n  ),\n  \"margin-start\": (\n    responsive: true,\n    property: margin-left,\n    class: ms,\n    values: map-merge($spacers, (auto: auto))\n  ),\n  // Negative margin utilities\n  \"negative-margin\": (\n    responsive: true,\n    property: margin,\n    class: m,\n    values: $negative-spacers\n  ),\n  \"negative-margin-x\": (\n    responsive: true,\n    property: margin-right margin-left,\n    class: mx,\n    values: $negative-spacers\n  ),\n  \"negative-margin-y\": (\n    responsive: true,\n    property: margin-top margin-bottom,\n    class: my,\n    values: $negative-spacers\n  ),\n  \"negative-margin-top\": (\n    responsive: true,\n    property: margin-top,\n    class: mt,\n    values: $negative-spacers\n  ),\n  \"negative-margin-end\": (\n    responsive: true,\n    property: margin-right,\n    class: me,\n    values: $negative-spacers\n  ),\n  \"negative-margin-bottom\": (\n    responsive: true,\n    property: margin-bottom,\n    class: mb,\n    values: $negative-spacers\n  ),\n  \"negative-margin-start\": (\n    responsive: true,\n    property: margin-left,\n    class: ms,\n    values: $negative-spacers\n  ),\n  // Padding utilities\n  \"padding\": (\n    responsive: true,\n    property: padding,\n    class: p,\n    values: $spacers\n  ),\n  \"padding-x\": (\n    responsive: true,\n    property: padding-right padding-left,\n    class: px,\n    values: $spacers\n  ),\n  \"padding-y\": (\n    responsive: true,\n    property: padding-top padding-bottom,\n    class: py,\n    values: $spacers\n  ),\n  \"padding-top\": (\n    responsive: true,\n    property: padding-top,\n    class: pt,\n    values: $spacers\n  ),\n  \"padding-end\": (\n    responsive: true,\n    property: padding-right,\n    class: pe,\n    values: $spacers\n  ),\n  \"padding-bottom\": (\n    responsive: true,\n    property: padding-bottom,\n    class: pb,\n    values: $spacers\n  ),\n  \"padding-start\": (\n    responsive: true,\n    property: padding-left,\n    class: ps,\n    values: $spacers\n  ),\n  // scss-docs-end utils-spacing\n  // Text\n  // scss-docs-start utils-text\n  \"font-family\": (\n    property: font-family,\n    class: font,\n    values: (monospace: var(--#{$variable-prefix}font-monospace))\n  ),\n  \"font-size\": (\n    rfs: true,\n    property: font-size,\n    class: fs,\n    values: $font-sizes\n  ),\n  \"font-style\": (\n    property: font-style,\n    class: fst,\n    values: italic normal\n  ),\n  \"font-weight\": (\n    property: font-weight,\n    class: fw,\n    values: (\n      light: $font-weight-light,\n      lighter: $font-weight-lighter,\n      normal: $font-weight-normal,\n      bold: $font-weight-bold,\n      bolder: $font-weight-bolder\n    )\n  ),\n  \"line-height\": (\n    property: line-height,\n    class: lh,\n    values: (\n      1: 1,\n      sm: $line-height-sm,\n      base: $line-height-base,\n      lg: $line-height-lg,\n    )\n  ),\n  \"text-align\": (\n    responsive: true,\n    property: text-align,\n    class: text,\n    values: (\n      start: left,\n      end: right,\n      center: center,\n    )\n  ),\n  \"text-decoration\": (\n    property: text-decoration,\n    values: none underline line-through\n  ),\n  \"text-transform\": (\n    property: text-transform,\n    class: text,\n    values: lowercase uppercase capitalize\n  ),\n  \"white-space\": (\n    property: white-space,\n    class: text,\n    values: (\n      wrap: normal,\n      nowrap: nowrap,\n    )\n  ),\n  \"word-wrap\": (\n    property: word-wrap word-break,\n    class: text,\n    values: (break: break-word),\n    rtl: false\n  ),\n  // scss-docs-end utils-text\n  // scss-docs-start utils-color\n  \"color\": (\n    property: color,\n    class: text,\n    values: map-merge(\n      $theme-colors,\n      (\n        \"white\": $white,\n        \"body\": $body-color,\n        \"rose\": $rose,\n        \"muted\": $text-muted,\n        \"black-50\": rgba($black, .5),\n        \"white-50\": rgba($white, .5),\n        \"reset\": inherit,\n      )\n    )\n  ),\n  // scss-docs-end utils-color\n  // scss-docs-start utils-bg-color\n  \"background-color\": (\n    property: background-color,\n    class: bg,\n    values: map-merge(\n      $theme-colors,\n      (\n        \"body\": $body-bg,\n        \"white\": $white,\n        \"transparent\": transparent,\n        \"gray-100\": $gray-100,\n        \"gray-200\": $gray-200,\n        \"gray-300\": $gray-300,\n        \"gray-400\": $gray-400,\n        \"gray-500\": $gray-500,\n        \"gray-600\": $gray-600,\n        \"gray-700\": $gray-700,\n        \"gray-800\": $gray-800,\n        \"gray-900\": $gray-900,\n      )\n    )\n  ),\n  // scss-docs-end utils-bg-color\n  \"gradient\": (\n    property: background-image,\n    class: bg,\n    values: (gradient: var(--#{$variable-prefix}gradient))\n  ),\n  // scss-docs-start utils-interaction\n  \"user-select\": (\n    property: user-select,\n    values: all auto none\n  ),\n  \"pointer-events\": (\n    property: pointer-events,\n    class: pe,\n    values: none auto,\n  ),\n  // scss-docs-end utils-interaction\n  // scss-docs-start utils-border-radius\n  \"rounded\": (\n    property: border-radius,\n    class: rounded,\n    values: (\n      null: $border-radius,\n      0: 0,\n      1: $border-radius-sm,\n      2: $border-radius,\n      3: $border-radius-lg,\n      circle: 50%,\n      pill: $border-radius-pill\n    )\n  ),\n  \"rounded-top\": (\n    property: border-top-left-radius border-top-right-radius,\n    class: rounded-top,\n    values: (null: $border-radius)\n  ),\n  \"rounded-end\": (\n    property: border-top-right-radius border-bottom-right-radius,\n    class: rounded-end,\n    values: (null: $border-radius)\n  ),\n  \"rounded-bottom\": (\n    property: border-bottom-right-radius border-bottom-left-radius,\n    class: rounded-bottom,\n    values: (null: $border-radius)\n  ),\n  \"rounded-start\": (\n    property: border-bottom-left-radius border-top-left-radius,\n    class: rounded-start,\n    values: (null: $border-radius)\n  ),\n  // scss-docs-end utils-border-radius\n  // scss-docs-start utils-visibility\n  \"visibility\": (\n    property: visibility,\n    class: null,\n    values: (\n      visible: visible,\n      invisible: hidden,\n    )\n  ),\n  // Opacity utilities\n  \"opacity\": (\n    property: opacity,\n    values: (\n      0: 0,\n      1: .1,\n      2: .2,\n      3: .3,\n      4: .4,\n      5: .5,\n      6: .6,\n      7: .7,\n      8: .8,\n      9: .9,\n      10: 1\n    ),\n  ),\n  // Z-index utilities\n  \"z-index\": (\n    property: z-index,\n    values: (\n      0: 0,\n      1: 1,\n      2: 2,\n      3: 3\n    ),\n  ),\n  // Letter spacing utilities\n  \"letter-spacing\": (\n    property: letter-spacing,\n    values: (\n      1: 1px,\n      2: 2px,\n      3: 3px,\n      4: 4px,\n      5: 5px\n    ),\n  ),\n  // Border radius utilities\n  \"border-top-left-radius\": (\n    property: border-top-left-radius,\n    class: border-radius-top-start,\n    responsive: true,\n    values: (\n      null: $border-radius,\n      0: 0,\n      sm: $border-radius-sm,\n      md: $border-radius,\n      lg: $border-radius-lg,\n      xl: $border-radius-xl,\n      2xl: $border-radius-2xl,\n      circle: 50%,\n      pill: $border-radius-pill\n     )\n    ),\n  \"border-top-right-radius\": (\n    property: border-top-right-radius,\n    class: border-radius-top-end,\n    responsive: true,\n    values: (\n      null: $border-radius,\n      0: 0,\n      sm: $border-radius-sm,\n      md: $border-radius,\n      lg: $border-radius-lg,\n      xl: $border-radius-xl,\n      2xl: $border-radius-2xl,\n      circle: 50%,\n      pill: $border-radius-pill\n    )\n  ),\n  \"border-bottom-left-radius\": (\n    property: border-bottom-left-radius,\n    class: border-radius-bottom-start,\n    responsive: true,\n    values: (\n      null: $border-radius,\n      0: 0,\n      sm: $border-radius-sm,\n      md: $border-radius,\n      lg: $border-radius-lg,\n      xl: $border-radius-xl,\n      2xl: $border-radius-2xl,\n      circle: 50%,\n      pill: $border-radius-pill\n    )\n  ),\n  \"border-bottom-right-radius\": (\n    property: border-bottom-right-radius,\n    class: border-radius-bottom-end,\n    responsive: true,\n    values: (\n      null: $border-radius,\n      0: 0,\n      sm: $border-radius-sm,\n      md: $border-radius,\n      lg: $border-radius-lg,\n      xl: $border-radius-xl,\n      2xl: $border-radius-2xl,\n      circle: 50%,\n      pill: $border-radius-pill\n    )\n  ),\n  // Max Height Values\n \"max-height-px\": (\n   property: max-height,\n   class: max-height,\n   values: (\n    100: $max-height-100,\n    150: $max-height-150,\n    160: $max-height-160,\n    200: $max-height-200,\n    250: $max-height-250,\n    300: $max-height-300,\n    400: $max-height-400,\n    500: $max-height-500,\n    600: $max-height-600\n   )\n ),\n  // Max Height Values vh\n \"max-height-vh\": (\n   property: max-height,\n   class: max-height-vh,\n   values: (\n    10: $max-height-vh-10,\n    20: $max-height-vh-20,\n    30: $max-height-vh-30,\n    40: $max-height-vh-40,\n    50: $max-height-vh-50,\n    60: $max-height-vh-60,\n    70: $max-height-vh-70,\n    80: $max-height-vh-80,\n    90: $max-height-vh-90,\n    100: $max-height-vh-100,\n   )\n ),\n // Min Height Values\n  \"min-height-px\": (\n    property: min-height,\n    class: min-height,\n    values: (\n     100: $min-height-100,\n     150: $min-height-150,\n     160: $min-height-160,\n     200: $min-height-200,\n     250: $min-height-250,\n     300: $min-height-300,\n     400: $min-height-400,\n     500: $min-height-500,\n     600: $min-height-600\n    )\n  ),\n  // Height Values\n  \"height-px\": (\n    property: height,\n    class: height,\n    values: (\n     100: $height-100,\n     200: $height-200,\n     300: $height-300,\n     400: $height-400,\n     500: $height-500,\n     600: $height-600\n    )\n  ),\n  // Max Width Values\n   \"max-width-px\": (\n     property: max-width,\n     class: max-width,\n     values: (\n      100: $max-width-100,\n      200: $max-width-200,\n      300: $max-width-300,\n      400: $max-width-400,\n      500: $max-width-500\n     )\n   ),\n);\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/_variables.scss",
    "content": "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// $soft-background-color: #fbfbfb !default;\n$soft-background-color: #ffffff !default; // Testing\n$font-color:            #7b809a !default;\n$h-color:               #344767 !default;\n\n// Color system\n\n$white:    #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #f0f2f5 !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black:    #000 !default;\n\n// fusv-enable\n\n$blue:    #63B3ED !default;\n$indigo:  #596CFF !default;\n$purple:  #6f42c1 !default;\n$pink:    #d63384 !default;\n$red:     #F56565 !default;\n$rose:    #e91e63 !default;\n$orange:  #fd7e14 !default;\n$yellow:  #FBD38D !default;\n$green:   #81E6D9 !default;\n$teal:    #20c997 !default;\n$cyan:    #0dcaf0 !default;\n\n// scss-docs-start colors-map\n$colors: (\n  \"blue\":       $blue,\n  \"indigo\":     $indigo,\n  \"purple\":     $purple,\n  \"pink\":       $pink,\n  \"red\":        $red,\n  \"orange\":     $orange,\n  \"yellow\":     $yellow,\n  \"green\":      $green,\n  \"teal\":       $teal,\n  \"cyan\":       $cyan,\n  \"white\":      $white,\n  \"gray\":       $gray-600,\n  \"gray-dark\":  $gray-800,\n) !default;\n// scss-docs-end colors-map\n\n$primary:       #e91e63 !default;\n$secondary:     #7b809a !default;\n$info:          #1A73E8 !default;\n$success:       #4CAF50 !default;\n$warning:       #fb8c00 !default;\n$danger:        #F44335 !default;\n$light:         $gray-200 !default;\n$dark:          $h-color !default;\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n  \"primary\":    $primary,\n  \"secondary\":  $secondary,\n  \"success\":    $success,\n  \"info\":       $info,\n  \"warning\":    $warning,\n  \"danger\":     $danger,\n  \"light\":      $light,\n  \"dark\":       $dark,\n  \"white\":      $white\n) !default;\n// scss-docs-end theme-colors-map\n\n\n// Gradient colors\n$primary-gradient:            #EC407A !default;\n$primary-gradient-state:      #D81B60 !default;\n\n$secondary-gradient:          #747b8a !default;\n$secondary-gradient-state:    #495361 !default;\n\n$info-gradient:               #49a3f1 !default;\n$info-gradient-state:         #1A73E8 !default;\n\n$success-gradient:            #66BB6A !default;\n$success-gradient-state:      #43A047 !default;\n\n$danger-gradient:             #EF5350 !default;\n$danger-gradient-state:       #E53935 !default;\n\n$warning-gradient:            #FFA726 !default;\n$warning-gradient-state:      #FB8C00 !default;\n\n$dark-gradient:               #42424a !default;\n$dark-gradient-state:         #191919 !default;\n\n$light-gradient:              #EBEFF4 !default;\n$light-gradient-state:        #CED4DA !default;\n\n$dark-gradient-dark:          #323a54 !default;\n$dark-gradient-state-dark:    #1a2035 !default;\n\n// Gradient Colors map\n$theme-gradient-colors: (\n  \"primary\":    ($primary-gradient, $primary-gradient-state),\n  \"secondary\":  ($secondary-gradient, $secondary-gradient-state),\n  \"success\":    ($success-gradient, $success-gradient-state),\n  \"info\":       ($info-gradient, $info-gradient-state),\n  \"warning\":    ($warning-gradient, $warning-gradient-state),\n  \"danger\":     ($danger-gradient, $danger-gradient-state),\n  \"light\":      ($light-gradient, $light-gradient-state),\n  \"dark\":       ($dark-gradient, $dark-gradient-state)\n) !default;\n\n// Set a specific jump point for requesting color jumps\n$theme-color-interval:        8% !default;\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio:          4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark:         $black !default;\n$color-contrast-light:        $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 8) !default;\n$blue-200: tint-color($blue, 6) !default;\n$blue-300: tint-color($blue, 4) !default;\n$blue-400: tint-color($blue, 2) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 2) !default;\n$blue-700: shade-color($blue, 4) !default;\n$blue-800: shade-color($blue, 6) !default;\n$blue-900: shade-color($blue, 8) !default;\n\n$indigo-100: tint-color($indigo, 8) !default;\n$indigo-200: tint-color($indigo, 6) !default;\n$indigo-300: tint-color($indigo, 4) !default;\n$indigo-400: tint-color($indigo, 2) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 2) !default;\n$indigo-700: shade-color($indigo, 4) !default;\n$indigo-800: shade-color($indigo, 6) !default;\n$indigo-900: shade-color($indigo, 8) !default;\n\n$purple-100: tint-color($purple, 8) !default;\n$purple-200: tint-color($purple, 6) !default;\n$purple-300: tint-color($purple, 4) !default;\n$purple-400: tint-color($purple, 2) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 2) !default;\n$purple-700: shade-color($purple, 4) !default;\n$purple-800: shade-color($purple, 6) !default;\n$purple-900: shade-color($purple, 8) !default;\n\n$pink-100: tint-color($pink, 8) !default;\n$pink-200: tint-color($pink, 6) !default;\n$pink-300: tint-color($pink, 4) !default;\n$pink-400: tint-color($pink, 2) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 2) !default;\n$pink-700: shade-color($pink, 4) !default;\n$pink-800: shade-color($pink, 6) !default;\n$pink-900: shade-color($pink, 8) !default;\n\n$red-100: tint-color($red, 8) !default;\n$red-200: tint-color($red, 6) !default;\n$red-300: tint-color($red, 4) !default;\n$red-400: tint-color($red, 2) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 2) !default;\n$red-700: shade-color($red, 4) !default;\n$red-800: shade-color($red, 6) !default;\n$red-900: shade-color($red, 8) !default;\n\n$orange-100: tint-color($orange, 8) !default;\n$orange-200: tint-color($orange, 6) !default;\n$orange-300: tint-color($orange, 4) !default;\n$orange-400: tint-color($orange, 2) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 2) !default;\n$orange-700: shade-color($orange, 4) !default;\n$orange-800: shade-color($orange, 6) !default;\n$orange-900: shade-color($orange, 8) !default;\n\n$yellow-100: tint-color($yellow, 8) !default;\n$yellow-200: tint-color($yellow, 6) !default;\n$yellow-300: tint-color($yellow, 4) !default;\n$yellow-400: tint-color($yellow, 2) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 2) !default;\n$yellow-700: shade-color($yellow, 4) !default;\n$yellow-800: shade-color($yellow, 6) !default;\n$yellow-900: shade-color($yellow, 8) !default;\n\n$green-100: tint-color($green, 8) !default;\n$green-200: tint-color($green, 6) !default;\n$green-300: tint-color($green, 4) !default;\n$green-400: tint-color($green, 2) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 2) !default;\n$green-700: shade-color($green, 4) !default;\n$green-800: shade-color($green, 6) !default;\n$green-900: shade-color($green, 8) !default;\n\n$teal-100: tint-color($teal, 8) !default;\n$teal-200: tint-color($teal, 6) !default;\n$teal-300: tint-color($teal, 4) !default;\n$teal-400: tint-color($teal, 2) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 2) !default;\n$teal-700: shade-color($teal, 4) !default;\n$teal-800: shade-color($teal, 6) !default;\n$teal-900: shade-color($teal, 8) !default;\n\n$cyan-100: tint-color($cyan, 8) !default;\n$cyan-200: tint-color($cyan, 6) !default;\n$cyan-300: tint-color($cyan, 4) !default;\n$cyan-400: tint-color($cyan, 2) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 2) !default;\n$cyan-700: shade-color($cyan, 4) !default;\n$cyan-800: shade-color($cyan, 6) !default;\n$cyan-900: shade-color($cyan, 8) !default;\n// fusv-enable\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n  (\"<\", \"%3c\"),\n  (\">\", \"%3e\"),\n  (\"#\", \"%23\"),\n  (\"(\", \"%28\"),\n  (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret:                true !default;\n$enable-rounded:              true !default;\n$enable-shadows:              false !default;\n$enable-gradients:            false !default;\n$enable-transitions:          true !default;\n$enable-reduced-motion:       true !default;\n$enable-grid-classes:         true !default;\n$enable-button-pointers:      true !default;\n$enable-rfs:                  true !default;\n$enable-validation-icons:     true !default;\n$enable-negative-margins:     true !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities:  true !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n$spacer: 1rem !default;\n$spacers: (\n  0: 0,\n  1: $spacer / 4,\n  2: $spacer / 2,\n  3: $spacer,\n  4: $spacer * 1.5,\n  5: $spacer * 3,\n  6: $spacer * 4,\n  7: $spacer * 6,\n  8: $spacer * 8,\n  9: $spacer * 10,\n  10: $spacer * 12,\n  11: $spacer * 14,\n  12: $spacer * 16,\n) !default;\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n$position-values: (\n  0: 0,\n  1: 1%,\n  2: 2%,\n  3: 3%,\n  4: 4%,\n  5: 5%,\n  6: 6%,\n  7: 7%,\n  8: 8%,\n  9: 9%,\n  10: 10%,\n  50: 50%,\n  100: 100%\n) !default;\n\n\n// Body\n//\n// Settings for the `<body>` element.\n\n$body-bg:                   $white !default;\n$body-color:                $font-color !default;\n$body-text-align:           null !default;\n\n\n// Links\n//\n// Style anchor elements.\n\n$link-color:                              $primary !default;\n$link-decoration:                         none !default;\n$link-hover-color:                        $link-color !default;\n$link-hover-decoration:                   none !default;\n// Darken percentage for links with `.text-*` class (e.g. `.text-success`)\n$emphasized-link-hover-darken-percentage: 15% !default;\n\n$stretched-link-pseudo-element:           after !default;\n$stretched-link-z-index:                  1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom:   1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n  xs: 0,\n  sm: 576px,\n  md: 768px,\n  lg: 992px,\n  xl: 1200px,\n  xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n  sm: 540px,\n  md: 720px,\n  lg: 960px,\n  xl: 1140px,\n  xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns:                12 !default;\n$grid-gutter-width:           1.5rem !default;\n$grid-row-columns:            6 !default;\n\n$gutters: $spacers !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n$border-width:                1px !default;\n$border-color:                $gray-300 !default;\n\n$border-radius-xs:            .1rem !default;\n$border-radius-sm:            .125rem !default;\n$border-radius-md:            .375rem !default;\n$border-radius-lg:            .5rem !default;\n$border-radius-xl:            .75rem !default;\n$border-radius-2xl:           1rem !default;\n$border-radius-section:       10rem !default;\n\n$border-widths: (\n  0: 0,\n  1: 1px,\n  2: 2px,\n  3: 3px,\n  4: 4px,\n  5: 5px\n) !default;\n\n$rounded-pill:                50rem !default;\n\n$box-shadow-xs:               0 2px 9px -5px rgba($black, 0.15) !default;\n$box-shadow-sm:               0 .3125rem .625rem 0 rgba(0, 0, 0, 0.12) !default;\n$box-shadow:                  0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06) !default;\n$box-shadow-lg:               0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05) !default;\n$box-shadow-xl:               0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04) !default;\n$box-shadow-inset:            inset 0 1px 2px rgba($black, .075) !default;\n\n// colored Shadows\n\n$box-shadow-primary:          0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(233, 30, 99, .4) !default;\n$box-shadow-secondary:        0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(210, 210, 210, .4) !default;\n$box-shadow-info:             0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(0, 188, 212, .4) !default;\n$box-shadow-warning:          0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(255, 152, 0, .4) !default;\n$box-shadow-success:          0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(76, 175, 80, .4) !default;\n$box-shadow-danger:           0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(244, 67, 54, .4) !default;\n$box-shadow-dark:             0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(64, 64, 64, .4) !default;\n$box-shadow-light:            0 4px 20px 0 rgba(0, 0, 0, .14), 0 7px 10px -5px rgba(233, 30, 99, .4) !default;\n\n$component-active-color:      $white !default;\n$component-active-bg:         $primary !default;\n\n$caret-width:                 .3em !default;\n$caret-vertical-align:        $caret-width * .85 !default;\n$caret-spacing:               $caret-width * .85 !default;\n\n$transition-base:             all .2s ease-in-out !default;\n$transition-fade:             opacity .15s linear !default;\n$transition-collapse:         height .35s ease !default;\n$transition-material:         all .3s ease !default;\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n  \"1x1\": 100%,\n  \"4x3\": calc(3 / 4 * 100%),\n  \"16x9\": calc(9 / 16 * 100%),\n  \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// stylelint-disable value-keyword-case\n$font-family-sans-serif:      'Roboto', Helvetica, Arial, sans-serif !default;\n$font-family-monospace:       SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n$font-family-roboto-slab:     'Roboto Slab', sans-serif !default;\n\n// stylelint-enable value-keyword-case\n$font-family-base:            var(--bs-font-sans-serif) !default;\n$font-family-code:            var(--bs-font-monospace) !default;\n\n// $font-size-root effects the value of `rem`, which is used for as well font sizes, paddings and margins\n// $font-size-base effects the font size of the body text\n$font-size-root:              null !default;\n$font-size-base:              1rem !default; // Assumes the browser default, typically `16px`\n$font-size-xxs:               $font-size-base * .65 !default;\n$font-size-xs:                $font-size-base * .75 !default;\n$font-size-sm:                $font-size-base * .875 !default;\n$font-size-lg:                $font-size-base * 1.125 !default;\n$font-size-xl:                $font-size-base * 1.25 !default;\n$font-size-2xl:               $font-size-base * 1.5 !default;\n$font-size-3xl:               $font-size-base * 1.875 !default;\n$font-size-4xl:               $font-size-base * 2 !default;\n$font-size-5xl:               $font-size-base * 2.25 !default;\n$font-size-6xl:               $font-size-base * 3 !default;\n$font-size-7xl:               $font-size-base * 3.75 !default;\n$font-size-8xl:               $font-size-base * 4 !default;\n$font-size-9xl:               $font-size-base * 5 !default;\n\n$font-weight-lighter:         lighter !default;\n$font-weight-light:           300 !default;\n$font-weight-normal:          400 !default;\n$font-weight-bold:            600 !default;\n$font-weight-bolder:          700 !default;\n\n$font-weight-base:            $font-weight-normal !default;\n\n$h1-font-weight:              $font-weight-bold !default;\n$h2-font-weight:              $font-weight-bold !default;\n$h3-font-weight:              $font-weight-bold !default;\n$h4-font-weight:              $font-weight-bold !default;\n$h5-font-weight:              $font-weight-bold !default;\n$h6-font-weight:              $font-weight-bold !default;\n$p-font-weight:               $font-weight-normal !default;\n$lead-font-weight:            $font-weight-normal !default;\n$text-sm-font-weight:         $font-weight-normal !default;\n$text-xs-font-weight:         $font-weight-normal !default;\n\n$line-height:                 1.75rem !default;\n$line-height-base:            1.5 !default;\n$line-height-sm:              1.25 !default;\n$line-height-lg:              2 !default;\n\n$h1-line-height:              1.25 !default;\n$h2-line-height:              1.3 !default;\n$h3-line-height:              1.375 !default;\n$h4-line-height:              1.375 !default;\n$h5-line-height:              1.375 !default;\n$h6-line-height:              1.625 !default;\n$p-line-height:               1.6 !default;\n$lead-line-height:            1.625 !default;\n$text-sm-line-height:         1.5 !default;\n$text-xs-line-height:         1.25 !default;\n\n$font-size-base:              1rem !default; // Assumes the browser default, typically `16px`\n$h1-font-size:                $font-size-base * 3 !default;\n$h2-font-size:                $font-size-base * 2.25 !default;\n$h3-font-size:                $font-size-base * 1.875 !default;\n$h4-font-size:                $font-size-base * 1.5 !default;\n$h5-font-size:                $font-size-base * 1.25 !default;\n$h6-font-size:                $font-size-base !default;\n$lead-font-size:              $font-size-base * 1.25 !default;\n\n\n$text-sm-font-size:           .875rem !default;\n$text-xs-font-size:           .75rem !default;\n$p-font-size:                 1rem !default;\n\n$headings-margin-bottom:      $spacer / 2 !default;\n$headings-font-family:        null !default;\n$headings-font-style:         null !default;\n$headings-font-weight:        400 !default;\n$headings-line-height:        1.2 !default;\n$headings-color:              #344767 !default;\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n  1: 5rem,\n  2: 4.5rem,\n  3: 4rem,\n  4: 3.5rem,\n  5: 3rem,\n  6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n$lead-font-size:              $font-size-base * 1.25 !default;\n$lead-font-weight:            300 !default;\n\n$small-font-size:             .875em !default;\n\n$sub-sup-font-size:           .75em !default;\n\n$text-secondary:              $font-color !default;\n$text-muted:                  $gray-600 !default;\n\n// text gradient\n$text-gradient-bg-clip:       text !default;\n$text-gradient-text-fill:     transparent !default;\n$text-gradient-position:      relative !default;\n$text-gradient-zindex:        1 !default;\n$text-gradient-bg-primary:    linear-gradient(195deg, $primary-gradient, $primary-gradient-state) !default;\n$text-gradient-bg-info:       linear-gradient(195deg, $info-gradient, $info-gradient-state) !default;\n$text-gradient-bg-success:    linear-gradient(195deg, $success-gradient, $success-gradient-state) !default;\n$text-gradient-bg-warning:    linear-gradient(195deg, $warning-gradient, $warning-gradient-state) !default;\n$text-gradient-bg-danger:     linear-gradient(195deg, $danger-gradient, $danger-gradient-state) !default;\n$text-gradient-bg-dark:       linear-gradient(195deg, $dark-gradient, $dark-gradient-state) !default;\n\n$initialism-font-size:        $small-font-size !default;\n\n$blockquote-margin-y:         $spacer !default;\n$blockquote-font-size:        $font-size-base * 1.25 !default;\n$blockquote-footer-color:     $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y:                 $spacer !default;\n$hr-color:                    inherit !default;\n$hr-height:                   $border-width !default;\n$hr-opacity:                  .25 !default;\n\n$legend-margin-bottom:        .5rem !default;\n$legend-font-size:            1.5rem !default;\n$legend-font-weight:          null !default;\n\n$mark-padding:                .2em !default;\n\n$dt-font-weight:              $font-weight-bold !default;\n\n$nested-kbd-font-weight:      $font-weight-bold !default;\n\n$list-inline-padding:         .5rem !default;\n\n$mark-bg:                     #fcf8e3 !default;\n\n// Letter Spacing\n$letter-wider:                .05rem !default;\n$letter-normal:               0rem !default;\n$letter-tighter:              -0.05rem !default;\n$h1-letter-spacing:           0.1rem !default;\n$a-letter-spacing:            -0.025rem !default;\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n$table-head-spacer-y:         .75rem !default;\n$table-head-spacer-x:         1.5rem !default;\n$table-head-font-size:        .65rem !default;\n$table-head-font-weight:      $font-weight-bold !default;\n$table-head-text-transform:   capitalize !default;\n$table-head-letter-spacing:   0px !default;\n$table-head-bg:               $gray-100 !default;\n$table-head-color:            $gray-600 !default;\n\n$table-body-font-size:        .8125rem !default;\n\n$table-border-width:          $border-width !default;\n$table-border-color:          $gray-200 !default;\n\n// scss-docs-start table-variables\n$table-cell-padding-y:        .5rem !default;\n$table-cell-padding-x:        .5rem !default;\n$table-cell-padding-y-sm:     .25rem !default;\n$table-cell-padding-x-sm:     .25rem !default;\n\n$table-cell-vertical-align:   top !default;\n\n$table-color:                 $body-color !default;\n$table-bg:                    transparent !default;\n\n$table-th-font-weight:        null !default;\n\n$table-striped-color:         $table-color !default;\n$table-striped-bg-factor:     .05 !default;\n$table-striped-bg:            rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color:          $table-color !default;\n$table-active-bg-factor:      .1 !default;\n$table-active-bg:             rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color:           $table-color !default;\n$table-hover-bg-factor:       .075 !default;\n$table-hover-bg:              rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor:         .1 !default;\n$table-border-width:          $border-width !default;\n$table-border-color:          $border-color !default;\n\n$table-striped-order:         odd !default;\n\n$table-group-separator-color: currentColor !default;\n\n$table-caption-color:         $text-muted !default;\n\n$table-bg-level:              -9 !default;\n$table-bg-scale:              -80% !default;\n\n\n$table-variants: (\n  \"primary\":    shift-color($primary, $table-bg-scale),\n  \"secondary\":  shift-color($secondary, $table-bg-scale),\n  \"success\":    shift-color($success, $table-bg-scale),\n  \"info\":       shift-color($info, $table-bg-scale),\n  \"warning\":    shift-color($warning, $table-bg-scale),\n  \"danger\":     shift-color($danger, $table-bg-scale),\n  \"light\":      $light,\n  \"dark\":       $dark,\n) !default;\n// scss-docs-end table-variables\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n$input-btn-padding-y:         .5rem !default;\n$input-btn-padding-x:         .75rem !default;\n$input-btn-font-family:       null !default;\n$input-btn-font-size:         1rem !default;\n$input-btn-line-height:       1.7 !default;\n\n$input-btn-focus-width:         .2rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color:         rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-box-shadow:    0 0 0 $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm:      .25rem !default;\n$input-btn-padding-x-sm:      .75rem !default;\n$input-btn-font-size-sm:      .75rem !default;\n\n$input-btn-padding-y-lg:      .75rem !default;\n$input-btn-padding-x-lg:      .75rem !default;\n$input-btn-font-size-lg:      .875rem !default;\n\n$input-btn-border-width:      $border-width !default;\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n$btn-padding-y:               .625rem !default;\n$btn-padding-x:               1.5rem !default;\n$btn-font-family:             $input-btn-font-family !default;\n$btn-font-size:               $text-xs-font-size !default;\n$btn-line-height:             1.667 !default;\n$btn-white-space:             null !default; // Set to `nowrap` to prevent text wrapping\n$btn-letter-spacing:          0 !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-margin-bottom:           1rem !default;\n$btn-padding-y-sm:            .375rem !default;\n$btn-padding-x-sm:            1rem !default;\n$btn-font-size-sm:            $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg:            .75rem !default;\n$btn-padding-x-lg:            1.75rem !default;\n$btn-font-size-lg:            .875rem !default;\n\n$btn-border-width:            $input-btn-border-width !default;\n\n$btn-font-weight:             $font-weight-bolder !default;\n$btn-box-shadow:              0 4px 7px -1px rgba(0,0,0,.11), 0 2px 4px -1px rgba(0,0,0,.07) !default;\n$btn-box-shadow-values:       0 5px 8px 0 !default;\n$btn-box-shadow-hover-values: 0 8px 10px 0 !default;\n$btn-hover-box-shadow:        0 3px 5px -1px rgba(0,0,0,.09), 0 2px 3px -1px rgba(0,0,0,.07) !default;\n$btn-focus-box-shadow:        $btn-hover-box-shadow !default;\n$btn-focus-width:             $input-btn-focus-width !default;\n$btn-hover-opacity:           .85 !default;\n$btn-disabled-opacity:        .65 !default;\n$btn-active-box-shadow:       none !default;\n$btn-background-size:         150% !default;\n$btn-hover-transform:         none !default;\n$btn-active-hover-transform:  none !default;\n$btn-background-position-x:   25% !default;\n\n$btn-link-color:              $link-color !default;\n$btn-link-hover-color:        $link-hover-color !default;\n$btn-link-disabled-color:     $gray-600 !default;\n\n$btn-block-spacing-y:         .5rem !default;\n\n$shadow-umbra-opacity:        0.2 !default;\n$shadow-penumbra-opacity:     0.14 !default;\n$shadow-ambient-opacity:      0.12 !default;\n$shadow-focus:                0 0 8px rgba($black, .18),\n                              0 8px 16px rgba($black, .36);\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius:           .5rem !default;\n$btn-border-radius-lg:        .5rem !default;\n$btn-border-radius-sm:        .5rem !default;\n$btn-border-rounded:          1.875rem !default;\n\n$btn-icon-transition:         all .2s cubic-bezier(.34,1.61,.7,1.3) !default;\n$btn-icon-transform-right:          translateX(5px) !default;\n$btn-icon-transform-left:          translateX(-5px) !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius:           $border-radius-md !default;\n$btn-border-radius-sm:        $border-radius-sm !default;\n$btn-border-radius-lg:        $border-radius-lg !default;\n\n$btn-transition:              all .15s ease-in !default;\n\n$btn-just-icon-padding-x-sm:      .3rem !default;\n$btn-just-icon-padding-y-sm:      .3rem !default;\n$btn-just-icon-padding-x:         .7rem !default;\n$btn-just-icon-padding-y:         .7rem !default;\n$btn-just-icon-padding-x-lg:      1rem !default;\n$btn-just-icon-padding-y-lg:      1rem !default;\n$btn-just-icon-width:             2.375rem !default;\n$btn-just-icon-height:            $btn-just-icon-width !default;\n$btn-just-icon-width-sm:          1.5rem !default;\n$btn-just-icon-height-sm:         $btn-just-icon-width-sm !default;\n$btn-just-icon-sm-font-size:      .5rem !default;\n$btn-just-icon-width-lg:          3.25rem !default;\n$btn-just-icon-height-lg:         $btn-just-icon-width-lg !default;\n$btn-just-icon-lg-font-size:      1.2rem !default;\n$btn-just-icon-lg-position:       relative !default;\n$btn-just-icon-lg-top:            0px !default;\n\n$btn-material-icon-margin:        -1px !default;\n$btn-material-icon-font-size:     1.1rem !default;\n$btn-material-icon-display:       inline-block !default;\n$btn-material-icon-top:           0 !default;\n\n// we've overwritten the default Bootstrap function\n// for dynamically adding font color since the colors\n// added by that function were not correctly set\n$btn-primary-font-color:      $white !default;\n$btn-secondary-font-color:    $white !default;\n$btn-danger-font-color:       $white !default;\n$btn-info-font-color:         $white !default;\n$btn-success-font-color:      $white !default;\n$btn-warning-font-color:      $white !default;\n$btn-dark-font-color:         $white !default;\n$btn-light-font-color:        #3A416F !default;\n\n$btn-font-colors: () !default;\n\n$btn-font-colors: map-merge(\n  (\n    \"primary\":       $btn-primary-font-color,\n    \"secondary\":     $btn-secondary-font-color,\n    \"danger\":        $btn-danger-font-color,\n    \"info\":          $btn-info-font-color,\n    \"success\":       $btn-success-font-color,\n    \"warning\":       $btn-warning-font-color,\n    \"dark\":          $btn-dark-font-color,\n    \"light\":         $btn-light-font-color\n  ),\n  $btn-font-colors\n);\n\n// Forms\n\n$form-text-margin-top:                  .25rem !default;\n$form-text-font-size:                   $small-font-size !default;\n$form-text-font-style:                  null !default;\n$form-text-font-weight:                 null !default;\n$form-text-color:                       $text-muted !default;\n\n$form-label-margin-bottom:              .5rem !default;\n$form-label-margin-left:                .25rem !default;\n$form-label-font-size:                  .875rem !default;\n$form-label-font-style:                 null !default;\n$form-label-font-weight:                400 !default;\n$form-label-color:                      $font-color !default;\n$form-label-position:                   absolute !default;\n$form-label-top:                        .6125rem!default;\n$form-label-transition:                 0.2s ease all !default;\n\n$form-label-top-focused:                -.7rem!default;\n$form-label-top-outline-focused:        -.8rem!default;\n$form-label-top-focused-filled:         -1rem!default;\n$form-label-font-size-focused:          .6875rem !default;\n\n$form-control-outline-padding:            .625rem .75rem !default;\n$form-label-outline-ms:                   .75rem !default;\n$form-label-outline-focused-ms:           .5rem !default;\n$form-label-outline-focused-padding:      0 .188rem !default;\n$form-label-outline-focused-z-index:      5 !default;\n$form-label-outline-line-height:          3.925 !default;\n$form-label-outline-top:                  .375rem !default;\n$form-label-outline-after-height:         .5rem !default;\n$form-label-outline-after-width:          .625rem !default;\n$form-label-outline-after-border-width:   1px 0 0 !default;\n\n\n\n$input-padding-y:                       .5rem !default;\n$input-padding-x:                       0 !default;\n$input-font-family:                     $input-btn-font-family !default;\n$input-font-size:                       $font-size-sm !default;\n$input-font-weight:                     $font-weight-base !default;\n$input-line-height:                     1.5rem !default;\n\n$input-padding-y-sm:                    $input-btn-padding-y-sm !default;\n$input-padding-x-sm:                    $input-btn-padding-x-sm !default;\n$input-font-size-sm:                    .75rem !default;\n\n$input-padding-y-lg:                    $input-btn-padding-y-lg !default;\n$input-padding-x-lg:                    $input-btn-padding-x-lg !default;\n$input-font-size-lg:                    .875rem !default;\n\n$input-bg:                              transparent !default;\n$input-disabled-bg:                     $gray-200 !default;\n$input-disabled-border-color:           null !default;\n\n$input-color:                           $gray-700 !default;\n$input-border-color:                    #d2d6da !default;\n$input-border-width:                    $input-btn-border-width !default;\n$input-box-shadow:                      0 1px 2px 0 rgba(0, 0, 0, 0.05) !default;\n\n$input-border-radius:                   $border-radius-md !default;\n$input-border-radius-sm:                $border-radius-sm !default;\n$input-border-radius-lg:                $border-radius-lg !default;\n\n$input-focus-bg:                        transparent !default;\n$input-focus-border-color:              transparent !default;\n$input-focus-color:                     $input-color !default;\n$input-focus-width:                     2px !default;\n$input-focus-box-shadow:                none !default;\n\n$input-placeholder-color:               $gray-500 !default;\n$input-plaintext-color:                 $dark !default;\n\n$input-height-border:                   $input-border-width * 2 !default;\n\n$input-height-inner:                    unset !default;\n$input-height-inner-half:               1rem !default;\n$input-height-inner-quarter:            .75rem !default;\n\n$input-height:                          unset !default;\n$input-height-sm:                       unset !default;\n$input-height-lg:                       unset !default;\n\n$input-transition:                      .2s ease !default;\n\n$input-background:                       no-repeat bottom,50% calc(100% - 1px);\n$input-background-size:                  0 100%,100% 100%;\n$input-background-size-focus:            100% 100%,100% 100%;\n$input-background-image:                 linear-gradient(0deg,$primary 2px,rgba(156,39,176,0) 0),linear-gradient(0deg,#d2d2d2 1px,hsla(0,0%,82%,0) 0);\n$input-background-image-valid:           linear-gradient(0deg,$success 2px,rgba(156,39,176,0) 0),linear-gradient(0deg,#d2d2d2 1px,hsla(0,0%,82%,0) 0);\n$input-background-image-invalid:         linear-gradient(0deg,$danger 2px,rgba(156,39,176,0) 0),linear-gradient(0deg,#d2d2d2 1px,hsla(0,0%,82%,0) 0);\n$input-background-image-disabled:        linear-gradient(0deg,$primary 2px,rgba(156,39,176,0) 0),linear-gradient(0deg,$gray-200 1px,hsla(0,0%,82%,0) 0);\n\n$form-check-input-width:                  1.23em !default;\n$form-check-min-height:                   auto !default;\n$form-check-padding-left:                 $form-check-input-width + .45em !default;\n$form-check-margin-bottom:                .125rem !default;\n$form-check-label-color:                  null !default;\n$form-check-label-cursor:                 null !default;\n$form-check-transition:                   background-color .25s ease, border-color .25s ease, background-position .15s ease-in-out, opacity .15s ease-out, box-shadow .15s ease-in-out !default;\n$form-check-transition-time:              .25s !default;\n\n$form-check-input-active-filter:          brightness(99%) !default;\n\n$form-check-input-bg:                     $white !default;\n$form-check-input-border:                 none !default;\n$form-check-input-border-radius:          .35rem !default;\n$form-check-radio-border-radius:          50% !default;\n$form-check-input-focus-border:           none !default;\n$form-check-input-focus-box-shadow:       none !default;\n\n$form-check-input-checked-color:          $white !default;\n$form-check-input-checked-bg-color:       transparent !default;\n$form-check-input-checked-border-color:   $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image:       linear-gradient(195deg, $primary-gradient 0%, $primary-gradient-state 100%) !default;\n$form-check-radio-checked-bg-image:       $form-check-input-checked-bg-image !default;\n$form-check-radio-after-width:            .8375rem !default;\n$form-check-radio-after-shadow:           0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06), 0 0 0 12px rgba(53, 71, 102, .1) !default;\n$form-check-radio-transition:             .05s ease;\n\n$form-check-input-indeterminate-color:          $component-active-color !default;\n$form-check-input-indeterminate-bg-color:       $component-active-bg !default;\n$form-check-input-indeterminate-border-color:   $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image:       url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-indeterminate-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/></svg>\") !default;\n\n$form-switch-color:               rgba(0, 0, 0, 1) !default;\n$form-switch-bg-color:            $gray-400 !default;\n$form-switch-height:              0.9375rem !default;\n$form-switch-width:               $form-switch-height*2 !default;\n$form-switch-check-after-width:   1.25rem !default;\n$form-switch-check-after-transition: .1s ease !default;\n$form-switch-check-after-border-color:   $gray-400 !default;\n$form-switch-check-active-after-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06), 0 0 0 15px rgba(0, 0, 0, .1) !default;\n$form-switch-check-active-checked-after-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06), 0 0 0 15px rgba(53, 71, 102, .1) !default;\n\n$form-switch-check-top:           -2.5px !default;\n$form-switch-check-left:          -5px !default;\n$form-switch-padding-start:       $form-switch-width + .5rem !default;\n$form-switch-bg-image:            none !default;\n$form-switch-border-radius:       $form-switch-width !default;\n$form-switch-translate-x-start:   1px !default;\n$form-switch-translate-x-end:     21px !default;\n$form-switch-round-box-shadow:    $box-shadow !default;\n$form-switch-transition:          $form-check-transition !default;\n\n$form-switch-focus-color:         $form-switch-color !default;\n$form-switch-focus-bg-image:      $form-switch-bg-image !default;\n$form-switch-checked-color:       $white !default;\n$form-switch-checked-bg-image:    $form-switch-bg-image !default;\n$form-switch-checked-bg-position: right center !default;\n\n$form-check-inline-margin-right:        1rem !default;\n\n$input-group-addon-padding-y:           $input-padding-y !default;\n$input-group-addon-padding-x:           $input-padding-x !default;\n$input-group-addon-font-weight:         $input-font-weight !default;\n$input-group-addon-color:               $dark !default;\n$input-group-addon-bg:                  transparent !default;\n$input-group-addon-border-color:        $input-border-color !default;\n$input-group-sm-font-size:              $font-size-xs !default;\n$input-group-lg-font-size:              $font-size-base * .975 !default;\n\n$form-select-padding-y:             $input-padding-y !default;\n$form-select-padding-x:             $input-padding-x !default;\n$form-select-font-family:           $input-font-family !default;\n$form-select-font-size:             $input-font-size !default;\n$form-select-height:                $input-height !default;\n$form-select-indicator-padding:     1rem !default; // Extra padding to account for the presence of the background-image based indicator\n$form-select-font-weight:           $input-font-weight !default;\n$form-select-line-height:           $input-line-height !default;\n$form-select-color:                 $input-color !default;\n$form-select-disabled-color:        $gray-600 !default;\n$form-select-bg:                    $input-bg !default;\n$form-select-disabled-bg:           $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position:           right $form-select-padding-x center !default;\n$form-select-bg-size:               16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color:       $gray-800 !default;\n$form-select-indicator:             url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$form-select-indicator-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>\") !default;\n\n$form-select-feedback-icon-padding-right: add(1em * .75, (2 * $form-select-padding-y * .75) + $form-select-padding-x + $form-select-indicator-padding) !default;\n$form-select-feedback-icon-position:      center right ($form-select-padding-x + $form-select-indicator-padding) !default;\n$form-select-feedback-icon-size:          $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width:        $input-border-width !default;\n$form-select-border-color:        $input-border-color !default;\n$form-select-border-radius:       $border-radius-md !default;\n$form-select-box-shadow:          $box-shadow-inset !default;\n\n$form-select-focus-border-color:  $input-focus-border-color !default;\n$form-select-focus-width:         $input-focus-width !default;\n$form-select-focus-box-shadow:    $input-focus-box-shadow !default;\n\n$form-select-padding-y-sm:        $input-padding-y-sm !default;\n$form-select-padding-x-sm:        $input-padding-x-sm !default;\n$form-select-font-size-sm:        $input-font-size-sm !default;\n$form-select-height-sm:           $input-height-sm !default;\n\n$form-select-padding-y-lg:        $input-padding-y-lg !default;\n$form-select-padding-x-lg:        $input-padding-x-lg !default;\n$form-select-font-size-lg:        $input-font-size-lg !default;\n$form-select-height-lg:           $input-height-lg !default;\n\n$form-range-track-width:          100% !default;\n$form-range-track-height:         .5rem !default;\n$form-range-track-cursor:         pointer !default;\n$form-range-track-bg:             $gray-300 !default;\n$form-range-track-border-radius:  1rem !default;\n$form-range-track-box-shadow:     $box-shadow-inset !default;\n\n$form-range-thumb-width:                   1rem !default;\n$form-range-thumb-height:                  $form-range-thumb-width !default;\n$form-range-thumb-bg:                      $component-active-bg !default;\n$form-range-thumb-border:                  0 !default;\n$form-range-thumb-border-radius:           1rem !default;\n$form-range-thumb-box-shadow:              0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow:        0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width:  $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg:               lighten($component-active-bg, 35%) !default;\n$form-range-thumb-disabled-bg:             $gray-500 !default;\n$form-range-thumb-transition:              background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-file-height:                $input-height !default;\n$form-file-focus-border-color:    $input-focus-border-color !default;\n$form-file-focus-box-shadow:      $input-focus-box-shadow !default;\n$form-file-disabled-bg:           $input-disabled-bg !default;\n$form-file-disabled-border-color: $input-disabled-border-color !default;\n\n$form-file-padding-y:             $input-padding-y !default;\n$form-file-padding-x:             $input-padding-x !default;\n$form-file-line-height:           $input-line-height !default;\n$form-file-font-family:           $input-font-family !default;\n$form-file-font-weight:           $input-font-weight !default;\n$form-file-color:                 $input-color !default;\n$form-file-bg:                    $input-bg !default;\n$form-file-border-width:          $input-border-width !default;\n$form-file-border-color:          $input-border-color !default;\n$form-file-border-radius:         $input-border-radius !default;\n$form-file-box-shadow:            $input-box-shadow !default;\n$form-file-button-color:          $form-file-color !default;\n$form-file-button-bg:             $input-group-addon-bg !default;\n\n$form-file-padding-y-sm:          $input-padding-y-sm !default;\n$form-file-padding-x-sm:          $input-padding-x-sm !default;\n$form-file-font-size-sm:          $input-font-size-sm !default;\n$form-file-height-sm:             $input-height-sm !default;\n\n$form-file-padding-y-lg:          $input-padding-y-lg !default;\n$form-file-padding-x-lg:          $input-padding-x-lg !default;\n$form-file-font-size-lg:          $input-font-size-lg !default;\n$form-file-height-lg:             $input-height-lg !default;\n\n\n// Form validation\n\n$form-feedback-margin-top:          $form-text-margin-top !default;\n$form-feedback-font-size:           $form-text-font-size !default;\n$form-feedback-font-style:          $form-text-font-style !default;\n$form-feedback-valid-color:         #66d432 !default;\n$form-feedback-invalid-color:       #fd5c70 !default;\n\n$form-feedback-icon-valid-color:    $form-feedback-valid-color !default;\n$form-feedback-icon-valid:          url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/></svg>\") !default;\n$form-feedback-icon-invalid-color:  $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid:        url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}' viewBox='0 0 12 12'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$form-feedback-icon-invalid-color}' stroke='none'/></svg>\") !default;\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n  \"valid\": (\n    \"color\": $form-feedback-valid-color,\n    \"icon\": $form-feedback-icon-valid\n  ),\n  \"invalid\": (\n    \"color\": $form-feedback-invalid-color,\n    \"icon\": $form-feedback-icon-invalid\n  )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown:                   1000 !default;\n$zindex-sticky:                     1020 !default;\n$zindex-fixed:                      1030 !default;\n$zindex-modal-backdrop:             1040 !default;\n$zindex-modal:                      1050 !default;\n$zindex-popover:                    1060 !default;\n$zindex-tooltip:                    1070 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n$nav-link-padding-y:                .5rem !default;\n$nav-link-padding-x:                1rem !default;\n$nav-link-font-size:                null !default;\n$nav-link-font-weight:              null !default;\n$nav-link-color:                    null !default;\n$nav-link-hover-color:              null !default;\n$nav-link-transition:               color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color:           $gray-600 !default;\n$nav-link-footer-padding:           .25rem !default;\n\n$nav-tabs-border-color:             $gray-300 !default;\n$nav-tabs-border-width:             $border-width !default;\n$nav-tabs-border-radius:            $border-radius-md !default;\n$nav-tabs-link-hover-border-color:  $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color:        $gray-700 !default;\n$nav-tabs-link-active-bg:           $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius:           0.75rem !default;\n$nav-pills-link-active-color:       $dark !default;\n$nav-pills-link-active-bg:          $white !default;\n$nav-pills-link-transition:         background-color .3s ease !default;\n$nav-pills-background:              $gray-100 !default;\n$nav-pills-vertical-background:     transparent !default;\n$nav-pills-vertical-radius:         1.1875rem !default;\n$nav-pills-vertical-link-radius:    .875rem !default;\n\n\n// Navbar\n\n$navbar-padding-y:                  $spacer / 2 !default;\n$navbar-padding-x:                  null !default;\n$navbar-box-shadow:                 0 2px 12px 0 rgba(0, 0, 0, .16) !default;\n\n$navbar-nav-link-padding-x:         .5rem !default;\n$navbar-nav-link-padding:           $navbar-nav-link-padding-x 1rem !default;\n\n$navbar-brand-font-size:            $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height:               $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y:            ($nav-link-height - $navbar-brand-height) / 2 !default;\n$navbar-brand-margin-right:         1rem !default;\n\n$navbar-toggler-padding-y:          .25rem !default;\n$navbar-toggler-padding-x:          .75rem !default;\n$navbar-toggler-font-size:          $font-size-lg !default;\n$navbar-toggler-border-radius:      $btn-border-radius !default;\n$navbar-toggler-focus-width:        $btn-focus-width !default;\n$navbar-toggler-transition:         box-shadow .15s ease-in-out !default;\n\n$navbar-blur-bg-color:              rgba(255, 255, 255, .8) !default;\n$navbar-blur-dark-bg-color:         rgba(2, 5, 22, .8) !default;\n\n$navbar-dark-color:                 rgba($white, .85) !default;\n$navbar-dark-hover-color:           rgba($white, .75) !default;\n$navbar-dark-active-color:          $white !default;\n$navbar-dark-disabled-color:        rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg:       url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>\") !default;\n$navbar-dark-toggler-border-color:  rgba($white, .1) !default;\n\n$navbar-light-color:                $dark !default;\n$navbar-light-hover-color:          rgba($dark, .7) !default;\n$navbar-light-active-color:         rgba($dark, .9) !default;\n$navbar-light-disabled-color:       rgba($dark, .3) !default;\n$navbar-light-toggler-icon-bg:      url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>\") !default;\n$navbar-light-toggler-border-color: rgba($dark, .1) !default;\n\n$navbar-light-brand-color:          $navbar-light-active-color !default;\n$navbar-light-brand-hover-color:    $navbar-light-active-color !default;\n$navbar-dark-brand-color:           $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color:     $navbar-dark-active-color !default;\n\n// Sidenav toggler\n$sidenav-toggler-width:              18px !default;\n$sidenav-toggler-line-transition:    all .15s ease !default;\n$sidenav-toggler-line-height:        2px !default;\n$sidenav-toggler-line-margin-bottom: 3px !default;\n$sidenav-toggler-line-active-width:  13px !default;\n$sidenav-toggler-line-transform:     translateX(5px) !default;\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n$dropdown-min-width:                11rem !default;\n$dropdown-padding-x:                0 !default;\n$dropdown-padding-y:                .5rem !default;\n$dropdown-spacer:                   1.625rem !default;\n$dropdown-font-size:                $font-size-sm !default;\n$dropdown-color:                    $body-color !default;\n$dropdown-bg:                       $white !default;\n$dropdown-border-color:             transparent !default;\n$dropdown-border-radius:            $border-radius-md !default;\n$dropdown-border-width:             0 !default;\n$dropdown-inner-border-radius:      subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-transition-time:          .3s ease !default;\n$dropdown-divider-bg:               $dropdown-border-color !default;\n$dropdown-divider-margin-y:         $spacer / 2 !default;\n$dropdown-box-shadow:               $box-shadow-lg !default;\n\n$dropdown-link-color:               $font-color !default;\n$dropdown-link-hover-color:         $h-color !default;\n$dropdown-link-hover-bg:            $gray-200 !default;\n\n$dropdown-link-active-color:        $font-color !default;\n$dropdown-link-active-bg:           transparent !default;\n\n$dropdown-link-disabled-color:      $gray-600 !default;\n\n$dropdown-item-padding-y:           .3rem !default;\n$dropdown-item-padding-x:           $spacer !default;\n\n$dropdown-header-color:             $gray-600 !default;\n$dropdown-header-padding:           $dropdown-padding-y $dropdown-item-padding-x !default;\n\n$dropdown-dark-color:               $gray-300 !default;\n$dropdown-dark-bg:                  $gray-800 !default;\n$dropdown-dark-border-color:        $dropdown-border-color !default;\n$dropdown-dark-divider-bg:          $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow:          null !default;\n$dropdown-dark-link-color:          $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color:    $white !default;\n$dropdown-dark-link-hover-bg:       rgba($white, .15) !default;\n$dropdown-dark-link-active-color:   $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg:      $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color:        $gray-500 !default;\n\n\n// Pagination\n\n$pagination-padding-y:              .375rem !default;\n$pagination-padding-x:              .75rem !default;\n$pagination-padding-y-sm:           .25rem !default;\n$pagination-padding-x-sm:           .5rem !default;\n$pagination-padding-y-lg:           .75rem !default;\n$pagination-padding-x-lg:           1.5rem !default;\n\n$pagination-color:                  $link-color !default;\n$pagination-bg:                     $white !default;\n$pagination-border-width:           $border-width !default;\n$pagination-border-radius:          $border-radius-md !default;\n$pagination-margin-left:            -$pagination-border-width !default;\n$pagination-border-color:           $gray-300 !default;\n\n$pagination-focus-color:            $link-hover-color !default;\n$pagination-focus-bg:               $gray-200 !default;\n$pagination-focus-box-shadow:       $input-btn-focus-box-shadow !default;\n$pagination-focus-outline:          0 !default;\n\n$pagination-hover-color:            $link-hover-color !default;\n$pagination-hover-bg:               $gray-200 !default;\n$pagination-hover-border-color:     $gray-300 !default;\n\n$pagination-active-color:           $component-active-color !default;\n$pagination-active-bg:              $component-active-bg !default;\n$pagination-active-border-color:    $pagination-active-bg !default;\n\n$pagination-disabled-color:         $gray-600 !default;\n$pagination-disabled-bg:            $white !default;\n$pagination-disabled-border-color:  $gray-300 !default;\n\n$pagination-transition:              color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n// Cards\n\n$card-spacer-y:                     $spacer !default;\n$card-spacer-x:                     $spacer !default;\n$card-title-spacer-y:               $spacer / 2 !default;\n$card-border-width:                 0 !default;\n$card-border-radius:                $border-radius-xl !default;\n$card-border-color:                 rgba($black, .125) !default;\n$card-inner-border-radius:          subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y:                $card-spacer-y / 2 !default;\n$card-cap-padding-x:                $card-spacer-x !default;\n$card-cap-bg:                       $white !default;\n$card-cap-color:                    null !default;\n$card-height:                       null !default;\n$card-color:                        null !default;\n$card-bg:                           $white !default;\n\n$card-img-overlay-padding:          $spacer !default;\n\n$card-group-margin:                 $grid-gutter-width / 2 !default;\n\n\n// Accordion\n$accordion-padding-y:                     1rem !default;\n$accordion-padding-x:                     0rem !default;\n$accordion-color:                         $body-color !default;\n$accordion-bg:                            transparent !default;\n$accordion-border-width:                  0 !default;\n$accordion-border-color:                  rgba($black, .125) !default;\n$accordion-border-radius:                 $border-radius-sm !default;\n\n$accordion-body-padding-y:                $accordion-padding-y !default;\n$accordion-body-padding-x:                $accordion-padding-x !default;\n\n$accordion-button-padding-y:              $accordion-padding-y !default;\n$accordion-button-padding-x:              $accordion-padding-x !default;\n$accordion-button-color:                  $accordion-color !default;\n$accordion-button-bg:                     $accordion-bg !default;\n$accordion-transition:                    $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg:              $accordion-bg !default;\n$accordion-button-active-color:           $dark !default;\n\n$accordion-button-focus-border-color:     $input-focus-border-color !default;\n$accordion-button-focus-box-shadow:       none !default;\n\n$accordion-icon-width:                    1rem !default;\n$accordion-icon-color:                    $accordion-color !default;\n$accordion-icon-active-color:             $accordion-button-active-color !default;\n$accordion-icon-transition:               transform .2s ease-in-out !default;\n$accordion-icon-transform:                rotate(180deg) !default;\n\n$accordion-button-icon:                   none !default;\n$accordion-button-active-icon:            none !default;\n\n\n// Tooltips\n\n$tooltip-font-size:                 $font-size-sm !default;\n$tooltip-max-width:                 200px !default;\n$tooltip-color:                     $white !default;\n$tooltip-bg:                        $black !default;\n$tooltip-border-radius:             $border-radius-md !default;\n$tooltip-opacity:                   .9 !default;\n$tooltip-padding-y:                 $spacer / 4 !default;\n$tooltip-padding-x:                 $spacer / 2 !default;\n$tooltip-margin:                    0 !default;\n\n$tooltip-arrow-width:               .8rem !default;\n$tooltip-arrow-height:              .4rem !default;\n$tooltip-arrow-color:               $tooltip-bg !default;\n\n// Form tooltips must come after regular tooltips\n$form-feedback-tooltip-padding-y:     $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x:     $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size:     $tooltip-font-size !default;\n$form-feedback-tooltip-line-height:   null !default;\n$form-feedback-tooltip-opacity:       $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n\n\n// Popovers\n\n$popover-font-size:                 $font-size-xs !default;\n$popover-bg:                        $white !default;\n$popover-max-width:                 276px !default;\n$popover-border-width:              0px !default;\n$popover-border-color:              rgba($black, .2) !default;\n$popover-border-radius:             $border-radius-lg !default;\n$popover-inner-border-radius:       subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow:                $box-shadow-sm !default;\n\n$popover-header-bg:                 $gray-200 !default;\n$popover-header-color:              $headings-color !default;\n$popover-header-padding-y:          .5rem !default;\n$popover-header-padding-x:          $spacer !default;\n\n$popover-body-color:                $font-color !default;\n$popover-body-padding-y:            $spacer !default;\n$popover-body-padding-x:            $spacer !default;\n\n$popover-arrow-width:               1rem !default;\n$popover-arrow-height:              .5rem !default;\n$popover-arrow-color:               $popover-bg !default;\n\n$popover-arrow-outer-color:         fade-in($popover-border-color, .05) !default;\n\n\n// Toasts\n\n$toast-max-width:                   350px !default;\n$toast-padding-x:                   .75rem !default;\n$toast-padding-y:                   .75rem !default;\n$toast-font-size:                   .875rem !default;\n$toast-color:                       null !default;\n$toast-background-color:            rgba($white, .85) !default;\n$toast-border-width:                0 !default;\n$toast-border-color:                transparent !default;\n$toast-border-radius:               $border-radius-md !default;\n$toast-box-shadow:                  $box-shadow !default;\n\n$toast-header-color:                $h-color !default;\n$toast-header-background-color:     rgba($white, .85) !default;\n$toast-header-border-color:         rgba(0, 0, 0, .05) !default;\n\n\n// Badges\n\n$badge-font-size:                   .75em !default;\n$badge-font-weight:                 $font-weight-bolder !default;\n$badge-color:                       $white !default;\n$badge-padding-y:                   .55em !default;\n$badge-padding-x:                   .9em !default;\n$badge-border-radius-custom:        .45rem !default;\n$badge-border-radius:               $badge-border-radius-custom !default;\n\n\n// Modals\n\n// Padding applied to the modal body\n$modal-inner-padding:               $spacer !default;\n\n// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding\n$modal-footer-margin-between:       .5rem !default;\n\n$modal-dialog-margin:               .5rem !default;\n$modal-dialog-margin-y-sm-up:       1.75rem !default;\n\n$modal-title-line-height:           $line-height-base !default;\n\n$modal-content-color:               null !default;\n$modal-content-bg:                  $white !default;\n$modal-content-border-color:        rgba($black, .2) !default;\n$modal-content-border-width:        $border-width !default;\n$modal-content-border-radius:       $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs:       $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up:    $box-shadow !default;\n\n$modal-backdrop-bg:                 $black !default;\n$modal-backdrop-opacity:            .5 !default;\n$modal-header-border-color:         $border-color !default;\n$modal-footer-border-color:         $modal-header-border-color !default;\n$modal-header-border-width:         $modal-content-border-width !default;\n$modal-footer-border-width:         $modal-header-border-width !default;\n$modal-header-padding-y:            $modal-inner-padding !default;\n$modal-header-padding-x:            $modal-inner-padding !default;\n$modal-header-padding:              $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-sm:                          300px !default;\n$modal-md:                          500px !default;\n$modal-lg:                          800px !default;\n$modal-xl:                          1140px !default;\n\n$modal-fade-transform:              translate(0, -50px) !default;\n$modal-show-transform:              none !default;\n$modal-transition:                  transform .3s ease-out !default;\n$modal-scale-transform:             scale(1.02) !default;\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n$alert-padding-y:                   $spacer !default;\n$alert-padding-x:                   $spacer !default;\n$alert-margin-bottom:               1rem !default;\n$alert-border-radius:               $border-radius-md !default;\n$alert-link-font-weight:            $font-weight-bold !default;\n$alert-border-width:                0 !default;\n\n$alert-bg-level:                    -10 !default;\n$alert-border-level:                -9 !default;\n$alert-color-level:                 6 !default;\n\n$alert-dismissible-padding-r:       $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n\n\n// Progress bars\n\n$progress-height:                   6px !default;\n$progress-bar-height:               6px !default;\n$progress-height-sm:                4px !default;\n$progress-height-lg:                20px !default;\n$progress-font-size:                $font-size-base * .75 !default;\n$progress-bg:                       $gray-200 !default;\n$progress-border-radius:            $border-radius-sm !default;\n$progress-box-shadow:               $box-shadow-inset !default;\n$progress-bar-color:                $white !default;\n$progress-bar-bg:                   $primary !default;\n$progress-bar-animation-timing:     1s linear infinite !default;\n$progress-bar-transition:           width .6s ease !default;\n\n\n// List group\n\n$list-group-color:                  inherit !default;\n$list-group-bg:                     $white !default;\n$list-group-border-color:           rgba($black, .125) !default;\n$list-group-border-width:           $border-width !default;\n$list-group-border-radius:          $border-radius-md !default;\n\n$list-group-item-padding-y:         $spacer / 2 !default;\n$list-group-item-padding-x:         $spacer !default;\n$list-group-item-bg-level:          -9 !default;\n$list-group-item-color-level:       6 !default;\n\n$list-group-hover-bg:               $gray-100 !default;\n$list-group-active-color:           $component-active-color !default;\n$list-group-active-bg:              $component-active-bg !default;\n$list-group-active-border-color:    $list-group-active-bg !default;\n\n$list-group-disabled-color:         $gray-600 !default;\n$list-group-disabled-bg:            $list-group-bg !default;\n\n$list-group-action-color:           $gray-700 !default;\n$list-group-action-hover-color:     $list-group-action-color !default;\n\n$list-group-action-active-color:    $body-color !default;\n$list-group-action-active-bg:       $gray-200 !default;\n\n\n// Image thumbnails\n\n$thumbnail-padding:                 .25rem !default;\n$thumbnail-bg:                      $body-bg !default;\n$thumbnail-border-width:            $border-width !default;\n$thumbnail-border-color:            $gray-300 !default;\n$thumbnail-border-radius:           $border-radius-md !default;\n$thumbnail-box-shadow:              $box-shadow-sm !default;\n\n\n// Figures\n\n$figure-caption-font-size:          $small-font-size !default;\n$figure-caption-color:              $gray-600 !default;\n\n\n// Breadcrumbs\n\n$breadcrumb-font-size:              null !default;\n$breadcrumb-padding-y:              $spacer / 2 !default;\n$breadcrumb-padding-x:              $spacer !default;\n$breadcrumb-item-padding-x:         .5rem !default;\n$breadcrumb-margin-bottom:          1rem !default;\n$breadcrumb-bg:                     $gray-200 !default;\n$breadcrumb-divider-color:          $gray-600 !default;\n$breadcrumb-active-color:           $gray-600 !default;\n$breadcrumb-divider:                quote(\"/\") !default;\n$breadcrumb-border-radius:          $border-radius-md !default;\n\n// Carousel\n\n$carousel-control-color:             $white !default;\n$carousel-control-width:             15% !default;\n$carousel-control-opacity:           .5 !default;\n$carousel-control-hover-opacity:     .9 !default;\n$carousel-control-transition:        opacity .15s ease !default;\n\n$carousel-indicator-width:           30px !default;\n$carousel-indicator-height:          3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer:          3px !default;\n$carousel-indicator-opacity:         .5 !default;\n$carousel-indicator-active-bg:       $white !default;\n$carousel-indicator-active-opacity:  1 !default;\n$carousel-indicator-transition:      opacity .6s ease !default;\n\n$carousel-caption-width:             70% !default;\n$carousel-caption-color:             $white !default;\n$carousel-caption-padding-y:         1.25rem !default;\n$carousel-caption-spacer:            1.25rem !default;\n\n$carousel-control-icon-width:        2rem !default;\n\n$carousel-control-prev-icon-bg:      url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 16 16'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/></svg>\") !default;\n$carousel-control-next-icon-bg:      url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 16 16'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/></svg>\") !default;\n\n$carousel-transition-duration:       .6s !default;\n$carousel-transition:                transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg:  $black !default;\n$carousel-dark-caption-color:        $black !default;\n$carousel-dark-control-icon-filter:  invert(1) grayscale(100) !default;\n\n\n// Spinners\n\n$spinner-width:           2rem !default;\n$spinner-height:          $spinner-width !default;\n$spinner-border-width:    .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm:        1rem !default;\n$spinner-height-sm:       $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n\n\n// Close\n\n$btn-close-width:            1em !default;\n$btn-close-height:           $btn-close-width !default;\n$btn-close-padding-x:        .25em !default;\n$btn-close-padding-y:        $btn-close-padding-x !default;\n$btn-close-color:            $white !default;\n$btn-close-bg:               url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$btn-close-color}' viewBox='0 0 16 16'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>\") !default;\n$btn-close-focus-shadow:     $input-btn-focus-box-shadow !default;\n$btn-close-opacity:          .5 !default;\n$btn-close-hover-opacity:    .75 !default;\n$btn-close-focus-opacity:    1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter:     invert(1) grayscale(100%) brightness(200%) !default;\n\n// Code\n\n$code-font-size:                    $small-font-size !default;\n$code-color:                        $pink !default;\n\n$kbd-padding-y:                     .2rem !default;\n$kbd-padding-x:                     .4rem !default;\n$kbd-font-size:                     $code-font-size !default;\n$kbd-color:                         $white !default;\n$kbd-bg:                            $gray-900 !default;\n$pre-color:                         null !default;\n\n// Tilt Animation\n\n$tilt-transform-style:              preserve-3d !default;\n$tilt-transform-up-transform:       translateZ(50px) scale(0.7) !default;\n$tilt-transform-up-transition:      all 0.5s !default;\n\n// Variables for Core\n\n@import \"variables/animations\";\n@import \"variables/avatars\";\n@import \"variables/cards\";\n@import \"variables/dark-version\";\n@import \"variables/dropdowns\";\n@import 'variables/header';\n@import 'variables/info-areas';\n@import 'variables/navbar';\n@import 'variables/navbar-vertical';\n@import 'variables/utilities';\n@import 'variables/utilities-extend';\n@import 'variables/misc';\n@import 'variables/misc-extend';\n@import 'variables/form-switch';\n@import 'variables/fixed-plugin';\n@import 'variables/pagination';\n@import 'variables/badge';\n@import 'variables/rtl';\n@import 'variables/ripple';\n@import 'variables/cards-extend';\n@import 'variables/choices';\n@import 'variables/timeline';\n@import 'variables/full-calendar';\n@import 'variables/social-buttons';\n@import 'variables/virtual-reality';\n\n\n// Import Utilities\n@import \"utilities\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/badges/_badge-circle.scss",
    "content": "//\n// Circle badge\n//\n\n\n// General styles\n\n.badge-circle {\n    text-align: center;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: $badge-circle-border-radius;\n    padding: 0 !important;\n    width: $badge-circle-width;\n    height: $badge-circle-height;\n    font-size: $badge-circle-font-size;\n    font-weight: $badge-circle-font-weight;\n\n    &.badge-md {\n        width: $badge-circle-md-width;\n        height: $badge-circle-md-height;\n    }\n\n    &.badge-lg {\n      width: $badge-circle-lg-width;\n      height: $badge-circle-lg-height;\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/badges/_badge-dot.scss",
    "content": "//\n// Dot badge\n//\n\n\n// General styles\n\n.badge-dot {\n    padding-left: 0;\n    padding-right: 0;\n    background: transparent;\n    font-weight: $font-weight-normal;\n    font-size: $font-size-sm;\n    text-transform: none;\n\n    strong {\n        color: $gray-800;\n    }\n\n    i {\n        display: inline-block;\n        vertical-align: middle;\n        width: $badge-dot-icon-width;\n        height: $badge-dot-icon-height;\n        border-radius: $badge-dot-icon-radius;\n        margin-right: $badge-dot-icon-margin-right;\n    }\n\n    &.badge-md {\n        i {\n            width: $badge-dot-md-icon-width;\n            height: $badge-dot-md-icon-height;\n        }\n    }\n\n    &.badge-lg {\n        i {\n            width: $badge-dot-lg-icon-width;\n            height: $badge-dot-lg-icon-height;\n        }\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/badges/_badge-floating.scss",
    "content": "//\n// Badge floating\n//\n\n\n.btn {\n    .badge-floating {\n        position: absolute;\n        top: -$badge-floating-top;\n        transform: translateY($badge-floating-top);\n        border: $badge-floating-border solid;\n\n        &.badge:not(.badge-circle) {\n            transform: $badge-floating-transform;\n        }\n    }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/badges/_badge.scss",
    "content": "//\n// Badge\n//\n\n\n// General styles\n\n.badge {\n\n\n    a {\n        color: $white;\n    }\n}\n\n\n// Size variations\n\n.badge-sm{\n  padding: $badge-sm-padding;\n  font-size: $badge-sm-font-size;\n  border-radius: $border-radius-md;\n}\n\n.badge-md {\n    padding: $badge-md-padding;\n}\n\n.badge-lg {\n    padding: $badge-lg-padding;\n}\n\n\n// Multiple inline badges\n\n.badge-inline {\n    margin-right: $badge-inline-margin-right;\n\n    + span {\n        top: $badge-inline-span-top;\n        position: relative;\n\n        > a {\n            text-decoration: underline;\n        }\n    }\n}\n\n\n// Color fixes\n\n.badge-default {\n    color: $white;\n}\n\n.badge.badge-secondary {\n    background-color: lighten($secondary, 32%);\n    color: $gray-600;\n}\n\n\n// Badge spacing inside a btn with some text\n\n.btn {\n    .badge {\n        &:not(:first-child) {\n            margin-left: $badge-btn-margin;\n        }\n        &:not(:last-child) {\n            margin-right: $badge-btn-margin;\n        }\n    }\n}\n\n// Colors\n//\n// Contextual variations (linked badges get darker on :hover).\n\n@each $color, $value in $theme-colors {\n  .badge-#{$color} {\n    @include badge-variant($value);\n  }\n}\n\n\n\n// card-pricing badge position\n\n.card {\n  >.badge {\n    margin-top: $card-badge-position !important;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_accordion.scss",
    "content": "//\n// Base styles\n//\n\n.accordion-button {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  padding: $accordion-button-padding-y $accordion-button-padding-x;\n  @include font-size($font-size-base);\n  color: $accordion-button-color;\n  text-align: left; // Reset button style\n  background-color: $accordion-button-bg;\n  border: 0;\n  @include border-radius(0);\n  overflow-anchor: none;\n  @include transition($accordion-transition);\n\n  &:not(.collapsed) {\n    color: $accordion-button-active-color;\n    background-color: $accordion-button-active-bg;\n    box-shadow: inset 0 ($accordion-border-width * -1) 0 $accordion-border-color;\n\n    &::after {\n      background-image: escape-svg($accordion-button-active-icon);\n      transform: $accordion-icon-transform;\n    }\n  }\n\n  // Accordion icon\n  &::after {\n    flex-shrink: 0;\n    width: $accordion-icon-width;\n    height: $accordion-icon-width;\n    margin-left: auto;\n    content: \"\";\n    background-image: escape-svg($accordion-button-icon);\n    background-repeat: no-repeat;\n    background-size: $accordion-icon-width;\n    @include transition($accordion-icon-transition);\n  }\n\n  &:hover {\n    z-index: 2;\n  }\n\n  &:focus {\n    z-index: 3;\n    border-color: $accordion-button-focus-border-color;\n    outline: 0;\n    box-shadow: $accordion-button-focus-box-shadow;\n  }\n}\n\n.accordion-header {\n  margin-bottom: 0;\n}\n\n.accordion-item {\n  background-color: $accordion-bg;\n  border: $accordion-border-width solid $accordion-border-color;\n\n  &:first-of-type {\n    @include border-top-radius($accordion-border-radius);\n\n    .accordion-button {\n      @include border-top-radius($accordion-inner-border-radius);\n    }\n  }\n\n  &:not(:first-of-type) {\n    border-top: 0;\n  }\n\n  // Only set a border-radius on the last item if the accordion is collapsed\n  &:last-of-type {\n    @include border-bottom-radius($accordion-border-radius);\n\n    .accordion-button {\n      &.collapsed {\n        @include border-bottom-radius($accordion-inner-border-radius);\n      }\n    }\n\n    .accordion-collapse {\n      @include border-bottom-radius($accordion-border-radius);\n    }\n  }\n}\n\n.accordion-body {\n  padding: $accordion-body-padding-y $accordion-body-padding-x;\n}\n\n\n// Flush accordion items\n//\n// Remove borders and border-radius to keep accordion items edge-to-edge.\n\n.accordion-flush {\n  .accordion-collapse {\n    border-width: 0;\n  }\n\n  .accordion-item {\n    border-right: 0;\n    border-left: 0;\n    @include border-radius(0);\n\n    &:first-child { border-top: 0; }\n    &:last-child { border-bottom: 0; }\n\n    .accordion-button {\n      @include border-radius(0);\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_alert.scss",
    "content": "//\n// Base styles\n//\n\n.alert {\n  position: relative;\n  padding: $alert-padding-y $alert-padding-x;\n  margin-bottom: $alert-margin-bottom;\n  border: $alert-border-width solid transparent;\n  @include border-radius($alert-border-radius);\n}\n\n// Headings for larger alerts\n.alert-heading {\n  // Specified to prevent conflicts of changing $headings-color\n  color: inherit;\n}\n\n// Provide class for links that match alerts\n.alert-link {\n  font-weight: $alert-link-font-weight;\n}\n\n\n// Dismissible alerts\n//\n// Expand the right padding and account for the close button's positioning.\n\n.alert-dismissible {\n  padding-right: $alert-dismissible-padding-r;\n\n  // Adjust close link position\n  .btn-close {\n    position: absolute;\n    top: 0;\n    right: 0;\n    z-index: $stretched-link-z-index + 1;\n    padding: $alert-padding-y * 1.25 $alert-padding-x;\n  }\n}\n\n\n// scss-docs-start alert-modifiers\n// Generate contextual modifier classes for colorizing the alert.\n\n@each $state, $value in $theme-colors {\n  $alert-background: shift-color($value, $alert-bg-scale);\n  $alert-border: shift-color($value, $alert-border-scale);\n  $alert-color: shift-color($value, $alert-color-scale);\n  @if (contrast-ratio($alert-background, $alert-color) < $min-contrast-ratio) {\n    $alert-color: mix($value, color-contrast($alert-background), abs($alert-color-scale));\n  }\n  .alert-#{$state} {\n    @include alert-variant($alert-background, $alert-border, $alert-color);\n  }\n}\n// scss-docs-end alert-modifiers\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_badge.scss",
    "content": "// Base class\n//\n// Requires one of the contextual, color modifier classes for `color` and\n// `background-color`.\n\n.badge {\n  display: inline-block;\n  padding: $badge-padding-y $badge-padding-x;\n  @include font-size($badge-font-size);\n  font-weight: $badge-font-weight;\n  line-height: 1;\n  color: $badge-color;\n  text-align: center;\n  white-space: nowrap;\n  vertical-align: baseline;\n  @include border-radius($badge-border-radius);\n  @include gradient-bg();\n\n  // Empty badges collapse automatically\n  &:empty {\n    display: none;\n  }\n}\n\n// Quick fix for badges in buttons\n.btn .badge {\n  position: relative;\n  top: -1px;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_breadcrumb.scss",
    "content": ".breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  padding: $breadcrumb-padding-y $breadcrumb-padding-x;\n  margin-bottom: $breadcrumb-margin-bottom;\n  @include font-size($breadcrumb-font-size);\n  list-style: none;\n  background-color: $breadcrumb-bg;\n  @include border-radius($breadcrumb-border-radius);\n}\n\n.breadcrumb-item {\n  // The separator between breadcrumbs (by default, a forward-slash: \"/\")\n  + .breadcrumb-item {\n    padding-left: $breadcrumb-item-padding-x;\n\n    &::before {\n      float: left; // Suppress inline spacings and underlining of the separator\n      padding-right: $breadcrumb-item-padding-x;\n      color: $breadcrumb-divider-color;\n      content: var(--#{$variable-prefix}breadcrumb-divider, escape-svg($breadcrumb-divider)) #{\"/* rtl:\"} var(--#{$variable-prefix}breadcrumb-divider, escape-svg($breadcrumb-divider-flipped)) #{\"*/\"};\n    }\n  }\n\n  &.active {\n    color: $breadcrumb-active-color;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_button-group.scss",
    "content": "// Make the div behave like a button\n.btn-group,\n.btn-group-vertical {\n  position: relative;\n  display: inline-flex;\n  vertical-align: middle; // match .btn alignment given font-size hack above\n\n  > .btn {\n    position: relative;\n    flex: 1 1 auto;\n  }\n\n  // Bring the hover, focused, and \"active\" buttons to the front to overlay\n  // the borders properly\n  > .btn-check:checked + .btn,\n  > .btn-check:focus + .btn,\n  > .btn:hover,\n  > .btn:focus,\n  > .btn:active,\n  > .btn.active {\n    z-index: 1;\n  }\n}\n\n// Optional: Group multiple button groups together for a toolbar\n.btn-toolbar {\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: flex-start;\n\n  .input-group {\n    width: auto;\n  }\n}\n\n.btn-group {\n  // Prevent double borders when buttons are next to each other\n  > .btn:not(:first-child),\n  > .btn-group:not(:first-child) {\n    margin-left: -$btn-border-width;\n  }\n\n  // Reset rounded corners\n  > .btn:not(:last-child):not(.dropdown-toggle),\n  > .btn-group:not(:last-child) > .btn {\n    @include border-end-radius(0);\n  }\n\n  // The left radius should be 0 if the button is:\n  // - the \"third or more\" child\n  // - the second child and the previous element isn't `.btn-check` (making it the first child visually)\n  // - part of a btn-group which isn't the first child\n  > .btn:nth-child(n + 3),\n  > :not(.btn-check) + .btn,\n  > .btn-group:not(:first-child) > .btn {\n    @include border-start-radius(0);\n  }\n}\n\n// Sizing\n//\n// Remix the default button sizing classes into new ones for easier manipulation.\n\n.btn-group-sm > .btn { @extend .btn-sm; }\n.btn-group-lg > .btn { @extend .btn-lg; }\n\n\n//\n// Split button dropdowns\n//\n\n.dropdown-toggle-split {\n  padding-right: $btn-padding-x * .75;\n  padding-left: $btn-padding-x * .75;\n\n  &::after,\n  .dropup &::after,\n  .dropend &::after {\n    margin-left: 0;\n  }\n\n  .dropstart &::before {\n    margin-right: 0;\n  }\n}\n\n.btn-sm + .dropdown-toggle-split {\n  padding-right: $btn-padding-x-sm * .75;\n  padding-left: $btn-padding-x-sm * .75;\n}\n\n.btn-lg + .dropdown-toggle-split {\n  padding-right: $btn-padding-x-lg * .75;\n  padding-left: $btn-padding-x-lg * .75;\n}\n\n\n// The clickable button for toggling the menu\n// Set the same inset shadow as the :active state\n.btn-group.show .dropdown-toggle {\n  @include box-shadow($btn-active-box-shadow);\n\n  // Show no shadow for `.btn-link` since it has no other button styles.\n  &.btn-link {\n    @include box-shadow(none);\n  }\n}\n\n\n//\n// Vertical button groups\n//\n\n.btn-group-vertical {\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n\n  > .btn,\n  > .btn-group {\n    width: 100%;\n  }\n\n  > .btn:not(:first-child),\n  > .btn-group:not(:first-child) {\n    margin-top: -$btn-border-width;\n  }\n\n  // Reset rounded corners\n  > .btn:not(:last-child):not(.dropdown-toggle),\n  > .btn-group:not(:last-child) > .btn {\n    @include border-bottom-radius(0);\n  }\n\n  > .btn ~ .btn,\n  > .btn-group:not(:first-child) > .btn {\n    @include border-top-radius(0);\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_buttons.scss",
    "content": "//\n// Base styles\n//\n\n.btn {\n  display: inline-block;\n  font-family: $btn-font-family;\n  font-weight: $btn-font-weight;\n  line-height: $btn-line-height;\n  color: $body-color;\n  text-align: center;\n  text-decoration: if($link-decoration == none, null, none);\n  white-space: $btn-white-space;\n  vertical-align: middle;\n  cursor: if($enable-button-pointers, pointer, null);\n  user-select: none;\n  background-color: transparent;\n  border: $btn-border-width solid transparent;\n  @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-border-radius);\n  @include transition($btn-transition);\n\n  &:hover {\n    color: $body-color;\n    text-decoration: if($link-hover-decoration == underline, none, null);\n  }\n\n  .btn-check:focus + &,\n  &:focus {\n    outline: 0;\n    box-shadow: $btn-focus-box-shadow;\n  }\n\n  .btn-check:checked + &,\n  .btn-check:active + &,\n  &:active,\n  &.active {\n    @include box-shadow($btn-active-box-shadow);\n\n    &:focus {\n      @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow);\n    }\n  }\n\n  &:disabled,\n  &.disabled,\n  fieldset:disabled & {\n    pointer-events: none;\n    opacity: $btn-disabled-opacity;\n    @include box-shadow(none);\n  }\n}\n\n\n//\n// Alternate buttons\n//\n\n// scss-docs-start btn-variant-loops\n@each $color, $value in $theme-colors {\n  .btn-#{$color} {\n    @include button-variant($value, $value);\n  }\n}\n\n@each $color, $value in $theme-colors {\n  .btn-outline-#{$color} {\n    @include button-outline-variant($value);\n  }\n}\n// scss-docs-end btn-variant-loops\n\n\n//\n// Link buttons\n//\n\n// Make a button look and behave like a link\n.btn-link {\n  font-weight: $font-weight-normal;\n  color: $btn-link-color;\n  text-decoration: $link-decoration;\n\n  &:hover {\n    color: $btn-link-hover-color;\n    text-decoration: $link-hover-decoration;\n  }\n\n  &:focus {\n    text-decoration: $link-hover-decoration;\n  }\n\n  &:disabled,\n  &.disabled {\n    color: $btn-link-disabled-color;\n  }\n\n  // No need for an active state here\n}\n\n\n//\n// Button Sizes\n//\n\n.btn-lg {\n  @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-border-radius-lg);\n}\n\n.btn-sm {\n  @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_card.scss",
    "content": "//\n// Base styles\n//\n\n.card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-width: 0; // See https://github.com/twbs/bootstrap/pull/22740#issuecomment-305868106\n  height: $card-height;\n  word-wrap: break-word;\n  background-color: $card-bg;\n  background-clip: border-box;\n  border: $card-border-width solid $card-border-color;\n  @include border-radius($card-border-radius);\n  @include box-shadow($card-box-shadow);\n\n  > hr {\n    margin-right: 0;\n    margin-left: 0;\n  }\n\n  > .list-group {\n    border-top: inherit;\n    border-bottom: inherit;\n\n    &:first-child {\n      border-top-width: 0;\n      @include border-top-radius($card-inner-border-radius);\n    }\n\n    &:last-child  {\n      border-bottom-width: 0;\n      @include border-bottom-radius($card-inner-border-radius);\n    }\n  }\n\n  // Due to specificity of the above selector (`.card > .list-group`), we must\n  // use a child selector here to prevent double borders.\n  > .card-header + .list-group,\n  > .list-group + .card-footer {\n    border-top: 0;\n  }\n}\n\n.card-body {\n  // Enable `flex-grow: 1` for decks and groups so that card blocks take up\n  // as much space as possible, ensuring footers are aligned to the bottom.\n  flex: 1 1 auto;\n  padding: $card-spacer-y $card-spacer-x;\n  color: $card-color;\n}\n\n.card-title {\n  margin-bottom: $card-title-spacer-y;\n}\n\n.card-subtitle {\n  margin-top: -$card-title-spacer-y * .5;\n  margin-bottom: 0;\n}\n\n.card-text:last-child {\n  margin-bottom: 0;\n}\n\n.card-link {\n  &:hover {\n    text-decoration: if($link-hover-decoration == underline, none, null);\n  }\n\n  + .card-link {\n    margin-left: $card-spacer-x;\n  }\n}\n\n//\n// Optional textual caps\n//\n\n.card-header {\n  padding: $card-cap-padding-y $card-cap-padding-x;\n  margin-bottom: 0; // Removes the default margin-bottom of <hN>\n  color: $card-cap-color;\n  background-color: $card-cap-bg;\n  border-bottom: $card-border-width solid $card-border-color;\n\n  &:first-child {\n    @include border-radius($card-inner-border-radius $card-inner-border-radius 0 0);\n  }\n}\n\n.card-footer {\n  padding: $card-cap-padding-y $card-cap-padding-x;\n  color: $card-cap-color;\n  background-color: $card-cap-bg;\n  border-top: $card-border-width solid $card-border-color;\n\n  &:last-child {\n    @include border-radius(0 0 $card-inner-border-radius $card-inner-border-radius);\n  }\n}\n\n\n//\n// Header navs\n//\n\n.card-header-tabs {\n  margin-right: -$card-cap-padding-x * .5;\n  margin-bottom: -$card-cap-padding-y;\n  margin-left: -$card-cap-padding-x * .5;\n  border-bottom: 0;\n\n  @if $nav-tabs-link-active-bg != $card-bg {\n    .nav-link.active {\n      background-color: $card-bg;\n      border-bottom-color: $card-bg;\n    }\n  }\n}\n\n.card-header-pills {\n  margin-right: -$card-cap-padding-x * .5;\n  margin-left: -$card-cap-padding-x * .5;\n}\n\n// Card image\n.card-img-overlay {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  padding: $card-img-overlay-padding;\n  @include border-radius($card-inner-border-radius);\n}\n\n.card-img,\n.card-img-top,\n.card-img-bottom {\n  width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch\n}\n\n.card-img,\n.card-img-top {\n  @include border-top-radius($card-inner-border-radius);\n}\n\n.card-img,\n.card-img-bottom {\n  @include border-bottom-radius($card-inner-border-radius);\n}\n\n\n//\n// Card groups\n//\n\n.card-group {\n  // The child selector allows nested `.card` within `.card-group`\n  // to display properly.\n  > .card {\n    margin-bottom: $card-group-margin;\n  }\n\n  @include media-breakpoint-up(sm) {\n    display: flex;\n    flex-flow: row wrap;\n    // The child selector allows nested `.card` within `.card-group`\n    // to display properly.\n    > .card {\n      // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4\n      flex: 1 0 0%;\n      margin-bottom: 0;\n\n      + .card {\n        margin-left: 0;\n        border-left: 0;\n      }\n\n      // Handle rounded corners\n      @if $enable-rounded {\n        &:not(:last-child) {\n          @include border-end-radius(0);\n\n          .card-img-top,\n          .card-header {\n            // stylelint-disable-next-line property-disallowed-list\n            border-top-right-radius: 0;\n          }\n          .card-img-bottom,\n          .card-footer {\n            // stylelint-disable-next-line property-disallowed-list\n            border-bottom-right-radius: 0;\n          }\n        }\n\n        &:not(:first-child) {\n          @include border-start-radius(0);\n\n          .card-img-top,\n          .card-header {\n            // stylelint-disable-next-line property-disallowed-list\n            border-top-left-radius: 0;\n          }\n          .card-img-bottom,\n          .card-footer {\n            // stylelint-disable-next-line property-disallowed-list\n            border-bottom-left-radius: 0;\n          }\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_carousel.scss",
    "content": "// Notes on the classes:\n//\n// 1. .carousel.pointer-event should ideally be pan-y (to allow for users to scroll vertically)\n//    even when their scroll action started on a carousel, but for compatibility (with Firefox)\n//    we're preventing all actions instead\n// 2. The .carousel-item-start and .carousel-item-end is used to indicate where\n//    the active slide is heading.\n// 3. .active.carousel-item is the current slide.\n// 4. .active.carousel-item-start and .active.carousel-item-end is the current\n//    slide in its in-transition state. Only one of these occurs at a time.\n// 5. .carousel-item-next.carousel-item-start and .carousel-item-prev.carousel-item-end\n//    is the upcoming slide in transition.\n\n.carousel {\n  position: relative;\n}\n\n.carousel.pointer-event {\n  touch-action: pan-y;\n}\n\n.carousel-inner {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  @include clearfix();\n}\n\n.carousel-item {\n  position: relative;\n  display: none;\n  float: left;\n  width: 100%;\n  margin-right: -100%;\n  backface-visibility: hidden;\n  @include transition($carousel-transition);\n}\n\n.carousel-item.active,\n.carousel-item-next,\n.carousel-item-prev {\n  display: block;\n}\n\n/* rtl:begin:ignore */\n.carousel-item-next:not(.carousel-item-start),\n.active.carousel-item-end {\n  transform: translateX(100%);\n}\n\n.carousel-item-prev:not(.carousel-item-end),\n.active.carousel-item-start {\n  transform: translateX(-100%);\n}\n\n/* rtl:end:ignore */\n\n\n//\n// Alternate transitions\n//\n\n.carousel-fade {\n  .carousel-item {\n    opacity: 0;\n    transition-property: opacity;\n    transform: none;\n  }\n\n  .carousel-item.active,\n  .carousel-item-next.carousel-item-start,\n  .carousel-item-prev.carousel-item-end {\n    z-index: 1;\n    opacity: 1;\n  }\n\n  .active.carousel-item-start,\n  .active.carousel-item-end {\n    z-index: 0;\n    opacity: 0;\n    @include transition(opacity 0s $carousel-transition-duration);\n  }\n}\n\n\n//\n// Left/right controls for nav\n//\n\n.carousel-control-prev,\n.carousel-control-next {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  z-index: 1;\n  // Use flex for alignment (1-3)\n  display: flex; // 1. allow flex styles\n  align-items: center; // 2. vertically center contents\n  justify-content: center; // 3. horizontally center contents\n  width: $carousel-control-width;\n  padding: 0;\n  color: $carousel-control-color;\n  text-align: center;\n  background: none;\n  border: 0;\n  opacity: $carousel-control-opacity;\n  @include transition($carousel-control-transition);\n\n  // Hover/focus state\n  &:hover,\n  &:focus {\n    color: $carousel-control-color;\n    text-decoration: none;\n    outline: 0;\n    opacity: $carousel-control-hover-opacity;\n  }\n}\n.carousel-control-prev {\n  left: 0;\n  background-image: if($enable-gradients, linear-gradient(90deg, rgba($black, .25), rgba($black, .001)), null);\n}\n.carousel-control-next {\n  right: 0;\n  background-image: if($enable-gradients, linear-gradient(270deg, rgba($black, .25), rgba($black, .001)), null);\n}\n\n// Icons for within\n.carousel-control-prev-icon,\n.carousel-control-next-icon {\n  display: inline-block;\n  width: $carousel-control-icon-width;\n  height: $carousel-control-icon-width;\n  background-repeat: no-repeat;\n  background-position: 50%;\n  background-size: 100% 100%;\n}\n\n/* rtl:options: {\n  \"autoRename\": true,\n  \"stringMap\":[ {\n    \"name\"    : \"prev-next\",\n    \"search\"  : \"prev\",\n    \"replace\" : \"next\"\n  } ]\n} */\n.carousel-control-prev-icon {\n  background-image: escape-svg($carousel-control-prev-icon-bg);\n}\n.carousel-control-next-icon {\n  background-image: escape-svg($carousel-control-next-icon-bg);\n}\n\n// Optional indicator pips/controls\n//\n// Add a container (such as a list) with the following class and add an item (ideally a focusable control,\n// like a button) with data-bs-target for each slide your carousel holds.\n\n.carousel-indicators {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 2;\n  display: flex;\n  justify-content: center;\n  padding: 0;\n  // Use the .carousel-control's width as margin so we don't overlay those\n  margin-right: $carousel-control-width;\n  margin-bottom: 1rem;\n  margin-left: $carousel-control-width;\n  list-style: none;\n\n  [data-bs-target] {\n    box-sizing: content-box;\n    flex: 0 1 auto;\n    width: $carousel-indicator-width;\n    height: $carousel-indicator-height;\n    padding: 0;\n    margin-right: $carousel-indicator-spacer;\n    margin-left: $carousel-indicator-spacer;\n    text-indent: -999px;\n    cursor: pointer;\n    background-color: $carousel-indicator-active-bg;\n    background-clip: padding-box;\n    border: 0;\n    // Use transparent borders to increase the hit area by 10px on top and bottom.\n    border-top: $carousel-indicator-hit-area-height solid transparent;\n    border-bottom: $carousel-indicator-hit-area-height solid transparent;\n    opacity: $carousel-indicator-opacity;\n    @include transition($carousel-indicator-transition);\n  }\n\n  .active {\n    opacity: $carousel-indicator-active-opacity;\n  }\n}\n\n\n// Optional captions\n//\n//\n\n.carousel-caption {\n  position: absolute;\n  right: (100% - $carousel-caption-width) * .5;\n  bottom: $carousel-caption-spacer;\n  left: (100% - $carousel-caption-width) * .5;\n  padding-top: $carousel-caption-padding-y;\n  padding-bottom: $carousel-caption-padding-y;\n  color: $carousel-caption-color;\n  text-align: center;\n}\n\n// Dark mode carousel\n\n.carousel-dark {\n  .carousel-control-prev-icon,\n  .carousel-control-next-icon {\n    filter: $carousel-dark-control-icon-filter;\n  }\n\n  .carousel-indicators [data-bs-target] {\n    background-color: $carousel-dark-indicator-active-bg;\n  }\n\n  .carousel-caption {\n    color: $carousel-dark-caption-color;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_close.scss",
    "content": "// transparent background and border properties included for button version.\n// iOS requires the button element instead of an anchor tag.\n// If you want the anchor version, it requires `href=\"#\"`.\n// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile\n\n.btn-close {\n  box-sizing: content-box;\n  width: $btn-close-width;\n  height: $btn-close-height;\n  padding: $btn-close-padding-y $btn-close-padding-x;\n  color: $btn-close-color;\n  background: transparent escape-svg($btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements\n  border: 0; // for button elements\n  @include border-radius();\n  opacity: $btn-close-opacity;\n\n  // Override <a>'s hover style\n  &:hover {\n    color: $btn-close-color;\n    text-decoration: none;\n    opacity: $btn-close-hover-opacity;\n  }\n\n  &:focus {\n    outline: 0;\n    box-shadow: $btn-close-focus-shadow;\n    opacity: $btn-close-focus-opacity;\n  }\n\n  &:disabled,\n  &.disabled {\n    pointer-events: none;\n    user-select: none;\n    opacity: $btn-close-disabled-opacity;\n  }\n}\n\n.btn-close-white {\n  filter: $btn-close-white-filter;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_containers.scss",
    "content": "// Container widths\n//\n// Set the container width, and override it for fixed navbars in media queries.\n\n@if $enable-grid-classes {\n  // Single container class with breakpoint max-widths\n  .container,\n  // 100% wide container at all breakpoints\n  .container-fluid {\n    @include make-container();\n  }\n\n  // Responsive containers that are 100% wide until a breakpoint\n  @each $breakpoint, $container-max-width in $container-max-widths {\n    .container-#{$breakpoint} {\n      @extend .container-fluid;\n    }\n\n    @include media-breakpoint-up($breakpoint, $grid-breakpoints) {\n      %responsive-container-#{$breakpoint} {\n        max-width: $container-max-width;\n      }\n\n      // Extend each breakpoint which is smaller or equal to the current breakpoint\n      $extend-breakpoint: true;\n\n      @each $name, $width in $grid-breakpoints {\n        @if ($extend-breakpoint) {\n          .container#{breakpoint-infix($name, $grid-breakpoints)} {\n            @extend %responsive-container-#{$breakpoint};\n          }\n\n          // Once the current breakpoint is reached, stop extending\n          @if ($breakpoint == $name) {\n            $extend-breakpoint: false;\n          }\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_dropdown.scss",
    "content": "// The dropdown wrapper (`<div>`)\n.dropup,\n.dropend,\n.dropdown,\n.dropstart {\n  position: relative;\n}\n\n.dropdown-toggle {\n  white-space: nowrap;\n\n  // Generate the caret automatically\n  @include caret();\n}\n\n// The dropdown menu\n.dropdown-menu {\n  position: absolute;\n  z-index: $zindex-dropdown;\n  display: none; // none by default, but block on \"open\" of the menu\n  min-width: $dropdown-min-width;\n  padding: $dropdown-padding-y $dropdown-padding-x;\n  margin: 0; // Override default margin of ul\n  @include font-size($dropdown-font-size);\n  color: $dropdown-color;\n  text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)\n  list-style: none;\n  background-color: $dropdown-bg;\n  background-clip: padding-box;\n  border: $dropdown-border-width solid $dropdown-border-color;\n  @include border-radius($dropdown-border-radius);\n  @include box-shadow($dropdown-box-shadow);\n\n  &[data-bs-popper] {\n    top: 100%;\n    left: 0;\n    margin-top: $dropdown-spacer;\n  }\n}\n\n// scss-docs-start responsive-breakpoints\n// We deliberately hardcode the `bs-` prefix because we check\n// this custom property in JS to determine Popper's positioning\n\n@each $breakpoint in map-keys($grid-breakpoints) {\n  @include media-breakpoint-up($breakpoint) {\n    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n    .dropdown-menu#{$infix}-start {\n      --bs-position: start;\n\n      &[data-bs-popper] {\n        right: auto;\n        left: 0;\n      }\n    }\n\n    .dropdown-menu#{$infix}-end {\n      --bs-position: end;\n\n      &[data-bs-popper] {\n        right: 0;\n        left: auto;\n      }\n    }\n  }\n}\n// scss-docs-end responsive-breakpoints\n\n// Allow for dropdowns to go bottom up (aka, dropup-menu)\n// Just add .dropup after the standard .dropdown class and you're set.\n.dropup {\n  .dropdown-menu[data-bs-popper] {\n    top: auto;\n    bottom: 100%;\n    margin-top: 0;\n    margin-bottom: $dropdown-spacer;\n  }\n\n  .dropdown-toggle {\n    @include caret(up);\n  }\n}\n\n.dropend {\n  .dropdown-menu[data-bs-popper] {\n    top: 0;\n    right: auto;\n    left: 100%;\n    margin-top: 0;\n    margin-left: $dropdown-spacer;\n  }\n\n  .dropdown-toggle {\n    @include caret(end);\n    &::after {\n      vertical-align: 0;\n    }\n  }\n}\n\n.dropstart {\n  .dropdown-menu[data-bs-popper] {\n    top: 0;\n    right: 100%;\n    left: auto;\n    margin-top: 0;\n    margin-right: $dropdown-spacer;\n  }\n\n  .dropdown-toggle {\n    @include caret(start);\n    &::before {\n      vertical-align: 0;\n    }\n  }\n}\n\n\n// Dividers (basically an `<hr>`) within the dropdown\n.dropdown-divider {\n  height: 0;\n  margin: $dropdown-divider-margin-y 0;\n  overflow: hidden;\n  border-top: 1px solid $dropdown-divider-bg;\n}\n\n// Links, buttons, and more within the dropdown menu\n//\n// `<button>`-specific styles are denoted with `// For <button>s`\n.dropdown-item {\n  display: block;\n  width: 100%; // For `<button>`s\n  padding: $dropdown-item-padding-y $dropdown-item-padding-x;\n  clear: both;\n  font-weight: $font-weight-normal;\n  color: $dropdown-link-color;\n  text-align: inherit; // For `<button>`s\n  text-decoration: if($link-decoration == none, null, none);\n  white-space: nowrap; // prevent links from randomly breaking onto new lines\n  background-color: transparent; // For `<button>`s\n  border: 0; // For `<button>`s\n\n  // Prevent dropdown overflow if there's no padding\n  // See https://github.com/twbs/bootstrap/pull/27703\n  @if $dropdown-padding-y == 0 {\n    &:first-child {\n      @include border-top-radius($dropdown-inner-border-radius);\n    }\n\n    &:last-child {\n      @include border-bottom-radius($dropdown-inner-border-radius);\n    }\n  }\n\n  &:hover,\n  &:focus {\n    color: $dropdown-link-hover-color;\n    text-decoration: if($link-hover-decoration == underline, none, null);\n    @include gradient-bg($dropdown-link-hover-bg);\n  }\n\n  &.active,\n  &:active {\n    color: $dropdown-link-active-color;\n    text-decoration: none;\n    @include gradient-bg($dropdown-link-active-bg);\n  }\n\n  &.disabled,\n  &:disabled {\n    color: $dropdown-link-disabled-color;\n    pointer-events: none;\n    background-color: transparent;\n    // Remove CSS gradients if they're enabled\n    background-image: if($enable-gradients, none, null);\n  }\n}\n\n.dropdown-menu.show {\n  display: block;\n}\n\n// Dropdown section headers\n.dropdown-header {\n  display: block;\n  padding: $dropdown-header-padding;\n  margin-bottom: 0; // for use with heading elements\n  @include font-size($font-size-sm);\n  color: $dropdown-header-color;\n  white-space: nowrap; // as with > li > a\n}\n\n// Dropdown text\n.dropdown-item-text {\n  display: block;\n  padding: $dropdown-item-padding-y $dropdown-item-padding-x;\n  color: $dropdown-link-color;\n}\n\n// Dark dropdowns\n.dropdown-menu-dark {\n  color: $dropdown-dark-color;\n  background-color: $dropdown-dark-bg;\n  border-color: $dropdown-dark-border-color;\n  @include box-shadow($dropdown-dark-box-shadow);\n\n  .dropdown-item {\n    color: $dropdown-dark-link-color;\n\n    &:hover,\n    &:focus {\n      color: $dropdown-dark-link-hover-color;\n      @include gradient-bg($dropdown-dark-link-hover-bg);\n    }\n\n    &.active,\n    &:active {\n      color: $dropdown-dark-link-active-color;\n      @include gradient-bg($dropdown-dark-link-active-bg);\n    }\n\n    &.disabled,\n    &:disabled {\n      color: $dropdown-dark-link-disabled-color;\n    }\n  }\n\n  .dropdown-divider {\n    border-color: $dropdown-dark-divider-bg;\n  }\n\n  .dropdown-item-text {\n    color: $dropdown-dark-link-color;\n  }\n\n  .dropdown-header {\n    color: $dropdown-dark-header-color;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_forms.scss",
    "content": "@import \"forms/labels\";\n@import \"forms/form-text\";\n@import \"forms/form-control\";\n@import \"forms/form-select\";\n@import \"forms/form-check\";\n@import \"forms/form-range\";\n@import \"forms/floating-labels\";\n@import \"forms/input-group\";\n@import \"forms/validation\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_functions.scss",
    "content": "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n  $prev-key: null;\n  $prev-num: null;\n  @each $key, $num in $map {\n    @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n      // Do nothing\n    } @else if not comparable($prev-num, $num) {\n      @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n    } @else if $prev-num >= $num {\n      @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n    }\n    $prev-key: $key;\n    $prev-num: $num;\n  }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n  @if length($map) > 0 {\n    $values: map-values($map);\n    $first-value: nth($values, 1);\n    @if $first-value != 0 {\n      @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n    }\n  }\n}\n\n// Colors\n@function to-rgb($value) {\n  @return red($value), green($value), blue($value);\n}\n\n// stylelint-disable scss/dollar-variable-pattern\n@function rgba-css-var($identifier, $target) {\n  @if $identifier == \"body\" and $target == \"bg\" {\n    @return rgba(var(--#{$variable-prefix}#{$identifier}-bg-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n  } @if $identifier == \"body\" and $target == \"text\" {\n    @return rgba(var(--#{$variable-prefix}#{$identifier}-color-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n  } @else {\n    @return rgba(var(--#{$variable-prefix}#{$identifier}-rgb), var(--#{$variable-prefix}#{$target}-opacity));\n  }\n}\n\n@function map-loop($map, $func, $args...) {\n  $_map: ();\n\n  @each $key, $value in $map {\n    // allow to pass the $key and $value of the map as an function argument\n    $_args: ();\n    @each $arg in $args {\n      $_args: append($_args, if($arg == \"$key\", $key, if($arg == \"$value\", $value, $arg)));\n    }\n\n    $_map: map-merge($_map, ($key: call(get-function($func), $_args...)));\n  }\n\n  @return $_map;\n}\n// stylelint-enable scss/dollar-variable-pattern\n\n@function varify($list) {\n  $result: null;\n  @each $entry in $list {\n    $result: append($result, var(--#{$variable-prefix}#{$entry}), space);\n  }\n  @return $result;\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n  $result: ();\n  @each $key, $value in $map {\n    @if $key != 0 {\n      $result: map-merge($result, (\"n\" + $key: (-$value)));\n    }\n  }\n  @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n  $result: ();\n  @each $key, $value in $map {\n    @if (index($values, $key) != null) {\n      $result: map-merge($result, ($key: $value));\n    }\n  }\n  @return $result;\n}\n\n// Merge multiple maps\n@function map-merge-multiple($maps...) {\n  $merged-maps: ();\n\n  @each $map in $maps {\n    $merged-maps: map-merge($merged-maps, $map);\n  }\n  @return $merged-maps;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n  $index: str-index($string, $search);\n\n  @if $index {\n    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n  }\n\n  @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n  @if str-index($string, \"data:image/svg+xml\") {\n    @each $char, $encoded in $escaped-characters {\n      // Do not escape the url brackets\n      @if str-index($string, \"url(\") == 1 {\n        $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n      } @else {\n        $string: str-replace($string, $char, $encoded);\n      }\n    }\n  }\n\n  @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0123 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n  $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n  $max-ratio: 0;\n  $max-ratio-color: null;\n\n  @each $color in $foregrounds {\n    $contrast-ratio: contrast-ratio($background, $color);\n    @if $contrast-ratio > $min-contrast-ratio {\n      @return $color;\n    } @else if $contrast-ratio > $max-ratio {\n      $max-ratio: $contrast-ratio;\n      $max-ratio-color: $color;\n    }\n  }\n\n  @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n  @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n  $l1: luminance($background);\n  $l2: luminance(opaque($background, $foreground));\n\n  @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n  $rgb: (\n    \"r\": red($color),\n    \"g\": green($color),\n    \"b\": blue($color)\n  );\n\n  @each $name, $value in $rgb {\n    $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));\n    $rgb: map-merge($rgb, ($name: $value));\n  }\n\n  @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n  @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n  @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n  @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n  @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n  @if $value1 == null {\n    @return $value2;\n  }\n\n  @if $value2 == null {\n    @return $value1;\n  }\n\n  @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n    @return $value1 + $value2;\n  }\n\n  @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n  @if $value1 == null and $value2 == null {\n    @return null;\n  }\n\n  @if $value1 == null {\n    @return -$value2;\n  }\n\n  @if $value2 == null {\n    @return $value1;\n  }\n\n  @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n    @return $value1 - $value2;\n  }\n\n  @if type-of($value2) != number {\n    $value2: unquote(\"(\") + $value2 + unquote(\")\");\n  }\n\n  @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n\n@function divide($dividend, $divisor, $precision: 10) {\n  $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n  $dividend: abs($dividend);\n  $divisor: abs($divisor);\n  @if $dividend == 0 {\n    @return 0;\n  }\n  @if $divisor == 0 {\n    @error \"Cannot divide by 0\";\n  }\n  $remainder: $dividend;\n  $result: 0;\n  $factor: 10;\n  @while ($remainder > 0 and $precision >= 0) {\n    $quotient: 0;\n    @while ($remainder >= $divisor) {\n      $remainder: $remainder - $divisor;\n      $quotient: $quotient + 1;\n    }\n    $result: $result * 10 + $quotient;\n    $factor: $factor * .1;\n    $remainder: $remainder * 10;\n    $precision: $precision - 1;\n    @if ($precision < 0 and $remainder >= $divisor * 5) {\n      $result: $result + 1;\n    }\n  }\n  $result: $result * $factor * $sign;\n  $dividend-unit: unit($dividend);\n  $divisor-unit: unit($divisor);\n  $unit-map: (\n    \"px\": 1px,\n    \"rem\": 1rem,\n    \"em\": 1em,\n    \"%\": 1%\n  );\n  @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n    $result: $result * map-get($unit-map, $dividend-unit);\n  }\n  @return $result;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_grid.scss",
    "content": "// Row\n//\n// Rows contain your columns.\n\n@if $enable-grid-classes {\n  .row {\n    @include make-row();\n\n    > * {\n      @include make-col-ready();\n    }\n  }\n}\n\n@if $enable-cssgrid {\n  .grid {\n    display: grid;\n    grid-template-rows: repeat(var(--#{$variable-prefix}rows, 1), 1fr);\n    grid-template-columns: repeat(var(--#{$variable-prefix}columns, #{$grid-columns}), 1fr);\n    gap: var(--#{$variable-prefix}gap, #{$grid-gutter-width});\n\n    @include make-cssgrid();\n  }\n}\n\n\n// Columns\n//\n// Common styles for small and large grid columns\n\n@if $enable-grid-classes {\n  @include make-grid-columns();\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_helpers.scss",
    "content": "@import \"helpers/clearfix\";\n@import \"helpers/colored-links\";\n@import \"helpers/ratio\";\n@import \"helpers/position\";\n@import \"helpers/stacks\";\n@import \"helpers/visually-hidden\";\n@import \"helpers/stretched-link\";\n@import \"helpers/text-truncation\";\n@import \"helpers/vr\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_images.scss",
    "content": "// Responsive images (ensure images don't scale beyond their parents)\n//\n// This is purposefully opt-in via an explicit class rather than being the default for all `<img>`s.\n// We previously tried the \"images are responsive by default\" approach in Bootstrap v2,\n// and abandoned it in Bootstrap v3 because it breaks lots of third-party widgets (including Google Maps)\n// which weren't expecting the images within themselves to be involuntarily resized.\n// See also https://github.com/twbs/bootstrap/issues/18178\n.img-fluid {\n  @include img-fluid();\n}\n\n\n// Image thumbnails\n.img-thumbnail {\n  padding: $thumbnail-padding;\n  background-color: $thumbnail-bg;\n  border: $thumbnail-border-width solid $thumbnail-border-color;\n  @include border-radius($thumbnail-border-radius);\n  @include box-shadow($thumbnail-box-shadow);\n\n  // Keep them at most 100% wide\n  @include img-fluid();\n}\n\n//\n// Figures\n//\n\n.figure {\n  // Ensures the caption's text aligns with the image.\n  display: inline-block;\n}\n\n.figure-img {\n  margin-bottom: $spacer * .5;\n  line-height: 1;\n}\n\n.figure-caption {\n  @include font-size($figure-caption-font-size);\n  color: $figure-caption-color;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_list-group.scss",
    "content": "// Base class\n//\n// Easily usable on <ul>, <ol>, or <div>.\n\n.list-group {\n  display: flex;\n  flex-direction: column;\n\n  // No need to set list-style: none; since .list-group-item is block level\n  padding-left: 0; // reset padding because ul and ol\n  margin-bottom: 0;\n  @include border-radius($list-group-border-radius);\n}\n\n.list-group-numbered {\n  list-style-type: none;\n  counter-reset: section;\n\n  > li::before {\n    // Increments only this instance of the section counter\n    content: counters(section, \".\") \". \";\n    counter-increment: section;\n  }\n}\n\n\n// Interactive list items\n//\n// Use anchor or button elements instead of `li`s or `div`s to create interactive\n// list items. Includes an extra `.active` modifier class for selected items.\n\n.list-group-item-action {\n  width: 100%; // For `<button>`s (anchors become 100% by default though)\n  color: $list-group-action-color;\n  text-align: inherit; // For `<button>`s (anchors inherit)\n\n  // Hover state\n  &:hover,\n  &:focus {\n    z-index: 1; // Place hover/focus items above their siblings for proper border styling\n    color: $list-group-action-hover-color;\n    text-decoration: none;\n    background-color: $list-group-hover-bg;\n  }\n\n  &:active {\n    color: $list-group-action-active-color;\n    background-color: $list-group-action-active-bg;\n  }\n}\n\n\n// Individual list items\n//\n// Use on `li`s or `div`s within the `.list-group` parent.\n\n.list-group-item {\n  position: relative;\n  display: block;\n  padding: $list-group-item-padding-y $list-group-item-padding-x;\n  color: $list-group-color;\n  text-decoration: if($link-decoration == none, null, none);\n  background-color: $list-group-bg;\n  border: $list-group-border-width solid $list-group-border-color;\n\n  &:first-child {\n    @include border-top-radius(inherit);\n  }\n\n  &:last-child {\n    @include border-bottom-radius(inherit);\n  }\n\n  &.disabled,\n  &:disabled {\n    color: $list-group-disabled-color;\n    pointer-events: none;\n    background-color: $list-group-disabled-bg;\n  }\n\n  // Include both here for `<a>`s and `<button>`s\n  &.active {\n    z-index: 2; // Place active items above their siblings for proper border styling\n    color: $list-group-active-color;\n    background-color: $list-group-active-bg;\n    border-color: $list-group-active-border-color;\n  }\n\n  & + & {\n    border-top-width: 0;\n\n    &.active {\n      margin-top: -$list-group-border-width;\n      border-top-width: $list-group-border-width;\n    }\n  }\n}\n\n\n// Horizontal\n//\n// Change the layout of list group items from vertical (default) to horizontal.\n\n@each $breakpoint in map-keys($grid-breakpoints) {\n  @include media-breakpoint-up($breakpoint) {\n    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n    .list-group-horizontal#{$infix} {\n      flex-direction: row;\n\n      > .list-group-item {\n        &:first-child {\n          @include border-bottom-start-radius($list-group-border-radius);\n          @include border-top-end-radius(0);\n        }\n\n        &:last-child {\n          @include border-top-end-radius($list-group-border-radius);\n          @include border-bottom-start-radius(0);\n        }\n\n        &.active {\n          margin-top: 0;\n        }\n\n        + .list-group-item {\n          border-top-width: $list-group-border-width;\n          border-left-width: 0;\n\n          &.active {\n            margin-left: -$list-group-border-width;\n            border-left-width: $list-group-border-width;\n          }\n        }\n      }\n    }\n  }\n}\n\n\n// Flush list items\n//\n// Remove borders and border-radius to keep list group items edge-to-edge. Most\n// useful within other components (e.g., cards).\n\n.list-group-flush {\n  @include border-radius(0);\n\n  > .list-group-item {\n    border-width: 0 0 $list-group-border-width;\n\n    &:last-child {\n      border-bottom-width: 0;\n    }\n  }\n}\n\n\n// scss-docs-start list-group-modifiers\n// List group contextual variants\n//\n// Add modifier classes to change text and background color on individual items.\n// Organizationally, this must come after the `:hover` states.\n\n@each $state, $value in $theme-colors {\n  $list-group-variant-bg: shift-color($value, $list-group-item-bg-scale);\n  $list-group-variant-color: shift-color($value, $list-group-item-color-scale);\n  @if (contrast-ratio($list-group-variant-bg, $list-group-variant-color) < $min-contrast-ratio) {\n    $list-group-variant-color: mix($value, color-contrast($list-group-variant-bg), abs($list-group-item-color-scale));\n  }\n\n  @include list-group-item-variant($state, $list-group-variant-bg, $list-group-variant-color);\n}\n// scss-docs-end list-group-modifiers\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_mixins.scss",
    "content": "// Toggles\n//\n// Used in conjunction with global variables to enable certain theme features.\n\n// Vendor\n@import \"vendor/rfs\";\n\n// Deprecate\n@import \"mixins/deprecate\";\n\n// Helpers\n@import \"mixins/breakpoints\";\n@import \"mixins/color-scheme\";\n@import \"mixins/image\";\n@import \"mixins/resize\";\n@import \"mixins/visually-hidden\";\n@import \"mixins/reset-text\";\n@import \"mixins/text-truncate\";\n\n// Utilities\n@import \"mixins/utilities\";\n\n// Components\n@import \"mixins/alert\";\n@import \"mixins/backdrop\";\n@import \"mixins/buttons\";\n@import \"mixins/caret\";\n@import \"mixins/pagination\";\n@import \"mixins/lists\";\n@import \"mixins/list-group\";\n@import \"mixins/forms\";\n@import \"mixins/table-variants\";\n\n// Skins\n@import \"mixins/border-radius\";\n@import \"mixins/box-shadow\";\n@import \"mixins/gradients\";\n@import \"mixins/transition\";\n\n// Layout\n@import \"mixins/clearfix\";\n@import \"mixins/container\";\n@import \"mixins/grid\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_modal.scss",
    "content": "// .modal-open      - body class for killing the scroll\n// .modal           - container to scroll within\n// .modal-dialog    - positioning shell for the actual modal\n// .modal-content   - actual modal w/ bg and corners and stuff\n\n\n// Container that the modal scrolls within\n.modal {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: $zindex-modal;\n  display: none;\n  width: 100%;\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  // Prevent Chrome on Windows from adding a focus outline. For details, see\n  // https://github.com/twbs/bootstrap/pull/10951.\n  outline: 0;\n  // We deliberately don't use `-webkit-overflow-scrolling: touch;` due to a\n  // gnarly iOS Safari bug: https://bugs.webkit.org/show_bug.cgi?id=158342\n  // See also https://github.com/twbs/bootstrap/issues/17695\n}\n\n// Shell div to position the modal with bottom padding\n.modal-dialog {\n  position: relative;\n  width: auto;\n  margin: $modal-dialog-margin;\n  // allow clicks to pass through for custom click handling to close modal\n  pointer-events: none;\n\n  // When fading in the modal, animate it to slide down\n  .modal.fade & {\n    @include transition($modal-transition);\n    transform: $modal-fade-transform;\n  }\n  .modal.show & {\n    transform: $modal-show-transform;\n  }\n\n  // When trying to close, animate focus to scale\n  .modal.modal-static & {\n    transform: $modal-scale-transform;\n  }\n}\n\n.modal-dialog-scrollable {\n  height: subtract(100%, $modal-dialog-margin * 2);\n\n  .modal-content {\n    max-height: 100%;\n    overflow: hidden;\n  }\n\n  .modal-body {\n    overflow-y: auto;\n  }\n}\n\n.modal-dialog-centered {\n  display: flex;\n  align-items: center;\n  min-height: subtract(100%, $modal-dialog-margin * 2);\n}\n\n// Actual modal\n.modal-content {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%; // Ensure `.modal-content` extends the full width of the parent `.modal-dialog`\n  // counteract the pointer-events: none; in the .modal-dialog\n  color: $modal-content-color;\n  pointer-events: auto;\n  background-color: $modal-content-bg;\n  background-clip: padding-box;\n  border: $modal-content-border-width solid $modal-content-border-color;\n  @include border-radius($modal-content-border-radius);\n  @include box-shadow($modal-content-box-shadow-xs);\n  // Remove focus outline from opened modal\n  outline: 0;\n}\n\n// Modal background\n.modal-backdrop {\n  @include overlay-backdrop($zindex-modal-backdrop, $modal-backdrop-bg, $modal-backdrop-opacity);\n}\n\n// Modal header\n// Top section of the modal w/ title and dismiss\n.modal-header {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends\n  padding: $modal-header-padding;\n  border-bottom: $modal-header-border-width solid $modal-header-border-color;\n  @include border-top-radius($modal-content-inner-border-radius);\n\n  .btn-close {\n    padding: ($modal-header-padding-y * .5) ($modal-header-padding-x * .5);\n    margin: ($modal-header-padding-y * -.5) ($modal-header-padding-x * -.5) ($modal-header-padding-y * -.5) auto;\n  }\n}\n\n// Title text within header\n.modal-title {\n  margin-bottom: 0;\n  line-height: $modal-title-line-height;\n}\n\n// Modal body\n// Where all modal content resides (sibling of .modal-header and .modal-footer)\n.modal-body {\n  position: relative;\n  // Enable `flex-grow: 1` so that the body take up as much space as possible\n  // when there should be a fixed height on `.modal-dialog`.\n  flex: 1 1 auto;\n  padding: $modal-inner-padding;\n}\n\n// Footer (for actions)\n.modal-footer {\n  display: flex;\n  flex-wrap: wrap;\n  flex-shrink: 0;\n  align-items: center; // vertically center\n  justify-content: flex-end; // Right align buttons with flex property because text-align doesn't work on flex items\n  padding: $modal-inner-padding - $modal-footer-margin-between * .5;\n  border-top: $modal-footer-border-width solid $modal-footer-border-color;\n  @include border-bottom-radius($modal-content-inner-border-radius);\n\n  // Place margin between footer elements\n  // This solution is far from ideal because of the universal selector usage,\n  // but is needed to fix https://github.com/twbs/bootstrap/issues/24800\n  > * {\n    margin: $modal-footer-margin-between * .5;\n  }\n}\n\n// Scale up the modal\n@include media-breakpoint-up(sm) {\n  // Automatically set modal's width for larger viewports\n  .modal-dialog {\n    max-width: $modal-md;\n    margin: $modal-dialog-margin-y-sm-up auto;\n  }\n\n  .modal-dialog-scrollable {\n    height: subtract(100%, $modal-dialog-margin-y-sm-up * 2);\n  }\n\n  .modal-dialog-centered {\n    min-height: subtract(100%, $modal-dialog-margin-y-sm-up * 2);\n  }\n\n  .modal-content {\n    @include box-shadow($modal-content-box-shadow-sm-up);\n  }\n\n  .modal-sm { max-width: $modal-sm; }\n}\n\n@include media-breakpoint-up(lg) {\n  .modal-lg,\n  .modal-xl {\n    max-width: $modal-lg;\n  }\n}\n\n@include media-breakpoint-up(xl) {\n  .modal-xl { max-width: $modal-xl; }\n}\n\n// scss-docs-start modal-fullscreen-loop\n@each $breakpoint in map-keys($grid-breakpoints) {\n  $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n  $postfix: if($infix != \"\", $infix + \"-down\", \"\");\n\n  @include media-breakpoint-down($breakpoint) {\n    .modal-fullscreen#{$postfix} {\n      width: 100vw;\n      max-width: none;\n      height: 100%;\n      margin: 0;\n\n      .modal-content {\n        height: 100%;\n        border: 0;\n        @include border-radius(0);\n      }\n\n      .modal-header {\n        @include border-radius(0);\n      }\n\n      .modal-body {\n        overflow-y: auto;\n      }\n\n      .modal-footer {\n        @include border-radius(0);\n      }\n    }\n  }\n}\n// scss-docs-end modal-fullscreen-loop\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_nav.scss",
    "content": "// Base class\n//\n// Kickstart any navigation component with a set of style resets. Works with\n// `<nav>`s, `<ul>`s or `<ol>`s.\n\n.nav {\n  display: flex;\n  flex-wrap: wrap;\n  padding-left: 0;\n  margin-bottom: 0;\n  list-style: none;\n}\n\n.nav-link {\n  display: block;\n  padding: $nav-link-padding-y $nav-link-padding-x;\n  @include font-size($nav-link-font-size);\n  font-weight: $nav-link-font-weight;\n  color: $nav-link-color;\n  text-decoration: if($link-decoration == none, null, none);\n  @include transition($nav-link-transition);\n\n  &:hover,\n  &:focus {\n    color: $nav-link-hover-color;\n    text-decoration: if($link-hover-decoration == underline, none, null);\n  }\n\n  // Disabled state lightens text\n  &.disabled {\n    color: $nav-link-disabled-color;\n    pointer-events: none;\n    cursor: default;\n  }\n}\n\n//\n// Tabs\n//\n\n.nav-tabs {\n  border-bottom: $nav-tabs-border-width solid $nav-tabs-border-color;\n\n  .nav-link {\n    margin-bottom: -$nav-tabs-border-width;\n    background: none;\n    border: $nav-tabs-border-width solid transparent;\n    @include border-top-radius($nav-tabs-border-radius);\n\n    &:hover,\n    &:focus {\n      border-color: $nav-tabs-link-hover-border-color;\n      // Prevents active .nav-link tab overlapping focus outline of previous/next .nav-link\n      isolation: isolate;\n    }\n\n    &.disabled {\n      color: $nav-link-disabled-color;\n      background-color: transparent;\n      border-color: transparent;\n    }\n  }\n\n  .nav-link.active,\n  .nav-item.show .nav-link {\n    color: $nav-tabs-link-active-color;\n    background-color: $nav-tabs-link-active-bg;\n    border-color: $nav-tabs-link-active-border-color;\n  }\n\n  .dropdown-menu {\n    // Make dropdown border overlap tab border\n    margin-top: -$nav-tabs-border-width;\n    // Remove the top rounded corners here since there is a hard edge above the menu\n    @include border-top-radius(0);\n  }\n}\n\n\n//\n// Pills\n//\n\n.nav-pills {\n  .nav-link {\n    background: none;\n    border: 0;\n    @include border-radius($nav-pills-border-radius);\n  }\n\n  .nav-link.active,\n  .show > .nav-link {\n    color: $nav-pills-link-active-color;\n    @include gradient-bg($nav-pills-link-active-bg);\n  }\n}\n\n\n//\n// Justified variants\n//\n\n.nav-fill {\n  > .nav-link,\n  .nav-item {\n    flex: 1 1 auto;\n    text-align: center;\n  }\n}\n\n.nav-justified {\n  > .nav-link,\n  .nav-item {\n    flex-basis: 0;\n    flex-grow: 1;\n    text-align: center;\n  }\n}\n\n.nav-fill,\n.nav-justified {\n  .nav-item .nav-link {\n    width: 100%; // Make sure button will grow\n  }\n}\n\n\n// Tabbable tabs\n//\n// Hide tabbable panes to start, show them when `.active`\n\n.tab-content {\n  > .tab-pane {\n    display: none;\n  }\n  > .active {\n    display: block;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_navbar.scss",
    "content": "// Contents\n//\n// Navbar\n// Navbar brand\n// Navbar nav\n// Navbar text\n// Responsive navbar\n// Navbar position\n// Navbar themes\n\n\n// Navbar\n//\n// Provide a static navbar from which we expand to create full-width, fixed, and\n// other navbar variations.\n\n.navbar {\n  position: relative;\n  display: flex;\n  flex-wrap: wrap; // allow us to do the line break for collapsing content\n  align-items: center;\n  justify-content: space-between; // space out brand from logo\n  padding-top: $navbar-padding-y;\n  padding-right: $navbar-padding-x; // default: null\n  padding-bottom: $navbar-padding-y;\n  padding-left: $navbar-padding-x; // default: null\n  @include gradient-bg();\n\n  // Because flex properties aren't inherited, we need to redeclare these first\n  // few properties so that content nested within behave properly.\n  // The `flex-wrap` property is inherited to simplify the expanded navbars\n  %container-flex-properties {\n    display: flex;\n    flex-wrap: inherit;\n    align-items: center;\n    justify-content: space-between;\n  }\n\n  > .container,\n  > .container-fluid {\n    @extend %container-flex-properties;\n  }\n\n  @each $breakpoint, $container-max-width in $container-max-widths {\n    > .container#{breakpoint-infix($breakpoint, $container-max-widths)} {\n      @extend %container-flex-properties;\n    }\n  }\n}\n\n\n// Navbar brand\n//\n// Used for brand, project, or site names.\n\n.navbar-brand {\n  padding-top: $navbar-brand-padding-y;\n  padding-bottom: $navbar-brand-padding-y;\n  margin-right: $navbar-brand-margin-end;\n  @include font-size($navbar-brand-font-size);\n  text-decoration: if($link-decoration == none, null, none);\n  white-space: nowrap;\n\n  &:hover,\n  &:focus {\n    text-decoration: if($link-hover-decoration == underline, none, null);\n  }\n}\n\n\n// Navbar nav\n//\n// Custom navbar navigation (doesn't require `.nav`, but does make use of `.nav-link`).\n\n.navbar-nav {\n  display: flex;\n  flex-direction: column; // cannot use `inherit` to get the `.navbar`s value\n  padding-left: 0;\n  margin-bottom: 0;\n  list-style: none;\n\n  .nav-link {\n    padding-right: 0;\n    padding-left: 0;\n  }\n\n  .dropdown-menu {\n    position: static;\n  }\n}\n\n\n// Navbar text\n//\n//\n\n.navbar-text {\n  padding-top: $nav-link-padding-y;\n  padding-bottom: $nav-link-padding-y;\n}\n\n\n// Responsive navbar\n//\n// Custom styles for responsive collapsing and toggling of navbar contents.\n// Powered by the collapse Bootstrap JavaScript plugin.\n\n// When collapsed, prevent the toggleable navbar contents from appearing in\n// the default flexbox row orientation. Requires the use of `flex-wrap: wrap`\n// on the `.navbar` parent.\n.navbar-collapse {\n  flex-basis: 100%;\n  flex-grow: 1;\n  // For always expanded or extra full navbars, ensure content aligns itself\n  // properly vertically. Can be easily overridden with flex utilities.\n  align-items: center;\n}\n\n// Button for toggling the navbar when in its collapsed state\n.navbar-toggler {\n  padding: $navbar-toggler-padding-y $navbar-toggler-padding-x;\n  @include font-size($navbar-toggler-font-size);\n  line-height: 1;\n  background-color: transparent; // remove default button style\n  border: $border-width solid transparent; // remove default button style\n  @include border-radius($navbar-toggler-border-radius);\n  @include transition($navbar-toggler-transition);\n\n  &:hover {\n    text-decoration: none;\n  }\n\n  &:focus {\n    text-decoration: none;\n    outline: 0;\n    box-shadow: 0 0 0 $navbar-toggler-focus-width;\n  }\n}\n\n// Keep as a separate element so folks can easily override it with another icon\n// or image file as needed.\n.navbar-toggler-icon {\n  display: inline-block;\n  width: 1.5em;\n  height: 1.5em;\n  vertical-align: middle;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: 100%;\n}\n\n.navbar-nav-scroll {\n  max-height: var(--#{$variable-prefix}scroll-height, 75vh);\n  overflow-y: auto;\n}\n\n// scss-docs-start navbar-expand-loop\n// Generate series of `.navbar-expand-*` responsive classes for configuring\n// where your navbar collapses.\n.navbar-expand {\n  @each $breakpoint in map-keys($grid-breakpoints) {\n    $next: breakpoint-next($breakpoint, $grid-breakpoints);\n    $infix: breakpoint-infix($next, $grid-breakpoints);\n\n    // stylelint-disable-next-line scss/selector-no-union-class-name\n    &#{$infix} {\n      @include media-breakpoint-up($next) {\n        flex-wrap: nowrap;\n        justify-content: flex-start;\n\n        .navbar-nav {\n          flex-direction: row;\n\n          .dropdown-menu {\n            position: absolute;\n          }\n\n          .nav-link {\n            padding-right: $navbar-nav-link-padding-x;\n            padding-left: $navbar-nav-link-padding-x;\n          }\n        }\n\n        .navbar-nav-scroll {\n          overflow: visible;\n        }\n\n        .navbar-collapse {\n          display: flex !important; // stylelint-disable-line declaration-no-important\n          flex-basis: auto;\n        }\n\n        .navbar-toggler {\n          display: none;\n        }\n\n        .offcanvas-header {\n          display: none;\n        }\n\n        .offcanvas {\n          position: inherit;\n          bottom: 0;\n          z-index: 1000;\n          flex-grow: 1;\n          visibility: visible !important; // stylelint-disable-line declaration-no-important\n          background-color: transparent;\n          border-right: 0;\n          border-left: 0;\n          @include transition(none);\n          transform: none;\n        }\n        .offcanvas-top,\n        .offcanvas-bottom {\n          height: auto;\n          border-top: 0;\n          border-bottom: 0;\n        }\n\n        .offcanvas-body {\n          display: flex;\n          flex-grow: 0;\n          padding: 0;\n          overflow-y: visible;\n        }\n      }\n    }\n  }\n}\n// scss-docs-end navbar-expand-loop\n\n// Navbar themes\n//\n// Styles for switching between navbars with light or dark background.\n\n// Dark links against a light background\n.navbar-light {\n  .navbar-brand {\n    color: $navbar-light-brand-color;\n\n    &:hover,\n    &:focus {\n      color: $navbar-light-brand-hover-color;\n    }\n  }\n\n  .navbar-nav {\n    .nav-link {\n      color: $navbar-light-color;\n\n      &:hover,\n      &:focus {\n        color: $navbar-light-hover-color;\n      }\n\n      &.disabled {\n        color: $navbar-light-disabled-color;\n      }\n    }\n\n    .show > .nav-link,\n    .nav-link.active {\n      color: $navbar-light-active-color;\n    }\n  }\n\n  .navbar-toggler {\n    color: $navbar-light-color;\n    border-color: $navbar-light-toggler-border-color;\n  }\n\n  .navbar-toggler-icon {\n    background-image: escape-svg($navbar-light-toggler-icon-bg);\n  }\n\n  .navbar-text {\n    color: $navbar-light-color;\n\n    a,\n    a:hover,\n    a:focus  {\n      color: $navbar-light-active-color;\n    }\n  }\n}\n\n// White links against a dark background\n.navbar-dark {\n  .navbar-brand {\n    color: $navbar-dark-brand-color;\n\n    &:hover,\n    &:focus {\n      color: $navbar-dark-brand-hover-color;\n    }\n  }\n\n  .navbar-nav {\n    .nav-link {\n      color: $navbar-dark-color;\n\n      &:hover,\n      &:focus {\n        color: $navbar-dark-hover-color;\n      }\n\n      &.disabled {\n        color: $navbar-dark-disabled-color;\n      }\n    }\n\n    .show > .nav-link,\n    .nav-link.active {\n      color: $navbar-dark-active-color;\n    }\n  }\n\n  .navbar-toggler {\n    color: $navbar-dark-color;\n    border-color: $navbar-dark-toggler-border-color;\n  }\n\n  .navbar-toggler-icon {\n    background-image: escape-svg($navbar-dark-toggler-icon-bg);\n  }\n\n  .navbar-text {\n    color: $navbar-dark-color;\n    a,\n    a:hover,\n    a:focus {\n      color: $navbar-dark-active-color;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_offcanvas.scss",
    "content": ".offcanvas {\n  position: fixed;\n  bottom: 0;\n  z-index: $zindex-offcanvas;\n  display: flex;\n  flex-direction: column;\n  max-width: 100%;\n  color: $offcanvas-color;\n  visibility: hidden;\n  background-color: $offcanvas-bg-color;\n  background-clip: padding-box;\n  outline: 0;\n  @include box-shadow($offcanvas-box-shadow);\n  @include transition(transform $offcanvas-transition-duration ease-in-out);\n}\n\n.offcanvas-backdrop {\n  @include overlay-backdrop($zindex-offcanvas-backdrop, $offcanvas-backdrop-bg, $offcanvas-backdrop-opacity);\n}\n\n.offcanvas-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: $offcanvas-padding-y $offcanvas-padding-x;\n\n  .btn-close {\n    padding: ($offcanvas-padding-y * .5) ($offcanvas-padding-x * .5);\n    margin-top: $offcanvas-padding-y * -.5;\n    margin-right: $offcanvas-padding-x * -.5;\n    margin-bottom: $offcanvas-padding-y * -.5;\n  }\n}\n\n.offcanvas-title {\n  margin-bottom: 0;\n  line-height: $offcanvas-title-line-height;\n}\n\n.offcanvas-body {\n  flex-grow: 1;\n  padding: $offcanvas-padding-y $offcanvas-padding-x;\n  overflow-y: auto;\n}\n\n.offcanvas-start {\n  top: 0;\n  left: 0;\n  width: $offcanvas-horizontal-width;\n  border-right: $offcanvas-border-width solid $offcanvas-border-color;\n  transform: translateX(-100%);\n}\n\n.offcanvas-end {\n  top: 0;\n  right: 0;\n  width: $offcanvas-horizontal-width;\n  border-left: $offcanvas-border-width solid $offcanvas-border-color;\n  transform: translateX(100%);\n}\n\n.offcanvas-top {\n  top: 0;\n  right: 0;\n  left: 0;\n  height: $offcanvas-vertical-height;\n  max-height: 100%;\n  border-bottom: $offcanvas-border-width solid $offcanvas-border-color;\n  transform: translateY(-100%);\n}\n\n.offcanvas-bottom {\n  right: 0;\n  left: 0;\n  height: $offcanvas-vertical-height;\n  max-height: 100%;\n  border-top: $offcanvas-border-width solid $offcanvas-border-color;\n  transform: translateY(100%);\n}\n\n.offcanvas.show {\n  transform: none;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_pagination.scss",
    "content": ".pagination {\n  display: flex;\n  @include list-unstyled();\n}\n\n.page-link {\n  position: relative;\n  display: block;\n  color: $pagination-color;\n  text-decoration: if($link-decoration == none, null, none);\n  background-color: $pagination-bg;\n  border: $pagination-border-width solid $pagination-border-color;\n  @include transition($pagination-transition);\n\n  &:hover {\n    z-index: 2;\n    color: $pagination-hover-color;\n    text-decoration: if($link-hover-decoration == underline, none, null);\n    background-color: $pagination-hover-bg;\n    border-color: $pagination-hover-border-color;\n  }\n\n  &:focus {\n    z-index: 3;\n    color: $pagination-focus-color;\n    background-color: $pagination-focus-bg;\n    outline: $pagination-focus-outline;\n    box-shadow: $pagination-focus-box-shadow;\n  }\n}\n\n.page-item {\n  &:not(:first-child) .page-link {\n    margin-left: $pagination-margin-start;\n  }\n\n  &.active .page-link {\n    z-index: 3;\n    color: $pagination-active-color;\n    @include gradient-bg($pagination-active-bg);\n    border-color: $pagination-active-border-color;\n  }\n\n  &.disabled .page-link {\n    color: $pagination-disabled-color;\n    pointer-events: none;\n    background-color: $pagination-disabled-bg;\n    border-color: $pagination-disabled-border-color;\n  }\n}\n\n\n//\n// Sizing\n//\n@include pagination-size($pagination-padding-y, $pagination-padding-x, null, $pagination-border-radius);\n\n.pagination-lg {\n  @include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $pagination-border-radius-lg);\n}\n\n.pagination-sm {\n  @include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $pagination-border-radius-sm);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_placeholders.scss",
    "content": ".placeholder {\n  display: inline-block;\n  min-height: 1em;\n  vertical-align: middle;\n  cursor: wait;\n  background-color: currentColor;\n  opacity: $placeholder-opacity-max;\n\n  &.btn::before {\n    display: inline-block;\n    content: \"\";\n  }\n}\n\n// Sizing\n.placeholder-xs {\n  min-height: .6em;\n}\n\n.placeholder-sm {\n  min-height: .8em;\n}\n\n.placeholder-lg {\n  min-height: 1.2em;\n}\n\n// Animation\n.placeholder-glow {\n  .placeholder {\n    animation: placeholder-glow 2s ease-in-out infinite;\n  }\n}\n\n@keyframes placeholder-glow {\n  50% {\n    opacity: $placeholder-opacity-min;\n  }\n}\n\n.placeholder-wave {\n  mask-image: linear-gradient(130deg, $black 55%, rgba(0, 0, 0, (1 - $placeholder-opacity-min)) 75%, $black 95%);\n  mask-size: 200% 100%;\n  animation: placeholder-wave 2s linear infinite;\n}\n\n@keyframes placeholder-wave {\n  100% {\n    mask-position: -200% 0%;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_popover.scss",
    "content": ".popover {\n  position: absolute;\n  top: 0;\n  left: 0 #{\"/* rtl:ignore */\"};\n  z-index: $zindex-popover;\n  display: block;\n  max-width: $popover-max-width;\n  // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.\n  // So reset our font and text properties to avoid inheriting weird values.\n  @include reset-text();\n  @include font-size($popover-font-size);\n  // Allow breaking very long words so they don't overflow the popover's bounds\n  word-wrap: break-word;\n  background-color: $popover-bg;\n  background-clip: padding-box;\n  border: $popover-border-width solid $popover-border-color;\n  @include border-radius($popover-border-radius);\n  @include box-shadow($popover-box-shadow);\n\n  .popover-arrow {\n    position: absolute;\n    display: block;\n    width: $popover-arrow-width;\n    height: $popover-arrow-height;\n\n    &::before,\n    &::after {\n      position: absolute;\n      display: block;\n      content: \"\";\n      border-color: transparent;\n      border-style: solid;\n    }\n  }\n}\n\n.bs-popover-top {\n  > .popover-arrow {\n    bottom: subtract(-$popover-arrow-height, $popover-border-width);\n\n    &::before {\n      bottom: 0;\n      border-width: $popover-arrow-height ($popover-arrow-width * .5) 0;\n      border-top-color: $popover-arrow-outer-color;\n    }\n\n    &::after {\n      bottom: $popover-border-width;\n      border-width: $popover-arrow-height ($popover-arrow-width * .5) 0;\n      border-top-color: $popover-arrow-color;\n    }\n  }\n}\n\n.bs-popover-end {\n  > .popover-arrow {\n    left: subtract(-$popover-arrow-height, $popover-border-width);\n    width: $popover-arrow-height;\n    height: $popover-arrow-width;\n\n    &::before {\n      left: 0;\n      border-width: ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5) 0;\n      border-right-color: $popover-arrow-outer-color;\n    }\n\n    &::after {\n      left: $popover-border-width;\n      border-width: ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5) 0;\n      border-right-color: $popover-arrow-color;\n    }\n  }\n}\n\n.bs-popover-bottom {\n  > .popover-arrow {\n    top: subtract(-$popover-arrow-height, $popover-border-width);\n\n    &::before {\n      top: 0;\n      border-width: 0 ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5);\n      border-bottom-color: $popover-arrow-outer-color;\n    }\n\n    &::after {\n      top: $popover-border-width;\n      border-width: 0 ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5);\n      border-bottom-color: $popover-arrow-color;\n    }\n  }\n\n  // This will remove the popover-header's border just below the arrow\n  .popover-header::before {\n    position: absolute;\n    top: 0;\n    left: 50%;\n    display: block;\n    width: $popover-arrow-width;\n    margin-left: -$popover-arrow-width * .5;\n    content: \"\";\n    border-bottom: $popover-border-width solid $popover-header-bg;\n  }\n}\n\n.bs-popover-start {\n  > .popover-arrow {\n    right: subtract(-$popover-arrow-height, $popover-border-width);\n    width: $popover-arrow-height;\n    height: $popover-arrow-width;\n\n    &::before {\n      right: 0;\n      border-width: ($popover-arrow-width * .5) 0 ($popover-arrow-width * .5) $popover-arrow-height;\n      border-left-color: $popover-arrow-outer-color;\n    }\n\n    &::after {\n      right: $popover-border-width;\n      border-width: ($popover-arrow-width * .5) 0 ($popover-arrow-width * .5) $popover-arrow-height;\n      border-left-color: $popover-arrow-color;\n    }\n  }\n}\n\n.bs-popover-auto {\n  &[data-popper-placement^=\"top\"] {\n    @extend .bs-popover-top;\n  }\n  &[data-popper-placement^=\"right\"] {\n    @extend .bs-popover-end;\n  }\n  &[data-popper-placement^=\"bottom\"] {\n    @extend .bs-popover-bottom;\n  }\n  &[data-popper-placement^=\"left\"] {\n    @extend .bs-popover-start;\n  }\n}\n\n// Offset the popover to account for the popover arrow\n.popover-header {\n  padding: $popover-header-padding-y $popover-header-padding-x;\n  margin-bottom: 0; // Reset the default from Reboot\n  @include font-size($font-size-base);\n  color: $popover-header-color;\n  background-color: $popover-header-bg;\n  border-bottom: $popover-border-width solid $popover-border-color;\n  @include border-top-radius($popover-inner-border-radius);\n\n  &:empty {\n    display: none;\n  }\n}\n\n.popover-body {\n  padding: $popover-body-padding-y $popover-body-padding-x;\n  color: $popover-body-color;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_progress.scss",
    "content": "// Disable animation if transitions are disabled\n\n// scss-docs-start progress-keyframes\n@if $enable-transitions {\n  @keyframes progress-bar-stripes {\n    0% { background-position-x: $progress-height; }\n  }\n}\n// scss-docs-end progress-keyframes\n\n.progress {\n  display: flex;\n  height: $progress-height;\n  overflow: hidden; // force rounded corners by cropping it\n  @include font-size($progress-font-size);\n  background-color: $progress-bg;\n  @include border-radius($progress-border-radius);\n  @include box-shadow($progress-box-shadow);\n}\n\n.progress-bar {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  overflow: hidden;\n  color: $progress-bar-color;\n  text-align: center;\n  white-space: nowrap;\n  background-color: $progress-bar-bg;\n  @include transition($progress-bar-transition);\n}\n\n.progress-bar-striped {\n  @include gradient-striped();\n  background-size: $progress-height $progress-height;\n}\n\n@if $enable-transitions {\n  .progress-bar-animated {\n    animation: $progress-bar-animation-timing progress-bar-stripes;\n\n    @if $enable-reduced-motion {\n      @media (prefers-reduced-motion: reduce) {\n        animation: none;\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_reboot.scss",
    "content": "// stylelint-disable declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix\n\n\n// Reboot\n//\n// Normalization of HTML elements, manually forked from Normalize.css to remove\n// styles targeting irrelevant browsers while applying new styles.\n//\n// Normalize is licensed MIT. https://github.com/necolas/normalize.css\n\n\n// Document\n//\n// Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n\n// Root\n//\n// Ability to the value of the root font sizes, affecting the value of `rem`.\n// null by default, thus nothing is generated.\n\n:root {\n  @if $font-size-root != null {\n    font-size: var(--#{$variable-prefix}root-font-size);\n  }\n\n  @if $enable-smooth-scroll {\n    @media (prefers-reduced-motion: no-preference) {\n      scroll-behavior: smooth;\n    }\n  }\n}\n\n\n// Body\n//\n// 1. Remove the margin in all browsers.\n// 2. As a best practice, apply a default `background-color`.\n// 3. Prevent adjustments of font size after orientation changes in iOS.\n// 4. Change the default tap highlight to be completely transparent in iOS.\n\n// scss-docs-start reboot-body-rules\nbody {\n  margin: 0; // 1\n  font-family: var(--#{$variable-prefix}body-font-family);\n  @include font-size(var(--#{$variable-prefix}body-font-size));\n  font-weight: var(--#{$variable-prefix}body-font-weight);\n  line-height: var(--#{$variable-prefix}body-line-height);\n  color: var(--#{$variable-prefix}body-color);\n  text-align: var(--#{$variable-prefix}body-text-align);\n  background-color: var(--#{$variable-prefix}body-bg); // 2\n  -webkit-text-size-adjust: 100%; // 3\n  -webkit-tap-highlight-color: rgba($black, 0); // 4\n}\n// scss-docs-end reboot-body-rules\n\n\n// Content grouping\n//\n// 1. Reset Firefox's gray color\n// 2. Set correct height and prevent the `size` attribute to make the `hr` look like an input field\n\nhr {\n  margin: $hr-margin-y 0;\n  color: $hr-color; // 1\n  background-color: currentColor;\n  border: 0;\n  opacity: $hr-opacity;\n}\n\nhr:not([size]) {\n  height: $hr-height; // 2\n}\n\n\n// Typography\n//\n// 1. Remove top margins from headings\n//    By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top\n//    margin for easier control within type scales as it avoids margin collapsing.\n\n%heading {\n  margin-top: 0; // 1\n  margin-bottom: $headings-margin-bottom;\n  font-family: $headings-font-family;\n  font-style: $headings-font-style;\n  font-weight: $headings-font-weight;\n  line-height: $headings-line-height;\n  color: $headings-color;\n}\n\nh1 {\n  @extend %heading;\n  @include font-size($h1-font-size);\n}\n\nh2 {\n  @extend %heading;\n  @include font-size($h2-font-size);\n}\n\nh3 {\n  @extend %heading;\n  @include font-size($h3-font-size);\n}\n\nh4 {\n  @extend %heading;\n  @include font-size($h4-font-size);\n}\n\nh5 {\n  @extend %heading;\n  @include font-size($h5-font-size);\n}\n\nh6 {\n  @extend %heading;\n  @include font-size($h6-font-size);\n}\n\n\n// Reset margins on paragraphs\n//\n// Similarly, the top margin on `<p>`s get reset. However, we also reset the\n// bottom margin to use `rem` units instead of `em`.\n\np {\n  margin-top: 0;\n  margin-bottom: $paragraph-margin-bottom;\n}\n\n\n// Abbreviations\n//\n// 1. Duplicate behavior to the data-bs-* attribute for our tooltip plugin\n// 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.\n// 3. Add explicit cursor to indicate changed behavior.\n// 4. Prevent the text-decoration to be skipped.\n\nabbr[title],\nabbr[data-bs-original-title] { // 1\n  text-decoration: underline dotted; // 2\n  cursor: help; // 3\n  text-decoration-skip-ink: none; // 4\n}\n\n\n// Address\n\naddress {\n  margin-bottom: 1rem;\n  font-style: normal;\n  line-height: inherit;\n}\n\n\n// Lists\n\nol,\nul {\n  padding-left: 2rem;\n}\n\nol,\nul,\ndl {\n  margin-top: 0;\n  margin-bottom: 1rem;\n}\n\nol ol,\nul ul,\nol ul,\nul ol {\n  margin-bottom: 0;\n}\n\ndt {\n  font-weight: $dt-font-weight;\n}\n\n// 1. Undo browser default\n\ndd {\n  margin-bottom: .5rem;\n  margin-left: 0; // 1\n}\n\n\n// Blockquote\n\nblockquote {\n  margin: 0 0 1rem;\n}\n\n\n// Strong\n//\n// Add the correct font weight in Chrome, Edge, and Safari\n\nb,\nstrong {\n  font-weight: $font-weight-bolder;\n}\n\n\n// Small\n//\n// Add the correct font size in all browsers\n\nsmall {\n  @include font-size($small-font-size);\n}\n\n\n// Mark\n\nmark {\n  padding: $mark-padding;\n  background-color: $mark-bg;\n}\n\n\n// Sub and Sup\n//\n// Prevent `sub` and `sup` elements from affecting the line height in\n// all browsers.\n\nsub,\nsup {\n  position: relative;\n  @include font-size($sub-sup-font-size);\n  line-height: 0;\n  vertical-align: baseline;\n}\n\nsub { bottom: -.25em; }\nsup { top: -.5em; }\n\n\n// Links\n\na {\n  color: $link-color;\n  text-decoration: $link-decoration;\n\n  &:hover {\n    color: $link-hover-color;\n    text-decoration: $link-hover-decoration;\n  }\n}\n\n// And undo these styles for placeholder links/named anchors (without href).\n// It would be more straightforward to just use a[href] in previous block, but that\n// causes specificity issues in many other styles that are too complex to fix.\n// See https://github.com/twbs/bootstrap/issues/19402\n\na:not([href]):not([class]) {\n  &,\n  &:hover {\n    color: inherit;\n    text-decoration: none;\n  }\n}\n\n\n// Code\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: $font-family-code;\n  @include font-size(1em); // Correct the odd `em` font sizing in all browsers.\n  direction: ltr #{\"/* rtl:ignore */\"};\n  unicode-bidi: bidi-override;\n}\n\n// 1. Remove browser default top margin\n// 2. Reset browser default of `1em` to use `rem`s\n// 3. Don't allow content to break outside\n\npre {\n  display: block;\n  margin-top: 0; // 1\n  margin-bottom: 1rem; // 2\n  overflow: auto; // 3\n  @include font-size($code-font-size);\n  color: $pre-color;\n\n  // Account for some code outputs that place code tags in pre tags\n  code {\n    @include font-size(inherit);\n    color: inherit;\n    word-break: normal;\n  }\n}\n\ncode {\n  @include font-size($code-font-size);\n  color: $code-color;\n  word-wrap: break-word;\n\n  // Streamline the style when inside anchors to avoid broken underline and more\n  a > & {\n    color: inherit;\n  }\n}\n\nkbd {\n  padding: $kbd-padding-y $kbd-padding-x;\n  @include font-size($kbd-font-size);\n  color: $kbd-color;\n  background-color: $kbd-bg;\n  @include border-radius($border-radius-sm);\n\n  kbd {\n    padding: 0;\n    @include font-size(1em);\n    font-weight: $nested-kbd-font-weight;\n  }\n}\n\n\n// Figures\n//\n// Apply a consistent margin strategy (matches our type styles).\n\nfigure {\n  margin: 0 0 1rem;\n}\n\n\n// Images and content\n\nimg,\nsvg {\n  vertical-align: middle;\n}\n\n\n// Tables\n//\n// Prevent double borders\n\ntable {\n  caption-side: bottom;\n  border-collapse: collapse;\n}\n\ncaption {\n  padding-top: $table-cell-padding-y;\n  padding-bottom: $table-cell-padding-y;\n  color: $table-caption-color;\n  text-align: left;\n}\n\n// 1. Removes font-weight bold by inheriting\n// 2. Matches default `<td>` alignment by inheriting `text-align`.\n// 3. Fix alignment for Safari\n\nth {\n  font-weight: $table-th-font-weight; // 1\n  text-align: inherit; // 2\n  text-align: -webkit-match-parent; // 3\n}\n\nthead,\ntbody,\ntfoot,\ntr,\ntd,\nth {\n  border-color: inherit;\n  border-style: solid;\n  border-width: 0;\n}\n\n\n// Forms\n//\n// 1. Allow labels to use `margin` for spacing.\n\nlabel {\n  display: inline-block; // 1\n}\n\n// Remove the default `border-radius` that macOS Chrome adds.\n// See https://github.com/twbs/bootstrap/issues/24093\n\nbutton {\n  // stylelint-disable-next-line property-disallowed-list\n  border-radius: 0;\n}\n\n// Explicitly remove focus outline in Chromium when it shouldn't be\n// visible (e.g. as result of mouse click or touch tap). It already\n// should be doing this automatically, but seems to currently be\n// confused and applies its very visible two-tone outline anyway.\n\nbutton:focus:not(:focus-visible) {\n  outline: 0;\n}\n\n// 1. Remove the margin in Firefox and Safari\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n  margin: 0; // 1\n  font-family: inherit;\n  @include font-size(inherit);\n  line-height: inherit;\n}\n\n// Remove the inheritance of text transform in Firefox\nbutton,\nselect {\n  text-transform: none;\n}\n// Set the cursor for non-`<button>` buttons\n//\n// Details at https://github.com/twbs/bootstrap/pull/30562\n[role=\"button\"] {\n  cursor: pointer;\n}\n\nselect {\n  // Remove the inheritance of word-wrap in Safari.\n  // See https://github.com/twbs/bootstrap/issues/24990\n  word-wrap: normal;\n\n  // Undo the opacity change from Chrome\n  &:disabled {\n    opacity: 1;\n  }\n}\n\n// Remove the dropdown arrow in Chrome from inputs built with datalists.\n// See https://stackoverflow.com/a/54997118\n\n[list]::-webkit-calendar-picker-indicator {\n  display: none;\n}\n\n// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`\n//    controls in Android 4.\n// 2. Correct the inability to style clickable types in iOS and Safari.\n// 3. Opinionated: add \"hand\" cursor to non-disabled button elements.\n\nbutton,\n[type=\"button\"], // 1\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button; // 2\n\n  @if $enable-button-pointers {\n    &:not(:disabled) {\n      cursor: pointer; // 3\n    }\n  }\n}\n\n// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.\n\n::-moz-focus-inner {\n  padding: 0;\n  border-style: none;\n}\n\n// 1. Textareas should really only resize vertically so they don't break their (horizontal) containers.\n\ntextarea {\n  resize: vertical; // 1\n}\n\n// 1. Browsers set a default `min-width: min-content;` on fieldsets,\n//    unlike e.g. `<div>`s, which have `min-width: 0;` by default.\n//    So we reset that to ensure fieldsets behave more like a standard block element.\n//    See https://github.com/twbs/bootstrap/issues/12359\n//    and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements\n// 2. Reset the default outline behavior of fieldsets so they don't affect page layout.\n\nfieldset {\n  min-width: 0; // 1\n  padding: 0; // 2\n  margin: 0; // 2\n  border: 0; // 2\n}\n\n// 1. By using `float: left`, the legend will behave like a block element.\n//    This way the border of a fieldset wraps around the legend if present.\n// 2. Fix wrapping bug.\n//    See https://github.com/twbs/bootstrap/issues/29712\n\nlegend {\n  float: left; // 1\n  width: 100%;\n  padding: 0;\n  margin-bottom: $legend-margin-bottom;\n  @include font-size($legend-font-size);\n  font-weight: $legend-font-weight;\n  line-height: inherit;\n\n  + * {\n    clear: left; // 2\n  }\n}\n\n// Fix height of inputs with a type of datetime-local, date, month, week, or time\n// See https://github.com/twbs/bootstrap/issues/18842\n\n::-webkit-datetime-edit-fields-wrapper,\n::-webkit-datetime-edit-text,\n::-webkit-datetime-edit-minute,\n::-webkit-datetime-edit-hour-field,\n::-webkit-datetime-edit-day-field,\n::-webkit-datetime-edit-month-field,\n::-webkit-datetime-edit-year-field {\n  padding: 0;\n}\n\n::-webkit-inner-spin-button {\n  height: auto;\n}\n\n// 1. Correct the outline style in Safari.\n// 2. This overrides the extra rounded corners on search inputs in iOS so that our\n//    `.form-control` class can properly style them. Note that this cannot simply\n//    be added to `.form-control` as it's not specific enough. For details, see\n//    https://github.com/twbs/bootstrap/issues/11586.\n\n[type=\"search\"] {\n  outline-offset: -2px; // 1\n  -webkit-appearance: textfield; // 2\n}\n\n// 1. A few input types should stay LTR\n// See https://rtlstyling.com/posts/rtl-styling#form-inputs\n// 2. RTL only output\n// See https://rtlcss.com/learn/usage-guide/control-directives/#raw\n\n/* rtl:raw:\n[type=\"tel\"],\n[type=\"url\"],\n[type=\"email\"],\n[type=\"number\"] {\n  direction: ltr;\n}\n*/\n\n// Remove the inner padding in Chrome and Safari on macOS.\n\n::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n// Remove padding around color pickers in webkit browsers\n\n::-webkit-color-swatch-wrapper {\n  padding: 0;\n}\n\n\n// Inherit font family and line height for file input buttons\n\n::file-selector-button {\n  font: inherit;\n}\n\n// 1. Change font properties to `inherit`\n// 2. Correct the inability to style clickable types in iOS and Safari.\n\n::-webkit-file-upload-button {\n  font: inherit; // 1\n  -webkit-appearance: button; // 2\n}\n\n// Correct element displays\n\noutput {\n  display: inline-block;\n}\n\n// Remove border from iframe\n\niframe {\n  border: 0;\n}\n\n// Summary\n//\n// 1. Add the correct display in all browsers\n\nsummary {\n  display: list-item; // 1\n  cursor: pointer;\n}\n\n\n// Progress\n//\n// Add the correct vertical alignment in Chrome, Firefox, and Opera.\n\nprogress {\n  vertical-align: baseline;\n}\n\n\n// Hidden attribute\n//\n// Always hide an element with the `hidden` HTML attribute.\n\n[hidden] {\n  display: none !important;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_root.scss",
    "content": ":root {\n  // Note: Custom variable values only support SassScript inside `#{}`.\n\n  // Colors\n  //\n  // Generate palettes for full colors, grays, and theme colors.\n\n  @each $color, $value in $colors {\n    --#{$variable-prefix}#{$color}: #{$value};\n  }\n\n  @each $color, $value in $grays {\n    --#{$variable-prefix}gray-#{$color}: #{$value};\n  }\n\n  @each $color, $value in $theme-colors {\n    --#{$variable-prefix}#{$color}: #{$value};\n  }\n\n  @each $color, $value in $theme-colors-rgb {\n    --#{$variable-prefix}#{$color}-rgb: #{$value};\n  }\n\n  --#{$variable-prefix}white-rgb: #{to-rgb($white)};\n  --#{$variable-prefix}black-rgb: #{to-rgb($black)};\n  --#{$variable-prefix}body-color-rgb: #{to-rgb($body-color)};\n  --#{$variable-prefix}body-bg-rgb: #{to-rgb($body-bg)};\n\n  // Fonts\n\n  // Note: Use `inspect` for lists so that quoted items keep the quotes.\n  // See https://github.com/sass/sass/issues/2383#issuecomment-336349172\n  --#{$variable-prefix}font-sans-serif: #{inspect($font-family-sans-serif)};\n  --#{$variable-prefix}font-monospace: #{inspect($font-family-monospace)};\n  --#{$variable-prefix}gradient: #{$gradient};\n\n  // Root and body\n  // stylelint-disable custom-property-empty-line-before\n  // scss-docs-start root-body-variables\n  @if $font-size-root != null {\n    --#{$variable-prefix}root-font-size: #{$font-size-root};\n  }\n  --#{$variable-prefix}body-font-family: #{$font-family-base};\n  --#{$variable-prefix}body-font-size: #{$font-size-base};\n  --#{$variable-prefix}body-font-weight: #{$font-weight-base};\n  --#{$variable-prefix}body-line-height: #{$line-height-base};\n  --#{$variable-prefix}body-color: #{$body-color};\n  @if $body-text-align != null {\n    --#{$variable-prefix}body-text-align: #{$body-text-align};\n  }\n  --#{$variable-prefix}body-bg: #{$body-bg};\n  // scss-docs-end root-body-variables\n  // stylelint-enable custom-property-empty-line-before\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_spinners.scss",
    "content": "//\n// Rotating border\n//\n\n// scss-docs-start spinner-border-keyframes\n@keyframes spinner-border {\n  to { transform: rotate(360deg) #{\"/* rtl:ignore */\"}; }\n}\n// scss-docs-end spinner-border-keyframes\n\n.spinner-border {\n  display: inline-block;\n  width: $spinner-width;\n  height: $spinner-height;\n  vertical-align: $spinner-vertical-align;\n  border: $spinner-border-width solid currentColor;\n  border-right-color: transparent;\n  // stylelint-disable-next-line property-disallowed-list\n  border-radius: 50%;\n  animation: $spinner-animation-speed linear infinite spinner-border;\n}\n\n.spinner-border-sm {\n  width: $spinner-width-sm;\n  height: $spinner-height-sm;\n  border-width: $spinner-border-width-sm;\n}\n\n//\n// Growing circle\n//\n\n// scss-docs-start spinner-grow-keyframes\n@keyframes spinner-grow {\n  0% {\n    transform: scale(0);\n  }\n  50% {\n    opacity: 1;\n    transform: none;\n  }\n}\n// scss-docs-end spinner-grow-keyframes\n\n.spinner-grow {\n  display: inline-block;\n  width: $spinner-width;\n  height: $spinner-height;\n  vertical-align: $spinner-vertical-align;\n  background-color: currentColor;\n  // stylelint-disable-next-line property-disallowed-list\n  border-radius: 50%;\n  opacity: 0;\n  animation: $spinner-animation-speed linear infinite spinner-grow;\n}\n\n.spinner-grow-sm {\n  width: $spinner-width-sm;\n  height: $spinner-height-sm;\n}\n\n@if $enable-reduced-motion {\n  @media (prefers-reduced-motion: reduce) {\n    .spinner-border,\n    .spinner-grow {\n      animation-duration: $spinner-animation-speed * 2;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_tables.scss",
    "content": "//\n// Basic Bootstrap table\n//\n\n.table {\n  --#{$variable-prefix}table-bg: #{$table-bg};\n  --#{$variable-prefix}table-accent-bg: #{$table-accent-bg};\n  --#{$variable-prefix}table-striped-color: #{$table-striped-color};\n  --#{$variable-prefix}table-striped-bg: #{$table-striped-bg};\n  --#{$variable-prefix}table-active-color: #{$table-active-color};\n  --#{$variable-prefix}table-active-bg: #{$table-active-bg};\n  --#{$variable-prefix}table-hover-color: #{$table-hover-color};\n  --#{$variable-prefix}table-hover-bg: #{$table-hover-bg};\n\n  width: 100%;\n  margin-bottom: $spacer;\n  color: $table-color;\n  vertical-align: $table-cell-vertical-align;\n  border-color: $table-border-color;\n\n  // Target th & td\n  // We need the child combinator to prevent styles leaking to nested tables which doesn't have a `.table` class.\n  // We use the universal selectors here to simplify the selector (else we would need 6 different selectors).\n  // Another advantage is that this generates less code and makes the selector less specific making it easier to override.\n  // stylelint-disable-next-line selector-max-universal\n  > :not(caption) > * > * {\n    padding: $table-cell-padding-y $table-cell-padding-x;\n    background-color: var(--#{$variable-prefix}table-bg);\n    border-bottom-width: $table-border-width;\n    box-shadow: inset 0 0 0 9999px var(--#{$variable-prefix}table-accent-bg);\n  }\n\n  > tbody {\n    vertical-align: inherit;\n  }\n\n  > thead {\n    vertical-align: bottom;\n  }\n\n  // Highlight border color between thead, tbody and tfoot.\n  > :not(:first-child) {\n    border-top: (2 * $table-border-width) solid $table-group-separator-color;\n  }\n}\n\n\n//\n// Change placement of captions with a class\n//\n\n.caption-top {\n  caption-side: top;\n}\n\n\n//\n// Condensed table w/ half padding\n//\n\n.table-sm {\n  // stylelint-disable-next-line selector-max-universal\n  > :not(caption) > * > * {\n    padding: $table-cell-padding-y-sm $table-cell-padding-x-sm;\n  }\n}\n\n\n// Border versions\n//\n// Add or remove borders all around the table and between all the columns.\n//\n// When borders are added on all sides of the cells, the corners can render odd when\n// these borders do not have the same color or if they are semi-transparent.\n// Therefor we add top and border bottoms to the `tr`s and left and right borders\n// to the `td`s or `th`s\n\n.table-bordered {\n  > :not(caption) > * {\n    border-width: $table-border-width 0;\n\n    // stylelint-disable-next-line selector-max-universal\n    > * {\n      border-width: 0 $table-border-width;\n    }\n  }\n}\n\n.table-borderless {\n  // stylelint-disable-next-line selector-max-universal\n  > :not(caption) > * > * {\n    border-bottom-width: 0;\n  }\n\n  > :not(:first-child) {\n    border-top-width: 0;\n  }\n}\n\n// Zebra-striping\n//\n// Default zebra-stripe styles (alternating gray and transparent backgrounds)\n\n.table-striped {\n  > tbody > tr:nth-of-type(#{$table-striped-order}) > * {\n    --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-striped-bg);\n    color: var(--#{$variable-prefix}table-striped-color);\n  }\n}\n\n// Active table\n//\n// The `.table-active` class can be added to highlight rows or cells\n\n.table-active {\n  --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-active-bg);\n  color: var(--#{$variable-prefix}table-active-color);\n}\n\n// Hover effect\n//\n// Placed here since it has to come after the potential zebra striping\n\n.table-hover {\n  > tbody > tr:hover > * {\n    --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-hover-bg);\n    color: var(--#{$variable-prefix}table-hover-color);\n  }\n}\n\n\n// Table variants\n//\n// Table variants set the table cell backgrounds, border colors\n// and the colors of the striped, hovered & active tables\n\n@each $color, $value in $table-variants {\n  @include table-variant($color, $value);\n}\n\n// Responsive tables\n//\n// Generate series of `.table-responsive-*` classes for configuring the screen\n// size of where your table will overflow.\n\n@each $breakpoint in map-keys($grid-breakpoints) {\n  $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n  @include media-breakpoint-down($breakpoint) {\n    .table-responsive#{$infix} {\n      overflow-x: auto;\n      -webkit-overflow-scrolling: touch;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_toasts.scss",
    "content": ".toast {\n  width: $toast-max-width;\n  max-width: 100%;\n  @include font-size($toast-font-size);\n  color: $toast-color;\n  pointer-events: auto;\n  background-color: $toast-background-color;\n  background-clip: padding-box;\n  border: $toast-border-width solid $toast-border-color;\n  box-shadow: $toast-box-shadow;\n  @include border-radius($toast-border-radius);\n\n  &.showing {\n    opacity: 0;\n  }\n\n  &:not(.show) {\n    display: none;\n  }\n}\n\n.toast-container {\n  width: max-content;\n  max-width: 100%;\n  pointer-events: none;\n\n  > :not(:last-child) {\n    margin-bottom: $toast-spacing;\n  }\n}\n\n.toast-header {\n  display: flex;\n  align-items: center;\n  padding: $toast-padding-y $toast-padding-x;\n  color: $toast-header-color;\n  background-color: $toast-header-background-color;\n  background-clip: padding-box;\n  border-bottom: $toast-border-width solid $toast-header-border-color;\n  @include border-top-radius(subtract($toast-border-radius, $toast-border-width));\n\n  .btn-close {\n    margin-right: $toast-padding-x * -.5;\n    margin-left: $toast-padding-x;\n  }\n}\n\n.toast-body {\n  padding: $toast-padding-x; // apply to both vertical and horizontal\n  word-wrap: break-word;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_tooltip.scss",
    "content": "// Base class\n.tooltip {\n  position: absolute;\n  z-index: $zindex-tooltip;\n  display: block;\n  margin: $tooltip-margin;\n  // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.\n  // So reset our font and text properties to avoid inheriting weird values.\n  @include reset-text();\n  @include font-size($tooltip-font-size);\n  // Allow breaking very long words so they don't overflow the tooltip's bounds\n  word-wrap: break-word;\n  opacity: 0;\n\n  &.show { opacity: $tooltip-opacity; }\n\n  .tooltip-arrow {\n    position: absolute;\n    display: block;\n    width: $tooltip-arrow-width;\n    height: $tooltip-arrow-height;\n\n    &::before {\n      position: absolute;\n      content: \"\";\n      border-color: transparent;\n      border-style: solid;\n    }\n  }\n}\n\n.bs-tooltip-top {\n  padding: $tooltip-arrow-height 0;\n\n  .tooltip-arrow {\n    bottom: 0;\n\n    &::before {\n      top: -1px;\n      border-width: $tooltip-arrow-height ($tooltip-arrow-width * .5) 0;\n      border-top-color: $tooltip-arrow-color;\n    }\n  }\n}\n\n.bs-tooltip-end {\n  padding: 0 $tooltip-arrow-height;\n\n  .tooltip-arrow {\n    left: 0;\n    width: $tooltip-arrow-height;\n    height: $tooltip-arrow-width;\n\n    &::before {\n      right: -1px;\n      border-width: ($tooltip-arrow-width * .5) $tooltip-arrow-height ($tooltip-arrow-width * .5) 0;\n      border-right-color: $tooltip-arrow-color;\n    }\n  }\n}\n\n.bs-tooltip-bottom {\n  padding: $tooltip-arrow-height 0;\n\n  .tooltip-arrow {\n    top: 0;\n\n    &::before {\n      bottom: -1px;\n      border-width: 0 ($tooltip-arrow-width * .5) $tooltip-arrow-height;\n      border-bottom-color: $tooltip-arrow-color;\n    }\n  }\n}\n\n.bs-tooltip-start {\n  padding: 0 $tooltip-arrow-height;\n\n  .tooltip-arrow {\n    right: 0;\n    width: $tooltip-arrow-height;\n    height: $tooltip-arrow-width;\n\n    &::before {\n      left: -1px;\n      border-width: ($tooltip-arrow-width * .5) 0 ($tooltip-arrow-width * .5) $tooltip-arrow-height;\n      border-left-color: $tooltip-arrow-color;\n    }\n  }\n}\n\n.bs-tooltip-auto {\n  &[data-popper-placement^=\"top\"] {\n    @extend .bs-tooltip-top;\n  }\n  &[data-popper-placement^=\"right\"] {\n    @extend .bs-tooltip-end;\n  }\n  &[data-popper-placement^=\"bottom\"] {\n    @extend .bs-tooltip-bottom;\n  }\n  &[data-popper-placement^=\"left\"] {\n    @extend .bs-tooltip-start;\n  }\n}\n\n// Wrapper for the tooltip content\n.tooltip-inner {\n  max-width: $tooltip-max-width;\n  padding: $tooltip-padding-y $tooltip-padding-x;\n  color: $tooltip-color;\n  text-align: center;\n  background-color: $tooltip-bg;\n  @include border-radius($tooltip-border-radius);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_transitions.scss",
    "content": ".fade {\n  @include transition($transition-fade);\n\n  &:not(.show) {\n    opacity: 0;\n  }\n}\n\n// scss-docs-start collapse-classes\n.collapse {\n  &:not(.show) {\n    display: none;\n  }\n}\n\n.collapsing {\n  height: 0;\n  overflow: hidden;\n  @include transition($transition-collapse);\n\n  &.collapse-horizontal {\n    width: 0;\n    height: auto;\n    @include transition($transition-collapse-width);\n  }\n}\n// scss-docs-end collapse-classes\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_type.scss",
    "content": "//\n// Headings\n//\n.h1 {\n  @extend h1;\n}\n\n.h2 {\n  @extend h2;\n}\n\n.h3 {\n  @extend h3;\n}\n\n.h4 {\n  @extend h4;\n}\n\n.h5 {\n  @extend h5;\n}\n\n.h6 {\n  @extend h6;\n}\n\n\n.lead {\n  @include font-size($lead-font-size);\n  font-weight: $lead-font-weight;\n}\n\n// Type display classes\n@each $display, $font-size in $display-font-sizes {\n  .display-#{$display} {\n    @include font-size($font-size);\n    font-weight: $display-font-weight;\n    line-height: $display-line-height;\n  }\n}\n\n//\n// Emphasis\n//\n.small {\n  @extend small;\n}\n\n.mark {\n  @extend mark;\n}\n\n//\n// Lists\n//\n\n.list-unstyled {\n  @include list-unstyled();\n}\n\n// Inline turns list items into inline-block\n.list-inline {\n  @include list-unstyled();\n}\n.list-inline-item {\n  display: inline-block;\n\n  &:not(:last-child) {\n    margin-right: $list-inline-padding;\n  }\n}\n\n\n//\n// Misc\n//\n\n// Builds on `abbr`\n.initialism {\n  @include font-size($initialism-font-size);\n  text-transform: uppercase;\n}\n\n// Blockquotes\n.blockquote {\n  margin-bottom: $blockquote-margin-y;\n  @include font-size($blockquote-font-size);\n\n  > :last-child {\n    margin-bottom: 0;\n  }\n}\n\n.blockquote-footer {\n  margin-top: -$blockquote-margin-y;\n  margin-bottom: $blockquote-margin-y;\n  @include font-size($blockquote-footer-font-size);\n  color: $blockquote-footer-color;\n\n  &::before {\n    content: \"\\2014\\00A0\"; // em dash, nbsp\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_utilities.scss",
    "content": "// stylelint-disable indentation\n\n// Utilities\n\n$utilities: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$utilities: map-merge(\n  (\n    // scss-docs-start utils-vertical-align\n    \"align\": (\n      property: vertical-align,\n      class: align,\n      values: baseline top middle bottom text-bottom text-top\n    ),\n    // scss-docs-end utils-vertical-align\n    // scss-docs-start utils-float\n    \"float\": (\n      responsive: true,\n      property: float,\n      values: (\n        start: left,\n        end: right,\n        none: none,\n      )\n    ),\n    // scss-docs-end utils-float\n    // Opacity utilities\n    // scss-docs-start utils-opacity\n    \"opacity\": (\n      property: opacity,\n      values: (\n        0: 0,\n        25: .25,\n        50: .5,\n        75: .75,\n        100: 1,\n      )\n    ),\n    // scss-docs-end utils-opacity\n    // scss-docs-start utils-overflow\n    \"overflow\": (\n      property: overflow,\n      values: auto hidden visible scroll,\n    ),\n    // scss-docs-end utils-overflow\n    // scss-docs-start utils-display\n    \"display\": (\n      responsive: true,\n      print: true,\n      property: display,\n      class: d,\n      values: inline inline-block block grid table table-row table-cell flex inline-flex none\n    ),\n    // scss-docs-end utils-display\n    // scss-docs-start utils-shadow\n    \"shadow\": (\n      property: box-shadow,\n      class: shadow,\n      values: (\n        null: $box-shadow,\n        sm: $box-shadow-sm,\n        lg: $box-shadow-lg,\n        none: none,\n      )\n    ),\n    // scss-docs-end utils-shadow\n    // scss-docs-start utils-position\n    \"position\": (\n      property: position,\n      values: static relative absolute fixed sticky\n    ),\n    \"top\": (\n      property: top,\n      values: $position-values\n    ),\n    \"bottom\": (\n      property: bottom,\n      values: $position-values\n    ),\n    \"start\": (\n      property: left,\n      class: start,\n      values: $position-values\n    ),\n    \"end\": (\n      property: right,\n      class: end,\n      values: $position-values\n    ),\n    \"translate-middle\": (\n      property: transform,\n      class: translate-middle,\n      values: (\n        null: translate(-50%, -50%),\n        x: translateX(-50%),\n        y: translateY(-50%),\n      )\n    ),\n    // scss-docs-end utils-position\n    // scss-docs-start utils-borders\n    \"border\": (\n      property: border,\n      values: (\n        null: $border-width solid $border-color,\n        0: 0,\n      )\n    ),\n    \"border-top\": (\n      property: border-top,\n      values: (\n        null: $border-width solid $border-color,\n        0: 0,\n      )\n    ),\n    \"border-end\": (\n      property: border-right,\n      class: border-end,\n      values: (\n        null: $border-width solid $border-color,\n        0: 0,\n      )\n    ),\n    \"border-bottom\": (\n      property: border-bottom,\n      values: (\n        null: $border-width solid $border-color,\n        0: 0,\n      )\n    ),\n    \"border-start\": (\n      property: border-left,\n      class: border-start,\n      values: (\n        null: $border-width solid $border-color,\n        0: 0,\n      )\n    ),\n    \"border-color\": (\n      property: border-color,\n      class: border,\n      values: map-merge($theme-colors, (\"white\": $white))\n    ),\n    \"border-width\": (\n      property: border-width,\n      class: border,\n      values: $border-widths\n    ),\n    // scss-docs-end utils-borders\n    // Sizing utilities\n    // scss-docs-start utils-sizing\n    \"width\": (\n      property: width,\n      class: w,\n      values: (\n        25: 25%,\n        50: 50%,\n        75: 75%,\n        100: 100%,\n        auto: auto\n      )\n    ),\n    \"max-width\": (\n      property: max-width,\n      class: mw,\n      values: (100: 100%)\n    ),\n    \"viewport-width\": (\n      property: width,\n      class: vw,\n      values: (100: 100vw)\n    ),\n    \"min-viewport-width\": (\n      property: min-width,\n      class: min-vw,\n      values: (100: 100vw)\n    ),\n    \"height\": (\n      property: height,\n      class: h,\n      values: (\n        25: 25%,\n        50: 50%,\n        75: 75%,\n        100: 100%,\n        auto: auto\n      )\n    ),\n    \"max-height\": (\n      property: max-height,\n      class: mh,\n      values: (100: 100%)\n    ),\n    \"viewport-height\": (\n      property: height,\n      class: vh,\n      values: (100: 100vh)\n    ),\n    \"min-viewport-height\": (\n      property: min-height,\n      class: min-vh,\n      values: (100: 100vh)\n    ),\n    // scss-docs-end utils-sizing\n    // Flex utilities\n    // scss-docs-start utils-flex\n    \"flex\": (\n      responsive: true,\n      property: flex,\n      values: (fill: 1 1 auto)\n    ),\n    \"flex-direction\": (\n      responsive: true,\n      property: flex-direction,\n      class: flex,\n      values: row column row-reverse column-reverse\n    ),\n    \"flex-grow\": (\n      responsive: true,\n      property: flex-grow,\n      class: flex,\n      values: (\n        grow-0: 0,\n        grow-1: 1,\n      )\n    ),\n    \"flex-shrink\": (\n      responsive: true,\n      property: flex-shrink,\n      class: flex,\n      values: (\n        shrink-0: 0,\n        shrink-1: 1,\n      )\n    ),\n    \"flex-wrap\": (\n      responsive: true,\n      property: flex-wrap,\n      class: flex,\n      values: wrap nowrap wrap-reverse\n    ),\n    \"gap\": (\n      responsive: true,\n      property: gap,\n      class: gap,\n      values: $spacers\n    ),\n    \"justify-content\": (\n      responsive: true,\n      property: justify-content,\n      values: (\n        start: flex-start,\n        end: flex-end,\n        center: center,\n        between: space-between,\n        around: space-around,\n        evenly: space-evenly,\n      )\n    ),\n    \"align-items\": (\n      responsive: true,\n      property: align-items,\n      values: (\n        start: flex-start,\n        end: flex-end,\n        center: center,\n        baseline: baseline,\n        stretch: stretch,\n      )\n    ),\n    \"align-content\": (\n      responsive: true,\n      property: align-content,\n      values: (\n        start: flex-start,\n        end: flex-end,\n        center: center,\n        between: space-between,\n        around: space-around,\n        stretch: stretch,\n      )\n    ),\n    \"align-self\": (\n      responsive: true,\n      property: align-self,\n      values: (\n        auto: auto,\n        start: flex-start,\n        end: flex-end,\n        center: center,\n        baseline: baseline,\n        stretch: stretch,\n      )\n    ),\n    \"order\": (\n      responsive: true,\n      property: order,\n      values: (\n        first: -1,\n        0: 0,\n        1: 1,\n        2: 2,\n        3: 3,\n        4: 4,\n        5: 5,\n        last: 6,\n      ),\n    ),\n    // scss-docs-end utils-flex\n    // Margin utilities\n    // scss-docs-start utils-spacing\n    \"margin\": (\n      responsive: true,\n      property: margin,\n      class: m,\n      values: map-merge($spacers, (auto: auto))\n    ),\n    \"margin-x\": (\n      responsive: true,\n      property: margin-right margin-left,\n      class: mx,\n      values: map-merge($spacers, (auto: auto))\n    ),\n    \"margin-y\": (\n      responsive: true,\n      property: margin-top margin-bottom,\n      class: my,\n      values: map-merge($spacers, (auto: auto))\n    ),\n    \"margin-top\": (\n      responsive: true,\n      property: margin-top,\n      class: mt,\n      values: map-merge($spacers, (auto: auto))\n    ),\n    \"margin-end\": (\n      responsive: true,\n      property: margin-right,\n      class: me,\n      values: map-merge($spacers, (auto: auto))\n    ),\n    \"margin-bottom\": (\n      responsive: true,\n      property: margin-bottom,\n      class: mb,\n      values: map-merge($spacers, (auto: auto))\n    ),\n    \"margin-start\": (\n      responsive: true,\n      property: margin-left,\n      class: ms,\n      values: map-merge($spacers, (auto: auto))\n    ),\n    // Negative margin utilities\n    \"negative-margin\": (\n      responsive: true,\n      property: margin,\n      class: m,\n      values: $negative-spacers\n    ),\n    \"negative-margin-x\": (\n      responsive: true,\n      property: margin-right margin-left,\n      class: mx,\n      values: $negative-spacers\n    ),\n    \"negative-margin-y\": (\n      responsive: true,\n      property: margin-top margin-bottom,\n      class: my,\n      values: $negative-spacers\n    ),\n    \"negative-margin-top\": (\n      responsive: true,\n      property: margin-top,\n      class: mt,\n      values: $negative-spacers\n    ),\n    \"negative-margin-end\": (\n      responsive: true,\n      property: margin-right,\n      class: me,\n      values: $negative-spacers\n    ),\n    \"negative-margin-bottom\": (\n      responsive: true,\n      property: margin-bottom,\n      class: mb,\n      values: $negative-spacers\n    ),\n    \"negative-margin-start\": (\n      responsive: true,\n      property: margin-left,\n      class: ms,\n      values: $negative-spacers\n    ),\n    // Padding utilities\n    \"padding\": (\n      responsive: true,\n      property: padding,\n      class: p,\n      values: $spacers\n    ),\n    \"padding-x\": (\n      responsive: true,\n      property: padding-right padding-left,\n      class: px,\n      values: $spacers\n    ),\n    \"padding-y\": (\n      responsive: true,\n      property: padding-top padding-bottom,\n      class: py,\n      values: $spacers\n    ),\n    \"padding-top\": (\n      responsive: true,\n      property: padding-top,\n      class: pt,\n      values: $spacers\n    ),\n    \"padding-end\": (\n      responsive: true,\n      property: padding-right,\n      class: pe,\n      values: $spacers\n    ),\n    \"padding-bottom\": (\n      responsive: true,\n      property: padding-bottom,\n      class: pb,\n      values: $spacers\n    ),\n    \"padding-start\": (\n      responsive: true,\n      property: padding-left,\n      class: ps,\n      values: $spacers\n    ),\n    // scss-docs-end utils-spacing\n    // Text\n    // scss-docs-start utils-text\n    \"font-family\": (\n      property: font-family,\n      class: font,\n      values: (monospace: var(--#{$variable-prefix}font-monospace))\n    ),\n    \"font-size\": (\n      rfs: true,\n      property: font-size,\n      class: fs,\n      values: $font-sizes\n    ),\n    \"font-style\": (\n      property: font-style,\n      class: fst,\n      values: italic normal\n    ),\n    \"font-weight\": (\n      property: font-weight,\n      class: fw,\n      values: (\n        light: $font-weight-light,\n        lighter: $font-weight-lighter,\n        normal: $font-weight-normal,\n        bold: $font-weight-bold,\n        bolder: $font-weight-bolder\n      )\n    ),\n    \"line-height\": (\n      property: line-height,\n      class: lh,\n      values: (\n        1: 1,\n        sm: $line-height-sm,\n        base: $line-height-base,\n        lg: $line-height-lg,\n      )\n    ),\n    \"text-align\": (\n      responsive: true,\n      property: text-align,\n      class: text,\n      values: (\n        start: left,\n        end: right,\n        center: center,\n      )\n    ),\n    \"text-decoration\": (\n      property: text-decoration,\n      values: none underline line-through\n    ),\n    \"text-transform\": (\n      property: text-transform,\n      class: text,\n      values: lowercase uppercase capitalize\n    ),\n    \"white-space\": (\n      property: white-space,\n      class: text,\n      values: (\n        wrap: normal,\n        nowrap: nowrap,\n      )\n    ),\n    \"word-wrap\": (\n      property: word-wrap word-break,\n      class: text,\n      values: (break: break-word),\n      rtl: false\n    ),\n    // scss-docs-end utils-text\n    // scss-docs-start utils-color\n    \"color\": (\n      property: color,\n      class: text,\n      local-vars: (\n        \"text-opacity\": 1\n      ),\n      values: map-merge(\n        $utilities-text-colors,\n        (\n          \"muted\": $text-muted,\n          \"black-50\": rgba($black, .5), // deprecated\n          \"white-50\": rgba($white, .5), // deprecated\n          \"reset\": inherit,\n        )\n      )\n    ),\n    \"text-opacity\": (\n      css-var: true,\n      class: text-opacity,\n      values: (\n        25: .25,\n        50: .5,\n        75: .75,\n        100: 1\n      )\n    ),\n    // scss-docs-end utils-color\n    // scss-docs-start utils-bg-color\n    \"background-color\": (\n      property: background-color,\n      class: bg,\n      local-vars: (\n        \"bg-opacity\": 1\n      ),\n      values: map-merge(\n        $utilities-bg-colors,\n        (\n          \"transparent\": transparent\n        )\n      )\n    ),\n    \"bg-opacity\": (\n      css-var: true,\n      class: bg-opacity,\n      values: (\n        10: .1,\n        25: .25,\n        50: .5,\n        75: .75,\n        100: 1\n      )\n    ),\n    // scss-docs-end utils-bg-color\n    \"gradient\": (\n      property: background-image,\n      class: bg,\n      values: (gradient: var(--#{$variable-prefix}gradient))\n    ),\n    // scss-docs-start utils-interaction\n    \"user-select\": (\n      property: user-select,\n      values: all auto none\n    ),\n    \"pointer-events\": (\n      property: pointer-events,\n      class: pe,\n      values: none auto,\n    ),\n    // scss-docs-end utils-interaction\n    // scss-docs-start utils-border-radius\n    \"rounded\": (\n      property: border-radius,\n      class: rounded,\n      values: (\n        null: $border-radius,\n        0: 0,\n        1: $border-radius-sm,\n        2: $border-radius,\n        3: $border-radius-lg,\n        circle: 50%,\n        pill: $border-radius-pill\n      )\n    ),\n    \"rounded-top\": (\n      property: border-top-left-radius border-top-right-radius,\n      class: rounded-top,\n      values: (null: $border-radius)\n    ),\n    \"rounded-end\": (\n      property: border-top-right-radius border-bottom-right-radius,\n      class: rounded-end,\n      values: (null: $border-radius)\n    ),\n    \"rounded-bottom\": (\n      property: border-bottom-right-radius border-bottom-left-radius,\n      class: rounded-bottom,\n      values: (null: $border-radius)\n    ),\n    \"rounded-start\": (\n      property: border-bottom-left-radius border-top-left-radius,\n      class: rounded-start,\n      values: (null: $border-radius)\n    ),\n    // scss-docs-end utils-border-radius\n    // scss-docs-start utils-visibility\n    \"visibility\": (\n      property: visibility,\n      class: null,\n      values: (\n        visible: visible,\n        invisible: hidden,\n      )\n    )\n    // scss-docs-end utils-visibility\n  ),\n  $utilities\n);\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/_variables.scss",
    "content": "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// Color system\n\n// scss-docs-start gray-color-variables\n$white:    #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black:    #000 !default;\n// scss-docs-end gray-color-variables\n\n// fusv-disable\n// scss-docs-start gray-colors-map\n$grays: (\n  \"100\": $gray-100,\n  \"200\": $gray-200,\n  \"300\": $gray-300,\n  \"400\": $gray-400,\n  \"500\": $gray-500,\n  \"600\": $gray-600,\n  \"700\": $gray-700,\n  \"800\": $gray-800,\n  \"900\": $gray-900\n) !default;\n// scss-docs-end gray-colors-map\n// fusv-enable\n\n// scss-docs-start color-variables\n$blue:    #0d6efd !default;\n$indigo:  #6610f2 !default;\n$purple:  #6f42c1 !default;\n$pink:    #d63384 !default;\n$red:     #dc3545 !default;\n$orange:  #fd7e14 !default;\n$yellow:  #ffc107 !default;\n$green:   #198754 !default;\n$teal:    #20c997 !default;\n$cyan:    #0dcaf0 !default;\n// scss-docs-end color-variables\n\n// scss-docs-start colors-map\n$colors: (\n  \"blue\":       $blue,\n  \"indigo\":     $indigo,\n  \"purple\":     $purple,\n  \"pink\":       $pink,\n  \"red\":        $red,\n  \"orange\":     $orange,\n  \"yellow\":     $yellow,\n  \"green\":      $green,\n  \"teal\":       $teal,\n  \"cyan\":       $cyan,\n  \"white\":      $white,\n  \"gray\":       $gray-600,\n  \"gray-dark\":  $gray-800\n) !default;\n// scss-docs-end colors-map\n\n// scss-docs-start theme-color-variables\n$primary:       $blue !default;\n$secondary:     $gray-600 !default;\n$success:       $green !default;\n$info:          $cyan !default;\n$warning:       $yellow !default;\n$danger:        $red !default;\n$light:         $gray-100 !default;\n$dark:          $gray-900 !default;\n// scss-docs-end theme-color-variables\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n  \"primary\":    $primary,\n  \"secondary\":  $secondary,\n  \"success\":    $success,\n  \"info\":       $info,\n  \"warning\":    $warning,\n  \"danger\":     $danger,\n  \"light\":      $light,\n  \"dark\":       $dark\n) !default;\n// scss-docs-end theme-colors-map\n\n// scss-docs-start theme-colors-rgb\n$theme-colors-rgb: map-loop($theme-colors, to-rgb, \"$value\") !default;\n// scss-docs-end theme-colors-rgb\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio:   4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark:      $black !default;\n$color-contrast-light:     $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 80%) !default;\n$blue-200: tint-color($blue, 60%) !default;\n$blue-300: tint-color($blue, 40%) !default;\n$blue-400: tint-color($blue, 20%) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 20%) !default;\n$blue-700: shade-color($blue, 40%) !default;\n$blue-800: shade-color($blue, 60%) !default;\n$blue-900: shade-color($blue, 80%) !default;\n\n$indigo-100: tint-color($indigo, 80%) !default;\n$indigo-200: tint-color($indigo, 60%) !default;\n$indigo-300: tint-color($indigo, 40%) !default;\n$indigo-400: tint-color($indigo, 20%) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 20%) !default;\n$indigo-700: shade-color($indigo, 40%) !default;\n$indigo-800: shade-color($indigo, 60%) !default;\n$indigo-900: shade-color($indigo, 80%) !default;\n\n$purple-100: tint-color($purple, 80%) !default;\n$purple-200: tint-color($purple, 60%) !default;\n$purple-300: tint-color($purple, 40%) !default;\n$purple-400: tint-color($purple, 20%) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 20%) !default;\n$purple-700: shade-color($purple, 40%) !default;\n$purple-800: shade-color($purple, 60%) !default;\n$purple-900: shade-color($purple, 80%) !default;\n\n$pink-100: tint-color($pink, 80%) !default;\n$pink-200: tint-color($pink, 60%) !default;\n$pink-300: tint-color($pink, 40%) !default;\n$pink-400: tint-color($pink, 20%) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 20%) !default;\n$pink-700: shade-color($pink, 40%) !default;\n$pink-800: shade-color($pink, 60%) !default;\n$pink-900: shade-color($pink, 80%) !default;\n\n$red-100: tint-color($red, 80%) !default;\n$red-200: tint-color($red, 60%) !default;\n$red-300: tint-color($red, 40%) !default;\n$red-400: tint-color($red, 20%) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 20%) !default;\n$red-700: shade-color($red, 40%) !default;\n$red-800: shade-color($red, 60%) !default;\n$red-900: shade-color($red, 80%) !default;\n\n$orange-100: tint-color($orange, 80%) !default;\n$orange-200: tint-color($orange, 60%) !default;\n$orange-300: tint-color($orange, 40%) !default;\n$orange-400: tint-color($orange, 20%) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 20%) !default;\n$orange-700: shade-color($orange, 40%) !default;\n$orange-800: shade-color($orange, 60%) !default;\n$orange-900: shade-color($orange, 80%) !default;\n\n$yellow-100: tint-color($yellow, 80%) !default;\n$yellow-200: tint-color($yellow, 60%) !default;\n$yellow-300: tint-color($yellow, 40%) !default;\n$yellow-400: tint-color($yellow, 20%) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 20%) !default;\n$yellow-700: shade-color($yellow, 40%) !default;\n$yellow-800: shade-color($yellow, 60%) !default;\n$yellow-900: shade-color($yellow, 80%) !default;\n\n$green-100: tint-color($green, 80%) !default;\n$green-200: tint-color($green, 60%) !default;\n$green-300: tint-color($green, 40%) !default;\n$green-400: tint-color($green, 20%) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 20%) !default;\n$green-700: shade-color($green, 40%) !default;\n$green-800: shade-color($green, 60%) !default;\n$green-900: shade-color($green, 80%) !default;\n\n$teal-100: tint-color($teal, 80%) !default;\n$teal-200: tint-color($teal, 60%) !default;\n$teal-300: tint-color($teal, 40%) !default;\n$teal-400: tint-color($teal, 20%) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 20%) !default;\n$teal-700: shade-color($teal, 40%) !default;\n$teal-800: shade-color($teal, 60%) !default;\n$teal-900: shade-color($teal, 80%) !default;\n\n$cyan-100: tint-color($cyan, 80%) !default;\n$cyan-200: tint-color($cyan, 60%) !default;\n$cyan-300: tint-color($cyan, 40%) !default;\n$cyan-400: tint-color($cyan, 20%) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 20%) !default;\n$cyan-700: shade-color($cyan, 40%) !default;\n$cyan-800: shade-color($cyan, 60%) !default;\n$cyan-900: shade-color($cyan, 80%) !default;\n\n$blues: (\n  \"blue-100\": $blue-100,\n  \"blue-200\": $blue-200,\n  \"blue-300\": $blue-300,\n  \"blue-400\": $blue-400,\n  \"blue-500\": $blue-500,\n  \"blue-600\": $blue-600,\n  \"blue-700\": $blue-700,\n  \"blue-800\": $blue-800,\n  \"blue-900\": $blue-900\n) !default;\n\n$indigos: (\n  \"indigo-100\": $indigo-100,\n  \"indigo-200\": $indigo-200,\n  \"indigo-300\": $indigo-300,\n  \"indigo-400\": $indigo-400,\n  \"indigo-500\": $indigo-500,\n  \"indigo-600\": $indigo-600,\n  \"indigo-700\": $indigo-700,\n  \"indigo-800\": $indigo-800,\n  \"indigo-900\": $indigo-900\n) !default;\n\n$purples: (\n  \"purple-100\": $purple-200,\n  \"purple-200\": $purple-100,\n  \"purple-300\": $purple-300,\n  \"purple-400\": $purple-400,\n  \"purple-500\": $purple-500,\n  \"purple-600\": $purple-600,\n  \"purple-700\": $purple-700,\n  \"purple-800\": $purple-800,\n  \"purple-900\": $purple-900\n) !default;\n\n$pinks: (\n  \"pink-100\": $pink-100,\n  \"pink-200\": $pink-200,\n  \"pink-300\": $pink-300,\n  \"pink-400\": $pink-400,\n  \"pink-500\": $pink-500,\n  \"pink-600\": $pink-600,\n  \"pink-700\": $pink-700,\n  \"pink-800\": $pink-800,\n  \"pink-900\": $pink-900\n) !default;\n\n$reds: (\n  \"red-100\": $red-100,\n  \"red-200\": $red-200,\n  \"red-300\": $red-300,\n  \"red-400\": $red-400,\n  \"red-500\": $red-500,\n  \"red-600\": $red-600,\n  \"red-700\": $red-700,\n  \"red-800\": $red-800,\n  \"red-900\": $red-900\n) !default;\n\n$oranges: (\n  \"orange-100\": $orange-100,\n  \"orange-200\": $orange-200,\n  \"orange-300\": $orange-300,\n  \"orange-400\": $orange-400,\n  \"orange-500\": $orange-500,\n  \"orange-600\": $orange-600,\n  \"orange-700\": $orange-700,\n  \"orange-800\": $orange-800,\n  \"orange-900\": $orange-900\n) !default;\n\n$yellows: (\n  \"yellow-100\": $yellow-100,\n  \"yellow-200\": $yellow-200,\n  \"yellow-300\": $yellow-300,\n  \"yellow-400\": $yellow-400,\n  \"yellow-500\": $yellow-500,\n  \"yellow-600\": $yellow-600,\n  \"yellow-700\": $yellow-700,\n  \"yellow-800\": $yellow-800,\n  \"yellow-900\": $yellow-900\n) !default;\n\n$greens: (\n  \"green-100\": $green-100,\n  \"green-200\": $green-200,\n  \"green-300\": $green-300,\n  \"green-400\": $green-400,\n  \"green-500\": $green-500,\n  \"green-600\": $green-600,\n  \"green-700\": $green-700,\n  \"green-800\": $green-800,\n  \"green-900\": $green-900\n) !default;\n\n$teals: (\n  \"teal-100\": $teal-100,\n  \"teal-200\": $teal-200,\n  \"teal-300\": $teal-300,\n  \"teal-400\": $teal-400,\n  \"teal-500\": $teal-500,\n  \"teal-600\": $teal-600,\n  \"teal-700\": $teal-700,\n  \"teal-800\": $teal-800,\n  \"teal-900\": $teal-900\n) !default;\n\n$cyans: (\n  \"cyan-100\": $cyan-100,\n  \"cyan-200\": $cyan-200,\n  \"cyan-300\": $cyan-300,\n  \"cyan-400\": $cyan-400,\n  \"cyan-500\": $cyan-500,\n  \"cyan-600\": $cyan-600,\n  \"cyan-700\": $cyan-700,\n  \"cyan-800\": $cyan-800,\n  \"cyan-900\": $cyan-900\n) !default;\n// fusv-enable\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n  (\"<\", \"%3c\"),\n  (\">\", \"%3e\"),\n  (\"#\", \"%23\"),\n  (\"(\", \"%28\"),\n  (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret:                true !default;\n$enable-rounded:              true !default;\n$enable-shadows:              false !default;\n$enable-gradients:            false !default;\n$enable-transitions:          true !default;\n$enable-reduced-motion:       true !default;\n$enable-smooth-scroll:        true !default;\n$enable-grid-classes:         true !default;\n$enable-cssgrid:              false !default;\n$enable-button-pointers:      true !default;\n$enable-rfs:                  true !default;\n$enable-validation-icons:     true !default;\n$enable-negative-margins:     false !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities:  true !default;\n\n// Prefix for :root CSS variables\n\n$variable-prefix:             bs- !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n// scss-docs-start variable-gradient\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n// scss-docs-end variable-gradient\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n// scss-docs-start spacer-variables-maps\n$spacer: 1rem !default;\n$spacers: (\n  0: 0,\n  1: $spacer * .25,\n  2: $spacer * .5,\n  3: $spacer,\n  4: $spacer * 1.5,\n  5: $spacer * 3,\n) !default;\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n// scss-docs-end spacer-variables-maps\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n// scss-docs-start position-map\n$position-values: (\n  0: 0,\n  50: 50%,\n  100: 100%\n) !default;\n// scss-docs-end position-map\n\n// Body\n//\n// Settings for the `<body>` element.\n\n$body-bg:                   $white !default;\n$body-color:                $gray-900 !default;\n$body-text-align:           null !default;\n\n// Utilities maps\n//\n// Extends the default `$theme-colors` maps to help create our utilities.\n\n// Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign.\n// scss-docs-start utilities-colors\n$utilities-colors: $theme-colors-rgb !default;\n// scss-docs-end utilities-colors\n\n// scss-docs-start utilities-text-colors\n$utilities-text: map-merge(\n  $utilities-colors,\n  (\n    \"black\": to-rgb($black),\n    \"white\": to-rgb($white),\n    \"body\": to-rgb($body-color)\n  )\n) !default;\n$utilities-text-colors: map-loop($utilities-text, rgba-css-var, \"$key\", \"text\") !default;\n// scss-docs-end utilities-text-colors\n\n// scss-docs-start utilities-bg-colors\n$utilities-bg: map-merge(\n  $utilities-colors,\n  (\n    \"black\": to-rgb($black),\n    \"white\": to-rgb($white),\n    \"body\": to-rgb($body-bg)\n  )\n) !default;\n$utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, \"$key\", \"bg\") !default;\n// scss-docs-end utilities-bg-colors\n\n// Links\n//\n// Style anchor elements.\n\n$link-color:                              $primary !default;\n$link-decoration:                         underline !default;\n$link-shade-percentage:                   20% !default;\n$link-hover-color:                        shift-color($link-color, $link-shade-percentage) !default;\n$link-hover-decoration:                   null !default;\n\n$stretched-link-pseudo-element:           after !default;\n$stretched-link-z-index:                  1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom:   1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n  xs: 0,\n  sm: 576px,\n  md: 768px,\n  lg: 992px,\n  xl: 1200px,\n  xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n  sm: 540px,\n  md: 720px,\n  lg: 960px,\n  xl: 1140px,\n  xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns:                12 !default;\n$grid-gutter-width:           1.5rem !default;\n$grid-row-columns:            6 !default;\n\n$gutters: $spacers !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width * .5 !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n// scss-docs-start border-variables\n$border-width:                1px !default;\n$border-widths: (\n  1: 1px,\n  2: 2px,\n  3: 3px,\n  4: 4px,\n  5: 5px\n) !default;\n\n$border-color:                $gray-300 !default;\n// scss-docs-end border-variables\n\n// scss-docs-start border-radius-variables\n$border-radius:               .25rem !default;\n$border-radius-sm:            .2rem !default;\n$border-radius-lg:            .3rem !default;\n$border-radius-pill:          50rem !default;\n// scss-docs-end border-radius-variables\n\n// scss-docs-start box-shadow-variables\n$box-shadow:                  0 .5rem 1rem rgba($black, .15) !default;\n$box-shadow-sm:               0 .125rem .25rem rgba($black, .075) !default;\n$box-shadow-lg:               0 1rem 3rem rgba($black, .175) !default;\n$box-shadow-inset:            inset 0 1px 2px rgba($black, .075) !default;\n// scss-docs-end box-shadow-variables\n\n$component-active-color:      $white !default;\n$component-active-bg:         $primary !default;\n\n// scss-docs-start caret-variables\n$caret-width:                 .3em !default;\n$caret-vertical-align:        $caret-width * .85 !default;\n$caret-spacing:               $caret-width * .85 !default;\n// scss-docs-end caret-variables\n\n$transition-base:             all .2s ease-in-out !default;\n$transition-fade:             opacity .15s linear !default;\n// scss-docs-start collapse-transition\n$transition-collapse:         height .35s ease !default;\n$transition-collapse-width:   width .35s ease !default;\n// scss-docs-end collapse-transition\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n  \"1x1\": 100%,\n  \"4x3\": calc(3 / 4 * 100%),\n  \"16x9\": calc(9 / 16 * 100%),\n  \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// scss-docs-start font-variables\n// stylelint-disable value-keyword-case\n$font-family-sans-serif:      system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\" !default;\n$font-family-monospace:       SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n// stylelint-enable value-keyword-case\n$font-family-base:            var(--#{$variable-prefix}font-sans-serif) !default;\n$font-family-code:            var(--#{$variable-prefix}font-monospace) !default;\n\n// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins\n// $font-size-base affects the font size of the body text\n$font-size-root:              null !default;\n$font-size-base:              1rem !default; // Assumes the browser default, typically `16px`\n$font-size-sm:                $font-size-base * .875 !default;\n$font-size-lg:                $font-size-base * 1.25 !default;\n\n$font-weight-lighter:         lighter !default;\n$font-weight-light:           300 !default;\n$font-weight-normal:          400 !default;\n$font-weight-bold:            700 !default;\n$font-weight-bolder:          bolder !default;\n\n$font-weight-base:            $font-weight-normal !default;\n\n$line-height-base:            1.5 !default;\n$line-height-sm:              1.25 !default;\n$line-height-lg:              2 !default;\n\n$h1-font-size:                $font-size-base * 2.5 !default;\n$h2-font-size:                $font-size-base * 2 !default;\n$h3-font-size:                $font-size-base * 1.75 !default;\n$h4-font-size:                $font-size-base * 1.5 !default;\n$h5-font-size:                $font-size-base * 1.25 !default;\n$h6-font-size:                $font-size-base !default;\n// scss-docs-end font-variables\n\n// scss-docs-start font-sizes\n$font-sizes: (\n  1: $h1-font-size,\n  2: $h2-font-size,\n  3: $h3-font-size,\n  4: $h4-font-size,\n  5: $h5-font-size,\n  6: $h6-font-size\n) !default;\n// scss-docs-end font-sizes\n\n// scss-docs-start headings-variables\n$headings-margin-bottom:      $spacer * .5 !default;\n$headings-font-family:        null !default;\n$headings-font-style:         null !default;\n$headings-font-weight:        500 !default;\n$headings-line-height:        1.2 !default;\n$headings-color:              null !default;\n// scss-docs-end headings-variables\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n  1: 5rem,\n  2: 4.5rem,\n  3: 4rem,\n  4: 3.5rem,\n  5: 3rem,\n  6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n// scss-docs-start type-variables\n$lead-font-size:              $font-size-base * 1.25 !default;\n$lead-font-weight:            300 !default;\n\n$small-font-size:             .875em !default;\n\n$sub-sup-font-size:           .75em !default;\n\n$text-muted:                  $gray-600 !default;\n\n$initialism-font-size:        $small-font-size !default;\n\n$blockquote-margin-y:         $spacer !default;\n$blockquote-font-size:        $font-size-base * 1.25 !default;\n$blockquote-footer-color:     $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y:                 $spacer !default;\n$hr-color:                    inherit !default;\n$hr-height:                   $border-width !default;\n$hr-opacity:                  .25 !default;\n\n$legend-margin-bottom:        .5rem !default;\n$legend-font-size:            1.5rem !default;\n$legend-font-weight:          null !default;\n\n$mark-padding:                .2em !default;\n\n$dt-font-weight:              $font-weight-bold !default;\n\n$nested-kbd-font-weight:      $font-weight-bold !default;\n\n$list-inline-padding:         .5rem !default;\n\n$mark-bg:                     #fcf8e3 !default;\n// scss-docs-end type-variables\n\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n\n// scss-docs-start table-variables\n$table-cell-padding-y:        .5rem !default;\n$table-cell-padding-x:        .5rem !default;\n$table-cell-padding-y-sm:     .25rem !default;\n$table-cell-padding-x-sm:     .25rem !default;\n\n$table-cell-vertical-align:   top !default;\n\n$table-color:                 $body-color !default;\n$table-bg:                    transparent !default;\n$table-accent-bg:             transparent !default;\n\n$table-th-font-weight:        null !default;\n\n$table-striped-color:         $table-color !default;\n$table-striped-bg-factor:     .05 !default;\n$table-striped-bg:            rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color:          $table-color !default;\n$table-active-bg-factor:      .1 !default;\n$table-active-bg:             rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color:           $table-color !default;\n$table-hover-bg-factor:       .075 !default;\n$table-hover-bg:              rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor:         .1 !default;\n$table-border-width:          $border-width !default;\n$table-border-color:          $border-color !default;\n\n$table-striped-order:         odd !default;\n\n$table-group-separator-color: currentColor !default;\n\n$table-caption-color:         $text-muted !default;\n\n$table-bg-scale:              -80% !default;\n// scss-docs-end table-variables\n\n// scss-docs-start table-loop\n$table-variants: (\n  \"primary\":    shift-color($primary, $table-bg-scale),\n  \"secondary\":  shift-color($secondary, $table-bg-scale),\n  \"success\":    shift-color($success, $table-bg-scale),\n  \"info\":       shift-color($info, $table-bg-scale),\n  \"warning\":    shift-color($warning, $table-bg-scale),\n  \"danger\":     shift-color($danger, $table-bg-scale),\n  \"light\":      $light,\n  \"dark\":       $dark,\n) !default;\n// scss-docs-end table-loop\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n// scss-docs-start input-btn-variables\n$input-btn-padding-y:         .375rem !default;\n$input-btn-padding-x:         .75rem !default;\n$input-btn-font-family:       null !default;\n$input-btn-font-size:         $font-size-base !default;\n$input-btn-line-height:       $line-height-base !default;\n\n$input-btn-focus-width:         .25rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color:         rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-blur:          0 !default;\n$input-btn-focus-box-shadow:    0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm:      .25rem !default;\n$input-btn-padding-x-sm:      .5rem !default;\n$input-btn-font-size-sm:      $font-size-sm !default;\n\n$input-btn-padding-y-lg:      .5rem !default;\n$input-btn-padding-x-lg:      1rem !default;\n$input-btn-font-size-lg:      $font-size-lg !default;\n\n$input-btn-border-width:      $border-width !default;\n// scss-docs-end input-btn-variables\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n// scss-docs-start btn-variables\n$btn-padding-y:               $input-btn-padding-y !default;\n$btn-padding-x:               $input-btn-padding-x !default;\n$btn-font-family:             $input-btn-font-family !default;\n$btn-font-size:               $input-btn-font-size !default;\n$btn-line-height:             $input-btn-line-height !default;\n$btn-white-space:             null !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-padding-y-sm:            $input-btn-padding-y-sm !default;\n$btn-padding-x-sm:            $input-btn-padding-x-sm !default;\n$btn-font-size-sm:            $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg:            $input-btn-padding-y-lg !default;\n$btn-padding-x-lg:            $input-btn-padding-x-lg !default;\n$btn-font-size-lg:            $input-btn-font-size-lg !default;\n\n$btn-border-width:            $input-btn-border-width !default;\n\n$btn-font-weight:             $font-weight-normal !default;\n$btn-box-shadow:              inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;\n$btn-focus-width:             $input-btn-focus-width !default;\n$btn-focus-box-shadow:        $input-btn-focus-box-shadow !default;\n$btn-disabled-opacity:        .65 !default;\n$btn-active-box-shadow:       inset 0 3px 5px rgba($black, .125) !default;\n\n$btn-link-color:              $link-color !default;\n$btn-link-hover-color:        $link-hover-color !default;\n$btn-link-disabled-color:     $gray-600 !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius:           $border-radius !default;\n$btn-border-radius-sm:        $border-radius-sm !default;\n$btn-border-radius-lg:        $border-radius-lg !default;\n\n$btn-transition:              color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$btn-hover-bg-shade-amount:       15% !default;\n$btn-hover-bg-tint-amount:        15% !default;\n$btn-hover-border-shade-amount:   20% !default;\n$btn-hover-border-tint-amount:    10% !default;\n$btn-active-bg-shade-amount:      20% !default;\n$btn-active-bg-tint-amount:       20% !default;\n$btn-active-border-shade-amount:  25% !default;\n$btn-active-border-tint-amount:   10% !default;\n// scss-docs-end btn-variables\n\n\n// Forms\n\n// scss-docs-start form-text-variables\n$form-text-margin-top:                  .25rem !default;\n$form-text-font-size:                   $small-font-size !default;\n$form-text-font-style:                  null !default;\n$form-text-font-weight:                 null !default;\n$form-text-color:                       $text-muted !default;\n// scss-docs-end form-text-variables\n\n// scss-docs-start form-label-variables\n$form-label-margin-bottom:              .5rem !default;\n$form-label-font-size:                  null !default;\n$form-label-font-style:                 null !default;\n$form-label-font-weight:                null !default;\n$form-label-color:                      null !default;\n// scss-docs-end form-label-variables\n\n// scss-docs-start form-input-variables\n$input-padding-y:                       $input-btn-padding-y !default;\n$input-padding-x:                       $input-btn-padding-x !default;\n$input-font-family:                     $input-btn-font-family !default;\n$input-font-size:                       $input-btn-font-size !default;\n$input-font-weight:                     $font-weight-base !default;\n$input-line-height:                     $input-btn-line-height !default;\n\n$input-padding-y-sm:                    $input-btn-padding-y-sm !default;\n$input-padding-x-sm:                    $input-btn-padding-x-sm !default;\n$input-font-size-sm:                    $input-btn-font-size-sm !default;\n\n$input-padding-y-lg:                    $input-btn-padding-y-lg !default;\n$input-padding-x-lg:                    $input-btn-padding-x-lg !default;\n$input-font-size-lg:                    $input-btn-font-size-lg !default;\n\n$input-bg:                              $body-bg !default;\n$input-disabled-bg:                     $gray-200 !default;\n$input-disabled-border-color:           null !default;\n\n$input-color:                           $body-color !default;\n$input-border-color:                    $gray-400 !default;\n$input-border-width:                    $input-btn-border-width !default;\n$input-box-shadow:                      $box-shadow-inset !default;\n\n$input-border-radius:                   $border-radius !default;\n$input-border-radius-sm:                $border-radius-sm !default;\n$input-border-radius-lg:                $border-radius-lg !default;\n\n$input-focus-bg:                        $input-bg !default;\n$input-focus-border-color:              tint-color($component-active-bg, 50%) !default;\n$input-focus-color:                     $input-color !default;\n$input-focus-width:                     $input-btn-focus-width !default;\n$input-focus-box-shadow:                $input-btn-focus-box-shadow !default;\n\n$input-placeholder-color:               $gray-600 !default;\n$input-plaintext-color:                 $body-color !default;\n\n$input-height-border:                   $input-border-width * 2 !default;\n\n$input-height-inner:                    add($input-line-height * 1em, $input-padding-y * 2) !default;\n$input-height-inner-half:               add($input-line-height * .5em, $input-padding-y) !default;\n$input-height-inner-quarter:            add($input-line-height * .25em, $input-padding-y * .5) !default;\n\n$input-height:                          add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;\n$input-height-sm:                       add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;\n$input-height-lg:                       add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;\n\n$input-transition:                      border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-color-width:                      3rem !default;\n// scss-docs-end form-input-variables\n\n// scss-docs-start form-check-variables\n$form-check-input-width:                  1em !default;\n$form-check-min-height:                   $font-size-base * $line-height-base !default;\n$form-check-padding-start:                $form-check-input-width + .5em !default;\n$form-check-margin-bottom:                .125rem !default;\n$form-check-label-color:                  null !default;\n$form-check-label-cursor:                 null !default;\n$form-check-transition:                   null !default;\n\n$form-check-input-active-filter:          brightness(90%) !default;\n\n$form-check-input-bg:                     $input-bg !default;\n$form-check-input-border:                 1px solid rgba($black, .25) !default;\n$form-check-input-border-radius:          .25em !default;\n$form-check-radio-border-radius:          50% !default;\n$form-check-input-focus-border:           $input-focus-border-color !default;\n$form-check-input-focus-box-shadow:       $input-btn-focus-box-shadow !default;\n\n$form-check-input-checked-color:          $component-active-color !default;\n$form-check-input-checked-bg-color:       $component-active-bg !default;\n$form-check-input-checked-border-color:   $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image:       url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-checked-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/></svg>\") !default;\n$form-check-radio-checked-bg-image:       url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='#{$form-check-input-checked-color}'/></svg>\") !default;\n\n$form-check-input-indeterminate-color:          $component-active-color !default;\n$form-check-input-indeterminate-bg-color:       $component-active-bg !default;\n$form-check-input-indeterminate-border-color:   $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image:       url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-indeterminate-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/></svg>\") !default;\n\n$form-check-input-disabled-opacity:        .5 !default;\n$form-check-label-disabled-opacity:        $form-check-input-disabled-opacity !default;\n$form-check-btn-check-disabled-opacity:    $btn-disabled-opacity !default;\n\n$form-check-inline-margin-end:    1rem !default;\n// scss-docs-end form-check-variables\n\n// scss-docs-start form-switch-variables\n$form-switch-color:               rgba($black, .25) !default;\n$form-switch-width:               2em !default;\n$form-switch-padding-start:       $form-switch-width + .5em !default;\n$form-switch-bg-image:            url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color}'/></svg>\") !default;\n$form-switch-border-radius:       $form-switch-width !default;\n$form-switch-transition:          background-position .15s ease-in-out !default;\n\n$form-switch-focus-color:         $input-focus-border-color !default;\n$form-switch-focus-bg-image:      url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-focus-color}'/></svg>\") !default;\n\n$form-switch-checked-color:       $component-active-color !default;\n$form-switch-checked-bg-image:    url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-checked-color}'/></svg>\") !default;\n$form-switch-checked-bg-position: right center !default;\n// scss-docs-end form-switch-variables\n\n// scss-docs-start input-group-variables\n$input-group-addon-padding-y:           $input-padding-y !default;\n$input-group-addon-padding-x:           $input-padding-x !default;\n$input-group-addon-font-weight:         $input-font-weight !default;\n$input-group-addon-color:               $input-color !default;\n$input-group-addon-bg:                  $gray-200 !default;\n$input-group-addon-border-color:        $input-border-color !default;\n// scss-docs-end input-group-variables\n\n// scss-docs-start form-select-variables\n$form-select-padding-y:             $input-padding-y !default;\n$form-select-padding-x:             $input-padding-x !default;\n$form-select-font-family:           $input-font-family !default;\n$form-select-font-size:             $input-font-size !default;\n$form-select-indicator-padding:     $form-select-padding-x * 3 !default; // Extra padding for background-image\n$form-select-font-weight:           $input-font-weight !default;\n$form-select-line-height:           $input-line-height !default;\n$form-select-color:                 $input-color !default;\n$form-select-bg:                    $input-bg !default;\n$form-select-disabled-color:        null !default;\n$form-select-disabled-bg:           $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position:           right $form-select-padding-x center !default;\n$form-select-bg-size:               16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color:       $gray-800 !default;\n$form-select-indicator:             url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$form-select-indicator-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>\") !default;\n\n$form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default;\n$form-select-feedback-icon-position:    center right $form-select-indicator-padding !default;\n$form-select-feedback-icon-size:        $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width:        $input-border-width !default;\n$form-select-border-color:        $input-border-color !default;\n$form-select-border-radius:       $input-border-radius !default;\n$form-select-box-shadow:          $box-shadow-inset !default;\n\n$form-select-focus-border-color:  $input-focus-border-color !default;\n$form-select-focus-width:         $input-focus-width !default;\n$form-select-focus-box-shadow:    0 0 0 $form-select-focus-width $input-btn-focus-color !default;\n\n$form-select-padding-y-sm:        $input-padding-y-sm !default;\n$form-select-padding-x-sm:        $input-padding-x-sm !default;\n$form-select-font-size-sm:        $input-font-size-sm !default;\n$form-select-border-radius-sm:    $input-border-radius-sm !default;\n\n$form-select-padding-y-lg:        $input-padding-y-lg !default;\n$form-select-padding-x-lg:        $input-padding-x-lg !default;\n$form-select-font-size-lg:        $input-font-size-lg !default;\n$form-select-border-radius-lg:    $input-border-radius-lg !default;\n\n$form-select-transition:          $input-transition !default;\n// scss-docs-end form-select-variables\n\n// scss-docs-start form-range-variables\n$form-range-track-width:          100% !default;\n$form-range-track-height:         .5rem !default;\n$form-range-track-cursor:         pointer !default;\n$form-range-track-bg:             $gray-300 !default;\n$form-range-track-border-radius:  1rem !default;\n$form-range-track-box-shadow:     $box-shadow-inset !default;\n\n$form-range-thumb-width:                   1rem !default;\n$form-range-thumb-height:                  $form-range-thumb-width !default;\n$form-range-thumb-bg:                      $component-active-bg !default;\n$form-range-thumb-border:                  0 !default;\n$form-range-thumb-border-radius:           1rem !default;\n$form-range-thumb-box-shadow:              0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow:        0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width:  $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg:               tint-color($component-active-bg, 70%) !default;\n$form-range-thumb-disabled-bg:             $gray-500 !default;\n$form-range-thumb-transition:              background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n// scss-docs-end form-range-variables\n\n// scss-docs-start form-file-variables\n$form-file-button-color:          $input-color !default;\n$form-file-button-bg:             $input-group-addon-bg !default;\n$form-file-button-hover-bg:       shade-color($form-file-button-bg, 5%) !default;\n// scss-docs-end form-file-variables\n\n// scss-docs-start form-floating-variables\n$form-floating-height:            add(3.5rem, $input-height-border) !default;\n$form-floating-line-height:       1.25 !default;\n$form-floating-padding-x:         $input-padding-x !default;\n$form-floating-padding-y:         1rem !default;\n$form-floating-input-padding-t:   1.625rem !default;\n$form-floating-input-padding-b:   .625rem !default;\n$form-floating-label-opacity:     .65 !default;\n$form-floating-label-transform:   scale(.85) translateY(-.5rem) translateX(.15rem) !default;\n$form-floating-transition:        opacity .1s ease-in-out, transform .1s ease-in-out !default;\n// scss-docs-end form-floating-variables\n\n// Form validation\n\n// scss-docs-start form-feedback-variables\n$form-feedback-margin-top:          $form-text-margin-top !default;\n$form-feedback-font-size:           $form-text-font-size !default;\n$form-feedback-font-style:          $form-text-font-style !default;\n$form-feedback-valid-color:         $success !default;\n$form-feedback-invalid-color:       $danger !default;\n\n$form-feedback-icon-valid-color:    $form-feedback-valid-color !default;\n$form-feedback-icon-valid:          url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/></svg>\") !default;\n$form-feedback-icon-invalid-color:  $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid:        url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$form-feedback-icon-invalid-color}' stroke='none'/></svg>\") !default;\n// scss-docs-end form-feedback-variables\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n  \"valid\": (\n    \"color\": $form-feedback-valid-color,\n    \"icon\": $form-feedback-icon-valid\n  ),\n  \"invalid\": (\n    \"color\": $form-feedback-invalid-color,\n    \"icon\": $form-feedback-icon-invalid\n  )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown:                   1000 !default;\n$zindex-sticky:                     1020 !default;\n$zindex-fixed:                      1030 !default;\n$zindex-offcanvas-backdrop:         1040 !default;\n$zindex-offcanvas:                  1045 !default;\n$zindex-modal-backdrop:             1050 !default;\n$zindex-modal:                      1055 !default;\n$zindex-popover:                    1070 !default;\n$zindex-tooltip:                    1080 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n// scss-docs-start nav-variables\n$nav-link-padding-y:                .5rem !default;\n$nav-link-padding-x:                1rem !default;\n$nav-link-font-size:                null !default;\n$nav-link-font-weight:              null !default;\n$nav-link-color:                    $link-color !default;\n$nav-link-hover-color:              $link-hover-color !default;\n$nav-link-transition:               color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color:           $gray-600 !default;\n\n$nav-tabs-border-color:             $gray-300 !default;\n$nav-tabs-border-width:             $border-width !default;\n$nav-tabs-border-radius:            $border-radius !default;\n$nav-tabs-link-hover-border-color:  $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color:        $gray-700 !default;\n$nav-tabs-link-active-bg:           $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius:           $border-radius !default;\n$nav-pills-link-active-color:       $component-active-color !default;\n$nav-pills-link-active-bg:          $component-active-bg !default;\n// scss-docs-end nav-variables\n\n\n// Navbar\n\n// scss-docs-start navbar-variables\n$navbar-padding-y:                  $spacer * .5 !default;\n$navbar-padding-x:                  null !default;\n\n$navbar-nav-link-padding-x:         .5rem !default;\n\n$navbar-brand-font-size:            $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height:               $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y:            ($nav-link-height - $navbar-brand-height) * .5 !default;\n$navbar-brand-margin-end:           1rem !default;\n\n$navbar-toggler-padding-y:          .25rem !default;\n$navbar-toggler-padding-x:          .75rem !default;\n$navbar-toggler-font-size:          $font-size-lg !default;\n$navbar-toggler-border-radius:      $btn-border-radius !default;\n$navbar-toggler-focus-width:        $btn-focus-width !default;\n$navbar-toggler-transition:         box-shadow .15s ease-in-out !default;\n// scss-docs-end navbar-variables\n\n// scss-docs-start navbar-theme-variables\n$navbar-dark-color:                 rgba($white, .55) !default;\n$navbar-dark-hover-color:           rgba($white, .75) !default;\n$navbar-dark-active-color:          $white !default;\n$navbar-dark-disabled-color:        rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg:       url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>\") !default;\n$navbar-dark-toggler-border-color:  rgba($white, .1) !default;\n\n$navbar-light-color:                rgba($black, .55) !default;\n$navbar-light-hover-color:          rgba($black, .7) !default;\n$navbar-light-active-color:         rgba($black, .9) !default;\n$navbar-light-disabled-color:       rgba($black, .3) !default;\n$navbar-light-toggler-icon-bg:      url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>\") !default;\n$navbar-light-toggler-border-color: rgba($black, .1) !default;\n\n$navbar-light-brand-color:                $navbar-light-active-color !default;\n$navbar-light-brand-hover-color:          $navbar-light-active-color !default;\n$navbar-dark-brand-color:                 $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color:           $navbar-dark-active-color !default;\n// scss-docs-end navbar-theme-variables\n\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n// scss-docs-start dropdown-variables\n$dropdown-min-width:                10rem !default;\n$dropdown-padding-x:                0 !default;\n$dropdown-padding-y:                .5rem !default;\n$dropdown-spacer:                   .125rem !default;\n$dropdown-font-size:                $font-size-base !default;\n$dropdown-color:                    $body-color !default;\n$dropdown-bg:                       $white !default;\n$dropdown-border-color:             rgba($black, .15) !default;\n$dropdown-border-radius:            $border-radius !default;\n$dropdown-border-width:             $border-width !default;\n$dropdown-inner-border-radius:      subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-divider-bg:               $dropdown-border-color !default;\n$dropdown-divider-margin-y:         $spacer * .5 !default;\n$dropdown-box-shadow:               $box-shadow !default;\n\n$dropdown-link-color:               $gray-900 !default;\n$dropdown-link-hover-color:         shade-color($dropdown-link-color, 10%) !default;\n$dropdown-link-hover-bg:            $gray-200 !default;\n\n$dropdown-link-active-color:        $component-active-color !default;\n$dropdown-link-active-bg:           $component-active-bg !default;\n\n$dropdown-link-disabled-color:      $gray-500 !default;\n\n$dropdown-item-padding-y:           $spacer * .25 !default;\n$dropdown-item-padding-x:           $spacer !default;\n\n$dropdown-header-color:             $gray-600 !default;\n$dropdown-header-padding:           $dropdown-padding-y $dropdown-item-padding-x !default;\n// scss-docs-end dropdown-variables\n\n// scss-docs-start dropdown-dark-variables\n$dropdown-dark-color:               $gray-300 !default;\n$dropdown-dark-bg:                  $gray-800 !default;\n$dropdown-dark-border-color:        $dropdown-border-color !default;\n$dropdown-dark-divider-bg:          $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow:          null !default;\n$dropdown-dark-link-color:          $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color:    $white !default;\n$dropdown-dark-link-hover-bg:       rgba($white, .15) !default;\n$dropdown-dark-link-active-color:   $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg:      $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color:        $gray-500 !default;\n// scss-docs-end dropdown-dark-variables\n\n\n// Pagination\n\n// scss-docs-start pagination-variables\n$pagination-padding-y:              .375rem !default;\n$pagination-padding-x:              .75rem !default;\n$pagination-padding-y-sm:           .25rem !default;\n$pagination-padding-x-sm:           .5rem !default;\n$pagination-padding-y-lg:           .75rem !default;\n$pagination-padding-x-lg:           1.5rem !default;\n\n$pagination-color:                  $link-color !default;\n$pagination-bg:                     $white !default;\n$pagination-border-width:           $border-width !default;\n$pagination-border-radius:          $border-radius !default;\n$pagination-margin-start:           -$pagination-border-width !default;\n$pagination-border-color:           $gray-300 !default;\n\n$pagination-focus-color:            $link-hover-color !default;\n$pagination-focus-bg:               $gray-200 !default;\n$pagination-focus-box-shadow:       $input-btn-focus-box-shadow !default;\n$pagination-focus-outline:          0 !default;\n\n$pagination-hover-color:            $link-hover-color !default;\n$pagination-hover-bg:               $gray-200 !default;\n$pagination-hover-border-color:     $gray-300 !default;\n\n$pagination-active-color:           $component-active-color !default;\n$pagination-active-bg:              $component-active-bg !default;\n$pagination-active-border-color:    $pagination-active-bg !default;\n\n$pagination-disabled-color:         $gray-600 !default;\n$pagination-disabled-bg:            $white !default;\n$pagination-disabled-border-color:  $gray-300 !default;\n\n$pagination-transition:              color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$pagination-border-radius-sm:       $border-radius-sm !default;\n$pagination-border-radius-lg:       $border-radius-lg !default;\n// scss-docs-end pagination-variables\n\n\n// Placeholders\n\n// scss-docs-start placeholders\n$placeholder-opacity-max:           .5 !default;\n$placeholder-opacity-min:           .2 !default;\n// scss-docs-end placeholders\n\n// Cards\n\n// scss-docs-start card-variables\n$card-spacer-y:                     $spacer !default;\n$card-spacer-x:                     $spacer !default;\n$card-title-spacer-y:               $spacer * .5 !default;\n$card-border-width:                 $border-width !default;\n$card-border-color:                 rgba($black, .125) !default;\n$card-border-radius:                $border-radius !default;\n$card-box-shadow:                   null !default;\n$card-inner-border-radius:          subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y:                $card-spacer-y * .5 !default;\n$card-cap-padding-x:                $card-spacer-x !default;\n$card-cap-bg:                       rgba($black, .03) !default;\n$card-cap-color:                    null !default;\n$card-height:                       null !default;\n$card-color:                        null !default;\n$card-bg:                           $white !default;\n$card-img-overlay-padding:          $spacer !default;\n$card-group-margin:                 $grid-gutter-width * .5 !default;\n// scss-docs-end card-variables\n\n// Accordion\n\n// scss-docs-start accordion-variables\n$accordion-padding-y:                     1rem !default;\n$accordion-padding-x:                     1.25rem !default;\n$accordion-color:                         $body-color !default;\n$accordion-bg:                            $body-bg !default;\n$accordion-border-width:                  $border-width !default;\n$accordion-border-color:                  rgba($black, .125) !default;\n$accordion-border-radius:                 $border-radius !default;\n$accordion-inner-border-radius:           subtract($accordion-border-radius, $accordion-border-width) !default;\n\n$accordion-body-padding-y:                $accordion-padding-y !default;\n$accordion-body-padding-x:                $accordion-padding-x !default;\n\n$accordion-button-padding-y:              $accordion-padding-y !default;\n$accordion-button-padding-x:              $accordion-padding-x !default;\n$accordion-button-color:                  $accordion-color !default;\n$accordion-button-bg:                     $accordion-bg !default;\n$accordion-transition:                    $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg:              tint-color($component-active-bg, 90%) !default;\n$accordion-button-active-color:           shade-color($primary, 10%) !default;\n\n$accordion-button-focus-border-color:     $input-focus-border-color !default;\n$accordion-button-focus-box-shadow:       $btn-focus-box-shadow !default;\n\n$accordion-icon-width:                    1.25rem !default;\n$accordion-icon-color:                    $accordion-button-color !default;\n$accordion-icon-active-color:             $accordion-button-active-color !default;\n$accordion-icon-transition:               transform .2s ease-in-out !default;\n$accordion-icon-transform:                rotate(-180deg) !default;\n\n$accordion-button-icon:         url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>\") !default;\n$accordion-button-active-icon:  url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>\") !default;\n// scss-docs-end accordion-variables\n\n// Tooltips\n\n// scss-docs-start tooltip-variables\n$tooltip-font-size:                 $font-size-sm !default;\n$tooltip-max-width:                 200px !default;\n$tooltip-color:                     $white !default;\n$tooltip-bg:                        $black !default;\n$tooltip-border-radius:             $border-radius !default;\n$tooltip-opacity:                   .9 !default;\n$tooltip-padding-y:                 $spacer * .25 !default;\n$tooltip-padding-x:                 $spacer * .5 !default;\n$tooltip-margin:                    0 !default;\n\n$tooltip-arrow-width:               .8rem !default;\n$tooltip-arrow-height:              .4rem !default;\n$tooltip-arrow-color:               $tooltip-bg !default;\n// scss-docs-end tooltip-variables\n\n// Form tooltips must come after regular tooltips\n// scss-docs-start tooltip-feedback-variables\n$form-feedback-tooltip-padding-y:     $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x:     $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size:     $tooltip-font-size !default;\n$form-feedback-tooltip-line-height:   null !default;\n$form-feedback-tooltip-opacity:       $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n// scss-docs-end tooltip-feedback-variables\n\n\n// Popovers\n\n// scss-docs-start popover-variables\n$popover-font-size:                 $font-size-sm !default;\n$popover-bg:                        $white !default;\n$popover-max-width:                 276px !default;\n$popover-border-width:              $border-width !default;\n$popover-border-color:              rgba($black, .2) !default;\n$popover-border-radius:             $border-radius-lg !default;\n$popover-inner-border-radius:       subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow:                $box-shadow !default;\n\n$popover-header-bg:                 shade-color($popover-bg, 6%) !default;\n$popover-header-color:              $headings-color !default;\n$popover-header-padding-y:          .5rem !default;\n$popover-header-padding-x:          $spacer !default;\n\n$popover-body-color:                $body-color !default;\n$popover-body-padding-y:            $spacer !default;\n$popover-body-padding-x:            $spacer !default;\n\n$popover-arrow-width:               1rem !default;\n$popover-arrow-height:              .5rem !default;\n$popover-arrow-color:               $popover-bg !default;\n\n$popover-arrow-outer-color:         fade-in($popover-border-color, .05) !default;\n// scss-docs-end popover-variables\n\n\n// Toasts\n\n// scss-docs-start toast-variables\n$toast-max-width:                   350px !default;\n$toast-padding-x:                   .75rem !default;\n$toast-padding-y:                   .5rem !default;\n$toast-font-size:                   .875rem !default;\n$toast-color:                       null !default;\n$toast-background-color:            rgba($white, .85) !default;\n$toast-border-width:                1px !default;\n$toast-border-color:                rgba($black, .1) !default;\n$toast-border-radius:               $border-radius !default;\n$toast-box-shadow:                  $box-shadow !default;\n$toast-spacing:                     $container-padding-x !default;\n\n$toast-header-color:                $gray-600 !default;\n$toast-header-background-color:     rgba($white, .85) !default;\n$toast-header-border-color:         rgba($black, .05) !default;\n// scss-docs-end toast-variables\n\n\n// Badges\n\n// scss-docs-start badge-variables\n$badge-font-size:                   .75em !default;\n$badge-font-weight:                 $font-weight-bold !default;\n$badge-color:                       $white !default;\n$badge-padding-y:                   .35em !default;\n$badge-padding-x:                   .65em !default;\n$badge-border-radius:               $border-radius !default;\n// scss-docs-end badge-variables\n\n\n// Modals\n\n// scss-docs-start modal-variables\n$modal-inner-padding:               $spacer !default;\n\n$modal-footer-margin-between:       .5rem !default;\n\n$modal-dialog-margin:               .5rem !default;\n$modal-dialog-margin-y-sm-up:       1.75rem !default;\n\n$modal-title-line-height:           $line-height-base !default;\n\n$modal-content-color:               null !default;\n$modal-content-bg:                  $white !default;\n$modal-content-border-color:        rgba($black, .2) !default;\n$modal-content-border-width:        $border-width !default;\n$modal-content-border-radius:       $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs:       $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up:    $box-shadow !default;\n\n$modal-backdrop-bg:                 $black !default;\n$modal-backdrop-opacity:            .5 !default;\n$modal-header-border-color:         $border-color !default;\n$modal-footer-border-color:         $modal-header-border-color !default;\n$modal-header-border-width:         $modal-content-border-width !default;\n$modal-footer-border-width:         $modal-header-border-width !default;\n$modal-header-padding-y:            $modal-inner-padding !default;\n$modal-header-padding-x:            $modal-inner-padding !default;\n$modal-header-padding:              $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-sm:                          300px !default;\n$modal-md:                          500px !default;\n$modal-lg:                          800px !default;\n$modal-xl:                          1140px !default;\n\n$modal-fade-transform:              translate(0, -50px) !default;\n$modal-show-transform:              none !default;\n$modal-transition:                  transform .3s ease-out !default;\n$modal-scale-transform:             scale(1.02) !default;\n// scss-docs-end modal-variables\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n// scss-docs-start alert-variables\n$alert-padding-y:               $spacer !default;\n$alert-padding-x:               $spacer !default;\n$alert-margin-bottom:           1rem !default;\n$alert-border-radius:           $border-radius !default;\n$alert-link-font-weight:        $font-weight-bold !default;\n$alert-border-width:            $border-width !default;\n$alert-bg-scale:                -80% !default;\n$alert-border-scale:            -70% !default;\n$alert-color-scale:             40% !default;\n$alert-dismissible-padding-r:   $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n// scss-docs-end alert-variables\n\n\n// Progress bars\n\n// scss-docs-start progress-variables\n$progress-height:                   1rem !default;\n$progress-font-size:                $font-size-base * .75 !default;\n$progress-bg:                       $gray-200 !default;\n$progress-border-radius:            $border-radius !default;\n$progress-box-shadow:               $box-shadow-inset !default;\n$progress-bar-color:                $white !default;\n$progress-bar-bg:                   $primary !default;\n$progress-bar-animation-timing:     1s linear infinite !default;\n$progress-bar-transition:           width .6s ease !default;\n// scss-docs-end progress-variables\n\n\n// List group\n\n// scss-docs-start list-group-variables\n$list-group-color:                  $gray-900 !default;\n$list-group-bg:                     $white !default;\n$list-group-border-color:           rgba($black, .125) !default;\n$list-group-border-width:           $border-width !default;\n$list-group-border-radius:          $border-radius !default;\n\n$list-group-item-padding-y:         $spacer * .5 !default;\n$list-group-item-padding-x:         $spacer !default;\n$list-group-item-bg-scale:          -80% !default;\n$list-group-item-color-scale:       40% !default;\n\n$list-group-hover-bg:               $gray-100 !default;\n$list-group-active-color:           $component-active-color !default;\n$list-group-active-bg:              $component-active-bg !default;\n$list-group-active-border-color:    $list-group-active-bg !default;\n\n$list-group-disabled-color:         $gray-600 !default;\n$list-group-disabled-bg:            $list-group-bg !default;\n\n$list-group-action-color:           $gray-700 !default;\n$list-group-action-hover-color:     $list-group-action-color !default;\n\n$list-group-action-active-color:    $body-color !default;\n$list-group-action-active-bg:       $gray-200 !default;\n// scss-docs-end list-group-variables\n\n\n// Image thumbnails\n\n// scss-docs-start thumbnail-variables\n$thumbnail-padding:                 .25rem !default;\n$thumbnail-bg:                      $body-bg !default;\n$thumbnail-border-width:            $border-width !default;\n$thumbnail-border-color:            $gray-300 !default;\n$thumbnail-border-radius:           $border-radius !default;\n$thumbnail-box-shadow:              $box-shadow-sm !default;\n// scss-docs-end thumbnail-variables\n\n\n// Figures\n\n// scss-docs-start figure-variables\n$figure-caption-font-size:          $small-font-size !default;\n$figure-caption-color:              $gray-600 !default;\n// scss-docs-end figure-variables\n\n\n// Breadcrumbs\n\n// scss-docs-start breadcrumb-variables\n$breadcrumb-font-size:              null !default;\n$breadcrumb-padding-y:              0 !default;\n$breadcrumb-padding-x:              0 !default;\n$breadcrumb-item-padding-x:         .5rem !default;\n$breadcrumb-margin-bottom:          1rem !default;\n$breadcrumb-bg:                     null !default;\n$breadcrumb-divider-color:          $gray-600 !default;\n$breadcrumb-active-color:           $gray-600 !default;\n$breadcrumb-divider:                quote(\"/\") !default;\n$breadcrumb-divider-flipped:        $breadcrumb-divider !default;\n$breadcrumb-border-radius:          null !default;\n// scss-docs-end breadcrumb-variables\n\n// Carousel\n\n// scss-docs-start carousel-variables\n$carousel-control-color:             $white !default;\n$carousel-control-width:             15% !default;\n$carousel-control-opacity:           .5 !default;\n$carousel-control-hover-opacity:     .9 !default;\n$carousel-control-transition:        opacity .15s ease !default;\n\n$carousel-indicator-width:           30px !default;\n$carousel-indicator-height:          3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer:          3px !default;\n$carousel-indicator-opacity:         .5 !default;\n$carousel-indicator-active-bg:       $white !default;\n$carousel-indicator-active-opacity:  1 !default;\n$carousel-indicator-transition:      opacity .6s ease !default;\n\n$carousel-caption-width:             70% !default;\n$carousel-caption-color:             $white !default;\n$carousel-caption-padding-y:         1.25rem !default;\n$carousel-caption-spacer:            1.25rem !default;\n\n$carousel-control-icon-width:        2rem !default;\n\n$carousel-control-prev-icon-bg:      url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/></svg>\") !default;\n$carousel-control-next-icon-bg:      url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/></svg>\") !default;\n\n$carousel-transition-duration:       .6s !default;\n$carousel-transition:                transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg:  $black !default;\n$carousel-dark-caption-color:        $black !default;\n$carousel-dark-control-icon-filter:  invert(1) grayscale(100) !default;\n// scss-docs-end carousel-variables\n\n\n// Spinners\n\n// scss-docs-start spinner-variables\n$spinner-width:           2rem !default;\n$spinner-height:          $spinner-width !default;\n$spinner-vertical-align:  -.125em !default;\n$spinner-border-width:    .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm:        1rem !default;\n$spinner-height-sm:       $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n// scss-docs-end spinner-variables\n\n\n// Close\n\n// scss-docs-start close-variables\n$btn-close-width:            1em !default;\n$btn-close-height:           $btn-close-width !default;\n$btn-close-padding-x:        .25em !default;\n$btn-close-padding-y:        $btn-close-padding-x !default;\n$btn-close-color:            $black !default;\n$btn-close-bg:               url(\"data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>\") !default;\n$btn-close-focus-shadow:     $input-btn-focus-box-shadow !default;\n$btn-close-opacity:          .5 !default;\n$btn-close-hover-opacity:    .75 !default;\n$btn-close-focus-opacity:    1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter:     invert(1) grayscale(100%) brightness(200%) !default;\n// scss-docs-end close-variables\n\n\n// Offcanvas\n\n// scss-docs-start offcanvas-variables\n$offcanvas-padding-y:               $modal-inner-padding !default;\n$offcanvas-padding-x:               $modal-inner-padding !default;\n$offcanvas-horizontal-width:        400px !default;\n$offcanvas-vertical-height:         30vh !default;\n$offcanvas-transition-duration:     .3s !default;\n$offcanvas-border-color:            $modal-content-border-color !default;\n$offcanvas-border-width:            $modal-content-border-width !default;\n$offcanvas-title-line-height:       $modal-title-line-height !default;\n$offcanvas-bg-color:                $modal-content-bg !default;\n$offcanvas-color:                   $modal-content-color !default;\n$offcanvas-box-shadow:              $modal-content-box-shadow-xs !default;\n$offcanvas-backdrop-bg:             $modal-backdrop-bg !default;\n$offcanvas-backdrop-opacity:        $modal-backdrop-opacity !default;\n// scss-docs-end offcanvas-variables\n\n// Code\n\n$code-font-size:                    $small-font-size !default;\n$code-color:                        $pink !default;\n\n$kbd-padding-y:                     .2rem !default;\n$kbd-padding-x:                     .4rem !default;\n$kbd-font-size:                     $code-font-size !default;\n$kbd-color:                         $white !default;\n$kbd-bg:                            $gray-900 !default;\n\n$pre-color:                         null !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/bootstrap-grid.scss",
    "content": "/*!\n * Bootstrap Grid v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n */\n\n$include-column-box-sizing: true !default;\n\n@import \"functions\";\n@import \"variables\";\n\n@import \"mixins/lists\";\n@import \"mixins/breakpoints\";\n@import \"mixins/container\";\n@import \"mixins/grid\";\n@import \"mixins/utilities\";\n\n@import \"vendor/rfs\";\n\n@import \"root\";\n\n@import \"containers\";\n@import \"grid\";\n\n@import \"utilities\";\n// Only use the utilities we need\n// stylelint-disable-next-line scss/dollar-variable-default\n$utilities: map-get-multiple(\n  $utilities,\n  (\n    \"display\",\n    \"order\",\n    \"flex\",\n    \"flex-direction\",\n    \"flex-grow\",\n    \"flex-shrink\",\n    \"flex-wrap\",\n    \"justify-content\",\n    \"align-items\",\n    \"align-content\",\n    \"align-self\",\n    \"margin\",\n    \"margin-x\",\n    \"margin-y\",\n    \"margin-top\",\n    \"margin-end\",\n    \"margin-bottom\",\n    \"margin-start\",\n    \"negative-margin\",\n    \"negative-margin-x\",\n    \"negative-margin-y\",\n    \"negative-margin-top\",\n    \"negative-margin-end\",\n    \"negative-margin-bottom\",\n    \"negative-margin-start\",\n    \"padding\",\n    \"padding-x\",\n    \"padding-y\",\n    \"padding-top\",\n    \"padding-end\",\n    \"padding-bottom\",\n    \"padding-start\",\n  )\n);\n\n@import \"utilities/api\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/bootstrap-reboot.scss",
    "content": "/*!\n * Bootstrap Reboot v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)\n */\n\n@import \"functions\";\n@import \"variables\";\n@import \"mixins\";\n@import \"root\";\n@import \"reboot\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/bootstrap-utilities.scss",
    "content": "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n */\n\n// Configuration\n@import \"functions\";\n@import \"variables\";\n@import \"mixins\";\n@import \"utilities\";\n\n// Helpers\n@import \"helpers\";\n\n// Utilities\n@import \"utilities/api\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/bootstrap.scss",
    "content": "/*!\n * Bootstrap v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n */\n\n// scss-docs-start import-stack\n// Configuration\n@import \"functions\";\n@import \"variables\";\n@import \"mixins\";\n@import \"utilities\";\n\n// Layout & components\n@import \"root\";\n@import \"reboot\";\n@import \"type\";\n@import \"images\";\n@import \"containers\";\n@import \"grid\";\n@import \"tables\";\n@import \"forms\";\n@import \"buttons\";\n@import \"transitions\";\n@import \"dropdown\";\n@import \"button-group\";\n@import \"nav\";\n@import \"navbar\";\n@import \"card\";\n@import \"accordion\";\n@import \"breadcrumb\";\n@import \"pagination\";\n@import \"badge\";\n@import \"alert\";\n@import \"progress\";\n@import \"list-group\";\n@import \"close\";\n@import \"toasts\";\n@import \"modal\";\n@import \"tooltip\";\n@import \"popover\";\n@import \"carousel\";\n@import \"spinners\";\n@import \"offcanvas\";\n@import \"placeholders\";\n\n// Helpers\n@import \"helpers\";\n\n// Utilities\n@import \"utilities/api\";\n// scss-docs-end import-stack\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_floating-labels.scss",
    "content": ".form-floating {\n  position: relative;\n\n  > .form-control,\n  > .form-select {\n    height: $form-floating-height;\n    line-height: $form-floating-line-height;\n  }\n\n  > label {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%; // allow textareas\n    padding: $form-floating-padding-y $form-floating-padding-x;\n    pointer-events: none;\n    border: $input-border-width solid transparent; // Required for aligning label's text with the input as it affects inner box model\n    transform-origin: 0 0;\n    @include transition($form-floating-transition);\n  }\n\n  // stylelint-disable no-duplicate-selectors\n  > .form-control {\n    padding: $form-floating-padding-y $form-floating-padding-x;\n\n    &::placeholder {\n      color: transparent;\n    }\n\n    &:focus,\n    &:not(:placeholder-shown) {\n      padding-top: $form-floating-input-padding-t;\n      padding-bottom: $form-floating-input-padding-b;\n    }\n    // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped\n    &:-webkit-autofill {\n      padding-top: $form-floating-input-padding-t;\n      padding-bottom: $form-floating-input-padding-b;\n    }\n  }\n\n  > .form-select {\n    padding-top: $form-floating-input-padding-t;\n    padding-bottom: $form-floating-input-padding-b;\n  }\n\n  > .form-control:focus,\n  > .form-control:not(:placeholder-shown),\n  > .form-select {\n    ~ label {\n      opacity: $form-floating-label-opacity;\n      transform: $form-floating-label-transform;\n    }\n  }\n  // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped\n  > .form-control:-webkit-autofill {\n    ~ label {\n      opacity: $form-floating-label-opacity;\n      transform: $form-floating-label-transform;\n    }\n  }\n  // stylelint-enable no-duplicate-selectors\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_form-check.scss",
    "content": "//\n// Check/radio\n//\n\n.form-check {\n  display: block;\n  min-height: $form-check-min-height;\n  padding-left: $form-check-padding-start;\n  margin-bottom: $form-check-margin-bottom;\n\n  .form-check-input {\n    float: left;\n    margin-left: $form-check-padding-start * -1;\n  }\n}\n\n.form-check-input {\n  width: $form-check-input-width;\n  height: $form-check-input-width;\n  margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height\n  vertical-align: top;\n  background-color: $form-check-input-bg;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: contain;\n  border: $form-check-input-border;\n  appearance: none;\n  color-adjust: exact; // Keep themed appearance for print\n  @include transition($form-check-transition);\n\n  &[type=\"checkbox\"] {\n    @include border-radius($form-check-input-border-radius);\n  }\n\n  &[type=\"radio\"] {\n    // stylelint-disable-next-line property-disallowed-list\n    border-radius: $form-check-radio-border-radius;\n  }\n\n  &:active {\n    filter: $form-check-input-active-filter;\n  }\n\n  &:focus {\n    border-color: $form-check-input-focus-border;\n    outline: 0;\n    box-shadow: $form-check-input-focus-box-shadow;\n  }\n\n  &:checked {\n    background-color: $form-check-input-checked-bg-color;\n    border-color: $form-check-input-checked-border-color;\n\n    &[type=\"checkbox\"] {\n      @if $enable-gradients {\n        background-image: escape-svg($form-check-input-checked-bg-image), var(--#{$variable-prefix}gradient);\n      } @else {\n        background-image: escape-svg($form-check-input-checked-bg-image);\n      }\n    }\n\n    &[type=\"radio\"] {\n      @if $enable-gradients {\n        background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$variable-prefix}gradient);\n      } @else {\n        background-image: escape-svg($form-check-radio-checked-bg-image);\n      }\n    }\n  }\n\n  &[type=\"checkbox\"]:indeterminate {\n    background-color: $form-check-input-indeterminate-bg-color;\n    border-color: $form-check-input-indeterminate-border-color;\n\n    @if $enable-gradients {\n      background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--#{$variable-prefix}gradient);\n    } @else {\n      background-image: escape-svg($form-check-input-indeterminate-bg-image);\n    }\n  }\n\n  &:disabled {\n    pointer-events: none;\n    filter: none;\n    opacity: $form-check-input-disabled-opacity;\n  }\n\n  // Use disabled attribute in addition of :disabled pseudo-class\n  // See: https://github.com/twbs/bootstrap/issues/28247\n  &[disabled],\n  &:disabled {\n    ~ .form-check-label {\n      opacity: $form-check-label-disabled-opacity;\n    }\n  }\n}\n\n.form-check-label {\n  color: $form-check-label-color;\n  cursor: $form-check-label-cursor;\n}\n\n//\n// Switch\n//\n\n.form-switch {\n  padding-left: $form-switch-padding-start;\n\n  .form-check-input {\n    width: $form-switch-width;\n    margin-left: $form-switch-padding-start * -1;\n    background-image: escape-svg($form-switch-bg-image);\n    background-position: left center;\n    @include border-radius($form-switch-border-radius);\n    @include transition($form-switch-transition);\n\n    &:focus {\n      background-image: escape-svg($form-switch-focus-bg-image);\n    }\n\n    &:checked {\n      background-position: $form-switch-checked-bg-position;\n\n      @if $enable-gradients {\n        background-image: escape-svg($form-switch-checked-bg-image), var(--#{$variable-prefix}gradient);\n      } @else {\n        background-image: escape-svg($form-switch-checked-bg-image);\n      }\n    }\n  }\n}\n\n.form-check-inline {\n  display: inline-block;\n  margin-right: $form-check-inline-margin-end;\n}\n\n.btn-check {\n  position: absolute;\n  clip: rect(0, 0, 0, 0);\n  pointer-events: none;\n\n  &[disabled],\n  &:disabled {\n    + .btn {\n      pointer-events: none;\n      filter: none;\n      opacity: $form-check-btn-check-disabled-opacity;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_form-control.scss",
    "content": "//\n// General form controls (plus a few specific high-level interventions)\n//\n\n.form-control {\n  display: block;\n  width: 100%;\n  padding: $input-padding-y $input-padding-x;\n  font-family: $input-font-family;\n  @include font-size($input-font-size);\n  font-weight: $input-font-weight;\n  line-height: $input-line-height;\n  color: $input-color;\n  background-color: $input-bg;\n  background-clip: padding-box;\n  border: $input-border-width solid $input-border-color;\n  appearance: none; // Fix appearance for date inputs in Safari\n\n  // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.\n  @include border-radius($input-border-radius, 0);\n\n  @include box-shadow($input-box-shadow);\n  @include transition($input-transition);\n\n  &[type=\"file\"] {\n    overflow: hidden; // prevent pseudo element button overlap\n\n    &:not(:disabled):not([readonly]) {\n      cursor: pointer;\n    }\n  }\n\n  // Customize the `:focus` state to imitate native WebKit styles.\n  &:focus {\n    color: $input-focus-color;\n    background-color: $input-focus-bg;\n    border-color: $input-focus-border-color;\n    outline: 0;\n    @if $enable-shadows {\n      @include box-shadow($input-box-shadow, $input-focus-box-shadow);\n    } @else {\n      // Avoid using mixin so we can pass custom focus shadow properly\n      box-shadow: $input-focus-box-shadow;\n    }\n  }\n\n  // Add some height to date inputs on iOS\n  // https://github.com/twbs/bootstrap/issues/23307\n  // TODO: we can remove this workaround once https://bugs.webkit.org/show_bug.cgi?id=198959 is resolved\n  &::-webkit-date-and-time-value {\n    // Multiply line-height by 1em if it has no unit\n    height: if(unit($input-line-height) == \"\", $input-line-height * 1em, $input-line-height);\n  }\n\n  // Placeholder\n  &::placeholder {\n    color: $input-placeholder-color;\n    // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526.\n    opacity: 1;\n  }\n\n  // Disabled and read-only inputs\n  //\n  // HTML5 says that controls under a fieldset > legend:first-child won't be\n  // disabled if the fieldset is disabled. Due to implementation difficulty, we\n  // don't honor that edge case; we style them as disabled anyway.\n  &:disabled,\n  &[readonly] {\n    background-color: $input-disabled-bg;\n    border-color: $input-disabled-border-color;\n    // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.\n    opacity: 1;\n  }\n\n  // File input buttons theming\n  &::file-selector-button {\n    padding: $input-padding-y $input-padding-x;\n    margin: (-$input-padding-y) (-$input-padding-x);\n    margin-inline-end: $input-padding-x;\n    color: $form-file-button-color;\n    @include gradient-bg($form-file-button-bg);\n    pointer-events: none;\n    border-color: inherit;\n    border-style: solid;\n    border-width: 0;\n    border-inline-end-width: $input-border-width;\n    border-radius: 0; // stylelint-disable-line property-disallowed-list\n    @include transition($btn-transition);\n  }\n\n  &:hover:not(:disabled):not([readonly])::file-selector-button {\n    background-color: $form-file-button-hover-bg;\n  }\n\n  &::-webkit-file-upload-button {\n    padding: $input-padding-y $input-padding-x;\n    margin: (-$input-padding-y) (-$input-padding-x);\n    margin-inline-end: $input-padding-x;\n    color: $form-file-button-color;\n    @include gradient-bg($form-file-button-bg);\n    pointer-events: none;\n    border-color: inherit;\n    border-style: solid;\n    border-width: 0;\n    border-inline-end-width: $input-border-width;\n    border-radius: 0; // stylelint-disable-line property-disallowed-list\n    @include transition($btn-transition);\n  }\n\n  &:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {\n    background-color: $form-file-button-hover-bg;\n  }\n}\n\n// Readonly controls as plain text\n//\n// Apply class to a readonly input to make it appear like regular plain\n// text (without any border, background color, focus indicator)\n\n.form-control-plaintext {\n  display: block;\n  width: 100%;\n  padding: $input-padding-y 0;\n  margin-bottom: 0; // match inputs if this class comes on inputs with default margins\n  line-height: $input-line-height;\n  color: $input-plaintext-color;\n  background-color: transparent;\n  border: solid transparent;\n  border-width: $input-border-width 0;\n\n  &.form-control-sm,\n  &.form-control-lg {\n    padding-right: 0;\n    padding-left: 0;\n  }\n}\n\n// Form control sizing\n//\n// Build on `.form-control` with modifier classes to decrease or increase the\n// height and font-size of form controls.\n//\n// Repeated in `_input_group.scss` to avoid Sass extend issues.\n\n.form-control-sm {\n  min-height: $input-height-sm;\n  padding: $input-padding-y-sm $input-padding-x-sm;\n  @include font-size($input-font-size-sm);\n  @include border-radius($input-border-radius-sm);\n\n  &::file-selector-button {\n    padding: $input-padding-y-sm $input-padding-x-sm;\n    margin: (-$input-padding-y-sm) (-$input-padding-x-sm);\n    margin-inline-end: $input-padding-x-sm;\n  }\n\n  &::-webkit-file-upload-button {\n    padding: $input-padding-y-sm $input-padding-x-sm;\n    margin: (-$input-padding-y-sm) (-$input-padding-x-sm);\n    margin-inline-end: $input-padding-x-sm;\n  }\n}\n\n.form-control-lg {\n  min-height: $input-height-lg;\n  padding: $input-padding-y-lg $input-padding-x-lg;\n  @include font-size($input-font-size-lg);\n  @include border-radius($input-border-radius-lg);\n\n  &::file-selector-button {\n    padding: $input-padding-y-lg $input-padding-x-lg;\n    margin: (-$input-padding-y-lg) (-$input-padding-x-lg);\n    margin-inline-end: $input-padding-x-lg;\n  }\n\n  &::-webkit-file-upload-button {\n    padding: $input-padding-y-lg $input-padding-x-lg;\n    margin: (-$input-padding-y-lg) (-$input-padding-x-lg);\n    margin-inline-end: $input-padding-x-lg;\n  }\n}\n\n// Make sure textareas don't shrink too much when resized\n// https://github.com/twbs/bootstrap/pull/29124\n// stylelint-disable selector-no-qualifying-type\ntextarea {\n  &.form-control {\n    min-height: $input-height;\n  }\n\n  &.form-control-sm {\n    min-height: $input-height-sm;\n  }\n\n  &.form-control-lg {\n    min-height: $input-height-lg;\n  }\n}\n// stylelint-enable selector-no-qualifying-type\n\n.form-control-color {\n  width: $form-color-width;\n  height: auto; // Override fixed browser height\n  padding: $input-padding-y;\n\n  &:not(:disabled):not([readonly]) {\n    cursor: pointer;\n  }\n\n  &::-moz-color-swatch {\n    height: if(unit($input-line-height) == \"\", $input-line-height * 1em, $input-line-height);\n    @include border-radius($input-border-radius);\n  }\n\n  &::-webkit-color-swatch {\n    height: if(unit($input-line-height) == \"\", $input-line-height * 1em, $input-line-height);\n    @include border-radius($input-border-radius);\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_form-range.scss",
    "content": "// Range\n//\n// Style range inputs the same across browsers. Vendor-specific rules for pseudo\n// elements cannot be mixed. As such, there are no shared styles for focus or\n// active states on prefixed selectors.\n\n.form-range {\n  width: 100%;\n  height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2);\n  padding: 0; // Need to reset padding\n  background-color: transparent;\n  appearance: none;\n\n  &:focus {\n    outline: 0;\n\n    // Pseudo-elements must be split across multiple rulesets to have an effect.\n    // No box-shadow() mixin for focus accessibility.\n    &::-webkit-slider-thumb { box-shadow: $form-range-thumb-focus-box-shadow; }\n    &::-moz-range-thumb     { box-shadow: $form-range-thumb-focus-box-shadow; }\n  }\n\n  &::-moz-focus-outer {\n    border: 0;\n  }\n\n  &::-webkit-slider-thumb {\n    width: $form-range-thumb-width;\n    height: $form-range-thumb-height;\n    margin-top: ($form-range-track-height - $form-range-thumb-height) * .5; // Webkit specific\n    @include gradient-bg($form-range-thumb-bg);\n    border: $form-range-thumb-border;\n    @include border-radius($form-range-thumb-border-radius);\n    @include box-shadow($form-range-thumb-box-shadow);\n    @include transition($form-range-thumb-transition);\n    appearance: none;\n\n    &:active {\n      @include gradient-bg($form-range-thumb-active-bg);\n    }\n  }\n\n  &::-webkit-slider-runnable-track {\n    width: $form-range-track-width;\n    height: $form-range-track-height;\n    color: transparent; // Why?\n    cursor: $form-range-track-cursor;\n    background-color: $form-range-track-bg;\n    border-color: transparent;\n    @include border-radius($form-range-track-border-radius);\n    @include box-shadow($form-range-track-box-shadow);\n  }\n\n  &::-moz-range-thumb {\n    width: $form-range-thumb-width;\n    height: $form-range-thumb-height;\n    @include gradient-bg($form-range-thumb-bg);\n    border: $form-range-thumb-border;\n    @include border-radius($form-range-thumb-border-radius);\n    @include box-shadow($form-range-thumb-box-shadow);\n    @include transition($form-range-thumb-transition);\n    appearance: none;\n\n    &:active {\n      @include gradient-bg($form-range-thumb-active-bg);\n    }\n  }\n\n  &::-moz-range-track {\n    width: $form-range-track-width;\n    height: $form-range-track-height;\n    color: transparent;\n    cursor: $form-range-track-cursor;\n    background-color: $form-range-track-bg;\n    border-color: transparent; // Firefox specific?\n    @include border-radius($form-range-track-border-radius);\n    @include box-shadow($form-range-track-box-shadow);\n  }\n\n  &:disabled {\n    pointer-events: none;\n\n    &::-webkit-slider-thumb {\n      background-color: $form-range-thumb-disabled-bg;\n    }\n\n    &::-moz-range-thumb {\n      background-color: $form-range-thumb-disabled-bg;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_form-select.scss",
    "content": "// Select\n//\n// Replaces the browser default select with a custom one, mostly pulled from\n// https://primer.github.io/.\n\n.form-select {\n  display: block;\n  width: 100%;\n  padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;\n  // stylelint-disable-next-line property-no-vendor-prefix\n  -moz-padding-start: subtract($form-select-padding-x, 3px); // See https://github.com/twbs/bootstrap/issues/32636\n  font-family: $form-select-font-family;\n  @include font-size($form-select-font-size);\n  font-weight: $form-select-font-weight;\n  line-height: $form-select-line-height;\n  color: $form-select-color;\n  background-color: $form-select-bg;\n  background-image: escape-svg($form-select-indicator);\n  background-repeat: no-repeat;\n  background-position: $form-select-bg-position;\n  background-size: $form-select-bg-size;\n  border: $form-select-border-width solid $form-select-border-color;\n  @include border-radius($form-select-border-radius, 0);\n  @include box-shadow($form-select-box-shadow);\n  @include transition($form-select-transition);\n  appearance: none;\n\n  &:focus {\n    border-color: $form-select-focus-border-color;\n    outline: 0;\n    @if $enable-shadows {\n      @include box-shadow($form-select-box-shadow, $form-select-focus-box-shadow);\n    } @else {\n      // Avoid using mixin so we can pass custom focus shadow properly\n      box-shadow: $form-select-focus-box-shadow;\n    }\n  }\n\n  &[multiple],\n  &[size]:not([size=\"1\"]) {\n    padding-right: $form-select-padding-x;\n    background-image: none;\n  }\n\n  &:disabled {\n    color: $form-select-disabled-color;\n    background-color: $form-select-disabled-bg;\n    border-color: $form-select-disabled-border-color;\n  }\n\n  // Remove outline from select box in FF\n  &:-moz-focusring {\n    color: transparent;\n    text-shadow: 0 0 0 $form-select-color;\n  }\n}\n\n.form-select-sm {\n  padding-top: $form-select-padding-y-sm;\n  padding-bottom: $form-select-padding-y-sm;\n  padding-left: $form-select-padding-x-sm;\n  @include font-size($form-select-font-size-sm);\n  @include border-radius($form-select-border-radius-sm);\n}\n\n.form-select-lg {\n  padding-top: $form-select-padding-y-lg;\n  padding-bottom: $form-select-padding-y-lg;\n  padding-left: $form-select-padding-x-lg;\n  @include font-size($form-select-font-size-lg);\n  @include border-radius($form-select-border-radius-lg);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_form-text.scss",
    "content": "//\n// Form text\n//\n\n.form-text {\n  margin-top: $form-text-margin-top;\n  @include font-size($form-text-font-size);\n  font-style: $form-text-font-style;\n  font-weight: $form-text-font-weight;\n  color: $form-text-color;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_input-group.scss",
    "content": "//\n// Base styles\n//\n\n.input-group {\n  position: relative;\n  display: flex;\n  flex-wrap: wrap; // For form validation feedback\n  align-items: stretch;\n  width: 100%;\n\n  > .form-control,\n  > .form-select {\n    position: relative; // For focus state's z-index\n    flex: 1 1 auto;\n    width: 1%;\n    min-width: 0; // https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-past-content-size\n  }\n\n  // Bring the \"active\" form control to the top of surrounding elements\n  > .form-control:focus,\n  > .form-select:focus {\n    z-index: 3;\n  }\n\n  // Ensure buttons are always above inputs for more visually pleasing borders.\n  // This isn't needed for `.input-group-text` since it shares the same border-color\n  // as our inputs.\n  .btn {\n    position: relative;\n    z-index: 2;\n\n    &:focus {\n      z-index: 3;\n    }\n  }\n}\n\n\n// Textual addons\n//\n// Serves as a catch-all element for any text or radio/checkbox input you wish\n// to prepend or append to an input.\n\n.input-group-text {\n  display: flex;\n  align-items: center;\n  padding: $input-group-addon-padding-y $input-group-addon-padding-x;\n  @include font-size($input-font-size); // Match inputs\n  font-weight: $input-group-addon-font-weight;\n  line-height: $input-line-height;\n  color: $input-group-addon-color;\n  text-align: center;\n  white-space: nowrap;\n  background-color: $input-group-addon-bg;\n  border: $input-border-width solid $input-group-addon-border-color;\n  @include border-radius($input-border-radius);\n}\n\n\n// Sizing\n//\n// Remix the default form control sizing classes into new ones for easier\n// manipulation.\n\n.input-group-lg > .form-control,\n.input-group-lg > .form-select,\n.input-group-lg > .input-group-text,\n.input-group-lg > .btn {\n  padding: $input-padding-y-lg $input-padding-x-lg;\n  @include font-size($input-font-size-lg);\n  @include border-radius($input-border-radius-lg);\n}\n\n.input-group-sm > .form-control,\n.input-group-sm > .form-select,\n.input-group-sm > .input-group-text,\n.input-group-sm > .btn {\n  padding: $input-padding-y-sm $input-padding-x-sm;\n  @include font-size($input-font-size-sm);\n  @include border-radius($input-border-radius-sm);\n}\n\n.input-group-lg > .form-select,\n.input-group-sm > .form-select {\n  padding-right: $form-select-padding-x + $form-select-indicator-padding;\n}\n\n\n// Rounded corners\n//\n// These rulesets must come after the sizing ones to properly override sm and lg\n// border-radius values when extending. They're more specific than we'd like\n// with the `.input-group >` part, but without it, we cannot override the sizing.\n\n// stylelint-disable-next-line no-duplicate-selectors\n.input-group {\n  &:not(.has-validation) {\n    > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),\n    > .dropdown-toggle:nth-last-child(n + 3) {\n      @include border-end-radius(0);\n    }\n  }\n\n  &.has-validation {\n    > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),\n    > .dropdown-toggle:nth-last-child(n + 4) {\n      @include border-end-radius(0);\n    }\n  }\n\n  $validation-messages: \"\";\n  @each $state in map-keys($form-validation-states) {\n    $validation-messages: $validation-messages + \":not(.\" + unquote($state) + \"-tooltip)\" + \":not(.\" + unquote($state) + \"-feedback)\";\n  }\n\n  > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {\n    margin-left: -$input-border-width;\n    @include border-start-radius(0);\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_labels.scss",
    "content": "//\n// Labels\n//\n\n.form-label {\n  margin-bottom: $form-label-margin-bottom;\n  @include font-size($form-label-font-size);\n  font-style: $form-label-font-style;\n  font-weight: $form-label-font-weight;\n  color: $form-label-color;\n}\n\n// For use with horizontal and inline forms, when you need the label (or legend)\n// text to align with the form controls.\n.col-form-label {\n  padding-top: add($input-padding-y, $input-border-width);\n  padding-bottom: add($input-padding-y, $input-border-width);\n  margin-bottom: 0; // Override the `<legend>` default\n  @include font-size(inherit); // Override the `<legend>` default\n  font-style: $form-label-font-style;\n  font-weight: $form-label-font-weight;\n  line-height: $input-line-height;\n  color: $form-label-color;\n}\n\n.col-form-label-lg {\n  padding-top: add($input-padding-y-lg, $input-border-width);\n  padding-bottom: add($input-padding-y-lg, $input-border-width);\n  @include font-size($input-font-size-lg);\n}\n\n.col-form-label-sm {\n  padding-top: add($input-padding-y-sm, $input-border-width);\n  padding-bottom: add($input-padding-y-sm, $input-border-width);\n  @include font-size($input-font-size-sm);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/forms/_validation.scss",
    "content": "// Form validation\n//\n// Provide feedback to users when form field values are valid or invalid. Works\n// primarily for client-side validation via scoped `:invalid` and `:valid`\n// pseudo-classes but also includes `.is-invalid` and `.is-valid` classes for\n// server-side validation.\n\n// scss-docs-start form-validation-states-loop\n@each $state, $data in $form-validation-states {\n  @include form-validation-state($state, $data...);\n}\n// scss-docs-end form-validation-states-loop\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_clearfix.scss",
    "content": ".clearfix {\n  @include clearfix();\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_colored-links.scss",
    "content": "@each $color, $value in $theme-colors {\n  .link-#{$color} {\n    color: $value;\n\n    @if $link-shade-percentage != 0 {\n      &:hover,\n      &:focus {\n        color: if(color-contrast($value) == $color-contrast-light, shade-color($value, $link-shade-percentage), tint-color($value, $link-shade-percentage));\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_position.scss",
    "content": "// Shorthand\n\n.fixed-top {\n  position: fixed;\n  top: 0;\n  right: 0;\n  left: 0;\n  z-index: $zindex-fixed;\n}\n\n.fixed-bottom {\n  position: fixed;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: $zindex-fixed;\n}\n\n// Responsive sticky top\n@each $breakpoint in map-keys($grid-breakpoints) {\n  @include media-breakpoint-up($breakpoint) {\n    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n    .sticky#{$infix}-top {\n      position: sticky;\n      top: 0;\n      z-index: $zindex-sticky;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_ratio.scss",
    "content": "// Credit: Nicolas Gallagher and SUIT CSS.\n\n.ratio {\n  position: relative;\n  width: 100%;\n\n  &::before {\n    display: block;\n    padding-top: var(--#{$variable-prefix}aspect-ratio);\n    content: \"\";\n  }\n\n  > * {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n  }\n}\n\n@each $key, $ratio in $aspect-ratios {\n  .ratio-#{$key} {\n    --#{$variable-prefix}aspect-ratio: #{$ratio};\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_stacks.scss",
    "content": "// scss-docs-start stacks\n.hstack {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  align-self: stretch;\n}\n\n.vstack {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  align-self: stretch;\n}\n// scss-docs-end stacks\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_stretched-link.scss",
    "content": "//\n// Stretched link\n//\n\n.stretched-link {\n  &::#{$stretched-link-pseudo-element} {\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    z-index: $stretched-link-z-index;\n    content: \"\";\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_text-truncation.scss",
    "content": "//\n// Text truncation\n//\n\n.text-truncate {\n  @include text-truncate();\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_visually-hidden.scss",
    "content": "//\n// Visually hidden\n//\n\n.visually-hidden,\n.visually-hidden-focusable:not(:focus):not(:focus-within) {\n  @include visually-hidden();\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/helpers/_vr.scss",
    "content": ".vr {\n  display: inline-block;\n  align-self: stretch;\n  width: 1px;\n  min-height: 1em;\n  background-color: currentColor;\n  opacity: $hr-opacity;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_alert.scss",
    "content": "// scss-docs-start alert-variant-mixin\n@mixin alert-variant($background, $border, $color) {\n  color: $color;\n  @include gradient-bg($background);\n  border-color: $border;\n\n  .alert-link {\n    color: shade-color($color, 20%);\n  }\n}\n// scss-docs-end alert-variant-mixin\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_backdrop.scss",
    "content": "// Shared between modals and offcanvases\n@mixin overlay-backdrop($zindex, $backdrop-bg, $backdrop-opacity) {\n  position: fixed;\n  top: 0;\n  left: 0;\n  z-index: $zindex;\n  width: 100vw;\n  height: 100vh;\n  background-color: $backdrop-bg;\n\n  // Fade for backdrop\n  &.fade { opacity: 0; }\n  &.show { opacity: $backdrop-opacity; }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_border-radius.scss",
    "content": "// stylelint-disable property-disallowed-list\n// Single side border-radius\n\n// Helper function to replace negative values with 0\n@function valid-radius($radius) {\n  $return: ();\n  @each $value in $radius {\n    @if type-of($value) == number {\n      $return: append($return, max($value, 0));\n    } @else {\n      $return: append($return, $value);\n    }\n  }\n  @return $return;\n}\n\n// scss-docs-start border-radius-mixins\n@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {\n  @if $enable-rounded {\n    border-radius: valid-radius($radius);\n  }\n  @else if $fallback-border-radius != false {\n    border-radius: $fallback-border-radius;\n  }\n}\n\n@mixin border-top-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-top-left-radius: valid-radius($radius);\n    border-top-right-radius: valid-radius($radius);\n  }\n}\n\n@mixin border-end-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-top-right-radius: valid-radius($radius);\n    border-bottom-right-radius: valid-radius($radius);\n  }\n}\n\n@mixin border-bottom-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-bottom-right-radius: valid-radius($radius);\n    border-bottom-left-radius: valid-radius($radius);\n  }\n}\n\n@mixin border-start-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-top-left-radius: valid-radius($radius);\n    border-bottom-left-radius: valid-radius($radius);\n  }\n}\n\n@mixin border-top-start-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-top-left-radius: valid-radius($radius);\n  }\n}\n\n@mixin border-top-end-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-top-right-radius: valid-radius($radius);\n  }\n}\n\n@mixin border-bottom-end-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-bottom-right-radius: valid-radius($radius);\n  }\n}\n\n@mixin border-bottom-start-radius($radius: $border-radius) {\n  @if $enable-rounded {\n    border-bottom-left-radius: valid-radius($radius);\n  }\n}\n// scss-docs-end border-radius-mixins\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_box-shadow.scss",
    "content": "@mixin box-shadow($shadow...) {\n  @if $enable-shadows {\n    $result: ();\n\n    @each $value in $shadow {\n      @if $value != null {\n        $result: append($result, $value, \"comma\");\n      }\n      @if $value == none and length($shadow) > 1 {\n        @warn \"The keyword 'none' must be used as a single argument.\";\n      }\n    }\n\n    @if (length($result) > 0) {\n      box-shadow: $result;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_breakpoints.scss",
    "content": "// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n//    (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n//    >> breakpoint-next(sm)\n//    md\n//    >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    md\n//    >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n//    md\n@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n  $n: index($breakpoint-names, $name);\n  @if not $n {\n    @error \"breakpoint `#{$name}` not found in `#{$breakpoints}`\";\n  }\n  @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n//    >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    576px\n@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {\n  $min: map-get($breakpoints, $name);\n  @return if($min != 0, $min, null);\n}\n\n// Maximum breakpoint width.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n//    >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    767.98px\n@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {\n  $max: map-get($breakpoints, $name);\n  @return if($max and $max > 0, $max - .02, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.\n// Useful for making responsive utilities.\n//\n//    >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    \"\"  (Returns a blank string)\n//    >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {\n  @return if(breakpoint-min($name, $breakpoints) == null, \"\", \"-#{$name}\");\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {\n  $min: breakpoint-min($name, $breakpoints);\n  @if $min {\n    @media (min-width: $min) {\n      @content;\n    }\n  } @else {\n    @content;\n  }\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {\n  $max: breakpoint-max($name, $breakpoints);\n  @if $max {\n    @media (max-width: $max) {\n      @content;\n    }\n  } @else {\n    @content;\n  }\n}\n\n// Media that spans multiple breakpoint widths.\n// Makes the @content apply between the min and max breakpoints\n@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {\n  $min: breakpoint-min($lower, $breakpoints);\n  $max: breakpoint-max($upper, $breakpoints);\n\n  @if $min != null and $max != null {\n    @media (min-width: $min) and (max-width: $max) {\n      @content;\n    }\n  } @else if $max == null {\n    @include media-breakpoint-up($lower, $breakpoints) {\n      @content;\n    }\n  } @else if $min == null {\n    @include media-breakpoint-down($upper, $breakpoints) {\n      @content;\n    }\n  }\n}\n\n// Media between the breakpoint's minimum and maximum widths.\n// No minimum for the smallest breakpoint, and no maximum for the largest one.\n// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.\n@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {\n  $min:  breakpoint-min($name, $breakpoints);\n  $next: breakpoint-next($name, $breakpoints);\n  $max:  breakpoint-max($next);\n\n  @if $min != null and $max != null {\n    @media (min-width: $min) and (max-width: $max) {\n      @content;\n    }\n  } @else if $max == null {\n    @include media-breakpoint-up($name, $breakpoints) {\n      @content;\n    }\n  } @else if $min == null {\n    @include media-breakpoint-down($next, $breakpoints) {\n      @content;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_buttons.scss",
    "content": "// Button variants\n//\n// Easily pump out default styles, as well as :hover, :focus, :active,\n// and disabled options for all buttons\n\n// scss-docs-start btn-variant-mixin\n@mixin button-variant(\n  $background,\n  $border,\n  $color: color-contrast($background),\n  $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),\n  $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),\n  $hover-color: color-contrast($hover-background),\n  $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),\n  $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),\n  $active-color: color-contrast($active-background),\n  $disabled-background: $background,\n  $disabled-border: $border,\n  $disabled-color: color-contrast($disabled-background)\n) {\n  color: $color;\n  @include gradient-bg($background);\n  border-color: $border;\n  @include box-shadow($btn-box-shadow);\n\n  &:hover {\n    color: $hover-color;\n    @include gradient-bg($hover-background);\n    border-color: $hover-border;\n  }\n\n  .btn-check:focus + &,\n  &:focus {\n    color: $hover-color;\n    @include gradient-bg($hover-background);\n    border-color: $hover-border;\n    @if $enable-shadows {\n      @include box-shadow($btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));\n    } @else {\n      // Avoid using mixin so we can pass custom focus shadow properly\n      box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);\n    }\n  }\n\n  .btn-check:checked + &,\n  .btn-check:active + &,\n  &:active,\n  &.active,\n  .show > &.dropdown-toggle {\n    color: $active-color;\n    background-color: $active-background;\n    // Remove CSS gradients if they're enabled\n    background-image: if($enable-gradients, none, null);\n    border-color: $active-border;\n\n    &:focus {\n      @if $enable-shadows {\n        @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));\n      } @else {\n        // Avoid using mixin so we can pass custom focus shadow properly\n        box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);\n      }\n    }\n  }\n\n  &:disabled,\n  &.disabled {\n    color: $disabled-color;\n    background-color: $disabled-background;\n    // Remove CSS gradients if they're enabled\n    background-image: if($enable-gradients, none, null);\n    border-color: $disabled-border;\n  }\n}\n// scss-docs-end btn-variant-mixin\n\n// scss-docs-start btn-outline-variant-mixin\n@mixin button-outline-variant(\n  $color,\n  $color-hover: color-contrast($color),\n  $active-background: $color,\n  $active-border: $color,\n  $active-color: color-contrast($active-background)\n) {\n  color: $color;\n  border-color: $color;\n\n  &:hover {\n    color: $color-hover;\n    background-color: $active-background;\n    border-color: $active-border;\n  }\n\n  .btn-check:focus + &,\n  &:focus {\n    box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);\n  }\n\n  .btn-check:checked + &,\n  .btn-check:active + &,\n  &:active,\n  &.active,\n  &.dropdown-toggle.show {\n    color: $active-color;\n    background-color: $active-background;\n    border-color: $active-border;\n\n    &:focus {\n      @if $enable-shadows {\n        @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5));\n      } @else {\n        // Avoid using mixin so we can pass custom focus shadow properly\n        box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);\n      }\n    }\n  }\n\n  &:disabled,\n  &.disabled {\n    color: $color;\n    background-color: transparent;\n  }\n}\n// scss-docs-end btn-outline-variant-mixin\n\n// scss-docs-start btn-size-mixin\n@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {\n  padding: $padding-y $padding-x;\n  @include font-size($font-size);\n  // Manually declare to provide an override to the browser default\n  @include border-radius($border-radius, 0);\n}\n// scss-docs-end btn-size-mixin\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_caret.scss",
    "content": "// scss-docs-start caret-mixins\n@mixin caret-down {\n  border-top: $caret-width solid;\n  border-right: $caret-width solid transparent;\n  border-bottom: 0;\n  border-left: $caret-width solid transparent;\n}\n\n@mixin caret-up {\n  border-top: 0;\n  border-right: $caret-width solid transparent;\n  border-bottom: $caret-width solid;\n  border-left: $caret-width solid transparent;\n}\n\n@mixin caret-end {\n  border-top: $caret-width solid transparent;\n  border-right: 0;\n  border-bottom: $caret-width solid transparent;\n  border-left: $caret-width solid;\n}\n\n@mixin caret-start {\n  border-top: $caret-width solid transparent;\n  border-right: $caret-width solid;\n  border-bottom: $caret-width solid transparent;\n}\n\n@mixin caret($direction: down) {\n  @if $enable-caret {\n    &::after {\n      display: inline-block;\n      margin-left: $caret-spacing;\n      vertical-align: $caret-vertical-align;\n      content: \"\";\n      @if $direction == down {\n        @include caret-down();\n      } @else if $direction == up {\n        @include caret-up();\n      } @else if $direction == end {\n        @include caret-end();\n      }\n    }\n\n    @if $direction == start {\n      &::after {\n        display: none;\n      }\n\n      &::before {\n        display: inline-block;\n        margin-right: $caret-spacing;\n        vertical-align: $caret-vertical-align;\n        content: \"\";\n        @include caret-start();\n      }\n    }\n\n    &:empty::after {\n      margin-left: 0;\n    }\n  }\n}\n// scss-docs-end caret-mixins\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_clearfix.scss",
    "content": "// scss-docs-start clearfix\n@mixin clearfix() {\n  &::after {\n    display: block;\n    clear: both;\n    content: \"\";\n  }\n}\n// scss-docs-end clearfix\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_color-scheme.scss",
    "content": "// scss-docs-start mixin-color-scheme\n@mixin color-scheme($name) {\n  @media (prefers-color-scheme: #{$name}) {\n    @content;\n  }\n}\n// scss-docs-end mixin-color-scheme\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_container.scss",
    "content": "// Container mixins\n\n@mixin make-container($gutter: $container-padding-x) {\n  width: 100%;\n  padding-right: var(--#{$variable-prefix}gutter-x, #{$gutter});\n  padding-left: var(--#{$variable-prefix}gutter-x, #{$gutter});\n  margin-right: auto;\n  margin-left: auto;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_deprecate.scss",
    "content": "// Deprecate mixin\n//\n// This mixin can be used to deprecate mixins or functions.\n// `$enable-deprecation-messages` is a global variable, `$ignore-warning` is a variable that can be passed to\n// some deprecated mixins to suppress the warning (for example if the mixin is still be used in the current version of Bootstrap)\n@mixin deprecate($name, $deprecate-version, $remove-version, $ignore-warning: false) {\n  @if ($enable-deprecation-messages != false and $ignore-warning != true) {\n    @warn \"#{$name} has been deprecated as of #{$deprecate-version}. It will be removed entirely in #{$remove-version}.\";\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_forms.scss",
    "content": "// This mixin uses an `if()` technique to be compatible with Dart Sass\n// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details\n\n// scss-docs-start form-validation-mixins\n@mixin form-validation-state-selector($state) {\n  @if ($state == \"valid\" or $state == \"invalid\") {\n    .was-validated #{if(&, \"&\", \"\")}:#{$state},\n    #{if(&, \"&\", \"\")}.is-#{$state} {\n      @content;\n    }\n  } @else {\n    #{if(&, \"&\", \"\")}.is-#{$state} {\n      @content;\n    }\n  }\n}\n\n@mixin form-validation-state(\n  $state,\n  $color,\n  $icon,\n  $tooltip-color: color-contrast($color),\n  $tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity),\n  $focus-box-shadow: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity)\n) {\n  .#{$state}-feedback {\n    display: none;\n    width: 100%;\n    margin-top: $form-feedback-margin-top;\n    @include font-size($form-feedback-font-size);\n    font-style: $form-feedback-font-style;\n    color: $color;\n  }\n\n  .#{$state}-tooltip {\n    position: absolute;\n    top: 100%;\n    z-index: 5;\n    display: none;\n    max-width: 100%; // Contain to parent when possible\n    padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;\n    margin-top: .1rem;\n    @include font-size($form-feedback-tooltip-font-size);\n    line-height: $form-feedback-tooltip-line-height;\n    color: $tooltip-color;\n    background-color: $tooltip-bg-color;\n    @include border-radius($form-feedback-tooltip-border-radius);\n  }\n\n  @include form-validation-state-selector($state) {\n    ~ .#{$state}-feedback,\n    ~ .#{$state}-tooltip {\n      display: block;\n    }\n  }\n\n  .form-control {\n    @include form-validation-state-selector($state) {\n      border-color: $color;\n\n      @if $enable-validation-icons {\n        padding-right: $input-height-inner;\n        background-image: escape-svg($icon);\n        background-repeat: no-repeat;\n        background-position: right $input-height-inner-quarter center;\n        background-size: $input-height-inner-half $input-height-inner-half;\n      }\n\n      &:focus {\n        border-color: $color;\n        box-shadow: $focus-box-shadow;\n      }\n    }\n  }\n\n  // stylelint-disable-next-line selector-no-qualifying-type\n  textarea.form-control {\n    @include form-validation-state-selector($state) {\n      @if $enable-validation-icons {\n        padding-right: $input-height-inner;\n        background-position: top $input-height-inner-quarter right $input-height-inner-quarter;\n      }\n    }\n  }\n\n  .form-select {\n    @include form-validation-state-selector($state) {\n      border-color: $color;\n\n      @if $enable-validation-icons {\n        &:not([multiple]):not([size]),\n        &:not([multiple])[size=\"1\"] {\n          padding-right: $form-select-feedback-icon-padding-end;\n          background-image: escape-svg($form-select-indicator), escape-svg($icon);\n          background-position: $form-select-bg-position, $form-select-feedback-icon-position;\n          background-size: $form-select-bg-size, $form-select-feedback-icon-size;\n        }\n      }\n\n      &:focus {\n        border-color: $color;\n        box-shadow: $focus-box-shadow;\n      }\n    }\n  }\n\n  .form-check-input {\n    @include form-validation-state-selector($state) {\n      border-color: $color;\n\n      &:checked {\n        background-color: $color;\n      }\n\n      &:focus {\n        box-shadow: $focus-box-shadow;\n      }\n\n      ~ .form-check-label {\n        color: $color;\n      }\n    }\n  }\n  .form-check-inline .form-check-input {\n    ~ .#{$state}-feedback {\n      margin-left: .5em;\n    }\n  }\n\n  .input-group .form-control,\n  .input-group .form-select {\n    @include form-validation-state-selector($state) {\n      @if $state == \"valid\" {\n        z-index: 1;\n      } @else if $state == \"invalid\" {\n        z-index: 2;\n      }\n      &:focus {\n        z-index: 3;\n      }\n    }\n  }\n}\n// scss-docs-end form-validation-mixins\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_gradients.scss",
    "content": "// Gradients\n\n// scss-docs-start gradient-bg-mixin\n@mixin gradient-bg($color: null) {\n  background-color: $color;\n\n  @if $enable-gradients {\n    background-image: var(--#{$variable-prefix}gradient);\n  }\n}\n// scss-docs-end gradient-bg-mixin\n\n// scss-docs-start gradient-mixins\n// Horizontal gradient, from left to right\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n@mixin gradient-x($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {\n  background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);\n}\n\n// Vertical gradient, from top to bottom\n//\n// Creates two color stops, start and end, by specifying a color and position for each color stop.\n@mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: null, $end-percent: null) {\n  background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);\n}\n\n@mixin gradient-directional($start-color: $gray-700, $end-color: $gray-800, $deg: 45deg) {\n  background-image: linear-gradient($deg, $start-color, $end-color);\n}\n\n@mixin gradient-x-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {\n  background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);\n}\n\n@mixin gradient-y-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {\n  background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);\n}\n\n@mixin gradient-radial($inner-color: $gray-700, $outer-color: $gray-800) {\n  background-image: radial-gradient(circle, $inner-color, $outer-color);\n}\n\n@mixin gradient-striped($color: rgba($white, .15), $angle: 45deg) {\n  background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);\n}\n// scss-docs-end gradient-mixins\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_grid.scss",
    "content": "// Grid system\n//\n// Generate semantic grid columns with these mixins.\n\n@mixin make-row($gutter: $grid-gutter-width) {\n  --#{$variable-prefix}gutter-x: #{$gutter};\n  --#{$variable-prefix}gutter-y: 0;\n  display: flex;\n  flex-wrap: wrap;\n  // TODO: Revisit calc order after https://github.com/react-bootstrap/react-bootstrap/issues/6039 is fixed\n  margin-top: calc(-1 * var(--#{$variable-prefix}gutter-y)); // stylelint-disable-line function-disallowed-list\n  margin-right: calc(-.5 * var(--#{$variable-prefix}gutter-x)); // stylelint-disable-line function-disallowed-list\n  margin-left: calc(-.5 * var(--#{$variable-prefix}gutter-x)); // stylelint-disable-line function-disallowed-list\n}\n\n@mixin make-col-ready($gutter: $grid-gutter-width) {\n  // Add box sizing if only the grid is loaded\n  box-sizing: if(variable-exists(include-column-box-sizing) and $include-column-box-sizing, border-box, null);\n  // Prevent columns from becoming too narrow when at smaller grid tiers by\n  // always setting `width: 100%;`. This works because we set the width\n  // later on to override this initial width.\n  flex-shrink: 0;\n  width: 100%;\n  max-width: 100%; // Prevent `.col-auto`, `.col` (& responsive variants) from breaking out the grid\n  padding-right: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list\n  padding-left: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list\n  margin-top: var(--#{$variable-prefix}gutter-y);\n}\n\n@mixin make-col($size: false, $columns: $grid-columns) {\n  @if $size {\n    flex: 0 0 auto;\n    width: percentage(divide($size, $columns));\n\n  } @else {\n    flex: 1 1 0;\n    max-width: 100%;\n  }\n}\n\n@mixin make-col-auto() {\n  flex: 0 0 auto;\n  width: auto;\n}\n\n@mixin make-col-offset($size, $columns: $grid-columns) {\n  $num: divide($size, $columns);\n  margin-left: if($num == 0, 0, percentage($num));\n}\n\n// Row columns\n//\n// Specify on a parent element(e.g., .row) to force immediate children into NN\n// numberof columns. Supports wrapping to new lines, but does not do a Masonry\n// style grid.\n@mixin row-cols($count) {\n  > * {\n    flex: 0 0 auto;\n    width: divide(100%, $count);\n  }\n}\n\n// Framework grid generation\n//\n// Used only by Bootstrap to generate the correct number of grid classes given\n// any value of `$grid-columns`.\n\n@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {\n  @each $breakpoint in map-keys($breakpoints) {\n    $infix: breakpoint-infix($breakpoint, $breakpoints);\n\n    @include media-breakpoint-up($breakpoint, $breakpoints) {\n      // Provide basic `.col-{bp}` classes for equal-width flexbox columns\n      .col#{$infix} {\n        flex: 1 0 0%; // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4\n      }\n\n      .row-cols#{$infix}-auto > * {\n        @include make-col-auto();\n      }\n\n      @if $grid-row-columns > 0 {\n        @for $i from 1 through $grid-row-columns {\n          .row-cols#{$infix}-#{$i} {\n            @include row-cols($i);\n          }\n        }\n      }\n\n      .col#{$infix}-auto {\n        @include make-col-auto();\n      }\n\n      @if $columns > 0 {\n        @for $i from 1 through $columns {\n          .col#{$infix}-#{$i} {\n            @include make-col($i, $columns);\n          }\n        }\n\n        // `$columns - 1` because offsetting by the width of an entire row isn't possible\n        @for $i from 0 through ($columns - 1) {\n          @if not ($infix == \"\" and $i == 0) { // Avoid emitting useless .offset-0\n            .offset#{$infix}-#{$i} {\n              @include make-col-offset($i, $columns);\n            }\n          }\n        }\n      }\n\n      // Gutters\n      //\n      // Make use of `.g-*`, `.gx-*` or `.gy-*` utilities to change spacing between the columns.\n      @each $key, $value in $gutters {\n        .g#{$infix}-#{$key},\n        .gx#{$infix}-#{$key} {\n          --#{$variable-prefix}gutter-x: #{$value};\n        }\n\n        .g#{$infix}-#{$key},\n        .gy#{$infix}-#{$key} {\n          --#{$variable-prefix}gutter-y: #{$value};\n        }\n      }\n    }\n  }\n}\n\n@mixin make-cssgrid($columns: $grid-columns, $breakpoints: $grid-breakpoints) {\n  @each $breakpoint in map-keys($breakpoints) {\n    $infix: breakpoint-infix($breakpoint, $breakpoints);\n\n    @include media-breakpoint-up($breakpoint, $breakpoints) {\n      @if $columns > 0 {\n        @for $i from 1 through $columns {\n          .g-col#{$infix}-#{$i} {\n            grid-column: auto / span $i;\n          }\n        }\n\n        // Start with `1` because `0` is and invalid value.\n        // Ends with `$columns - 1` because offsetting by the width of an entire row isn't possible.\n        @for $i from 1 through ($columns - 1) {\n          .g-start#{$infix}-#{$i} {\n            grid-column-start: $i;\n          }\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_image.scss",
    "content": "// Image Mixins\n// - Responsive image\n// - Retina image\n\n\n// Responsive image\n//\n// Keep images from scaling beyond the width of their parents.\n\n@mixin img-fluid {\n  // Part 1: Set a maximum relative to the parent\n  max-width: 100%;\n  // Part 2: Override the height to auto, otherwise images will be stretched\n  // when setting a width and height attribute on the img element.\n  height: auto;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_list-group.scss",
    "content": "// List Groups\n\n// scss-docs-start list-group-mixin\n@mixin list-group-item-variant($state, $background, $color) {\n  .list-group-item-#{$state} {\n    color: $color;\n    background-color: $background;\n\n    &.list-group-item-action {\n      &:hover,\n      &:focus {\n        color: $color;\n        background-color: shade-color($background, 10%);\n      }\n\n      &.active {\n        color: $white;\n        background-color: $color;\n        border-color: $color;\n      }\n    }\n  }\n}\n// scss-docs-end list-group-mixin\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_lists.scss",
    "content": "// Lists\n\n// Unstyled keeps list items block level, just removes default browser padding and list-style\n@mixin list-unstyled {\n  padding-left: 0;\n  list-style: none;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_pagination.scss",
    "content": "// Pagination\n\n// scss-docs-start pagination-mixin\n@mixin pagination-size($padding-y, $padding-x, $font-size, $border-radius) {\n  .page-link {\n    padding: $padding-y $padding-x;\n    @include font-size($font-size);\n  }\n\n  .page-item {\n    @if $pagination-margin-start == (-$pagination-border-width) {\n      &:first-child {\n        .page-link {\n          @include border-start-radius($border-radius);\n        }\n      }\n\n      &:last-child {\n        .page-link {\n          @include border-end-radius($border-radius);\n        }\n      }\n    } @else {\n      //Add border-radius to all pageLinks in case they have left margin\n      .page-link {\n        @include border-radius($border-radius);\n      }\n    }\n  }\n}\n// scss-docs-end pagination-mixin\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_reset-text.scss",
    "content": "@mixin reset-text {\n  font-family: $font-family-base;\n  // We deliberately do NOT reset font-size or overflow-wrap / word-wrap.\n  font-style: normal;\n  font-weight: $font-weight-normal;\n  line-height: $line-height-base;\n  text-align: left; // Fallback for where `start` is not supported\n  text-align: start;\n  text-decoration: none;\n  text-shadow: none;\n  text-transform: none;\n  letter-spacing: normal;\n  word-break: normal;\n  word-spacing: normal;\n  white-space: normal;\n  line-break: auto;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_resize.scss",
    "content": "// Resize anything\n\n@mixin resizable($direction) {\n  overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible`\n  resize: $direction; // Options: horizontal, vertical, both\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_table-variants.scss",
    "content": "// scss-docs-start table-variant\n@mixin table-variant($state, $background) {\n  .table-#{$state} {\n    $color: color-contrast(opaque($body-bg, $background));\n    $hover-bg: mix($color, $background, percentage($table-hover-bg-factor));\n    $striped-bg: mix($color, $background, percentage($table-striped-bg-factor));\n    $active-bg: mix($color, $background, percentage($table-active-bg-factor));\n\n    --#{$variable-prefix}table-bg: #{$background};\n    --#{$variable-prefix}table-striped-bg: #{$striped-bg};\n    --#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)};\n    --#{$variable-prefix}table-active-bg: #{$active-bg};\n    --#{$variable-prefix}table-active-color: #{color-contrast($active-bg)};\n    --#{$variable-prefix}table-hover-bg: #{$hover-bg};\n    --#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)};\n\n    color: $color;\n    border-color: mix($color, $background, percentage($table-border-factor));\n  }\n}\n// scss-docs-end table-variant\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_text-truncate.scss",
    "content": "// Text truncate\n// Requires inline-block or block for proper styling\n\n@mixin text-truncate() {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_transition.scss",
    "content": "// stylelint-disable property-disallowed-list\n@mixin transition($transition...) {\n  @if length($transition) == 0 {\n    $transition: $transition-base;\n  }\n\n  @if length($transition) > 1 {\n    @each $value in $transition {\n      @if $value == null or $value == none {\n        @warn \"The keyword 'none' or 'null' must be used as a single argument.\";\n      }\n    }\n  }\n\n  @if $enable-transitions {\n    @if nth($transition, 1) != null {\n      transition: $transition;\n    }\n\n    @if $enable-reduced-motion and nth($transition, 1) != null and nth($transition, 1) != none {\n      @media (prefers-reduced-motion: reduce) {\n        transition: none;\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_utilities.scss",
    "content": "// Utility generator\n// Used to generate utilities & print utilities\n@mixin generate-utility($utility, $infix, $is-rfs-media-query: false) {\n  $values: map-get($utility, values);\n\n  // If the values are a list or string, convert it into a map\n  @if type-of($values) == \"string\" or type-of(nth($values, 1)) != \"list\" {\n    $values: zip($values, $values);\n  }\n\n  @each $key, $value in $values {\n    $properties: map-get($utility, property);\n\n    // Multiple properties are possible, for example with vertical or horizontal margins or paddings\n    @if type-of($properties) == \"string\" {\n      $properties: append((), $properties);\n    }\n\n    // Use custom class if present\n    $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1));\n    $property-class: if($property-class == null, \"\", $property-class);\n\n    // State params to generate pseudo-classes\n    $state: if(map-has-key($utility, state), map-get($utility, state), ());\n\n    $infix: if($property-class == \"\" and str-slice($infix, 1, 1) == \"-\", str-slice($infix, 2), $infix);\n\n    // Don't prefix if value key is null (eg. with shadow class)\n    $property-class-modifier: if($key, if($property-class == \"\" and $infix == \"\", \"\", \"-\") + $key, \"\");\n\n    @if map-get($utility, rfs) {\n      // Inside the media query\n      @if $is-rfs-media-query {\n        $val: rfs-value($value);\n\n        // Do not render anything if fluid and non fluid values are the same\n        $value: if($val == rfs-fluid-value($value), null, $val);\n      }\n      @else {\n        $value: rfs-fluid-value($value);\n      }\n    }\n\n    $is-css-var: map-get($utility, css-var);\n    $is-local-vars: map-get($utility, local-vars);\n    $is-rtl: map-get($utility, rtl);\n\n    @if $value != null {\n      @if $is-rtl == false {\n        /* rtl:begin:remove */\n      }\n\n      @if $is-css-var {\n        .#{$property-class + $infix + $property-class-modifier} {\n          --#{$variable-prefix}#{$property-class}: #{$value};\n        }\n\n        @each $pseudo in $state {\n          .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {\n            --#{$variable-prefix}#{$property-class}: #{$value};\n          }\n        }\n      } @else {\n        .#{$property-class + $infix + $property-class-modifier} {\n          @each $property in $properties {\n            @if $is-local-vars {\n              @each $local-var, $value in $is-local-vars {\n                --#{$variable-prefix}#{$local-var}: #{$value};\n              }\n            }\n            #{$property}: $value if($enable-important-utilities, !important, null);\n          }\n        }\n\n        @each $pseudo in $state {\n          .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {\n            @each $property in $properties {\n              #{$property}: $value if($enable-important-utilities, !important, null);\n            }\n          }\n        }\n      }\n\n      @if $is-rtl == false {\n        /* rtl:end:remove */\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/mixins/_visually-hidden.scss",
    "content": "// stylelint-disable declaration-no-important\n\n// Hide content visually while keeping it accessible to assistive technologies\n//\n// See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/\n// See: https://kittygiraudel.com/2016/10/13/css-hide-and-seek/\n\n@mixin visually-hidden() {\n  position: absolute !important;\n  width: 1px !important;\n  height: 1px !important;\n  padding: 0 !important;\n  margin: -1px !important; // Fix for https://github.com/twbs/bootstrap/issues/25686\n  overflow: hidden !important;\n  clip: rect(0, 0, 0, 0) !important;\n  white-space: nowrap !important;\n  border: 0 !important;\n}\n\n// Use to only display content when it's focused, or one of its child elements is focused\n// (i.e. when focus is within the element/container that the class was applied to)\n//\n// Useful for \"Skip to main content\" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1\n\n@mixin visually-hidden-focusable() {\n  &:not(:focus):not(:focus-within) {\n    @include visually-hidden();\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/utilities/_api.scss",
    "content": "// Loop over each breakpoint\n@each $breakpoint in map-keys($grid-breakpoints) {\n\n  // Generate media query if needed\n  @include media-breakpoint-up($breakpoint) {\n    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n    // Loop over each utility property\n    @each $key, $utility in $utilities {\n      // The utility can be disabled with `false`, thus check if the utility is a map first\n      // Only proceed if responsive media queries are enabled or if it's the base media query\n      @if type-of($utility) == \"map\" and (map-get($utility, responsive) or $infix == \"\") {\n        @include generate-utility($utility, $infix);\n      }\n    }\n  }\n}\n\n// RFS rescaling\n@media (min-width: $rfs-mq-value) {\n  @each $breakpoint in map-keys($grid-breakpoints) {\n    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n    @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint) {\n      // Loop over each utility property\n      @each $key, $utility in $utilities {\n        // The utility can be disabled with `false`, thus check if the utility is a map first\n        // Only proceed if responsive media queries are enabled or if it's the base media query\n        @if type-of($utility) == \"map\" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == \"\") {\n          @include generate-utility($utility, $infix, true);\n        }\n      }\n    }\n  }\n}\n\n\n// Print utilities\n@media print {\n  @each $key, $utility in $utilities {\n    // The utility can be disabled with `false`, thus check if the utility is a map first\n    // Then check if the utility needs print styles\n    @if type-of($utility) == \"map\" and map-get($utility, print) == true {\n      @include generate-utility($utility, \"-print\");\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/bootstrap/vendor/_rfs.scss",
    "content": "// stylelint-disable property-blacklist, scss/dollar-variable-default\n\n// SCSS RFS mixin\n//\n// Automated responsive values for font sizes, paddings, margins and much more\n//\n// Licensed under MIT (https://github.com/twbs/rfs/blob/main/LICENSE)\n\n// Configuration\n\n// Base value\n$rfs-base-value: 1.25rem !default;\n$rfs-unit: rem !default;\n\n@if $rfs-unit != rem and $rfs-unit != px {\n  @error \"`#{$rfs-unit}` is not a valid unit for $rfs-unit. Use `px` or `rem`.\";\n}\n\n// Breakpoint at where values start decreasing if screen width is smaller\n$rfs-breakpoint: 1200px !default;\n$rfs-breakpoint-unit: px !default;\n\n@if $rfs-breakpoint-unit != px and $rfs-breakpoint-unit != em and $rfs-breakpoint-unit != rem {\n  @error \"`#{$rfs-breakpoint-unit}` is not a valid unit for $rfs-breakpoint-unit. Use `px`, `em` or `rem`.\";\n}\n\n// Resize values based on screen height and width\n$rfs-two-dimensional: false !default;\n\n// Factor of decrease\n$rfs-factor: 10 !default;\n\n@if type-of($rfs-factor) != number or $rfs-factor <= 1 {\n  @error \"`#{$rfs-factor}` is not a valid  $rfs-factor, it must be greater than 1.\";\n}\n\n// Mode. Possibilities: \"min-media-query\", \"max-media-query\"\n$rfs-mode: min-media-query !default;\n\n// Generate enable or disable classes. Possibilities: false, \"enable\" or \"disable\"\n$rfs-class: false !default;\n\n// 1 rem = $rfs-rem-value px\n$rfs-rem-value: 16 !default;\n\n// Safari iframe resize bug: https://github.com/twbs/rfs/issues/14\n$rfs-safari-iframe-resize-bug-fix: false !default;\n\n// Disable RFS by setting $enable-rfs to false\n$enable-rfs: true !default;\n\n// Cache $rfs-base-value unit\n$rfs-base-value-unit: unit($rfs-base-value);\n\n@function divide($dividend, $divisor, $precision: 10) {\n  $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);\n  $dividend: abs($dividend);\n  $divisor: abs($divisor);\n  @if $dividend == 0 {\n    @return 0;\n  }\n  @if $divisor == 0 {\n    @error \"Cannot divide by 0\";\n  }\n  $remainder: $dividend;\n  $result: 0;\n  $factor: 10;\n  @while ($remainder > 0 and $precision >= 0) {\n    $quotient: 0;\n    @while ($remainder >= $divisor) {\n      $remainder: $remainder - $divisor;\n      $quotient: $quotient + 1;\n    }\n    $result: $result * 10 + $quotient;\n    $factor: $factor * .1;\n    $remainder: $remainder * 10;\n    $precision: $precision - 1;\n    @if ($precision < 0 and $remainder >= $divisor * 5) {\n      $result: $result + 1;\n    }\n  }\n  $result: $result * $factor * $sign;\n  $dividend-unit: unit($dividend);\n  $divisor-unit: unit($divisor);\n  $unit-map: (\n    \"px\": 1px,\n    \"rem\": 1rem,\n    \"em\": 1em,\n    \"%\": 1%\n  );\n  @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {\n    $result: $result * map-get($unit-map, $dividend-unit);\n  }\n  @return $result;\n}\n\n// Remove px-unit from $rfs-base-value for calculations\n@if $rfs-base-value-unit == px {\n  $rfs-base-value: divide($rfs-base-value, $rfs-base-value * 0 + 1);\n}\n@else if $rfs-base-value-unit == rem {\n  $rfs-base-value: divide($rfs-base-value, divide($rfs-base-value * 0 + 1, $rfs-rem-value));\n}\n\n// Cache $rfs-breakpoint unit to prevent multiple calls\n$rfs-breakpoint-unit-cache: unit($rfs-breakpoint);\n\n// Remove unit from $rfs-breakpoint for calculations\n@if $rfs-breakpoint-unit-cache == px {\n  $rfs-breakpoint: divide($rfs-breakpoint, $rfs-breakpoint * 0 + 1);\n}\n@else if $rfs-breakpoint-unit-cache == rem or $rfs-breakpoint-unit-cache == \"em\" {\n  $rfs-breakpoint: divide($rfs-breakpoint, divide($rfs-breakpoint * 0 + 1, $rfs-rem-value));\n}\n\n// Calculate the media query value\n$rfs-mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{divide($rfs-breakpoint, $rfs-rem-value)}#{$rfs-breakpoint-unit});\n$rfs-mq-property-width: if($rfs-mode == max-media-query, max-width, min-width);\n$rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height);\n\n// Internal mixin used to determine which media query needs to be used\n@mixin _rfs-media-query {\n  @if $rfs-two-dimensional {\n    @if $rfs-mode == max-media-query {\n      @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}), (#{$rfs-mq-property-height}: #{$rfs-mq-value}) {\n        @content;\n      }\n    }\n    @else {\n      @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}) and (#{$rfs-mq-property-height}: #{$rfs-mq-value}) {\n        @content;\n      }\n    }\n  }\n  @else {\n    @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}) {\n      @content;\n    }\n  }\n}\n\n// Internal mixin that adds disable classes to the selector if needed.\n@mixin _rfs-rule {\n  @if $rfs-class == disable and $rfs-mode == max-media-query {\n    // Adding an extra class increases specificity, which prevents the media query to override the property\n    &,\n    .disable-rfs &,\n    &.disable-rfs {\n      @content;\n    }\n  }\n  @else if $rfs-class == enable and $rfs-mode == min-media-query {\n    .enable-rfs &,\n    &.enable-rfs {\n      @content;\n    }\n  }\n  @else {\n    @content;\n  }\n}\n\n// Internal mixin that adds enable classes to the selector if needed.\n@mixin _rfs-media-query-rule {\n\n  @if $rfs-class == enable {\n    @if $rfs-mode == min-media-query {\n      @content;\n    }\n\n    @include _rfs-media-query {\n      .enable-rfs &,\n      &.enable-rfs {\n        @content;\n      }\n    }\n  }\n  @else {\n    @if $rfs-class == disable and $rfs-mode == min-media-query {\n      .disable-rfs &,\n      &.disable-rfs {\n        @content;\n      }\n    }\n    @include _rfs-media-query {\n      @content;\n    }\n  }\n}\n\n// Helper function to get the formatted non-responsive value\n@function rfs-value($values) {\n  // Convert to list\n  $values: if(type-of($values) != list, ($values,), $values);\n\n  $val: '';\n\n  // Loop over each value and calculate value\n  @each $value in $values {\n    @if $value == 0 {\n      $val: $val + ' 0';\n    }\n    @else {\n      // Cache $value unit\n      $unit: if(type-of($value) == \"number\", unit($value), false);\n\n      @if $unit == px {\n        // Convert to rem if needed\n        $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $value * 0 + $rfs-rem-value)}rem, $value);\n      }\n      @else if $unit == rem {\n        // Convert to px if needed\n        $val: $val + ' ' + if($rfs-unit == px, #{divide($value, $value * 0 + 1) * $rfs-rem-value}px, $value);\n      }\n      @else {\n        // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value\n        $val: $val + ' ' + $value;\n      }\n    }\n  }\n\n  // Remove first space\n  @return unquote(str-slice($val, 2));\n}\n\n// Helper function to get the responsive value calculated by RFS\n@function rfs-fluid-value($values) {\n  // Convert to list\n  $values: if(type-of($values) != list, ($values,), $values);\n\n  $val: '';\n\n  // Loop over each value and calculate value\n  @each $value in $values {\n    @if $value == 0 {\n      $val: $val + ' 0';\n    }\n\n    @else {\n      // Cache $value unit\n      $unit: if(type-of($value) == \"number\", unit($value), false);\n\n      // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value\n      @if not $unit or $unit != px and $unit != rem {\n        $val: $val + ' ' + $value;\n      }\n\n      @else {\n        // Remove unit from $value for calculations\n        $value: divide($value, $value * 0 + if($unit == px, 1, divide(1, $rfs-rem-value)));\n\n        // Only add the media query if the value is greater than the minimum value\n        @if abs($value) <= $rfs-base-value or not $enable-rfs {\n          $val: $val + ' ' +  if($rfs-unit == rem, #{divide($value, $rfs-rem-value)}rem, #{$value}px);\n        }\n        @else {\n          // Calculate the minimum value\n          $value-min: $rfs-base-value + divide(abs($value) - $rfs-base-value, $rfs-factor);\n\n          // Calculate difference between $value and the minimum value\n          $value-diff: abs($value) - $value-min;\n\n          // Base value formatting\n          $min-width: if($rfs-unit == rem, #{divide($value-min, $rfs-rem-value)}rem, #{$value-min}px);\n\n          // Use negative value if needed\n          $min-width: if($value < 0, -$min-width, $min-width);\n\n          // Use `vmin` if two-dimensional is enabled\n          $variable-unit: if($rfs-two-dimensional, vmin, vw);\n\n          // Calculate the variable width between 0 and $rfs-breakpoint\n          $variable-width: #{divide($value-diff * 100, $rfs-breakpoint)}#{$variable-unit};\n\n          // Return the calculated value\n          $val: $val + ' calc(' + $min-width + if($value < 0, ' - ', ' + ') + $variable-width + ')';\n        }\n      }\n    }\n  }\n\n  // Remove first space\n  @return unquote(str-slice($val, 2));\n}\n\n// RFS mixin\n@mixin rfs($values, $property: font-size) {\n  @if $values != null {\n    $val: rfs-value($values);\n    $fluidVal: rfs-fluid-value($values);\n\n    // Do not print the media query if responsive & non-responsive values are the same\n    @if $val == $fluidVal {\n      #{$property}: $val;\n    }\n    @else {\n      @include _rfs-rule {\n        #{$property}: if($rfs-mode == max-media-query, $val, $fluidVal);\n\n        // Include safari iframe resize fix if needed\n        min-width: if($rfs-safari-iframe-resize-bug-fix, (0 * 1vw), null);\n      }\n\n      @include _rfs-media-query-rule {\n        #{$property}: if($rfs-mode == max-media-query, $fluidVal, $val);\n      }\n    }\n  }\n}\n\n// Shorthand helper mixins\n@mixin font-size($value) {\n  @include rfs($value);\n}\n\n@mixin padding($value) {\n  @include rfs($value, padding);\n}\n\n@mixin padding-top($value) {\n  @include rfs($value, padding-top);\n}\n\n@mixin padding-right($value) {\n  @include rfs($value, padding-right);\n}\n\n@mixin padding-bottom($value) {\n  @include rfs($value, padding-bottom);\n}\n\n@mixin padding-left($value) {\n  @include rfs($value, padding-left);\n}\n\n@mixin margin($value) {\n  @include rfs($value, margin);\n}\n\n@mixin margin-top($value) {\n  @include rfs($value, margin-top);\n}\n\n@mixin margin-right($value) {\n  @include rfs($value, margin-right);\n}\n\n@mixin margin-bottom($value) {\n  @include rfs($value, margin-bottom);\n}\n\n@mixin margin-left($value) {\n  @include rfs($value, margin-left);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/cards/card-background.scss",
    "content": ".card {\n  &.card-background {\n    align-items: $card-bg-align-items;\n\n    .full-background {\n      background-position: $card-full-bg-bg-position;\n      background-size: $card-full-bg-bg-size;\n      margin-bottom: $card-full-bg-mb;\n      width: $card-full-bg-width;\n      height: $card-full-bg-height;\n      position: $card-full-bg-position;\n      border-radius: $card-border-radius;\n    }\n\n    .card-body {\n      color: $white;\n      position: $card-bg-body-position;\n      z-index: $card-bg-body-z-index;\n\n      .content-center,\n      .content-left {\n        min-height: $card-bg-content-min-height;\n        max-width: $card-bg-content-max-width;\n        padding-top: $card-bg-content-pt;\n        padding-bottom: $card-bg-content-pb;\n      }\n      .content-center {\n        text-align: center;\n      }\n      &.body-left {\n        width: $card-bg-body-left-width;\n      }\n\n      .author {\n        .name {\n          span,\n          .stats {\n            color: $white;\n          }\n        }\n      }\n    }\n\n    &:after {\n      position: $card-bg-filter-position;\n      top: $card-bg-filter-top;\n      bottom: $card-bg-filter-bottom;\n      left: $card-bg-filter-left;\n      height: $card-bg-filter-height;\n      width: $card-bg-filter-width;\n      z-index: $card-bg-filter-z-index;\n      display: $card-bg-filter-display;\n      content: $card-bg-filter-content;\n      background: $card-bg-filter-bg;\n      border-radius: $card-border-radius;\n    }\n\n    @each $name, $val in $theme-gradient-colors {\n      &.card-background-mask-#{$name} {\n        &:before {\n          background: $card-bg-filter-mask-bg;\n        }\n\n        &:after {\n          @include gradient-directional(nth($val, 1) 0%, nth($val, -1) 100%, $deg: 195deg);\n          opacity: .85;\n        }\n      }\n    }\n\n    .card-category {\n      font-size: $font-size-sm;\n      font-weight: $font-weight-bold;\n    }\n\n    .card-description {\n      margin-top: $card-bg-description-margin;\n      margin-bottom: $card-bg-description-margin;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/cards/card-blog.scss",
    "content": ".card {\n  &.card-blog {\n    .card-image {\n      box-shadow: $box-shadow;\n\n      .img {\n        width: 100%;\n      }\n    }\n\n    .card-title {\n      a {\n        color: $dark;\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/cards/card-horizontal.scss",
    "content": ".card {\n  &.card-horizontal {\n    box-shadow: none;\n\n    .card-image {\n      border-radius: $card-border-radius;\n\n      .img {\n        width: 100%;\n        border-radius: $card-border-radius;\n      }\n    }\n\n    .card-body {\n      .card-title {\n        font-size: $h4-font-size;\n\n        a {\n          color: $dark;\n        }\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/cards/card-pricing.scss",
    "content": ".card {\n  &.card-pricing {\n    .card-body {\n      padding: $card-pricing-body-padding;\n    }\n    .table {\n      tr {\n        border-image: $card-pricing-border-color;\n      }\n      td {\n        .badge {\n          padding: $card-pricing-badge-padding;\n          font-size: $card-pricing-badge-font-size;\n          position: $card-pricing-badge-position;\n          top: $card-pricing-badge-top;\n        }\n      }\n    }\n    &[data-feature=\"icon\"] {\n\n      .icon {\n        height: $card-pricing-icon-height;\n        width: $card-pricing-icon-width;\n        position: $card-pricing-icon-position;\n        top: $card-pricing-icon-top;\n        left: 0;\n        right: 0;\n\n        i {\n          color: $white;\n          padding: $card-pricing-i-padding;\n        }\n      }\n    }\n\n    .plans {\n      i {\n        font-size: $card-pricing-icon-font-size;\n      }\n      .card-category {\n        text-transform: uppercase;\n      }\n    }\n    .icon-lg i {\n      font-size: $card-pricing-icon-lg-font-size;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/cards/card-profile.scss",
    "content": ".card {\n  &.card-profile {\n    .card-body {\n      padding: $card-profile-body-padding;\n    }\n\n    .card-avatar {\n      margin: $card-profile-avatar-margin;\n\n      .img {\n        margin-top: $card-profile-img-mt;\n        border-radius: $card-profile-img-radius;\n        width: $card-profile-img-width;\n      }\n    }\n\n    p.lead {\n      font-weight: $font-weight-bold;\n      font-size: $h6-font-size;\n      line-height: $card-profile-p-line-height;\n    }\n    .table {\n      td {\n        font-weight: $font-weight-light;\n        font-size: $font-size-base;\n      }\n    }\n\n    .card-before {\n      &:before {\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        width: 100%;\n        height: 50%;\n        display: block;\n        z-index: 0;\n        content: '';\n        transition: opacity .65s cubic-bezier(.05,.2,.1,1);\n      }\n\n      &.mask-primary:before {\n        background: linear-gradient(to bottom,rgba(15,15,15,0),$primary 100%);\n      }\n      &.mask-info:before {\n        background: linear-gradient(to bottom,rgba(15,15,15,0),$info 100%);\n      }\n      &.mask-warning:before {\n        background: linear-gradient(to bottom,rgba(15,15,15,0),$warning-gradient-state 100%);\n      }\n      &.mask-danger:before {\n        background: linear-gradient(to bottom,rgba(15,15,15,0),$danger 100%);\n      }\n      &.mask-success:before {\n        background: linear-gradient(to bottom,rgba(15,15,15,0),$success 100%);\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/cards/card-rotate.scss",
    "content": ".rotating-card-container {\n  @include perspective(800px);\n\n  .card-rotate {\n    background: transparent;\n    box-shadow: none;\n\n    &:after {\n      display: none;\n    }\n  }\n\n  .card {\n    @include transitions(0.8s, cubic-bezier(0.34, 1.45, 0.7, 1));\n    @include transform-style(preserve-3d);\n    position: relative;\n\n    .back,\n    .front {\n      @include backface-visibility(hidden);\n      position: absolute;\n      background-color: $white;\n      border-radius: $border-radius-lg;\n      top: 0;\n      left: 0;\n      justify-content: center;\n      align-content: center;\n      display: -webkit-flex;\n      display: -moz-flex;\n      display: -ms-flexbox;\n      display: -o-flex;\n      display: flex;\n      -moz-flex-direction: column;\n      -ms-flex-direction: column;\n      -o-flex-direction: column;\n      flex-direction: column;\n\n      .card-body {\n        justify-content: center;\n        align-content: center;\n        display: -webkit-flex;\n        display: -moz-flex;\n        display: -ms-flexbox;\n        display: -o-flex;\n        display: flex;\n        -moz-flex-direction: column;\n        -ms-flex-direction: column;\n        -o-flex-direction: column;\n        flex-direction: column;\n      }\n\n      &:after {\n        position: absolute;\n        z-index: 1;\n        width: 100%;\n        height: 100%;\n        display: block;\n        left: 0;\n        top: 0;\n        content: \"\";\n        border-radius: $border-radius-lg;\n        background-image: $text-gradient-bg-primary;\n        opacity: .85;\n      }\n    }\n\n    .front {\n      z-index: 2;\n      position: relative;\n    }\n\n    .back {\n      @include rotateY-180();\n      z-index: 5;\n      text-align: center;\n      width: 100%;\n      height: 100%;\n\n      &.back-background {\n        .card-body {\n          position: relative;\n          z-index: 2;\n        }\n      }\n\n      .card-footer {\n        .btn {\n          margin: 0;\n        }\n      }\n\n      .card-body {\n        padding-left: 15px;\n        padding-right: 15px;\n      }\n    }\n  }\n\n  &:not(.manual-flip):hover {\n    .card {\n      @include rotateY-180();\n    }\n  }\n\n  &.hover.manual-flip {\n    .card {\n      @include rotateY-180();\n    }\n  }\n\n  .card-profile & {\n    .front {\n      text-align: left;\n    }\n  }\n}\n\n.back-background {\n  .card-body {\n    min-height: auto;\n    padding-top: 15px;\n    padding-bottom: 15px;\n  }\n}\n\n/*       Fix bug for IE      */\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n  .rotating-card-container .card .back,\n  .rotating-card-container .card .front {\n    -ms-backface-visibility: visible;\n    backface-visibility: visible;\n  }\n\n  .rotating-card-container .card .back {\n    visibility: hidden;\n    transition: visibility 0.3s cubic-bezier(0.34, 1.45, 0.7, 1);\n  }\n\n  .rotating-card-container .card .front {\n    z-index: 4;\n  }\n\n  .rotating-card-container.manual-flip.hover .card .back,\n  .rotating-card-container:not(.manual-flip):hover .card .back {\n    z-index: 5;\n    visibility: visible;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/custom/_styles.scss",
    "content": ""
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/custom/_variables.scss",
    "content": ""
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/forms/_form-check.scss",
    "content": ".form-check:not(.form-switch) .form-check-input {\n  float: initial !important;\n  margin-left: auto !important;\n\n  &[type=\"checkbox\"],\n  &[type=\"radio\"] {\n    border: 1px solid darken($gray-200, 10%);\n    margin-top: $form-text-margin-top;\n    position: relative;\n\n    &:checked {\n      border-color: $primary;\n    }\n  }\n\n  &[type=\"checkbox\"] {\n    background-image: none;\n    &:after {\n      transition: opacity $form-check-transition-time ease-in-out;\n      font-family: \"FontAwesome\";\n      content: \"\\f00c\";\n      width: 100%;\n      height: 100%;\n      color: $form-check-input-checked-color;\n      position: absolute;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      font-size: $font-size-sm - .205;\n      opacity: 0;\n    }\n\n    &:checked{\n      background: $primary;\n      &:after {\n        opacity: 1;\n      }\n    }\n  }\n\n  &[type=\"radio\"] {\n    transition: border 0s;\n    background: transparent;\n\n    &:after {\n      transition: opacity $form-check-transition-time ease-in-out;\n      content: \"\";\n      position: absolute;\n      width: $form-check-radio-after-width;\n      height: $form-check-radio-after-width;\n      border-radius: 50%;\n      background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$variable-prefix}gradient);;\n      opacity: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      margin: auto;\n    }\n\n    &:checked {\n      padding: 6px;\n    }\n\n    &:checked:after {\n      opacity: 1;\n    }\n\n    &:active{\n      box-shadow: $form-check-radio-after-shadow;\n      border-radius: $border-radius-pill;\n      transition: $form-check-radio-transition;\n    }\n  }\n}\n\n.form-check-label,\n.form-check-input[type=\"checkbox\"] {\n  cursor: pointer;\n}\n\n.form-check-label{\n  font-size:$font-size-sm;\n  font-weight: $font-weight-normal;\n}\n\n.form-check-input{\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/forms/_form-select.scss",
    "content": ".form-select {\n  transition: $input-transition;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/forms/_form-switch.scss",
    "content": ".form-switch{\n  .form-check-input{\n    position: relative;\n    background-color: $form-switch-bg-color;\n    height: $form-switch-height;\n    width: $form-switch-width;\n\n    &:after {\n      transition: transform $form-check-transition-time ease-in-out, background-color $form-check-transition-time ease-in-out;\n      content: \"\";\n      width: $form-switch-check-after-width;\n      height: $form-switch-check-after-width;\n      border-radius: 50%;\n      border: 1px solid $form-switch-check-after-border-color;\n      position: absolute;\n      background-color: $white;\n      transform: translateX($form-switch-translate-x-start);\n      box-shadow: $form-switch-round-box-shadow;\n      top: $form-switch-check-top;\n      left: $form-switch-check-left;\n    }\n\n    &:checked:after {\n      transform: translateX($form-switch-translate-x-end);\n      border-color: $dark-gradient;\n    }\n\n    &:checked {\n      border-color: $dark-gradient;\n      background-color: $dark-gradient;\n      &:active{\n        &:after{\n          box-shadow: $form-switch-check-active-checked-after-shadow;\n        }\n      }\n    }\n    &:active{\n      &:after{\n        box-shadow: $form-switch-check-active-after-shadow;\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/forms/_forms.scss",
    "content": "@import 'input-group';\n@import 'form-check';\n@import 'form-switch';\n@import 'form-select';\n@import 'labels';\n@import 'inputs';\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/forms/_input-group.scss",
    "content": ".input-group {\n  @include border-radius(0, 0);\n\n  &:not(.has-validation) {\n    > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),\n    > .dropdown-toggle:nth-last-child(n + 3) {\n      @include border-end-radius(inherit);\n    }\n  }\n\n  &.has-validation {\n    > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),\n    > .dropdown-toggle:nth-last-child(n + 4) {\n      @include border-end-radius(inherit);\n    }\n  }\n\n  &,\n  .input-group-text {\n    transition: $input-transition;\n    border: none;\n  }\n\n  & > :not(:first-child):not(.dropdown-menu) {\n    margin-left: 2px;\n  }\n\n  label {\n    transition: $transition-material;\n  }\n\n  &.input-group-dynamic,\n  &.input-group-static {\n    .form-control {\n      background: $input-background;\n      background-size: $input-background-size;\n      transition: $input-transition;\n\n  \t\t&:not(:first-child) {\n  \t    border-left: 0;\n  \t    padding-left: 0;\n  \t\t}\n  \t\t&:not(:last-child) {\n  \t\t\tborder-right: 0;\n  \t\t\tpadding-right: 0;\n  \t\t}\n\n      & + .input-group-text {\n        border-left: 0;\n        border-right: $input-border-width solid $input-border-color;\n      }\n\n      &,\n      &:focus{\n        background-image: $input-background-image;\n        border-radius: 0 !important;\n      }\n\n      &:focus{\n        background-size: $input-background-size-focus;\n      }\n\n      &[disabled]{\n        cursor: not-allowed;\n        background-image: $input-background-image-disabled !important;\n      }\n  \t}\n\n    .input-group-text {\n      border-right: 0;\n    }\n\n    &.is-focused,\n    &.is-filled {\n      .form-label {\n        font-size: $form-label-font-size-focused !important;\n      }\n    }\n\n    &.is-focused {\n      .form-label {\n        top: $form-label-top-focused;\n      }\n      label {\n        color: $primary;\n      }\n      &.is-valid{\n        label{\n          color: $success;\n        }\n\n        .form-control{\n          &,\n          &:focus{\n            background-image: $input-background-image-valid;\n            border-radius: 0 !important;\n          }\n        }\n      }\n      &.is-invalid{\n        label{\n          color: $danger;\n        }\n\n        .form-control{\n          &,\n          &:focus{\n            background-image: $input-background-image-invalid;\n            border-radius: 0 !important;\n          }\n        }\n      }\n    }\n\n    &.is-valid{\n      .form-control{\n        &,\n        &:focus{\n          background-image: $input-background-image-valid;\n          border-radius: 0 !important;\n        }\n      }\n    }\n\n    &.is-invalid{\n      .form-control{\n        &,\n        &:focus{\n          background-image: $input-background-image-invalid;\n          border-radius: 0 !important;\n        }\n      }\n    }\n\n    &.is-filled.is-focused,\n    &.is-filled {\n      .form-label {\n        top: $form-label-top-focused-filled;\n      }\n    }\n  }\n\n  &.input-group-outline {\n    .form-control {\n      background: none;\n      border: $input-border-width solid $input-border-color;\n      border-radius: $input-border-radius;\n      border-top-left-radius: $border-radius-md !important;\n      border-bottom-left-radius: $border-radius-md !important;\n      padding: $form-control-outline-padding !important;\n      line-height: 1.3 !important;\n\n      &.form-control-lg {\n        padding: $input-padding-y-lg $input-padding-x-lg !important;\n      }\n\n      &.form-control-sm{\n        padding: $input-padding-y-sm $input-padding-x-sm !important;\n      }\n\n      &[disabled]{\n        cursor: not-allowed;\n        border-style: dashed;\n      }\n    }\n\n    .form-label {\n      display: flex;\n      line-height: $form-label-outline-line-height !important;\n      top: -$form-label-outline-top;\n      margin-bottom: 0;\n\n      &:before {\n        content: \"\";\n        margin-right: 4px;\n        border-left: solid 1px transparent;\n        border-radius: 4px 0;\n      }\n\n      &:after {\n        content: \"\";\n        flex-grow: 1;\n        margin-left: 4px;\n        border-right: solid 1px transparent;\n        border-radius: 0 5px;\n      }\n\n      &:before,\n      &:after {\n        content: \"\";\n        border-top: solid 1px;\n        border-top-color: $input-border-color;\n        pointer-events: none;\n        margin-top: $form-label-outline-top;\n        box-sizing: border-box;\n        display: block;\n        height: $form-label-outline-after-height;\n        width: $form-label-outline-after-width;\n        border-width: $form-label-outline-after-border-width;\n        border-color: transparent;\n      }\n    }\n\n    &.is-focused,\n    &.is-filled {\n      .form-label + .form-control {\n        border-color: $primary !important;\n        border-top-color: transparent !important;\n        box-shadow: inset 1px 0 $primary, inset -1px 0 $primary, inset 0 -1px $primary;\n      }\n\n      .form-label {\n        width: 100%;\n        height: 100%;\n        font-size: $form-label-font-size-focused !important;\n        color: $primary;\n        display: flex;\n        line-height: $line-height-sm !important;\n\n        &:before,\n        &:after {\n          opacity: 1;\n        }\n\n        &:before,\n        &:after {\n          border-top-color: $primary;\n          box-shadow: inset 0 1px $primary;\n        }\n      }\n    }\n\n    &.is-valid {\n      .form-control {\n        background-image: escape-svg($form-feedback-icon-valid);\n        background-repeat: no-repeat;\n        background-position: right $input-height-inner-quarter center;\n        background-size: $input-height-inner-half $input-height-inner-half;\n      }\n      &.is-focused,\n      &.is-filled {\n        .form-label + .form-control {\n          border-color: $success !important;\n          box-shadow: inset 1px 0 $success, inset -1px 0 $success, inset 0 -1px $success;\n          border-top-color: transparent !important;\n        }\n        .form-label {\n          color: $success;\n\n          &:before,\n          &:after {\n            border-top-color: $success;\n            box-shadow: inset 0 1px $success;\n          }\n        }\n      }\n    }\n\n    &.is-invalid {\n      .form-control {\n        background-image: escape-svg($form-feedback-icon-invalid);\n        background-repeat: no-repeat;\n        background-position: right $input-height-inner-quarter center;\n        background-size: $input-height-inner-half $input-height-inner-half;\n      }\n      &.is-focused,\n      &.is-filled {\n        .form-label + .form-control {\n          border-color: $danger !important;\n          box-shadow: inset 1px 0 $danger, inset -1px 0 $danger, inset 0 -1px $danger;\n          border-top-color: transparent !important;\n        }\n        .form-label {\n          color: $danger;\n\n          &:before,\n          &:after {\n            border-top-color: $danger;\n            box-shadow: inset 0 1px $danger;\n          }\n        }\n      }\n    }\n  }\n\n  &.input-group-outline,\n  &.input-group-dynamic,\n  &.input-group-static {\n    &.input-group-sm{\n      .form-label,\n      label{\n        font-size: $input-group-sm-font-size;\n      }\n    }\n    &.input-group-lg{\n      .form-label,\n      label{\n        font-size: $input-group-lg-font-size;\n      }\n    }\n  }\n\n  &.input-group-static {\n    .form-control {\n      width: 100%;\n    }\n    label {\n      margin-left: 0;\n      margin-bottom: 0;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/forms/_inputs.scss",
    "content": ".form-control {\n  border: none;\n\n  &.is-invalid {\n    border: $input-border-width solid $input-border-color;\n    padding: $form-control-outline-padding;\n    line-height: 1.3 !important;\n\n    &:focus {\n      box-shadow: 0 0 0 2px rgba($form-feedback-invalid-color, .6);\n    }\n  }\n\n  &.is-valid {\n    border: $input-border-width solid $input-border-color;\n    padding: $form-control-outline-padding;\n    line-height: 1.3 !important;\n\n    &:focus {\n      box-shadow: 0 0 0 2px rgba($form-feedback-valid-color, .65);\n    }\n  }\n\n  &[disabled] {\n    padding: $form-control-outline-padding;\n    line-height: 1.45 !important;\n  }\n}\n\n.input-group {\n  .input-group-text {\n    position: absolute;\n    padding: .75rem 0;\n    right: 0;\n    border-right: 0 !important;\n\n    i {\n      color: $gray-600;\n    }\n  }\n\n  &.input-group-static {\n    .input-group-text {\n      bottom: 0;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/forms/_labels.scss",
    "content": "//\n// Labels\n//\n\nlabel,\n.form-label {\n  font-size: $form-label-font-size;\n  font-weight: $form-label-font-weight;\n  margin-bottom: $form-label-margin-bottom;\n  color: $form-label-color;\n  margin-left: $form-label-margin-left;\n}\n\n.input-group{\n  .form-label{\n    position: $form-label-position;\n    top: $form-label-top;\n    margin-left: 0;\n    transition: $form-label-transition;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/mixins/_badge.scss",
    "content": "@mixin badge-variant($bg) {\n\tcolor: saturate(darken($bg, 10%), 10);\n    background-color: lighten($bg, 32%);\n\n  \t&[href] {\n\t    @include hover-focus {\n\t        color: color-yiq($bg);\n\t        text-decoration: none;\n\t        background-color: darken($bg, 12%);\n\t    }\n\t}\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/mixins/_buttons.scss",
    "content": "@mixin colored-shadows($value){\n  // new box shadow optimized for Tablets and Phones\n  box-shadow: 0 3px 3px 0 rgba($value, .15),\n              0 3px 1px -2px rgba($value, .2),\n              0 1px 5px 0 rgba($value, .15);\n}\n\n@mixin colored-shadows-hover($value){\n    box-shadow: 0 14px 26px -12px rgba($value, .4),\n                0 4px 23px 0 rgba($value, .15),\n                0 8px 10px -5px rgba($value, .2);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/mixins/_colored-shadows.scss",
    "content": "@mixin shadow-big-color($color){\n  // new box shadow optimized for Tablets and Phones\n  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, .14),\n              0 7px 10px -5px rgba($color, 0.4)\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/mixins/_hover.scss",
    "content": "\n@mixin hover() {\n  &:hover { @content; }\n}\n\n@mixin hover-focus() {\n  &:hover,\n  &:focus {\n    @content;\n  }\n}\n\n@mixin plain-hover-focus() {\n  &,\n  &:hover,\n  &:focus {\n    @content;\n  }\n}\n\n@mixin hover-focus-active() {\n  &:hover,\n  &:focus,\n  &:active {\n    @content;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/mixins/_social-buttons.scss",
    "content": "// for social buttons\n@mixin social-buttons-color ($color, $state-color) {\n  background-color: $color;\n  color: $white;\n\n  &:focus,\n  &:hover {\n    background-color: $state-color;\n    color: $white;\n  }\n  &:active,\n  &:focus,\n  &:active:focus {\n    box-shadow: none;\n  }\n\n  &.btn-simple {\n    color: $state-color;\n    background-color: transparent;\n    background-image: none !important;\n    box-shadow: none;\n    border: none;\n\n    &:hover,\n    &:focus,\n    &:hover:focus,\n    &:active,\n    &:hover:focus:active {\n      color: $state-color;\n      background: transparent !important;\n      box-shadow: none !important;\n    }\n  }\n\n\n  &.btn-neutral {\n    color: $color;\n    background-color: $white;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: $state-color;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/mixins/_vendor.scss",
    "content": "@mixin transform-translate-y($value) {\n  -webkit-transform: translate3d(0, $value, 0);\n  -moz-transform: translate3d(0, $value, 0);\n  -o-transform: translate3d(0, $value, 0);\n  -ms-transform: translate3d(0, $value, 0);\n  transform: translate3d(0, $value, 0);\n}\n@mixin perspective($value) {\n  -webkit-perspective: $value;\n  -moz-perspective: $value;\n  -o-perspective: $value;\n  -ms-perspective: $value;\n  perspective: $value;\n}\n@mixin transitions($time, $type) {\n  -webkit-transition: all $time $type;\n  -moz-transition: all $time $type;\n  -o-transition: all $time $type;\n  -ms-transition: all $time $type;\n  transition: all $time $type;\n}\n@mixin transitions-property($property, $time, $type) {\n  -webkit-transition: $property $time $type;\n  -moz-transition: $property $time $type;\n  -o-transition: $property $time $type;\n  -ms-transition: $property $time $type;\n  transition: $property $time $type;\n}\n@mixin transform-style($type){\n  -webkit-transform-style: $type;\n  -moz-transform-style: $type;\n  -o-transform-style: $type;\n  -ms-transform-style: $type;\n  transform-style: $type;\n}\n\n@mixin backface-visibility($type){\n    -webkit-backface-visibility: $type;\n    -moz-backface-visibility: $type;\n    -o-backface-visibility: $type;\n    -ms-backface-visibility: $type;\n        backface-visibility: $type;\n}\n\n@mixin rotateY-180() {\n    -webkit-transform: rotateY( 180deg );\n    -moz-transform: rotateY( 180deg );\n    -o-transform: rotateY( 180deg );\n    -ms-transform: rotateY(180deg);\n    transform: rotateY( 180deg );\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/mixins/mixins.scss",
    "content": "@import \"badge\";\n@import \"buttons\";\n@import \"hover\";\n@import \"colored-shadows\";\n@import \"social-buttons\";\n@import \"vendor\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/free/_flatpickr.scss",
    "content": ".flatpickr-calendar {\n  background: transparent;\n  opacity: 0;\n  display: none;\n  text-align: center;\n  visibility: hidden;\n  padding: 0;\n  -webkit-animation: none;\n          animation: none;\n  direction: ltr;\n  border: 0;\n  font-size: 14px;\n  line-height: 24px;\n  border-radius: 0.75rem;\n  position: absolute;\n  width: 307.875px;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  -ms-touch-action: manipulation;\n      touch-action: manipulation;\n  background: #fff;\n  -webkit-box-shadow: $box-shadow-lg;\n  transform: $dropdown-transform;\n}\n.flatpickr-calendar.open,\n.flatpickr-calendar.inline {\n  opacity: 1;\n  max-height: 640px;\n  visibility: visible;\n  transform: $dropdown-transform-show;\n}\n.flatpickr-calendar.open {\n  display: inline-block;\n  z-index: 99999;\n}\n.flatpickr-calendar.animate.open {\n  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);\n          animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.flatpickr-calendar.inline {\n  display: block;\n  position: relative;\n  top: 2px;\n}\n.flatpickr-calendar.static {\n  position: absolute;\n  top: calc(100% + 2px);\n}\n.flatpickr-calendar.static.open {\n  z-index: 999;\n  display: block;\n}\n.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {\n  -webkit-box-shadow: none !important;\n          box-shadow: none !important;\n}\n.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {\n  -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;\n          box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;\n}\n.flatpickr-calendar .hasWeeks .dayContainer,\n.flatpickr-calendar .hasTime .dayContainer {\n  border-bottom: 0;\n  border-bottom-right-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.flatpickr-calendar .hasWeeks .dayContainer {\n  border-left: 0;\n}\n.flatpickr-calendar.hasTime .flatpickr-time {\n  height: 40px;\n  border-top: 1px solid #e6e6e6;\n}\n.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {\n  height: auto;\n}\n.flatpickr-calendar:before,\n.flatpickr-calendar:after {\n  position: absolute;\n  display: block;\n  pointer-events: none;\n  border: solid transparent;\n  content: '';\n  height: 0;\n  width: 0;\n  left: 22px;\n}\n.flatpickr-calendar.rightMost:before,\n.flatpickr-calendar.arrowRight:before,\n.flatpickr-calendar.rightMost:after,\n.flatpickr-calendar.arrowRight:after {\n  left: auto;\n  right: 22px;\n}\n.flatpickr-calendar.arrowCenter:before,\n.flatpickr-calendar.arrowCenter:after {\n  left: 50%;\n  right: 50%;\n}\n.flatpickr-calendar:before {\n  border-width: 5px;\n  margin: 0 -5px;\n}\n.flatpickr-calendar:after {\n  border-width: 4px;\n  margin: 0 -4px;\n}\n.flatpickr-calendar.arrowTop:before,\n.flatpickr-calendar.arrowTop:after {\n  bottom: 100%;\n}\n.flatpickr-calendar.arrowTop:before {\n  border-bottom-color: #fff;\n}\n.flatpickr-calendar.arrowTop:after {\n  border-bottom-color: #fff;\n}\n.flatpickr-calendar.arrowBottom:before,\n.flatpickr-calendar.arrowBottom:after {\n  top: 100%;\n}\n.flatpickr-calendar.arrowBottom:before {\n  border-top-color: #e6e6e6;\n}\n.flatpickr-calendar.arrowBottom:after {\n  border-top-color: #fff;\n}\n.flatpickr-calendar:focus {\n  outline: 0;\n}\n.flatpickr-wrapper {\n  position: relative;\n  display: inline-block;\n}\n.flatpickr-months {\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n}\n.flatpickr-months .flatpickr-month {\n  background: transparent;\n  color: #344767;\n  fill: rgba(0,0,0,0.8);\n  height: 34px;\n  line-height: 1;\n  text-align: center;\n  position: relative;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  overflow: hidden;\n  -webkit-box-flex: 1;\n  -webkit-flex: 1;\n      -ms-flex: 1;\n          flex: 1;\n}\n.flatpickr-months .flatpickr-prev-month,\n.flatpickr-months .flatpickr-next-month {\n  text-decoration: none;\n  cursor: pointer;\n  position: absolute;\n  top: 0;\n  height: 34px;\n  padding: 10px;\n  z-index: 3;\n  color: rgba(0,0,0,0.9);\n  fill: rgba(0,0,0,0.9);\n}\n.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,\n.flatpickr-months .flatpickr-next-month.flatpickr-disabled {\n  display: none;\n}\n.flatpickr-months .flatpickr-prev-month i,\n.flatpickr-months .flatpickr-next-month i {\n  position: relative;\n}\n.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,\n.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {\n/*\n      /*rtl:begin:ignore*/\n/*\n      */\n  left: 0;\n/*\n      /*rtl:end:ignore*/\n/*\n      */\n}\n/*\n      /*rtl:begin:ignore*/\n/*\n      /*rtl:end:ignore*/\n.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,\n.flatpickr-months .flatpickr-next-month.flatpickr-next-month {\n/*\n      /*rtl:begin:ignore*/\n/*\n      */\n  right: 0;\n/*\n      /*rtl:end:ignore*/\n/*\n      */\n}\n/*\n      /*rtl:begin:ignore*/\n/*\n      /*rtl:end:ignore*/\n.flatpickr-months .flatpickr-prev-month:hover,\n.flatpickr-months .flatpickr-next-month:hover {\n  color: #959ea9;\n}\n.flatpickr-months .flatpickr-prev-month:hover svg,\n.flatpickr-months .flatpickr-next-month:hover svg {\n  fill: #f64747;\n}\n.flatpickr-months .flatpickr-prev-month svg,\n.flatpickr-months .flatpickr-next-month svg {\n  width: 14px;\n  height: 14px;\n}\n.flatpickr-months .flatpickr-prev-month svg path,\n.flatpickr-months .flatpickr-next-month svg path {\n  -webkit-transition: fill 0.1s;\n  transition: fill 0.1s;\n  fill: inherit;\n}\n.numInputWrapper {\n  position: relative;\n  height: auto;\n}\n.numInputWrapper input,\n.numInputWrapper span {\n  display: inline-block;\n}\n.numInputWrapper input {\n  width: 100%;\n}\n.numInputWrapper input::-ms-clear {\n  display: none;\n}\n.numInputWrapper input::-webkit-outer-spin-button,\n.numInputWrapper input::-webkit-inner-spin-button {\n  margin: 0;\n  -webkit-appearance: none;\n}\n.numInputWrapper span {\n  position: absolute;\n  right: 0;\n  width: 14px;\n  padding: 0 4px 0 2px;\n  height: 50%;\n  line-height: 50%;\n  opacity: 0;\n  cursor: pointer;\n  border: 1px solid rgba(57,57,57,0.15);\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n}\n.numInputWrapper span:hover {\n  background: rgba(0,0,0,0.1);\n}\n.numInputWrapper span:active {\n  background: rgba(0,0,0,0.2);\n}\n.numInputWrapper span:after {\n  display: block;\n  content: \"\";\n  position: absolute;\n}\n.numInputWrapper span.arrowUp {\n  top: 0;\n  border-bottom: 0;\n}\n.numInputWrapper span.arrowUp:after {\n  border-left: 4px solid transparent;\n  border-right: 4px solid transparent;\n  border-bottom: 4px solid rgba(57,57,57,0.6);\n  top: 26%;\n}\n.numInputWrapper span.arrowDown {\n  top: 50%;\n}\n.numInputWrapper span.arrowDown:after {\n  border-left: 4px solid transparent;\n  border-right: 4px solid transparent;\n  border-top: 4px solid rgba(57,57,57,0.6);\n  top: 40%;\n}\n.numInputWrapper span svg {\n  width: inherit;\n  height: auto;\n}\n.numInputWrapper span svg path {\n  fill: rgba(0,0,0,0.5);\n}\n.numInputWrapper:hover {\n  background: rgba(0,0,0,0.05);\n}\n.numInputWrapper:hover span {\n  opacity: 1;\n}\n.flatpickr-current-month {\n  font-size: 135%;\n  line-height: inherit;\n  font-weight: 300;\n  color: inherit;\n  position: absolute;\n  width: 75%;\n  left: 12.5%;\n  padding: 7.48px 0 0 0;\n  line-height: 1;\n  height: 34px;\n  display: inline-block;\n  text-align: center;\n  -webkit-transform: translate3d(0px, 0px, 0px);\n          transform: translate3d(0px, 0px, 0px);\n}\n.flatpickr-current-month span.cur-month {\n  font-family: inherit;\n  font-weight: 700;\n  color: inherit;\n  display: inline-block;\n  margin-left: 0.5ch;\n  padding: 0;\n}\n.flatpickr-current-month span.cur-month:hover {\n  background: rgba(0,0,0,0.05);\n}\n.flatpickr-current-month .numInputWrapper {\n  width: 6ch;\n  width: 7ch\\0;\n  display: inline-block;\n}\n.flatpickr-current-month .numInputWrapper span.arrowUp:after {\n  border-bottom-color: rgba(0,0,0,0.9);\n}\n.flatpickr-current-month .numInputWrapper span.arrowDown:after {\n  border-top-color: rgba(0,0,0,0.9);\n}\n.flatpickr-current-month input.cur-year {\n  background: transparent;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  color: inherit;\n  cursor: text;\n  padding: 0 0 0 0.5ch;\n  margin: 0;\n  display: inline-block;\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: 300;\n  line-height: inherit;\n  height: auto;\n  border: 0;\n  border-radius: 0;\n  vertical-align: initial;\n  -webkit-appearance: textfield;\n  -moz-appearance: textfield;\n  appearance: textfield;\n}\n.flatpickr-current-month input.cur-year:focus {\n  outline: 0;\n}\n.flatpickr-current-month input.cur-year[disabled],\n.flatpickr-current-month input.cur-year[disabled]:hover {\n  font-size: 100%;\n  color: rgba(0,0,0,0.5);\n  background: transparent;\n  pointer-events: none;\n}\n.flatpickr-current-month .flatpickr-monthDropdown-months {\n  appearance: menulist;\n  background: transparent;\n  border: none;\n  border-radius: 0;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: pointer;\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: 300;\n  height: auto;\n  line-height: inherit;\n  margin: -1px 0 0 0;\n  outline: none;\n  padding: 0 0 0 0.5ch;\n  position: relative;\n  vertical-align: initial;\n  -webkit-box-sizing: border-box;\n  -webkit-appearance: menulist;\n  -moz-appearance: menulist;\n  width: auto;\n}\n.flatpickr-current-month .flatpickr-monthDropdown-months:focus,\n.flatpickr-current-month .flatpickr-monthDropdown-months:active {\n  outline: none;\n}\n.flatpickr-current-month .flatpickr-monthDropdown-months:hover {\n  background: rgba(0,0,0,0.05);\n}\n.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {\n  background-color: transparent;\n  outline: none;\n  padding: 0;\n}\n.flatpickr-weekdays {\n  background: transparent;\n  text-align: center;\n  overflow: hidden;\n  width: 100%;\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n  -webkit-align-items: center;\n      -ms-flex-align: center;\n          align-items: center;\n  height: 28px;\n}\n.flatpickr-weekdays .flatpickr-weekdaycontainer {\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-flex: 1;\n  -webkit-flex: 1;\n      -ms-flex: 1;\n          flex: 1;\n}\nspan.flatpickr-weekday {\n  cursor: default;\n  font-size: 90%;\n  background: transparent;\n  color: rgba(0,0,0,0.54);\n  line-height: 1;\n  margin: 0;\n  text-align: center;\n  display: block;\n  -webkit-box-flex: 1;\n  -webkit-flex: 1;\n      -ms-flex: 1;\n          flex: 1;\n  font-weight: bolder;\n}\n.dayContainer,\n.flatpickr-weeks {\n  padding: 1px 0 0 0;\n}\n.flatpickr-days {\n  position: relative;\n  overflow: hidden;\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: start;\n  -webkit-align-items: flex-start;\n      -ms-flex-align: start;\n          align-items: flex-start;\n  width: 307.875px;\n}\n.flatpickr-days:focus {\n  outline: 0;\n}\n.dayContainer {\n  padding: 0;\n  outline: 0;\n  text-align: left;\n  width: 307.875px;\n  min-width: 307.875px;\n  max-width: 307.875px;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  display: inline-block;\n  display: -ms-flexbox;\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: flex;\n  -webkit-flex-wrap: wrap;\n          flex-wrap: wrap;\n  -ms-flex-wrap: wrap;\n  -ms-flex-pack: justify;\n  -webkit-justify-content: space-around;\n          justify-content: space-around;\n  -webkit-transform: translate3d(0px, 0px, 0px);\n          transform: translate3d(0px, 0px, 0px);\n  opacity: 1;\n}\n.dayContainer + .dayContainer {\n  -webkit-box-shadow: -1px 0 0 #e6e6e6;\n          box-shadow: -1px 0 0 #e6e6e6;\n}\n.flatpickr-day {\n  background: none;\n  border: 1px solid transparent;\n  border-radius: 150px;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  color: #344767;\n  cursor: pointer;\n  font-weight: 400;\n  width: 14.2857143%;\n  -webkit-flex-basis: 14.2857143%;\n      -ms-flex-preferred-size: 14.2857143%;\n          flex-basis: 14.2857143%;\n  max-width: 39px;\n  height: 39px;\n  line-height: 39px;\n  margin: 0;\n  display: inline-block;\n  position: relative;\n  -webkit-box-pack: center;\n  -webkit-justify-content: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n}\n.flatpickr-day.inRange,\n.flatpickr-day.prevMonthDay.inRange,\n.flatpickr-day.nextMonthDay.inRange,\n.flatpickr-day.today.inRange,\n.flatpickr-day.prevMonthDay.today.inRange,\n.flatpickr-day.nextMonthDay.today.inRange,\n.flatpickr-day:hover,\n.flatpickr-day.prevMonthDay:hover,\n.flatpickr-day.nextMonthDay:hover,\n.flatpickr-day:focus,\n.flatpickr-day.prevMonthDay:focus,\n.flatpickr-day.nextMonthDay:focus {\n  cursor: pointer;\n  outline: 0;\n  background: #e6e6e6;\n  border-color: #e6e6e6;\n}\n.flatpickr-day.today {\n  border-color: #959ea9;\n}\n.flatpickr-day.today:hover,\n.flatpickr-day.today:focus {\n  border-color: #959ea9;\n  background: #959ea9;\n  color: #fff;\n}\n.flatpickr-day.selected,\n.flatpickr-day.startRange,\n.flatpickr-day.endRange,\n.flatpickr-day.selected.inRange,\n.flatpickr-day.startRange.inRange,\n.flatpickr-day.endRange.inRange,\n.flatpickr-day.selected:focus,\n.flatpickr-day.startRange:focus,\n.flatpickr-day.endRange:focus,\n.flatpickr-day.selected:hover,\n.flatpickr-day.startRange:hover,\n.flatpickr-day.endRange:hover,\n.flatpickr-day.selected.prevMonthDay,\n.flatpickr-day.startRange.prevMonthDay,\n.flatpickr-day.endRange.prevMonthDay,\n.flatpickr-day.selected.nextMonthDay,\n.flatpickr-day.startRange.nextMonthDay,\n.flatpickr-day.endRange.nextMonthDay {\n  background: #569ff7;\n  -webkit-box-shadow: none;\n          box-shadow: none;\n  color: #fff;\n  border-color: #569ff7;\n}\n.flatpickr-day.selected.startRange,\n.flatpickr-day.startRange.startRange,\n.flatpickr-day.endRange.startRange {\n  border-radius: 50px 0 0 50px;\n}\n.flatpickr-day.selected.endRange,\n.flatpickr-day.startRange.endRange,\n.flatpickr-day.endRange.endRange {\n  border-radius: 0 50px 50px 0;\n}\n.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),\n.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {\n  -webkit-box-shadow: -10px 0 0 #569ff7;\n          box-shadow: -10px 0 0 #569ff7;\n}\n.flatpickr-day.selected.startRange.endRange,\n.flatpickr-day.startRange.startRange.endRange,\n.flatpickr-day.endRange.startRange.endRange {\n  border-radius: 50px;\n}\n.flatpickr-day.inRange {\n  border-radius: 0;\n  -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;\n          box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;\n}\n.flatpickr-day.flatpickr-disabled,\n.flatpickr-day.flatpickr-disabled:hover,\n.flatpickr-day.prevMonthDay,\n.flatpickr-day.nextMonthDay,\n.flatpickr-day.notAllowed,\n.flatpickr-day.notAllowed.prevMonthDay,\n.flatpickr-day.notAllowed.nextMonthDay {\n  color: rgba(57,57,57,0.3);\n  background: transparent;\n  border-color: transparent;\n  cursor: default;\n}\n.flatpickr-day.flatpickr-disabled,\n.flatpickr-day.flatpickr-disabled:hover {\n  cursor: not-allowed;\n  color: rgba(57,57,57,0.1);\n}\n.flatpickr-day.week.selected {\n  border-radius: 0;\n  -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;\n          box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;\n}\n.flatpickr-day.hidden {\n  visibility: hidden;\n}\n.rangeMode .flatpickr-day {\n  margin-top: 1px;\n}\n.flatpickr-weekwrapper {\n  float: left;\n}\n.flatpickr-weekwrapper .flatpickr-weeks {\n  padding: 0 12px;\n  -webkit-box-shadow: 1px 0 0 #e6e6e6;\n          box-shadow: 1px 0 0 #e6e6e6;\n}\n.flatpickr-weekwrapper .flatpickr-weekday {\n  float: none;\n  width: 100%;\n  line-height: 28px;\n}\n.flatpickr-weekwrapper span.flatpickr-day,\n.flatpickr-weekwrapper span.flatpickr-day:hover {\n  display: block;\n  width: 100%;\n  max-width: none;\n  color: rgba(57,57,57,0.3);\n  background: transparent;\n  cursor: default;\n  border: none;\n}\n.flatpickr-innerContainer {\n  display: block;\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  overflow: hidden;\n}\n.flatpickr-rContainer {\n  display: inline-block;\n  padding: 0;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n}\n.flatpickr-time {\n  text-align: center;\n  outline: 0;\n  display: block;\n  height: 0;\n  line-height: 40px;\n  max-height: 40px;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  overflow: hidden;\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n}\n.flatpickr-time:after {\n  content: \"\";\n  display: table;\n  clear: both;\n}\n.flatpickr-time .numInputWrapper {\n  -webkit-box-flex: 1;\n  -webkit-flex: 1;\n      -ms-flex: 1;\n          flex: 1;\n  width: 40%;\n  height: 40px;\n  float: left;\n}\n.flatpickr-time .numInputWrapper span.arrowUp:after {\n  border-bottom-color: #393939;\n}\n.flatpickr-time .numInputWrapper span.arrowDown:after {\n  border-top-color: #393939;\n}\n.flatpickr-time.hasSeconds .numInputWrapper {\n  width: 26%;\n}\n.flatpickr-time.time24hr .numInputWrapper {\n  width: 49%;\n}\n.flatpickr-time input {\n  background: transparent;\n  -webkit-box-shadow: none;\n          box-shadow: none;\n  border: 0;\n  border-radius: 0;\n  text-align: center;\n  margin: 0;\n  padding: 0;\n  height: inherit;\n  line-height: inherit;\n  color: #393939;\n  font-size: 14px;\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  -webkit-appearance: textfield;\n  -moz-appearance: textfield;\n  appearance: textfield;\n}\n.flatpickr-time input.flatpickr-hour {\n  font-weight: bold;\n}\n.flatpickr-time input.flatpickr-minute,\n.flatpickr-time input.flatpickr-second {\n  font-weight: 400;\n}\n.flatpickr-time input:focus {\n  outline: 0;\n  border: 0;\n}\n.flatpickr-time .flatpickr-time-separator,\n.flatpickr-time .flatpickr-am-pm {\n  height: inherit;\n  float: left;\n  line-height: inherit;\n  color: #393939;\n  font-weight: bold;\n  width: 2%;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  -webkit-align-self: center;\n      -ms-flex-item-align: center;\n          align-self: center;\n}\n.flatpickr-time .flatpickr-am-pm {\n  outline: 0;\n  width: 18%;\n  cursor: pointer;\n  text-align: center;\n  font-weight: 400;\n}\n.flatpickr-time input:hover,\n.flatpickr-time .flatpickr-am-pm:hover,\n.flatpickr-time input:focus,\n.flatpickr-time .flatpickr-am-pm:focus {\n  background: #eee;\n}\n.flatpickr-input[readonly] {\n  cursor: pointer;\n}\n@-webkit-keyframes fpFadeInDown {\n  from {\n    opacity: 0;\n    -webkit-transform: translate3d(0, -20px, 0);\n            transform: translate3d(0, -20px, 0);\n  }\n  to {\n    opacity: 1;\n    -webkit-transform: translate3d(0, 0, 0);\n            transform: translate3d(0, 0, 0);\n  }\n}\n@keyframes fpFadeInDown {\n  from {\n    opacity: 0;\n    -webkit-transform: translate3d(0, -20px, 0);\n            transform: translate3d(0, -20px, 0);\n  }\n  to {\n    opacity: 1;\n    -webkit-transform: translate3d(0, 0, 0);\n            transform: translate3d(0, 0, 0);\n  }\n}\n\n\n\n\n//////////// Creative Tim Changes\n\n.datepicker.flatpickr-input{\n  background-color: $white;\n}\n\n.flatpickr-calendar {\n\n  &.open {\n    margin-left: 0px;\n    margin-top: 4px;\n  }\n\n  &.arrowBottom {\n    margin-top: -20px;\n  }\n\n  .flatpickr-innerContainer {\n    margin-top: 15px !important;\n  }\n\n  .numInputWrapper {\n    span {\n      border: none;\n      border-bottom: 1px solid rgba(57, 57, 57, 0.15);\n    }\n\n    &:hover {\n      .arrowUp,\n      .arrowDown {\n        margin-top: 3px;\n      }\n    }\n  }\n\n  .flatpickr-day {\n    &.today,\n    &.selected,\n    &.startRange,\n    &.endRange {\n      background: $primary !important;\n      color: $white;\n      border: none;\n    }\n\n    &.inRange {\n      background: rgba(94, 114, 228, 0.28);\n      border: none;\n      -webkit-box-shadow: -5px 0 0 #D7DCF8, 5px 0 0 #D7DCF8;\n      box-shadow: -5px 0 0 #D7DCF8, 5px 0 0 #D7DCF8;\n    }\n\n    &:not(.selected) {\n      &:hover,\n      &:focus {\n        background: rgba(94, 114, 228, 0.28);\n        border: none;\n      }\n    }\n  }\n\n  .flatpickr-time input:hover,\n  .flatpickr-time .flatpickr-am-pm:hover,\n  .flatpickr-time input:focus,\n  .flatpickr-time .flatpickr-am-pm:focus {\n    background: rgba(94, 114, 228, 0.28);\n  }\n}\n\n.flatpickr {\n  &.form-control {\n    background: $white;\n  }\n}\n\n.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)),\n.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),\n.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)){\n  box-shadow: -10px 0 0 $primary;\n}\n\n////////////\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/free/_nouislider.scss",
    "content": "/*! nouislider - 14.6.3 - 11/19/2020 */\n/* Functional styling;\n * These styles are required for noUiSlider to function.\n * You don't need to change these rules to apply your design.\n */\n.noUi-target,\n.noUi-target * {\n  -webkit-touch-callout: none;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n  -webkit-user-select: none;\n  -ms-touch-action: none;\n  touch-action: none;\n  -ms-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  -moz-box-sizing: border-box;\n  box-sizing: border-box;\n}\n.noUi-target {\n  position: relative;\n}\n.noUi-base,\n.noUi-connects {\n  width: 100%;\n  height: 2px;\n  position: relative;\n  z-index: 1;\n  top: 0;\n}\n/* Wrapper for all connect elements.\n */\n.noUi-connects {\n  z-index: 0;\n  overflow: hidden;\n}\n.noUi-connect,\n.noUi-origin {\n  will-change: transform;\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  -ms-transform-origin: 0 0;\n  -webkit-transform-origin: 0 0;\n  -webkit-transform-style: preserve-3d;\n  transform-origin: 0 0;\n  transform-style: flat;\n}\n.noUi-connect {\n  height: 100%;\n  width: 100%;\n  border-radius: 0.25rem;\n}\n.noUi-origin {\n  height: 10%;\n  width: 10%;\n}\n/* Offset direction\n */\n.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {\n  left: 0;\n  right: auto;\n}\n/* Give origins 0 height/width so they don't interfere with clicking the\n * connect elements.\n */\n.noUi-vertical .noUi-origin {\n  width: 0;\n}\n.noUi-horizontal .noUi-origin {\n  height: 0;\n}\n.noUi-handle {\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  position: absolute;\n}\n.noUi-touch-area {\n  height: 100%;\n  width: 100%;\n}\n.noUi-state-tap .noUi-connect,\n.noUi-state-tap .noUi-origin {\n  -webkit-transition: transform 0.3s;\n  transition: transform 0.3s;\n}\n.noUi-state-drag * {\n  cursor: inherit !important;\n}\n/* Slider size and handle placement;\n */\n.noUi-horizontal {\n  height: 2px;\n}\n.noUi-horizontal .noUi-handle {\n  border-radius: 50%;\n  background-color: $white;\n  box-shadow: 0 1px 13px 0 rgba(0,0,0,.2);\n  height: 14px;\n  width: 14px;\n  cursor: pointer;\n  margin-top: -6px;\n  outline: none;\n  right: -10px;\n}\n.noUi-vertical {\n  width: 3px;\n}\n.noUi-vertical .noUi-handle {\n  width: 28px;\n  height: 34px;\n  right: -6px;\n  top: -17px;\n}\n.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {\n  left: -17px;\n  right: auto;\n}\n/* Styling;\n * Giving the connect element a border radius causes issues with using transform: scale\n */\n.noUi-target {\n  background: $light;\n  border-radius: .25rem;\n}\n.noUi-connects {\n  border-radius: 3px;\n}\n.noUi-connect {\n  background: $primary;\n\n}\n/* Handles and cursors;\n */\n.noUi-draggable {\n  cursor: ew-resize;\n}\n.noUi-vertical .noUi-draggable {\n  cursor: ns-resize;\n}\n.noUi-handle {\n  border: 1px solid $primary;\n  border-radius: 3px;\n  background: $white;\n  cursor: default;\n  box-shadow: inset 0 0 1px $white, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;\n  webkit-transition: .3s ease 0s;\n  -moz-transition: .3s ease 0s;\n  -ms-transition: .3s ease 0s;\n  -o-transform: .3s ease 0s;\n  transition: .3s ease 0s;\n}\n.noUi-active {\n  box-shadow: inset 0 0 1px $white, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;\n  transform: scale3d(1.5,1.5,1);\n}\n\n\n/* Disabled state;\n */\n[disabled] .noUi-connect {\n  background: #B8B8B8;\n}\n[disabled].noUi-target,\n[disabled].noUi-handle,\n[disabled] .noUi-handle {\n  cursor: not-allowed;\n}\n/* Base;\n *\n */\n.noUi-pips,\n.noUi-pips * {\n  -moz-box-sizing: border-box;\n  box-sizing: border-box;\n}\n.noUi-pips {\n  position: absolute;\n  color: #999;\n}\n/* Values;\n *\n */\n.noUi-value {\n  position: absolute;\n  white-space: nowrap;\n  text-align: center;\n}\n.noUi-value-sub {\n  color: #ccc;\n  font-size: 10px;\n}\n/* Markings;\n *\n */\n.noUi-marker {\n  position: absolute;\n  background: #CCC;\n}\n.noUi-marker-sub {\n  background: #AAA;\n}\n.noUi-marker-large {\n  background: #AAA;\n}\n/* Horizontal layout;\n *\n */\n.noUi-pips-horizontal {\n  padding: 10px 0;\n  height: 80px;\n  top: 100%;\n  left: 0;\n  width: 100%;\n}\n.noUi-value-horizontal {\n  -webkit-transform: translate(-50%, 50%);\n  transform: translate(-50%, 50%);\n}\n.noUi-rtl .noUi-value-horizontal {\n  -webkit-transform: translate(50%, 50%);\n  transform: translate(50%, 50%);\n}\n.noUi-marker-horizontal.noUi-marker {\n  margin-left: -1px;\n  width: 2px;\n  height: 5px;\n}\n.noUi-marker-horizontal.noUi-marker-sub {\n  height: 10px;\n}\n.noUi-marker-horizontal.noUi-marker-large {\n  height: 15px;\n}\n/* Vertical layout;\n *\n */\n.noUi-pips-vertical {\n  padding: 0 10px;\n  height: 100%;\n  top: 0;\n  left: 100%;\n}\n.noUi-value-vertical {\n  -webkit-transform: translate(0, -50%);\n  transform: translate(0, -50%);\n  padding-left: 25px;\n}\n.noUi-rtl .noUi-value-vertical {\n  -webkit-transform: translate(0, 50%);\n  transform: translate(0, 50%);\n}\n.noUi-marker-vertical.noUi-marker {\n  width: 5px;\n  height: 2px;\n  margin-top: -1px;\n}\n.noUi-marker-vertical.noUi-marker-sub {\n  width: 10px;\n}\n.noUi-marker-vertical.noUi-marker-large {\n  width: 15px;\n}\n.noUi-tooltip {\n  display: block;\n  position: absolute;\n  border: 1px solid #D9D9D9;\n  border-radius: 3px;\n  background: $white;\n  color: #000;\n  padding: 5px;\n  text-align: center;\n  white-space: nowrap;\n}\n.noUi-horizontal .noUi-tooltip {\n  -webkit-transform: translate(-50%, 0);\n  transform: translate(-50%, 0);\n  left: 50%;\n  bottom: 120%;\n}\n.noUi-vertical .noUi-tooltip {\n  -webkit-transform: translate(0, -50%);\n  transform: translate(0, -50%);\n  top: 50%;\n  right: 120%;\n}\n.noUi-horizontal .noUi-origin > .noUi-tooltip {\n  -webkit-transform: translate(50%, 0);\n  transform: translate(50%, 0);\n  left: auto;\n  bottom: 10px;\n}\n.noUi-vertical .noUi-origin > .noUi-tooltip {\n  -webkit-transform: translate(0, -18px);\n  transform: translate(0, -18px);\n  top: auto;\n  right: 28px;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/free/_perfect-scrollbar.scss",
    "content": "/*\n * Container style\n */\n.ps {\n  overflow: hidden !important;\n  overflow-anchor: none;\n  -ms-overflow-style: none;\n  touch-action: auto;\n  -ms-touch-action: auto;\n}\n\n/*\n * Scrollbar rail styles\n */\n.ps__rail-x {\n  display: none;\n  opacity: 0;\n  transition: background-color .2s linear, opacity .2s linear;\n  -webkit-transition: background-color .2s linear, opacity .2s linear;\n  height: 15px;\n  /* there must be 'bottom' or 'top' for ps__rail-x */\n  bottom: 0px;\n  /* please don't change 'position' */\n  position: absolute;\n}\n\n.ps__rail-y {\n  display: none;\n  opacity: 0;\n  transition: background-color .2s linear, opacity .2s linear;\n  -webkit-transition: background-color .2s linear, opacity .2s linear;\n  width: 15px;\n  /* there must be 'right' or 'left' for ps__rail-y */\n  right: 0;\n  /* please don't change 'position' */\n  position: absolute;\n}\n\n.ps--active-x > .ps__rail-x,\n.ps--active-y > .ps__rail-y {\n  display: block;\n  background-color: transparent;\n}\n\n.ps:hover > .ps__rail-x,\n.ps:hover > .ps__rail-y,\n.ps--focus > .ps__rail-x,\n.ps--focus > .ps__rail-y,\n.ps--scrolling-x > .ps__rail-x,\n.ps--scrolling-y > .ps__rail-y {\n  opacity: 0.6;\n}\n\n.ps .ps__rail-x:hover,\n.ps .ps__rail-y:hover,\n.ps .ps__rail-x:focus,\n.ps .ps__rail-y:focus,\n.ps .ps__rail-x.ps--clicking,\n.ps .ps__rail-y.ps--clicking {\n  background-color: #eee;\n  opacity: 0.9;\n}\n\n/*\n * Scrollbar thumb styles\n */\n.ps__thumb-x {\n  background-color: #aaa;\n  border-radius: 6px;\n  transition: background-color .2s linear, height .2s ease-in-out;\n  -webkit-transition: background-color .2s linear, height .2s ease-in-out;\n  height: 6px;\n  /* there must be 'bottom' for ps__thumb-x */\n  bottom: 2px;\n  /* please don't change 'position' */\n  position: absolute;\n}\n\n.ps__thumb-y {\n  background-color: #aaa;\n  border-radius: 6px;\n  transition: background-color .2s linear, width .2s ease-in-out;\n  -webkit-transition: background-color .2s linear, width .2s ease-in-out;\n  width: 6px;\n  /* there must be 'right' for ps__thumb-y */\n  right: 2px;\n  /* please don't change 'position' */\n  position: absolute;\n}\n\n.ps__rail-x:hover > .ps__thumb-x,\n.ps__rail-x:focus > .ps__thumb-x,\n.ps__rail-x.ps--clicking .ps__thumb-x {\n  background-color: #999;\n  height: 11px;\n}\n\n.ps__rail-y:hover > .ps__thumb-y,\n.ps__rail-y:focus > .ps__thumb-y,\n.ps__rail-y.ps--clicking .ps__thumb-y {\n  background-color: #999;\n  width: 11px;\n}\n\n/* MS supports */\n@supports (-ms-overflow-style: none) {\n  .ps {\n    overflow: auto !important;\n  }\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n  .ps {\n    overflow: auto !important;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/free/_prism.scss",
    "content": "/* PrismJS 1.23.0\nhttps://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */\n/**\n * prism.js default theme for JavaScript, CSS and HTML\n * Based on dabblet (http://dabblet.com)\n * @author Lea Verou\n */\n\ncode[class*=\"language-\"],\npre[class*=\"language-\"] {\n\tcolor: black;\n\tbackground: none;\n\ttext-shadow: 0 1px white;\n\tfont-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n\tfont-size: 1em;\n\ttext-align: left;\n\twhite-space: pre;\n\tword-spacing: normal;\n\tword-break: normal;\n\tword-wrap: normal;\n\tline-height: 1.5;\n\n\t-moz-tab-size: 4;\n\t-o-tab-size: 4;\n\ttab-size: 4;\n\n\t-webkit-hyphens: none;\n\t-moz-hyphens: none;\n\t-ms-hyphens: none;\n\thyphens: none;\n}\n\npre[class*=\"language-\"]::-moz-selection, pre[class*=\"language-\"] ::-moz-selection,\ncode[class*=\"language-\"]::-moz-selection, code[class*=\"language-\"] ::-moz-selection {\n\ttext-shadow: none;\n\tbackground: #b3d4fc;\n}\n\npre[class*=\"language-\"]::selection, pre[class*=\"language-\"] ::selection,\ncode[class*=\"language-\"]::selection, code[class*=\"language-\"] ::selection {\n\ttext-shadow: none;\n\tbackground: #b3d4fc;\n}\n\n@media print {\n\tcode[class*=\"language-\"],\n\tpre[class*=\"language-\"] {\n\t\ttext-shadow: none;\n\t}\n}\n\n/* Code blocks */\npre[class*=\"language-\"] {\n\tpadding: 1em;\n\toverflow: auto;\n  border-radius: .75rem;\n}\n\n:not(pre) > code[class*=\"language-\"],\npre[class*=\"language-\"] {\n\tbackground: $gray-100;\n}\n\n/* Inline code */\n:not(pre) > code[class*=\"language-\"] {\n\tpadding: .1em;\n\tborder-radius: .3em;\n\twhite-space: normal;\n}\n\n.token.comment,\n.token.prolog,\n.token.doctype,\n.token.cdata {\n\tcolor: slategray;\n}\n\n.token.punctuation {\n\tcolor: #999;\n}\n\n.token.namespace {\n\topacity: .7;\n}\n\n.token.property,\n.token.tag,\n.token.boolean,\n.token.number,\n.token.constant,\n.token.symbol,\n.token.deleted {\n\tcolor: #905;\n}\n\n.token.selector,\n.token.attr-name,\n.token.string,\n.token.char,\n.token.builtin,\n.token.inserted {\n\tcolor: #690;\n}\n\n.token.operator,\n.token.entity,\n.token.url,\n.language-css .token.string,\n.style .token.string {\n\tcolor: #9a6e3a;\n\t/* This background color was intended by the author of this theme. */\n\tbackground: hsla(0, 0%, 100%, .5);\n}\n\n.token.atrule,\n.token.attr-value,\n.token.keyword {\n\tcolor: #07a;\n}\n\n.token.function,\n.token.class-name {\n\tcolor: #DD4A68;\n}\n\n.token.regex,\n.token.important,\n.token.variable {\n\tcolor: #e90;\n}\n\n.token.important,\n.token.bold {\n\tfont-weight: bold;\n}\n.token.italic {\n\tfont-style: italic;\n}\n\n.token.entity {\n\tcursor: help;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/free/plugins.scss",
    "content": "@import \"flatpickr\";\n@import \"nouislider\";\n@import \"prism\";\n@import \"perfect-scrollbar\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_carousel-slick.scss",
    "content": ".slick-slider {\n  .btn.slick-next {\n    margin-left: 10px;\n  }\n}\n.slick-slide {\n  margin: 0px 20px;\n}\n\n.slick-slide img {\n  width: 200px;\n}\n\n.slick-slider {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n          user-select: none;\n  -webkit-touch-callout: none;\n  -khtml-user-select: none;\n  -ms-touch-action: pan-y;\n      touch-action: pan-y;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.slick-list {\n  position: relative;\n  display: block;\n  overflow: hidden;\n  margin: 0;\n  padding: 0;\n  margin-top: 100px;\n}\n.slick-list:focus {\n  outline: none;\n}\n.slick-list.dragging {\n  cursor: pointer;\n  cursor: hand;\n}\n\n.slick-slider .slick-track,\n.slick-slider .slick-list {\n    -webkit-transform: translate3d(0, 0, 0);\n       -moz-transform: translate3d(0, 0, 0);\n        -ms-transform: translate3d(0, 0, 0);\n         -o-transform: translate3d(0, 0, 0);\n            transform: translate3d(0, 0, 0);\n}\n\n.slick-track {\n  position: relative;\n  top: 0;\n  left: 0;\n  display: block;\n}\n.slick-track:before,\n.slick-track:after {\n  display: table;\n  content: '';\n}\n.slick-track:after {\n  clear: both;\n}\n.slick-loading .slick-track {\n  visibility: hidden;\n}\n\n.slick-slide {\n  float: left;\n  height: 100%;\n  min-height: 1px;\n}\n[dir='rtl'] .slick-slide {\n  float: right;\n}\n.slick-slide img {\n  display: block;\n}\n.slick-slide.slick-loading img {\n  display: none;\n}\n.slick-slide.dragging img {\n  pointer-events: none;\n}\n.slick-initialized .slick-slide {\n  display: block;\n}\n.slick-loading .slick-slide {\n  visibility: hidden;\n}\n.slick-vertical .slick-slide {\n  display: block;\n  height: auto;\n  border: 1px solid transparent;\n}\n.slick-arrow.slick-hidden {\n  display: none;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_choices.scss",
    "content": "/*===============================\n=            Choices            =\n===============================*/\n.choices {\n  position: relative;\n  margin-bottom: 24px;\n  font-size: 16px;\n  width: 100%;\n}\n\n.choices:focus {\n  outline: none;\n}\n\n.choices:last-child {\n  margin-bottom: 0;\n}\n\n.choices.is-disabled .choices__inner,\n.choices.is-disabled .choices__input {\n  background-color: #eaeaea;\n  cursor: not-allowed;\n  -webkit-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.choices.is-disabled .choices__item {\n  cursor: not-allowed;\n}\n\n.choices [hidden] {\n  display: none !important;\n}\n\n.choices[data-type*='select-one'] {\n  cursor: pointer;\n}\n\n.choices[data-type*='select-one'] .choices__inner {\n  padding-bottom: 7.5px;\n}\n\n.choices[data-type*='select-one'] .choices__input {\n  display: block;\n  width: 100%;\n  padding: 10px;\n  border-bottom: 1px solid #dddddd;\n  background-color: #ffffff;\n  margin: 0;\n}\n\n.choices[data-type*='select-one'] .choices__button {\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);\n  padding: 0;\n  background-size: 8px;\n  position: absolute;\n  top: 50%;\n  right: 0;\n  margin-top: -10px;\n  margin-right: 25px;\n  height: 20px;\n  width: 20px;\n  border-radius: 10em;\n  opacity: 0.5;\n}\n\n.choices[data-type*='select-one'] .choices__button:hover, .choices[data-type*='select-one'] .choices__button:focus {\n  opacity: 1;\n}\n\n.choices[data-type*='select-one'] .choices__button:focus {\n  box-shadow: 0px 0px 0px 2px #00bcd4;\n}\n\n.choices[data-type*='select-one'] .choices__item[data-value=''] .choices__button {\n  display: none;\n}\n\n.choices[data-type*='select-one']:after {\n  content: \"\\f107\";\n  font: normal normal normal 14px/1 FontAwesome;\n  position: absolute;\n  right: 13.5px;\n  top: 14px;\n  pointer-events: none;\n  transition: $dropdown-toggle-arrow-transition;\n}\n\n.choices[data-type*='select-one'].is-open:after {\n  transform: $dropdown-toggle-arrow-transform;\n}\n\n.choices[data-type*='select-one'][dir='rtl']:after {\n  left: 11.5px;\n  right: auto;\n}\n\n.choices[data-type*='select-one'][dir='rtl'] .choices__button {\n  right: auto;\n  left: 0;\n  margin-left: 25px;\n  margin-right: 0;\n}\n\n.choices[data-type*='select-multiple'] .choices__inner,\n.choices[data-type*='text'] .choices__inner {\n  cursor: text;\n}\n\n.choices[data-type*='select-multiple'] .choices__button,\n.choices[data-type*='text'] .choices__button {\n  position: relative;\n  display: inline-block;\n  margin-top: 0;\n  margin-right: -6px;\n  margin-bottom: 0;\n  margin-left: 8px;\n  padding-left: 17px;\n  border-left: 1px solid rgba($white, .3);\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);\n  background-size: 8px;\n  width: 8px;\n  line-height: 1;\n  opacity: 0.75;\n  border-radius: 0;\n  transition: $transition-base;\n}\n\n.choices[data-type*='select-multiple'] .choices__button:hover, .choices[data-type*='select-multiple'] .choices__button:focus,\n.choices[data-type*='text'] .choices__button:hover,\n.choices[data-type*='text'] .choices__button:focus {\n  opacity: 1;\n}\n\n.choices__inner {\n  display: flex;\n  align-items: center;\n  vertical-align: top;\n  width: 100%;\n  // background-color: #f9f9f9;\n  padding: $input-padding-y $input-padding-x;\n  // border: 1px solid $input-border-color;\n  border-radius: .5rem;\n  font-size: 14px;\n  min-height: 40px;\n  overflow: hidden;\n}\n\n.is-focused .choices__inner,\n.is-open .choices__inner {\n  border-color: #b7b7b7;\n}\n\n.is-open .choices__inner {\n  border-radius: 2.5px 2.5px 0 0;\n}\n\n.is-flipped.is-open .choices__inner {\n  border-radius: 0 0 2.5px 2.5px;\n}\n\n.choices__list {\n  margin: 0;\n  padding-left: 0;\n  list-style: none;\n}\n\n.choices__list--single {\n  display: inline-block;\n  // padding: 4px 16px 4px 4px;\n  width: 100%;\n}\n\n[dir='rtl'] .choices__list--single {\n  padding-right: 4px;\n  padding-left: 16px;\n}\n\n.choices__list--single .choices__item {\n  width: 100%;\n}\n\n.choices__list--multiple {\n  display: inline;\n}\n\n.choices__list--multiple .choices__item {\n  display: inline-block;\n  vertical-align: middle;\n  border-radius: 20px;\n  padding: 4px 10px;\n  font-size: 12px;\n  font-weight: 500;\n  margin-right: 3.75px;\n  margin-bottom: 3.75px;\n  background-color: $dark-gradient-state;\n  border: 1px solid $dark-gradient-state;\n  color: #ffffff;\n  word-break: break-all;\n  box-sizing: border-box;\n}\n\n.choices__list--multiple .choices__item[data-deletable] {\n  padding-right: 5px;\n}\n\n[dir='rtl'] .choices__list--multiple .choices__item {\n  margin-right: 0;\n  margin-left: 3.75px;\n}\n\n.choices__list--multiple .choices__item.is-highlighted {\n  background-color: #00a5bb;\n  border: 1px solid #008fa1;\n}\n\n.is-disabled .choices__list--multiple .choices__item {\n  background-color: #aaaaaa;\n  border: 1px solid #919191;\n}\n\n.choices__list--dropdown {\n  visibility: hidden;\n  z-index: 3;\n  position: absolute;\n  width: 100%;\n  background-color: #ffffff;\n  border: 1px solid #dddddd;\n  top: 100%;\n  margin-top: -1px;\n  border-bottom-left-radius: 2.5px;\n  border-bottom-right-radius: 2.5px;\n  word-break: break-all;\n  will-change: visibility;\n}\n\n.choices__list--dropdown.is-active {\n  visibility: visible;\n}\n\n.is-open .choices__list--dropdown {\n  border-color: #b7b7b7;\n}\n\n.is-flipped .choices__list--dropdown {\n  top: auto;\n  bottom: 200%;\n  margin-top: 0;\n  margin-bottom: -1px;\n  border-radius: $choices-border-radius;\n}\n\n.choices__list--dropdown .choices__list {\n  position: relative;\n  max-height: 300px;\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n  will-change: scroll-position;\n}\n\n.choices__list--dropdown .choices__item {\n  position: relative;\n  padding: $dropdown-item-padding-y $dropdown-item-padding-x;\n  @include font-size($dropdown-font-size);\n  border-radius: $border-radius-md;\n  transition: background-color $dropdown-transition-time, color $dropdown-transition-time;\n}\n\n[dir='rtl'] .choices__list--dropdown .choices__item {\n  text-align: right;\n}\n\n@media (min-width: 640px) {\n  .choices__list--dropdown .choices__item--selectable:after {\n    font-size: 12px;\n    opacity: 0;\n    position: absolute;\n    right: 10px;\n    top: 50%;\n    transform: translateY(-50%);\n    transition: opacity $dropdown-transition-time;\n  }\n  [dir='rtl'] .choices__list--dropdown .choices__item--selectable {\n    text-align: right;\n    padding-left: 100px;\n    padding-right: 10px;\n  }\n  [dir='rtl'] .choices__list--dropdown .choices__item--selectable:after {\n    right: auto;\n    left: 10px;\n  }\n}\n\n.choices__list--dropdown .choices__item--selectable.is-highlighted {\n  background-color: #f2f2f2;\n}\n\n.choices__list--dropdown .choices__item--selectable.is-highlighted:after {\n  opacity: 0.5;\n}\n\n.choices__item {\n  cursor: default;\n}\n\n.choices__item--selectable {\n  cursor: pointer;\n}\n\n.choices__item--disabled {\n  cursor: not-allowed;\n  -webkit-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  opacity: 0.5;\n}\n\n.choices__heading {\n  font-weight: 600;\n  font-size: 12px;\n  padding: 10px;\n  border-bottom: 1px solid #f7f7f7;\n  color: gray;\n}\n\n.choices__button {\n  text-indent: -9999px;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n       appearance: none;\n  border: 0;\n  background-color: transparent;\n  background-repeat: no-repeat;\n  background-position: center;\n  cursor: pointer;\n}\n\n.choices__button:focus {\n  outline: none;\n}\n\n.choices__input {\n  display: inline-block;\n  vertical-align: baseline;\n  background-color: $white;\n  font-size: 14px;\n  margin-bottom: 5px;\n  border: 0;\n  border-radius: 0;\n  max-width: 100%;\n  padding: 4px 0 4px 2px;\n}\n\n.choices__input:focus {\n  outline: 0;\n}\n\n[dir='rtl'] .choices__input {\n  padding-right: 2px;\n  padding-left: 0;\n}\n\n.choices__placeholder {\n  opacity: 0.5;\n}\n\n/*=====  End of Choices  ======*/\n\n\n///////////// Creative Tim Changes\n\n.choices {\n  .choices__input {\n    background-image: $input-background-image;\n    background-size: $input-background-size;\n  }\n  &.is-focused {\n    .choices__input {\n      background-size: $input-background-size-focus;\n    }\n  }\n}\n\n.is-open .choices__inner{\n  border-radius: $choices-border-radius;\n}\n\n.choices__list--dropdown{\n  display: block;\n  opacity: 0;\n  top: 45px;\n  transform-origin: $dropdown-transform-origin;\n  pointer-events: none;\n  -webkit-backface-visibility: hidden;\n  backface-visibility: hidden;\n  will-change: 0 0;\n  border: none;\n  border-radius: $choices-border-radius;\n  box-shadow: $choices-box-shadow;\n  transform: $choices-transform;\n  padding: $choices-padding-y $choices-padding-x;\n  transition: $choices-transition;\n\n  &.is-active{\n    transform: $dropdown-transform-show;\n    opacity: 1;\n    display: block;\n    pointer-events: auto;\n\n    &:before {\n      top: $dropdown-hover-arrow-active-top;\n    }\n  }\n\n  &:before {\n    font-family: \"FontAwesome\";\n    content: \"\\f0d8\";\n    position: absolute;\n    top: 0;\n    left: $dropdown-animation-arrow-left-position;\n    right: auto;\n    font-size: $dropdown-animation-arrow-font-size;\n    color: $white;\n    transition: $dropdown-animation-arrow-transition;\n  }\n}\n\n.choices[data-type*=select-one] .choices__input{\n  border-bottom-color: $gray-100;\n}\n\n.choices__list--dropdown .choices__item--selectable.is-highlighted{\n  background: $dropdown-link-hover-bg;\n  color: $dropdown-link-hover-color;\n}\n\n.is-focused .choices__inner,\n.is-open .choices__inner{\n  box-shadow: $input-focus-box-shadow;\n  border-color: $input-focus-border-color;\n}\n\n@each $name, $value in $theme-colors {\n  @if $name == 'dark' {\n    $value: $dark-gradient-state;\n  }\n  .choices-#{$name} {\n    background-color: $value;\n  }\n}\n\n\n\n/////////////\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_datatable-extend.scss",
    "content": "/*!\nSimple-DataTables\nGithub: https://github.com/fiduswriter/Simple-DataTables\n*/\n\n// Creative Tim Changes\n\n.dataTable-wrapper{\n\t.dataTable-top{\n\t\tpadding: $card-header-padding;\n\t\t.dataTable-dropdown{\n\t\t\tfloat: left;\n\t\t\tlabel{\n\t\t\t\tmargin-bottom: 0;\n\t\t\t\tmargin-left: 0;\n\t\t\t\tcolor: $secondary;\n\t\t\t\tfont-weight: $font-weight-normal;\n\t\t\t\t.dataTable-selector{\n\t\t\t\t\tborder-color: $gray-200;\n\t\t\t\t\tborder-radius: $border-radius-md;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t.dataTable-search{\n\t\t\tinput{\n\t\t\t\tfont-size: $font-size-sm;\n\t\t\t\tcolor: $input-color;\n\t\t\t\tborder:1px solid $gray-200;\n\t\t\t\t@include border-radius($input-border-radius, 0);\n\t\t\t\t&:focus-visible{\n\t\t\t\t\toutline: none;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t.dataTable-container{\n\t\t.table{\n\t\t\tthead{\n\t\t\t\ttr{\n\t\t\t\t\tth{\n\t\t\t\t\t\tpadding: $table-head-spacer-y $table-head-spacer-x;\n\t\t\t\t\t\topacity: .7;\n\t\t\t\t\t\tfont-weight: bolder;\n\t\t\t\t\t\tcolor: $secondary;\n\t\t\t\t\t\ttext-transform: uppercase;\n\t\t\t\t\t\tfont-size: $font-size-xxs;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\ttbody{\n\t\t\t\ttr{\n\t\t\t\t\ttd{\n\t\t\t\t\t\tpadding: $table-head-spacer-y $table-head-spacer-x;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t.dataTable-bottom{\n\t\tpadding: $card-header-padding;\n    padding-top: 0;\n\t\t.dataTable-info{\n\t\t\tcolor: $secondary;\n\t\t\tfont-size: $font-size-sm;\n\t\t}\n\t\t.dataTable-pagination{\n\t\t\t.dataTable-pagination-list{\n\t\t\t\tli{\n\t\t\t\t\ta{\n\t\t\t\t\t\tdisplay: $page-link-display;\n\t\t\t\t    align-items: $page-link-align-items;\n\t\t\t\t    justify-content: $page-link-justify-content;\n\t\t\t\t    color: $secondary;\n\t\t\t\t    padding: 0;\n\t\t\t\t    margin: $page-link-margin;\n\t\t\t\t\t\tborder: 1px solid $gray-300;\n\t\t\t\t    border-radius: $page-link-radius !important;\n\t\t\t\t    width: $page-link-width;\n\t\t\t\t    height: $page-link-height;\n\t\t\t\t    font-size: $font-size-sm;\n\t\t\t\t\t\tmargin-left: 0;\n\t\t\t\t\t\t&:hover{\n\t\t\t\t\t\t\tbackground: $gray-200;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t.active{\n\t\t\t\t\ta{\n\t\t\t\t\t\tbackground: transparent;\n\t\t\t\t\t\t@include gradient-directional(nth($primary-gradient, 1) 0%, nth($primary-gradient-state, -1) 100%, $deg: 195deg);\n\t\t\t\t\t\tbox-shadow: $pagination-active-box-shadow;\n\t\t\t\t\t\tcolor: $white;\n\t\t\t\t\t\tborder: none;\n\t\t\t\t\t\tborder-radius: $page-link-radius !important;\n\t\t\t\t\t\t&:hover{\n\t\t\t\t\t\t\t@include gradient-directional(nth($primary-gradient, 1) 0%, nth($primary-gradient-state, -1) 100%, $deg: 195deg);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t&.no-footer{\n\t\t.dataTable-container{\n\t\t\tborder-bottom: 0;\n\t\t}\n\t}\n}\n\n.dataTable-table {\n  thead,\n  tbody,\n  tfoot {\n    td,\n    th {\n      vertical-align: middle !important;\n    }\n  }\n}\n\n@include media-breakpoint-down(sm) {\n\t.dataTable-top > div:last-child{\n\t\tfloat: left;\n\t\tmargin-top: $spacer;\n\t}\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_datatable.scss",
    "content": "/*!\nSimple-DataTables\nGithub: https://github.com/fiduswriter/Simple-DataTables\n*/\n\n\n.dataTable-wrapper.no-header .dataTable-container {\n\tborder-top: 1px solid #d9d9d9;\n}\n\n.dataTable-wrapper.no-footer .dataTable-container {\n\tborder-bottom: 1px solid #d9d9d9;\n}\n\n.dataTable-top,\n.dataTable-bottom {\n\tpadding: 8px 10px;\n}\n\n.dataTable-top > nav:first-child,\n.dataTable-top > div:first-child,\n.dataTable-bottom > nav:first-child,\n.dataTable-bottom > div:first-child {\n\tfloat: left;\n}\n\n.dataTable-top > nav:last-child,\n.dataTable-top > div:last-child,\n.dataTable-bottom > nav:last-child,\n.dataTable-bottom > div:last-child {\n\tfloat: right;\n}\n\n.dataTable-selector {\n\tpadding: 6px;\n}\n\n.dataTable-input {\n\tpadding: 6px 12px;\n}\n\n.dataTable-info {\n\tmargin: 7px 0;\n}\n\n/* PAGER */\n.dataTable-pagination ul {\n\tmargin: 0;\n\tpadding-left: 0;\n}\n\n.dataTable-pagination li {\n\tlist-style: none;\n\tfloat: left;\n}\n\n.dataTable-pagination a {\n\tborder: 1px solid transparent;\n\tfloat: left;\n\tmargin-left: 2px;\n\tpadding: 6px 12px;\n\tposition: relative;\n\ttext-decoration: none;\n\tcolor: #333;\n}\n\n.dataTable-pagination a:hover {\n\tbackground-color: #d9d9d9;\n}\n\n.dataTable-pagination .active a,\n.dataTable-pagination .active a:focus,\n.dataTable-pagination .active a:hover {\n\tbackground-color: #d9d9d9;\n\tcursor: default;\n}\n\n.dataTable-pagination .ellipsis a,\n.dataTable-pagination .disabled a,\n.dataTable-pagination .disabled a:focus,\n.dataTable-pagination .disabled a:hover {\n\tcursor: not-allowed;\n}\n\n.dataTable-pagination .disabled a,\n.dataTable-pagination .disabled a:focus,\n.dataTable-pagination .disabled a:hover {\n\tcursor: not-allowed;\n\topacity: 0.4;\n}\n\n.dataTable-pagination .pager a {\n\tfont-weight: bold;\n}\n\n/* TABLE */\n.dataTable-table {\n\tmax-width: 100%;\n\twidth: 100%;\n\tborder-spacing: 0;\n\tborder-collapse: separate;\n}\n\n.dataTable-table > tbody > tr > td,\n.dataTable-table > tbody > tr > th,\n.dataTable-table > tfoot > tr > td,\n.dataTable-table > tfoot > tr > th,\n.dataTable-table > thead > tr > td,\n.dataTable-table > thead > tr > th {\n\tvertical-align: top;\n\tpadding: 8px 10px;\n}\n\n.dataTable-table > thead > tr > th {\n\tvertical-align: bottom;\n\ttext-align: left;\n\tborder-bottom: 1px solid #d9d9d9;\n}\n\n.dataTable-table > tfoot > tr > th {\n\tvertical-align: bottom;\n\ttext-align: left;\n\tborder-top: 1px solid #d9d9d9;\n}\n\n.dataTable-table th {\n\tvertical-align: bottom;\n\ttext-align: left;\n}\n\n.dataTable-table th a {\n\ttext-decoration: none;\n\tcolor: inherit;\n}\n\n.dataTable-sorter {\n\tdisplay: inline-block;\n\theight: 100%;\n\tposition: relative;\n\twidth: 100%;\n}\n\n.dataTable-sorter::before,\n.dataTable-sorter::after {\n\tcontent: \"\";\n\theight: 0;\n\twidth: 0;\n\tposition: absolute;\n\tright: 4px;\n\tborder-left: 4px solid transparent;\n\tborder-right: 4px solid transparent;\n\topacity: 0.2;\n}\n\n.dataTable-sorter::before {\n\tborder-top: 4px solid #000;\n\tbottom: 0px;\n}\n\n.dataTable-sorter::after {\n\tborder-bottom: 4px solid #000;\n\tborder-top: 4px solid transparent;\n\ttop: 0px;\n}\n\n.asc .dataTable-sorter::after,\n.desc .dataTable-sorter::before {\n\topacity: 0.6;\n}\n\n.dataTables-empty {\n\ttext-align: center;\n}\n\n.dataTable-top::after, .dataTable-bottom::after {\n\tclear: both;\n\tcontent: \" \";\n\tdisplay: table;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_dragula.scss",
    "content": ".gu-mirror {\n  position: fixed !important;\n  margin: 0 !important;\n  z-index: 9999 !important;\n  opacity: 0.8;\n  -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)\";\n  filter: alpha(opacity=80);\n}\n.gu-hide {\n  display: none !important;\n}\n.gu-unselectable {\n  -webkit-user-select: none !important;\n  -moz-user-select: none !important;\n  -ms-user-select: none !important;\n  user-select: none !important;\n}\n.gu-transit {\n  opacity: 0.2;\n  -ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)\";\n  filter: alpha(opacity=20);\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_dropzone.scss",
    "content": "/*\n * The MIT License\n * Copyright (c) 2012 Matias Meno <m@tias.me>\n */\n@-webkit-keyframes passing-through {\n  0% {\n    opacity: 0;\n    -webkit-transform: translateY(40px);\n    -moz-transform: translateY(40px);\n    -ms-transform: translateY(40px);\n    -o-transform: translateY(40px);\n    transform: translateY(40px); }\n  30%, 70% {\n    opacity: 1;\n    -webkit-transform: translateY(0px);\n    -moz-transform: translateY(0px);\n    -ms-transform: translateY(0px);\n    -o-transform: translateY(0px);\n    transform: translateY(0px); }\n  100% {\n    opacity: 0;\n    -webkit-transform: translateY(-40px);\n    -moz-transform: translateY(-40px);\n    -ms-transform: translateY(-40px);\n    -o-transform: translateY(-40px);\n    transform: translateY(-40px); } }\n@-moz-keyframes passing-through {\n  0% {\n    opacity: 0;\n    -webkit-transform: translateY(40px);\n    -moz-transform: translateY(40px);\n    -ms-transform: translateY(40px);\n    -o-transform: translateY(40px);\n    transform: translateY(40px); }\n  30%, 70% {\n    opacity: 1;\n    -webkit-transform: translateY(0px);\n    -moz-transform: translateY(0px);\n    -ms-transform: translateY(0px);\n    -o-transform: translateY(0px);\n    transform: translateY(0px); }\n  100% {\n    opacity: 0;\n    -webkit-transform: translateY(-40px);\n    -moz-transform: translateY(-40px);\n    -ms-transform: translateY(-40px);\n    -o-transform: translateY(-40px);\n    transform: translateY(-40px); } }\n@keyframes passing-through {\n  0% {\n    opacity: 0;\n    -webkit-transform: translateY(40px);\n    -moz-transform: translateY(40px);\n    -ms-transform: translateY(40px);\n    -o-transform: translateY(40px);\n    transform: translateY(40px); }\n  30%, 70% {\n    opacity: 1;\n    -webkit-transform: translateY(0px);\n    -moz-transform: translateY(0px);\n    -ms-transform: translateY(0px);\n    -o-transform: translateY(0px);\n    transform: translateY(0px); }\n  100% {\n    opacity: 0;\n    -webkit-transform: translateY(-40px);\n    -moz-transform: translateY(-40px);\n    -ms-transform: translateY(-40px);\n    -o-transform: translateY(-40px);\n    transform: translateY(-40px); } }\n@-webkit-keyframes slide-in {\n  0% {\n    opacity: 0;\n    -webkit-transform: translateY(40px);\n    -moz-transform: translateY(40px);\n    -ms-transform: translateY(40px);\n    -o-transform: translateY(40px);\n    transform: translateY(40px); }\n  30% {\n    opacity: 1;\n    -webkit-transform: translateY(0px);\n    -moz-transform: translateY(0px);\n    -ms-transform: translateY(0px);\n    -o-transform: translateY(0px);\n    transform: translateY(0px); } }\n@-moz-keyframes slide-in {\n  0% {\n    opacity: 0;\n    -webkit-transform: translateY(40px);\n    -moz-transform: translateY(40px);\n    -ms-transform: translateY(40px);\n    -o-transform: translateY(40px);\n    transform: translateY(40px); }\n  30% {\n    opacity: 1;\n    -webkit-transform: translateY(0px);\n    -moz-transform: translateY(0px);\n    -ms-transform: translateY(0px);\n    -o-transform: translateY(0px);\n    transform: translateY(0px); } }\n@keyframes slide-in {\n  0% {\n    opacity: 0;\n    -webkit-transform: translateY(40px);\n    -moz-transform: translateY(40px);\n    -ms-transform: translateY(40px);\n    -o-transform: translateY(40px);\n    transform: translateY(40px); }\n  30% {\n    opacity: 1;\n    -webkit-transform: translateY(0px);\n    -moz-transform: translateY(0px);\n    -ms-transform: translateY(0px);\n    -o-transform: translateY(0px);\n    transform: translateY(0px); } }\n@-webkit-keyframes pulse {\n  0% {\n    -webkit-transform: scale(1);\n    -moz-transform: scale(1);\n    -ms-transform: scale(1);\n    -o-transform: scale(1);\n    transform: scale(1); }\n  10% {\n    -webkit-transform: scale(1.1);\n    -moz-transform: scale(1.1);\n    -ms-transform: scale(1.1);\n    -o-transform: scale(1.1);\n    transform: scale(1.1); }\n  20% {\n    -webkit-transform: scale(1);\n    -moz-transform: scale(1);\n    -ms-transform: scale(1);\n    -o-transform: scale(1);\n    transform: scale(1); } }\n@-moz-keyframes pulse {\n  0% {\n    -webkit-transform: scale(1);\n    -moz-transform: scale(1);\n    -ms-transform: scale(1);\n    -o-transform: scale(1);\n    transform: scale(1); }\n  10% {\n    -webkit-transform: scale(1.1);\n    -moz-transform: scale(1.1);\n    -ms-transform: scale(1.1);\n    -o-transform: scale(1.1);\n    transform: scale(1.1); }\n  20% {\n    -webkit-transform: scale(1);\n    -moz-transform: scale(1);\n    -ms-transform: scale(1);\n    -o-transform: scale(1);\n    transform: scale(1); } }\n@keyframes pulse {\n  0% {\n    -webkit-transform: scale(1);\n    -moz-transform: scale(1);\n    -ms-transform: scale(1);\n    -o-transform: scale(1);\n    transform: scale(1); }\n  10% {\n    -webkit-transform: scale(1.1);\n    -moz-transform: scale(1.1);\n    -ms-transform: scale(1.1);\n    -o-transform: scale(1.1);\n    transform: scale(1.1); }\n  20% {\n    -webkit-transform: scale(1);\n    -moz-transform: scale(1);\n    -ms-transform: scale(1);\n    -o-transform: scale(1);\n    transform: scale(1); } }\n.dropzone, .dropzone * {\n  box-sizing: border-box; }\n\n.dropzone {\n  min-height: 150px;\n  // border: 2px solid rgba(0, 0, 0, 0.3);\n  background: white;\n  padding: 20px 20px; }\n  .dropzone.dz-clickable {\n    cursor: pointer; }\n    .dropzone.dz-clickable * {\n      cursor: default; }\n    .dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {\n      cursor: pointer; }\n  .dropzone.dz-started .dz-message {\n    display: none; }\n  .dropzone.dz-drag-hover {\n    border-style: solid; }\n    .dropzone.dz-drag-hover .dz-message {\n      opacity: 0.5; }\n  .dropzone .dz-message {\n    text-align: center;\n    margin: 3em 0; }\n    .dropzone .dz-message .dz-button {\n      background: none;\n      color: $secondary;\n      border: none;\n      padding: 0;\n      font: inherit;\n      cursor: pointer;\n      outline: inherit; }\n  .dropzone .dz-preview {\n    position: relative;\n    display: inline-block;\n    vertical-align: top;\n    margin: 16px;\n    min-height: 100px; }\n    .dropzone .dz-preview:hover {\n      z-index: 1000; }\n      .dropzone .dz-preview:hover .dz-details {\n        opacity: 1; }\n    .dropzone .dz-preview.dz-file-preview .dz-image {\n      border-radius: 20px;\n      background: #999;\n      background: linear-gradient(to bottom, #eee, #ddd); }\n    .dropzone .dz-preview.dz-file-preview .dz-details {\n      opacity: 1; }\n    .dropzone .dz-preview.dz-image-preview {\n      background: white; }\n      .dropzone .dz-preview.dz-image-preview .dz-details {\n        -webkit-transition: opacity 0.2s linear;\n        -moz-transition: opacity 0.2s linear;\n        -ms-transition: opacity 0.2s linear;\n        -o-transition: opacity 0.2s linear;\n        transition: opacity 0.2s linear; }\n    .dropzone .dz-preview .dz-remove {\n      font-size: 14px;\n      text-align: center;\n      display: block;\n      cursor: pointer;\n      border: none; }\n      .dropzone .dz-preview .dz-remove:hover {\n        text-decoration: underline; }\n    .dropzone .dz-preview:hover .dz-details {\n      opacity: 1; }\n    .dropzone .dz-preview .dz-details {\n      z-index: 20;\n      position: absolute;\n      top: 0;\n      left: 0;\n      opacity: 1;\n      font-size: 13px;\n      min-width: 100%;\n      max-width: 100%;\n      padding: 2em 1em;\n      text-align: center;\n      color: rgba($dark, 0.9);\n      line-height: 150%; }\n      .dropzone .dz-preview .dz-details .dz-size {\n        margin-bottom: 1em;\n        font-size: 16px; }\n      .dropzone .dz-preview .dz-details .dz-filename {\n        white-space: nowrap; }\n        .dropzone .dz-preview .dz-details .dz-filename:hover span {\n          border: 1px solid rgba(200, 200, 200, 0.8);\n          background-color: rgba(255, 255, 255, 0.8); }\n        .dropzone .dz-preview .dz-details .dz-filename:not(:hover) {\n          overflow: hidden;\n          text-overflow: ellipsis; }\n          .dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {\n            border: 1px solid transparent; }\n      .dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {\n        background-color: rgba(255, 255, 255, 0.7);\n        padding: 0 0.4em;\n        border-radius: 3px; }\n    .dropzone .dz-preview:hover .dz-image img {\n      -webkit-transform: scale(1.05, 1.05);\n      -moz-transform: scale(1.05, 1.05);\n      -ms-transform: scale(1.05, 1.05);\n      -o-transform: scale(1.05, 1.05);\n      transform: scale(1.05, 1.05);\n      -webkit-filter: blur(8px);\n      filter: blur(8px); }\n    .dropzone .dz-preview .dz-image {\n      border-radius: 20px;\n      overflow: hidden;\n      width: 120px;\n      height: 120px;\n      position: relative;\n      display: block;\n      z-index: 10; }\n      .dropzone .dz-preview .dz-image img {\n        display: block; }\n    .dropzone .dz-preview.dz-success .dz-success-mark {\n      -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n      -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n      -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n      -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);\n      animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }\n    .dropzone .dz-preview.dz-error .dz-error-mark {\n      opacity: 1;\n      -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n      -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n      -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n      -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);\n      animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }\n    .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {\n      pointer-events: none;\n      opacity: 0;\n      z-index: 500;\n      position: absolute;\n      display: block;\n      top: 53%;\n      left: 50%;\n      margin-left: -27px;\n      margin-top: -27px; }\n      .dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {\n        display: block;\n        width: 54px;\n        height: 54px; }\n    .dropzone .dz-preview.dz-processing .dz-progress {\n      opacity: 1;\n      -webkit-transition: all 0.2s linear;\n      -moz-transition: all 0.2s linear;\n      -ms-transition: all 0.2s linear;\n      -o-transition: all 0.2s linear;\n      transition: all 0.2s linear; }\n    .dropzone .dz-preview.dz-complete .dz-progress {\n      opacity: 0;\n      -webkit-transition: opacity 0.4s ease-in;\n      -moz-transition: opacity 0.4s ease-in;\n      -ms-transition: opacity 0.4s ease-in;\n      -o-transition: opacity 0.4s ease-in;\n      transition: opacity 0.4s ease-in; }\n    .dropzone .dz-preview:not(.dz-processing) .dz-progress {\n      -webkit-animation: pulse 6s ease infinite;\n      -moz-animation: pulse 6s ease infinite;\n      -ms-animation: pulse 6s ease infinite;\n      -o-animation: pulse 6s ease infinite;\n      animation: pulse 6s ease infinite; }\n    .dropzone .dz-preview .dz-progress {\n      opacity: 1;\n      z-index: 1000;\n      pointer-events: none;\n      position: absolute;\n      height: 16px;\n      left: 50%;\n      top: 50%;\n      margin-top: -8px;\n      width: 80px;\n      margin-left: -40px;\n      background: rgba(255, 255, 255, 0.9);\n      -webkit-transform: scale(1);\n      border-radius: 8px;\n      overflow: hidden; }\n      .dropzone .dz-preview .dz-progress .dz-upload {\n        background: #333;\n        background: linear-gradient(to bottom, #666, #444);\n        position: absolute;\n        top: 0;\n        left: 0;\n        bottom: 0;\n        width: 0;\n        -webkit-transition: width 300ms ease-in-out;\n        -moz-transition: width 300ms ease-in-out;\n        -ms-transition: width 300ms ease-in-out;\n        -o-transition: width 300ms ease-in-out;\n        transition: width 300ms ease-in-out; }\n    .dropzone .dz-preview.dz-error .dz-error-message {\n      display: none; }\n    .dropzone .dz-preview.dz-error:hover .dz-error-message {\n      opacity: 1;\n      pointer-events: auto; }\n    .dropzone .dz-preview .dz-error-message {\n      pointer-events: none;\n      z-index: 1000;\n      position: absolute;\n      display: block;\n      display: none;\n      opacity: 0;\n      -webkit-transition: opacity 0.3s ease;\n      -moz-transition: opacity 0.3s ease;\n      -ms-transition: opacity 0.3s ease;\n      -o-transition: opacity 0.3s ease;\n      transition: opacity 0.3s ease;\n      border-radius: 8px;\n      font-size: 13px;\n      top: 130px;\n      left: -10px;\n      width: 140px;\n      background: #be2626;\n      background: linear-gradient(to bottom, #be2626, #a92222);\n      padding: 0.5em 1.2em;\n      color: white; }\n      .dropzone .dz-preview .dz-error-message:after {\n        content: '';\n        position: absolute;\n        top: -6px;\n        left: 64px;\n        width: 0;\n        height: 0;\n        border-left: 6px solid transparent;\n        border-right: 6px solid transparent;\n        border-bottom: 6px solid #be2626; }\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_fullcalendar-extend.scss",
    "content": "/*!\nFullCalendar v5.6.0\nDocs & License: https://fullcalendar.io/\n(c) 2020 Adam Shaw\n*/\n\n// Creative Tim Changes\n\n.fc-theme-standard .fc-scrollgrid,\n.fc-scrollgrid {\n  border: none;\n}\n\n.fc-theme-standard td,\n.fc-theme-standard th {\n  border-color: $gray-200;\n}\n\n.fc-theme-standard thead tr th{\n  border-right: none;\n  border-left: none;\n}\n\n.fc-theme-standard td{\n  &:last-child{\n    border-right: none;\n  }\n}\n\n.fc-theme-standard tr{\n  &:last-child td{\n    border-bottom: none;\n  }\n}\n\n.fc-h-event{\n  border: none;\n}\n\n.fc-daygrid-block-event .fc-event-time,\n.fc-daygrid-block-event .fc-event-title{\n  font-weight: $font-weight-normal;\n  font-size: $font-size-xs;\n  line-height: $line-height-sm;\n  padding: $fc-event-title-padding-y $fc-event-title-padding-x;\n}\n\n.fc .fc-daygrid-body-natural .fc-daygrid-day-events{\n  margin-bottom: 0;\n}\n\n.fc .fc-col-header-cell-cushion{\n  font-size: $font-size-sm;\n  font-weight: $font-weight-bold;\n  color: $gray-500;\n}\n\n.fc .fc-daygrid-day-number{\n  color: $gray-700;\n  font-size: $font-size-sm;\n  font-weight: $font-weight-light;\n  width: 100%;\n  text-align: center;\n}\n\n.fc .fc-toolbar-title{\n  font-size: $font-size-lg;\n}\n\n.fc .fc-button{\n  font-size: $font-size-sm;\n  padding-top: $spacer/4;\n  box-shadow: $btn-box-shadow;\n  transition: $btn-transition;\n  .fc-icon{\n    font-size: $font-size-sm;\n  }\n}\n\n.fc .fc-button-primary{\n  background-color: $primary;\n  border-color: $primary;\n  &:hover,\n  &:focus,\n  &:not(:disabled):active,\n  &:not(:disabled):active:focus{\n    transform: $btn-hover-transform;\n    box-shadow: $btn-hover-box-shadow;\n    background-color: $primary;\n    border-color: $primary;\n  }\n}\n\n.fc-event.fc-daygrid-event{\n  border-radius: $fc-daygrid-event-border-radius;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_fullcalendar.scss",
    "content": "/*!\nFullCalendar v5.6.0\nDocs & License: https://fullcalendar.io/\n(c) 2020 Adam Shaw\n*/\n/* classes attached to <body> */\n\n/* classes attached to <body> */\n\n.fc-not-allowed,\n.fc-not-allowed .fc-event { /* override events' custom cursors */\n  cursor: not-allowed;\n}\n\n.fc-unselectable {\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  -webkit-touch-callout: none;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n.fc {\n  /* layout of immediate children */\n  display: flex;\n  flex-direction: column;\n\n  font-size: 1em\n}\n.fc,\n  .fc *,\n  .fc *:before,\n  .fc *:after {\n    box-sizing: border-box;\n  }\n.fc table {\n    border-collapse: collapse;\n    border-spacing: 0;\n    font-size: 1em; /* normalize cross-browser */\n  }\n.fc th {\n    text-align: center;\n  }\n.fc th,\n  .fc td {\n    vertical-align: top;\n    padding: 0;\n  }\n.fc a[data-navlink] {\n    cursor: pointer;\n  }\n.fc a[data-navlink]:hover {\n    text-decoration: underline;\n  }\n.fc-direction-ltr {\n  direction: ltr;\n  text-align: left;\n}\n.fc-direction-rtl {\n  direction: rtl;\n  text-align: right;\n}\n.fc-theme-standard td,\n  .fc-theme-standard th {\n    border: 1px solid #ddd;\n    border: 1px solid var(--fc-border-color, #ddd);\n  }\n/* for FF, which doesn't expand a 100% div within a table cell. use absolute positioning */\n/* inner-wrappers are responsible for being absolute */\n/* TODO: best place for this? */\n.fc-liquid-hack td,\n  .fc-liquid-hack th {\n    position: relative;\n  }\n\n@font-face {\n  font-family: 'fcicons';\n  src: url(\"data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBfAAAAC8AAAAYGNtYXAXVtKNAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5ZgYydxIAAAF4AAAFNGhlYWQUJ7cIAAAGrAAAADZoaGVhB20DzAAABuQAAAAkaG10eCIABhQAAAcIAAAALGxvY2ED4AU6AAAHNAAAABhtYXhwAA8AjAAAB0wAAAAgbmFtZXsr690AAAdsAAABhnBvc3QAAwAAAAAI9AAAACAAAwPAAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpBgPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6Qb//f//AAAAAAAg6QD//f//AAH/4xcEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAWIAjQKeAskAEwAAJSc3NjQnJiIHAQYUFwEWMjc2NCcCnuLiDQ0MJAz/AA0NAQAMJAwNDcni4gwjDQwM/wANIwz/AA0NDCMNAAAAAQFiAI0CngLJABMAACUBNjQnASYiBwYUHwEHBhQXFjI3AZ4BAA0N/wAMJAwNDeLiDQ0MJAyNAQAMIw0BAAwMDSMM4uINIwwNDQAAAAIA4gC3Ax4CngATACcAACUnNzY0JyYiDwEGFB8BFjI3NjQnISc3NjQnJiIPAQYUHwEWMjc2NCcB87e3DQ0MIw3VDQ3VDSMMDQ0BK7e3DQ0MJAzVDQ3VDCQMDQ3zuLcMJAwNDdUNIwzWDAwNIwy4twwkDA0N1Q0jDNYMDA0jDAAAAgDiALcDHgKeABMAJwAAJTc2NC8BJiIHBhQfAQcGFBcWMjchNzY0LwEmIgcGFB8BBwYUFxYyNwJJ1Q0N1Q0jDA0Nt7cNDQwjDf7V1Q0N1QwkDA0Nt7cNDQwkDLfWDCMN1Q0NDCQMt7gMIw0MDNYMIw3VDQ0MJAy3uAwjDQwMAAADAFUAAAOrA1UAMwBoAHcAABMiBgcOAQcOAQcOARURFBYXHgEXHgEXHgEzITI2Nz4BNz4BNz4BNRE0JicuAScuAScuASMFITIWFx4BFx4BFx4BFREUBgcOAQcOAQcOASMhIiYnLgEnLgEnLgE1ETQ2Nz4BNz4BNz4BMxMhMjY1NCYjISIGFRQWM9UNGAwLFQkJDgUFBQUFBQ4JCRULDBgNAlYNGAwLFQkJDgUFBQUFBQ4JCRULDBgN/aoCVgQIBAQHAwMFAQIBAQIBBQMDBwQECAT9qgQIBAQHAwMFAQIBAQIBBQMDBwQECASAAVYRGRkR/qoRGRkRA1UFBAUOCQkVDAsZDf2rDRkLDBUJCA4FBQUFBQUOCQgVDAsZDQJVDRkLDBUJCQ4FBAVVAgECBQMCBwQECAX9qwQJAwQHAwMFAQICAgIBBQMDBwQDCQQCVQUIBAQHAgMFAgEC/oAZEhEZGRESGQAAAAADAFUAAAOrA1UAMwBoAIkAABMiBgcOAQcOAQcOARURFBYXHgEXHgEXHgEzITI2Nz4BNz4BNz4BNRE0JicuAScuAScuASMFITIWFx4BFx4BFx4BFREUBgcOAQcOAQcOASMhIiYnLgEnLgEnLgE1ETQ2Nz4BNz4BNz4BMxMzFRQWMzI2PQEzMjY1NCYrATU0JiMiBh0BIyIGFRQWM9UNGAwLFQkJDgUFBQUFBQ4JCRULDBgNAlYNGAwLFQkJDgUFBQUFBQ4JCRULDBgN/aoCVgQIBAQHAwMFAQIBAQIBBQMDBwQECAT9qgQIBAQHAwMFAQIBAQIBBQMDBwQECASAgBkSEhmAERkZEYAZEhIZgBEZGREDVQUEBQ4JCRUMCxkN/asNGQsMFQkIDgUFBQUFBQ4JCBUMCxkNAlUNGQsMFQkJDgUEBVUCAQIFAwIHBAQIBf2rBAkDBAcDAwUBAgICAgEFAwMHBAMJBAJVBQgEBAcCAwUCAQL+gIASGRkSgBkSERmAEhkZEoAZERIZAAABAOIAjQMeAskAIAAAExcHBhQXFjI/ARcWMjc2NC8BNzY0JyYiDwEnJiIHBhQX4uLiDQ0MJAzi4gwkDA0N4uINDQwkDOLiDCQMDQ0CjeLiDSMMDQ3h4Q0NDCMN4uIMIw0MDOLiDAwNIwwAAAABAAAAAQAAa5n0y18PPPUACwQAAAAAANivOVsAAAAA2K85WwAAAAADqwNVAAAACAACAAAAAAAAAAEAAAPA/8AAAAQAAAAAAAOrAAEAAAAAAAAAAAAAAAAAAAALBAAAAAAAAAAAAAAAAgAAAAQAAWIEAAFiBAAA4gQAAOIEAABVBAAAVQQAAOIAAAAAAAoAFAAeAEQAagCqAOoBngJkApoAAQAAAAsAigADAAAAAAACAAAAAAAAAAAAAAAAAAAAAAAAAA4ArgABAAAAAAABAAcAAAABAAAAAAACAAcAYAABAAAAAAADAAcANgABAAAAAAAEAAcAdQABAAAAAAAFAAsAFQABAAAAAAAGAAcASwABAAAAAAAKABoAigADAAEECQABAA4ABwADAAEECQACAA4AZwADAAEECQADAA4APQADAAEECQAEAA4AfAADAAEECQAFABYAIAADAAEECQAGAA4AUgADAAEECQAKADQApGZjaWNvbnMAZgBjAGkAYwBvAG4Ac1ZlcnNpb24gMS4wAFYAZQByAHMAaQBvAG4AIAAxAC4AMGZjaWNvbnMAZgBjAGkAYwBvAG4Ac2ZjaWNvbnMAZgBjAGkAYwBvAG4Ac1JlZ3VsYXIAUgBlAGcAdQBsAGEAcmZjaWNvbnMAZgBjAGkAYwBvAG4Ac0ZvbnQgZ2VuZXJhdGVkIGJ5IEljb01vb24uAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=\") format('truetype');\n  font-weight: normal;\n  font-style: normal;\n}\n\n.fc-icon {\n  /* added for fc */\n  display: inline-block;\n  width: 1em;\n  height: 1em;\n  text-align: center;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n\n  /* use !important to prevent issues with browser extensions that change fonts */\n  font-family: 'fcicons' !important;\n  speak: none;\n  font-style: normal;\n  font-weight: normal;\n  font-variant: normal;\n  text-transform: none;\n  line-height: 1;\n\n  /* Better Font Rendering =========== */\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n.fc-icon-chevron-left:before {\n  content: \"\\e900\";\n}\n\n.fc-icon-chevron-right:before {\n  content: \"\\e901\";\n}\n\n.fc-icon-chevrons-left:before {\n  content: \"\\e902\";\n}\n\n.fc-icon-chevrons-right:before {\n  content: \"\\e903\";\n}\n\n.fc-icon-minus-square:before {\n  content: \"\\e904\";\n}\n\n.fc-icon-plus-square:before {\n  content: \"\\e905\";\n}\n\n.fc-icon-x:before {\n  content: \"\\e906\";\n}\n/*\nLots taken from Flatly (MIT): https://bootswatch.com/4/flatly/bootstrap.css\n\nThese styles only apply when the standard-theme is activated.\nWhen it's NOT activated, the fc-button classes won't even be in the DOM.\n*/\n.fc {\n\n  /* reset */\n\n}\n.fc .fc-button {\n    border-radius: 0;\n    overflow: visible;\n    text-transform: none;\n    margin: 0;\n    font-family: inherit;\n    font-size: inherit;\n    line-height: inherit;\n  }\n.fc .fc-button:focus {\n    outline: 1px dotted;\n    outline: 5px auto -webkit-focus-ring-color;\n  }\n.fc .fc-button {\n    -webkit-appearance: button;\n  }\n.fc .fc-button:not(:disabled) {\n    cursor: pointer;\n  }\n.fc .fc-button::-moz-focus-inner {\n    padding: 0;\n    border-style: none;\n  }\n.fc {\n\n  /* theme */\n\n}\n.fc .fc-button {\n    display: inline-block;\n    font-weight: 400;\n    text-align: center;\n    vertical-align: middle;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    background-color: transparent;\n    border: 1px solid transparent;\n    padding: 0.4em 0.65em;\n    font-size: 1em;\n    line-height: 1.5;\n    border-radius: 0.25em;\n  }\n.fc .fc-button:hover {\n    text-decoration: none;\n  }\n.fc .fc-button:focus {\n    outline: 0;\n    box-shadow: 0 0 0 0.2rem rgba(44, 62, 80, 0.25);\n  }\n.fc .fc-button:disabled {\n    opacity: 0.65;\n  }\n.fc {\n\n  /* \"primary\" coloring */\n\n}\n.fc .fc-button-primary {\n    color: #fff;\n    color: var(--fc-button-text-color, #fff);\n    background-color: #2C3E50;\n    background-color: var(--fc-button-bg-color, #2C3E50);\n    border-color: #2C3E50;\n    border-color: var(--fc-button-border-color, #2C3E50);\n  }\n.fc .fc-button-primary:hover {\n    color: #fff;\n    color: var(--fc-button-text-color, #fff);\n    background-color: #1e2b37;\n    background-color: var(--fc-button-hover-bg-color, #1e2b37);\n    border-color: #1a252f;\n    border-color: var(--fc-button-hover-border-color, #1a252f);\n  }\n.fc .fc-button-primary:disabled { /* not DRY */\n    color: #fff;\n    color: var(--fc-button-text-color, #fff);\n    background-color: #2C3E50;\n    background-color: var(--fc-button-bg-color, #2C3E50);\n    border-color: #2C3E50;\n    border-color: var(--fc-button-border-color, #2C3E50); /* overrides :hover */\n  }\n.fc .fc-button-primary:focus {\n    box-shadow: 0 0 0 0.2rem rgba(76, 91, 106, 0.5);\n  }\n.fc .fc-button-primary:not(:disabled):active,\n  .fc .fc-button-primary:not(:disabled).fc-button-active {\n    color: #fff;\n    color: var(--fc-button-text-color, #fff);\n    background-color: #1a252f;\n    background-color: var(--fc-button-active-bg-color, #1a252f);\n    border-color: #151e27;\n    border-color: var(--fc-button-active-border-color, #151e27);\n  }\n.fc .fc-button-primary:not(:disabled):active:focus,\n  .fc .fc-button-primary:not(:disabled).fc-button-active:focus {\n    box-shadow: 0 0 0 0.2rem rgba(76, 91, 106, 0.5);\n  }\n.fc {\n\n  /* icons within buttons */\n\n}\n.fc .fc-button .fc-icon {\n    vertical-align: middle;\n    font-size: 1.5em; /* bump up the size (but don't make it bigger than line-height of button, which is 1.5em also) */\n  }\n.fc .fc-button-group {\n    position: relative;\n    display: inline-flex;\n    vertical-align: middle;\n  }\n.fc .fc-button-group > .fc-button {\n    position: relative;\n    flex: 1 1 auto;\n  }\n.fc .fc-button-group > .fc-button:hover {\n    z-index: 1;\n  }\n.fc .fc-button-group > .fc-button:focus,\n  .fc .fc-button-group > .fc-button:active,\n  .fc .fc-button-group > .fc-button.fc-button-active {\n    z-index: 1;\n  }\n.fc-direction-ltr .fc-button-group > .fc-button:not(:first-child) {\n    margin-left: -1px;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n.fc-direction-ltr .fc-button-group > .fc-button:not(:last-child) {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n.fc-direction-rtl .fc-button-group > .fc-button:not(:first-child) {\n    margin-right: -1px;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n.fc-direction-rtl .fc-button-group > .fc-button:not(:last-child) {\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n.fc .fc-toolbar {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n.fc .fc-toolbar.fc-header-toolbar {\n    margin-bottom: 1.5em;\n  }\n.fc .fc-toolbar.fc-footer-toolbar {\n    margin-top: 1.5em;\n  }\n.fc .fc-toolbar-title {\n    font-size: 1.75em;\n    margin: 0;\n  }\n.fc-direction-ltr .fc-toolbar > * > :not(:first-child) {\n    margin-left: .75em; /* space between */\n  }\n.fc-direction-rtl .fc-toolbar > * > :not(:first-child) {\n    margin-right: .75em; /* space between */\n  }\n.fc-direction-rtl .fc-toolbar-ltr { /* when the toolbar-chunk positioning system is explicitly left-to-right */\n    flex-direction: row-reverse;\n  }\n.fc .fc-scroller {\n    -webkit-overflow-scrolling: touch;\n    position: relative; /* for abs-positioned elements within */\n  }\n.fc .fc-scroller-liquid {\n    height: 100%;\n  }\n.fc .fc-scroller-liquid-absolute {\n    position: absolute;\n    top: 0;\n    right: 0;\n    left: 0;\n    bottom: 0;\n  }\n.fc .fc-scroller-harness {\n    position: relative;\n    overflow: hidden;\n    direction: ltr;\n      /* hack for chrome computing the scroller's right/left wrong for rtl. undone below... */\n      /* TODO: demonstrate in codepen */\n  }\n.fc .fc-scroller-harness-liquid {\n    height: 100%;\n  }\n.fc-direction-rtl .fc-scroller-harness > .fc-scroller { /* undo above hack */\n    direction: rtl;\n  }\n.fc-theme-standard .fc-scrollgrid {\n    border: 1px solid #ddd;\n    border: 1px solid var(--fc-border-color, #ddd); /* bootstrap does this. match */\n  }\n.fc .fc-scrollgrid,\n    .fc .fc-scrollgrid table { /* all tables (self included) */\n      width: 100%; /* because tables don't normally do this */\n      table-layout: fixed;\n    }\n.fc .fc-scrollgrid table { /* inner tables */\n      border-top-style: hidden;\n      border-left-style: hidden;\n      border-right-style: hidden;\n    }\n.fc .fc-scrollgrid {\n\n    border-collapse: separate;\n    border-right-width: 0;\n    border-bottom-width: 0;\n\n  }\n.fc .fc-scrollgrid-liquid {\n    height: 100%;\n  }\n.fc .fc-scrollgrid-section { /* a <tr> */\n    height: 1px /* better than 0, for firefox */\n\n  }\n.fc .fc-scrollgrid-section > td {\n      height: 1px; /* needs a height so inner div within grow. better than 0, for firefox */\n    }\n.fc .fc-scrollgrid-section table {\n      height: 1px;\n        /* for most browsers, if a height isn't set on the table, can't do liquid-height within cells */\n        /* serves as a min-height. harmless */\n    }\n.fc .fc-scrollgrid-section-liquid {\n    height: auto\n\n  }\n.fc .fc-scrollgrid-section-liquid > td {\n      height: 100%; /* better than `auto`, for firefox */\n    }\n.fc .fc-scrollgrid-section > * {\n    border-top-width: 0;\n    border-left-width: 0;\n  }\n.fc .fc-scrollgrid-section-header > *,\n  .fc .fc-scrollgrid-section-footer > * {\n    border-bottom-width: 0;\n  }\n.fc .fc-scrollgrid-section-body table,\n  .fc .fc-scrollgrid-section-footer table {\n    border-bottom-style: hidden; /* head keeps its bottom border tho */\n  }\n.fc {\n\n  /* stickiness */\n\n}\n.fc .fc-scrollgrid-section-sticky > * {\n    background: #fff;\n    background: var(--fc-page-bg-color, #fff);\n    position: -webkit-sticky;\n    position: sticky;\n    z-index: 2; /* TODO: var */\n    /* TODO: box-shadow when sticking */\n  }\n.fc .fc-scrollgrid-section-header.fc-scrollgrid-section-sticky > * {\n    top: 0; /* because border-sharing causes a gap at the top */\n      /* TODO: give safari -1. has bug */\n  }\n.fc .fc-scrollgrid-section-footer.fc-scrollgrid-section-sticky > * {\n    bottom: 0; /* known bug: bottom-stickiness doesn't work in safari */\n  }\n.fc .fc-scrollgrid-sticky-shim { /* for horizontal scrollbar */\n    height: 1px; /* needs height to create scrollbars */\n    margin-bottom: -1px;\n  }\n.fc-sticky { /* no .fc wrap because used as child of body */\n  position: -webkit-sticky;\n  position: sticky;\n}\n.fc .fc-view-harness {\n    flex-grow: 1; /* because this harness is WITHIN the .fc's flexbox */\n    position: relative;\n  }\n.fc {\n\n  /* when the harness controls the height, make the view liquid */\n\n}\n.fc .fc-view-harness-active > .fc-view {\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n  }\n.fc .fc-col-header-cell-cushion {\n    display: inline-block; /* x-browser for when sticky (when multi-tier header) */\n    padding: 2px 4px;\n  }\n.fc .fc-bg-event,\n  .fc .fc-non-business,\n  .fc .fc-highlight {\n    /* will always have a harness with position:relative/absolute, so absolutely expand */\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n  }\n.fc .fc-non-business {\n    background: rgba(215, 215, 215, 0.3);\n    background: var(--fc-non-business-color, rgba(215, 215, 215, 0.3));\n  }\n.fc .fc-bg-event {\n    background: rgb(143, 223, 130);\n    background: var(--fc-bg-event-color, rgb(143, 223, 130));\n    opacity: 0.3;\n    opacity: var(--fc-bg-event-opacity, 0.3)\n  }\n.fc .fc-bg-event .fc-event-title {\n      margin: .5em;\n      font-size: .85em;\n      font-size: var(--fc-small-font-size, .85em);\n      font-style: italic;\n    }\n.fc .fc-highlight {\n    background: rgba(188, 232, 241, 0.3);\n    background: var(--fc-highlight-color, rgba(188, 232, 241, 0.3));\n  }\n.fc .fc-cell-shaded,\n  .fc .fc-day-disabled {\n    background: rgba(208, 208, 208, 0.3);\n    background: var(--fc-neutral-bg-color, rgba(208, 208, 208, 0.3));\n  }\n/* link resets */\n/* ---------------------------------------------------------------------------------------------------- */\na.fc-event,\na.fc-event:hover {\n  text-decoration: none;\n}\n/* cursor */\n.fc-event[href],\n.fc-event.fc-event-draggable {\n  cursor: pointer;\n}\n/* event text content */\n/* ---------------------------------------------------------------------------------------------------- */\n.fc-event .fc-event-main {\n    position: relative;\n    z-index: 2;\n  }\n/* dragging */\n/* ---------------------------------------------------------------------------------------------------- */\n.fc-event-dragging:not(.fc-event-selected) { /* MOUSE */\n    opacity: 0.75;\n  }\n.fc-event-dragging.fc-event-selected { /* TOUCH */\n    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.3);\n  }\n/* resizing */\n/* ---------------------------------------------------------------------------------------------------- */\n/* (subclasses should hone positioning for touch and non-touch) */\n.fc-event .fc-event-resizer {\n    display: none;\n    position: absolute;\n    z-index: 4;\n  }\n.fc-event:hover, /* MOUSE */\n.fc-event-selected { /* TOUCH */\n\n}\n.fc-event:hover .fc-event-resizer, .fc-event-selected .fc-event-resizer {\n    display: block;\n  }\n.fc-event-selected .fc-event-resizer {\n    border-radius: 4px;\n    border-radius: calc(var(--fc-event-resizer-dot-total-width, 8px) / 2);\n    border-width: 1px;\n    border-width: var(--fc-event-resizer-dot-border-width, 1px);\n    width: 8px;\n    width: var(--fc-event-resizer-dot-total-width, 8px);\n    height: 8px;\n    height: var(--fc-event-resizer-dot-total-width, 8px);\n    border-style: solid;\n    border-color: inherit;\n    background: #fff;\n    background: var(--fc-page-bg-color, #fff)\n\n    /* expand hit area */\n\n  }\n.fc-event-selected .fc-event-resizer:before {\n      content: '';\n      position: absolute;\n      top: -20px;\n      left: -20px;\n      right: -20px;\n      bottom: -20px;\n    }\n/* selecting (always TOUCH) */\n/* ---------------------------------------------------------------------------------------------------- */\n.fc-event-selected {\n  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2)\n\n  /* expand hit area (subclasses should expand) */\n\n}\n.fc-event-selected:before {\n    content: \"\";\n    position: absolute;\n    z-index: 3;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n  }\n.fc-event-selected {\n\n  /* dimmer effect */\n\n}\n.fc-event-selected:after {\n    content: \"\";\n    background: rgba(0, 0, 0, 0.25);\n    background: var(--fc-event-selected-overlay-color, rgba(0, 0, 0, 0.25));\n    position: absolute;\n    z-index: 1;\n\n    /* assume there's a border on all sides. overcome it. */\n    /* sometimes there's NOT a border, in which case the dimmer will go over */\n    /* an adjacent border, which looks fine. */\n    top: -1px;\n    left: -1px;\n    right: -1px;\n    bottom: -1px;\n  }\n/*\nA HORIZONTAL event\n*/\n.fc-h-event { /* allowed to be top-level */\n  display: block;\n  border: 1px solid #3788d8;\n  border: 1px solid var(--fc-event-border-color, #3788d8);\n  background-color: #3788d8;\n  background-color: var(--fc-event-bg-color, #3788d8)\n\n}\n.fc-h-event .fc-event-main {\n    color: #fff;\n    color: var(--fc-event-text-color, #fff);\n  }\n.fc-h-event .fc-event-main-frame {\n    display: flex; /* for make fc-event-title-container expand */\n  }\n.fc-h-event .fc-event-time {\n    max-width: 100%; /* clip overflow on this element */\n    overflow: hidden;\n  }\n.fc-h-event .fc-event-title-container { /* serves as a container for the sticky cushion */\n    flex-grow: 1;\n    flex-shrink: 1;\n    min-width: 0; /* important for allowing to shrink all the way */\n  }\n.fc-h-event .fc-event-title {\n    display: inline-block; /* need this to be sticky cross-browser */\n    vertical-align: top; /* for not messing up line-height */\n    left: 0;  /* for sticky */\n    right: 0; /* for sticky */\n    max-width: 100%; /* clip overflow on this element */\n    overflow: hidden;\n  }\n.fc-h-event.fc-event-selected:before {\n    /* expand hit area */\n    top: -10px;\n    bottom: -10px;\n  }\n/* adjust border and border-radius (if there is any) for non-start/end */\n.fc-direction-ltr .fc-daygrid-block-event:not(.fc-event-start),\n.fc-direction-rtl .fc-daygrid-block-event:not(.fc-event-end) {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  border-left-width: 0;\n}\n.fc-direction-ltr .fc-daygrid-block-event:not(.fc-event-end),\n.fc-direction-rtl .fc-daygrid-block-event:not(.fc-event-start) {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n  border-right-width: 0;\n}\n/* resizers */\n.fc-h-event:not(.fc-event-selected) .fc-event-resizer {\n  top: 0;\n  bottom: 0;\n  width: 8px;\n  width: var(--fc-event-resizer-thickness, 8px);\n}\n.fc-direction-ltr .fc-h-event:not(.fc-event-selected) .fc-event-resizer-start,\n.fc-direction-rtl .fc-h-event:not(.fc-event-selected) .fc-event-resizer-end {\n  cursor: w-resize;\n  left: -4px;\n  left: calc(var(--fc-event-resizer-thickness, 8px) / -2);\n}\n.fc-direction-ltr .fc-h-event:not(.fc-event-selected) .fc-event-resizer-end,\n.fc-direction-rtl .fc-h-event:not(.fc-event-selected) .fc-event-resizer-start {\n  cursor: e-resize;\n  right: -4px;\n  right: calc(var(--fc-event-resizer-thickness, 8px) / -2);\n}\n/* resizers for TOUCH */\n.fc-h-event.fc-event-selected .fc-event-resizer {\n  top: 50%;\n  margin-top: -4px;\n  margin-top: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2);\n}\n.fc-direction-ltr .fc-h-event.fc-event-selected .fc-event-resizer-start,\n.fc-direction-rtl .fc-h-event.fc-event-selected .fc-event-resizer-end {\n  left: -4px;\n  left: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2);\n}\n.fc-direction-ltr .fc-h-event.fc-event-selected .fc-event-resizer-end,\n.fc-direction-rtl .fc-h-event.fc-event-selected .fc-event-resizer-start {\n  right: -4px;\n  right: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2);\n}\n\n\n:root {\n  --fc-daygrid-event-dot-width: 8px;\n}\n.fc .fc-popover {\n    position: fixed;\n    top: 0; /* for when not positioned yet */\n    box-shadow: 0 2px 6px rgba(0,0,0,.15);\n  }\n.fc .fc-popover-header {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    align-items: center;\n    padding: 3px 4px;\n  }\n.fc .fc-popover-title {\n    margin: 0 2px;\n  }\n.fc .fc-popover-close {\n    cursor: pointer;\n    opacity: 0.65;\n    font-size: 1.1em;\n  }\n.fc-theme-standard .fc-popover {\n    border: 1px solid #ddd;\n    border: 1px solid var(--fc-border-color, #ddd);\n    background: #fff;\n    background: var(--fc-page-bg-color, #fff);\n  }\n.fc-theme-standard .fc-popover-header {\n    background: rgba(208, 208, 208, 0.3);\n    background: var(--fc-neutral-bg-color, rgba(208, 208, 208, 0.3));\n  }\n/* help things clear margins of inner content */\n.fc-daygrid-day-frame,\n.fc-daygrid-day-events,\n.fc-daygrid-event-harness { /* for event top/bottom margins */\n}\n.fc-daygrid-day-frame:before, .fc-daygrid-day-events:before, .fc-daygrid-event-harness:before {\n  content: \"\";\n  clear: both;\n  display: table; }\n.fc-daygrid-day-frame:after, .fc-daygrid-day-events:after, .fc-daygrid-event-harness:after {\n  content: \"\";\n  clear: both;\n  display: table; }\n.fc .fc-daygrid-body { /* a <div> that wraps the table */\n    position: relative;\n    z-index: 1; /* container inner z-index's because <tr>s can't do it */\n  }\n.fc .fc-daygrid-day.fc-day-today {\n      background-color: rgba(255, 220, 40, 0.15);\n      background-color: var(--fc-today-bg-color, rgba(255, 220, 40, 0.15));\n    }\n.fc .fc-daygrid-day-frame {\n    position: relative;\n    min-height: 100%; /* seems to work better than `height` because sets height after rows/cells naturally do it */\n  }\n.fc {\n\n  /* cell top */\n\n}\n.fc .fc-daygrid-day-top {\n    display: flex;\n    flex-direction: row-reverse;\n  }\n.fc .fc-day-other .fc-daygrid-day-top {\n    opacity: 0.3;\n  }\n.fc {\n\n  /* day number (within cell top) */\n\n}\n.fc .fc-daygrid-day-number {\n    position: relative;\n    z-index: 4;\n    padding: 4px;\n  }\n.fc {\n\n  /* event container */\n\n}\n.fc .fc-daygrid-day-events {\n    margin-top: 1px; /* needs to be margin, not padding, so that available cell height can be computed */\n  }\n.fc {\n\n  /* positioning for balanced vs natural */\n\n}\n.fc .fc-daygrid-body-balanced .fc-daygrid-day-events {\n      position: absolute;\n      left: 0;\n      right: 0;\n    }\n.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events {\n      position: relative; /* for containing abs positioned event harnesses */\n      min-height: 2em; /* in addition to being a min-height during natural height, equalizes the heights a little bit */\n    }\n.fc .fc-daygrid-body-natural { /* can coexist with -unbalanced */\n  }\n.fc .fc-daygrid-body-natural .fc-daygrid-day-events {\n      margin-bottom: 1em;\n    }\n.fc {\n\n  /* event harness */\n\n}\n.fc .fc-daygrid-event-harness {\n    position: relative;\n  }\n.fc .fc-daygrid-event-harness-abs {\n    position: absolute;\n    top: 0; /* fallback coords for when cannot yet be computed */\n    left: 0; /* */\n    right: 0; /* */\n  }\n.fc .fc-daygrid-bg-harness {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n  }\n.fc {\n\n  /* bg content */\n\n}\n.fc .fc-daygrid-day-bg .fc-non-business { z-index: 1 }\n.fc .fc-daygrid-day-bg .fc-bg-event { z-index: 2 }\n.fc .fc-daygrid-day-bg .fc-highlight { z-index: 3 }\n.fc {\n\n  /* events */\n\n}\n.fc .fc-daygrid-event {\n    z-index: 6;\n    margin-top: 1px;\n  }\n.fc .fc-daygrid-event.fc-event-mirror {\n    z-index: 7;\n  }\n.fc {\n\n  /* cell bottom (within day-events) */\n\n}\n.fc .fc-daygrid-day-bottom {\n    font-size: .85em;\n    margin: 2px 3px 0;\n  }\n.fc .fc-daygrid-more-link {\n    position: relative;\n    z-index: 4;\n    cursor: pointer;\n  }\n.fc {\n\n  /* week number (within frame) */\n\n}\n.fc .fc-daygrid-week-number {\n    position: absolute;\n    z-index: 5;\n    top: 0;\n    padding: 2px;\n    min-width: 1.5em;\n    text-align: center;\n    background-color: rgba(208, 208, 208, 0.3);\n    background-color: var(--fc-neutral-bg-color, rgba(208, 208, 208, 0.3));\n    color: #808080;\n    color: var(--fc-neutral-text-color, #808080);\n  }\n.fc {\n\n  /* popover */\n\n}\n.fc .fc-more-popover {\n    z-index: 8;\n  }\n.fc .fc-more-popover .fc-popover-body {\n    min-width: 220px;\n    padding: 10px;\n  }\n.fc-direction-ltr .fc-daygrid-event.fc-event-start,\n.fc-direction-rtl .fc-daygrid-event.fc-event-end {\n  margin-left: 2px;\n}\n.fc-direction-ltr .fc-daygrid-event.fc-event-end,\n.fc-direction-rtl .fc-daygrid-event.fc-event-start {\n  margin-right: 2px;\n}\n.fc-direction-ltr .fc-daygrid-week-number {\n    left: 0;\n    border-radius: 0 0 3px 0;\n  }\n.fc-direction-rtl .fc-daygrid-week-number {\n    right: 0;\n    border-radius: 0 0 0 3px;\n  }\n.fc-liquid-hack .fc-daygrid-day-frame {\n    position: static; /* will cause inner absolute stuff to expand to <td> */\n  }\n.fc-daygrid-event { /* make root-level, because will be dragged-and-dropped outside of a component root */\n  position: relative; /* for z-indexes assigned later */\n  white-space: nowrap;\n  border-radius: 3px; /* dot event needs this to when selected */\n  font-size: .85em;\n  font-size: var(--fc-small-font-size, .85em);\n}\n/* --- the rectangle (\"block\") style of event --- */\n.fc-daygrid-block-event .fc-event-time {\n    font-weight: bold;\n  }\n.fc-daygrid-block-event .fc-event-time,\n  .fc-daygrid-block-event .fc-event-title {\n    padding: 1px;\n  }\n/* --- the dot style of event --- */\n.fc-daygrid-dot-event {\n  display: flex;\n  align-items: center;\n  padding: 2px 0\n\n}\n.fc-daygrid-dot-event .fc-event-title {\n    flex-grow: 1;\n    flex-shrink: 1;\n    min-width: 0; /* important for allowing to shrink all the way */\n    overflow: hidden;\n    font-weight: bold;\n  }\n.fc-daygrid-dot-event:hover,\n  .fc-daygrid-dot-event.fc-event-mirror {\n    background: rgba(0, 0, 0, 0.1);\n  }\n.fc-daygrid-dot-event.fc-event-selected:before {\n    /* expand hit area */\n    top: -10px;\n    bottom: -10px;\n  }\n.fc-daygrid-event-dot { /* the actual dot */\n  margin: 0 4px;\n  box-sizing: content-box;\n  width: 0;\n  height: 0;\n  border: 4px solid #3788d8;\n  border: calc(var(--fc-daygrid-event-dot-width, 8px) / 2) solid var(--fc-event-border-color, #3788d8);\n  border-radius: 4px;\n  border-radius: calc(var(--fc-daygrid-event-dot-width, 8px) / 2);\n}\n/* --- spacing between time and title --- */\n.fc-direction-ltr .fc-daygrid-event .fc-event-time {\n    margin-right: 3px;\n  }\n.fc-direction-rtl .fc-daygrid-event .fc-event-time {\n    margin-left: 3px;\n  }\n\n\n/*\nA VERTICAL event\n*/\n\n.fc-v-event { /* allowed to be top-level */\n  display: block;\n  border: 1px solid #3788d8;\n  border: 1px solid var(--fc-event-border-color, #3788d8);\n  background-color: #3788d8;\n  background-color: var(--fc-event-bg-color, #3788d8)\n\n}\n\n.fc-v-event .fc-event-main {\n    color: #fff;\n    color: var(--fc-event-text-color, #fff);\n    height: 100%;\n  }\n\n.fc-v-event .fc-event-main-frame {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n  }\n\n.fc-v-event .fc-event-time {\n    flex-grow: 0;\n    flex-shrink: 0;\n    max-height: 100%;\n    overflow: hidden;\n  }\n\n.fc-v-event .fc-event-title-container { /* a container for the sticky cushion */\n    flex-grow: 1;\n    flex-shrink: 1;\n    min-height: 0; /* important for allowing to shrink all the way */\n  }\n\n.fc-v-event .fc-event-title { /* will have fc-sticky on it */\n    top: 0;\n    bottom: 0;\n    max-height: 100%; /* clip overflow */\n    overflow: hidden;\n  }\n\n.fc-v-event:not(.fc-event-start) {\n    border-top-width: 0;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n\n.fc-v-event:not(.fc-event-end) {\n    border-bottom-width: 0;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n\n.fc-v-event.fc-event-selected:before {\n    /* expand hit area */\n    left: -10px;\n    right: -10px;\n  }\n\n.fc-v-event {\n\n  /* resizer (mouse AND touch) */\n\n}\n\n.fc-v-event .fc-event-resizer-start {\n    cursor: n-resize;\n  }\n\n.fc-v-event .fc-event-resizer-end {\n    cursor: s-resize;\n  }\n\n.fc-v-event {\n\n  /* resizer for MOUSE */\n\n}\n\n.fc-v-event:not(.fc-event-selected) .fc-event-resizer {\n      height: 8px;\n      height: var(--fc-event-resizer-thickness, 8px);\n      left: 0;\n      right: 0;\n    }\n\n.fc-v-event:not(.fc-event-selected) .fc-event-resizer-start {\n      top: -4px;\n      top: calc(var(--fc-event-resizer-thickness, 8px) / -2);\n    }\n\n.fc-v-event:not(.fc-event-selected) .fc-event-resizer-end {\n      bottom: -4px;\n      bottom: calc(var(--fc-event-resizer-thickness, 8px) / -2);\n    }\n\n.fc-v-event {\n\n  /* resizer for TOUCH (when event is \"selected\") */\n\n}\n\n.fc-v-event.fc-event-selected .fc-event-resizer {\n      left: 50%;\n      margin-left: -4px;\n      margin-left: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2);\n    }\n\n.fc-v-event.fc-event-selected .fc-event-resizer-start {\n      top: -4px;\n      top: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2);\n    }\n\n.fc-v-event.fc-event-selected .fc-event-resizer-end {\n      bottom: -4px;\n      bottom: calc(var(--fc-event-resizer-dot-total-width, 8px) / -2);\n    }\n.fc .fc-timegrid .fc-daygrid-body { /* the all-day daygrid within the timegrid view */\n    z-index: 2; /* put above the timegrid-body so that more-popover is above everything. TODO: better solution */\n  }\n.fc .fc-timegrid-divider {\n    padding: 0 0 2px; /* browsers get confused when you set height. use padding instead */\n  }\n.fc .fc-timegrid-body {\n    position: relative;\n    z-index: 1; /* scope the z-indexes of slots and cols */\n    min-height: 100%; /* fill height always, even when slat table doesn't grow */\n  }\n.fc .fc-timegrid-axis-chunk { /* for advanced ScrollGrid */\n    position: relative /* offset parent for now-indicator-container */\n\n  }\n.fc .fc-timegrid-axis-chunk > table {\n      position: relative;\n      z-index: 1; /* above the now-indicator-container */\n    }\n.fc .fc-timegrid-slots {\n    position: relative;\n    z-index: 1;\n  }\n.fc .fc-timegrid-slot { /* a <td> */\n    height: 1.5em;\n    border-bottom: 0 /* each cell owns its top border */\n  }\n.fc .fc-timegrid-slot:empty:before {\n      content: '\\00a0'; /* make sure there's at least an empty space to create height for height syncing */\n    }\n.fc .fc-timegrid-slot-minor {\n    border-top-style: dotted;\n  }\n.fc .fc-timegrid-slot-label-cushion {\n    display: inline-block;\n    white-space: nowrap;\n  }\n.fc .fc-timegrid-slot-label {\n    vertical-align: middle; /* vertical align the slots */\n  }\n.fc {\n\n\n  /* slots AND axis cells (top-left corner of view including the \"all-day\" text) */\n\n}\n.fc .fc-timegrid-axis-cushion,\n  .fc .fc-timegrid-slot-label-cushion {\n    padding: 0 4px;\n  }\n.fc {\n\n\n  /* axis cells (top-left corner of view including the \"all-day\" text) */\n  /* vertical align is more complicated, uses flexbox */\n\n}\n.fc .fc-timegrid-axis-frame-liquid {\n    height: 100%; /* will need liquid-hack in FF */\n  }\n.fc .fc-timegrid-axis-frame {\n    overflow: hidden;\n    display: flex;\n    align-items: center; /* vertical align */\n    justify-content: flex-end; /* horizontal align. matches text-align below */\n  }\n.fc .fc-timegrid-axis-cushion {\n    max-width: 60px; /* limits the width of the \"all-day\" text */\n    flex-shrink: 0; /* allows text to expand how it normally would, regardless of constrained width */\n  }\n.fc-direction-ltr .fc-timegrid-slot-label-frame {\n    text-align: right;\n  }\n.fc-direction-rtl .fc-timegrid-slot-label-frame {\n    text-align: left;\n  }\n.fc-liquid-hack .fc-timegrid-axis-frame-liquid {\n  height: auto;\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  }\n.fc .fc-timegrid-col.fc-day-today {\n      background-color: rgba(255, 220, 40, 0.15);\n      background-color: var(--fc-today-bg-color, rgba(255, 220, 40, 0.15));\n    }\n.fc .fc-timegrid-col-frame {\n    min-height: 100%; /* liquid-hack is below */\n    position: relative;\n  }\n.fc-liquid-hack .fc-timegrid-col-frame {\n  height: auto;\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  }\n.fc-media-screen .fc-timegrid-cols {\n    position: absolute; /* no z-index. children will decide and go above slots */\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0\n  }\n.fc-media-screen .fc-timegrid-cols > table {\n      height: 100%;\n    }\n.fc-media-screen .fc-timegrid-col-bg,\n  .fc-media-screen .fc-timegrid-col-events,\n  .fc-media-screen .fc-timegrid-now-indicator-container {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n  }\n.fc-media-screen .fc-timegrid-event-harness {\n    position: absolute; /* top/left/right/bottom will all be set by JS */\n  }\n.fc {\n\n  /* bg */\n\n}\n.fc .fc-timegrid-col-bg {\n    z-index: 2; /* TODO: kill */\n  }\n.fc .fc-timegrid-col-bg .fc-non-business { z-index: 1 }\n.fc .fc-timegrid-col-bg .fc-bg-event { z-index: 2 }\n.fc .fc-timegrid-col-bg .fc-highlight { z-index: 3 }\n.fc .fc-timegrid-bg-harness {\n    position: absolute; /* top/bottom will be set by JS */\n    left: 0;\n    right: 0;\n  }\n.fc {\n\n  /* fg events */\n  /* (the mirror segs are put into a separate container with same classname, */\n  /* and they must be after the normal seg container to appear at a higher z-index) */\n\n}\n.fc .fc-timegrid-col-events {\n    z-index: 3;\n    /* child event segs have z-indexes that are scoped within this div */\n  }\n.fc {\n\n  /* now indicator */\n\n}\n.fc .fc-timegrid-now-indicator-container {\n    bottom: 0;\n    overflow: hidden; /* don't let overflow of lines/arrows cause unnecessary scrolling */\n    /* z-index is set on the individual elements */\n  }\n.fc-direction-ltr .fc-timegrid-col-events {\n    margin: 0 2.5% 0 2px;\n  }\n.fc-direction-rtl .fc-timegrid-col-events {\n    margin: 0 2px 0 2.5%;\n  }\n.fc-timegrid-event-harness-inset .fc-timegrid-event,\n.fc-timegrid-event.fc-event-mirror {\n  box-shadow: 0px 0px 0px 1px #fff;\n  box-shadow: 0px 0px 0px 1px var(--fc-page-bg-color, #fff);\n}\n.fc-timegrid-event { /* events need to be root */\n\n  font-size: .85em;\n\n  font-size: var(--fc-small-font-size, .85em);\n  border-radius: 3px\n\n}\n.fc-timegrid-event .fc-event-main {\n    padding: 1px 1px 0;\n  }\n.fc-timegrid-event .fc-event-time {\n    white-space: nowrap;\n    font-size: .85em;\n    font-size: var(--fc-small-font-size, .85em);\n    margin-bottom: 1px;\n  }\n.fc-timegrid-event-condensed .fc-event-main-frame {\n    flex-direction: row;\n    overflow: hidden;\n  }\n.fc-timegrid-event-condensed .fc-event-time:after {\n    content: '\\00a0-\\00a0'; /* dash surrounded by non-breaking spaces */\n  }\n.fc-timegrid-event-condensed .fc-event-title {\n    font-size: .85em;\n    font-size: var(--fc-small-font-size, .85em)\n  }\n.fc-media-screen .fc-timegrid-event {\n    position: absolute; /* absolute WITHIN the harness */\n    top: 0;\n    bottom: 1px; /* stay away from bottom slot line */\n    left: 0;\n    right: 0;\n  }\n.fc {\n\n  /* line */\n\n}\n.fc .fc-timegrid-now-indicator-line {\n    position: absolute;\n    z-index: 4;\n    left: 0;\n    right: 0;\n    border-style: solid;\n    border-color: red;\n    border-color: var(--fc-now-indicator-color, red);\n    border-width: 1px 0 0;\n  }\n.fc {\n\n  /* arrow */\n\n}\n.fc .fc-timegrid-now-indicator-arrow {\n    position: absolute;\n    z-index: 4;\n    margin-top: -5px; /* vertically center on top coordinate */\n    border-style: solid;\n    border-color: red;\n    border-color: var(--fc-now-indicator-color, red);\n  }\n.fc-direction-ltr .fc-timegrid-now-indicator-arrow {\n    left: 0;\n\n    /* triangle pointing right. TODO: mixin */\n    border-width: 5px 0 5px 6px;\n    border-top-color: transparent;\n    border-bottom-color: transparent;\n  }\n.fc-direction-rtl .fc-timegrid-now-indicator-arrow {\n    right: 0;\n\n    /* triangle pointing left. TODO: mixin */\n    border-width: 5px 6px 5px 0;\n    border-top-color: transparent;\n    border-bottom-color: transparent;\n  }\n\n\n:root {\n  --fc-list-event-dot-width: 10px;\n  --fc-list-event-hover-bg-color: #f5f5f5;\n}\n.fc-theme-standard .fc-list {\n    border: 1px solid #ddd;\n    border: 1px solid var(--fc-border-color, #ddd);\n  }\n.fc {\n\n  /* message when no events */\n\n}\n.fc .fc-list-empty {\n    background-color: rgba(208, 208, 208, 0.3);\n    background-color: var(--fc-neutral-bg-color, rgba(208, 208, 208, 0.3));\n    height: 100%;\n    display: flex;\n    justify-content: center;\n    align-items: center; /* vertically aligns fc-list-empty-inner */\n  }\n.fc .fc-list-empty-cushion {\n    margin: 5em 0;\n  }\n.fc {\n\n  /* table within the scroller */\n  /* ---------------------------------------------------------------------------------------------------- */\n\n}\n.fc .fc-list-table {\n    width: 100%;\n    border-style: hidden; /* kill outer border on theme */\n  }\n.fc .fc-list-table tr > * {\n    border-left: 0;\n    border-right: 0;\n  }\n.fc .fc-list-sticky .fc-list-day > * { /* the cells */\n      position: -webkit-sticky;\n      position: sticky;\n      top: 0;\n      background: #fff;\n      background: var(--fc-page-bg-color, #fff); /* for when headers are styled to be transparent and sticky */\n    }\n.fc .fc-list-table th {\n    padding: 0; /* uses an inner-wrapper instead... */\n  }\n.fc .fc-list-table td,\n  .fc .fc-list-day-cushion {\n    padding: 8px 14px;\n  }\n.fc {\n\n\n  /* date heading rows */\n  /* ---------------------------------------------------------------------------------------------------- */\n\n}\n.fc .fc-list-day-cushion:after {\n  content: \"\";\n  clear: both;\n  display: table; /* clear floating */\n    }\n.fc-theme-standard .fc-list-day-cushion {\n    background-color: rgba(208, 208, 208, 0.3);\n    background-color: var(--fc-neutral-bg-color, rgba(208, 208, 208, 0.3));\n  }\n.fc-direction-ltr .fc-list-day-text,\n.fc-direction-rtl .fc-list-day-side-text {\n  float: left;\n}\n.fc-direction-ltr .fc-list-day-side-text,\n.fc-direction-rtl .fc-list-day-text {\n  float: right;\n}\n/* make the dot closer to the event title */\n.fc-direction-ltr .fc-list-table .fc-list-event-graphic { padding-right: 0 }\n.fc-direction-rtl .fc-list-table .fc-list-event-graphic { padding-left: 0 }\n.fc .fc-list-event.fc-event-forced-url {\n    cursor: pointer; /* whole row will seem clickable */\n  }\n.fc .fc-list-event:hover td {\n    background-color: #f5f5f5;\n    background-color: var(--fc-list-event-hover-bg-color, #f5f5f5);\n  }\n.fc {\n\n  /* shrink certain cols */\n\n}\n.fc .fc-list-event-graphic,\n  .fc .fc-list-event-time {\n    white-space: nowrap;\n    width: 1px;\n  }\n.fc .fc-list-event-dot {\n    display: inline-block;\n    box-sizing: content-box;\n    width: 0;\n    height: 0;\n    border: 5px solid #3788d8;\n    border: calc(var(--fc-list-event-dot-width, 10px) / 2) solid var(--fc-event-border-color, #3788d8);\n    border-radius: 5px;\n    border-radius: calc(var(--fc-list-event-dot-width, 10px) / 2);\n  }\n.fc {\n\n  /* reset <a> styling */\n\n}\n.fc .fc-list-event-title a {\n    color: inherit;\n    text-decoration: none;\n  }\n.fc {\n\n  /* underline link when hovering over any part of row */\n\n}\n.fc .fc-list-event.fc-event-forced-url:hover a {\n    text-decoration: underline;\n  }\n\n\n\n  .fc-theme-bootstrap a:not([href]) {\n    color: inherit; /* natural color for navlinks */\n  }\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_glidejs.scss",
    "content": "/*!\n * Glide.js v3.4.1\n * (c) 2013-2020 Jędrzej Chałubek <jedrzej.chalubek@gmail.com> (http://jedrzejchalubek.com/)\n * Released under the MIT License.\n */\n.glide {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.glide * {\n  box-sizing: inherit;\n}\n\n.glide__track {\n  overflow: hidden;\n}\n\n.glide__slides {\n  position: relative;\n  width: 100%;\n  list-style: none;\n  backface-visibility: hidden;\n  transform-style: preserve-3d;\n  touch-action: pan-Y;\n  overflow: hidden;\n  padding: 0;\n  white-space: nowrap;\n  display: flex;\n  flex-wrap: nowrap;\n  will-change: transform;\n  padding: 40px 0;\n}\n\n.glide__slides--dragging {\n  user-select: none;\n}\n\n.glide__slide {\n  width: 100%;\n  height: 100%;\n  flex-shrink: 0;\n  white-space: normal;\n  user-select: none;\n  -webkit-touch-callout: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.glide__slide a {\n  user-select: none;\n  -webkit-user-drag: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n}\n\n.glide__arrows {\n  -webkit-touch-callout: none;\n  user-select: none;\n}\n\n.glide__bullets {\n  -webkit-touch-callout: none;\n  user-select: none;\n}\n\n.glide--rtl {\n  direction: rtl;\n}\n\n.glide__arrow {\n  position: absolute;\n  display: block;\n  top: 50%;\n  z-index: 2;\n  color: white;\n  text-transform: uppercase;\n  padding: 9px 12px;\n  background-color: transparent;\n  border: 2px solid rgba(255, 255, 255, 0.5);\n  border-radius: 4px;\n  box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);\n  text-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.1);\n  opacity: 1;\n  cursor: pointer;\n  transition: opacity 150ms ease, border 300ms ease-in-out;\n  transform: translateY(-50%);\n  line-height: 1;\n}\n\n.glide__arrow:focus {\n  outline: none;\n}\n\n.glide__arrow:hover {\n  border-color: white;\n}\n\n.glide__arrow--left {\n  left: 2em;\n}\n\n.glide__arrow--right {\n  right: 2em;\n}\n\n.glide__arrow--disabled {\n  opacity: 0.33;\n}\n\n.glide__bullets {\n  position: absolute;\n  z-index: 2;\n  bottom: 2em;\n  left: 50%;\n  display: inline-flex;\n  list-style: none;\n  transform: translateX(-50%);\n}\n\n.glide__bullet {\n  background-color: rgba(255, 255, 255, 0.5);\n  width: 9px;\n  height: 9px;\n  padding: 0;\n  border-radius: 50%;\n  border: 2px solid transparent;\n  transition: all 300ms ease-in-out;\n  cursor: pointer;\n  line-height: 0;\n  box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);\n  margin: 0 0.25em;\n}\n\n.glide__bullet:focus {\n  outline: none;\n}\n\n.glide__bullet:focus,\n.glide__bullet:hover {\n  border: 2px solid white;\n  background-color: rgba(255, 255, 255, 0.5);\n}\n\n.glide__bullet--active {\n  background-color: white;\n}\n\n.glide--swipeable {\n  cursor: grab;\n  cursor: -moz-grab;\n  cursor: -webkit-grab;\n}\n\n.glide--dragging {\n  cursor: grabbing;\n  cursor: -moz-grabbing;\n  cursor: -webkit-grabbing;\n}\n\n\n\n.glide__slides {\n  overflow: visible;\n  transform-style: preserve-3d;\n}\n\n.glide__slide {\n  transform: perspective(2000px);\n}\n\n.glide__container {\n  border: 1px solid $gray-200;\n  border-radius: $border-radius-xl;\n  transition: all 500ms ease;\n  will-change: transform;\n  transform-style: preserve-3d;\n  position: relative;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_highlight.scss",
    "content": "/*!\n* Highlight.js 10.7.2 (00233d63)\n* License: BSD-3-Clause\n* Copyright (c) 2006-2021, Ivan Sagalaev\n */\n.hljs {\n  display: block;\n  overflow-x: auto;\n  padding: 0.5em;\n  background: #f0f0f0;\n}\n\n.hljs,\n.hljs-subst {\n  color: #444;\n}\n\n.hljs-comment {\n  color: #888;\n}\n\n.hljs-attribute,\n.hljs-doctag,\n.hljs-keyword,\n.hljs-meta-keyword,\n.hljs-name,\n.hljs-selector-tag {\n  font-weight: 700;\n}\n\n.hljs-deletion,\n.hljs-number,\n.hljs-quote,\n.hljs-selector-class,\n.hljs-selector-id,\n.hljs-string,\n.hljs-template-tag,\n.hljs-type {\n  color: #800;\n}\n\n.hljs-section,\n.hljs-title {\n  color: #800;\n  font-weight: 700;\n}\n\n.hljs-link,\n.hljs-regexp,\n.hljs-selector-attr,\n.hljs-selector-pseudo,\n.hljs-symbol,\n.hljs-template-variable,\n.hljs-variable {\n  color: #bc6060;\n}\n\n.hljs-literal {\n  color: #78a960;\n}\n\n.hljs-addition,\n.hljs-built_in,\n.hljs-bullet,\n.hljs-code {\n  color: #397300;\n}\n\n.hljs-meta {\n  color: #1f7199;\n}\n\n.hljs-meta-string {\n  color: #4d99bf;\n}\n\n.hljs-emphasis {\n  font-style: italic;\n}\n\n.hljs-strong {\n  font-weight: 700;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_kanban.scss",
    "content": ".kanban-container {\n  position: relative;\n  box-sizing: border-box;\n  width: auto;\n  overflow: scroll;\n}\n\n.kanban-container * {\n  box-sizing: border-box;\n}\n\n.kanban-container:after {\n  clear: both;\n  display: block;\n  content: \"\";\n}\n\n.kanban-board {\n  position: relative;\n  float: left;\n  background: $gray-200;\n  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);\n  border-radius: $border-radius-lg;\n}\n\n.kanban-board.disabled-board {\n  opacity: 0.3;\n}\n\n.kanban-board.is-moving.gu-mirror {\n  transform: rotate(3deg);\n}\n\n.kanban-board.is-moving.gu-mirror .kanban-drag {\n  overflow: hidden;\n  padding-right: 50px;\n}\n\n.kanban-board header {\n  font-size: 16px;\n  padding: 20px;\n}\n\n.kanban-board header .kanban-title-board {\n  font-weight: 600;\n  margin: 0;\n  padding: 0;\n  display: inline;\n  color: $dark;\n}\n\n.kanban-board header .kanban-title-button {\n  float: right;\n}\n\n.kanban-board .kanban-drag {\n  min-height: 200px;\n  padding: 20px;\n}\n\n.kanban-board:after {\n  clear: both;\n  display: block;\n  content: \"\";\n}\n\n.kanban-item {\n  background: #fff;\n  padding: 15px;\n  margin-bottom: 20px;\n  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);\n  img.w-100{\n    border-radius: $border-radius-lg;\n  }\n}\n\n.kanban-item:hover {\n  cursor: move;\n}\n\n.kanban-item:last-child {\n  margin: 0;\n}\n\n.kanban-item.is-moving.gu-mirror {\n  transform: rotate(3deg);\n  height: auto !important;\n}\n\n/* Dragula CSS  */\n.gu-mirror {\n  position: fixed !important;\n  margin: 0 !important;\n  z-index: 9999 !important;\n}\n\n.gu-hide {\n  display: none !important;\n}\n\n.gu-unselectable {\n  -webkit-user-select: none !important;\n  -moz-user-select: none !important;\n  -ms-user-select: none !important;\n  user-select: none !important;\n}\n\n.gu-transit {\n  box-shadow: $blur-box-shadow;\n  -webkit-backdrop-filter: $blur-backdrop-filter;\n  backdrop-filter: $blur-backdrop-filter;\n  background-color: $card-background-blur !important;\n  box-shadow: $shadow-blur-box-shadow !important;\n}\n\n.drag_handler {\n    background: #fff;\n    border-radius: 50%;\n    width: 24px;\n    height: 24px;\n    position: relative;\n    float: left;\n    top: -3px;\n    margin-right: 4px;\n}\n\n.drag_handler:hover {\n  cursor: move;\n}\n\n.drag_handler_icon {\n    position: relative;\n    display: block;\n    background: #000;\n    width: 24px;\n    height: 2px;\n    top: 12px;\n    transition: .5s ease-in-out;\n}\n\n.drag_handler_icon:before,\n.drag_handler_icon:after {\n    background: #000;\n    content: '';\n    display: block;\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    transition: .5s ease-in-out;\n}\n\n .drag_handler_icon:before {\n    top: 6px;\n}\n\n.drag_handler_icon:after {\n    bottom: 6px;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_leaflet.scss",
    "content": ".leaflet {\n  height: 250px;\n}\n\n.leaflet-bar a, .leaflet-bar a:hover{\n  background: $dark;\n  color: rgba($white, 0.7);\n  border-bottom-color: $dark-gradient;\n}\n\n.leaflet-bar a.leaflet-disabled{\n  background: $dark-gradient;\n}\n\n\n// Plugin Styling\n/* required styles */\n\n.leaflet-pane,\n.leaflet-tile,\n.leaflet-marker-icon,\n.leaflet-marker-shadow,\n.leaflet-tile-container,\n.leaflet-pane > svg,\n.leaflet-pane > canvas,\n.leaflet-zoom-box,\n.leaflet-image-layer,\n.leaflet-layer {\n\tposition: absolute;\n\tleft: 0;\n\ttop: 0;\n\t}\n.leaflet-container {\n\toverflow: hidden;\n\t}\n.leaflet-tile,\n.leaflet-marker-icon,\n.leaflet-marker-shadow {\n\t-webkit-user-select: none;\n\t   -moz-user-select: none;\n\t        user-select: none;\n\t  -webkit-user-drag: none;\n\t}\n/* Prevents IE11 from highlighting tiles in blue */\n.leaflet-tile::selection {\n\tbackground: transparent;\n}\n/* Safari renders non-retina tile on retina better with this, but Chrome is worse */\n.leaflet-safari .leaflet-tile {\n\timage-rendering: -webkit-optimize-contrast;\n\t}\n/* hack that prevents hw layers \"stretching\" when loading new tiles */\n.leaflet-safari .leaflet-tile-container {\n\twidth: 1600px;\n\theight: 1600px;\n\t-webkit-transform-origin: 0 0;\n\t}\n.leaflet-marker-icon,\n.leaflet-marker-shadow {\n\tdisplay: block;\n\t}\n/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */\n/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */\n.leaflet-container .leaflet-overlay-pane svg,\n.leaflet-container .leaflet-marker-pane img,\n.leaflet-container .leaflet-shadow-pane img,\n.leaflet-container .leaflet-tile-pane img,\n.leaflet-container img.leaflet-image-layer,\n.leaflet-container .leaflet-tile {\n\tmax-width: none !important;\n\tmax-height: none !important;\n\t}\n\n.leaflet-container.leaflet-touch-zoom {\n\t-ms-touch-action: pan-x pan-y;\n\ttouch-action: pan-x pan-y;\n\t}\n.leaflet-container.leaflet-touch-drag {\n\t-ms-touch-action: pinch-zoom;\n\t/* Fallback for FF which doesn't support pinch-zoom */\n\ttouch-action: none;\n\ttouch-action: pinch-zoom;\n}\n.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {\n\t-ms-touch-action: none;\n\ttouch-action: none;\n}\n.leaflet-container {\n\t-webkit-tap-highlight-color: transparent;\n}\n.leaflet-container a {\n\t-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);\n}\n.leaflet-tile {\n\tfilter: inherit;\n\tvisibility: hidden;\n\t}\n.leaflet-tile-loaded {\n\tvisibility: inherit;\n\t}\n.leaflet-zoom-box {\n\twidth: 0;\n\theight: 0;\n\t-moz-box-sizing: border-box;\n\t     box-sizing: border-box;\n\tz-index: 800;\n\t}\n/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */\n.leaflet-overlay-pane svg {\n\t-moz-user-select: none;\n\t}\n\n.leaflet-pane         { z-index: 400; }\n\n.leaflet-tile-pane    { z-index: 200; }\n.leaflet-overlay-pane { z-index: 400; }\n.leaflet-shadow-pane  { z-index: 500; }\n.leaflet-marker-pane  { z-index: 600; }\n.leaflet-tooltip-pane   { z-index: 650; }\n.leaflet-popup-pane   { z-index: 700; }\n\n.leaflet-map-pane canvas { z-index: 100; }\n.leaflet-map-pane svg    { z-index: 200; }\n\n.leaflet-vml-shape {\n\twidth: 1px;\n\theight: 1px;\n\t}\n.lvml {\n\tbehavior: url(#default#VML);\n\tdisplay: inline-block;\n\tposition: absolute;\n\t}\n\n\n/* control positioning */\n\n.leaflet-control {\n\tposition: relative;\n\tz-index: 800;\n\tpointer-events: visiblePainted; /* IE 9-10 doesn't have auto */\n\tpointer-events: auto;\n\t}\n.leaflet-top,\n.leaflet-bottom {\n\tposition: absolute;\n\tz-index: 1000;\n\tpointer-events: none;\n\t}\n.leaflet-top {\n\ttop: 0;\n\t}\n.leaflet-right {\n\tright: 0;\n\t}\n.leaflet-bottom {\n\tbottom: 0;\n\t}\n.leaflet-left {\n\tleft: 0;\n\t}\n.leaflet-control {\n\tfloat: left;\n\tclear: both;\n\t}\n.leaflet-right .leaflet-control {\n\tfloat: right;\n\t}\n.leaflet-top .leaflet-control {\n\tmargin-top: 10px;\n\t}\n.leaflet-bottom .leaflet-control {\n\tmargin-bottom: 10px;\n\t}\n.leaflet-left .leaflet-control {\n\tmargin-left: 10px;\n\t}\n.leaflet-right .leaflet-control {\n\tmargin-right: 10px;\n\t}\n\n\n/* zoom and fade animations */\n\n.leaflet-fade-anim .leaflet-tile {\n\twill-change: opacity;\n\t}\n.leaflet-fade-anim .leaflet-popup {\n\topacity: 0;\n\t-webkit-transition: opacity 0.2s linear;\n\t   -moz-transition: opacity 0.2s linear;\n\t        transition: opacity 0.2s linear;\n\t}\n.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {\n\topacity: 1;\n\t}\n.leaflet-zoom-animated {\n\t-webkit-transform-origin: 0 0;\n\t    -ms-transform-origin: 0 0;\n\t        transform-origin: 0 0;\n\t}\n.leaflet-zoom-anim .leaflet-zoom-animated {\n\twill-change: transform;\n\t}\n.leaflet-zoom-anim .leaflet-zoom-animated {\n\t-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);\n\t   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);\n\t        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);\n\t}\n.leaflet-zoom-anim .leaflet-tile,\n.leaflet-pan-anim .leaflet-tile {\n\t-webkit-transition: none;\n\t   -moz-transition: none;\n\t        transition: none;\n\t}\n\n.leaflet-zoom-anim .leaflet-zoom-hide {\n\tvisibility: hidden;\n\t}\n\n\n/* cursors */\n\n.leaflet-interactive {\n\tcursor: pointer;\n\t}\n.leaflet-grab {\n\tcursor: -webkit-grab;\n\tcursor:    -moz-grab;\n\tcursor:         grab;\n\t}\n.leaflet-crosshair,\n.leaflet-crosshair .leaflet-interactive {\n\tcursor: crosshair;\n\t}\n.leaflet-popup-pane,\n.leaflet-control {\n\tcursor: auto;\n\t}\n.leaflet-dragging .leaflet-grab,\n.leaflet-dragging .leaflet-grab .leaflet-interactive,\n.leaflet-dragging .leaflet-marker-draggable {\n\tcursor: move;\n\tcursor: -webkit-grabbing;\n\tcursor:    -moz-grabbing;\n\tcursor:         grabbing;\n\t}\n\n/* marker & overlays interactivity */\n.leaflet-marker-icon,\n.leaflet-marker-shadow,\n.leaflet-image-layer,\n.leaflet-pane > svg path,\n.leaflet-tile-container {\n\tpointer-events: none;\n\t}\n\n.leaflet-marker-icon.leaflet-interactive,\n.leaflet-image-layer.leaflet-interactive,\n.leaflet-pane > svg path.leaflet-interactive,\nsvg.leaflet-image-layer.leaflet-interactive path {\n\tpointer-events: visiblePainted; /* IE 9-10 doesn't have auto */\n\tpointer-events: auto;\n\t}\n\n/* visual tweaks */\n\n.leaflet-container {\n\tbackground: #ddd;\n\toutline: 0;\n\t}\n.leaflet-container a {\n\tcolor: #0078A8;\n\t}\n.leaflet-container a.leaflet-active {\n\toutline: 2px solid orange;\n\t}\n.leaflet-zoom-box {\n\tborder: 2px dotted #38f;\n\tbackground: rgba(255,255,255,0.5);\n\t}\n\n\n/* general typography */\n.leaflet-container {\n\tfont: 12px/1.5 \"Helvetica Neue\", Arial, Helvetica, sans-serif;\n\t}\n\n\n/* general toolbar styles */\n\n.leaflet-bar {\n\tbox-shadow: 0 1px 5px rgba(0,0,0,0.65);\n\tborder-radius: 4px;\n\t}\n.leaflet-bar a,\n.leaflet-bar a:hover {\n\tbackground-color: #fff;\n\tborder-bottom: 1px solid #ccc;\n\twidth: 26px;\n\theight: 26px;\n\tline-height: 26px;\n\tdisplay: block;\n\ttext-align: center;\n\ttext-decoration: none;\n\tcolor: black;\n\t}\n.leaflet-bar a,\n.leaflet-control-layers-toggle {\n\tbackground-position: 50% 50%;\n\tbackground-repeat: no-repeat;\n\tdisplay: block;\n\t}\n.leaflet-bar a:hover {\n\tbackground-color: #f4f4f4;\n\t}\n.leaflet-bar a:first-child {\n\tborder-top-left-radius: 4px;\n\tborder-top-right-radius: 4px;\n\t}\n.leaflet-bar a:last-child {\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tborder-bottom: none;\n\t}\n.leaflet-bar a.leaflet-disabled {\n\tcursor: default;\n\tbackground-color: #f4f4f4;\n\tcolor: #bbb;\n\t}\n\n.leaflet-touch .leaflet-bar a {\n\twidth: 30px;\n\theight: 30px;\n\tline-height: 30px;\n\t}\n.leaflet-touch .leaflet-bar a:first-child {\n\tborder-top-left-radius: 2px;\n\tborder-top-right-radius: 2px;\n\t}\n.leaflet-touch .leaflet-bar a:last-child {\n\tborder-bottom-left-radius: 2px;\n\tborder-bottom-right-radius: 2px;\n\t}\n\n/* zoom control */\n\n.leaflet-control-zoom-in,\n.leaflet-control-zoom-out {\n\tfont: bold 18px 'Lucida Console', Monaco, monospace;\n\ttext-indent: 1px;\n\t}\n\n.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {\n\tfont-size: 22px;\n\t}\n\n\n/* layers control */\n\n.leaflet-control-layers {\n\tbox-shadow: 0 1px 5px rgba(0,0,0,0.4);\n\tbackground: #fff;\n\tborder-radius: 5px;\n\t}\n.leaflet-control-layers-toggle {\n\tbackground-image: url(images/layers.png);\n\twidth: 36px;\n\theight: 36px;\n\t}\n.leaflet-retina .leaflet-control-layers-toggle {\n\tbackground-image: url(images/layers-2x.png);\n\tbackground-size: 26px 26px;\n\t}\n.leaflet-touch .leaflet-control-layers-toggle {\n\twidth: 44px;\n\theight: 44px;\n\t}\n.leaflet-control-layers .leaflet-control-layers-list,\n.leaflet-control-layers-expanded .leaflet-control-layers-toggle {\n\tdisplay: none;\n\t}\n.leaflet-control-layers-expanded .leaflet-control-layers-list {\n\tdisplay: block;\n\tposition: relative;\n\t}\n.leaflet-control-layers-expanded {\n\tpadding: 6px 10px 6px 6px;\n\tcolor: #333;\n\tbackground: #fff;\n\t}\n.leaflet-control-layers-scrollbar {\n\toverflow-y: scroll;\n\toverflow-x: hidden;\n\tpadding-right: 5px;\n\t}\n.leaflet-control-layers-selector {\n\tmargin-top: 2px;\n\tposition: relative;\n\ttop: 1px;\n\t}\n.leaflet-control-layers label {\n\tdisplay: block;\n\t}\n.leaflet-control-layers-separator {\n\theight: 0;\n\tborder-top: 1px solid #ddd;\n\tmargin: 5px -10px 5px -6px;\n\t}\n\n/* Default icon URLs */\n.leaflet-default-icon-path {\n\tbackground-image: url(images/marker-icon.png);\n\t}\n\n\n/* attribution and scale controls */\n\n.leaflet-container .leaflet-control-attribution {\n\tbackground: #fff;\n\tbackground: rgba(255, 255, 255, 0.7);\n\tmargin: 0;\n\t}\n.leaflet-control-attribution,\n.leaflet-control-scale-line {\n\tpadding: 0 5px;\n\tcolor: #333;\n\t}\n.leaflet-control-attribution a {\n\ttext-decoration: none;\n\t}\n.leaflet-control-attribution a:hover {\n\ttext-decoration: underline;\n\t}\n.leaflet-container .leaflet-control-attribution,\n.leaflet-container .leaflet-control-scale {\n\tfont-size: 11px;\n\t}\n.leaflet-left .leaflet-control-scale {\n\tmargin-left: 5px;\n\t}\n.leaflet-bottom .leaflet-control-scale {\n\tmargin-bottom: 5px;\n\t}\n.leaflet-control-scale-line {\n\tborder: 2px solid #777;\n\tborder-top: none;\n\tline-height: 1.1;\n\tpadding: 2px 5px 1px;\n\tfont-size: 11px;\n\twhite-space: nowrap;\n\toverflow: hidden;\n\t-moz-box-sizing: border-box;\n\t     box-sizing: border-box;\n\n\tbackground: #fff;\n\tbackground: rgba(255, 255, 255, 0.5);\n\t}\n.leaflet-control-scale-line:not(:first-child) {\n\tborder-top: 2px solid #777;\n\tborder-bottom: none;\n\tmargin-top: -2px;\n\t}\n.leaflet-control-scale-line:not(:first-child):not(:last-child) {\n\tborder-bottom: 2px solid #777;\n\t}\n\n.leaflet-touch .leaflet-control-attribution,\n.leaflet-touch .leaflet-control-layers,\n.leaflet-touch .leaflet-bar {\n\tbox-shadow: none;\n\t}\n.leaflet-touch .leaflet-control-layers,\n.leaflet-touch .leaflet-bar {\n\tborder: 2px solid rgba(0,0,0,0.2);\n\tbackground-clip: padding-box;\n\t}\n\n\n/* popup */\n\n.leaflet-popup {\n\tposition: absolute;\n\ttext-align: center;\n\tmargin-bottom: 20px;\n\t}\n.leaflet-popup-content-wrapper {\n\tpadding: 1px;\n\ttext-align: left;\n\tborder-radius: 12px;\n\t}\n.leaflet-popup-content {\n\tmargin: 13px 19px;\n\tline-height: 1.4;\n\t}\n.leaflet-popup-content p {\n\tmargin: 18px 0;\n\t}\n.leaflet-popup-tip-container {\n\twidth: 40px;\n\theight: 20px;\n\tposition: absolute;\n\tleft: 50%;\n\tmargin-left: -20px;\n\toverflow: hidden;\n\tpointer-events: none;\n\t}\n.leaflet-popup-tip {\n\twidth: 17px;\n\theight: 17px;\n\tpadding: 1px;\n\n\tmargin: -10px auto 0;\n\n\t-webkit-transform: rotate(45deg);\n\t   -moz-transform: rotate(45deg);\n\t    -ms-transform: rotate(45deg);\n\t        transform: rotate(45deg);\n\t}\n.leaflet-popup-content-wrapper,\n.leaflet-popup-tip {\n\tbackground: white;\n\tcolor: #333;\n\tbox-shadow: 0 3px 14px rgba(0,0,0,0.4);\n\t}\n.leaflet-container a.leaflet-popup-close-button {\n\tposition: absolute;\n\ttop: 0;\n\tright: 0;\n\tpadding: 4px 4px 0 0;\n\tborder: none;\n\ttext-align: center;\n\twidth: 18px;\n\theight: 14px;\n\tfont: 16px/14px Tahoma, Verdana, sans-serif;\n\tcolor: #c3c3c3;\n\ttext-decoration: none;\n\tfont-weight: bold;\n\tbackground: transparent;\n\t}\n.leaflet-container a.leaflet-popup-close-button:hover {\n\tcolor: #999;\n\t}\n.leaflet-popup-scrolled {\n\toverflow: auto;\n\tborder-bottom: 1px solid #ddd;\n\tborder-top: 1px solid #ddd;\n\t}\n\n.leaflet-oldie .leaflet-popup-content-wrapper {\n\t-ms-zoom: 1;\n\t}\n.leaflet-oldie .leaflet-popup-tip {\n\twidth: 24px;\n\tmargin: 0 auto;\n\n\t-ms-filter: \"progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)\";\n\tfilter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);\n\t}\n.leaflet-oldie .leaflet-popup-tip-container {\n\tmargin-top: -1px;\n\t}\n\n.leaflet-oldie .leaflet-control-zoom,\n.leaflet-oldie .leaflet-control-layers,\n.leaflet-oldie .leaflet-popup-content-wrapper,\n.leaflet-oldie .leaflet-popup-tip {\n\tborder: 1px solid #999;\n\t}\n\n\n/* div icon */\n\n.leaflet-div-icon {\n\tbackground: #fff;\n\tborder: 1px solid #666;\n\t}\n\n\n/* Tooltip */\n/* Base styles for the element that has a tooltip */\n.leaflet-tooltip {\n\tposition: absolute;\n\tpadding: 6px;\n\tbackground-color: #fff;\n\tborder: 1px solid #fff;\n\tborder-radius: 3px;\n\tcolor: #222;\n\twhite-space: nowrap;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n\tpointer-events: none;\n\tbox-shadow: 0 1px 3px rgba(0,0,0,0.4);\n\t}\n.leaflet-tooltip.leaflet-clickable {\n\tcursor: pointer;\n\tpointer-events: auto;\n\t}\n.leaflet-tooltip-top:before,\n.leaflet-tooltip-bottom:before,\n.leaflet-tooltip-left:before,\n.leaflet-tooltip-right:before {\n\tposition: absolute;\n\tpointer-events: none;\n\tborder: 6px solid transparent;\n\tbackground: transparent;\n\tcontent: \"\";\n\t}\n\n/* Directions */\n\n.leaflet-tooltip-bottom {\n\tmargin-top: 6px;\n}\n.leaflet-tooltip-top {\n\tmargin-top: -6px;\n}\n.leaflet-tooltip-bottom:before,\n.leaflet-tooltip-top:before {\n\tleft: 50%;\n\tmargin-left: -6px;\n\t}\n.leaflet-tooltip-top:before {\n\tbottom: 0;\n\tmargin-bottom: -12px;\n\tborder-top-color: #fff;\n\t}\n.leaflet-tooltip-bottom:before {\n\ttop: 0;\n\tmargin-top: -12px;\n\tmargin-left: -6px;\n\tborder-bottom-color: #fff;\n\t}\n.leaflet-tooltip-left {\n\tmargin-left: -6px;\n}\n.leaflet-tooltip-right {\n\tmargin-left: 6px;\n}\n.leaflet-tooltip-left:before,\n.leaflet-tooltip-right:before {\n\ttop: 50%;\n\tmargin-top: -6px;\n\t}\n.leaflet-tooltip-left:before {\n\tright: 0;\n\tmargin-right: -12px;\n\tborder-left-color: #fff;\n\t}\n.leaflet-tooltip-right:before {\n\tleft: 0;\n\tmargin-left: -12px;\n\tborder-right-color: #fff;\n\t}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_list-check.scss",
    "content": "#completed-tasks label {\n  text-decoration: line-through;\n  color: #888;\n}\n\n/* Edit Task */\nul li input[type=text] {\n  display:none;\n}\n\nul li.editMode input[type=text] {\n  display:block;\n}\n\nul li.editMode label {\n  display:none;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_photoswipe.scss",
    "content": "/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */\n/*\n\tStyles for basic PhotoSwipe functionality (sliding area, open/close transitions)\n*/\n/* pswp = photoswipe */\n.pswp {\n  display: none;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  overflow: hidden;\n  -ms-touch-action: none;\n  touch-action: none;\n  z-index: 99999;\n  -webkit-text-size-adjust: 100%;\n  /* create separate layer, to avoid paint on window.onscroll in webkit/blink */\n  -webkit-backface-visibility: hidden;\n  outline: none; }\n  .pswp * {\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box; }\n  .pswp img {\n    max-width: none; }\n\n/* style is added when JS option showHideOpacity is set to true */\n.pswp--animate_opacity {\n  /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */\n  opacity: 0.001;\n  will-change: opacity;\n  /* for open/close transition */\n  -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);\n          transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }\n\n.pswp--open {\n  display: block; }\n\n.pswp--zoom-allowed .pswp__img {\n  /* autoprefixer: off */\n  cursor: -webkit-zoom-in;\n  cursor: -moz-zoom-in;\n  cursor: zoom-in; }\n\n.pswp--zoomed-in .pswp__img {\n  /* autoprefixer: off */\n  cursor: -webkit-grab;\n  cursor: -moz-grab;\n  cursor: grab; }\n\n.pswp--dragging .pswp__img {\n  /* autoprefixer: off */\n  cursor: -webkit-grabbing;\n  cursor: -moz-grabbing;\n  cursor: grabbing; }\n\n/*\n\tBackground is added as a separate element.\n\tAs animating opacity is much faster than animating rgba() background-color.\n*/\n.pswp__bg {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  background: #000;\n  opacity: 0;\n  -webkit-transform: translateZ(0);\n          transform: translateZ(0);\n  -webkit-backface-visibility: hidden;\n  will-change: opacity; }\n\n.pswp__scroll-wrap {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  overflow: hidden; }\n\n.pswp__container,\n.pswp__zoom-wrap {\n  -ms-touch-action: none;\n  touch-action: none;\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0; }\n\n/* Prevent selection and tap highlights */\n.pswp__container,\n.pswp__img {\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n      user-select: none;\n  -webkit-tap-highlight-color: transparent;\n  -webkit-touch-callout: none;\n  border-radius: $border-radius-lg;\n  margin-top: 2rem;\n}\n\n.pswp__zoom-wrap {\n  position: absolute;\n  width: 100%;\n  -webkit-transform-origin: left top;\n  -ms-transform-origin: left top;\n  transform-origin: left top;\n  /* for open/close transition */\n  -webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);\n          transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); }\n\n.pswp__bg {\n  will-change: opacity;\n  /* for open/close transition */\n  -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);\n          transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }\n\n.pswp--animated-in .pswp__bg,\n.pswp--animated-in .pswp__zoom-wrap {\n  -webkit-transition: none;\n  transition: none; }\n\n.pswp__container,\n.pswp__zoom-wrap {\n  -webkit-backface-visibility: hidden; }\n\n.pswp__item {\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0;\n  overflow: hidden; }\n\n.pswp__img {\n  position: absolute;\n  width: auto;\n  height: auto;\n  top: 0;\n  left: 0; }\n\n/*\n\tstretched thumbnail or div placeholder element (see below)\n\tstyle is added to avoid flickering in webkit/blink when layers overlap\n*/\n.pswp__img--placeholder {\n  -webkit-backface-visibility: hidden; }\n\n/*\n\tdiv element that matches size of large image\n\tlarge image loads on top of it\n*/\n.pswp__img--placeholder--blank {\n  background: #222; }\n\n.pswp--ie .pswp__img {\n  width: 100% !important;\n  height: auto !important;\n  left: 0;\n  top: 0; }\n\n/*\n\tError message appears when image is not loaded\n\t(JS option errorMsg controls markup)\n*/\n.pswp__error-msg {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  width: 100%;\n  text-align: center;\n  font-size: 14px;\n  line-height: 16px;\n  margin-top: -8px;\n  color: #CCC; }\n\n.pswp__error-msg a {\n  color: #CCC;\n  text-decoration: underline; }\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_quill.scss",
    "content": "/*!\n * Quill Editor v1.3.6\n * https://quilljs.com/\n * Copyright (c) 2014, Jason Chen\n * Copyright (c) 2013, salesforce.com\n */\n.ql-container {\n  box-sizing: border-box;\n  font-family: Helvetica, Arial, sans-serif;\n  font-size: 13px;\n  height: 100%;\n  margin: 0px;\n  position: relative;\n}\n.ql-container.ql-disabled .ql-tooltip {\n  visibility: hidden;\n}\n.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {\n  pointer-events: none;\n}\n.ql-clipboard {\n  left: -100000px;\n  height: 1px;\n  overflow-y: hidden;\n  position: absolute;\n  top: 50%;\n}\n.ql-clipboard p {\n  margin: 0;\n  padding: 0;\n}\n.ql-editor {\n  box-sizing: border-box;\n  line-height: 1.42;\n  height: 100%;\n  outline: none;\n  overflow-y: auto;\n  padding: 12px 15px;\n  tab-size: 4;\n  -moz-tab-size: 4;\n  text-align: left;\n  white-space: pre-wrap;\n  word-wrap: break-word;\n}\n.ql-editor > * {\n  cursor: text;\n}\n.ql-editor p,\n.ql-editor ol,\n.ql-editor ul,\n.ql-editor pre,\n.ql-editor blockquote,\n.ql-editor h1,\n.ql-editor h2,\n.ql-editor h3,\n.ql-editor h4,\n.ql-editor h5,\n.ql-editor h6 {\n  margin: 0;\n  padding: 0;\n  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;\n}\n.ql-editor ol,\n.ql-editor ul {\n  padding-left: 1.5em;\n}\n.ql-editor ol > li,\n.ql-editor ul > li {\n  list-style-type: none;\n}\n.ql-editor ul > li::before {\n  content: '\\2022';\n}\n.ql-editor ul[data-checked=true],\n.ql-editor ul[data-checked=false] {\n  pointer-events: none;\n}\n.ql-editor ul[data-checked=true] > li *,\n.ql-editor ul[data-checked=false] > li * {\n  pointer-events: all;\n}\n.ql-editor ul[data-checked=true] > li::before,\n.ql-editor ul[data-checked=false] > li::before {\n  color: #777;\n  cursor: pointer;\n  pointer-events: all;\n}\n.ql-editor ul[data-checked=true] > li::before {\n  content: '\\2611';\n}\n.ql-editor ul[data-checked=false] > li::before {\n  content: '\\2610';\n}\n.ql-editor li::before {\n  display: inline-block;\n  white-space: nowrap;\n  width: 1.2em;\n}\n.ql-editor li:not(.ql-direction-rtl)::before {\n  margin-left: -1.5em;\n  margin-right: 0.3em;\n  text-align: right;\n}\n.ql-editor li.ql-direction-rtl::before {\n  margin-left: 0.3em;\n  margin-right: -1.5em;\n}\n.ql-editor ol li:not(.ql-direction-rtl),\n.ql-editor ul li:not(.ql-direction-rtl) {\n  padding-left: 1.5em;\n}\n.ql-editor ol li.ql-direction-rtl,\n.ql-editor ul li.ql-direction-rtl {\n  padding-right: 1.5em;\n}\n.ql-editor ol li {\n  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;\n  counter-increment: list-0;\n}\n.ql-editor ol li:before {\n  content: counter(list-0, decimal) '. ';\n}\n.ql-editor ol li.ql-indent-1 {\n  counter-increment: list-1;\n}\n.ql-editor ol li.ql-indent-1:before {\n  content: counter(list-1, lower-alpha) '. ';\n}\n.ql-editor ol li.ql-indent-1 {\n  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;\n}\n.ql-editor ol li.ql-indent-2 {\n  counter-increment: list-2;\n}\n.ql-editor ol li.ql-indent-2:before {\n  content: counter(list-2, lower-roman) '. ';\n}\n.ql-editor ol li.ql-indent-2 {\n  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;\n}\n.ql-editor ol li.ql-indent-3 {\n  counter-increment: list-3;\n}\n.ql-editor ol li.ql-indent-3:before {\n  content: counter(list-3, decimal) '. ';\n}\n.ql-editor ol li.ql-indent-3 {\n  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;\n}\n.ql-editor ol li.ql-indent-4 {\n  counter-increment: list-4;\n}\n.ql-editor ol li.ql-indent-4:before {\n  content: counter(list-4, lower-alpha) '. ';\n}\n.ql-editor ol li.ql-indent-4 {\n  counter-reset: list-5 list-6 list-7 list-8 list-9;\n}\n.ql-editor ol li.ql-indent-5 {\n  counter-increment: list-5;\n}\n.ql-editor ol li.ql-indent-5:before {\n  content: counter(list-5, lower-roman) '. ';\n}\n.ql-editor ol li.ql-indent-5 {\n  counter-reset: list-6 list-7 list-8 list-9;\n}\n.ql-editor ol li.ql-indent-6 {\n  counter-increment: list-6;\n}\n.ql-editor ol li.ql-indent-6:before {\n  content: counter(list-6, decimal) '. ';\n}\n.ql-editor ol li.ql-indent-6 {\n  counter-reset: list-7 list-8 list-9;\n}\n.ql-editor ol li.ql-indent-7 {\n  counter-increment: list-7;\n}\n.ql-editor ol li.ql-indent-7:before {\n  content: counter(list-7, lower-alpha) '. ';\n}\n.ql-editor ol li.ql-indent-7 {\n  counter-reset: list-8 list-9;\n}\n.ql-editor ol li.ql-indent-8 {\n  counter-increment: list-8;\n}\n.ql-editor ol li.ql-indent-8:before {\n  content: counter(list-8, lower-roman) '. ';\n}\n.ql-editor ol li.ql-indent-8 {\n  counter-reset: list-9;\n}\n.ql-editor ol li.ql-indent-9 {\n  counter-increment: list-9;\n}\n.ql-editor ol li.ql-indent-9:before {\n  content: counter(list-9, decimal) '. ';\n}\n.ql-editor .ql-indent-1:not(.ql-direction-rtl) {\n  padding-left: 3em;\n}\n.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {\n  padding-left: 4.5em;\n}\n.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {\n  padding-right: 3em;\n}\n.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {\n  padding-right: 4.5em;\n}\n.ql-editor .ql-indent-2:not(.ql-direction-rtl) {\n  padding-left: 6em;\n}\n.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {\n  padding-left: 7.5em;\n}\n.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {\n  padding-right: 6em;\n}\n.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {\n  padding-right: 7.5em;\n}\n.ql-editor .ql-indent-3:not(.ql-direction-rtl) {\n  padding-left: 9em;\n}\n.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {\n  padding-left: 10.5em;\n}\n.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {\n  padding-right: 9em;\n}\n.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {\n  padding-right: 10.5em;\n}\n.ql-editor .ql-indent-4:not(.ql-direction-rtl) {\n  padding-left: 12em;\n}\n.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {\n  padding-left: 13.5em;\n}\n.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {\n  padding-right: 12em;\n}\n.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {\n  padding-right: 13.5em;\n}\n.ql-editor .ql-indent-5:not(.ql-direction-rtl) {\n  padding-left: 15em;\n}\n.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {\n  padding-left: 16.5em;\n}\n.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {\n  padding-right: 15em;\n}\n.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {\n  padding-right: 16.5em;\n}\n.ql-editor .ql-indent-6:not(.ql-direction-rtl) {\n  padding-left: 18em;\n}\n.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {\n  padding-left: 19.5em;\n}\n.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {\n  padding-right: 18em;\n}\n.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {\n  padding-right: 19.5em;\n}\n.ql-editor .ql-indent-7:not(.ql-direction-rtl) {\n  padding-left: 21em;\n}\n.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {\n  padding-left: 22.5em;\n}\n.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {\n  padding-right: 21em;\n}\n.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {\n  padding-right: 22.5em;\n}\n.ql-editor .ql-indent-8:not(.ql-direction-rtl) {\n  padding-left: 24em;\n}\n.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {\n  padding-left: 25.5em;\n}\n.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {\n  padding-right: 24em;\n}\n.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {\n  padding-right: 25.5em;\n}\n.ql-editor .ql-indent-9:not(.ql-direction-rtl) {\n  padding-left: 27em;\n}\n.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {\n  padding-left: 28.5em;\n}\n.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {\n  padding-right: 27em;\n}\n.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {\n  padding-right: 28.5em;\n}\n.ql-editor .ql-video {\n  display: block;\n  max-width: 100%;\n}\n.ql-editor .ql-video.ql-align-center {\n  margin: 0 auto;\n}\n.ql-editor .ql-video.ql-align-right {\n  margin: 0 0 0 auto;\n}\n.ql-editor .ql-bg-black {\n  background-color: #000;\n}\n.ql-editor .ql-bg-red {\n  background-color: #e60000;\n}\n.ql-editor .ql-bg-orange {\n  background-color: #f90;\n}\n.ql-editor .ql-bg-yellow {\n  background-color: #ff0;\n}\n.ql-editor .ql-bg-green {\n  background-color: #008a00;\n}\n.ql-editor .ql-bg-blue {\n  background-color: #06c;\n}\n.ql-editor .ql-bg-purple {\n  background-color: #93f;\n}\n.ql-editor .ql-color-white {\n  color: #fff;\n}\n.ql-editor .ql-color-red {\n  color: #e60000;\n}\n.ql-editor .ql-color-orange {\n  color: #f90;\n}\n.ql-editor .ql-color-yellow {\n  color: #ff0;\n}\n.ql-editor .ql-color-green {\n  color: #008a00;\n}\n.ql-editor .ql-color-blue {\n  color: #06c;\n}\n.ql-editor .ql-color-purple {\n  color: #93f;\n}\n.ql-editor .ql-font-serif {\n  font-family: Georgia, Times New Roman, serif;\n}\n.ql-editor .ql-font-monospace {\n  font-family: Monaco, Courier New, monospace;\n}\n.ql-editor .ql-size-small {\n  font-size: 0.75em;\n}\n.ql-editor .ql-size-large {\n  font-size: 1.5em;\n}\n.ql-editor .ql-size-huge {\n  font-size: 2.5em;\n}\n.ql-editor .ql-direction-rtl {\n  direction: rtl;\n  text-align: inherit;\n}\n.ql-editor .ql-align-center {\n  text-align: center;\n}\n.ql-editor .ql-align-justify {\n  text-align: justify;\n}\n.ql-editor .ql-align-right {\n  text-align: right;\n}\n.ql-editor.ql-blank::before {\n  color: rgba(0,0,0,0.6);\n  content: attr(data-placeholder);\n  font-style: italic;\n  left: 15px;\n  pointer-events: none;\n  position: absolute;\n  right: 15px;\n}\n.ql-snow.ql-toolbar:after,\n.ql-snow .ql-toolbar:after {\n  clear: both;\n  content: '';\n  display: table;\n}\n.ql-snow.ql-toolbar button,\n.ql-snow .ql-toolbar button {\n  background: none;\n  border: none;\n  cursor: pointer;\n  display: inline-block;\n  float: left;\n  height: 24px;\n  padding: 3px 5px;\n  width: 28px;\n}\n.ql-snow.ql-toolbar button svg,\n.ql-snow .ql-toolbar button svg {\n  float: left;\n  height: 100%;\n}\n.ql-snow.ql-toolbar button:active:hover,\n.ql-snow .ql-toolbar button:active:hover {\n  outline: none;\n}\n.ql-snow.ql-toolbar input.ql-image[type=file],\n.ql-snow .ql-toolbar input.ql-image[type=file] {\n  display: none;\n}\n.ql-snow.ql-toolbar button:hover,\n.ql-snow .ql-toolbar button:hover,\n.ql-snow.ql-toolbar button:focus,\n.ql-snow .ql-toolbar button:focus,\n.ql-snow.ql-toolbar button.ql-active,\n.ql-snow .ql-toolbar button.ql-active,\n.ql-snow.ql-toolbar .ql-picker-label:hover,\n.ql-snow .ql-toolbar .ql-picker-label:hover,\n.ql-snow.ql-toolbar .ql-picker-label.ql-active,\n.ql-snow .ql-toolbar .ql-picker-label.ql-active,\n.ql-snow.ql-toolbar .ql-picker-item:hover,\n.ql-snow .ql-toolbar .ql-picker-item:hover,\n.ql-snow.ql-toolbar .ql-picker-item.ql-selected,\n.ql-snow .ql-toolbar .ql-picker-item.ql-selected {\n  color: #06c;\n}\n.ql-snow.ql-toolbar button:hover .ql-fill,\n.ql-snow .ql-toolbar button:hover .ql-fill,\n.ql-snow.ql-toolbar button:focus .ql-fill,\n.ql-snow .ql-toolbar button:focus .ql-fill,\n.ql-snow.ql-toolbar button.ql-active .ql-fill,\n.ql-snow .ql-toolbar button.ql-active .ql-fill,\n.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,\n.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,\n.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,\n.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,\n.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,\n.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,\n.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,\n.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,\n.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,\n.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,\n.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,\n.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,\n.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,\n.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,\n.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,\n.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,\n.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,\n.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,\n.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,\n.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,\n.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,\n.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {\n  fill: #06c;\n}\n.ql-snow.ql-toolbar button:hover .ql-stroke,\n.ql-snow .ql-toolbar button:hover .ql-stroke,\n.ql-snow.ql-toolbar button:focus .ql-stroke,\n.ql-snow .ql-toolbar button:focus .ql-stroke,\n.ql-snow.ql-toolbar button.ql-active .ql-stroke,\n.ql-snow .ql-toolbar button.ql-active .ql-stroke,\n.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,\n.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,\n.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,\n.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,\n.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,\n.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,\n.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,\n.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,\n.ql-snow.ql-toolbar button:hover .ql-stroke-miter,\n.ql-snow .ql-toolbar button:hover .ql-stroke-miter,\n.ql-snow.ql-toolbar button:focus .ql-stroke-miter,\n.ql-snow .ql-toolbar button:focus .ql-stroke-miter,\n.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,\n.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,\n.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,\n.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,\n.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,\n.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,\n.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,\n.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,\n.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,\n.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {\n  stroke: #06c;\n}\n@media (pointer: coarse) {\n  .ql-snow.ql-toolbar button:hover:not(.ql-active),\n  .ql-snow .ql-toolbar button:hover:not(.ql-active) {\n    color: #444;\n  }\n  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,\n  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,\n  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,\n  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {\n    fill: #444;\n  }\n  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,\n  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,\n  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,\n  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {\n    stroke: #444;\n  }\n}\n.ql-snow {\n  box-sizing: border-box;\n}\n.ql-snow * {\n  box-sizing: border-box;\n}\n.ql-snow .ql-hidden {\n  display: none;\n}\n.ql-snow .ql-out-bottom,\n.ql-snow .ql-out-top {\n  visibility: hidden;\n}\n.ql-snow .ql-tooltip {\n  position: absolute;\n  transform: translateY(10px);\n}\n.ql-snow .ql-tooltip a {\n  cursor: pointer;\n  text-decoration: none;\n}\n.ql-snow .ql-tooltip.ql-flip {\n  transform: translateY(-10px);\n}\n.ql-snow .ql-formats {\n  display: inline-block;\n  vertical-align: middle;\n}\n.ql-snow .ql-formats:after {\n  clear: both;\n  content: '';\n  display: table;\n}\n.ql-snow .ql-stroke {\n  fill: none;\n  stroke: #444;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  stroke-width: 2;\n}\n.ql-snow .ql-stroke-miter {\n  fill: none;\n  stroke: #444;\n  stroke-miterlimit: 10;\n  stroke-width: 2;\n}\n.ql-snow .ql-fill,\n.ql-snow .ql-stroke.ql-fill {\n  fill: #444;\n}\n.ql-snow .ql-empty {\n  fill: none;\n}\n.ql-snow .ql-even {\n  fill-rule: evenodd;\n}\n.ql-snow .ql-thin,\n.ql-snow .ql-stroke.ql-thin {\n  stroke-width: 1;\n}\n.ql-snow .ql-transparent {\n  opacity: 0.4;\n}\n.ql-snow .ql-direction svg:last-child {\n  display: none;\n}\n.ql-snow .ql-direction.ql-active svg:last-child {\n  display: inline;\n}\n.ql-snow .ql-direction.ql-active svg:first-child {\n  display: none;\n}\n.ql-snow .ql-editor h1 {\n  font-size: 2em;\n}\n.ql-snow .ql-editor h2 {\n  font-size: 1.5em;\n}\n.ql-snow .ql-editor h3 {\n  font-size: 1.17em;\n}\n.ql-snow .ql-editor h4 {\n  font-size: 1em;\n}\n.ql-snow .ql-editor h5 {\n  font-size: 0.83em;\n}\n.ql-snow .ql-editor h6 {\n  font-size: 0.67em;\n}\n.ql-snow .ql-editor a {\n  text-decoration: underline;\n}\n.ql-snow .ql-editor blockquote {\n  border-left: 4px solid #ccc;\n  margin-bottom: 5px;\n  margin-top: 5px;\n  padding-left: 16px;\n}\n.ql-snow .ql-editor code,\n.ql-snow .ql-editor pre {\n  background-color: #f0f0f0;\n  border-radius: 3px;\n}\n.ql-snow .ql-editor pre {\n  white-space: pre-wrap;\n  margin-bottom: 5px;\n  margin-top: 5px;\n  padding: 5px 10px;\n}\n.ql-snow .ql-editor code {\n  font-size: 85%;\n  padding: 2px 4px;\n}\n.ql-snow .ql-editor pre.ql-syntax {\n  background-color: #23241f;\n  color: #f8f8f2;\n  overflow: visible;\n}\n.ql-snow .ql-editor img {\n  max-width: 100%;\n}\n.ql-snow .ql-picker {\n  color: #444;\n  display: inline-block;\n  float: left;\n  font-size: 14px;\n  font-weight: 500;\n  height: 24px;\n  position: relative;\n  vertical-align: middle;\n}\n.ql-snow .ql-picker-label {\n  cursor: pointer;\n  display: inline-block;\n  height: 100%;\n  padding-left: 8px;\n  padding-right: 2px;\n  position: relative;\n  width: 100%;\n}\n.ql-snow .ql-picker-label::before {\n  display: inline-block;\n  line-height: 22px;\n}\n.ql-snow .ql-picker-options {\n  background-color: #fff;\n  display: none;\n  min-width: 100%;\n  padding: 4px 8px;\n  position: absolute;\n  white-space: nowrap;\n}\n.ql-snow .ql-picker-options .ql-picker-item {\n  cursor: pointer;\n  display: block;\n  padding-bottom: 5px;\n  padding-top: 5px;\n}\n.ql-snow .ql-picker.ql-expanded .ql-picker-label {\n  color: #ccc;\n  z-index: 2;\n}\n.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {\n  fill: #ccc;\n}\n.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {\n  stroke: #ccc;\n}\n.ql-snow .ql-picker.ql-expanded .ql-picker-options {\n  display: block;\n  margin-top: -1px;\n  top: 100%;\n  z-index: 1;\n}\n.ql-snow .ql-color-picker,\n.ql-snow .ql-icon-picker {\n  width: 28px;\n}\n.ql-snow .ql-color-picker .ql-picker-label,\n.ql-snow .ql-icon-picker .ql-picker-label {\n  padding: 2px 4px;\n}\n.ql-snow .ql-color-picker .ql-picker-label svg,\n.ql-snow .ql-icon-picker .ql-picker-label svg {\n  right: 4px;\n}\n.ql-snow .ql-icon-picker .ql-picker-options {\n  padding: 4px 0px;\n}\n.ql-snow .ql-icon-picker .ql-picker-item {\n  height: 24px;\n  width: 24px;\n  padding: 2px 4px;\n}\n.ql-snow .ql-color-picker .ql-picker-options {\n  padding: 3px 5px;\n  width: 152px;\n}\n.ql-snow .ql-color-picker .ql-picker-item {\n  border: 1px solid transparent;\n  float: left;\n  height: 16px;\n  margin: 2px;\n  padding: 0px;\n  width: 16px;\n}\n.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {\n  position: absolute;\n  margin-top: -9px;\n  right: 0;\n  top: 50%;\n  width: 18px;\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,\n.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before {\n  content: attr(data-label);\n}\n.ql-snow .ql-picker.ql-header {\n  width: 98px;\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item::before {\n  content: 'Normal';\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]::before {\n  content: 'Heading 1';\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]::before {\n  content: 'Heading 2';\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]::before {\n  content: 'Heading 3';\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]::before {\n  content: 'Heading 4';\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]::before {\n  content: 'Heading 5';\n}\n.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]::before,\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]::before {\n  content: 'Heading 6';\n}\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]::before {\n  font-size: 2em;\n}\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]::before {\n  font-size: 1.5em;\n}\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]::before {\n  font-size: 1.17em;\n}\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]::before {\n  font-size: 1em;\n}\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]::before {\n  font-size: 0.83em;\n}\n.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]::before {\n  font-size: 0.67em;\n}\n.ql-snow .ql-picker.ql-font {\n  width: 108px;\n}\n.ql-snow .ql-picker.ql-font .ql-picker-label::before,\n.ql-snow .ql-picker.ql-font .ql-picker-item::before {\n  content: 'Sans Serif';\n}\n.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {\n  content: 'Serif';\n}\n.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {\n  content: 'Monospace';\n}\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {\n  font-family: Georgia, Times New Roman, serif;\n}\n.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {\n  font-family: Monaco, Courier New, monospace;\n}\n.ql-snow .ql-picker.ql-size {\n  width: 98px;\n}\n.ql-snow .ql-picker.ql-size .ql-picker-label::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item::before {\n  content: 'Normal';\n}\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {\n  content: 'Small';\n}\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {\n  content: 'Large';\n}\n.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {\n  content: 'Huge';\n}\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {\n  font-size: 10px;\n}\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {\n  font-size: 18px;\n}\n.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {\n  font-size: 32px;\n}\n.ql-snow .ql-color-picker.ql-background .ql-picker-item {\n  background-color: #fff;\n}\n.ql-snow .ql-color-picker.ql-color .ql-picker-item {\n  background-color: #000;\n}\n.ql-toolbar.ql-snow {\n  border: 1px solid #ccc;\n  border-top-right-radius: $border-radius-md;\n  border-top-left-radius: $border-radius-md;\n  box-sizing: border-box;\n  font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;\n  padding: 8px;\n}\n.ql-toolbar.ql-snow .ql-formats {\n  margin-right: 15px;\n}\n.ql-toolbar.ql-snow .ql-picker-label {\n  border: 1px solid transparent;\n}\n.ql-toolbar.ql-snow .ql-picker-options {\n  border: 1px solid transparent;\n  box-shadow: rgba(0,0,0,0.2) 0 2px 8px;\n}\n.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {\n  border-color: #ccc;\n}\n.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {\n  border-color: #ccc;\n}\n.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,\n.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {\n  border-color: #000;\n}\n.ql-toolbar.ql-snow + .ql-container.ql-snow {\n  border-top: 0px;\n  border-bottom-left-radius: $border-radius-md;\n  border-bottom-right-radius: $border-radius-md;\n}\n.ql-snow .ql-tooltip {\n  background-color: #fff;\n  border: 1px solid #ccc;\n  box-shadow: 0px 0px 5px #ddd;\n  color: #444;\n  padding: 5px 12px;\n  white-space: nowrap;\n}\n.ql-snow .ql-tooltip::before {\n  content: \"Visit URL:\";\n  line-height: 26px;\n  margin-right: 8px;\n}\n.ql-snow .ql-tooltip input[type=text] {\n  display: none;\n  border: 1px solid #ccc;\n  font-size: 13px;\n  height: 26px;\n  margin: 0px;\n  padding: 3px 5px;\n  width: 170px;\n}\n.ql-snow .ql-tooltip a.ql-preview {\n  display: inline-block;\n  max-width: 200px;\n  overflow-x: hidden;\n  text-overflow: ellipsis;\n  vertical-align: top;\n}\n.ql-snow .ql-tooltip a.ql-action::after {\n  border-right: 1px solid #ccc;\n  content: 'Edit';\n  margin-left: 16px;\n  padding-right: 8px;\n}\n.ql-snow .ql-tooltip a.ql-remove::before {\n  content: 'Remove';\n  margin-left: 8px;\n}\n.ql-snow .ql-tooltip a {\n  line-height: 26px;\n}\n.ql-snow .ql-tooltip.ql-editing a.ql-preview,\n.ql-snow .ql-tooltip.ql-editing a.ql-remove {\n  display: none;\n}\n.ql-snow .ql-tooltip.ql-editing input[type=text] {\n  display: inline-block;\n}\n.ql-snow .ql-tooltip.ql-editing a.ql-action::after {\n  border-right: 0px;\n  content: 'Save';\n  padding-right: 0px;\n}\n.ql-snow .ql-tooltip[data-mode=link]::before {\n  content: \"Enter link:\";\n}\n.ql-snow .ql-tooltip[data-mode=formula]::before {\n  content: \"Enter formula:\";\n}\n.ql-snow .ql-tooltip[data-mode=video]::before {\n  content: \"Enter video:\";\n}\n.ql-snow a {\n  color: #06c;\n}\n.ql-container.ql-snow {\n  border: 1px solid #ccc;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_rating-widget.scss",
    "content": "/****** Style Star Rating Widget *****/\n\n.rating {\n  border: none;\n  float: left;\n}\n\n.rating > input { display: none; }\n.rating > label:before {\n  margin: 5px;\n  font-size: 1.25em;\n  font-family: FontAwesome;\n  display: inline-block;\n  content: \"\\f005\";\n}\n\n.rating > .half:before {\n  content: \"\\f089\";\n  position: absolute;\n}\n\n.rating > label {\n  color: #ddd;\n float: right;\n}\n\n/***** CSS Magic to Highlight Stars on Hover *****/\n\n.rating > input:checked ~ label, /* show gold star when clicked */\n.rating:not(:checked) > label:hover, /* hover current star */\n.rating:not(:checked) > label:hover ~ label { color: #FFD700;  } /* hover previous stars in list */\n\n.rating > input:checked + label:hover, /* hover current star when changing rating */\n.rating > input:checked ~ label:hover,\n.rating > label:hover ~ input:checked ~ label, /* lighten current selection */\n.rating > input:checked ~ label:hover ~ label { color: #FFED85;  }\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_sweetalert2-extend.scss",
    "content": ".swal2-popup {\n  border-radius: $card-border-radius;\n}\n\n.swal2-styled.swal2-confirm {\n  background-image: linear-gradient(195deg, $info-gradient 0%, $info-gradient-state 100%);\n  background-color: transparent;\n  @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-border-radius);\n\n  &:hover,\n  &:focus {\n    background-image: linear-gradient(195deg, $info-gradient 0%, $info-gradient-state 100%);\n    outline: 0;\n    box-shadow: $btn-focus-box-shadow;\n  }\n}\n\n.swal2-confirm.btn.bg-gradient-success {\n  margin-left: 10px;\n  margin-right: 10px;\n}\n\n.swal2-image {\n  border-radius: $border-radius-lg;\n  margin-bottom: 0;\n}\n\n.swal2-close{\n  outline: none;\n  &:focus{\n    outline: none;\n    box-shadow: none;\n  }\n}\n\n.swal2-input {\n  padding: $input-padding-y $input-padding-x;\n  font-family: $input-font-family;\n  @include font-size($input-font-size);\n  font-weight: $input-font-weight;\n  line-height: $input-line-height;\n  color: $input-color;\n  background-color: $input-bg;\n  background-clip: padding-box;\n  border: $input-border-width solid $input-border-color;\n}\n\n.swal2-icon.swal2-success {\n  border-color: $success;\n  color: $success;\n}\n\n.swal2-icon.swal2-info {\n  border-color: $info;\n  color: $info;\n}\n\n.swal2-icon.swal2-warning {\n  border-color: $warning;\n  color: $warning;\n}\n\n.swal2-icon.swal2-question{\n  border-color: $secondary;\n  color: $secondary;\n}\n\n.swal2-icon.swal2-success [class^=swal2-success-line] {\n  background-color: $success;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_sweetalert2.scss",
    "content": ".swal2-popup.swal2-toast {\n  box-sizing: border-box;\n  grid-column: 1/4 !important;\n  grid-row: 1/4 !important;\n  grid-template-columns: 1fr 99fr 1fr;\n  padding: 1em;\n  overflow-y: hidden;\n  background: #fff;\n  box-shadow: 0 0 0.625em #d9d9d9;\n}\n.swal2-popup.swal2-toast > * {\n  grid-column: 2;\n}\n.swal2-popup.swal2-toast .swal2-title {\n  margin: 1em;\n  padding: 0;\n  font-size: 1em;\n  text-align: initial;\n}\n.swal2-popup.swal2-toast .swal2-loading {\n  justify-content: center;\n}\n.swal2-popup.swal2-toast .swal2-input {\n  height: 2em;\n  margin: 0.5em;\n  font-size: 1em;\n}\n.swal2-popup.swal2-toast .swal2-validation-message {\n  font-size: 1em;\n}\n.swal2-popup.swal2-toast .swal2-footer {\n  margin: 0.5em 0 0;\n  padding: 0.5em 0 0;\n  font-size: 0.8em;\n}\n.swal2-popup.swal2-toast .swal2-close {\n  grid-column: 3/3;\n  grid-row: 1/99;\n  align-self: center;\n  width: 0.8em;\n  height: 0.8em;\n  margin: 0;\n  font-size: 2em;\n}\n.swal2-popup.swal2-toast .swal2-html-container {\n  margin: 1em;\n  padding: 0;\n  font-size: 1em;\n  text-align: initial;\n}\n.swal2-popup.swal2-toast .swal2-html-container:empty {\n  padding: 0;\n}\n.swal2-popup.swal2-toast .swal2-loader {\n  grid-column: 1;\n  grid-row: 1/99;\n  align-self: center;\n  width: 2em;\n  height: 2em;\n  margin: 0.25em;\n}\n.swal2-popup.swal2-toast .swal2-icon {\n  grid-column: 1;\n  grid-row: 1/99;\n  align-self: center;\n  width: 2em;\n  min-width: 2em;\n  height: 2em;\n  margin: 0 0.5em 0 0;\n}\n.swal2-popup.swal2-toast .swal2-icon .swal2-icon-content {\n  display: flex;\n  align-items: center;\n  font-size: 1.8em;\n  font-weight: bold;\n}\n.swal2-popup.swal2-toast .swal2-icon.swal2-success .swal2-success-ring {\n  width: 2em;\n  height: 2em;\n}\n.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line] {\n  top: 0.875em;\n  width: 1.375em;\n}\n.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left] {\n  left: 0.3125em;\n}\n.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right] {\n  right: 0.3125em;\n}\n.swal2-popup.swal2-toast .swal2-actions {\n  justify-content: flex-start;\n  height: auto;\n  margin: 0;\n  margin-top: 0.3125em;\n  padding: 0;\n}\n.swal2-popup.swal2-toast .swal2-styled {\n  margin: 0.25em 0.5em;\n  padding: 0.4em 0.6em;\n  font-size: 1em;\n}\n.swal2-popup.swal2-toast .swal2-styled:focus {\n  box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(100, 150, 200, 0.5);\n}\n.swal2-popup.swal2-toast .swal2-success {\n  border-color: #a5dc86;\n}\n.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line] {\n  position: absolute;\n  width: 1.6em;\n  height: 3em;\n  transform: rotate(45deg);\n  border-radius: 50%;\n}\n.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=left] {\n  top: -0.8em;\n  left: -0.5em;\n  transform: rotate(-45deg);\n  transform-origin: 2em 2em;\n  border-radius: 4em 0 0 4em;\n}\n.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=right] {\n  top: -0.25em;\n  left: 0.9375em;\n  transform-origin: 0 1.5em;\n  border-radius: 0 4em 4em 0;\n}\n.swal2-popup.swal2-toast .swal2-success .swal2-success-ring {\n  width: 2em;\n  height: 2em;\n}\n.swal2-popup.swal2-toast .swal2-success .swal2-success-fix {\n  top: 0;\n  left: 0.4375em;\n  width: 0.4375em;\n  height: 2.6875em;\n}\n.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line] {\n  height: 0.3125em;\n}\n.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line][class$=tip] {\n  top: 1.125em;\n  left: 0.1875em;\n  width: 0.75em;\n}\n.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line][class$=long] {\n  top: 0.9375em;\n  right: 0.1875em;\n  width: 1.375em;\n}\n.swal2-popup.swal2-toast .swal2-success.swal2-icon-show .swal2-success-line-tip {\n  -webkit-animation: swal2-toast-animate-success-line-tip 0.75s;\n          animation: swal2-toast-animate-success-line-tip 0.75s;\n}\n.swal2-popup.swal2-toast .swal2-success.swal2-icon-show .swal2-success-line-long {\n  -webkit-animation: swal2-toast-animate-success-line-long 0.75s;\n          animation: swal2-toast-animate-success-line-long 0.75s;\n}\n.swal2-popup.swal2-toast.swal2-show {\n  -webkit-animation: swal2-toast-show 0.5s;\n          animation: swal2-toast-show 0.5s;\n}\n.swal2-popup.swal2-toast.swal2-hide {\n  -webkit-animation: swal2-toast-hide 0.1s forwards;\n          animation: swal2-toast-hide 0.1s forwards;\n}\n\n.swal2-container {\n  display: grid;\n  position: fixed;\n  z-index: 1060;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  box-sizing: border-box;\n  grid-template-areas: \"top-start     top            top-end\" \"center-start  center         center-end\" \"bottom-start  bottom-center  bottom-end\" \"gap gap gap\";\n  grid-template-rows: auto auto auto 0.625em;\n  height: 100%;\n  padding: 0.625em 0.625em 0;\n  overflow-x: hidden;\n  transition: background-color 0.1s;\n  -webkit-overflow-scrolling: touch;\n}\n.swal2-container::after {\n  content: \"\";\n  grid-column: 1/4;\n  grid-row: 4;\n  height: 0.625em;\n}\n.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation {\n  background: rgba(0, 0, 0, 0.4);\n}\n.swal2-container.swal2-backdrop-hide {\n  background: transparent !important;\n}\n.swal2-container.swal2-top-start, .swal2-container.swal2-center-start, .swal2-container.swal2-bottom-start {\n  grid-template-columns: minmax(0, 1fr) auto auto;\n}\n.swal2-container.swal2-top, .swal2-container.swal2-center, .swal2-container.swal2-bottom {\n  grid-template-columns: auto minmax(0, 1fr) auto;\n}\n.swal2-container.swal2-top-end, .swal2-container.swal2-center-end, .swal2-container.swal2-bottom-end {\n  grid-template-columns: auto auto minmax(0, 1fr);\n}\n.swal2-container.swal2-top-start > .swal2-popup {\n  align-self: start;\n}\n.swal2-container.swal2-top > .swal2-popup {\n  grid-column: 2;\n  align-self: start;\n  justify-self: center;\n}\n.swal2-container.swal2-top-end > .swal2-popup, .swal2-container.swal2-top-right > .swal2-popup {\n  grid-column: 3;\n  align-self: start;\n  justify-self: end;\n}\n.swal2-container.swal2-center-start > .swal2-popup, .swal2-container.swal2-center-left > .swal2-popup {\n  grid-row: 2;\n  align-self: center;\n}\n.swal2-container.swal2-center > .swal2-popup {\n  grid-column: 2;\n  grid-row: 2;\n  align-self: center;\n  justify-self: center;\n}\n.swal2-container.swal2-center-end > .swal2-popup, .swal2-container.swal2-center-right > .swal2-popup {\n  grid-column: 3;\n  grid-row: 2;\n  align-self: center;\n  justify-self: end;\n}\n.swal2-container.swal2-bottom-start > .swal2-popup, .swal2-container.swal2-bottom-left > .swal2-popup {\n  grid-column: 1;\n  grid-row: 3;\n  align-self: end;\n}\n.swal2-container.swal2-bottom > .swal2-popup {\n  grid-column: 2;\n  grid-row: 3;\n  justify-self: center;\n  align-self: end;\n}\n.swal2-container.swal2-bottom-end > .swal2-popup, .swal2-container.swal2-bottom-right > .swal2-popup {\n  grid-column: 3;\n  grid-row: 3;\n  align-self: end;\n  justify-self: end;\n}\n.swal2-container.swal2-grow-row > .swal2-popup, .swal2-container.swal2-grow-fullscreen > .swal2-popup {\n  grid-column: 1/4;\n  width: 100%;\n}\n.swal2-container.swal2-grow-column > .swal2-popup, .swal2-container.swal2-grow-fullscreen > .swal2-popup {\n  grid-row: 1/4;\n  align-self: stretch;\n}\n.swal2-container.swal2-no-transition {\n  transition: none !important;\n}\n\n.swal2-popup {\n  display: none;\n  position: relative;\n  box-sizing: border-box;\n  width: 32em;\n  max-width: 100%;\n  padding: 0 0 1.25em;\n  border: none;\n  border-radius: 5px;\n  background: #fff;\n  font-family: inherit;\n  font-size: 1rem;\n}\n.swal2-popup:focus {\n  outline: none;\n}\n.swal2-popup.swal2-loading {\n  overflow-y: hidden;\n}\n\n.swal2-title {\n  position: relative;\n  max-width: 100%;\n  margin: 0;\n  padding: 0.8em 1em 0;\n  color: #595959;\n  font-size: 1.875em;\n  font-weight: 600;\n  text-align: center;\n  text-transform: none;\n  word-wrap: break-word;\n}\n\n.swal2-actions {\n  display: flex;\n  z-index: 1;\n  box-sizing: border-box;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  margin: 1.25em auto 0;\n  padding: 0;\n}\n.swal2-actions:not(.swal2-loading) .swal2-styled[disabled] {\n  opacity: 0.4;\n}\n.swal2-actions:not(.swal2-loading) .swal2-styled:hover {\n  background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1));\n}\n.swal2-actions:not(.swal2-loading) .swal2-styled:active {\n  background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));\n}\n\n.swal2-loader {\n  display: none;\n  align-items: center;\n  justify-content: center;\n  width: 2.2em;\n  height: 2.2em;\n  margin: 0 1.875em;\n  -webkit-animation: swal2-rotate-loading 1.5s linear 0s infinite normal;\n          animation: swal2-rotate-loading 1.5s linear 0s infinite normal;\n  border-width: 0.25em;\n  border-style: solid;\n  border-radius: 100%;\n  border-color: #2778c4 transparent #2778c4 transparent;\n}\n\n.swal2-styled {\n  margin: 0.3125em;\n  padding: 0.625em 1.1em;\n  transition: box-shadow 0.1s;\n  box-shadow: 0 0 0 3px transparent;\n  font-weight: 500;\n}\n.swal2-styled:not([disabled]) {\n  cursor: pointer;\n}\n.swal2-styled.swal2-confirm {\n  border: 0;\n  border-radius: 0.25em;\n  background: initial;\n  background-color: #7367f0;\n  color: #fff;\n  font-size: 1em;\n}\n.swal2-styled.swal2-confirm:focus {\n  box-shadow: 0 0 0 3px rgba(115, 103, 240, 0.5);\n}\n.swal2-styled.swal2-deny {\n  border: 0;\n  border-radius: 0.25em;\n  background: initial;\n  background-color: #ea5455;\n  color: #fff;\n  font-size: 1em;\n}\n.swal2-styled.swal2-deny:focus {\n  box-shadow: 0 0 0 3px rgba(234, 84, 85, 0.5);\n}\n.swal2-styled.swal2-cancel {\n  border: 0;\n  border-radius: 0.25em;\n  background: initial;\n  background-color: #6e7d88;\n  color: #fff;\n  font-size: 1em;\n}\n.swal2-styled.swal2-cancel:focus {\n  box-shadow: 0 0 0 3px rgba(110, 125, 136, 0.5);\n}\n.swal2-styled.swal2-default-outline:focus {\n  box-shadow: 0 0 0 3px rgba(100, 150, 200, 0.5);\n}\n.swal2-styled:focus {\n  outline: none;\n}\n.swal2-styled::-moz-focus-inner {\n  border: 0;\n}\n\n.swal2-footer {\n  justify-content: center;\n  margin: 1em 0 0;\n  padding: 1em 1em 0;\n  border-top: 1px solid #eee;\n  color: #545454;\n  font-size: 1em;\n}\n\n.swal2-timer-progress-bar-container {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  grid-column: auto !important;\n  height: 0.25em;\n  overflow: hidden;\n  border-bottom-right-radius: 5px;\n  border-bottom-left-radius: 5px;\n}\n\n.swal2-timer-progress-bar {\n  width: 100%;\n  height: 0.25em;\n  background: rgba(0, 0, 0, 0.2);\n}\n\n.swal2-image {\n  max-width: 100%;\n  margin: 2em auto 1em;\n}\n\n.swal2-close {\n  z-index: 2;\n  align-items: center;\n  justify-content: center;\n  width: 1.2em;\n  height: 1.2em;\n  margin-top: 0;\n  margin-right: 0;\n  margin-bottom: -1.2em;\n  padding: 0;\n  overflow: hidden;\n  transition: color 0.1s, box-shadow 0.1s;\n  border: none;\n  border-radius: 5px;\n  background: transparent;\n  color: #ccc;\n  font-family: serif;\n  font-family: monospace;\n  font-size: 2.5em;\n  cursor: pointer;\n  justify-self: end;\n}\n.swal2-close:hover {\n  transform: none;\n  background: transparent;\n  color: #f27474;\n}\n.swal2-close:focus {\n  outline: none;\n  box-shadow: inset 0 0 0 3px rgba(100, 150, 200, 0.5);\n}\n.swal2-close::-moz-focus-inner {\n  border: 0;\n}\n\n.swal2-html-container {\n  z-index: 1;\n  justify-content: center;\n  margin: 0;\n  padding: 1em 1.6em 0.3em;\n  color: #545454;\n  font-size: 1.125em;\n  font-weight: normal;\n  line-height: normal;\n  text-align: center;\n  word-wrap: break-word;\n  word-break: break-word;\n}\n\n.swal2-input,\n.swal2-file,\n.swal2-textarea,\n.swal2-select,\n.swal2-radio,\n.swal2-checkbox {\n  margin: 1em 2em 0;\n}\n\n.swal2-input,\n.swal2-file,\n.swal2-textarea {\n  box-sizing: border-box;\n  width: auto;\n  transition: border-color 0.1s, box-shadow 0.1s;\n  border: 1px solid #d9d9d9;\n  border-radius: 0.1875em;\n  background: inherit;\n  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.06), 0 0 0 3px transparent;\n  color: inherit;\n  font-size: 1.125em;\n}\n.swal2-input.swal2-inputerror,\n.swal2-file.swal2-inputerror,\n.swal2-textarea.swal2-inputerror {\n  border-color: #f27474 !important;\n  box-shadow: 0 0 2px #f27474 !important;\n}\n.swal2-input:focus,\n.swal2-file:focus,\n.swal2-textarea:focus {\n  border: 1px solid #b4dbed;\n  outline: none;\n  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.06), 0 0 0 3px rgba(100, 150, 200, 0.5);\n}\n.swal2-input::-moz-placeholder, .swal2-file::-moz-placeholder, .swal2-textarea::-moz-placeholder {\n  color: #ccc;\n}\n.swal2-input:-ms-input-placeholder, .swal2-file:-ms-input-placeholder, .swal2-textarea:-ms-input-placeholder {\n  color: #ccc;\n}\n.swal2-input::placeholder,\n.swal2-file::placeholder,\n.swal2-textarea::placeholder {\n  color: #ccc;\n}\n\n.swal2-range {\n  margin: 1em 2em 0;\n  background: #fff;\n}\n.swal2-range input {\n  width: 80%;\n}\n.swal2-range output {\n  width: 20%;\n  color: inherit;\n  font-weight: 600;\n  text-align: center;\n}\n.swal2-range input,\n.swal2-range output {\n  height: 2.625em;\n  padding: 0;\n  font-size: 1.125em;\n  line-height: 2.625em;\n}\n\n.swal2-input {\n  height: 2.625em;\n  padding: 0 0.75em;\n}\n.swal2-input[type=number] {\n  max-width: 10em;\n}\n\n.swal2-file {\n  width: 75%;\n  margin-right: auto;\n  margin-left: auto;\n  background: inherit;\n  font-size: 1.125em;\n}\n\n.swal2-textarea {\n  height: 6.75em;\n  padding: 0.75em;\n}\n\n.swal2-select {\n  min-width: 50%;\n  max-width: 100%;\n  padding: 0.375em 0.625em;\n  background: inherit;\n  color: inherit;\n  font-size: 1.125em;\n}\n\n.swal2-radio,\n.swal2-checkbox {\n  align-items: center;\n  justify-content: center;\n  background: #fff;\n  color: inherit;\n}\n.swal2-radio label,\n.swal2-checkbox label {\n  margin: 0 0.6em;\n  font-size: 1.125em;\n}\n.swal2-radio input,\n.swal2-checkbox input {\n  flex-shrink: 0;\n  margin: 0 0.4em;\n}\n\n.swal2-input-label {\n  display: flex;\n  justify-content: center;\n  margin: 1em auto 0;\n}\n\n.swal2-validation-message {\n  align-items: center;\n  justify-content: center;\n  margin: 1em 0 0;\n  padding: 0.625em;\n  overflow: hidden;\n  background: #f0f0f0;\n  color: #666666;\n  font-size: 1em;\n  font-weight: 300;\n}\n.swal2-validation-message::before {\n  content: \"!\";\n  display: inline-block;\n  width: 1.5em;\n  min-width: 1.5em;\n  height: 1.5em;\n  margin: 0 0.625em;\n  border-radius: 50%;\n  background-color: #f27474;\n  color: #fff;\n  font-weight: 600;\n  line-height: 1.5em;\n  text-align: center;\n}\n\n.swal2-icon {\n  position: relative;\n  box-sizing: content-box;\n  justify-content: center;\n  width: 5em;\n  height: 5em;\n  margin: 2.5em auto 0.6em;\n  border: 0.25em solid transparent;\n  border-radius: 50%;\n  border-color: #000;\n  font-family: inherit;\n  line-height: 5em;\n  cursor: default;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.swal2-icon .swal2-icon-content {\n  display: flex;\n  align-items: center;\n  font-size: 3.75em;\n}\n.swal2-icon.swal2-error {\n  border-color: #f27474;\n  color: #f27474;\n}\n.swal2-icon.swal2-error .swal2-x-mark {\n  position: relative;\n  flex-grow: 1;\n}\n.swal2-icon.swal2-error [class^=swal2-x-mark-line] {\n  display: block;\n  position: absolute;\n  top: 2.3125em;\n  width: 2.9375em;\n  height: 0.3125em;\n  border-radius: 0.125em;\n  background-color: #f27474;\n}\n.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left] {\n  left: 1.0625em;\n  transform: rotate(45deg);\n}\n.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right] {\n  right: 1em;\n  transform: rotate(-45deg);\n}\n.swal2-icon.swal2-error.swal2-icon-show {\n  -webkit-animation: swal2-animate-error-icon 0.5s;\n          animation: swal2-animate-error-icon 0.5s;\n}\n.swal2-icon.swal2-error.swal2-icon-show .swal2-x-mark {\n  -webkit-animation: swal2-animate-error-x-mark 0.5s;\n          animation: swal2-animate-error-x-mark 0.5s;\n}\n.swal2-icon.swal2-warning {\n  border-color: #facea8;\n  color: #f8bb86;\n}\n.swal2-icon.swal2-info {\n  border-color: #9de0f6;\n  color: #3fc3ee;\n}\n.swal2-icon.swal2-question {\n  border-color: #c9dae1;\n  color: #87adbd;\n}\n.swal2-icon.swal2-success {\n  border-color: #a5dc86;\n  color: #a5dc86;\n}\n.swal2-icon.swal2-success [class^=swal2-success-circular-line] {\n  position: absolute;\n  width: 3.75em;\n  height: 7.5em;\n  transform: rotate(45deg);\n  border-radius: 50%;\n}\n.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=left] {\n  top: -0.4375em;\n  left: -2.0635em;\n  transform: rotate(-45deg);\n  transform-origin: 3.75em 3.75em;\n  border-radius: 7.5em 0 0 7.5em;\n}\n.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=right] {\n  top: -0.6875em;\n  left: 1.875em;\n  transform: rotate(-45deg);\n  transform-origin: 0 3.75em;\n  border-radius: 0 7.5em 7.5em 0;\n}\n.swal2-icon.swal2-success .swal2-success-ring {\n  position: absolute;\n  z-index: 2;\n  top: -0.25em;\n  left: -0.25em;\n  box-sizing: content-box;\n  width: 100%;\n  height: 100%;\n  border: 0.25em solid rgba(165, 220, 134, 0.3);\n  border-radius: 50%;\n}\n.swal2-icon.swal2-success .swal2-success-fix {\n  position: absolute;\n  z-index: 1;\n  top: 0.5em;\n  left: 1.625em;\n  width: 0.4375em;\n  height: 5.625em;\n  transform: rotate(-45deg);\n}\n.swal2-icon.swal2-success [class^=swal2-success-line] {\n  display: block;\n  position: absolute;\n  z-index: 2;\n  height: 0.3125em;\n  border-radius: 0.125em;\n  background-color: #a5dc86;\n}\n.swal2-icon.swal2-success [class^=swal2-success-line][class$=tip] {\n  top: 2.875em;\n  left: 0.8125em;\n  width: 1.5625em;\n  transform: rotate(45deg);\n}\n.swal2-icon.swal2-success [class^=swal2-success-line][class$=long] {\n  top: 2.375em;\n  right: 0.5em;\n  width: 2.9375em;\n  transform: rotate(-45deg);\n}\n.swal2-icon.swal2-success.swal2-icon-show .swal2-success-line-tip {\n  -webkit-animation: swal2-animate-success-line-tip 0.75s;\n          animation: swal2-animate-success-line-tip 0.75s;\n}\n.swal2-icon.swal2-success.swal2-icon-show .swal2-success-line-long {\n  -webkit-animation: swal2-animate-success-line-long 0.75s;\n          animation: swal2-animate-success-line-long 0.75s;\n}\n.swal2-icon.swal2-success.swal2-icon-show .swal2-success-circular-line-right {\n  -webkit-animation: swal2-rotate-success-circular-line 4.25s ease-in;\n          animation: swal2-rotate-success-circular-line 4.25s ease-in;\n}\n\n.swal2-progress-steps {\n  flex-wrap: wrap;\n  align-items: center;\n  max-width: 100%;\n  margin: 1.25em auto;\n  padding: 0;\n  background: inherit;\n  font-weight: 600;\n}\n.swal2-progress-steps li {\n  display: inline-block;\n  position: relative;\n}\n.swal2-progress-steps .swal2-progress-step {\n  z-index: 20;\n  flex-shrink: 0;\n  width: 2em;\n  height: 2em;\n  border-radius: 2em;\n  background: #2778c4;\n  color: #fff;\n  line-height: 2em;\n  text-align: center;\n}\n.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step {\n  background: #2778c4;\n}\n.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step ~ .swal2-progress-step {\n  background: #add8e6;\n  color: #fff;\n}\n.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step ~ .swal2-progress-step-line {\n  background: #add8e6;\n}\n.swal2-progress-steps .swal2-progress-step-line {\n  z-index: 10;\n  flex-shrink: 0;\n  width: 2.5em;\n  height: 0.4em;\n  margin: 0 -1px;\n  background: #2778c4;\n}\n\n[class^=swal2] {\n  -webkit-tap-highlight-color: transparent;\n}\n\n.swal2-show {\n  -webkit-animation: swal2-show 0.3s;\n          animation: swal2-show 0.3s;\n}\n\n.swal2-hide {\n  -webkit-animation: swal2-hide 0.15s forwards;\n          animation: swal2-hide 0.15s forwards;\n}\n\n.swal2-noanimation {\n  transition: none;\n}\n\n.swal2-scrollbar-measure {\n  position: absolute;\n  top: -9999px;\n  width: 50px;\n  height: 50px;\n  overflow: scroll;\n}\n\n.swal2-rtl .swal2-close {\n  margin-right: initial;\n  margin-left: 0;\n}\n.swal2-rtl .swal2-timer-progress-bar {\n  right: 0;\n  left: auto;\n}\n\n@-webkit-keyframes swal2-toast-show {\n  0% {\n    transform: translateY(-0.625em) rotateZ(2deg);\n  }\n  33% {\n    transform: translateY(0) rotateZ(-2deg);\n  }\n  66% {\n    transform: translateY(0.3125em) rotateZ(2deg);\n  }\n  100% {\n    transform: translateY(0) rotateZ(0deg);\n  }\n}\n\n@keyframes swal2-toast-show {\n  0% {\n    transform: translateY(-0.625em) rotateZ(2deg);\n  }\n  33% {\n    transform: translateY(0) rotateZ(-2deg);\n  }\n  66% {\n    transform: translateY(0.3125em) rotateZ(2deg);\n  }\n  100% {\n    transform: translateY(0) rotateZ(0deg);\n  }\n}\n@-webkit-keyframes swal2-toast-hide {\n  100% {\n    transform: rotateZ(1deg);\n    opacity: 0;\n  }\n}\n@keyframes swal2-toast-hide {\n  100% {\n    transform: rotateZ(1deg);\n    opacity: 0;\n  }\n}\n@-webkit-keyframes swal2-toast-animate-success-line-tip {\n  0% {\n    top: 0.5625em;\n    left: 0.0625em;\n    width: 0;\n  }\n  54% {\n    top: 0.125em;\n    left: 0.125em;\n    width: 0;\n  }\n  70% {\n    top: 0.625em;\n    left: -0.25em;\n    width: 1.625em;\n  }\n  84% {\n    top: 1.0625em;\n    left: 0.75em;\n    width: 0.5em;\n  }\n  100% {\n    top: 1.125em;\n    left: 0.1875em;\n    width: 0.75em;\n  }\n}\n@keyframes swal2-toast-animate-success-line-tip {\n  0% {\n    top: 0.5625em;\n    left: 0.0625em;\n    width: 0;\n  }\n  54% {\n    top: 0.125em;\n    left: 0.125em;\n    width: 0;\n  }\n  70% {\n    top: 0.625em;\n    left: -0.25em;\n    width: 1.625em;\n  }\n  84% {\n    top: 1.0625em;\n    left: 0.75em;\n    width: 0.5em;\n  }\n  100% {\n    top: 1.125em;\n    left: 0.1875em;\n    width: 0.75em;\n  }\n}\n@-webkit-keyframes swal2-toast-animate-success-line-long {\n  0% {\n    top: 1.625em;\n    right: 1.375em;\n    width: 0;\n  }\n  65% {\n    top: 1.25em;\n    right: 0.9375em;\n    width: 0;\n  }\n  84% {\n    top: 0.9375em;\n    right: 0;\n    width: 1.125em;\n  }\n  100% {\n    top: 0.9375em;\n    right: 0.1875em;\n    width: 1.375em;\n  }\n}\n@keyframes swal2-toast-animate-success-line-long {\n  0% {\n    top: 1.625em;\n    right: 1.375em;\n    width: 0;\n  }\n  65% {\n    top: 1.25em;\n    right: 0.9375em;\n    width: 0;\n  }\n  84% {\n    top: 0.9375em;\n    right: 0;\n    width: 1.125em;\n  }\n  100% {\n    top: 0.9375em;\n    right: 0.1875em;\n    width: 1.375em;\n  }\n}\n@-webkit-keyframes swal2-show {\n  0% {\n    transform: scale(0.7);\n  }\n  45% {\n    transform: scale(1.05);\n  }\n  80% {\n    transform: scale(0.95);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n@keyframes swal2-show {\n  0% {\n    transform: scale(0.7);\n  }\n  45% {\n    transform: scale(1.05);\n  }\n  80% {\n    transform: scale(0.95);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n@-webkit-keyframes swal2-hide {\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  100% {\n    transform: scale(0.5);\n    opacity: 0;\n  }\n}\n@keyframes swal2-hide {\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  100% {\n    transform: scale(0.5);\n    opacity: 0;\n  }\n}\n@-webkit-keyframes swal2-animate-success-line-tip {\n  0% {\n    top: 1.1875em;\n    left: 0.0625em;\n    width: 0;\n  }\n  54% {\n    top: 1.0625em;\n    left: 0.125em;\n    width: 0;\n  }\n  70% {\n    top: 2.1875em;\n    left: -0.375em;\n    width: 3.125em;\n  }\n  84% {\n    top: 3em;\n    left: 1.3125em;\n    width: 1.0625em;\n  }\n  100% {\n    top: 2.8125em;\n    left: 0.8125em;\n    width: 1.5625em;\n  }\n}\n@keyframes swal2-animate-success-line-tip {\n  0% {\n    top: 1.1875em;\n    left: 0.0625em;\n    width: 0;\n  }\n  54% {\n    top: 1.0625em;\n    left: 0.125em;\n    width: 0;\n  }\n  70% {\n    top: 2.1875em;\n    left: -0.375em;\n    width: 3.125em;\n  }\n  84% {\n    top: 3em;\n    left: 1.3125em;\n    width: 1.0625em;\n  }\n  100% {\n    top: 2.8125em;\n    left: 0.8125em;\n    width: 1.5625em;\n  }\n}\n@-webkit-keyframes swal2-animate-success-line-long {\n  0% {\n    top: 3.375em;\n    right: 2.875em;\n    width: 0;\n  }\n  65% {\n    top: 3.375em;\n    right: 2.875em;\n    width: 0;\n  }\n  84% {\n    top: 2.1875em;\n    right: 0;\n    width: 3.4375em;\n  }\n  100% {\n    top: 2.375em;\n    right: 0.5em;\n    width: 2.9375em;\n  }\n}\n@keyframes swal2-animate-success-line-long {\n  0% {\n    top: 3.375em;\n    right: 2.875em;\n    width: 0;\n  }\n  65% {\n    top: 3.375em;\n    right: 2.875em;\n    width: 0;\n  }\n  84% {\n    top: 2.1875em;\n    right: 0;\n    width: 3.4375em;\n  }\n  100% {\n    top: 2.375em;\n    right: 0.5em;\n    width: 2.9375em;\n  }\n}\n@-webkit-keyframes swal2-rotate-success-circular-line {\n  0% {\n    transform: rotate(-45deg);\n  }\n  5% {\n    transform: rotate(-45deg);\n  }\n  12% {\n    transform: rotate(-405deg);\n  }\n  100% {\n    transform: rotate(-405deg);\n  }\n}\n@keyframes swal2-rotate-success-circular-line {\n  0% {\n    transform: rotate(-45deg);\n  }\n  5% {\n    transform: rotate(-45deg);\n  }\n  12% {\n    transform: rotate(-405deg);\n  }\n  100% {\n    transform: rotate(-405deg);\n  }\n}\n@-webkit-keyframes swal2-animate-error-x-mark {\n  0% {\n    margin-top: 1.625em;\n    transform: scale(0.4);\n    opacity: 0;\n  }\n  50% {\n    margin-top: 1.625em;\n    transform: scale(0.4);\n    opacity: 0;\n  }\n  80% {\n    margin-top: -0.375em;\n    transform: scale(1.15);\n  }\n  100% {\n    margin-top: 0;\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n@keyframes swal2-animate-error-x-mark {\n  0% {\n    margin-top: 1.625em;\n    transform: scale(0.4);\n    opacity: 0;\n  }\n  50% {\n    margin-top: 1.625em;\n    transform: scale(0.4);\n    opacity: 0;\n  }\n  80% {\n    margin-top: -0.375em;\n    transform: scale(1.15);\n  }\n  100% {\n    margin-top: 0;\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n@-webkit-keyframes swal2-animate-error-icon {\n  0% {\n    transform: rotateX(100deg);\n    opacity: 0;\n  }\n  100% {\n    transform: rotateX(0deg);\n    opacity: 1;\n  }\n}\n@keyframes swal2-animate-error-icon {\n  0% {\n    transform: rotateX(100deg);\n    opacity: 0;\n  }\n  100% {\n    transform: rotateX(0deg);\n    opacity: 1;\n  }\n}\n@-webkit-keyframes swal2-rotate-loading {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n@keyframes swal2-rotate-loading {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\nbody.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) {\n  overflow: hidden;\n}\nbody.swal2-height-auto {\n  height: auto !important;\n}\nbody.swal2-no-backdrop .swal2-container {\n  background-color: transparent !important;\n  pointer-events: none;\n}\nbody.swal2-no-backdrop .swal2-container .swal2-popup {\n  pointer-events: all;\n}\nbody.swal2-no-backdrop .swal2-container .swal2-modal {\n  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);\n}\n@media print {\n  body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) {\n    overflow-y: scroll !important;\n  }\n  body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) > [aria-hidden=true] {\n    display: none;\n  }\n  body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) .swal2-container {\n    position: static !important;\n  }\n}\nbody.swal2-toast-shown .swal2-container {\n  box-sizing: border-box;\n  width: 360px;\n  max-width: 100%;\n  background-color: transparent;\n}\nbody.swal2-toast-shown .swal2-container.swal2-top {\n  top: 0;\n  right: auto;\n  bottom: auto;\n  left: 50%;\n  transform: translateX(-50%);\n}\nbody.swal2-toast-shown .swal2-container.swal2-top-end, body.swal2-toast-shown .swal2-container.swal2-top-right {\n  top: 0;\n  right: 0;\n  bottom: auto;\n  left: auto;\n}\nbody.swal2-toast-shown .swal2-container.swal2-top-start, body.swal2-toast-shown .swal2-container.swal2-top-left {\n  top: 0;\n  right: auto;\n  bottom: auto;\n  left: 0;\n}\nbody.swal2-toast-shown .swal2-container.swal2-center-start, body.swal2-toast-shown .swal2-container.swal2-center-left {\n  top: 50%;\n  right: auto;\n  bottom: auto;\n  left: 0;\n  transform: translateY(-50%);\n}\nbody.swal2-toast-shown .swal2-container.swal2-center {\n  top: 50%;\n  right: auto;\n  bottom: auto;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\nbody.swal2-toast-shown .swal2-container.swal2-center-end, body.swal2-toast-shown .swal2-container.swal2-center-right {\n  top: 50%;\n  right: 0;\n  bottom: auto;\n  left: auto;\n  transform: translateY(-50%);\n}\nbody.swal2-toast-shown .swal2-container.swal2-bottom-start, body.swal2-toast-shown .swal2-container.swal2-bottom-left {\n  top: auto;\n  right: auto;\n  bottom: 0;\n  left: 0;\n}\nbody.swal2-toast-shown .swal2-container.swal2-bottom {\n  top: auto;\n  right: auto;\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n}\nbody.swal2-toast-shown .swal2-container.swal2-bottom-end, body.swal2-toast-shown .swal2-container.swal2-bottom-right {\n  top: auto;\n  right: 0;\n  bottom: 0;\n  left: auto;\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/_vector-map.scss",
    "content": "svg {\n  -ms-touch-action: none;\n      touch-action: none;\n}\n\nimage, text, .jvm-zoomin, .jvm-zoomout {\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.jvm-container {\n  -ms-touch-action: none;\n      touch-action: none;\n  position: relative;\n  overflow: hidden;\n  height: 100%;\n  width: 100%;\n}\n\n.jvm-tooltip {\n  border-radius: 3px;\n  background-color: #5c5cff;\n  font-family: sans-serif, Verdana;\n  font-size: smaller;\n  box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.2);\n  padding: 3px 5px;\n  white-space: nowrap;\n  position: absolute;\n  display: none;\n  color: #FFF;\n}\n\n.jvm-zoom-btn {\n  border-radius: 3px;\n  background-color: #292929;\n  padding: 3px;\n  box-sizing: border-box;\n  position: absolute;\n  line-height: 10px;\n  cursor: pointer;\n  color: #FFF;\n  height: 15px;\n  width: 15px;\n  left: 10px;\n}\n\n.jvm-zoom-btn.jvm-zoomout {\n  top: 30px;\n}\n\n.jvm-zoom-btn.jvm-zoomin {\n  top: 10px;\n}\n\n.jvm-series-container {\n  right: 15px;\n  position: absolute;\n}\n\n.jvm-series-container.jvm-series-h {\n  bottom: 15px;\n}\n\n.jvm-series-container.jvm-series-v {\n  top: 15px;\n}\n\n.jvm-series-container .jvm-legend {\n  background-color: #FFF;\n  border: 1px solid #e5e7eb;\n  margin-left: 0.75rem;\n  border-radius: 0.25rem;\n  border-color: #e5e7eb;\n  padding: 0.6rem;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  float: left;\n}\n\n.jvm-series-container .jvm-legend .jvm-legend-title {\n  line-height: 1;\n  border-bottom: 1px solid #e5e7eb;\n  padding-bottom: 0.5rem;\n  margin-bottom: 0.575rem;\n  text-align: left;\n}\n\n.jvm-series-container .jvm-legend .jvm-legend-inner {\n  overflow: hidden;\n}\n\n.jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick {\n  overflow: hidden;\n  min-width: 40px;\n}\n\n.jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick:not(:first-child) {\n  margin-top: 0.575rem;\n}\n\n.jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick .jvm-legend-tick-sample {\n  border-radius: 4px;\n  margin-right: .65rem;\n  height: 16px;\n  width: 16px;\n  float: left;\n}\n\n.jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick .jvm-legend-tick-text {\n  font-size: 12px;\n  text-align: center;\n  float: left;\n}\n\n.jvm-line[animation=\"true\"] {\n  -webkit-animation: jvm-line-animation 10s linear forwards infinite;\n  animation: jvm-line-animation 10s linear forwards infinite;\n}\n\n@-webkit-keyframes jvm-line-animation {\n  from {\n    stroke-dashoffset: 250;\n  }\n}\n\n@keyframes jvm-line-animation {\n  from {\n    stroke-dashoffset: 250;\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/multi-step.scss",
    "content": ".multisteps-form__progress {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));\n}\n\n.multisteps-form__progress-btn {\n  transition-property: all;\n  transition-duration: 0.15s;\n  transition-timing-function: linear;\n  transition-delay: 0s;\n  position: relative;\n  padding-top: 20px;\n  color: rgba($white, .4);\n  text-transform: uppercase;\n  font-weight: 500;\n  font-size: $font-size-xs;\n  text-indent: -9999px;\n  border: none;\n  background-color: transparent;\n  outline: none !important;\n  cursor: pointer;\n}\n\n@media (min-width: 500px) {\n  .multisteps-form__progress-btn {\n    text-indent: 0;\n  }\n}\n\n.multisteps-form__progress-btn:before {\n  position: absolute;\n  top: 0;\n  left: 50%;\n  display: block;\n  width: 13px;\n  height: 13px;\n  content: '';\n  -webkit-transform: translateX(-50%);\n          transform: translateX(-50%);\n  transition: all 0.15s linear 0s, -webkit-transform 0.15s cubic-bezier(0.05, 1.09, 0.16, 1.4) 0s;\n  transition: all 0.15s linear 0s, transform 0.15s cubic-bezier(0.05, 1.09, 0.16, 1.4) 0s;\n  transition: all 0.15s linear 0s, transform 0.15s cubic-bezier(0.05, 1.09, 0.16, 1.4) 0s, -webkit-transform 0.15s cubic-bezier(0.05, 1.09, 0.16, 1.4) 0s;\n  border: 2px solid rgba($white, 0);\n  border-radius: 50%;\n  background-color: $gray-300;\n  box-sizing: border-box;\n  z-index: 3;\n}\n\n.bg-gradient-primary{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-primary-color;\n  }\n}\n\n.bg-gradient-success{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-success-color;\n  }\n}\n\n.bg-gradient-danger{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-danger-color;\n  }\n}\n\n.bg-gradient-warning{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-warning-color;\n  }\n}\n\n.bg-gradient-info{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-info-color;\n  }\n}\n\n.bg-gradient-dark{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-dark-color;\n  }\n}\n\n.bg-gradient-secondary{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-secondary-color;\n  }\n}\n\n.bg-gradient-light{\n  .multisteps-form__progress-btn:before{\n    background-color: $multistep-progress-light-color;\n  }\n}\n\n.multisteps-form__progress-btn:after {\n  position: absolute;\n  top: 5px;\n  left: calc(-50% - 13px / 2);\n  transition-property: all;\n  transition-duration: 0.15s;\n  transition-timing-function: linear;\n  transition-delay: 0s;\n  display: block;\n  width: 100%;\n  height: 2px;\n  content: '';\n  background-color: currentColor;\n  z-index: 1;\n}\n\n.multisteps-form__progress-btn:first-child:after {\n  display: none;\n}\n\n.multisteps-form__progress-btn.js-active {\n  color: $white;\n  span{\n    color: rgba($white, .7);\n  }\n}\n\n.multisteps-form__progress-btn.js-active:before {\n  -webkit-transform: translateX(-50%) scale(1.2);\n          transform: translateX(-50%) scale(1.2);\n  background-color: currentColor;\n}\n\n.multisteps-form__form {\n  position: relative;\n}\n\n.multisteps-form__panel {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 0;\n  opacity: 0;\n  visibility: hidden;\n}\n\n.multisteps-form__panel.js-active {\n  height: auto;\n  opacity: 1;\n  visibility: visible;\n}\n\n.multisteps-form__panel[data-animation=\"scaleIn\"] {\n  -webkit-transform: scale(0.9);\n          transform: scale(0.9);\n}\n\n.multisteps-form__panel[data-animation=\"scaleIn\"].js-active {\n  transition-property: all;\n  transition-duration: 0.2s;\n  transition-timing-function: linear;\n  transition-delay: 0s;\n  -webkit-transform: scale(1);\n          transform: scale(1);\n}\n\n// CT Styling\n\n.multisteps-form__panel {\n  .multisteps-form__content {\n    .btn-check:checked + .btn-outline-primary,\n    .btn-check:active + .btn-outline-primary,\n    .btn-outline-primary:active {\n      color: $white;\n    }\n    .is-filled.is-focused,\n    .is-focused,\n    .is-filled {\n      .btn {\n        &:hover {\n          color: $primary !important;\n        }\n      }\n    }\n\n    .btn i {\n      font-size: 2rem;\n    }\n  }\n}\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/plugins/pro/plugins-extend.scss",
    "content": "@import \"../free/plugins\";\n\n@import \"choices\";\n@import \"glidejs\";\n@import \"fullcalendar\";\n@import \"fullcalendar-extend\";\n@import \"datatable\";\n@import \"datatable-extend\";\n@import \"dragula\";\n@import \"kanban\";\n@import \"sweetalert2\";\n@import \"sweetalert2-extend\";\n@import \"dropzone\";\n@import \"highlight\";\n@import \"quill\";\n@import \"choices\";\n@import \"list-check\";\n@import \"photoswipe\";\n@import \"rating-widget\";\n@import \"leaflet\";\n@import \"multi-step\";\n@import \"vector-map\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/theme-pro.scss",
    "content": "/*!\n\n=========================================================\n* Material Dashboard - v3.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n\n* Coded by www.creative-tim.com\n\n=========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n*/\n\n// {{ site.product.name }} Core styling components\n\n@import \"theme\";\n\n// Mixin\n@import \"mixins/mixins\";\n\n// PRO Components\n@import \"accordion\";\n@import \"backgrounds\";\n@import \"cards-extend\";\n@import \"components\";\n@import \"dropdown-extend\";\n@import \"floating-elements\";\n@import \"list-check\";\n@import \"misc-extend\";\n@import \"rtl-extend\";\n\n// Plugins\n@import \"plugins/pro/plugins-extend\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/theme.scss",
    "content": "/*!\n\n=========================================================\n* Material Dashboard - v3.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n* Licensed under MIT (site.license)\n\n* Coded by www.creative-tim.com\n\n=========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n*/\n\n// {{ site.product.name }} components\n\n// Variables\n@import \"variables/navbar-vertical\";\n@import \"variables/social-buttons\";\n@import \"variables/breadcrumb\";\n\n// Mixin\n@import \"mixins/mixins\";\n\n// Core Components - extra styling\n@import \"alert\";\n@import \"avatars\";\n@import \"badge\";\n@import \"buttons\";\n@import \"breadcrumbs\";\n@import \"cards\";\n@import \"dark-version\";\n@import \"dropdown\";\n@import \"dropup\";\n@import \"header\";\n@import \"fixed-plugin\";\n@import \"forms/forms\";\n@import \"footer\";\n@import \"gradients\";\n@import \"icons\";\n@import \"info-areas\";\n@import \"misc\";\n@import \"navbar\";\n@import \"navbar-vertical\";\n@import \"nav\";\n@import \"pagination\";\n@import \"popovers\";\n@import \"progress\";\n@import \"rtl\";\n@import \"ripple\";\n@import \"social-buttons\";\n@import \"tables\";\n@import \"timeline\";\n@import \"tilt\";\n@import \"tooltips\";\n@import \"typography\";\n\n// Plugins\n@import \"plugins/free/plugins\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_animations.scss",
    "content": "// Waves Animation & Styling\n\n$waves-position:                        relative !default;\n$waves-width:                           100% !default;\n$waves-height:                          16vh !default;\n$waves-min-height:                      100px !default;\n$waves-max-height:                      150px !default;\n$waves-margin-bottom:                   -7px !default;\n$waves-height-sm:                       50px !default;\n$waves-min-height-sm:                   $waves-height-sm !default;\n$waves-rotate:                          rotate(180deg) !default;\n$waves-mobile-height:                   40px !default;\n\n$moving-waves-keyframe-0:               translate3d(-90px,0,0) !default;\n$moving-waves-keyframe-100:             translate3d(85px,0,0) !default;\n$moving-waves-animation:                move-forever 40s cubic-bezier(.55,.5,.45,.5) infinite !default;\n$moving-waves-child-1-delay:            -2s !default;\n$moving-waves-child-1-duration:         11s !default;\n$moving-waves-child-2-delay:            -4s !default;\n$moving-waves-child-2-duration:         13s !default;\n$moving-waves-child-3-delay:            -3s !default;\n$moving-waves-child-3-duration:         15s !default;\n$moving-waves-child-4-delay:            -4s !default;\n$moving-waves-child-4-duration:         20s !default;\n$moving-waves-child-5-delay:            -4s !default;\n$moving-waves-child-5-duration:         25s !default;\n$moving-waves-child-6-delay:            -3s !default;\n$moving-waves-child-6-duration:         30s !default;\n\n// Fade In\n\n$fade-in-animation-name:                fadeInBottom !default;\n$fade-in-animation-top-name:            fadeInTop !default;\n$fade-in-bottom-transform:              translateY(100%) !default;\n$fade-in-top-transform:                 translateY(-100%) !default;\n\n\n$fade-in-1-animation-duration:          1.5s !default;\n$fade-in-2-animation-duration:          1.75s !default;\n$fade-in-3-animation-duration:          2s !default;\n$fade-in-4-animation-duration:          2.25s !default;\n$fade-in-5-animation-duration:          2.5s !default;\n\n\n$floating-man-width:                    350px !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_avatars.scss",
    "content": "// Avatar\n$avatar-height:               48px !default;\n$avatar-width:                48px !default;\n\n$avatar-xs-height:            24px !default;\n$avatar-xs-width:             24px !default;\n\n$avatar-sm-height:            36px !default;\n$avatar-sm-width:             36px !default;\n\n$avatar-lg-height:            58px !default;\n$avatar-lg-width:             58px !default;\n\n$avatar-xl-height:            74px !default;\n$avatar-xl-width:             74px !default;\n\n$avatar-xxl-height:           110px !default;\n$avatar-xxl-width:            110px !default;\n\n$avatar-font-size:            1rem !default;\n$avatar-content-margin:       .75rem !default;\n\n\n// Avatar Group\n$avatar-group-border:         2px !default;\n$avatar-group-zindex:         2 !default;\n$avatar-group-zindex-hover:   3 !default;\n$avatar-group-double:         -1rem !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_badge.scss",
    "content": "// Badge\n$badge-sm-padding:                  .45em .775em !default;\n$badge-sm-font-size:                .65em !default;\n$badge-md-padding:                  .65em 1em !default;\n$badge-lg-padding:                  .85em 1.375em !default;\n$badge-inline-margin-right:         .625rem !default;\n$badge-inline-span-top:             2px !default;\n$badge-btn-margin:                  .5rem !default;\n\n// Badge Circle\n$badge-circle-border-radius:        50% !default;\n$badge-circle-width:                1.25rem !default;\n$badge-circle-height:               1.25rem !default;\n$badge-circle-font-size:            .75rem !default;\n$badge-circle-font-weight:          600 !default;\n\n$badge-circle-md-width:             1.5rem !default;\n$badge-circle-md-height:            1.5rem !default;\n\n$badge-circle-lg-width:             2rem !default;\n$badge-circle-lg-height:            2rem !default;\n\n//Badge Dot\n$badge-dot-icon-width:              .375rem !default;\n$badge-dot-icon-height:             .375rem !default;\n$badge-dot-icon-radius:             50% !default;\n$badge-dot-icon-margin-right:       .375rem !default;\n\n$badge-dot-md-icon-width:           .5rem !default;\n$badge-dot-md-icon-height:          .5rem !default;\n\n$badge-dot-lg-icon-width:           .625rem !default;\n$badge-dot-lg-icon-height:          .625rem !default;\n\n//Badge Floating\n$badge-floating-top:                 -50% !default;\n$badge-floating-border:              3px !default;\n$badge-floating-transform:           translate(147%, 50%) !default;\n\n$card-badge-position:                -.6875rem !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_breadcrumb.scss",
    "content": "$breadcrumb-dark-bg:                $dark !default;\n$breadcrumb-dark-color:             $gray-100 !default;\n$breadcrumb-dark-hover-color:       $white !default;\n$breadcrumb-dark-active-color:      $gray-300 !default;\n$breadcrumb-dark-divider-color:     $gray-500 !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_cards-extend.scss",
    "content": "// Card Profile\n$card-profile-body-text-align:      center !default;\n$card-profile-body-padding:         1.25rem 2rem !default;\n$card-profile-avatar-margin:        0 auto !default;\n$card-profile-img-mt:               32px !default;\n$card-profile-img-radius:           50% !default;\n$card-profile-img-width:            130px !default;\n$card-profile-btn-mt:               24px !default;\n$card-profile-p-line-height:        1.778 !default;\n\n// Card Pricing\n$card-pricing-body-padding:         2.25rem !default;\n$card-pricing-line-height:          1.111 !default;\n$card-pricing-title-mb:             $card-bg-description-margin !default;\n$card-pricing-td-line-height:       1.429 !default;\n$card-pricing-icon-height:          4rem !default;\n$card-pricing-icon-width:           $card-pricing-icon-height !default;\n$card-pricing-icon-position:        absolute !default;\n$card-pricing-icon-top:             -22px !default;\n$card-pricing-icon-font-size:       1.25rem !default;\n$card-pricing-icon-lg-font-size:    1.75rem !default;\n$card-pricing-i-padding:            18px !default;\n$card-pricing-badge-padding:        5px !default;\n$card-pricing-badge-font-size:      6px !default;\n$card-pricing-badge-position:       relative !default;\n$card-pricing-badge-top:            -2px !default;\n$card-pricing-border-color:         linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));\n$card-pricing-border-color-dark:    linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .4), rgba(0, 0, 0, 0));\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_cards.scss",
    "content": "$card-box-shadow:                   0 4px 6px -1px rgba(0,0,0,0.1),\n                                    0 2px 4px -1px rgba(0,0,0,0.06)  !default;\n$card-background-blur:              rgba(255, 255, 255, 0.8) !default;\n\n$card-header-padding:               1.5rem !default;\n\n$card-body-padding:                 $card-header-padding !default;\n$card-plain-bg-color:               transparent !default;\n$card-plain-box-shadow:             none !default;\n\n$card-footer-padding:               $card-body-padding !default;\n\n$card-title-font-weight:            $font-weight-bold !default;\n$card-title-line-height:            1.2 !default;\n\n$card-author-display:               flex !default;\n$card-author-name-line-height:      1.571 !default;\n$card-author-name-color:            #3A416F !default;\n$card-author-stats-color:           #5D6494 !default;\n$card-avatar-width:                 30px !default;\n$card-avatar-height:                $card-avatar-width !default;\n$card-avatar-overflow:              hidden !default;\n$card-avatar-radius:                50% !default;\n$card-avatar-mr:                    5px !default;\n$card-stats-name-mt:                -4px !default;\n$card-name-ml:                      .25rem !default;\n\n$card-badge-text-transform:         uppercase !default;\n$card-badge-bg-color:               #FAFAFF !default;\n\n\n// Card Background\n$card-bg-align-items:               center !default;\n$card-bg-body-position:             relative !default;\n$card-bg-body-z-index:              2 !default;\n$card-bg-content-min-height:        330px !default;\n$card-bg-content-max-width:         450px !default;\n$card-bg-content-pt:                60px !default;\n$card-bg-content-pb:                $card-bg-content-pt !default;\n$card-bg-body-left-width:           90% !default;\n\n$card-bg-description-margin:        24px !default;\n\n$card-bg-filter-position:           absolute !default;\n$card-bg-filter-top:                0 !default;\n$card-bg-filter-bottom:             $card-bg-filter-top !default;\n$card-bg-filter-left:               $card-bg-filter-top !default;\n$card-bg-filter-height:             100% !default;\n$card-bg-filter-width:              $card-bg-filter-height !default;\n$card-bg-filter-z-index:            1 !default;\n$card-bg-filter-display:            block !default;\n$card-bg-filter-content:            \"\" !default;\n$card-bg-filter-bg:                 rgba(0,0,0,.56) !default;\n$card-bg-filter-mask-bg:            rgba(0,0,0,.2) !default;\n$card-bg-filter-radius:             1rem !default;\n\n$card-full-bg-bg-position:          50% !default;\n$card-full-bg-bg-size:              cover !default;\n$card-full-bg-mb:                   30px !default;\n$card-full-bg-width:                100% !default;\n$card-full-bg-height:               $card-full-bg-width !default;\n$card-full-bg-position:             absolute !default;\n$card-full-bg-radius:               $card-bg-filter-radius !default;\n\n$header-data-animation-transition:  all 300ms cubic-bezier(0.34, 1.61, 0.7, 1) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_choices.scss",
    "content": "$choices-box-shadow: $dropdown-box-shadow !default;\n$choices-border-radius: .5rem !default;\n$choices-animation: .3s cubic-bezier(.23,1,.32,1) !default;\n$choices-transition: $dropdown-transition !default;\n$choices-transform: scale(.95) !important !default;\n$choices-transform-show: scale(1) !important !default;\n$choices-padding-y: 1rem !default;\n$choices-padding-x: .5rem !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_dark-version.scss",
    "content": "$dark-version-body-color:                 rgba(255, 255, 255, .8) !default;\n$dark-version-bg-color:                   #1a2035 !default;\n$dark-version-sidenav-bg-color:           #1f283e !default;\n$dark-version-card-bg-color:              #202940 !default;\n$dark-version-card-box-shadow:            0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .20), 0 1px 5px 0 rgba(0, 0, 0,  .12) !default;\n$dark-version-input-bg-image:             linear-gradient(0deg, #e91e63 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, rgba(210, 210, 210, .6)  1px, rgba(209, 209, 209, 0) 0) !default;\n$dark-version-border-color:               rgba(255, 255, 255, .4) !default;\n$dark-version-table-color:                rgba(255, 255, 255, .6) !default;\n$dark-version-caret-sidebar-color:        rgba(206, 212, 218, .7) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_dropdowns.scss",
    "content": "$dropdown-subitem-position:                101% !default;\n$dropdown-transition:                      transform .3s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1) !important !default;\n$dropdown-transform-origin:                0 0 !default;\n$dropdown-transform:                       scale(.95) !important !default;\n$dropdown-transform-show:                  scale(1) !important !default;\n\n$dropdown-multilevel-transform:            scale(.95) !important !default;\n$dropdown-multilevel-transform-show:       scale(1) !important !default;\n\n$dropup-transform-origin:                  bottom !default;\n$dropup-transform:                         scale(.95) !important !default;\n$dropup-transform-show:                    scale(1) !important !default;\n\n$dropdown-icon-margin-right:               .75rem !default;\n\n$dropdown-toggle-arrow-transform:          rotate(180deg) !default;\n$dropdown-toggle-arrow-transition:         .3s ease !default;\n\n$dropdown-button-after-margin-top:         3px !default;\n\n$dropdown-animation-arrow-left-position:   28px !default;\n$dropup-animation-arrow-bottom-position:   22px !default;\n$dropdown-animation-arrow-font-size:       22px !default;\n$dropup-animation-arrow-transition:        bottom .35s ease !default;\n$dropdown-animation-arrow-transition:      top .35s ease !default;\n$dropup-mb:                                .5rem !default;\n\n$dropdown-mt:                              2.8125rem !default;\n$dropdown-hover-after-bottom-pos:          -24px !default;\n$dropdown-hover-after-bottom-pos:          -24px !default;\n$dropdown-hover-arrow-active-top:          -20px !default;\n\n$dropdown-subitem-position-right:          -197px !default;\n$dropdown-subitem-left-hover:              -8px !default;\n$dropdown-subitem-arrow-rotate:            rotate(-90deg) !default;\n\n$dropdown-md-min-width:                    15rem !default;\n$dropdown-lg-min-width:                    23rem !default;\n$dropdown-lg-width-responsive:             19rem !default;\n$dropdown-xl-min-width:                    40rem !default;\n\n$dropdown-subitem-position:                101% !default;\n\n\n// Extend\n$dropdown-subitem-position-right: -197px !default;\n$dropdown-subitem-left-hover:   -8px !default;\n$dropdown-subitem-arrow-rotate:   rotate(-90deg) !default;\n\n$dropdown-md-min-width:         15rem !default;\n$dropdown-lg-min-width:         23rem !default;\n$dropdown-lg-width-responsive:  19rem !default;\n$dropdown-xl-min-width:         40rem !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_fixed-plugin.scss",
    "content": "$fixed-plugin-bottom: 30px !default;\n$fixed-plugin-right: $fixed-plugin-bottom !default;\n$fixed-plugin-radius: 50% !default;\n$fixed-plugin-box-shadow: $navbar-box-shadow !default;\n$fixed-plugin-button-z-index: 990 !default;\n$fixed-plugin-card-z-index: 1020 !default;\n$fixed-plugin-card-width: 360px !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_form-switch.scss",
    "content": "$slider-dim: 15px !default;\n$slider-position: 2px !default;\n$moving-circle: translateX(21px) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_full-calendar.scss",
    "content": "$fc-event-title-padding-y:          .2rem !default;\n$fc-event-title-padding-x:          .3rem !default;\n\n$fc-daygrid-event-border-radius:     .35rem !default;\n\n$fc-theme-standard-dark-border-color: rgba($secondary, .3) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_header.scss",
    "content": "$page-header-padding:             0 !default;\n$page-header-position:            relative !default;\n$page-header-overflow:            hidden !default;\n$page-header-display:             flex !default;\n$page-header-align-items:         center !default;\n$page-header-bg-size:             cover !default;\n$page-header-bg-position:         50% !default;\n\n$mask-position:                   absolute !default;\n$mask-bg-size:                    cover !default;\n$mask-bg-position:                center center !default;\n$mask-top:                        0 !default;\n$mask-left:                       $mask-top !default;\n$mask-width:                      100% !default;\n$mask-height:                     $mask-width !default;\n$mask-opacity:                    .8 !default;\n\n$page-header-conteiner-index:     1 !default;\n\n$header-video-top:                50% !default;\n$header-video-left:               $header-video-top !default;\n$header-video-min-width:          100% !default;\n$header-video-min-height:         $header-video-min-width !default;\n$header-video-min-transform:      translateX(-50%) translateY(-50%) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_info-areas.scss",
    "content": "$icon-shape-bg-image:               linear-gradient(195deg,#7928CA,#FF0080) !default;\n$icon-shape-bg-position:            center !default;\n\n$icon-striped-bg-md:                85px !default;\n$icon-striped-bg-lg:                111px !default;\n$icon-striped-bg-xl:                80px !default;\n\n$icon-striped-icon-mt:              25% !default;\n$icon-striped-icon-ml:              -24% !default;\n\n$icon-shape-icon-opacity:           .8 !default;\n$info-icon-top:                     11px !default;\n$info-icon-top-xxs:                 0 !default;\n$info-icon-top-xs:                  -1px !default;\n$info-icon-top-sm:                  4px !default;\n$info-icon-top-md:                  30% !default;\n$info-icon-top-lg:                  31% !default;\n$info-icon-top-xl:                  35% !default;\n$info-icon-position:                relative !default;\n\n$icon-xxs-width:                    20px !default;\n$icon-xxs-height:                   $icon-xxs-width !default;\n$icon-xs-width:                     24px !default;\n$icon-xs-height:                    $icon-xs-width !default;\n$icon-sm-width:                     32px !default;\n$icon-sm-height:                    $icon-sm-width !default;\n$icon-md-width:                     48px !default;\n$icon-md-height:                    $icon-md-width !default;\n$icon-lg-width:                     64px !default;\n$icon-lg-height:                    $icon-lg-width !default;\n$icon-xl-width:                     100px !default;\n$icon-xl-height:                    $icon-xl-width !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_misc-extend.scss",
    "content": "// Text Border\n$text-border-bg-color:                rgba($secondary,.5) !default;\n$text-border-bg-color-before:         linear-gradient(90deg,transparent,rgba(117,117,117,.4),rgba(117,117,117,.4)) !default;\n$text-border-bg-color-after:          linear-gradient(90deg,rgba(117,117,117,.4),rgba(117,117,117,.4),transparent) !default;\n$text-border-display:                 inline-block !default;\n$text-border-width:                   30% !default;\n$text-border-height:                  1px !default;\n$text-border-position:                relative !default;\n$text-border-vertical-align:          middle !default;\n$text-border-before-right:            .5em !default;\n$text-border-before-ml:               -50% !default;\n$text-border-after-left:              $text-border-before-right !default;\n$text-border-after-mr:                $text-border-before-ml !default;\n\n\n// Header Shapes\n\n$shape-1-width:                       55% !default;\n$shape-1-left:                        15% !default;\n$shape-2-width:                       35% !default;\n$shape-2-left:                        20% !default;\n$shape-3-width:                       50% !default;\n$shape-3-left:                        -28rem !default;\n\n$shape-img-1-right:                   7% !default;\n$shape-img-1-width:                   36% !default;\n$shape-img-1-margin-top:              12% !default;\n\n$shape-img-2-left:                    24% !default;\n$shape-img-2-width:                   27% !default;\n$shape-img-2-margin-top:              10% !default;\n\n// Comming Soon page\n\n$coming-rotate-transform:             rotate(20deg) !default;\n\n\n// Tilt Animation\n\n$tilt-transform-style:                preserve-3d !default;\n$tilt-transform-up-transform:         translateZ(50px) scale(0.7) !default;\n$tilt-transform-up-transition:        all 0.5s !default;\n\n// Round Slider\n\n$round-slider-m-width:                200px !default;\n$round-slider-scale-m-width:          300px !default;\n$round-slider-transition:             all .5s ease-out 0s !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_misc.scss",
    "content": "// Horizontal Faded Line\n$hr-bg:                               transparent !default;\n$hr-transform:                        rotate(90deg) !default;\n$hr-bg-image:                         linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)) !default;\n$hr-bg-dark-image:                    linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)) !default;\n\n\n// Gradient Animation\n$gradient-animation-background:       linear-gradient(-45deg, $info-gradient, $danger, $warning, $primary-gradient, $dark) !default;\n$gradient-animation-bg-size:          400% 400% !default;\n\n// Device Wrapper\n$device-wrapper-radius:               3.5rem !default;\n$device-wrapper-box-shadow:           0 12px 15px rgba(140, 152, 164, 0.1) !default;\n$device-wrapper-animation:            gradient 10s ease infinite !default;\n\n\n// Nav pills\n$nav-pills-link-border-radius:        0.5rem !default;\n$nav-pills-link-box-shadow:           0px 1px 5px 1px #ddd !default;\n$nav-pills-link-active-padding:       7px 15px !default;\n$nav-pills-link-active-margin:        1px !default;\n$nav-pills-link-active-animation:     .2s ease !default;\n\n// Table Progress\n\n$table-progress-width:                120px !default;\n$table-progress-height:               3px !default;\n$table-progress-margin:               0 !default;\n\n// Tooltip Arrow\n\n$tooltip-arrow-left:                  1px !default;\n$tooltip-arrow-right:                 $tooltip-arrow-left !default;\n\n// Footer Link hover animation\n\n$footer-link-animation:               opacity .3 ease !default;\n\n// Blur background\n\n$blur-light-background:               rgba(255, 255, 255, 0.4) !default;\n$blur-dark-background:                rgba(0, 0, 0, 0.3) !default;\n\n// HR w/ opacity\n\n$hr-bg-color:                         transparent !default;\n$hr-width:                            1px !default;\n$hr-margin:                           .75rem 0 !default;\n$hr-horizontal-bg-image-gray-light:   linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .1), rgba(0, 0, 0, 0)) !default;\n$hr-bg-color-light:                   #ffffff94 !default;\n$hr-bg-color-dark:                    #7b809a33 !default;\n\n// border right - pseudo\n\n$border-right-after-top:              3vh !default;\n$border-right-after-height:           70% !default;\n$border-right-after-width:            50% !default;\n$border-right-after-border-color:     #dee2e6 !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_navbar-vertical.scss",
    "content": "$navbar-light-bg:                          #FBFBFB !default;\n$navbar-light-hover-bg:                    darken($gray-100, 5%) !default;\n$navbar-light-active-bg:                   darken($gray-100, 5%) !default;\n$navbar-light-border-color:                rgba($black, .05) !default;\n$navbar-light-color:                       rgba($black, .6) !default;\n$navbar-light-hover-color:                 rgba($black, .7) !default;\n$navbar-light-active-color:                rgba($black, .9) !default;\n$navbar-light-disabled-color:              rgba($black, .3) !default;\n$navbar-light-toggler-border-color:        transparent !default;\n// Vertical navbar\n$sidenav-header-width:                      4.875rem !default;\n$sidenav-card-opacity:                       .65 !default;\n$navbar-vertical-box-shadow:                0 0 2rem 0 rgba(136, 152, 170, .15) !default;\n$navbar-vertical-border-color:              rgba($black, .05) !default;\n$navbar-vertical-width:                     3.875rem !default;\n$navbar-vertical-open-width:                15.625rem !default;\n$navbar-vertical-padding-x:                 1rem !default;\n$navbar-vertical-nav-link-padding-x:        1rem !default;\n$navbar-vertical-nav-link-padding-y:        .75rem !default;\n$navbar-vertical-sidenav-normal-ml:         4.01rem !default;\n$navbar-vertical-m:                         1rem !default;\n$navbar-vertical-inner:                     calc(100vh - 360px) !default;\n$navbar-icon-min-width:                     1.8rem !default;\n$navbar-icon-margin-left:                   0.15rem !default;\n$navbar-icon-material-margin-left:          2px !default;\n$navbar-breadcrumb-padding-y:               $nav-link-padding-y !default;\n$navbar-breadcrumb-padding-x:               0 !default;\n$navbar-light-border-color:                 $border-color !default;\n$navbar-dark-bg:                           transparent !default;\n$navbar-dark-hover-bg:                     rgba(255, 255, 255, .1) !default;\n$navbar-dark-active-bg:                    rgba(255, 255, 255, .1) !default;\n$navbar-dark-border-color:                 rgba(255, 255, 255, .1) !default;\n$navbar-dark-color:                        rgba($white, .95) !default;\n$navbar-dark-hover-color:                  rgba($white, .65) !default;\n$navbar-dark-active-color:                 rgba($white, .65) !default;\n$navbar-dark-disabled-color:               rgba($white, .25) !default;\n$navbar-dark-toggler-border-color:         transparent !default;\n$navbar-padding-y:                         1rem !default;\n$navbar-padding-x:                         1rem !default;\n$navbar-nav-link-padding-x:                1rem !default;\n$navbar-nav-link-padding-y:                1rem !default;\n$navbar-nav-link-font-size:                .875rem !default;\n$navbar-nav-link-font-weight:              300 !default;\n$navbar-nav-link-text-transform:           normal !default;\n$navbar-nav-link-letter-spacing:           0 !default;\n$navbar-nav-link-border-radius:            $border-radius-md !default;\n$font-size-xs:                             ($font-size-base * .75);\n$transition-base-time:                     .25s;\n$transition-cubic-bezier:                  all $transition-base-time cubic-bezier(.68, -0.55, .265, 1.55) !default;\n\n// Navbar collapse\n\n$navbar-vertical-collapse-margin-left:           1.35rem !default;\n$navbar-vertical-collapse-left:                  -18px !default;\n$navbar-vertical-collapse-top:                   50% !default;\n$navbar-vertical-collapse-translate:             translate(0,-50%) !default;\n$navbar-vertical-hidden-width:                   6rem !default;\n\n// Hover effect\n$navbar-vertical-hover-bg-color:                 rgba(199, 199, 199, 0.2) !default;\n\n// RTL Page\n\n$rtl-sidebar-bullet-right:                       -1.125rem !default;\n$rtl-sidebar-hover-padding-right:                2.5rem !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_navbar.scss",
    "content": "// Navbar toggler icon on responsive styling\n\n$navbar-toggler-bar-display:                      block !default;\n$navbar-toggler-bar-position:                     relative !default;\n$navbar-toggler-bar-width:                        22px !default;\n$navbar-toggler-bar-height:                       1px !default;\n$navbar-toggler-bar-radius:                       1px !default;\n$navbar-toggler-bar-transition:                   all 0.2s !default;\n$navbar-toggler-bar-margin-top:                   7px !default;\n\n$navbar-toggler-bar-1-transform:                  rotate(45deg) !default;\n$navbar-toggler-bar-1-transform-origin:           10% 10% !default;\n$navbar-toggler-bar-1-margin-top:                 4px !default;\n$navbar-toggler-bar-2-opacity:                    0 !default;\n$navbar-toggler-bar-3-transform:                  rotate(-45deg) !default;\n$navbar-toggler-bar-3-transform-origin:           10% 90% !default;\n$navbar-toggler-bar-3-margin-top:                 3px !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_pagination.scss",
    "content": "// Pagination\n\n$pagination-active-box-shadow:      $btn-hover-box-shadow !default;\n\n$page-link-display:                 flex !default;\n$page-link-align-items:             center !default;\n$page-link-justify-content:         $page-link-align-items !default;\n$page-link-margin:                  0 3px !default;\n$page-link-radius:                  50% !default;\n$page-link-width:                   36px !default;\n$page-link-height:                  $page-link-width !default;\n\n$page-link-width-lg:                46px !default;\n$page-link-height-lg:               $page-link-width-lg !default;\n$page-link-line-height-lg:          $page-link-width-lg !default;\n\n$page-link-width-sm:                30px !default;\n$page-link-height-sm:               $page-link-width-sm !default;\n$page-link-line-height-sm:          $page-link-width-sm !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_ripple.scss",
    "content": "// RIPPLE Effect\n\n$ripple-position:                   relative !default;\n\n$ripple-container-position:         absolute !default;\n$ripple-container-top:              0 !default;\n$ripple-container-left:             $ripple-container-top !default;\n$ripple-container-z-index:          1 !default;\n$ripple-container-width:            100% !default;\n$ripple-container-height:           $ripple-container-width !default;\n$ripple-container-overflow:         hidden !default;\n$ripple-container-pointer:          none !default;\n$ripple-container-radius:           inherit !default;\n\n$ripple-decorator-position:         $ripple-container-position !default;\n$ripple-decorator-width:            20px !default;\n$ripple-decorator-height:           $ripple-decorator-width !default;\n$ripple-decorator-mt:               -10px !default;\n$ripple-decorator-ml:               $ripple-decorator-mt !default;\n$ripple-decorator-pointer:          $ripple-container-pointer !default;\n$ripple-decorator-bg-color:         rgba($black, 0.05) !default;\n$ripple-decorator-radius:           100% !default;\n$ripple-decorator-opacity:          0 !default;\n$ripple-decorator-transform:        scale(1) !default;\n$ripple-decorator-transform-origin: 50% !default;\n\n$ripple-on-opacity:                 .1 !default;\n$ripple-on-transition:              opacity 0.15s ease-in 0s,\n                                    transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s !default;\n\n$ripple-out-opacity:                0 !default;\n$ripple-out-transition:             opacity 0.1s linear 0s !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_rtl.scss",
    "content": "$timeline-step-transform-rtl: translateX(50%) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_social-buttons.scss",
    "content": "// Social Buttons\n\n$facebook:              #3b5998 !default;\n$facebook-states:       darken($facebook, 5%) !default;\n$twitter:               #55acee !default;\n$twitter-states:        darken($twitter, 5%) !default;\n$instagram:             #125688 !default;\n$instagram-states:      darken($instagram, 6%) !default;\n$linkedin:              #0077B5 !default;\n$linkedin-states:       darken($linkedin, 5%) !default;\n$pinterest:             #cc2127 !default;\n$pinterest-states:      darken($pinterest, 6%) !default;\n$youtube:               #e52d27 !default;\n$youtube-states:        darken($youtube, 6%) !default;\n$dribbble:              #ea4c89 !default;\n$dribbble-states:       darken($dribbble, 6%) !default;\n$github:                #24292E !default;\n$github-states:         darken($github, 6%) !default;\n$reddit:                #ff4500 !default;\n$reddit-states:         darken($reddit, 6%) !default;\n$tumblr:                #35465c !default;\n$tumblr-states:         darken($tumblr, 6%) !default;\n$behance:               #1769ff !default;\n$behance-states:        darken($behance, 6%) !default;\n$vimeo:                 #1AB7EA !default;\n$vimeo-states:          darken($vimeo, 6%) !default;\n$slack:                 #3aaf85 !default;\n$slack-states:          darken($slack, 6%) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_table.scss",
    "content": "$table-head-spacer-y:         .75rem !default;\n$table-head-spacer-x:         1rem !default;\n$table-head-font-size:        .65rem !default;\n$table-head-font-weight:      $font-weight-bold !default;\n$table-head-text-transform:   uppercase !default;\n$table-head-letter-spacing:   1px !default;\n$table-head-bg:               $gray-100 !default;\n$table-head-color:            $gray-600 !default;\n$table-action-color:          $gray-500 !default;\n\n$table-body-font-size:        .8125rem !default;\n\n$table-dark-bg:               theme-color(\"default\") !default;\n$table-dark-accent-bg:        rgba($white, .05) !default;\n$table-dark-hover-bg:         rgba($white, .075) !default;\n\n$table-dark-head-bg:          lighten($dark, 4%) !default;\n$table-dark-head-color:       lighten($dark, 35%) !default;\n$table-dark-action-color:     lighten($dark, 35%) !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_timeline.scss",
    "content": "// Timeline\n\n$timeline-axis-width:      2px !default;\n$timeline-axis-color:      #e5e5e5 !default;\n$timeline-axis-color-dark: #4a4a4a !default;\n$timeline-left:            1rem !default;\n\n$timeline-step-bg: $white !default;\n$timeline-step-width: 26px !default;\n$timeline-step-height: $timeline-step-width !default;\n$timeline-step-radius: 50% !default;\n$timeline-step-transform: translateX(-50%) !default;\n$timeline-step-line-height: 1.4 !default;\n\n$timeline-step-border-width: 2px !default;\n$timeline-step-border-color: $timeline-axis-color !default;\n\n$timeline-content-margin-left: 45px !default;\n$timeline-content-padding-top: .35rem !default;\n$timeline-content-top: -6px !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_utilities-extend.scss",
    "content": "// Colores Shadow on cards\n$colored-shadow-top:            3.5% !default;\n$colored-shadow-blur:           12px !default;\n$colored-shadow-scale:          .94 !default;\n$colored-shadow-scale-avatar:   .87 !default;\n\n// Card Projects\n$card-project-transition:       .4s cubic-bezier(.215,.61,.355,1) !default;\n$card-project-avatar-transform: scale(.8) translateY(-45px) !default;\n$card-project-hover-transform:  translateY(-2px) !default;\n\n// Transform Perspective effect\n$transform-perspective:         scale(1) perspective(1040px) rotateY(-11deg) rotateX(2deg) rotate(2deg) !default;\n$transform-perspective-inverse: scale(1) perspective(1040px) rotateY(11deg) rotateX(-2deg) rotate(-2deg) !default;\n\n// Z index\n$z-index2:                       2 !default;\n\n// Width in PX\n$width-32-px:                     32px !default;\n$width-48-px:                     48px !default;\n$width-64-px:                     64px !default;\n\n// Wizard variants\n$multistep-progress-primary-color:   #f48aaa !default;\n$multistep-progress-success-color:   #9ed1a0 !default;\n$multistep-progress-danger-color:    #f79592 !default;\n$multistep-progress-warning-color:   #ffc483 !default;\n$multistep-progress-info-color:      #88d9e4 !default;\n$multistep-progress-dark-color:      #848486 !default;\n$multistep-progress-secondary-color: #a4a9b2 !default;\n$multistep-progress-light-color:     #ebeef1 !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_utilities.scss",
    "content": "// on hover transition variables\n$move-transition:               .2s ease-out !default;\n$move-overflow:                 hidden !default;\n$move-transform:                perspective(999px) rotateX(0deg) translate3d(0,0,0) !default;\n$move-transform-origin:         50% 0 !default;\n$move-backface-visibility:      hidden !default;\n$move-will-change:              transform,box-shadow !default;\n$move-hover-transform:          perspective(999px) rotateX(7deg) translate3d(0px,-4px,5px) !default;\n\n// Sections Height Utilities\n$section-height-25-min-height:  25vh !default;\n$section-height-35-min-height:  35vh !default;\n$section-height-45-min-height:  45vh !default;\n$section-height-50-min-height:  50vh !default;\n$section-height-55-min-height:  55vh !default;\n$section-height-65-min-height:  65vh !default;\n$section-height-70-min-height:  70vh !default;\n$section-height-75-min-height:  75vh !default;\n$section-height-80-min-height:  80vh !default;\n$section-height-85-min-height:  85vh !default;\n$section-height-90-min-height:  90vh !default;\n$section-height-95-min-height:  95vh !default;\n$section-height-100-min-height: 100vh !default;\n\n// extra padding utilities variables - CT\n$padding-6:                     4rem !default;\n$padding-7:                     6rem !default;\n$padding-8:                     8rem !default;\n$padding-9:                     10rem !default;\n$padding-10:                    12rem !default;\n$padding-11:                    14rem !default;\n$padding-12:                    16rem !default;\n\n// extra margins utilities variables - CT\n$margin-6:                      4rem !default;\n$margin-7:                      6rem !default;\n$margin-8:                      8rem !default;\n$margin-9:                      10rem !default;\n$margin-10:                     12rem !default;\n$margin-11:                     14rem !default;\n$margin-12:                     16rem !default;\n\n// extra width values variables - CT\n$width-0:                     0% !default;\n$width-1:                     1% !default;\n$width-2:                     2% !default;\n$width-3:                     3% !default;\n$width-4:                     4% !default;\n$width-5:                     5% !default;\n$width-6:                     6% !default;\n$width-7:                     7% !default;\n$width-8:                     8% !default;\n$width-9:                     9% !default;\n$width-10:                    10% !default;\n$width-15:                    15% !default;\n$width-20:                    20% !default;\n$width-25:                    25% !default;\n$width-30:                    30% !default;\n$width-35:                    35% !default;\n$width-40:                    40% !default;\n$width-45:                    45% !default;\n$width-50:                    50% !default;\n$width-55:                    55% !default;\n$width-60:                    60% !default;\n$width-65:                    65% !default;\n$width-70:                    70% !default;\n$width-75:                    75% !default;\n$width-80:                    80% !default;\n$width-85:                    85% !default;\n$width-90:                    90% !default;\n$width-95:                    95% !default;\n$width-100:                   100% !default;\n\n// extra max width values variables - CT\n$max-width-100:                     100px !default;\n$max-width-200:                     200px !default;\n$max-width-300:                     300px !default;\n$max-width-400:                     400px !default;\n$max-width-500:                     500px !default;\n\n// extra height values variables - CT\n$height-100:                        100px !default;\n$height-200:                        200px !default;\n$height-300:                        300px !default;\n$height-400:                        400px !default;\n$height-500:                        500px !default;\n$height-600:                        600px !default;\n\n\n// extra min height values variables - CT\n$min-height-100:                    100px !default;\n$min-height-150:                    150px !default;\n$min-height-160:                    160px !default;\n$min-height-200:                    200px !default;\n$min-height-250:                    250px !default;\n$min-height-300:                    300px !default;\n$min-height-400:                    400px !default;\n$min-height-500:                    500px !default;\n$min-height-600:                    600px !default;\n\n// extra min height values variables - CT\n$max-height-100:                    100px !default;\n$max-height-150:                    150px !default;\n$max-height-160:                    160px !default;\n$max-height-200:                    200px !default;\n$max-height-250:                    250px !default;\n$max-height-300:                    300px !default;\n$max-height-400:                    400px !default;\n$max-height-500:                    500px !default;\n$max-height-600:                    600px !default;\n\n// extra min height vh values variables - CT\n$max-height-vh-10:                    10vh !default;\n$max-height-vh-20:                    20vh !default;\n$max-height-vh-30:                    30vh !default;\n$max-height-vh-40:                    40vh !default;\n$max-height-vh-50:                    50vh !default;\n$max-height-vh-60:                    60vh !default;\n$max-height-vh-70:                    70vh !default;\n$max-height-vh-80:                    80vh !default;\n$max-height-vh-90:                    90vh !default;\n$max-height-vh-100:                   100vh !default;\n\n// Extra Padding values Map\n$paddings: (\n  \"6\": $padding-6,\n  \"7\": $padding-7,\n  \"8\": $padding-8,\n  \"9\": $padding-9,\n  \"10\": $padding-10,\n  \"11\": $padding-11,\n  \"12\": $padding-12\n) !default;\n\n// Extra Margins values Map\n$margins: (\n  \"6\": $margin-6,\n  \"7\": $margin-7,\n  \"8\": $margin-8,\n  \"9\": $margin-9,\n  \"10\": $margin-10,\n  \"11\": $margin-11,\n  \"12\": $margin-12\n) !default;\n\n$width: (\n  \"0\": $width-0,\n  \"1\": $width-1,\n  \"2\": $width-2,\n  \"3\": $width-3,\n  \"4\": $width-4,\n  \"5\": $width-5,\n  \"6\": $width-6,\n  \"7\": $width-7,\n  \"8\": $width-8,\n  \"9\": $width-9,\n  \"10\": $width-10,\n  \"15\": $width-15,\n  \"20\": $width-20,\n  \"25\": $width-25,\n  \"30\": $width-30,\n  \"35\": $width-35,\n  \"40\": $width-40,\n  \"45\": $width-45,\n  \"50\": $width-50,\n  \"55\": $width-55,\n  \"60\": $width-60,\n  \"65\": $width-65,\n  \"70\": $width-70,\n  \"75\": $width-75,\n  \"80\": $width-80,\n  \"85\": $width-85,\n  \"90\": $width-90,\n  \"95\": $width-95,\n  \"100\": $width-100,\n  \"auto\": auto\n) !default;\n\n\n// blur effect variables\n$blur-border-radius-rounded:    40px !default;\n$blur-box-shadow:               inset 0px 0px 2px #fefefed1 !default;\n$blur-backdrop-filter:          saturate(200%) blur(30px) !default;\n$blur-backdrop-filter-less:     saturate(20%) blur(30px) !default;\n\n$shadow-blur-box-shadow:        inset 0 0px 1px 1px rgba(254, 254, 254, .9), 0 20px 27px 0 rgba(0, 0, 0, .05) !default;\n\n// sidebar variables\n\n$sidebar-width: 80px !default;\n$sidebar-transition: 1s ease !default;\n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard/variables/_virtual-reality.scss",
    "content": "$animation-name:        fadeInBottom !default;\n$animation-mode:        both !default;\n$animation-duration:    1.5s !default;\n$transform-scale:       scale(0.6) !default;\n$position-left:         18% !default;  \n"
  },
  {
    "path": "src/material-stubs/resources/material/assets/scss/material-dashboard.scss",
    "content": "// =========================================================\n// * Material Dashboard - v3.0.0\n// =========================================================\n//\n// * Product Page: https://www.creative-tim.com/product/material-dashboard\n// * Copyright 2021 Creative Tim (https://www.creative-tim.com)\n//\n// Coded by www.creative-tim.com\n//\n// =========================================================\n//\n// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n// Bootstrap Functions\n@import \"material-dashboard/bootstrap/functions\";\n\n// Custom Variables\n@import \"material-dashboard/custom/variables\";\n\n// Theme Variables\n@import \"material-dashboard/variables\";\n\n// Bootstrap Core\n@import \"material-dashboard/bootstrap/bootstrap\";\n\n// Theme Core\n@import \"material-dashboard/theme\";\n\n// Custom Variables\n@import \"material-dashboard/custom/styles\";\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/alerts.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Alerts | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#with-icon\">With icon</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#dismissing\">Dismissing</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Alerts\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Provide contextual feedback messages for typical user actions with the handful of available and flexible Bootstrap alerts.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"examples\">Examples</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"alert alert-primary  text-white \" role=\"alert\">\n              <strong>Primary!</strong> This is a primary alert—check it out!\n            </div>\n            <div class=\"alert alert-secondary  text-white \" role=\"alert\">\n              <strong>Secondary!</strong> This is a secondary alert—check it out!\n            </div>\n            <div class=\"alert alert-info  text-white \" role=\"alert\">\n              <strong>Info!</strong> This is a info alert—check it out!\n            </div>\n            <div class=\"alert alert-success  text-white \" role=\"alert\">\n              <strong>Success!</strong> This is a success alert—check it out!\n            </div>\n            <div class=\"alert alert-danger  text-white \" role=\"alert\">\n              <strong>Danger!</strong> This is a danger alert—check it out!\n            </div>\n            <div class=\"alert alert-warning  text-white \" role=\"alert\">\n              <strong>Warning!</strong> This is a warning alert—check it out!\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Primary!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a primary alert—check it out!\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Secondary!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a secondary alert—check it out!\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-info<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Info!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a info alert—check it out!\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-success<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Success!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a success alert—check it out!\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-danger<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Danger!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a danger alert—check it out!\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Warning!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a warning alert—check it out!\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  </code></pre>\n            </figure>\n          </div>\n          <h2 id=\"with-icon\">With icon</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"alert alert-warning text-white\" role=\"alert\">\n              <span class=\"alert-icon align-middle\">\n                <span class=\"material-icons text-md\">\n                  thumb_up_off_alt\n                </span>\n              </span>\n              <span class=\"alert-text\"><strong>Warning!</strong> This is a warning alert—check it out that has an icon too!</span>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-icon align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-md<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        thumb_up_off_alt\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Warning!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a warning alert—check it out that has an icon too!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"dismissing\">Dismissing</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"alert alert-primary alert-dismissible fade show  text-white \" role=\"alert\">\n              <span class=\"alert-icon align-middle\">\n                <span class=\"material-icons text-md\">\n                  thumb_up_off_alt\n                </span>\n              </span>\n              <span class=\"alert-text\"><strong>Primary!</strong> This is a primary alert—check it out!</span>\n              <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                <span aria-hidden=\"true\">×</span>\n              </button>\n            </div>\n            <div class=\"alert alert-secondary alert-dismissible fade show  text-white \" role=\"alert\">\n              <span class=\"alert-icon align-middle\">\n                <span class=\"material-icons text-md\">\n                  thumb_up_off_alt\n                </span>\n              </span>\n              <span class=\"alert-text\"><strong>Secondary!</strong> This is a secondary alert—check it out!</span>\n              <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                <span aria-hidden=\"true\">×</span>\n              </button>\n            </div>\n            <div class=\"alert alert-info alert-dismissible fade show  text-white \" role=\"alert\">\n              <span class=\"alert-icon align-middle\">\n                <span class=\"material-icons text-md\">\n                  thumb_up_off_alt\n                </span>\n              </span>\n              <span class=\"alert-text\"><strong>Info!</strong> This is a info alert—check it out!</span>\n              <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                <span aria-hidden=\"true\">×</span>\n              </button>\n            </div>\n            <div class=\"alert alert-success alert-dismissible fade show  text-white \" role=\"alert\">\n              <span class=\"alert-icon align-middle\">\n                <span class=\"material-icons text-md\">\n                  thumb_up_off_alt\n                </span>\n              </span>\n              <span class=\"alert-text\"><strong>Success!</strong> This is a success alert—check it out!</span>\n              <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                <span aria-hidden=\"true\">×</span>\n              </button>\n            </div>\n            <div class=\"alert alert-danger alert-dismissible fade show  text-white \" role=\"alert\">\n              <span class=\"alert-icon align-middle\">\n                <span class=\"material-icons text-md\">\n                  thumb_up_off_alt\n                </span>\n              </span>\n              <span class=\"alert-text\"><strong>Danger!</strong> This is a danger alert—check it out!</span>\n              <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                <span aria-hidden=\"true\">×</span>\n              </button>\n            </div>\n            <div class=\"alert alert-warning alert-dismissible fade show  text-white \" role=\"alert\">\n              <span class=\"alert-icon align-middle\">\n                <span class=\"material-icons text-md\">\n                  thumb_up_off_alt\n                </span>\n              </span>\n              <span class=\"alert-text\"><strong>Warning!</strong> This is a warning alert—check it out!</span>\n              <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                <span aria-hidden=\"true\">×</span>\n              </button>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-primary alert-dismissible fade show<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-icon align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-md<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          thumb_up_off_alt\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Primary!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a primary alert—check it out!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-secondary alert-dismissible fade show<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-icon align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-md<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          thumb_up_off_alt\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Secondary!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a secondary alert—check it out!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-info alert-dismissible fade show<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-icon align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-md<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          thumb_up_off_alt\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Info!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a info alert—check it out!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-success alert-dismissible fade show<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-icon align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-md<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          thumb_up_off_alt\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Success!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a success alert—check it out!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-danger alert-dismissible fade show<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-icon align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-md<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          thumb_up_off_alt\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Danger!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a danger alert—check it out!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-warning alert-dismissible fade show<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-icon align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-md<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          thumb_up_off_alt\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>Warning!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span> This is a warning alert—check it out!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  </code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n\n<script src=\"../../assets/js/docs.js\"></script>\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/badge.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Badge | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#badges-gradients\">Badges Gradients</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#sizes\">Sizes</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#contextual-variations-pro\">Contextual variations PRO</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Badge\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Documentation and examples for Bootstrap badges, our small count and labelling component.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"example\">Example</h2>\n          <p>Badges can be used as part of links or buttons to provide a counter.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <button type=\"button\" class=\"btn bg-gradient-dark\">\n              <span>Unread messages</span>\n              <span class=\"badge badge-secondary\">24</span>\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-primary\">\n              <span>Notifications</span>\n              <span class=\"badge badge-sm badge-circle badge-danger border border-white border-2\">4</span>\n            </button>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-default<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Unread messages<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>24<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Notifications<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-sm badge-circle badge-danger border border-white border-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"badges-gradients\">Badges Gradients</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <span class=\"badge bg-gradient-primary\">Primary</span>\n            <span class=\"badge bg-gradient-secondary\">Secondary</span>\n            <span class=\"badge bg-gradient-info\">Info</span>\n            <span class=\"badge bg-gradient-success\">Success</span>\n            <span class=\"badge bg-gradient-danger\">Danger</span>\n            <span class=\"badge bg-gradient-warning\">Warning</span>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge bg-gradient-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Primary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge bg-gradient-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Secondary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge bg-gradient-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Info<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge bg-gradient-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge bg-gradient-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Danger<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge bg-gradient-warning<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Warning<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"sizes\">Sizes</h2>\n          <p>Use the <code class=\" highlighter-rouge language-plaintext\">.badge-md</code> or <code class=\" highlighter-rouge language-plaintext\">.badge-lg</code> modifier classes to adjust badge sizes.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <span class=\"badge badge-pill bg-gradient-primary\">Default</span>\n            <span class=\"badge badge-pill badge-md bg-gradient-warning\">Medium</span>\n            <span class=\"badge badge-pill badge-lg bg-gradient-success\">Large badge</span>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-pill bg-gradient-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Default<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-pill badge-md bg-gradient-warning<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Medium<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-pill badge-lg bg-gradient-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Large badge<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"contextual-variations-pro\">Contextual variations <span class=\"badge badge-primary\">PRO</span></h2>\n          <p>Add any of the below mentioned modifier classes to change the appearance of a badge.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <span class=\"badge badge-primary\">Primary</span>\n            <span class=\"badge badge-secondary\">Secondary</span>\n            <span class=\"badge badge-info\">Info</span>\n            <span class=\"badge badge-success\">Success</span>\n            <span class=\"badge badge-danger\">Danger</span>\n            <span class=\"badge badge-warning\">Warning</span>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Primary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Secondary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Info<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Danger<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-warning<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Warning<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim </a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/buttons.html",
    "content": "<!DOCTYPE html>\n<html>\n\n<head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n        Buttons | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n        .async-hide {\n            opacity: 0 !important\n        }\n\n    </style>\n    <script>\n        (function (a, s, y, n, c, h, i, d, e) {\n            s.className += ' ' + y;\n            h.start = 1 * new Date;\n            h.end = i = function () {\n                s.className = s.className.replace(RegExp(' ?' + y), '')\n            };\n            (a[n] = a[n] || []).hide = h;\n            setTimeout(function () {\n                i();\n                h.end = null\n            }, c);\n            h.timeout = c;\n        })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n            'GTM-K9BGS8K': true\n        });\n\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n        (function (i, s, o, g, r, a, m) {\n            i['GoogleAnalyticsObject'] = r;\n            i[r] = i[r] || function () {\n                (i[r].q = i[r].q || []).push(arguments)\n            }, i[r].l = 1 * new Date();\n            a = s.createElement(o),\n                m = s.getElementsByTagName(o)[0];\n            a.async = 1;\n            a.src = g;\n            m.parentNode.insertBefore(a, m)\n        })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n        ga('create', 'UA-46172202-22', 'auto', {\n            allowLinker: true\n        });\n        ga('set', 'anonymizeIp', true);\n        ga('require', 'GTM-K9BGS8K');\n        ga('require', 'displayfeatures');\n        ga('require', 'linker');\n        ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n        (function (w, d, s, l, i) {\n            w[l] = w[l] || [];\n            w[l].push({\n                'gtm.start': new Date().getTime(),\n                event: 'gtm.js'\n            });\n            var f = d.getElementsByTagName(s)[0],\n                j = d.createElement(s),\n                dl = l != 'dataLayer' ? '&l=' + l : '';\n            j.async = true;\n            j.src =\n                'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n            f.parentNode.insertBefore(j, f);\n        })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n</head>\n\n<body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\"\n            style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n        <div class=\"ct-docs-main-content-row\">\n            <div class=\"ct-docs-sidebar-col\">\n                <nav class=\"ct-docs-sidebar-collapse-links\">\n                    <div class=\"ct-docs-sidebar-product\">\n                      <div class=\"ct-docs-sidebar-product-image\">\n                        <img src=\"../../assets/img/bootstrap.png\">\n                      </div>\n                      <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-active-40 text-white\"></i>\n                          </div>\n                        </div>\n                        Getting started\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/overview.html\">\n                            Overview\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/license.html\">\n                            License\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/installation.html\">\n                            Installation\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/build-tools.html\">\n                            Build Tools\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/bootstrap.html\">\n                            What is Bootstrap\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                        <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                          <div class=\"d-inline-block\">\n                            <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                              <i class=\"ni ni-folder-17 text-white\"></i>\n                            </div>\n                          </div>\n                          Laravel\n                        </a>\n                        <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/login.html\">\n                              Login\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/sign-up.html\">\n                              Sign Up\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/forgot-password.html\">\n                              Forgot Password\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/user-profile.html\">\n                              User Profile\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/user-management.html\">\n                              User Management\n                              <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                            </a>\n                          </li>\n                        </ul>\n                      </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-folder-17 text-white\"></i>\n                          </div>\n                        </div>\n                        Foundation\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\" \">\n                          <a href=\"../../documentation/foundation/colors.html\">\n                            Colors\n                          </a>\n                        </li>\n                        <li class=\" \">\n                          <a href=\"../../documentation/foundation/grid.html\">\n                            Grid\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/typography.html\">\n                            Typography\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/icons.html\">\n                            Icons\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/utilities.html\">\n                            Utilities\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-app text-white\"></i>\n                          </div>\n                        </div>\n                        Components\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/alerts.html\">\n                            Alerts\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/badge.html\">\n                            Badge\n                          </a>\n                        </li>\n                        <li class=\"ct-docs-nav-sidenav-active\">\n                          <a href=\"../../documentation/components/buttons.html\">\n                            Buttons\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/social-buttons.html\">\n                            Social Buttons\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/cards.html\">\n                            Cards\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/carousel.html\">\n                            Carousel\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/collapse.html\">\n                            Collapse\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/dropdowns.html\">\n                            Dropdowns\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/forms.html\">\n                            Forms\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/input-group.html\">\n                            Input Group\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/list-group.html\">\n                            List Group\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/modal.html\">\n                            Modal\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/navs.html\">\n                            Navs\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/navbar.html\">\n                            Navbar\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/pagination.html\">\n                            Pagination\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/popovers.html\">\n                            Popovers\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/progress.html\">\n                            Progress\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/spinners.html\">\n                            Spinners\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/tables.html\">\n                            Tables\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/tooltips.html\">\n                            Tooltips\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-settings text-white\"></i>\n                          </div>\n                        </div>\n                        Plugins\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/countUpJs.html\">\n                            CountUp JS\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/charts.html\">\n                            Charts\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/datepicker.html\">\n                            Datepicker\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/fullcalendar.html\">\n                            Fullcalendar\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/sliders.html\">\n                            Sliders\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/choices.html\">\n                            Choices\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/dropzone.html\">\n                            Dropzone\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/datatables.html\">\n                            Datatables\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/kanban.html\">\n                            Kanban\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/photo-swipe.html\">\n                            Photo Swipe\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/quill.html\">\n                            Quill\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                            Sweet Alerts\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/wizard.html\">\n                            Wizard\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                  </nav>\n            </div>\n            <div class=\"ct-docs-toc-col\">\n                <ul class=\"section-nav\">\n                    <li class=\"toc-entry toc-h2\"><a href=\"#classes\">Classes</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#outline-buttons\">Outline buttons</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#sizes\">Sizes</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#active-state\">Active state</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#disabled-state\">Disabled state</a></li>\n                </ul>\n            </div>\n            <main class=\"ct-docs-content-col\" role=\"main\">\n                <div class=\"ct-docs-page-title\">\n                    <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n                        Bootstrap Buttons\n                    </h1>\n                    <div class=\"avatar-group mt-3\">\n                    </div>\n                </div>\n                <p class=\"ct-docs-page-title-lead\">Use Bootstrap buttons and Bootstrap custom styles for actions in\n                    forms, dialogues, and more with support for multiple sizes, states, and more.</p>\n                <hr class=\"ct-docs-hr\">\n                <h2 id=\"classes\">Classes</h2>\n                <p>Bootstrap provides different styles of buttons:</p>\n                <ul>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-default</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-primary</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-success</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-info</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-warning</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-danger</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-link</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-outline-default</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-outline-primary</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-outline-success</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-outline-info</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-outline-warning</code></li>\n                    <li><code class=\" highlighter-rouge language-plaintext\">.btn-outline-danger</code></li>\n                </ul>\n                <h2 id=\"examples\">Examples</h2>\n                <p>Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a\n                    few extras thrown in for more control.</p>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button class=\"btn btn-primary\" type=\"button\">Button</button>\n                    <button class=\"btn btn-icon btn-3 btn-primary\" type=\"button\">\n                        <span class=\"btn-inner--icon\"><i class=\"material-icons\">play_arrow</i></span>\n                        <span class=\"btn-inner--text\">With icon</span>\n                    </button>\n                    <button class=\"btn btn-icon btn-2 btn-primary\" type=\"button\">\n                        <span class=\"btn-inner--icon\"><i class=\"material-icons\">lightbulb</i></span>\n                    </button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-icon btn-3 btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n\t<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>play_arrow<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>With icon<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-icon btn-2 btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n\t<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>lightbulb<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button type=\"button\" class=\"btn btn-primary mt-2 me-2\">Primary</button><button type=\"button\"\n                        class=\"btn btn-secondary mt-2 me-2\">Secondary</button><button type=\"button\"\n                        class=\"btn btn-info mt-2 me-2\">Info</button><button type=\"button\"\n                        class=\"btn btn-success mt-2 me-2\">Success</button><button type=\"button\"\n                        class=\"btn btn-danger mt-2 me-2\">Danger</button><button type=\"button\"\n                        class=\"btn btn-warning mt-2 me-2\">Warning</button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Primary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Secondary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Info<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Danger<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-warning<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Warning<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button type=\"button\" class=\"btn bg-gradient-primary mt-2 me-2\">Primary</button><button\n                        type=\"button\" class=\"btn bg-gradient-secondary mt-2 me-2\">Secondary</button><button\n                        type=\"button\" class=\"btn bg-gradient-info mt-2 me-2\">Info</button><button type=\"button\"\n                        class=\"btn bg-gradient-success mt-2 me-2\">Success</button><button type=\"button\"\n                        class=\"btn bg-gradient-danger mt-2 me-2\">Danger</button><button type=\"button\"\n                        class=\"btn bg-gradient-warning mt-2 me-2\">Warning</button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Primary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Secondary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Info<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Danger<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-warning<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Warning<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <h2 id=\"outline-buttons\">Outline buttons</h2>\n                <p>In need of a button, but not the hefty background colors they bring? Replace the default modifier\n                    classes with the <code class=\" highlighter-rouge language-plaintext\">.btn-outline-*</code> ones to\n                    remove all background images and colors on any button.</p>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button type=\"button\" class=\"btn btn-outline-primary mt-2\">Primary</button>\n                    <button type=\"button\" class=\"btn btn-outline-secondary mt-2\">Secondary</button>\n                    <button type=\"button\" class=\"btn btn-outline-info mt-2\">Info</button>\n                    <button type=\"button\" class=\"btn btn-outline-success mt-2\">Success</button>\n                    <button type=\"button\" class=\"btn btn-outline-danger mt-2\">Danger</button>\n                    <button type=\"button\" class=\"btn btn-outline-warning mt-2\">Warning</button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Primary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Secondary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Info<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Danger<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-warning<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Warning<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <h2 id=\"sizes\">Sizes</h2>\n                <p>Fancy larger or smaller buttons? Add <code\n                        class=\" highlighter-rouge language-plaintext\">.btn-lg</code> or <code\n                        class=\" highlighter-rouge language-plaintext\">.btn-sm</code> for additional sizes.</p>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button type=\"button\" class=\"btn btn-primary btn-lg\">Large button</button>\n                    <button type=\"button\" class=\"btn btn-secondary btn-lg\">Large button</button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Large button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary btn-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Large button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button type=\"button\" class=\"btn btn-primary btn-sm\">Small button</button>\n                    <button type=\"button\" class=\"btn btn-secondary btn-sm\">Small button</button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Small button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary btn-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Small button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <p>Create block level buttons—those that span the full width of a parent—by adding <code\n                        class=\" highlighter-rouge language-plaintext\">.w-100</code>.</p>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button type=\"button\" class=\"btn btn-primary btn-lg w-100\">Block level button</button>\n                    <button type=\"button\" class=\"btn btn-secondary btn-lg w-100\">Block level button</button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-lg w-100<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Block level button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary btn-lg w-100<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Block level button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <h2 id=\"active-state\">Active state</h2>\n                <p>Buttons will appear pressed (with a darker background, darker border, and inset shadow) when active.\n                    <strong>There’s no need to add a class to <code\n                            class=\" highlighter-rouge language-plaintext\">&lt;button&gt;</code>s as they use a\n                        pseudo-class</strong>. However, you can still force the same active appearance with <code\n                        class=\" highlighter-rouge language-plaintext\">.active</code> (and include the\n                    <code>aria-pressed=\"true\"</code> attribute) should you need to replicate the state programmatically.\n                </p>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <a href=\"#\" class=\"btn btn-primary btn-lg active\" role=\"button\" aria-pressed=\"true\">Primary link</a>\n                    <a href=\"#\" class=\"btn btn-secondary btn-lg active\" role=\"button\" aria-pressed=\"true\">Link</a>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-lg active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-pressed</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Primary link<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary btn-lg active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-pressed</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Link<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n                <h2 id=\"disabled-state\">Disabled state</h2>\n                <p>Make buttons look inactive by adding the <code\n                        class=\" highlighter-rouge language-plaintext\">disabled</code> boolean attribute to any <code\n                        class=\" highlighter-rouge language-plaintext\">&lt;button&gt;</code> element.</p>\n                <div class=\"ct-example\"\n                    style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n                    <button type=\"button\" class=\"btn btn-lg btn-primary\" disabled=\"\">Primary button</button>\n                    <button type=\"button\" class=\"btn btn-secondary btn-lg\" disabled=\"\">Button</button>\n                </div>\n                <div class=\"position-relative\">\n                    <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\"\n                            data-bs-original-title=\"Copy to clipboard\">Copy</span></div>\n                    <figure class=\"highlight\">\n                        <pre\n                            class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-lg btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>Primary button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary btn-lg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>Button<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n                    </figure>\n                </div>\n            </main>\n        </div>\n        <footer class=\"ct-docs-footer\">\n          <div class=\"ct-docs-footer-inner-row\">\n            <div class=\"ct-docs-footer-col\">\n              <div class=\"ct-docs-footer-copyright\">\n                © <script>\n                  document.write(new Date().getFullYear())\n                </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n              </div>\n            </div>\n            <div class=\"ct-docs-footer-col\">\n              <ul class=\"ct-docs-footer-nav-footer\">\n                <li>\n                  <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                </li>\n                <li class=\"nav-item\">\n                  <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n              </li>\n                <li>\n                  <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                </li>\n                <li>\n                  <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                </li>\n              </ul>\n            </div>\n          </div>\n        </footer>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n        Holder.addTheme('gray', {\n            bg: '#777',\n            fg: 'rgba(255,255,255,.75)',\n            font: 'Helvetica',\n            fontweight: 'normal'\n        })\n\n    </script>\n    <script>\n        // Facebook Pixel Code Don't Delete\n        ! function (f, b, e, v, n, t, s) {\n            if (f.fbq) return;\n            n = f.fbq = function () {\n                n.callMethod ?\n                    n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n            };\n            if (!f._fbq) f._fbq = n;\n            n.push = n;\n            n.loaded = !0;\n            n.version = '2.0';\n            n.queue = [];\n            t = b.createElement(e);\n            t.async = !0;\n            t.src = v;\n            s = b.getElementsByTagName(e)[0];\n            s.parentNode.insertBefore(t, s)\n        }(window,\n            document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n        try {\n            fbq('init', '111649226022273');\n            fbq('track', \"PageView\");\n\n        } catch (err) {\n            console.log('Facebook Track Error:', err);\n        }\n\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/cards.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Cards | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a>\n              <ul>\n                <li class=\"toc-entry toc-h5\"><a href=\"#----------cozy-5-stars-apartment--------\">\n                    Cozy 5 Stars Apartment\n                  </a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples-1\">Examples</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#layouts\">Layouts</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#card-groups-pro\">Card groups PRO</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#--------cozy-5-stars-apartment------\">\n                        Cozy 5 Stars Apartment\n                      </a></li>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#--------cozy-5-stars-apartment-------1\">\n                        Cozy 5 Stars Apartment\n                      </a></li>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#--------cozy-5-stars-apartment-------2\">\n                        Cozy 5 Stars Apartment\n                      </a></li>\n                  </ul>\n                </li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#advanced-examples\">Advanced examples</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#full-background-cards-pro\">Full background Cards PRO</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#some-kind-of-blues\">Some Kind Of Blues</a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#pricing-cards-pro\">Pricing cards PRO</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h1\"><a href=\"#----------59mo--------\">\n                $59/mo\n              </a></li>\n            <li class=\"toc-entry toc-h1\"><a href=\"#----------89mo--------\">\n                $89/mo\n              </a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#list-group-pro\">List group PRO</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h4\"><a href=\"#card-title\">Card title</a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#image-pro\">Image PRO</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#--------siri-brings-hands-free-tv-to-more-devices------\">\n                        Siri brings hands-free TV to more devices\n                      </a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#blockquote-pro\">Blockquote PRO</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#testimonial\">Testimonial</a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#overlay-pro\">Overlay PRO</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h4\"><a href=\"#search-and-discovery\">Search and Discovery</a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-panel\">Bootstrap Panel</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-4-panel-changes\">Bootstrap 4 Panel changes</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-background-image\">Bootstrap Background Image</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Cards\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap’s cards provide a flexible and extensible content container with multiple variants and options.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"examples\">Examples</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"row\">\n              <div class=\"col-5\">\n                <div class=\"card mt-4\" data-animation=\"true\">\n                  <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                    <a class=\"d-block blur-shadow-image\">\n                      <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg\" alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-lg\">\n                    </a>\n                    <div class=\"colored-shadow\" style=\"background-image: url(&quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&quot;);\"></div>\n                  </div>\n                  <div class=\"card-body text-center\">\n                    <div class=\"d-flex mt-n6 mx-auto\">\n                      <a class=\"btn btn-link text-primary ms-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Refresh\">\n                        <i class=\"material-icons text-lg\">refresh</i>\n                      </a>\n                      <button class=\"btn btn-link text-info me-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Edit\">\n                        <i class=\"material-icons text-lg\">edit</i>\n                      </button>\n                    </div>\n                    <h5 class=\"font-weight-normal mt-3\">\n                      <a href=\"javascript:;\">Cozy 5 Stars Apartment</a>\n                    </h5>\n                    <p class=\"mb-0\">\n                      The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n                    </p>\n                  </div>\n                  <hr class=\"dark horizontal my-0\">\n                  <div class=\"card-footer d-flex\">\n                    <p class=\"font-weight-normal my-auto\">$899/night</p>\n                    <i class=\"material-icons position-relative ms-auto text-lg me-1 my-auto\">place</i>\n                    <p class=\"text-sm my-auto\"> Barcelona, Spain</p>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header p-0 position-relative mt-n4 mx-3 z-index-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block blur-shadow-image<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-blur-shadow<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-fluid shadow border-radius-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>colored-shadow<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>&amp;quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&amp;quot;<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex mt-n6 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-primary ms-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Refresh<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>refresh<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-info me-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>edit<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal mt-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Cozy 5 Stars Apartment<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>hr</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dark horizontal my-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-footer d-flex<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$899/night<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons position-relative ms-auto text-lg me-1 my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>place<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span> Barcelona, Spain<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"examples-1\">Examples</h2>\n          <p>Cards support a wide variety of content, including images, text, list groups, links, and more. Below are examples of what’s supported.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card card-frame\">\n              <div class=\"card-body\">\n                This is some text within a card body.\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-frame<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    This is some text within a card body.\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"layouts\">Layouts</h2>\n          <p>In addition to styling the content within cards, Bootstrap includes a few options for laying out series of cards. For the time being, these layout options are not yet responsive.</p>\n          <h3 id=\"card-groups-pro\">Card groups <span class=\"badge badge-primary\">PRO</span></h3>\n          <p>Need a set of equal width and height cards that aren’t attached to one another? Use card decks.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card-group mt-4\">\n              <div class=\"card\" data-animation=\"true\">\n                <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                  <a class=\"d-block blur-shadow-image\">\n                    <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg\" alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-lg\">\n                  </a>\n                  <div class=\"colored-shadow\" style=\"background-image: url(&quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&quot;);\"></div>\n                </div>\n                <div class=\"card-body text-center\">\n                  <div class=\"d-flex mt-n6 mx-auto\">\n                    <a class=\"btn btn-link text-primary ms-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Refresh\">\n                      <i class=\"material-icons text-lg\">refresh</i>\n                    </a>\n                    <button class=\"btn btn-link text-info me-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Edit\">\n                      <i class=\"material-icons text-lg\">edit</i>\n                    </button>\n                  </div>\n                  <h5 class=\"font-weight-normal mt-3\">\n                    <a href=\"javascript:;\">Cozy 5 Stars Apartment</a>\n                  </h5>\n                  <p class=\"mb-0\">\n                    The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n                  </p>\n                </div>\n                <hr class=\"dark horizontal my-0\">\n                <div class=\"card-footer d-flex\">\n                  <p class=\"font-weight-normal my-auto\">$899/night</p>\n                  <i class=\"material-icons position-relative ms-auto text-lg me-1 my-auto\">place</i>\n                  <p class=\"text-sm my-auto\"> Barcelona, Spain</p>\n                </div>\n              </div>\n              <div class=\"card\" data-animation=\"true\">\n                <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                  <a class=\"d-block blur-shadow-image\">\n                    <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg\" alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-lg\">\n                  </a>\n                  <div class=\"colored-shadow\" style=\"background-image: url(&quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&quot;);\"></div>\n                </div>\n                <div class=\"card-body text-center\">\n                  <div class=\"d-flex mt-n6 mx-auto\">\n                    <a class=\"btn btn-link text-primary ms-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Refresh\">\n                      <i class=\"material-icons text-lg\">refresh</i>\n                    </a>\n                    <button class=\"btn btn-link text-info me-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Edit\">\n                      <i class=\"material-icons text-lg\">edit</i>\n                    </button>\n                  </div>\n                  <h5 class=\"font-weight-normal mt-3\">\n                    <a href=\"javascript:;\">Cozy 5 Stars Apartment</a>\n                  </h5>\n                  <p class=\"mb-0\">\n                    The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n                  </p>\n                </div>\n                <hr class=\"dark horizontal my-0\">\n                <div class=\"card-footer d-flex\">\n                  <p class=\"font-weight-normal my-auto\">$899/night</p>\n                  <i class=\"material-icons position-relative ms-auto text-lg me-1 my-auto\">place</i>\n                  <p class=\"text-sm my-auto\"> Barcelona, Spain</p>\n                </div>\n              </div>\n              <div class=\"card\" data-animation=\"true\">\n                <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                  <a class=\"d-block blur-shadow-image\">\n                    <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg\" alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-lg\">\n                  </a>\n                  <div class=\"colored-shadow\" style=\"background-image: url(&quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&quot;);\"></div>\n                </div>\n                <div class=\"card-body text-center\">\n                  <div class=\"d-flex mt-n6 mx-auto\">\n                    <a class=\"btn btn-link text-primary ms-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Refresh\">\n                      <i class=\"material-icons text-lg\">refresh</i>\n                    </a>\n                    <button class=\"btn btn-link text-info me-auto border-0\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Edit\">\n                      <i class=\"material-icons text-lg\">edit</i>\n                    </button>\n                  </div>\n                  <h5 class=\"font-weight-normal mt-3\">\n                    <a href=\"javascript:;\">Cozy 5 Stars Apartment</a>\n                  </h5>\n                  <p class=\"mb-0\">\n                    The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n                  </p>\n                </div>\n                <hr class=\"dark horizontal my-0\">\n                <div class=\"card-footer d-flex\">\n                  <p class=\"font-weight-normal my-auto\">$899/night</p>\n                  <i class=\"material-icons position-relative ms-auto text-lg me-1 my-auto\">place</i>\n                  <p class=\"text-sm my-auto\"> Barcelona, Spain</p>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header p-0 position-relative mt-n4 mx-3 z-index-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block blur-shadow-image<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-blur-shadow<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-fluid shadow border-radius-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>colored-shadow<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>&amp;quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&amp;quot;<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex mt-n6 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-primary ms-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Refresh<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>refresh<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-info me-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>edit<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal mt-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Cozy 5 Stars Apartment<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>hr</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dark horizontal my-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-footer d-flex<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$899/night<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons position-relative ms-auto text-lg me-1 my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>place<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span> Barcelona, Spain<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header p-0 position-relative mt-n4 mx-3 z-index-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block blur-shadow-image<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-blur-shadow<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-fluid shadow border-radius-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>colored-shadow<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>&amp;quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&amp;quot;<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex mt-n6 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-primary ms-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Refresh<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>refresh<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-info me-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>edit<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal mt-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Cozy 5 Stars Apartment<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>hr</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dark horizontal my-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-footer d-flex<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$899/night<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons position-relative ms-auto text-lg me-1 my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>place<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span> Barcelona, Spain<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header p-0 position-relative mt-n4 mx-3 z-index-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block blur-shadow-image<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-blur-shadow<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-fluid shadow border-radius-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>colored-shadow<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>&amp;quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&amp;quot;<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex mt-n6 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-primary ms-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Refresh<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>refresh<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-info me-auto border-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>edit<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal mt-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Cozy 5 Stars Apartment<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to \"Naviglio\" where you can enjoy the main night life in Barcelona.\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>hr</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dark horizontal my-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-footer d-flex<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$899/night<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons position-relative ms-auto text-lg me-1 my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>place<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span> Barcelona, Spain<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>d</code></pre>\n            </figure>\n          </div>\n          <h2 id=\"advanced-examples\">Advanced examples</h2>\n          <h3 id=\"full-background-cards-pro\">Full background Cards <span class=\"badge badge-primary\">PRO</span></h3>\n          <p><br></p>\n          <div class=\"row my-4\">\n            <div class=\"col-md-6\">\n              <div class=\"card card-background card-background-mask-dark align-items-start mt-4\">\n                <div class=\"full-background cursor-pointer\" style=\"background-image: url('https://images.unsplash.com/photo-1604213410393-89f141bb96b8?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTA5fHxuYXR1cmV8ZW58MHx8MHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=800&amp;q=60')\"></div>\n                <div class=\"card-body\">\n                  <h5 class=\"text-white mb-0\">Some Kind Of Blues</h5>\n                  <p class=\"text-white text-sm\">Deftones</p>\n                  <div class=\"d-flex mt-4 pt-2\">\n                    <button class=\"btn btn-outline-white rounded-circle p-2 mb-0\" type=\"button\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-bs-original-title=\"Prev\">\n                      <i class=\"material-icons p-2\">skip_previous</i>\n                    </button>\n                    <button class=\"btn btn-outline-white rounded-circle p-2 mx-2 mb-0\" type=\"button\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-bs-original-title=\"Play\">\n                      <i class=\"material-icons p-2\">play_arrow</i>\n                    </button>\n                    <button class=\"btn btn-outline-white rounded-circle p-2 mb-0\" type=\"button\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-bs-original-title=\"Next\">\n                      <i class=\"material-icons p-2\">skip_next</i>\n                    </button>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-md-6\">\n              <div class=\"card text-center\">\n                <div class=\"overflow-hidden position-relative border-radius-lg bg-cover p-3\" style=\"background-image: url('https://raw.githubusercontent.com/creativetimofficial/public-assets/master/soft-ui-design-system/assets/img/window-desk.jpg')\">\n                  <span class=\"mask bg-gradient-dark opacity-6\"></span>\n                  <div class=\"card-body position-relative z-index-1 d-flex flex-column mt-5\">\n                    <p class=\"text-white font-weight-bolder\">User #hashtag in a photo on social media and get $10 for each purchase you make.</p>\n                    <a class=\"text-white text-sm font-weight-bold mb-0 icon-move-right mt-4\" href=\"javascript:;\">\n                      Read More\n                      <i class=\"material-icons text-sm ms-1 position-relative\" aria-hidden=\"true\">arrow_forward</i>\n                    </a>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row my-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-background card-background-mask-dark align-items-start mt-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>full-background cursor-pointer<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>'https://images.unsplash.com/photo-1604213410393-89f141bb96b8?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTA5fHxuYXR1cmV8ZW58MHx8MHx8&amp;amp;ixlib=rb-1.2.1&amp;amp;auto=format&amp;amp;fit=crop&amp;amp;w=800&amp;amp;q=60'<span class=\"token punctuation\">)</span></span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Some Kind Of Blues<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Deftones<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex mt-4 pt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-white rounded-circle p-2 mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Prev<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>skip_previous<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-white rounded-circle p-2 mx-2 mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Play<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>play_arrow<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-outline-white rounded-circle p-2 mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>skip_next<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>overflow-hidden position-relative border-radius-lg bg-cover p-3<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>'https://raw.githubusercontent.com/creativetimofficial/public-assets/master/soft-ui-design-system/assets/img/window-desk.jpg'<span class=\"token punctuation\">)</span></span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mask bg-gradient-dark opacity-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body position-relative z-index-1 d-flex flex-column mt-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white font-weight-bolder<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>User #hashtag in a photo on social media and get $10 for each purchase you make.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white text-sm font-weight-bold mb-0 icon-move-right mt-4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            Read More\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons text-sm ms-1 position-relative<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>arrow_forward<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"pricing-cards-pro\">Pricing cards <span class=\"badge badge-primary\">PRO</span></h3>\n          <div class=\"row mt-4\">\n            <div class=\"col-md-4 mb-4\">\n              <div class=\"card shadow-lg\">\n                <span class=\"badge rounded-pill bg-light text-dark w-30 mt-n2 mx-auto\">Starter</span>\n                <div class=\"card-header text-center pt-4 pb-3\">\n                  <h1 class=\"font-weight-bold mt-2\">\n                    <small class=\"text-lg mb-auto\">$</small>59<small class=\"text-lg\">/mo</small>\n                  </h1>\n                </div>\n                <div class=\"card-body text-lg-start text-center pt-0\">\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto\">done</i>\n                    <span class=\"ps-3\">2 team members</span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto\">done</i>\n                    <span class=\"ps-3\">20GB Cloud storage </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto\">done</i>\n                    <span class=\"ps-3\">Integration help </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto\">remove</i>\n                    <span class=\"ps-3\">Sketch Files </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto\">remove</i>\n                    <span class=\"ps-3\">API Access </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto\">remove</i>\n                    <span class=\"ps-3\">Complete documentation </span>\n                  </div>\n                  <a href=\"javascript:;\" class=\"btn btn-icon bg-gradient-dark d-lg-block mt-3 mb-0\">\n                    Join\n                    <i class=\"fas fa-arrow-right ms-1\" aria-hidden=\"true\"></i>\n                  </a>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-md-4 mb-4\">\n              <div class=\"card bg-gradient-dark shadow-lg\">\n                <span class=\"badge rounded-pill bg-primary w-30 mt-n2 mx-auto\">Premium</span>\n                <div class=\"card-header text-center pt-4 pb-3 bg-transparent\">\n                  <h1 class=\"font-weight-bold mt-2 text-white\">\n                    <small class=\"text-lg mb-auto\">$</small>89<small class=\"text-lg\">/mo</small>\n                  </h1>\n                </div>\n                <div class=\"card-body text-lg-start text-center pt-0\">\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto text-white\">done</i>\n                    <span class=\"ps-3 text-white\">10 team members</span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto text-white\">done</i>\n                    <span class=\"ps-3 text-white\">40GB Cloud storage </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto text-white\">done</i>\n                    <span class=\"ps-3 text-white\">Integration help </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto text-white\">done</i>\n                    <span class=\"ps-3 text-white\">Sketch Files </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto text-white\">remove</i>\n                    <span class=\"ps-3 text-white\">API Access </span>\n                  </div>\n                  <div class=\"d-flex justify-content-lg-start justify-content-center p-2\">\n                    <i class=\"material-icons my-auto text-white\">remove</i>\n                    <span class=\"ps-3 text-white\">Complete documentation </span>\n                  </div>\n                  <a href=\"javascript:;\" class=\"btn btn-icon bg-gradient-primary d-lg-block mt-3 mb-0\">\n                    Try Premium\n                    <i class=\"fas fa-arrow-right ms-1\" aria-hidden=\"true\"></i>\n                  </a>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4 mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card shadow-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge rounded-pill bg-light text-dark w-30 mt-n2 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Starter<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header text-center pt-4 pb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bold mt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>small</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-lg mb-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>small</span><span class=\"token punctuation\">&gt;</span></span>59<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>small</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>/mo<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>small</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body text-lg-start text-center pt-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2 team members<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>20GB Cloud storage <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Integration help <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>remove<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Sketch Files <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>remove<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>API Access <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>remove<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Complete documentation <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-icon bg-gradient-dark d-lg-block mt-3 mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          Join\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fas fa-arrow-right ms-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4 mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card bg-gradient-dark shadow-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge rounded-pill bg-primary w-30 mt-n2 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Premium<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header text-center pt-4 pb-3 bg-transparent<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bold mt-2 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>small</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-lg mb-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>small</span><span class=\"token punctuation\">&gt;</span></span>89<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>small</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>/mo<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>small</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body text-lg-start text-center pt-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>10 team members<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>40GB Cloud storage <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Integration help <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Sketch Files <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>remove<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>API Access <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-lg-start justify-content-center p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons my-auto text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>remove<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-3 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Complete documentation <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-icon bg-gradient-primary d-lg-block mt-3 mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          Try Premium\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fas fa-arrow-right ms-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"list-group-pro\">List group <span class=\"badge badge-primary\">PRO</span></h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card mt-4\">\n              <!-- Card image -->\n              <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                <img class=\"border-radius-lg w-100\" src=\"https://images.unsplash.com/photo-1531512073830-ba890ca4eba2?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1920&amp;q=80\" alt=\"Image placeholder\">\n                <!-- List group -->\n                <ul class=\"list-group list-group-flush mt-2\">\n                  <li class=\"list-group-item\">Cras justo odio</li>\n                  <li class=\"list-group-item\">Dapibus ac facilisis in</li>\n                  <li class=\"list-group-item\">Vestibulum at eros</li>\n                </ul>\n              </div>\n              <!-- Card body -->\n              <div class=\"card-body\">\n                <h4 class=\"font-weight-normal mt-3\">Card title</h4>\n                <p class=\"card-text mb-4\">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facilis non dolore est fuga nobis ipsum illum eligendi nemo iure repellat, soluta, optio minus ut reiciendis voluptates enim impedit veritatis officiis.</p>\n                <a href=\"#\" class=\"btn btn-primary\">Go somewhere</a>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mt-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n   <span class=\"token comment\">&lt;!-- Card image --&gt;</span>\n   <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header p-0 position-relative mt-n4 mx-3 z-index-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n     <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>border-radius-lg w-100<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://images.unsplash.com/photo-1531512073830-ba890ca4eba2?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1920&amp;q=80<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Image placeholder<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n     <span class=\"token comment\">&lt;!-- List group --&gt;</span>\n     <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group list-group-flush mt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Cras justo odio<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Dapibus ac facilisis in<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Vestibulum at eros<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n     <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n   <span class=\"token comment\">&lt;!-- Card body --&gt;</span>\n   <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal mt-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Card title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-text mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facilis non dolore est fuga nobis ipsum illum eligendi nemo iure repellat, soluta, optio minus ut reiciendis voluptates enim impedit veritatis officiis.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Go somewhere<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n   <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"image-pro\">Image <span class=\"badge badge-primary\">PRO</span></h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card mt-4\">\n              <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                <a class=\"d-block blur-shadow-image\">\n                  <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg\" alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-lg\">\n                </a>\n                <div class=\"colored-shadow\" style=\"background-image: url(&quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&quot;);\"></div>\n              </div>\n              <div class=\"card-body px-4 pt-2\">\n                <a href=\"javascript:;\">\n                  <h5 class=\"font-weight-normal mt-3\">\n                    Siri brings hands-free TV to more devices\n                  </h5>\n                </a>\n                <p>\n                  Siri's latest trick is offering a hands-free TV viewing experience, that will allow consumers to turn on or off their television, change inputs, fast forward, rewind and more, without having to first invoke a specific skill, or even\n                  press a button on their remote.\n                </p>\n                <button type=\"button\" class=\"btn bg-gradient-primary mt-3 mb-0\">Read more</button>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header p-0 position-relative mt-n4 mx-3 z-index-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block blur-shadow-image<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-blur-shadow<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-fluid shadow border-radius-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>colored-shadow<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>&amp;quot;https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg&amp;quot;<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body px-4 pt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal mt-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        Siri brings hands-free TV to more devices\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n      Siri's latest trick is offering a hands-free TV viewing experience, that will allow consumers to turn on or off their television, change inputs, fast forward, rewind and more, without having to first invoke a specific skill, or even\n      press a button on their remote.\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary mt-3 mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Read more<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"blockquote-pro\">Blockquote <span class=\"badge badge-primary\">PRO</span></h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card bg-gradient-default\">\n              <div class=\"card-body\">\n                <h5 class=\"font-weight-normal text-info text-gradient\">Testimonial</h5>\n                <blockquote class=\"blockquote text-white mb-0\">\n                  <p class=\"text-dark ms-3\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>\n                  <footer class=\"blockquote-footer text-gradient text-info text-sm ms-3\">Someone famous in <cite title=\"Source Title\">Source Title</cite></footer>\n                </blockquote>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card bg-gradient-default<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-normal text-info text-gradient<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Testimonial<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>blockquote</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote text-white mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark ms-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>footer</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote-footer text-gradient text-info text-sm ms-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Someone famous in <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>cite</span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Source Title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Source Title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>cite</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>footer</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>blockquote</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"overlay-pro\">Overlay <span class=\"badge badge-primary\">PRO</span></h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card card-background\">\n              <div class=\"full-background\" style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1950&amp;q=80')\"></div>\n              <div class=\"card-body pt-12\">\n                <h4 class=\"text-white font-weight-normal\">Search and Discovery</h4>\n                <p>Website visitors today demand a frictionless user expericence — especially when using search. Because of the hight standards.</p>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-background<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>full-background<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>'https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1950&amp;q=80'<span class=\"token punctuation\">)</span></span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body pt-12<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Search and Discovery<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Website visitors today demand a frictionless user expericence — especially when using search. Because of the hight standards.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bootstrap-panel\">Bootstrap Panel</h3>\n          <p>In Bootstrap 4, panels are dropped entirely for the new card component and are created with the <code class=\" highlighter-rouge language-plaintext\">.card</code> class, and content inside the panel has a <code class=\" highlighter-rouge language-plaintext\">.card-body</code> class.</p>\n          <h3 id=\"bootstrap-4-panel-changes\">Bootstrap 4 Panel changes</h3>\n          <ul>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel</code> to <code class=\" highlighter-rouge language-plaintext\">.card</code>, now built with flexbox.</li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel-default</code> removed and no replacement.</li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel-group</code> removed and no replacement. <code class=\" highlighter-rouge language-plaintext\">.card-group</code> is not a replacement, it is different.</li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel-heading</code> to <code class=\" highlighter-rouge language-plaintext\">.card-header</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel-title</code> to <code class=\" highlighter-rouge language-plaintext\">.card-title</code>. Depending on the desired look, you may also want to use heading elements or classes (e.g. <code class=\" highlighter-rouge language-plaintext\">&lt;h3&gt;</code>, <code class=\" highlighter-rouge language-plaintext\">.h3</code>) or bold elements or classes (e.g. <code class=\" highlighter-rouge language-plaintext\">&lt;strong&gt;</code>, <code class=\" highlighter-rouge language-plaintext\">&lt;b&gt;</code>, <code class=\" highlighter-rouge language-plaintext\">.font-weight-bold</code>). Note that <code class=\" highlighter-rouge language-plaintext\">.card-title</code>, while similarly named, produces a different look than <code class=\" highlighter-rouge language-plaintext\">.panel-title</code>.</li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel-body</code> to <code class=\" highlighter-rouge language-plaintext\">.card-body</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel-footer</code> to <code class=\" highlighter-rouge language-plaintext\">.card-footer</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.panel-primary</code>, <code class=\" highlighter-rouge language-plaintext\">.panel-success</code>, <code class=\" highlighter-rouge language-plaintext\">.panel-info</code>, <code class=\" highlighter-rouge language-plaintext\">.panel-warning</code>, and <code class=\" highlighter-rouge language-plaintext\">.panel-danger</code> have been dropped for <code class=\" highlighter-rouge language-plaintext\">.bg-</code>, <code class=\" highlighter-rouge language-plaintext\">.text-</code>, and <code class=\" highlighter-rouge language-plaintext\">.border</code> utilities generated from our <code class=\" highlighter-rouge language-plaintext\">$theme-colors</code> Sass map.</li>\n          </ul>\n          <h3 id=\"bootstrap-background-image\">Bootstrap Background Image</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card bg-dark text-white border-0\">\n              <img class=\"card-img\" src=\"https://images.unsplash.com/photo-1560157368-946d9c8f7cb6?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1951&amp;q=80\" alt=\"Card image\">\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card bg-dark text-white border-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-img<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://images.unsplash.com/photo-1560157368-946d9c8f7cb6?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1951&amp;q=80<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Card image<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/carousel.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Carousel | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#example-pro\">Example PRO</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h4\"><a href=\"#pricing-plans\">Pricing Plans</a></li>\n                  </ul>\n                </li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h1\"><a href=\"#work-with-the-rockets\">Work with the rockets</a>\n              <ul>\n                <li class=\"toc-entry toc-h4\"><a href=\"#our-team\">Our Team</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h1\"><a href=\"#work-with-the-best\">Work with the best</a>\n              <ul>\n                <li class=\"toc-entry toc-h4\"><a href=\"#office-places\">Office Places</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h1\"><a href=\"#work-from-home\">Work from home</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Carousel\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">The Bootstrap carousel is a slideshow component for cycling through elements—images or slides of text—like a carousel.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"example\">Example</h2>\n          <div class=\"row\">\n            <div class=\"col-md-8 mx-auto\">\n              <div id=\"carouselExampleIndicators\" class=\"carousel slide\" data-bs-ride=\"carousel\">\n                <ol class=\"carousel-indicators\">\n                  <li data-target=\"#carouselExampleIndicators\" data-bs-slide-to=\"0\" class=\"\"></li>\n                  <li data-target=\"#carouselExampleIndicators\" data-bs-slide-to=\"1\"></li>\n                  <li data-target=\"#carouselExampleIndicators\" data-bs-slide-to=\"2\"></li>\n                </ol>\n                <div class=\"carousel-inner\">\n                  <div class=\"carousel-item active carousel-item-start\">\n                    <img class=\"d-block w-100\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg\" alt=\"First slide\">\n                  </div>\n                  <div class=\"carousel-item carousel-item-next carousel-item-start\">\n                    <img class=\"d-block w-100\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-2-min.jpg\" alt=\"Second slide\">\n                  </div>\n                  <div class=\"carousel-item\">\n                    <img class=\"d-block w-100\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-3-min.jpg\" alt=\"Third slide\">\n                  </div>\n                </div>\n                <a class=\"carousel-control-prev\" href=\"#carouselExampleIndicators\" role=\"button\" data-bs-slide=\"prev\">\n                  <span class=\"carousel-control-prev-icon\" aria-hidden=\"true\"></span>\n                  <span class=\"sr-only\">Previous</span>\n                </a>\n                <a class=\"carousel-control-next\" href=\"#carouselExampleIndicators\" role=\"button\" data-bs-slide=\"next\">\n                  <span class=\"carousel-control-next-icon\" aria-hidden=\"true\"></span>\n                  <span class=\"sr-only\">Next</span>\n                </a>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-8 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carouselExampleIndicators<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel slide<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-ride</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ol</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-indicators<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#carouselExampleIndicators<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-slide-to</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#carouselExampleIndicators<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-slide-to</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#carouselExampleIndicators<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-slide-to</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ol</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-inner<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block w-100<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>First slide<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block w-100<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-2-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Second slide<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-block w-100<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-3-min.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Third slide<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-prev<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#carouselExampleIndicators<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-slide</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>prev<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-prev-icon<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Previous<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-next<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#carouselExampleIndicators<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-slide</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-next-icon<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Next<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"example-pro\">Example <span class=\"badge badge-primary\">PRO</span></h3>\n          <div id=\"carouselExampleControls\" class=\"carousel slide\" data-bs-ride=\"carousel\">\n            <div class=\"carousel-inner mb-4\">\n              <div class=\"carousel-item active carousel-item-start\">\n                <div class=\"page-header min-vh-75 m-3 border-radius-xl\" style=\"background-image: url('https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-3-min.jpg');\">\n                  <span class=\"mask bg-gradient-dark\"></span>\n                  <div class=\"container\">\n                    <div class=\"row\">\n                      <div class=\"col-lg-6 my-auto\">\n                        <h4 class=\"text-white mb-0 fadeIn1 fadeInBottom\">Pricing Plans</h4>\n                        <h1 class=\"text-white fadeIn2 fadeInBottom\">Work with the rockets</h1>\n                        <p class=\"lead text-white opacity-8 fadeIn3 fadeInBottom\">Wealth creation is an evolutionarily recent positive-sum game. Status is an old zero-sum game. Those attacking wealth creation are often just seeking status.</p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n              <div class=\"carousel-item carousel-item-next carousel-item-start\">\n                <div class=\"page-header min-vh-75 m-3 border-radius-xl\" style=\"background-image: url('https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg');\">\n                  <span class=\"mask bg-gradient-dark\"></span>\n                  <div class=\"container\">\n                    <div class=\"row\">\n                      <div class=\"col-lg-6 my-auto\">\n                        <h4 class=\"text-white mb-0 fadeIn1 fadeInBottom\">Our Team</h4>\n                        <h1 class=\"text-white fadeIn2 fadeInBottom\">Work with the best</h1>\n                        <p class=\"lead text-white opacity-8 fadeIn3 fadeInBottom\">Free people make free choices. Free choices mean you get unequal outcomes. You can have freedom, or you can have equal outcomes. You can’t have both.</p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n              <div class=\"carousel-item\">\n                <div class=\"page-header min-vh-75 m-3 border-radius-xl\" style=\"background-image: url('https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-2-min.jpg');\">\n                  <span class=\"mask bg-gradient-dark\"></span>\n                  <div class=\"container\">\n                    <div class=\"row\">\n                      <div class=\"col-lg-6 my-auto\">\n                        <h4 class=\"text-white mb-0 fadeIn1 fadeInBottom\">Office Places</h4>\n                        <h1 class=\"text-white fadeIn2 fadeInBottom\">Work from home</h1>\n                        <p class=\"lead text-white opacity-8 fadeIn3 fadeInBottom\">You’re spending time to save money when you should be spending money to save time.</p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"min-vh-75 position-absolute w-100 top-0\">\n              <a class=\"carousel-control-prev\" href=\"#carouselExampleControls\" role=\"button\" data-bs-slide=\"prev\">\n                <span class=\"carousel-control-prev-icon position-absolute bottom-50\" aria-hidden=\"true\"></span>\n                <span class=\"visually-hidden\">Previous</span>\n              </a>\n              <a class=\"carousel-control-next\" href=\"#carouselExampleControls\" role=\"button\" data-bs-slide=\"next\">\n                <span class=\"carousel-control-next-icon position-absolute bottom-50\" aria-hidden=\"true\"></span>\n                <span class=\"visually-hidden\">Next</span>\n              </a>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carouselExampleControls<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel slide<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-ride</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-inner mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-header min-vh-75 m-3 border-radius-xl<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>'https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-3-min.jpg'<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mask bg-gradient-dark<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-lg-6 my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white mb-0 fadeIn1 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Pricing Plans<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white fadeIn2 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Work with the rockets<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>lead text-white opacity-8 fadeIn3 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Wealth creation is an evolutionarily recent positive-sum game. Status is an old zero-sum game. Those attacking wealth creation are often just seeking status.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-header min-vh-75 m-3 border-radius-xl<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>'https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-1-min.jpg'<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mask bg-gradient-dark<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-lg-6 my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white mb-0 fadeIn1 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Our Team<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white fadeIn2 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Work with the best<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>lead text-white opacity-8 fadeIn3 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Free people make free choices. Free choices mean you get unequal outcomes. You can have freedom, or you can have equal outcomes. You can’t have both.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-header min-vh-75 m-3 border-radius-xl<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">background-image</span><span class=\"token punctuation\">:</span> <span class=\"token url\"><span class=\"token function\">url</span><span class=\"token punctuation\">(</span>'https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-2-min.jpg'<span class=\"token punctuation\">)</span></span><span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mask bg-gradient-dark<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-lg-6 my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white mb-0 fadeIn1 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Office Places<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-white fadeIn2 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Work from home<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>lead text-white opacity-8 fadeIn3 fadeInBottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>You’re spending time to save money when you should be spending money to save time.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>min-vh-75 position-absolute w-100 top-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-prev<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#carouselExampleControls<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-slide</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>prev<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-prev-icon position-absolute bottom-50<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>visually-hidden<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Previous<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-next<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#carouselExampleControls<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-slide</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-control-next-icon position-absolute bottom-50<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>visually-hidden<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Next<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>...<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>...<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>carousel-caption d-none d-md-block<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span><span class=\"token punctuation\">&gt;</span></span>...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim </a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/collapse.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Collapse | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#accordion-example\">Accordion Example</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#frequently-asked-questions\">Frequently Asked Questions</a>\n              <ul>\n                <li class=\"toc-entry toc-h5\"><a href=\"#headingOne\">\n                    How do I order?\n                  </a></li>\n                <li class=\"toc-entry toc-h5\"><a href=\"#headingTwo\">\n                    How can i make the payment?\n                  </a></li>\n                <li class=\"toc-entry toc-h5\"><a href=\"#headingThree\">\n                    How much time does it take to receive the order?\n                  </a></li>\n                <li class=\"toc-entry toc-h5\"><a href=\"#headingFour\">\n                    Can I resell the products?\n                  </a></li>\n                <li class=\"toc-entry toc-h5\"><a href=\"#headingFifth\">\n                    Where do I find the shipping details?\n                  </a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Collapse\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Toggle the visibility of content across your project with a few classes and our JavaScript plugins.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"examples\">Examples</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <p>\n              <a class=\"btn bg-gradient-primary mb-0\" data-bs-toggle=\"collapse\" href=\"#collapseExample\" role=\"button\" aria-expanded=\"false\" aria-controls=\"collapseExample\">\n                Link with href\n              </a>\n              <button class=\"btn bg-gradient-primary mb-0\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapseExample\" aria-expanded=\"false\" aria-controls=\"collapseExample\">\n                Button with data-bs-target\n              </button>\n            </p>\n            <div class=\"collapse\" id=\"collapseExample\">\n              <div class=\"card card-body\">\n                Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#collapseExample<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseExample<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Link with href\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#collapseExample<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseExample<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Button with data-bs-target\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseExample<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"accordion-example\">Accordion Example</h2>\n          <div class=\"accordion-1\">\n            <div class=\"container\">\n              <div class=\"row my-5\">\n                <div class=\"col-md-6 mx-auto text-center\">\n                  <h2>Frequently Asked Questions</h2>\n                  <p>A lot of people don’t appreciate the moment until it’s passed. I'm not trying my hardest, and I'm not trying to do </p>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-md-10 mx-auto\">\n                  <div class=\"accordion\" id=\"accordionRental\">\n                    <div class=\"accordion-item mb-3\">\n                      <h5 class=\"accordion-header\" id=\"headingOne\">\n                        <button class=\"accordion-button border-bottom font-weight-bold collapsed\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapseOne\" aria-expanded=\"false\" aria-controls=\"collapseOne\">\n                          How do I order?\n                          <i class=\"collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                          <i class=\"collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                        </button>\n                      </h5>\n                      <div id=\"collapseOne\" class=\"accordion-collapse collapse\" aria-labelledby=\"headingOne\" data-bs-parent=\"#accordionRental\">\n                        <div class=\"accordion-body text-sm opacity-8\">\n                          We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game\n                          of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.\n                        </div>\n                      </div>\n                    </div>\n                    <div class=\"accordion-item mb-3\">\n                      <h5 class=\"accordion-header\" id=\"headingTwo\">\n                        <button class=\"accordion-button border-bottom font-weight-bold\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapseTwo\" aria-expanded=\"false\" aria-controls=\"collapseTwo\">\n                          How can i make the payment?\n                          <i class=\"collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                          <i class=\"collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                        </button>\n                      </h5>\n                      <div id=\"collapseTwo\" class=\"accordion-collapse collapse\" aria-labelledby=\"headingTwo\" data-bs-parent=\"#accordionRental\">\n                        <div class=\"accordion-body text-sm opacity-8\">\n                          It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter. Because it's about motivating the doers. Because I’m here to follow my dreams and inspire other people to follow their dreams, too.\n                          <br>\n                          We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.\n                        </div>\n                      </div>\n                    </div>\n                    <div class=\"accordion-item mb-3\">\n                      <h5 class=\"accordion-header\" id=\"headingThree\">\n                        <button class=\"accordion-button border-bottom font-weight-bold\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapseThree\" aria-expanded=\"false\" aria-controls=\"collapseThree\">\n                          How much time does it take to receive the order?\n                          <i class=\"collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                          <i class=\"collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                        </button>\n                      </h5>\n                      <div id=\"collapseThree\" class=\"accordion-collapse collapse\" aria-labelledby=\"headingThree\" data-bs-parent=\"#accordionRental\">\n                        <div class=\"accordion-body text-sm opacity-8\">\n                          The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For standing out. But the time is now to be okay to be the greatest you. Would you believe in what you believe in, if you were the only one who believed it?\n                          If everything I did failed - which it doesn't, it actually succeeds - just the fact that I'm willing to fail is an inspiration. People are so scared to lose that they don't even try. Like, one thing people can't say is that I'm not trying, and I'm not trying my hardest, and I'm not trying to do the best way I know how.\n                        </div>\n                      </div>\n                    </div>\n                    <div class=\"accordion-item mb-3\">\n                      <h5 class=\"accordion-header\" id=\"headingFour\">\n                        <button class=\"accordion-button border-bottom font-weight-bold\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapseFour\" aria-expanded=\"false\" aria-controls=\"collapseFour\">\n                          Can I resell the products?\n                          <i class=\"collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                          <i class=\"collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                        </button>\n                      </h5>\n                      <div id=\"collapseFour\" class=\"accordion-collapse collapse\" aria-labelledby=\"headingFour\" data-bs-parent=\"#accordionRental\">\n                        <div class=\"accordion-body text-sm opacity-8\">\n                          I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They're slowed down by their perception of themselves. If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.\n                          <br><br>\n                          If everything I did failed - which it doesn't, it actually succeeds - just the fact that I'm willing to fail is an inspiration. People are so scared to lose that they don't even try. Like, one thing people can't say is that I'm not trying, and I'm not trying my hardest, and I'm not trying to do the best way I know how.\n                        </div>\n                      </div>\n                    </div>\n                    <div class=\"accordion-item mb-3\">\n                      <h5 class=\"accordion-header\" id=\"headingFifth\">\n                        <button class=\"accordion-button border-bottom font-weight-bold\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapseFifth\" aria-expanded=\"false\" aria-controls=\"collapseFifth\">\n                          Where do I find the shipping details?\n                          <i class=\"collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                          <i class=\"collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3\" aria-hidden=\"true\"></i>\n                        </button>\n                      </h5>\n                      <div id=\"collapseFifth\" class=\"accordion-collapse collapse\" aria-labelledby=\"headingFifth\" data-bs-parent=\"#accordionRental\">\n                        <div class=\"accordion-body text-sm opacity-8\">\n                          There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill. I’m not really specifically talented at anything except for the ability to learn. That’s what I do. That’s what I’m here for. Don’t be afraid to be wrong because you can’t learn anything from a compliment.\n                          I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They're slowed down by their perception of themselves. If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row my-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6 mx-auto text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h2</span><span class=\"token punctuation\">&gt;</span></span>Frequently Asked Questions<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h2</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>A lot of people don’t appreciate the moment until it’s passed. I'm not trying my hardest, and I'm not trying to do <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-10 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordionRental<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-item mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-header<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingOne<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-button border-bottom font-weight-bold collapsed<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#collapseOne<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseOne<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                How do I order?\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseOne<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-collapse collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingOne<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-parent</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#accordionRental<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-body text-sm opacity-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game\n                of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-item mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-header<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingTwo<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-button border-bottom font-weight-bold<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#collapseTwo<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseTwo<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                How can i make the payment?\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseTwo<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-collapse collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingTwo<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-parent</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#accordionRental<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-body text-sm opacity-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter. Because it's about motivating the doers. Because I’m here to follow my dreams and inspire other people to follow their dreams, too.\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">&gt;</span></span>\n                We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-item mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-header<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingThree<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-button border-bottom font-weight-bold<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#collapseThree<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseThree<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                How much time does it take to receive the order?\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseThree<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-collapse collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingThree<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-parent</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#accordionRental<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-body text-sm opacity-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For standing out. But the time is now to be okay to be the greatest you. Would you believe in what you believe in, if you were the only one who believed it?\n                If everything I did failed - which it doesn't, it actually succeeds - just the fact that I'm willing to fail is an inspiration. People are so scared to lose that they don't even try. Like, one thing people can't say is that I'm not trying, and I'm not trying my hardest, and I'm not trying to do the best way I know how.\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-item mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-header<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingFour<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-button border-bottom font-weight-bold<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#collapseFour<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseFour<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                Can I resell the products?\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseFour<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-collapse collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingFour<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-parent</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#accordionRental<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-body text-sm opacity-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They're slowed down by their perception of themselves. If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">&gt;</span></span>\n                If everything I did failed - which it doesn't, it actually succeeds - just the fact that I'm willing to fail is an inspiration. People are so scared to lose that they don't even try. Like, one thing people can't say is that I'm not trying, and I'm not trying my hardest, and I'm not trying to do the best way I know how.\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-item mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-header<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingFifth<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-button border-bottom font-weight-bold<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#collapseFifth<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseFifth<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                Where do I find the shipping details?\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapseFifth<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-collapse collapse<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>headingFifth<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-parent</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#accordionRental<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>accordion-body text-sm opacity-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill. I’m not really specifically talented at anything except for the ability to learn. That’s what I do. That’s what I’m here for. Don’t be afraid to be wrong because you can’t learn anything from a compliment.\n                I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They're slowed down by their perception of themselves. If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/dropdowns.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Dropdowns | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#dropup\">Dropup</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#colors\">Colors</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Dropdowns\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Toggle contextual overlays for displaying lists of links and more with the Bootstrap dropdown plugin.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"examples\">Examples</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"dropdown\">\n              <button class=\"btn btn-secondary dropdown-toggle\" type=\"button\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                Dropdown button\n              </button>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\n                <li><a class=\"dropdown-item\" href=\"#\">Action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Another action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Something else here</a></li>\n              </ul>\n            </div>\n            <div class=\"dropdown\">\n              <a href=\"#\" class=\"btn bg-gradient-dark dropdown-toggle \" data-bs-toggle=\"dropdown\" id=\"navbarDropdownMenuLink2\">\n                <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/US.png\"> Flags\n              </a>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"navbarDropdownMenuLink2\">\n                <li>\n                  <a class=\"dropdown-item\" href=\"#\">\n                    <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/DE.png\"> Deutsch\n                  </a>\n                </li>\n                <li>\n                  <a class=\"dropdown-item\" href=\"#\">\n                    <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/GB.png\"> English(UK)\n                  </a>\n                </li>\n                <li>\n                  <a class=\"dropdown-item\" href=\"#\">\n                    <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/BR.png\"> Brasil\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-dark dropdown-toggle <span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbarDropdownMenuLink2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/US.png<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span> Flags\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbarDropdownMenuLink2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/DE.png<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span> Deutsch\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/GB.png<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span> English(UK)\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/icons/flags/BR.png<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span> Brasil\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"dropup\">Dropup</h2>\n          <div class=\"btn-group dropup mt-7\">\n            <button type=\"button\" class=\"btn bg-gradient-primary dropdown-toggle\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n              Dropup\n            </button>\n            <ul class=\"dropdown-menu px-2 py-3\" aria-labelledby=\"dropdownMenuButton\">\n              <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">Action</a></li>\n              <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">Another action</a></li>\n              <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">Something else here</a></li>\n            </ul>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-group dropup mt-7<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary dropdown-toggle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Dropup\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu px-2 py-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Another action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Something else here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"colors\">Colors</h2>\n          <p>The best part is you can do this with any button variant, too:</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"dropdown\">\n              <button class=\"btn bg-gradient-primary dropdown-toggle\" type=\"button\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                Primary\n              </button>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\n                <li><a class=\"dropdown-item\" href=\"#\">Action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Another action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Something else here</a></li>\n              </ul>\n            </div>\n            <div class=\"dropdown\">\n              <button class=\"btn bg-gradient-secondary dropdown-toggle\" type=\"button\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                Secondary\n              </button>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\n                <li><a class=\"dropdown-item\" href=\"#\">Action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Another action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Something else here</a></li>\n              </ul>\n            </div>\n            <div class=\"dropdown\">\n              <button class=\"btn bg-gradient-success dropdown-toggle\" type=\"button\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                Success\n              </button>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\n                <li><a class=\"dropdown-item\" href=\"#\">Action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Another action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Something else here</a></li>\n              </ul>\n            </div>\n            <div class=\"dropdown\">\n              <button class=\"btn bg-gradient-info dropdown-toggle\" type=\"button\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                Info\n              </button>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\n                <li><a class=\"dropdown-item\" href=\"#\">Action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Another action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Something else here</a></li>\n              </ul>\n            </div>\n            <div class=\"dropdown\">\n              <button class=\"btn bg-gradient-warning dropdown-toggle\" type=\"button\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                Warning\n              </button>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\n                <li><a class=\"dropdown-item\" href=\"#\">Action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Another action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Something else here</a></li>\n              </ul>\n            </div>\n            <div class=\"dropdown\">\n              <button class=\"btn bg-gradient-danger dropdown-toggle\" type=\"button\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                Danger\n              </button>\n              <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\n                <li><a class=\"dropdown-item\" href=\"#\">Action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Another action</a></li>\n                <li><a class=\"dropdown-item\" href=\"#\">Something else here</a></li>\n              </ul>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary dropdown-toggle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Primary\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Another action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Something else here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-secondary dropdown-toggle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Secondary\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Another action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Something else here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-success dropdown-toggle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Success\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Another action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Something else here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-info dropdown-toggle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Info\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Another action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Something else here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-warning dropdown-toggle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Warning\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Another action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Something else here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-danger dropdown-toggle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Danger\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Another action<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Something else here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/forms.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Forms | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#inputs\">Inputs</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#default\">Default</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#alternative\">Alternative</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#form-styles\">Form styles</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#form-controls\">Form controls</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#html5-inputs\">HTML5 inputs</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#custom-forms\">Custom forms</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#checkboxes\">Checkboxes</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#radios\">Radios</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#disabled\">Disabled</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#toggles\">Toggles</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Forms\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Examples and usage guidelines for form control styles, layout options, and custom components for creating a wide variety of forms.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"inputs\">Inputs</h2>\n          <h3 id=\"default\">Default</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <form>\n              <div class=\"row\">\n                <div class=\"col-md-6\">\n                  <div class=\"input-group input-group-outline my-3\">\n                    <label class=\"form-label\">Email</label>\n                    <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                </div>\n                <div class=\"col-md-6\">\n                  <div class=\"input-group input-group-outline my-3\">\n                    <label class=\"form-label\">Email</label>\n                    <input type=\"email\" class=\"form-control\" disabled=\"\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-md-6\">\n                  <div class=\"input-group input-group-outline is-valid my-3\">\n                    <label class=\"form-label\">Success</label>\n                    <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                </div>\n                <div class=\"col-md-6\">\n                  <div class=\"input-group input-group-outline is-invalid my-3\">\n                    <label class=\"form-label\">Error</label>\n                    <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                </div>\n              </div>\n            </form>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline is-valid my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline is-invalid my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Error<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"alternative\">Alternative</h3>\n          <p>If you want to use forms on grayish background colors, you can use this beautiful alternative style which removes the borders and it is emphasized only by its shadow.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"p-4 bg-light\">\n              <form>\n                <div class=\"row\">\n                  <div class=\"col-md-6\">\n                    <div class=\"input-group input-group-outline my-3\">\n                      <label class=\"form-label\">Email</label>\n                      <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                    </div>\n                  </div>\n                  <div class=\"col-md-6\">\n                    <div class=\"input-group input-group-outline my-3\">\n                      <label class=\"form-label\">Email</label>\n                      <input type=\"email\" class=\"form-control\" disabled=\"\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                    </div>\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-md-6\">\n                    <div class=\"input-group input-group-outline is-valid my-3\">\n                      <label class=\"form-label\">Success</label>\n                      <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                    </div>\n                  </div>\n                  <div class=\"col-md-6\">\n                    <div class=\"input-group input-group-outline is-invalid my-3\">\n                      <label class=\"form-label\">Error</label>\n                      <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                    </div>\n                  </div>\n                </div>\n              </form>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-4 bg-light<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline is-valid my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline is-invalid my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Error<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"form-styles\">Form styles</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"p-4\">\n              <form>\n                <div class=\"input-group input-group-outline mb-4\">\n                  <label class=\"form-label\">Label</label>\n                  <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                </div>\n                <div class=\"input-group input-group-dynamic mb-4\">\n                  <label class=\"form-label\">Label</label>\n                  <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                </div>\n                <div class=\"input-group input-group-static mb-4\">\n                  <label>Label</label>\n                  <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                </div>\n              </form>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Label<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-dynamic mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Label<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span><span class=\"token punctuation\">&gt;</span></span>Label<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"form-controls\">Form controls</h2>\n          <p>Textual form controls—like <code class=\" highlighter-rouge language-plaintext\">&lt;input&gt;</code>s, <code class=\" highlighter-rouge language-plaintext\">&lt;select&gt;</code>s, and <code class=\" highlighter-rouge language-plaintext\">&lt;textarea&gt;</code>s—are styled with the <code class=\" highlighter-rouge language-plaintext\">.form-control</code> class. Included are styles for general appearance, focus state, sizing, and more.</p>\n          <p>For all form control you can apply the additional modifier classes explained in the Inputs section: <code class=\" highlighter-rouge language-plaintext\">.form-control-alternative</code>, <code class=\" highlighter-rouge language-plaintext\">.form-control-flush</code> and <code class=\" highlighter-rouge language-plaintext\">.form-control-muted</code>.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <form>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Email address</label>\n                <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-static mb-4\">\n                <label for=\"exampleFormControlSelect1\" class=\"ms-0\">Example select</label>\n                <select class=\"form-control\" id=\"exampleFormControlSelect1\">\n                  <option>1</option>\n                  <option>2</option>\n                  <option>3</option>\n                  <option>4</option>\n                  <option>5</option>\n                </select>\n              </div>\n              <div class=\"input-group input-group-static\">\n                <label for=\"exampleFormControlSelect2\" class=\"ms-0\">Example multiple select</label>\n                <select multiple=\"\" class=\"form-control pb-4\" id=\"exampleFormControlSelect2\">\n                  <option>1</option>\n                  <option>2</option>\n                  <option>3</option>\n                  <option>4</option>\n                  <option>5</option>\n                </select>\n              </div>\n              <div class=\"input-group input-group-dynamic\">\n                <textarea class=\"form-control\" rows=\"5\" placeholder=\"Say a few words about who you are or what you're working on.\" spellcheck=\"false\"></textarea>\n              </div>\n            </form>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email address<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n     <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleFormControlSelect1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Example select<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n     <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>select</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleFormControlSelect1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n     <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>select</span><span class=\"token punctuation\">&gt;</span></span>\n   <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n   <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleFormControlSelect2<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Example multiple select<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>select</span> <span class=\"token attr-name\">multiple</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control pb-4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleFormControlSelect2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>option</span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>option</span><span class=\"token punctuation\">&gt;</span></span>\n       <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>select</span><span class=\"token punctuation\">&gt;</span></span>\n     <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-dynamic<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>textarea</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">rows</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>5<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Say a few words about who you are or what you're working on.<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">spellcheck</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>textarea</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"html5-inputs\">HTML5 inputs</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <form>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Text</label>\n                <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Search</label>\n                <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Email</label>\n                <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Url</label>\n                <input type=\"url\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Phone</label>\n                <input type=\"tel\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Password</label>\n                <input type=\"password\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-outline my-3\">\n                <label class=\"form-label\">Number</label>\n                <input type=\"number\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-static my-3\">\n                <label>Datetime</label>\n                <input type=\"datetime-local\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-static my-3\">\n                <label>Date</label>\n                <input type=\"date\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-static my-3\">\n                <label>Month</label>\n                <input type=\"month\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-static my-3\">\n                <label>Week</label>\n                <input type=\"week\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-static my-3\">\n                <label>Time</label>\n                <input type=\"time\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"input-group input-group-static my-3\">\n                <label>Color</label>\n                <input type=\"color\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n              <div class=\"form-group\">\n                <label for=\"example-color-input\" class=\"form-control-label\">Color</label>\n                <input class=\"form-control\" type=\"color\" value=\"#5e72e4\" id=\"example-color-input\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              </div>\n            </form>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Text<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Search<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email/label&gt;\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Url<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>url<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Phone<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tel<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Password<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>password<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Number<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>number<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span><span class=\"token punctuation\">&gt;</span></span>Datetime<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>datetime-local<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span><span class=\"token punctuation\">&gt;</span></span>Date<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>date<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span><span class=\"token punctuation\">&gt;</span></span>Month<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>month<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span><span class=\"token punctuation\">&gt;</span></span>Week<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>week<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span><span class=\"token punctuation\">&gt;</span></span>Time<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>time<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span><span class=\"token punctuation\">&gt;</span></span>Color<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>color<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>example-color-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Color<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>color<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">value</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#5e72e4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>example-color-input<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"custom-forms\">Custom forms</h2>\n          <p>For even more customization and cross browser consistency, use our completely custom form elements to replace the browser defaults. They’re built on top of semantic and accessible markup, so they’re solid replacements for any default form control.</p>\n          <h3 id=\"checkboxes\">Checkboxes</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"form-check\">\n              <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"fcustomCheck1\" checked=\"\">\n              <label class=\"custom-control-label\" for=\"customCheck1\">Check this custom checkbox</label>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>checkbox<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">value</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fcustomCheck1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">checked</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>custom-control-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customCheck1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Check this custom checkbox<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"radios\">Radios</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"form-check mb-3\">\n              <input class=\"form-check-input\" type=\"radio\" name=\"flexRadioDefault\" id=\"customRadio1\">\n              <label class=\"custom-control-label\" for=\"customRadio1\">Toggle this custom radio</label>\n            </div>\n            <div class=\"form-check\">\n              <input class=\"form-check-input\" type=\"radio\" name=\"flexRadioDefault\" id=\"customRadio2\">\n              <label class=\"custom-control-label\" for=\"customRadio2\">Or toggle this other custom radio</label>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>radio<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">name</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>flexRadioDefault<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customRadio1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>custom-control-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customRadio1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Toggle this custom radio<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>radio<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">name</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>flexRadioDefault<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customRadio2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>custom-control-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customRadio2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Or toggle this other custom radio<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"disabled\">Disabled</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"form-check\">\n              <input type=\"checkbox\" class=\"form-check-input\" id=\"customCheckDisabled\" disabled=\"\">\n              <label class=\"custom-control-label\" for=\"customCheckDisabled\">Check this custom checkbox</label>\n            </div>\n            <div class=\"form-check\">\n              <input type=\"radio\" id=\"customRadioDisabled\" name=\"radioDisabled\" class=\"form-check-input\" disabled=\"\">\n              <label class=\"custom-control-label\" for=\"customRadioDisabled\">Toggle this custom radio</label>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>checkbox<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customCheckDisabled<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>custom-control-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customCheckDisabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Check this custom checkbox<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>radio<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>radio3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">name</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>radioDisabled<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customRadioDisabled<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>custom-control-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>customRadioDisabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Toggle this custom radio<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"toggles\">Toggles</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"form-check form-switch\">\n              <input class=\"form-check-input\" type=\"checkbox\" id=\"flexSwitchCheckDefault\" checked=\"\">\n              <label class=\"form-check-label\" for=\"flexSwitchCheckDefault\">Checked switch</label>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check form-switch<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>checkbox<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>flexSwitchCheckDefault<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">checked</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>flexSwitchCheckDefault<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Checked switch<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/input-group.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Input Group | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#default\">Default</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#sizing\">Sizing</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Input Group\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"example\">Example</h2>\n          <h3 id=\"default\">Default</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"input-group input-group-dynamic mb-4\">\n              <span class=\"input-group-text\" id=\"basic-addon1\">@</span>\n              <input type=\"text\" class=\"form-control\" placeholder=\"Username\" aria-label=\"Username\" aria-describedby=\"basic-addon1\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n            </div>\n            <div class=\"input-group input-group-dynamic mb-4\">\n              <input type=\"text\" class=\"form-control\" placeholder=\"Recipient's username\" aria-label=\"Recipient's username\" aria-describedby=\"basic-addon2\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n              <span class=\"input-group-text\" id=\"basic-addon2\">@example.com</span>\n            </div>\n            <div class=\"input-group input-group-dynamic mb-4\">\n              <label class=\"form-label\" for=\"basic-url\">Your vanity URL</label>\n              <span class=\"input-group-text\" id=\"basic-addon3\">https://example.com/users/</span>\n              <input type=\"text\" class=\"form-control\" id=\"basic-url\" aria-describedby=\"basic-addon3\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n            </div>\n            <div class=\"input-group input-group-dynamic mb-4\">\n              <span class=\"input-group-text\">$</span>\n              <input type=\"text\" class=\"form-control\" aria-label=\"Amount (to the nearest dollar)\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-dynamic mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group-text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-addon1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>@<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Username<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Username<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-describedby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-addon1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-dynamic mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Recipient's username<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Recipient's username<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-describedby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-addon2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group-text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-addon2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>@example.com<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-dynamic mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-url<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Your vanity URL<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group-text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-addon3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>https://example.com/users/<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-url<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-describedby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>basic-addon3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocus</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>focused(this)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocusout</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>defocused(this)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-dynamic mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Amount (to the nearest dollar)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"sizing\">Sizing</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"input-group input-group-lg input-group-outline my-3\">\n              <label class=\"form-label\">Large</label>\n              <input type=\"text\" class=\"form-control form-control-lg\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n            </div>\n            <div class=\"input-group input-group-outline my-3\">\n              <label class=\"form-label\">Default</label>\n              <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n            </div>\n            <div class=\"input-group input-group-sm input-group-outline my-3\">\n              <label class=\"form-label\">Small</label>\n              <input type=\"text\" class=\"form-control form-control-sm\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-lg input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Large<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control form-control-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Default<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-sm input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Small<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control form-control-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/list-group.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      List Group | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#active-items\">Active items</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#links\">Links</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#with-badges\">With badges</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap List Group\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"examples\">Examples</h2>\n          <p>The most basic list group is an unordered list with list items and the proper classes. Build upon it with the options that follow, or with your own CSS as needed.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <ul class=\"list-group\">\n              <li class=\"list-group-item\">Cras justo odio</li>\n              <li class=\"list-group-item\">Dapibus ac facilisis in</li>\n              <li class=\"list-group-item\">Morbi leo risus</li>\n              <li class=\"list-group-item\">Porta ac consectetur ac</li>\n              <li class=\"list-group-item\">Vestibulum at eros</li>\n            </ul>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Cras justo odio<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Dapibus ac facilisis in<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Morbi leo risus<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Porta ac consectetur ac<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Vestibulum at eros<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"active-items\">Active items</h2>\n          <p>Add <code class=\" highlighter-rouge language-plaintext\">.active</code> to a <code class=\" highlighter-rouge language-plaintext\">.list-group-item</code> to indicate the current active selection.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <ul class=\"list-group\">\n              <li class=\"list-group-item active\">Cras justo odio</li>\n              <li class=\"list-group-item\">Dapibus ac facilisis in</li>\n              <li class=\"list-group-item\">Morbi leo risus</li>\n              <li class=\"list-group-item\">Porta ac consectetur ac</li>\n              <li class=\"list-group-item\">Vestibulum at eros</li>\n            </ul>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Cras justo odio<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Dapibus ac facilisis in<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Morbi leo risus<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Porta ac consectetur ac<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Vestibulum at eros<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"links\">Links</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"list-group\">\n              <a href=\"#\" class=\"list-group-item list-group-item-action active\">\n                Cras justo odio\n              </a>\n              <a href=\"#\" class=\"list-group-item list-group-item-action\">Dapibus ac facilisis in</a>\n              <a href=\"#\" class=\"list-group-item list-group-item-action\">Morbi leo risus</a>\n              <a href=\"#\" class=\"list-group-item list-group-item-action\">Porta ac consectetur ac</a>\n              <a href=\"#\" class=\"list-group-item list-group-item-action disabled\">Vestibulum at eros</a>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item list-group-item-action active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Cras justo odio\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item list-group-item-action<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Dapibus ac facilisis in<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item list-group-item-action<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Morbi leo risus<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item list-group-item-action<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Porta ac consectetur ac<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item list-group-item-action disabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Vestibulum at eros<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"with-badges\">With badges</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <ul class=\"list-group\">\n              <li class=\"list-group-item d-flex justify-content-between align-items-center\">\n                Cras justo odio\n                <span class=\"badge badge-primary badge-pill\">14</span>\n              </li>\n              <li class=\"list-group-item d-flex justify-content-between align-items-center\">\n                Dapibus ac facilisis in\n                <span class=\"badge badge-primary badge-pill\">2</span>\n              </li>\n              <li class=\"list-group-item d-flex justify-content-between align-items-center\">\n                Morbi leo risus\n                <span class=\"badge badge-primary badge-pill\">1</span>\n              </li>\n            </ul>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item d-flex justify-content-between align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Cras justo odio\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-primary badge-pill<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>14<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item d-flex justify-content-between align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Dapibus ac facilisis in\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-primary badge-pill<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-group-item d-flex justify-content-between align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Morbi leo risus\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-primary badge-pill<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/modal.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Modal | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#exampleModalLabel\">Modal title</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#variations\">Variations</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#modal-title-default\">Type your modal title</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#modal-title-notification\">Your attention is required</a></li>\n                <li class=\"toc-entry toc-h4\"><a href=\"#you-should-read-this\">You should read this!</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#welcome-back\">Welcome back</a></li>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#exampleModalLongTitle\">Modal title</a>\n                      <ul>\n                        <li class=\"toc-entry toc-h6\"><a href=\"#exampleModalLabel\">New message to Creative Tim</a></li>\n                      </ul>\n                    </li>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#join-us\">Join Us</a></li>\n                  </ul>\n                </li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Modal\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap modals are lightweight and multi-purpose popups that are built with HTML, CSS, and JavaScript. The three primary sections of a Bootstrap modal are header, body, and footer. Modals are positioned over everything else in the document and remove scroll from the &lt;body&gt; so that modal content scrolls instead. Use Bootstrap’s JavaScript modal plugin to add dialogues to your site for lightboxes, user notifications, or completely custom content.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>Keep reading our Bootstrap Modal examples and learn how to use it.</p>\n          <h2 id=\"example\">Example</h2>\n          <!-- Button trigger modal -->\n          <p><button type=\"button\" class=\"btn bg-gradient-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#exampleModal\">\n              Launch demo modal\n            </button></p>\n          <!-- Modal -->\n          <div class=\"modal fade\" id=\"exampleModal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"exampleModalLabel\" aria-hidden=\"true\">\n            <div class=\"modal-dialog modal-dialog-centered\" role=\"document\">\n              <div class=\"modal-content\">\n                <div class=\"modal-header\">\n                  <h6 class=\"modal-title font-weight-normal\" id=\"exampleModalLabel\">Modal title</h6>\n                  <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">×</span>\n                  </button>\n                </div>\n                <div class=\"modal-body\">\n                  ...\n                </div>\n                <div class=\"modal-footer\">\n                  <button type=\"button\" class=\"btn bg-gradient-secondary\" data-bs-dismiss=\"modal\">Close</button>\n                  <button type=\"button\" class=\"btn bg-gradient-primary\">Save changes</button>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token comment\">&lt;!-- Button trigger modal --&gt;</span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#exampleModal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Launch demo modal\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token comment\">&lt;!-- Modal --&gt;</span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalLabel<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog modal-dialog-centered<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>document<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-header<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-title font-weight-normal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalLabel<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Modal title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        ...\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-footer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Close<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Save changes<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"variations\">Variations</h2>\n          <div class=\"f-flex\">\n            <div class=\"me-2\">\n              <button type=\"button\" class=\"btn btn-block bg-gradient-primary mb-3\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-default\">Default</button>\n              <div class=\"modal fade\" id=\"modal-default\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"modal-default\" aria-hidden=\"true\">\n                <div class=\"modal-dialog modal- modal-dialog-centered modal-\" role=\"document\">\n                  <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                      <h6 class=\"modal-title font-weight-normal\" id=\"modal-title-default\">Type your modal title</h6>\n                      <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\">\n                        <span aria-hidden=\"true\">×</span>\n                      </button>\n                    </div>\n                    <div class=\"modal-body\">\n                      <p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p>\n                      <p>A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p>\n                    </div>\n                    <div class=\"modal-footer\">\n                      <button type=\"button\" class=\"btn bg-gradient-primary\">Save changes</button>\n                      <button type=\"button\" class=\"btn btn-link  ml-auto\" data-bs-dismiss=\"modal\">Close</button>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"me-2\">\n              <button type=\"button\" class=\"btn btn-block bg-gradient-warning mb-3\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-notification\">Notification</button>\n              <div class=\"modal fade\" id=\"modal-notification\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"modal-notification\" aria-hidden=\"true\">\n                <div class=\"modal-dialog modal-danger modal-dialog-centered modal-\" role=\"document\">\n                  <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                      <h6 class=\"modal-title font-weight-normal\" id=\"modal-title-notification\">Your attention is required</h6>\n                      <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\">\n                        <span aria-hidden=\"true\">×</span>\n                      </button>\n                    </div>\n                    <div class=\"modal-body\">\n                      <div class=\"py-3 text-center\">\n                        <i class=\"material-icons h1 text-secondary\">\n                notifications_active\n              </i>\n                        <h4 class=\"text-gradient text-danger mt-4\">You should read this!</h4>\n                        <p>A small river named Duden flows by their place and supplies it with the necessary regelialia.</p>\n                      </div>\n                    </div>\n                    <div class=\"modal-footer\">\n                      <button type=\"button\" class=\"btn btn-secondary\">Ok, Got it</button>\n                      <button type=\"button\" class=\"btn btn-link ml-auto\" data-bs-dismiss=\"modal\">Close</button>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"me-2\">\n              <button type=\"button\" class=\"btn btn-block btn-light mb-3\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-form\">Form</button>\n              <div class=\"modal fade\" id=\"modal-form\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"modal-form\" aria-hidden=\"true\">\n                <div class=\"modal-dialog modal-dialog-centered modal-sm\" role=\"document\">\n                  <div class=\"modal-content\">\n                    <div class=\"modal-body p-0\">\n                      <div class=\"card card-plain\">\n                        <div class=\"card-header pb-0 text-left\">\n                          <h5 class=\"\">Welcome back</h5>\n                          <p class=\"mb-0\">Enter your email and password to sign in</p>\n                        </div>\n                        <div class=\"card-body\">\n                          <form role=\"form text-left\">\n                            <div class=\"input-group input-group-outline my-3\">\n                              <label class=\"form-label\">Email</label>\n                              <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                            </div>\n                            <div class=\"input-group input-group-outline my-3\">\n                              <label class=\"form-label\">Password</label>\n                              <input type=\"password\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                            </div>\n                            <div class=\"form-check form-switch d-flex align-items-center\">\n                              <input class=\"form-check-input\" type=\"checkbox\" id=\"rememberMe\" checked=\"\">\n                              <label class=\"form-check-label mb-0 ms-3\" for=\"rememberMe\">Remember me</label>\n                            </div>\n                            <div class=\"text-center\">\n                              <button type=\"button\" class=\"btn btn-round bg-gradient-info btn-lg w-100 mt-4 mb-0\">Sign in</button>\n                            </div>\n                          </form>\n                        </div>\n                        <div class=\"card-footer text-center pt-0 px-lg-2 px-1\">\n                          <p class=\"mb-4 text-sm mx-auto\">\n                            Don't have an account?\n                            <a href=\"javascript:;\" class=\"text-info text-gradient font-weight-bold\">Sign up</a>\n                          </p>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"me-2\">\n            <!-- Button trigger modal -->\n            <button type=\"button\" class=\"btn bg-gradient-danger btn-block mb-3\" data-bs-toggle=\"modal\" data-bs-target=\"#exampleModalLong\">\n              Long Modal\n            </button>\n            <!-- Modal -->\n            <div class=\"modal fade\" id=\"exampleModalLong\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"exampleModalLongTitle\" aria-hidden=\"true\">\n              <div class=\"modal-dialog\" role=\"document\">\n                <div class=\"modal-content\">\n                  <div class=\"modal-header\">\n                    <h5 class=\"modal-title font-weight-normal\" id=\"exampleModalLongTitle\">Modal title</h5>\n                    <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\">\n                      <span aria-hidden=\"true\">×</span>\n                    </button>\n                  </div>\n                  <div class=\"modal-body font-weight-light\">\n                    I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They're slowed down by their perception of themselves. If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.\n                    <br><br>\n                    As we live, our hearts turn colder. Cause pain is what we go through as we become older. We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand. We get our heart broken by people we love, even that we give them all we have. Then we lose family over time. What else could rust the heart more over time? Blackgold.\n                    <br><br>\n                    We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.\n                    <br><br>\n                    There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill. I’m not really specifically talented at anything except for the ability to learn. That’s what I do. That’s what I’m here for. Don’t be afraid to be wrong because you can’t learn anything from a compliment.\n                    <br><br>\n                    It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter. Because it's about motivating the doers. Because I’m here to follow my dreams and inspire other people to follow their dreams, too.\n                    <br><br>\n                    The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For standing out. But the time is now to be okay to be the greatest you. Would you believe in what you believe in, if you were the only one who believed it?\n                  </div>\n                  <div class=\"modal-footer\">\n                    <button type=\"button\" class=\"btn bg-gradient-secondary\" data-bs-dismiss=\"modal\">Close</button>\n                    <button type=\"button\" class=\"btn bg-gradient-primary\">Save changes</button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"me-2\">\n            <!-- Button trigger modal -->\n            <button type=\"button\" class=\"btn bg-gradient-success btn-block mb-3\" data-bs-toggle=\"modal\" data-bs-target=\"#exampleModalMessage\">\n              Message Modal\n            </button>\n            <!-- Modal -->\n            <div class=\"modal fade\" id=\"exampleModalMessage\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"exampleModalMessageTitle\" aria-hidden=\"true\">\n              <div class=\"modal-dialog modal-dialog-centered\" role=\"document\">\n                <div class=\"modal-content\">\n                  <div class=\"modal-header\">\n                    <h6 class=\"modal-title font-weight-normal\" id=\"exampleModalLabel\">New message to Creative Tim</h6>\n                    <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Close\">\n                      <span aria-hidden=\"true\">×</span>\n                    </button>\n                  </div>\n                  <div class=\"modal-body\">\n                    <form>\n                      <div class=\"input-group input-group-dynamic\">\n                        <label class=\"form-label\">Recipient</label>\n                        <input class=\"form-control\" type=\"text\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                      </div>\n                      <div class=\"input-group input-group-dynamic\">\n                        <textarea class=\"form-control\" rows=\"5\" placeholder=\"Say a few words.\" spellcheck=\"false\"></textarea>\n                      </div>\n                    </form>\n                  </div>\n                  <div class=\"modal-footer\">\n                    <button type=\"button\" class=\"btn bg-gradient-secondary\" data-bs-dismiss=\"modal\">Close</button>\n                    <button type=\"button\" class=\"btn bg-gradient-primary\">Send message</button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"me-2\">\n            <!-- Button trigger modal -->\n            <button type=\"button\" class=\"btn bg-gradient-info btn-block\" data-bs-toggle=\"modal\" data-bs-target=\"#exampleModalSignUp\">\n              SignUp Modal\n            </button>\n            <!-- Modal -->\n            <div class=\"modal fade\" id=\"exampleModalSignUp\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"exampleModalSignTitle\" aria-hidden=\"true\">\n              <div class=\"modal-dialog modal-dialog-centered modal-sm\" role=\"document\">\n                <div class=\"modal-content\">\n                  <div class=\"modal-body p-0\">\n                    <div class=\"card card-plain\">\n                      <div class=\"card-header pb-0 text-left\">\n                        <h5 class=\"\">Join Us</h5>\n                        <p class=\"mb-0\">Enter your email and password to register</p>\n                      </div>\n                      <div class=\"card-body pb-3\">\n                        <form role=\"form text-left\">\n                          <div class=\"input-group input-group-outline my-3\">\n                            <label class=\"form-label\">Name</label>\n                            <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                          </div>\n                          <div class=\"input-group input-group-outline my-3\">\n                            <label class=\"form-label\">Email</label>\n                            <input type=\"email\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                          </div>\n                          <div class=\"input-group input-group-outline my-3\">\n                            <label class=\"form-label\">Password</label>\n                            <input type=\"password\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                          </div>\n                          <div class=\"form-check form-check-info text-left\">\n                            <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckDefault\" checked=\"\">\n                            <label class=\"form-check-label\" for=\"flexCheckDefault\">\n                              I agree the <a href=\"javascrpt:;\" class=\"text-dark font-weight-bolder\">Terms and Conditions</a>\n                            </label>\n                          </div>\n                          <div class=\"text-center\">\n                            <button type=\"button\" class=\"btn bg-gradient-primary btn-lg btn-rounded w-100 mt-4 mb-0\">Sign up</button>\n                          </div>\n                        </form>\n                      </div>\n                      <div class=\"card-footer text-center pt-0 px-sm-4 px-1\">\n                        <p class=\"mb-4 mx-auto\">\n                          Already have an account?\n                          <a href=\"javascrpt:;\" class=\"text-primary text-gradient font-weight-bold\">Sign in</a>\n                        </p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-block bg-gradient-primary mb-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#modal-default<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Default<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-default<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-default<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog modal- modal-dialog-centered modal-<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>document<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-header<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-title font-weight-normal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-title-default<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Type your modal title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>×<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-footer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Save changes<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link  ml-auto<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Close<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-block bg-gradient-warning mb-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#modal-notification<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Notification<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-notification<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-notification<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog modal-danger modal-dialog-centered modal-<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>document<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-header<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-title font-weight-normal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-title-notification<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Your attention is required<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>×<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>py-3 text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons h1 text-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                notifications_active\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-gradient text-danger mt-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>You should read this!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>A small river named Duden flows by their place and supplies it with the necessary regelialia.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-footer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Ok, Got it<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-white ml-auto<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Close<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-block btn-light mb-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#modal-form<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Form<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-form<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-form<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog modal-dialog-centered modal-sm<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>document<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-plain<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header pb-0 text-left<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Welcome back<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Enter your email and password to sign in<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form text-left<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocus</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>focused(this)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocusout</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>defocused(this)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Password<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>password<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocus</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>focused(this)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocusout</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>defocused(this)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check form-switch d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>checkbox<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>rememberMe<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">checked</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-label mb-0 ms-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>rememberMe<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Remember me<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-round bg-gradient-info btn-lg w-100 mt-4 mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Sign in<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-footer text-center pt-0 px-lg-2 px-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-4 text-sm mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  Don't have an account?\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-info text-gradient font-weight-bold<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Sign up<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token comment\">&lt;!-- Button trigger modal --&gt;</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-danger btn-block mb-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#exampleModalLong<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      Long Modal\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token comment\">&lt;!-- Modal --&gt;</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalLong<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalLongTitle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>document<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-header<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-title font-weight-normal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalLongTitle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Modal title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-body font-weight-light<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They're slowed down by their perception of themselves. If you're taught you can’t do anything, you won’t do anything. I was taught I could do everything.\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span>\n            As we live, our hearts turn colder. Cause pain is what we go through as we become older. We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand. We get our heart broken by people we love, even that we give them all we have. Then we lose family over time. What else could rust the heart more over time? Blackgold.\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span>\n\n\n            We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span>\n\n\n            There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill. I’m not really specifically talented at anything except for the ability to learn. That’s what I do. That’s what I’m here for. Don’t be afraid to be wrong because you can’t learn anything from a compliment.\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span>\n\n            It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter. Because it's about motivating the doers. Because I’m here to follow my dreams and inspire other people to follow their dreams, too.\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>br</span><span class=\"token punctuation\">/&gt;</span></span>\n\n            The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For standing out. But the time is now to be okay to be the greatest you. Would you believe in what you believe in, if you were the only one who believed it?\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-footer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Close<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Save changes<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token comment\">&lt;!-- Button trigger modal --&gt;</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-success btn-block mb-3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#exampleModalMessage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      Message Modal\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token comment\">&lt;!-- Modal --&gt;</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalMessage<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalMessageTitle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog modal-dialog-centered<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>document<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-header<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-title font-weight-normal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalLabel<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>New message to Creative Tim<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>×<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Recipient<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-dynamic<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>textarea</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>multisteps-form__textarea form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">rows</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>5<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Say a few words.<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">spellcheck</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-footer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Close<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Send message<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token comment\">&lt;!-- Button trigger modal --&gt;</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-info btn-block<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#exampleModalSignUp<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      SignUp Modal\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n    <span class=\"token comment\">&lt;!-- Modal --&gt;</span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalSignUp<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>exampleModalSignTitle<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog modal-dialog-centered modal-sm<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>document<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-plain<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-header pb-0 text-left<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Join Us<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Enter your email and password to register<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body pb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>form</span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form text-left<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Name<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Email<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>email<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline my-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Password<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>password<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check form-check-info text-left<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-input<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>checkbox<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">value</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>flexCheckDefault<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">checked</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-check-label<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">for</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>flexCheckDefault<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      I agree the <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascrpt:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark font-weight-bolder<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Terms and Conditions<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary btn-lg btn-rounded w-100 mt-4 mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Sign up<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>form</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-footer text-center pt-0 px-sm-4 px-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-4 mx-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  Already have an account?\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascrpt:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-primary text-gradient font-weight-bold<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Sign in<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/navbar.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Navbar | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#menu\">Menu</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#new-user\">New User</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------new-message-from-laur------------------------\">\n                    New message from Laur\n                  </a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------new-album-by-travis-scott------------------------\">\n                    New album by Travis Scott\n                  </a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------payment-successfully-completed------------------------\">\n                    Payment successfully completed\n                  </a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#new-user-1\">New User</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------new-message-from-laur-------------------------1\">\n                    New message from Laur\n                  </a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------new-album-by-travis-scott-------------------------1\">\n                    New album by Travis Scott\n                  </a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------payment-successfully-completed-------------------------1\">\n                    Payment successfully completed\n                  </a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#new-user-2\">New User</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------new-message-from-laur-------------------------2\">\n                    New message from Laur\n                  </a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------new-album-by-travis-scott-------------------------2\">\n                    New album by Travis Scott\n                  </a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#--------------------------payment-successfully-completed-------------------------2\">\n                    Payment successfully completed\n                  </a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Navbar\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">A Bootstrap Navbar is a navigation header that is placed at the top of the page. It can extend or collapse, depending on the screen size. A standard navigation bar is created with <code>&lt;nav class=\"navbar navbar-default\"&gt;</code>. Check this documentation and examples for Bootstrap’s powerful, responsive navigation header, the navbar. Includes support for branding, navigation, and more, including support for our collapse plugin.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"menu\">Menu</h2>\n          <div class=\"py-5\">\n            <nav class=\"navbar navbar-main navbar-expand-lg position-sticky mt-4 top-1 px-0 mx-4 shadow-none border-radius-xl z-index-sticky\" id=\"navbarBlur\" data-scroll=\"true\">\n              <div class=\"container-fluid py-1 px-3\">\n                <nav aria-label=\"breadcrumb\">\n                  <ol class=\"breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5\">\n                    <li class=\"breadcrumb-item text-sm\">\n                      <a class=\"opacity-3 text-dark\" href=\"javascript:;\">\n                        <svg width=\"12px\" height=\"12px\" class=\"mb-1\" viewBox=\"0 0 45 40\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                          <title>shop </title>\n                          <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                            <g transform=\"translate(-1716.000000, -439.000000)\" fill=\"#252f40\" fill-rule=\"nonzero\">\n                              <g transform=\"translate(1716.000000, 291.000000)\">\n                                <g transform=\"translate(0.000000, 148.000000)\">\n                                  <path d=\"M46.7199583,10.7414583 L40.8449583,0.949791667 C40.4909749,0.360605034 39.8540131,0 39.1666667,0 L7.83333333,0 C7.1459869,0 6.50902508,0.360605034 6.15504167,0.949791667 L0.280041667,10.7414583 C0.0969176761,11.0460037 -1.23209662e-05,11.3946378 -1.23209662e-05,11.75 C-0.00758042603,16.0663731 3.48367543,19.5725301 7.80004167,19.5833333 L7.81570833,19.5833333 C9.75003686,19.5882688 11.6168794,18.8726691 13.0522917,17.5760417 C16.0171492,20.2556967 20.5292675,20.2556967 23.494125,17.5760417 C26.4604562,20.2616016 30.9794188,20.2616016 33.94575,17.5760417 C36.2421905,19.6477597 39.5441143,20.1708521 42.3684437,18.9103691 C45.1927731,17.649886 47.0084685,14.8428276 47.0000295,11.75 C47.0000295,11.3946378 46.9030823,11.0460037 46.7199583,10.7414583 Z\"></path>\n                                  <path d=\"M39.198,22.4912623 C37.3776246,22.4928106 35.5817531,22.0149171 33.951625,21.0951667 L33.92225,21.1107282 C31.1430221,22.6838032 27.9255001,22.9318916 24.9844167,21.7998837 C24.4750389,21.605469 23.9777983,21.3722567 23.4960833,21.1018359 L23.4745417,21.1129513 C20.6961809,22.6871153 17.4786145,22.9344611 14.5386667,21.7998837 C14.029926,21.6054643 13.533337,21.3722507 13.0522917,21.1018359 C11.4250962,22.0190609 9.63246555,22.4947009 7.81570833,22.4912623 C7.16510551,22.4842162 6.51607673,22.4173045 5.875,22.2911849 L5.875,44.7220845 C5.875,45.9498589 6.7517757,46.9451667 7.83333333,46.9451667 L19.5833333,46.9451667 L19.5833333,33.6066734 L27.4166667,33.6066734 L27.4166667,46.9451667 L39.1666667,46.9451667 C40.2482243,46.9451667 41.125,45.9498589 41.125,44.7220845 L41.125,22.2822926 C40.4887822,22.4116582 39.8442868,22.4815492 39.198,22.4912623 Z\"></path>\n                                </g>\n                              </g>\n                            </g>\n                          </g>\n                        </svg>\n                      </a>\n                    </li>\n                    <li class=\"breadcrumb-item text-sm\"><a class=\"opacity-5 text-dark\" href=\"javascript:;\">Pages</a></li>\n                    <li class=\"breadcrumb-item text-sm text-dark active\" aria-current=\"page\">New User</li>\n                  </ol>\n                  <h6 class=\"font-weight-bolder mb-0\">New User</h6>\n                </nav>\n                <div class=\"sidenav-toggler sidenav-toggler-inner d-xl-block d-none \">\n                  <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                    <div class=\"sidenav-toggler-inner\">\n                      <i class=\"sidenav-toggler-line\"></i>\n                      <i class=\"sidenav-toggler-line\"></i>\n                      <i class=\"sidenav-toggler-line\"></i>\n                    </div>\n                  </a>\n                </div>\n                <div class=\"collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4\" id=\"navbar\">\n                  <div class=\"ms-md-auto pe-md-3 d-flex align-items-center\">\n                    <div class=\"input-group input-group-outline\">\n                      <label class=\"form-label\">Search here</label>\n                      <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                    </div>\n                  </div>\n                  <ul class=\"navbar-nav  justify-content-end\">\n                    <li class=\"nav-item\">\n                      <a href=\"javascript:;\" class=\"nav-link text-body p-0 position-relative\">\n                        <i class=\"material-icons me-sm-1\">\n              account_circle\n            </i>\n                      </a>\n                    </li>\n                    <li class=\"nav-item d-xl-none ps-3 d-flex align-items-center\">\n                      <a href=\"javascript:;\" class=\"nav-link text-body p-0\" id=\"iconNavbarSidenav\">\n                        <div class=\"sidenav-toggler-inner\">\n                          <i class=\"sidenav-toggler-line\"></i>\n                          <i class=\"sidenav-toggler-line\"></i>\n                          <i class=\"sidenav-toggler-line\"></i>\n                        </div>\n                      </a>\n                    </li>\n                    <li class=\"nav-item px-3\">\n                      <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                        <i class=\"material-icons fixed-plugin-button-nav cursor-pointer\">\n              settings\n            </i>\n                      </a>\n                    </li>\n                    <li class=\"nav-item dropdown pe-2\">\n                      <a href=\"javascript:;\" class=\"nav-link text-body p-0 position-relative\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                        <i class=\"material-icons cursor-pointer\">\n              notifications\n            </i>\n                        <span class=\"position-absolute top-5 start-100 translate-middle badge rounded-pill bg-danger border border-white small py-1 px-2\">\n                          <span class=\"small\">11</span>\n                          <span class=\"visually-hidden\">unread notifications</span>\n                        </span>\n                      </a>\n                      <ul class=\"dropdown-menu dropdown-menu-end p-2 me-sm-n4\" aria-labelledby=\"dropdownMenuButton\">\n                        <li class=\"mb-2\">\n                          <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                            <div class=\"d-flex align-items-center py-1\">\n                              <div class=\"my-auto\">\n                                <span class=\"material-icons\">\n                                  email\n                                </span>\n                              </div>\n                              <div class=\"ms-2\">\n                                <h6 class=\"text-sm font-weight-normal mb-0\">\n                                  New message from Laur\n                                </h6>\n                              </div>\n                            </div>\n                          </a>\n                        </li>\n                        <li class=\"mb-2\">\n                          <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                            <div class=\"d-flex align-items-center py-1\">\n                              <div class=\"my-auto\">\n                                <span class=\"material-icons\">\n                                  headphones\n                                </span>\n                              </div>\n                              <div class=\"ms-2\">\n                                <h6 class=\"text-sm font-weight-normal mb-0\">\n                                  New album by Travis Scott\n                                </h6>\n                              </div>\n                            </div>\n                          </a>\n                        </li>\n                        <li>\n                          <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                            <div class=\"d-flex align-items-center py-1\">\n                              <div class=\"my-auto\">\n                                <span class=\"material-icons\">\n                                  shopping_cart\n                                </span>\n                              </div>\n                              <div class=\"ms-2\">\n                                <h6 class=\"text-sm font-weight-normal mb-0\">\n                                  Payment successfully completed\n                                </h6>\n                              </div>\n                            </div>\n                          </a>\n                        </li>\n                      </ul>\n                    </li>\n                  </ul>\n                </div>\n              </div>\n            </nav>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar navbar-main navbar-expand-lg position-sticky mt-4 top-1 px-0 mx-4 shadow-none border-radius-xl z-index-sticky<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbarBlur<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-scroll</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container-fluid py-1 px-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ol</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>opacity-3 text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>svg</span> <span class=\"token attr-name\">width</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>12px<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>12px<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">viewBox</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0 0 45 40<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">version</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>1.1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">xmlns</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>http://www.w3.org/2000/svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\"><span class=\"token namespace\">xmlns:</span>xlink</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>http://www.w3.org/1999/xlink<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>title</span><span class=\"token punctuation\">&gt;</span></span>shop <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>title</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">stroke</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>none<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">stroke-width</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>none<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill-rule</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>evenodd<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(-1716.000000, -439.000000)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#252f40<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill-rule</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nonzero<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(1716.000000, 291.000000)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(0.000000, 148.000000)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>path</span> <span class=\"token attr-name\">d</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>M46.7199583,10.7414583 L40.8449583,0.949791667 C40.4909749,0.360605034 39.8540131,0 39.1666667,0 L7.83333333,0 C7.1459869,0 6.50902508,0.360605034 6.15504167,0.949791667 L0.280041667,10.7414583 C0.0969176761,11.0460037 -1.23209662e-05,11.3946378 -1.23209662e-05,11.75 C-0.00758042603,16.0663731 3.48367543,19.5725301 7.80004167,19.5833333 L7.81570833,19.5833333 C9.75003686,19.5882688 11.6168794,18.8726691 13.0522917,17.5760417 C16.0171492,20.2556967 20.5292675,20.2556967 23.494125,17.5760417 C26.4604562,20.2616016 30.9794188,20.2616016 33.94575,17.5760417 C36.2421905,19.6477597 39.5441143,20.1708521 42.3684437,18.9103691 C45.1927731,17.649886 47.0084685,14.8428276 47.0000295,11.75 C47.0000295,11.3946378 46.9030823,11.0460037 46.7199583,10.7414583 Z<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>path</span><span class=\"token punctuation\">&gt;</span></span>\n                          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>path</span> <span class=\"token attr-name\">d</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>M39.198,22.4912623 C37.3776246,22.4928106 35.5817531,22.0149171 33.951625,21.0951667 L33.92225,21.1107282 C31.1430221,22.6838032 27.9255001,22.9318916 24.9844167,21.7998837 C24.4750389,21.605469 23.9777983,21.3722567 23.4960833,21.1018359 L23.4745417,21.1129513 C20.6961809,22.6871153 17.4786145,22.9344611 14.5386667,21.7998837 C14.029926,21.6054643 13.533337,21.3722507 13.0522917,21.1018359 C11.4250962,22.0190609 9.63246555,22.4947009 7.81570833,22.4912623 C7.16510551,22.4842162 6.51607673,22.4173045 5.875,22.2911849 L5.875,44.7220845 C5.875,45.9498589 6.7517757,46.9451667 7.83333333,46.9451667 L19.5833333,46.9451667 L19.5833333,33.6066734 L27.4166667,33.6066734 L27.4166667,46.9451667 L39.1666667,46.9451667 C40.2482243,46.9451667 41.125,45.9498589 41.125,44.7220845 L41.125,22.2822926 C40.4887822,22.4116582 39.8442868,22.4815492 39.198,22.4912623 Z<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>path</span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>svg</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>opacity-5 text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Pages<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm text-dark active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-current</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>New User<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ol</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bolder mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>New User<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler sidenav-toggler-inner d-xl-block d-none <span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-inner<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-md-auto pe-md-3 d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Search here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocus</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>focused(this)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocusout</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>defocused(this)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar-nav  justify-content-end<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0 position-relative<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons me-sm-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              account_circle\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item d-xl-none ps-3 d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>iconNavbarSidenav<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-inner<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item px-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons fixed-plugin-button-nav cursor-pointer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              settings\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item dropdown pe-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0 position-relative<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons cursor-pointer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              notifications\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>position-absolute top-5 start-100 translate-middle badge rounded-pill bg-danger border border-white small py-1 px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>small<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>11<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>visually-hidden<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>unread notifications<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu dropdown-menu-end p-2 me-sm-n4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          email\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          New message from Laur\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          headphones\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          New album by Travis Scott\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          shopping_cart\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          Payment successfully completed\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"examples\">Examples</h2>\n          <nav class=\"navbar navbar-main bg-gradient-dark navbar-expand-lg position-sticky mt-4 top-1 px-0 mx-4 shadow-none border-radius-xl z-index-sticky\" id=\"navbarBlur\" data-scroll=\"true\">\n            <div class=\"container-fluid py-1 px-3\">\n              <nav aria-label=\"breadcrumb\">\n                <ol class=\"breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5\">\n                  <li class=\"breadcrumb-item text-sm\">\n                    <a class=\"opacity-3 text-dark\" href=\"javascript:;\">\n                      <svg width=\"12px\" height=\"12px\" class=\"mb-1 text-white\" viewBox=\"0 0 45 40\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                        <title>shop </title>\n                        <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                          <g transform=\"translate(-1716.000000, -439.000000)\" fill=\"#fff\" fill-rule=\"nonzero\">\n                            <g transform=\"translate(1716.000000, 291.000000)\">\n                              <g transform=\"translate(0.000000, 148.000000)\">\n                                <path d=\"M46.7199583,10.7414583 L40.8449583,0.949791667 C40.4909749,0.360605034 39.8540131,0 39.1666667,0 L7.83333333,0 C7.1459869,0 6.50902508,0.360605034 6.15504167,0.949791667 L0.280041667,10.7414583 C0.0969176761,11.0460037 -1.23209662e-05,11.3946378 -1.23209662e-05,11.75 C-0.00758042603,16.0663731 3.48367543,19.5725301 7.80004167,19.5833333 L7.81570833,19.5833333 C9.75003686,19.5882688 11.6168794,18.8726691 13.0522917,17.5760417 C16.0171492,20.2556967 20.5292675,20.2556967 23.494125,17.5760417 C26.4604562,20.2616016 30.9794188,20.2616016 33.94575,17.5760417 C36.2421905,19.6477597 39.5441143,20.1708521 42.3684437,18.9103691 C45.1927731,17.649886 47.0084685,14.8428276 47.0000295,11.75 C47.0000295,11.3946378 46.9030823,11.0460037 46.7199583,10.7414583 Z\"></path>\n                                <path d=\"M39.198,22.4912623 C37.3776246,22.4928106 35.5817531,22.0149171 33.951625,21.0951667 L33.92225,21.1107282 C31.1430221,22.6838032 27.9255001,22.9318916 24.9844167,21.7998837 C24.4750389,21.605469 23.9777983,21.3722567 23.4960833,21.1018359 L23.4745417,21.1129513 C20.6961809,22.6871153 17.4786145,22.9344611 14.5386667,21.7998837 C14.029926,21.6054643 13.533337,21.3722507 13.0522917,21.1018359 C11.4250962,22.0190609 9.63246555,22.4947009 7.81570833,22.4912623 C7.16510551,22.4842162 6.51607673,22.4173045 5.875,22.2911849 L5.875,44.7220845 C5.875,45.9498589 6.7517757,46.9451667 7.83333333,46.9451667 L19.5833333,46.9451667 L19.5833333,33.6066734 L27.4166667,33.6066734 L27.4166667,46.9451667 L39.1666667,46.9451667 C40.2482243,46.9451667 41.125,45.9498589 41.125,44.7220845 L41.125,22.2822926 C40.4887822,22.4116582 39.8442868,22.4815492 39.198,22.4912623 Z\"></path>\n                              </g>\n                            </g>\n                          </g>\n                        </g>\n                      </svg>\n                    </a>\n                  </li>\n                  <li class=\"breadcrumb-item text-sm\"><a class=\"opacity-7 text-white\" href=\"javascript:;\">Pages</a></li>\n                  <li class=\"breadcrumb-item text-sm text-white active\" aria-current=\"page\">New User</li>\n                </ol>\n                <h6 class=\"font-weight-bolder text-white mb-0\">New User</h6>\n              </nav>\n              <div class=\"sidenav-toggler sidenav-toggler-inner d-xl-block d-none \">\n                <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                  <div class=\"sidenav-toggler-inner text-white\">\n                    <i class=\"sidenav-toggler-line bg-white\"></i>\n                    <i class=\"sidenav-toggler-line bg-white\"></i>\n                    <i class=\"sidenav-toggler-line bg-white\"></i>\n                  </div>\n                </a>\n              </div>\n              <div class=\"collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4\" id=\"navbar\">\n                <div class=\"ms-md-auto pe-md-3 d-flex align-items-center\">\n                  <div class=\"input-group input-group-outline\">\n                    <label class=\"form-label\">Search here</label>\n                    <input type=\"text\" class=\"form-control text-white\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                </div>\n                <ul class=\"navbar-nav  justify-content-end\">\n                  <li class=\"nav-item\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0 position-relative\">\n                      <i class=\"material-icons me-sm-1 text-white\">\n              account_circle\n            </i>\n                    </a>\n                  </li>\n                  <li class=\"nav-item d-xl-none ps-3 d-flex align-items-center\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0\" id=\"iconNavbarSidenav\">\n                      <div class=\"sidenav-toggler-inner\">\n                        <i class=\"sidenav-toggler-line\"></i>\n                        <i class=\"sidenav-toggler-line\"></i>\n                        <i class=\"sidenav-toggler-line\"></i>\n                      </div>\n                    </a>\n                  </li>\n                  <li class=\"nav-item px-3\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                      <i class=\"material-icons fixed-plugin-button-nav cursor-pointer text-white\">\n              settings\n            </i>\n                    </a>\n                  </li>\n                  <li class=\"nav-item dropdown pe-2\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0 position-relative\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                      <i class=\"material-icons cursor-pointer text-white\">\n              notifications\n            </i>\n                      <span class=\"position-absolute top-5 start-100 translate-middle badge rounded-pill bg-danger border border-white small py-1 px-2\">\n                        <span class=\"small\">11</span>\n                        <span class=\"visually-hidden\">unread notifications</span>\n                      </span>\n                    </a>\n                    <ul class=\"dropdown-menu dropdown-menu-end p-2 me-sm-n4\" aria-labelledby=\"dropdownMenuButton\">\n                      <li class=\"mb-2\">\n                        <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                          <div class=\"d-flex align-items-center py-1\">\n                            <div class=\"my-auto\">\n                              <span class=\"material-icons\">\n                                email\n                              </span>\n                            </div>\n                            <div class=\"ms-2\">\n                              <h6 class=\"text-sm font-weight-normal mb-0\">\n                                New message from Laur\n                              </h6>\n                            </div>\n                          </div>\n                        </a>\n                      </li>\n                      <li class=\"mb-2\">\n                        <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                          <div class=\"d-flex align-items-center py-1\">\n                            <div class=\"my-auto\">\n                              <span class=\"material-icons\">\n                                headphones\n                              </span>\n                            </div>\n                            <div class=\"ms-2\">\n                              <h6 class=\"text-sm font-weight-normal mb-0\">\n                                New album by Travis Scott\n                              </h6>\n                            </div>\n                          </div>\n                        </a>\n                      </li>\n                      <li>\n                        <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                          <div class=\"d-flex align-items-center py-1\">\n                            <div class=\"my-auto\">\n                              <span class=\"material-icons\">\n                                shopping_cart\n                              </span>\n                            </div>\n                            <div class=\"ms-2\">\n                              <h6 class=\"text-sm font-weight-normal mb-0\">\n                                Payment successfully completed\n                              </h6>\n                            </div>\n                          </div>\n                        </a>\n                      </li>\n                    </ul>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </nav>\n          <p><br></p>\n          <nav class=\"navbar navbar-main navbar-expand-lg navbar-light bg-white position-sticky mt-4 top-1 px-0 mx-4 shadow-none border-radius-xl z-index-sticky\" id=\"navbarBlur\" data-scroll=\"true\">\n            <div class=\"container-fluid py-1 px-3\">\n              <nav aria-label=\"breadcrumb\">\n                <ol class=\"breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5\">\n                  <li class=\"breadcrumb-item text-sm\">\n                    <a class=\"opacity-3 text-dark\" href=\"javascript:;\">\n                      <svg width=\"12px\" height=\"12px\" class=\"mb-1\" viewBox=\"0 0 45 40\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                        <title>shop </title>\n                        <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                          <g transform=\"translate(-1716.000000, -439.000000)\" fill=\"#252f40\" fill-rule=\"nonzero\">\n                            <g transform=\"translate(1716.000000, 291.000000)\">\n                              <g transform=\"translate(0.000000, 148.000000)\">\n                                <path d=\"M46.7199583,10.7414583 L40.8449583,0.949791667 C40.4909749,0.360605034 39.8540131,0 39.1666667,0 L7.83333333,0 C7.1459869,0 6.50902508,0.360605034 6.15504167,0.949791667 L0.280041667,10.7414583 C0.0969176761,11.0460037 -1.23209662e-05,11.3946378 -1.23209662e-05,11.75 C-0.00758042603,16.0663731 3.48367543,19.5725301 7.80004167,19.5833333 L7.81570833,19.5833333 C9.75003686,19.5882688 11.6168794,18.8726691 13.0522917,17.5760417 C16.0171492,20.2556967 20.5292675,20.2556967 23.494125,17.5760417 C26.4604562,20.2616016 30.9794188,20.2616016 33.94575,17.5760417 C36.2421905,19.6477597 39.5441143,20.1708521 42.3684437,18.9103691 C45.1927731,17.649886 47.0084685,14.8428276 47.0000295,11.75 C47.0000295,11.3946378 46.9030823,11.0460037 46.7199583,10.7414583 Z\"></path>\n                                <path d=\"M39.198,22.4912623 C37.3776246,22.4928106 35.5817531,22.0149171 33.951625,21.0951667 L33.92225,21.1107282 C31.1430221,22.6838032 27.9255001,22.9318916 24.9844167,21.7998837 C24.4750389,21.605469 23.9777983,21.3722567 23.4960833,21.1018359 L23.4745417,21.1129513 C20.6961809,22.6871153 17.4786145,22.9344611 14.5386667,21.7998837 C14.029926,21.6054643 13.533337,21.3722507 13.0522917,21.1018359 C11.4250962,22.0190609 9.63246555,22.4947009 7.81570833,22.4912623 C7.16510551,22.4842162 6.51607673,22.4173045 5.875,22.2911849 L5.875,44.7220845 C5.875,45.9498589 6.7517757,46.9451667 7.83333333,46.9451667 L19.5833333,46.9451667 L19.5833333,33.6066734 L27.4166667,33.6066734 L27.4166667,46.9451667 L39.1666667,46.9451667 C40.2482243,46.9451667 41.125,45.9498589 41.125,44.7220845 L41.125,22.2822926 C40.4887822,22.4116582 39.8442868,22.4815492 39.198,22.4912623 Z\"></path>\n                              </g>\n                            </g>\n                          </g>\n                        </g>\n                      </svg>\n                    </a>\n                  </li>\n                  <li class=\"breadcrumb-item text-sm\"><a class=\"opacity-5 text-dark\" href=\"javascript:;\">Pages</a></li>\n                  <li class=\"breadcrumb-item text-sm text-dark active\" aria-current=\"page\">New User</li>\n                </ol>\n                <h6 class=\"font-weight-bolder mb-0\">New User</h6>\n              </nav>\n              <div class=\"sidenav-toggler sidenav-toggler-inner d-xl-block d-none \">\n                <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                  <div class=\"sidenav-toggler-inner\">\n                    <i class=\"sidenav-toggler-line\"></i>\n                    <i class=\"sidenav-toggler-line\"></i>\n                    <i class=\"sidenav-toggler-line\"></i>\n                  </div>\n                </a>\n              </div>\n              <div class=\"collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4\" id=\"navbar\">\n                <div class=\"ms-md-auto pe-md-3 d-flex align-items-center\">\n                  <div class=\"input-group input-group-outline\">\n                    <label class=\"form-label\">Search here</label>\n                    <input type=\"text\" class=\"form-control\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                </div>\n                <ul class=\"navbar-nav  justify-content-end\">\n                  <li class=\"nav-item\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0 position-relative\">\n                      <i class=\"material-icons me-sm-1\">\n              account_circle\n            </i>\n                    </a>\n                  </li>\n                  <li class=\"nav-item d-xl-none ps-3 d-flex align-items-center\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0\" id=\"iconNavbarSidenav\">\n                      <div class=\"sidenav-toggler-inner\">\n                        <i class=\"sidenav-toggler-line\"></i>\n                        <i class=\"sidenav-toggler-line\"></i>\n                        <i class=\"sidenav-toggler-line\"></i>\n                      </div>\n                    </a>\n                  </li>\n                  <li class=\"nav-item px-3\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                      <i class=\"material-icons fixed-plugin-button-nav cursor-pointer\">\n              settings\n            </i>\n                    </a>\n                  </li>\n                  <li class=\"nav-item dropdown pe-2\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0 position-relative\" id=\"dropdownMenuButton\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                      <i class=\"material-icons cursor-pointer\">\n              notifications\n            </i>\n                      <span class=\"position-absolute top-5 start-100 translate-middle badge rounded-pill bg-danger border border-white small py-1 px-2\">\n                        <span class=\"small\">11</span>\n                        <span class=\"visually-hidden\">unread notifications</span>\n                      </span>\n                    </a>\n                    <ul class=\"dropdown-menu dropdown-menu-end p-2 me-sm-n4\" aria-labelledby=\"dropdownMenuButton\">\n                      <li class=\"mb-2\">\n                        <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                          <div class=\"d-flex align-items-center py-1\">\n                            <div class=\"my-auto\">\n                              <span class=\"material-icons\">\n                                email\n                              </span>\n                            </div>\n                            <div class=\"ms-2\">\n                              <h6 class=\"text-sm font-weight-normal mb-0\">\n                                New message from Laur\n                              </h6>\n                            </div>\n                          </div>\n                        </a>\n                      </li>\n                      <li class=\"mb-2\">\n                        <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                          <div class=\"d-flex align-items-center py-1\">\n                            <div class=\"my-auto\">\n                              <span class=\"material-icons\">\n                                headphones\n                              </span>\n                            </div>\n                            <div class=\"ms-2\">\n                              <h6 class=\"text-sm font-weight-normal mb-0\">\n                                New album by Travis Scott\n                              </h6>\n                            </div>\n                          </div>\n                        </a>\n                      </li>\n                      <li>\n                        <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                          <div class=\"d-flex align-items-center py-1\">\n                            <div class=\"my-auto\">\n                              <span class=\"material-icons\">\n                                shopping_cart\n                              </span>\n                            </div>\n                            <div class=\"ms-2\">\n                              <h6 class=\"text-sm font-weight-normal mb-0\">\n                                Payment successfully completed\n                              </h6>\n                            </div>\n                          </div>\n                        </a>\n                      </li>\n                    </ul>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </nav>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar navbar-main bg-gradient-dark navbar-expand-lg position-sticky mt-4 top-1 px-0 mx-4 shadow-none border-radius-xl z-index-sticky<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbarBlur<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-scroll</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container-fluid py-1 px-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ol</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>opacity-3 text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>svg</span> <span class=\"token attr-name\">width</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>12px<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>12px<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-1 text-white<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">viewBox</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0 0 45 40<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">version</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>1.1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">xmlns</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>http://www.w3.org/2000/svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\"><span class=\"token namespace\">xmlns:</span>xlink</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>http://www.w3.org/1999/xlink<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>title</span><span class=\"token punctuation\">&gt;</span></span>shop <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>title</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">stroke</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>none<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">stroke-width</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>none<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill-rule</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>evenodd<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(-1716.000000, -439.000000)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#fff<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill-rule</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nonzero<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(1716.000000, 291.000000)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(0.000000, 148.000000)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>path</span> <span class=\"token attr-name\">d</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>M46.7199583,10.7414583 L40.8449583,0.949791667 C40.4909749,0.360605034 39.8540131,0 39.1666667,0 L7.83333333,0 C7.1459869,0 6.50902508,0.360605034 6.15504167,0.949791667 L0.280041667,10.7414583 C0.0969176761,11.0460037 -1.23209662e-05,11.3946378 -1.23209662e-05,11.75 C-0.00758042603,16.0663731 3.48367543,19.5725301 7.80004167,19.5833333 L7.81570833,19.5833333 C9.75003686,19.5882688 11.6168794,18.8726691 13.0522917,17.5760417 C16.0171492,20.2556967 20.5292675,20.2556967 23.494125,17.5760417 C26.4604562,20.2616016 30.9794188,20.2616016 33.94575,17.5760417 C36.2421905,19.6477597 39.5441143,20.1708521 42.3684437,18.9103691 C45.1927731,17.649886 47.0084685,14.8428276 47.0000295,11.75 C47.0000295,11.3946378 46.9030823,11.0460037 46.7199583,10.7414583 Z<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>path</span><span class=\"token punctuation\">&gt;</span></span>\n                          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>path</span> <span class=\"token attr-name\">d</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>M39.198,22.4912623 C37.3776246,22.4928106 35.5817531,22.0149171 33.951625,21.0951667 L33.92225,21.1107282 C31.1430221,22.6838032 27.9255001,22.9318916 24.9844167,21.7998837 C24.4750389,21.605469 23.9777983,21.3722567 23.4960833,21.1018359 L23.4745417,21.1129513 C20.6961809,22.6871153 17.4786145,22.9344611 14.5386667,21.7998837 C14.029926,21.6054643 13.533337,21.3722507 13.0522917,21.1018359 C11.4250962,22.0190609 9.63246555,22.4947009 7.81570833,22.4912623 C7.16510551,22.4842162 6.51607673,22.4173045 5.875,22.2911849 L5.875,44.7220845 C5.875,45.9498589 6.7517757,46.9451667 7.83333333,46.9451667 L19.5833333,46.9451667 L19.5833333,33.6066734 L27.4166667,33.6066734 L27.4166667,46.9451667 L39.1666667,46.9451667 C40.2482243,46.9451667 41.125,45.9498589 41.125,44.7220845 L41.125,22.2822926 C40.4887822,22.4116582 39.8442868,22.4815492 39.198,22.4912623 Z<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>path</span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>svg</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>opacity-7 text-white<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Pages<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm text-white active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-current</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>New User<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ol</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bolder text-white mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>New User<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler sidenav-toggler-inner d-xl-block d-none <span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-inner text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line bg-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line bg-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line bg-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-md-auto pe-md-3 d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Search here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control text-white<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocus</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>focused(this)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocusout</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>defocused(this)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar-nav  justify-content-end<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0 position-relative<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons me-sm-1 text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              account_circle\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item d-xl-none ps-3 d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>iconNavbarSidenav<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-inner<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item px-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons fixed-plugin-button-nav cursor-pointer text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              settings\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item dropdown pe-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0 position-relative<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons cursor-pointer text-white<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              notifications\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>position-absolute top-5 start-100 translate-middle badge rounded-pill bg-danger border border-white small py-1 px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>small<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>11<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>visually-hidden<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>unread notifications<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu dropdown-menu-end p-2 me-sm-n4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          email\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          New message from Laur\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          headphones\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          New album by Travis Scott\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          shopping_cart\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          Payment successfully completed\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span>\n\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar navbar-main navbar-expand-lg navbar-light bg-white position-sticky mt-4 top-1 px-0 mx-4 shadow-none border-radius-xl z-index-sticky<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbarBlur<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-scroll</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container-fluid py-1 px-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ol</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>opacity-3 text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>svg</span> <span class=\"token attr-name\">width</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>12px<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>12px<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">viewBox</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0 0 45 40<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">version</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>1.1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">xmlns</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>http://www.w3.org/2000/svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\"><span class=\"token namespace\">xmlns:</span>xlink</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>http://www.w3.org/1999/xlink<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>title</span><span class=\"token punctuation\">&gt;</span></span>shop <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>title</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">stroke</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>none<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">stroke-width</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>none<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill-rule</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>evenodd<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(-1716.000000, -439.000000)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#252f40<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">fill-rule</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nonzero<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(1716.000000, 291.000000)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>g</span> <span class=\"token attr-name\">transform</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>translate(0.000000, 148.000000)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>path</span> <span class=\"token attr-name\">d</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>M46.7199583,10.7414583 L40.8449583,0.949791667 C40.4909749,0.360605034 39.8540131,0 39.1666667,0 L7.83333333,0 C7.1459869,0 6.50902508,0.360605034 6.15504167,0.949791667 L0.280041667,10.7414583 C0.0969176761,11.0460037 -1.23209662e-05,11.3946378 -1.23209662e-05,11.75 C-0.00758042603,16.0663731 3.48367543,19.5725301 7.80004167,19.5833333 L7.81570833,19.5833333 C9.75003686,19.5882688 11.6168794,18.8726691 13.0522917,17.5760417 C16.0171492,20.2556967 20.5292675,20.2556967 23.494125,17.5760417 C26.4604562,20.2616016 30.9794188,20.2616016 33.94575,17.5760417 C36.2421905,19.6477597 39.5441143,20.1708521 42.3684437,18.9103691 C45.1927731,17.649886 47.0084685,14.8428276 47.0000295,11.75 C47.0000295,11.3946378 46.9030823,11.0460037 46.7199583,10.7414583 Z<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>path</span><span class=\"token punctuation\">&gt;</span></span>\n                          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>path</span> <span class=\"token attr-name\">d</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>M39.198,22.4912623 C37.3776246,22.4928106 35.5817531,22.0149171 33.951625,21.0951667 L33.92225,21.1107282 C31.1430221,22.6838032 27.9255001,22.9318916 24.9844167,21.7998837 C24.4750389,21.605469 23.9777983,21.3722567 23.4960833,21.1018359 L23.4745417,21.1129513 C20.6961809,22.6871153 17.4786145,22.9344611 14.5386667,21.7998837 C14.029926,21.6054643 13.533337,21.3722507 13.0522917,21.1018359 C11.4250962,22.0190609 9.63246555,22.4947009 7.81570833,22.4912623 C7.16510551,22.4842162 6.51607673,22.4173045 5.875,22.2911849 L5.875,44.7220845 C5.875,45.9498589 6.7517757,46.9451667 7.83333333,46.9451667 L19.5833333,46.9451667 L19.5833333,33.6066734 L27.4166667,33.6066734 L27.4166667,46.9451667 L39.1666667,46.9451667 C40.2482243,46.9451667 41.125,45.9498589 41.125,44.7220845 L41.125,22.2822926 C40.4887822,22.4116582 39.8442868,22.4815492 39.198,22.4912623 Z<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>path</span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>g</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>svg</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>opacity-5 text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Pages<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>breadcrumb-item text-sm text-dark active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-current</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>New User<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ol</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bolder mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>New User<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler sidenav-toggler-inner d-xl-block d-none <span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-inner<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-md-auto pe-md-3 d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-outline<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>label</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-label<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Search here<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>label</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocus</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>focused(this)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocusout</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>defocused(this)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>navbar-nav  justify-content-end<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0 position-relative<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons me-sm-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              account_circle\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item d-xl-none ps-3 d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>iconNavbarSidenav<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-inner<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sidenav-toggler-line<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item px-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons fixed-plugin-button-nav cursor-pointer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              settings\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item dropdown pe-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link text-body p-0 position-relative<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons cursor-pointer<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              notifications\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>position-absolute top-5 start-100 translate-middle badge rounded-pill bg-danger border border-white small py-1 px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>small<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>11<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>visually-hidden<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>unread notifications<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-menu dropdown-menu-end p-2 me-sm-n4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-labelledby</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdownMenuButton<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          email\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          New message from Laur\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          headphones\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          New album by Travis Scott\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dropdown-item border-radius-md<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          shopping_cart\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ms-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                          Payment successfully completed\n                        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span>\n\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/navs.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Navs | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#nav-pills\">Nav pills</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#tabs-with-icons\">Tabs with icons</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#vertical-tabs\">Vertical Tabs</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Navs\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap Navs component allows to create simple navigation. Navigation available in Bootstrap shares general markup and styles, from the base .nav class to the active and disabled states. <br> Learn how to use Bootstrap navigation from this documentation and navs examples to quickly and easily create elegant and flexible navs.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"nav-pills\">Nav pills</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"nav-wrapper position-relative end-0\">\n              <ul class=\"nav nav-pills nav-fill p-1\" role=\"tablist\">\n                <li class=\"nav-item\">\n                  <a class=\"nav-link mb-0 px-0 py-1 active\" data-bs-toggle=\"tab\" href=\"#profile-tabs-simple\" role=\"tab\" aria-controls=\"profile\" aria-selected=\"true\">\n                    My Profile\n                  </a>\n                </li>\n                <li class=\"nav-item\">\n                  <a class=\"nav-link mb-0 px-0 py-1\" data-bs-toggle=\"tab\" href=\"#dashboard-tabs-simple\" role=\"tab\" aria-controls=\"dashboard\" aria-selected=\"false\">\n                    Dashboard\n                  </a>\n                </li>\n              <div class=\"moving-tab position-absolute nav-link\" style=\"padding: 0px; width: 264px; transform: translate3d(0px, 0px, 0px); transition: all 0.5s ease 0s;\"><a class=\"nav-link mb-0 px-0 py-1 active\" data-bs-toggle=\"tab\" href=\"#profile-tabs-simple\" role=\"tab\" aria-controls=\"profile\" aria-selected=\"true\">-</a></div></ul>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-wrapper position-relative end-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n   <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav nav-pills nav-fill p-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tablist<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link mb-0 px-0 py-1 active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#profile-tabs-simple<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>profile<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-selected</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n         My Profile\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link mb-0 px-0 py-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#dashboard-tabs-simple<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dashboard<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-selected</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n         Dashboard\n         <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"tabs-with-icons\">Tabs with icons</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"nav-wrapper position-relative end-0\">\n              <ul class=\"nav nav-pills nav-fill p-1\" role=\"tablist\">\n                <li class=\"nav-item\">\n                  <a class=\"nav-link mb-0 px-0 py-1 active\" data-bs-toggle=\"tab\" href=\"#profile-tabs-icons\" role=\"tab\" aria-controls=\"preview\" aria-selected=\"true\">\n                    <span class=\"material-icons align-middle mb-1\">\n                      badge\n                    </span>\n                    My Profile\n                  </a>\n                </li>\n                <li class=\"nav-item\">\n                  <a class=\"nav-link mb-0 px-0 py-1\" data-bs-toggle=\"tab\" href=\"#dashboard-tabs-icons\" role=\"tab\" aria-controls=\"code\" aria-selected=\"false\">\n                    <span class=\"material-icons align-middle mb-1\">\n                      laptop\n                    </span>\n                    Dashboard\n                  </a>\n                </li>\n              <div class=\"moving-tab position-absolute nav-link\" style=\"padding: 0px; width: 264px; transform: translate3d(0px, 0px, 0px); transition: all 0.5s ease 0s;\"><a class=\"nav-link mb-0 px-0 py-1 active\" data-bs-toggle=\"tab\" href=\"#profile-tabs-icons\" role=\"tab\" aria-controls=\"preview\" aria-selected=\"true\">-</a></div></ul>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-wrapper position-relative end-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav nav-pills nav-fill p-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tablist<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link mb-0 px-0 py-1 active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#profile-tabs-icons<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>preview<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-selected</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons align-middle mb-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        badge\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      My Profile\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link mb-0 px-0 py-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#dashboard-tabs-icons<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>code<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-selected</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons align-middle mb-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          laptop\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n         Dashboard\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"vertical-tabs\">Vertical Tabs</h2>\n          <p><br></p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"nav-wrapper position-relative end-0\">\n              <ul class=\"nav nav-pills nav-fill flex-column p-1\" role=\"tablist\">\n                <li class=\"nav-item\">\n                  <a class=\"nav-link mb-0 px-0 py-1 active\" data-bs-toggle=\"tab\" href=\"#profile-tabs-vertical\" role=\"tab\" aria-controls=\"preview\" aria-selected=\"true\">\n                    My Profile\n                  </a>\n                </li>\n                <li class=\"nav-item\">\n                  <a class=\"nav-link mb-0 px-0 py-1\" data-bs-toggle=\"tab\" href=\"#dashboard-tabs-vertical\" role=\"tab\" aria-controls=\"code\" aria-selected=\"false\">\n                    Dashboard\n                  </a>\n                </li>\n                <li class=\"nav-item\">\n                  <a class=\"nav-link mb-0 px-0 py-1\" data-bs-toggle=\"tab\" href=\"#payments-tabs-vertical\" role=\"tab\" aria-controls=\"code\" aria-selected=\"false\">\n                    Payments\n                  </a>\n                </li>\n              <div class=\"moving-tab position-absolute nav-link\" style=\"padding: 0px; width: 535px; transform: translate3d(0px, 0px, 0px); transition: all 0.5s ease 0s;\"><a class=\"nav-link mb-0 px-0 py-1 active\" data-bs-toggle=\"tab\" href=\"#profile-tabs-vertical\" role=\"tab\" aria-controls=\"preview\" aria-selected=\"true\">-</a></div></ul>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-wrapper position-relative end-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav nav-pills nav-fill flex-column p-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tablist<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link mb-0 px-0 py-1 active<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#profile-tabs-vertical<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>preview<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-selected</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        My Profile\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link mb-0 px-0 py-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#dashboard-tabs-vertical<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>code<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-selected</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        Dashboard\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>nav-link mb-0 px-0 py-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#payments-tabs-vertical<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tab<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-controls</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>code<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-selected</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        Payments\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/pagination.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Pagination | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#colors\">Colors</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#disabled-and-active-states\">Disabled and active states</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#sizing\">Sizing</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#alignment\">Alignment</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Pagination\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap pagination component consists of button-like styled links, that are arranged side by side in a horizontal list. Pagination is built with list HTML elements so screen readers can announce the number of available links.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>Learn how to create nice looking pagination using these Bootstrap pagination examples to indicate a series of related content exists across multiple pages and to navigate through pages easily.</p>\n          <h2 id=\"example\">Example</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <nav aria-label=\"Page navigation example\">\n              <ul class=\"pagination\">\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Previous\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_left\n                    </span>\n                    <span class=\"sr-only\">Previous</span>\n                  </a>\n                </li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">1</a></li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">2</a></li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">3</a></li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Next\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_right\n                    </span>\n                    <span class=\"sr-only\">Next</span>\n                  </a>\n                </li>\n              </ul>\n            </nav>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Page navigation example<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Previous<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_left\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Previous<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_right\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Next<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"colors\">Colors</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <ul class=\"pagination pagination-primary\">\n              <li class=\"page-item active\">\n                <a class=\"page-link\" href=\"javascript:;\">1</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">2</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">3</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">4</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">5</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">6</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">7</a>\n              </li>\n            </ul>\n            <ul class=\"pagination pagination-info\">\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\" aria-label=\"Previous\">\n                  <span class=\"material-icons\">\n                    keyboard_arrow_left\n                  </span>\n                </a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">1</a>\n              </li>\n              <li class=\"page-item active\">\n                <a class=\"page-link\" href=\"#link\">2</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">3</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">4</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\">5</a>\n              </li>\n              <li class=\"page-item\">\n                <a class=\"page-link\" href=\"#link\" aria-label=\"Next\">\n                  <span aria-hidden=\"true\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_right\n                    </span>\n                  </span>\n                </a>\n              </li>\n            </ul>\n            <div class=\"pagination-container justify-content-center\">\n              <ul class=\"pagination pagination-success\">\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Previous\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        arrow_back\n                      </span></span>\n                  </a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">1</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">2</a>\n                </li>\n                <li class=\"page-item active\">\n                  <a class=\"page-link\" href=\"javascript:;\">3</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">4</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">5</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Next\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        arrow_forward\n                      </span></span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"pagination-container justify-content-center\">\n              <ul class=\"pagination pagination-warning\">\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Previous\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        keyboard_arrow_left\n                      </span></span>\n                  </a>\n                </li>\n                <li class=\"page-item active\">\n                  <a class=\"page-link\" href=\"javascript:;\">1</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">2</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">3</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">4</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">5</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Next\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        keyboard_arrow_right\n                      </span></span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"pagination-container justify-content-center\">\n              <ul class=\"pagination pagination-danger\">\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Previous\">\n                    <span aria-hidden=\"true\">\n                      <span class=\"material-icons\">\n                        keyboard_arrow_left\n                      </span>\n                    </span>\n                  </a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">1</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">2</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">3</a>\n                </li>\n                <li class=\"page-item active\">\n                  <a class=\"page-link\" href=\"javascript:;\">4</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">5</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Next\">\n                    <span aria-hidden=\"true\">\n                      <span class=\"material-icons\">\n                        keyboard_arrow_right\n                      </span>\n                    </span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"pagination-container justify-content-center\">\n              <ul class=\"pagination pagination-secondary\">\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Previous\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        keyboard_arrow_left\n                      </span></span>\n                  </a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">1</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">2</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">3</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">4</a>\n                </li>\n                <li class=\"page-item active\">\n                  <a class=\"page-link\" href=\"javascript:;\">5</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Next\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        keyboard_arrow_right\n                      </span></span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"pagination-container justify-content-center\">\n              <ul class=\"pagination pagination-default\">\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Previous\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        keyboard_arrow_left\n                      </span></span>\n                  </a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">1</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">2</a>\n                </li>\n                <li class=\"page-item active\">\n                  <a class=\"page-link\" href=\"javascript:;\">3</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">4</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">5</a>\n                </li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\" aria-label=\"Next\">\n                    <span aria-hidden=\"true\"><span class=\"material-icons\">\n                        keyboard_arrow_right\n                      </span></span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-primary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>6<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>7<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Previous<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            keyboard_arrow_left\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            keyboard_arrow_right\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination-container justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Previous<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\narrow_back\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\narrow_forward\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination-container justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-warning<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Previous<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_left\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_right\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination-container justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Previous<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_left\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_right\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination-container justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Previous<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_left\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_right\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination-container justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-default<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Previous<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_left\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>5<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Next<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\nkeyboard_arrow_right\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"disabled-and-active-states\">Disabled and active states</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <nav aria-label=\"...\">\n              <ul class=\"pagination\">\n                <li class=\"page-item disabled\">\n                  <a class=\"page-link\" href=\"javascript:;\" tabindex=\"-1\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_left\n                    </span>\n                    <span class=\"sr-only\">Previous</span>\n                  </a>\n                </li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">1</a></li>\n                <li class=\"page-item active\">\n                  <a class=\"page-link\" href=\"javascript:;\">2 <span class=\"sr-only\">(current)</span></a>\n                </li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">3</a></li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_right\n                    </span>\n                    <span class=\"sr-only\">Next</span>\n                  </a>\n                </li>\n              </ul>\n            </nav>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>...<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item disabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_left\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Previous<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2 <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>(current)<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_right\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Next<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"sizing\">Sizing</h2>\n          <p>Fancy larger or smaller pagination? Add <code class=\" highlighter-rouge language-plaintext\">.pagination-lg</code> or <code class=\" highlighter-rouge language-plaintext\">.pagination-sm</code> for additional sizes.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <nav aria-label=\"...\">\n              <ul class=\"pagination pagination-lg\">\n                <li class=\"page-item disabled\">\n                  <a class=\"page-link\" href=\"javascript:;\" tabindex=\"-1\">1</a>\n                </li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">2</a></li>\n                <li class=\"page-item active\"><a class=\"page-link\" href=\"javascript:;\">3</a></li>\n              </ul>\n            </nav>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>...<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-lg<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item disabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <nav aria-label=\"...\">\n              <ul class=\"pagination pagination-sm\">\n                <li class=\"page-item disabled\">\n                  <a class=\"page-link\" href=\"javascript:;\" tabindex=\"-1\">1</a>\n                </li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">2</a></li>\n                <li class=\"page-item active\"><a class=\"page-link\" href=\"javascript:;\">3</a></li>\n              </ul>\n            </nav>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>...<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination pagination-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item disabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"alignment\">Alignment</h2>\n          <p>Change the alignment of pagination components with flexbox utilities.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <nav aria-label=\"Page navigation example\">\n              <ul class=\"pagination justify-content-center\">\n                <li class=\"page-item disabled\">\n                  <a class=\"page-link\" href=\"javascript:;\" tabindex=\"-1\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_left\n                    </span>\n                    <span class=\"sr-only\">Previous</span>\n                  </a>\n                </li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">1</a></li>\n                <li class=\"page-item active\"><a class=\"page-link\" href=\"javascript:;\">2</a></li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">3</a></li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_right\n                    </span>\n                    <span class=\"sr-only\">Next</span>\n                  </a>\n                </li>\n              </ul>\n            </nav>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Page navigation example<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item disabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_left\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Previous<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_right\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Next<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <nav aria-label=\"Page navigation example\">\n              <ul class=\"pagination justify-content-end\">\n                <li class=\"page-item disabled\">\n                  <a class=\"page-link\" href=\"javascript:;\" tabindex=\"-1\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_left\n                    </span>\n                    <span class=\"sr-only\">Previous</span>\n                  </a>\n                </li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">1</a></li>\n                <li class=\"page-item active\"><a class=\"page-link\" href=\"javascript:;\">2</a></li>\n                <li class=\"page-item\"><a class=\"page-link\" href=\"javascript:;\">3</a></li>\n                <li class=\"page-item\">\n                  <a class=\"page-link\" href=\"javascript:;\">\n                    <span class=\"material-icons\">\n                      keyboard_arrow_right\n                    </span>\n                    <span class=\"sr-only\">Next</span>\n                  </a>\n                </li>\n              </ul>\n            </nav>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>nav</span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Page navigation example<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pagination justify-content-end<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item disabled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_left\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Previous<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item active<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>page-link<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          keyboard_arrow_right\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Next<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>nav</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/popovers.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Popovers | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#variations\">Variations</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Popovers\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap popovers are a small overlay of content that is used to demonstrate secondary information of any component when it is clicked by a user. For example, you can think about those from iOS’s devices. Now keep reading some examples to see how Bootstrap popovers work.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"example\">Example</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <button type=\"button\" class=\"btn btn-secondary mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Popover on top\n            </button>\n            <button type=\"button\" class=\"btn btn-secondary mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-bs-placement=\"right\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Popover on right\n            </button>\n            <button type=\"button\" class=\"btn btn-secondary mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-bs-placement=\"bottom\" data-bs-content=\"Vivamus\nsagittis lacus vel augue laoreet rutrum faucibus.\" data-bs-original-title=\"\" title=\"\">\n              Popover on bottom\n            </button>\n            <button type=\"button\" class=\"btn btn-secondary mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-bs-placement=\"left\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Popover on left\n            </button>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Popover on top\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>right<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Popover on right\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Vivamus\nsagittis lacus vel augue laoreet rutrum faucibus.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Popover on bottom\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>left<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Popover on left\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"variations\">Variations</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <button type=\"button\" class=\"btn bg-gradient-primary mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"primary\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Primary popover\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-secondary mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"secondary\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Secondary popover\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-info mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"info\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Info popover\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-success mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"success\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Success popover\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-danger mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"danger\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Danger popover\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-warning mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"warning\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Warning popover\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-light mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"light\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Light popover\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-dark mt-2\" data-container=\"body\" data-bs-toggle=\"popover\" data-color=\"dark\" data-bs-placement=\"top\" data-bs-content=\"This is a very beautiful popover, show some love.\" data-bs-original-title=\"\" title=\"\">\n              Dark popover\n            </button>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Primary popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Secondary popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-info<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>info<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Info popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-success<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>success<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Success popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-danger<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>danger<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Danger popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Warning popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-light<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>light<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Light popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>popover<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-color</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-content</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>This is a very beautiful popover, show some love.<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Dark popover\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/progress.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Progress | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#simple-progress\">Simple Progress</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#gradient-progress\">Gradient Progress</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Progress\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap progress components can be used to show a user how far along he/she is in a process. These Bootstrap progress bars are built with two HTML elements, some CSS to set the width, and a few attributes. Now keep reading some examples to see how Bootstrap Progress bars work.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"example\">Example</h2>\n          <h3 id=\"simple-progress\">Simple Progress</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-primary\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-secondary\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-info\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-success\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-danger\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-warning\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-info<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-success<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-danger<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"gradient-progress\">Gradient Progress</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-gradient-primary\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-gradient-secondary\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-gradient-info\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-gradient-success\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-gradient-danger\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n            <div class=\"progress-wrapper mb-2\">\n              <div class=\"progress-info\">\n                <div class=\"progress-percentage\">\n                  <span class=\"text-sm font-weight-normal\">60%</span>\n                </div>\n              </div>\n              <div class=\"progress\">\n                <div class=\"progress-bar bg-gradient-warning\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-gradient-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-gradient-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-gradient-info<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-gradient-success<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-gradient-danger<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-wrapper<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-percentage<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-sm font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progress-bar bg-gradient-warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>progressbar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuenow</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>60<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemin</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-valuemax</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">width</span><span class=\"token punctuation\">:</span> 60%<span class=\"token punctuation\">;</span></span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n  <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/social-buttons.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Social Buttons | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#icon-only\">Icon only</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#circle\">Circle</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Social Buttons\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Pure CSS Bootstrap social buttons with plenty of examples. Also, easy to extend or add new brands.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"examples\">Examples</h2>\n          <p><button type=\"button\" class=\"btn btn-facebook btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-facebook\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Facebook</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-twitter btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-twitter\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Twitter</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-instagram btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-instagram\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Instagram</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-github btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-github\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Github</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-pinterest btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-pinterest\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Pinterest</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-youtube btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-youtube\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Youtube</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-vimeo btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-vimeo-v\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Vimeo</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-slack btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-slack\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Slack</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-dribbble btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-dribbble\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Dribbble</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-reddit btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-reddit\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Reddit</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-tumblr btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-tumblr\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">Tumblr</span>\n            </button>\n            <button type=\"button\" class=\"btn btn-linkedin btn-icon mt-2\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-linkedin\" aria-hidden=\"true\"></i></span>\n              <span class=\"btn-inner--text\">LinkedIn</span>\n            </button>\n          </p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-facebook btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-facebook<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Facebook<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-twitter btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-twitter<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Twitter<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-instagram btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-instagram<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Instagram<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-github btn-icon mt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-github<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Github<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-pinterest btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-pinterest<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Pinterest<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-youtube btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-youtube<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Youtube<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-vimeo btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-vimeo-v<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Vimeo<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-slack btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-slack<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Slack<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-dribbble btn-icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-dribbble<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Dribbble<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-reddit btn-icon mt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-reddit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Reddit<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-tumblr btn-icon mt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-tumblr<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Tumblr<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-linkedin btn-icon mt-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-linkedin<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>LinkedIn<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"icon-only\">Icon only</h2>\n          <p><button type=\"button\" class=\"btn btn-facebook btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-facebook\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-twitter btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-twitter\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-instagram btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-instagram\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-github btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-github\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-pinterest btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-pinterest\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-youtube btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-youtube\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-vimeo btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-vimeo-v\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-slack btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-slack\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-dribbble btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-dribbble\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-reddit btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-reddit\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-tumblr btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-tumblr\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-linkedin btn-icon-only\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-linkedin\" aria-hidden=\"true\"></i></span>\n            </button>\n          </p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-facebook btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-facebook<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-twitter btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-twitter<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-instagram btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-instagram<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-github btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-github<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-pinterest btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-pinterest<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-youtube btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-youtube<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-vimeo btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-vimeo-v<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-slack btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-slack<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-dribbble btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-dribbble<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-reddit btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-reddit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-tumblr btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-tumblr<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-linkedin btn-icon-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-linkedin<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"circle\">Circle</h2>\n          <p>Add the <code class=\" highlighter-rouge language-plaintext\">.rounded-circle</code> modifier class to create a fully rounded button.</p>\n          <p><button type=\"button\" class=\"btn btn-facebook btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-facebook\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-twitter btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-twitter\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-instagram btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-instagram\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-github btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-github\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-pinterest btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-pinterest\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-youtube btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-youtube\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-vimeo btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-vimeo-v\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-slack btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-slack\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-dribbble btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-dribbble\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-reddit btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-reddit\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-tumblr btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-tumblr\" aria-hidden=\"true\"></i></span>\n            </button>\n            <button type=\"button\" class=\"btn btn-linkedin btn-icon-only rounded-circle\">\n              <span class=\"btn-inner--icon\"><i class=\"fab fa-linkedin\" aria-hidden=\"true\"></i></span>\n            </button>\n          </p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-facebook btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-facebook<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-twitter btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-twitter<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-instagram btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-instagram<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-github btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-github<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-pinterest btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-pinterest<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-youtube btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-youtube<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-vimeo btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-vimeo-v<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-slack btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-slack<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-dribbble btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-dribbble<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-reddit btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-reddit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-tumblr btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-tumblr<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-linkedin btn-icon-only rounded-circle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-inner--icon<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fab fa-linkedin<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/spinners.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Spinners | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#border-spinner\">Border Spinner</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#variations\">Variations</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#growing-spinner\">Growing Spinner</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#variations-1\">Variations</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Spinners\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Indicate the loading state of a component or page with Bootstrap spinners, built entirely with HTML, CSS, and no JavaScript.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"border-spinner\">Border Spinner</h2>\n          <p><br></p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"tab-pane\">\n              <div class=\"spinner-border\" role=\"status\">\n                <span class=\"sr-only\">Loading...</span>\n              </div>\n              <button class=\"btn btn-primary btn-sm ml-2 mb-2\" type=\"button\" disabled=\"\">\n                <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n                <span class=\"sr-only\">Loading...</span>\n              </button>\n              <button class=\"btn btn-primary btn-sm mb-2\" type=\"button\" disabled=\"\">\n                <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n                Loading...\n              </button>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-sm ml-2 mb-2<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border spinner-border-sm<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-sm mb-2<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border spinner-border-sm<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  Loading...\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"variations\">Variations</h2>\n          <p><br></p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"spinner-border text-primary\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-border text-success\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-border text-danger\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-border text-warning\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-border text-info\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-border text-light\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-border text-default\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border text-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border text-success<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border text-danger<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border text-warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border text-info<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border text-light<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-border text-default<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"growing-spinner\">Growing Spinner</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"tab-pane\">\n              <div class=\"spinner-grow\" role=\"status\">\n                <span class=\"sr-only\">Loading...</span>\n              </div>\n              <button class=\"btn btn-primary btn-sm ml-2 mb-2\" type=\"button\" disabled=\"\">\n                <span class=\"spinner-grow spinner-grow-sm\" role=\"status\" aria-hidden=\"true\"></span>\n                <span class=\"sr-only\">Loading...</span>\n              </button>\n              <button class=\"btn btn-primary btn-sm mb-2\" type=\"button\" disabled=\"\">\n                <span class=\"spinner-grow spinner-grow-sm\" role=\"status\" aria-hidden=\"true\"></span>\n                Loading...\n              </button>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-sm ml-2 mb-2<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow spinner-grow-sm<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-primary btn-sm mb-2<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">disabled</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow spinner-grow-sm<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n  Loading...\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"variations-1\">Variations</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"spinner-grow text-primary\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-grow text-success\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-grow text-danger\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-grow text-warning\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-grow text-info\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-grow text-light\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n            <div class=\"spinner-grow text-dark\" role=\"status\">\n              <span class=\"sr-only\">Loading...</span>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow text-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow text-success<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow text-danger<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow text-warning<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow text-info<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow text-light<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>spinner-grow text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>status<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>sr-only<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Loading...<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/tables.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Tables | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#john-michael\">John Michael</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#alexa-liras\">Alexa Liras</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#laurent-perrier\">Laurent Perrier</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#michael-levi\">Michael Levi</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#richard-gran\">Richard Gran</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#miriam-eric\">Miriam Eric</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#project-table\">Project Table</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#spotify\">Spotify</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#invision\">Invision</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#jira\">Jira</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#slack\">Slack</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#webdev\">Webdev</a></li>\n                <li class=\"toc-entry toc-h6\"><a href=\"#adobe-xd\">Adobe XD</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Tables\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap Tables are designed to be <b>opt-in</b> due to the widespread use of tables across third-party widgets like calendars and date pickers.<br> Keep reading some Bootstrap Tables examples to see how these tables work.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"examples\">Examples</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card\">\n              <div class=\"table-responsive\">\n                <table class=\"table align-items-center mb-0\">\n                  <thead>\n                    <tr>\n                      <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Author</th>\n                      <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">Function</th>\n                      <th class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Technology</th>\n                      <th class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Employed</th>\n                      <th class=\"text-secondary opacity-7\"></th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2 py-1\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"avatar avatar-sm me-3\">\n                          </div>\n                          <div class=\"d-flex flex-column justify-content-center\">\n                            <h6 class=\"mb-0 text-xs\">John Michael</h6>\n                            <p class=\"text-xs text-secondary mb-0\">john@creative-tim.com</p>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-bold mb-0\">Manager</p>\n                        <p class=\"text-xs text-secondary mb-0\">Organization</p>\n                      </td>\n                      <td class=\"align-middle text-center text-sm\">\n                        <span class=\"badge badge-sm badge-success\">Online</span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <span class=\"text-secondary text-xs font-weight-normal\">23/04/18</span>\n                      </td>\n                      <td class=\"align-middle\">\n                        <a href=\"javascript:;\" class=\"text-secondary font-weight-normal text-xs\" data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                          Edit\n                        </a>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2 py-1\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"avatar avatar-sm me-3\">\n                          </div>\n                          <div class=\"d-flex flex-column justify-content-center\">\n                            <h6 class=\"mb-0 text-xs\">Alexa Liras</h6>\n                            <p class=\"text-xs text-secondary mb-0\">alexa@creative-tim.com</p>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-bold mb-0\">Programator</p>\n                        <p class=\"text-xs text-secondary mb-0\">Developer</p>\n                      </td>\n                      <td class=\"align-middle text-center text-sm\">\n                        <span class=\"badge badge-sm badge-secondary\">Offline</span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <span class=\"text-secondary text-xs font-weight-normal\">11/01/19</span>\n                      </td>\n                      <td class=\"align-middle\">\n                        <a href=\"#!\" class=\"text-secondary font-weight-normal text-xs\" data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                          Edit\n                        </a>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2 py-1\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"avatar avatar-sm me-3\">\n                          </div>\n                          <div class=\"d-flex flex-column justify-content-center\">\n                            <h6 class=\"mb-0 text-xs\">Laurent Perrier</h6>\n                            <p class=\"text-xs text-secondary mb-0\">laurent@creative-tim.com</p>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-bold mb-0\">Executive</p>\n                        <p class=\"text-xs text-secondary mb-0\">Projects</p>\n                      </td>\n                      <td class=\"align-middle text-center text-sm\">\n                        <span class=\"badge badge-sm badge-success\">Online</span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <span class=\"text-secondary text-xs font-weight-normal\">19/09/17</span>\n                      </td>\n                      <td class=\"align-middle\">\n                        <a href=\"#!\" class=\"text-secondary font-weight-normal text-xs\" data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                          Edit\n                        </a>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2 py-1\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"avatar avatar-sm me-3\">\n                          </div>\n                          <div class=\"d-flex flex-column justify-content-center\">\n                            <h6 class=\"mb-0 text-xs\">Michael Levi</h6>\n                            <p class=\"text-xs text-secondary mb-0\">michael@creative-tim.com</p>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-bold mb-0\">Programator</p>\n                        <p class=\"text-xs text-secondary mb-0\">Developer</p>\n                      </td>\n                      <td class=\"align-middle text-center text-sm\">\n                        <span class=\"badge badge-sm badge-success\">Online</span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <span class=\"text-secondary text-xs font-weight-normal\">24/12/08</span>\n                      </td>\n                      <td class=\"align-middle\">\n                        <a href=\"#!\" class=\"text-secondary font-weight-normal text-xs\" data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                          Edit\n                        </a>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2 py-1\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"avatar avatar-sm me-3\">\n                          </div>\n                          <div class=\"d-flex flex-column justify-content-center\">\n                            <h6 class=\"mb-0 text-xs\">Richard Gran</h6>\n                            <p class=\"text-xs text-secondary mb-0\">richard@creative-tim.com</p>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-bold mb-0\">Manager</p>\n                        <p class=\"text-xs text-secondary mb-0\">Executive</p>\n                      </td>\n                      <td class=\"align-middle text-center text-sm\">\n                        <span class=\"badge badge-sm badge-secondary\">Offline</span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <span class=\"text-secondary text-xs font-weight-normal\">04/10/21</span>\n                      </td>\n                      <td class=\"align-middle\">\n                        <a href=\"#!\" class=\"text-secondary font-weight-normal text-xs\" data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                          Edit\n                        </a>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2 py-1\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"avatar avatar-sm me-3\">\n                          </div>\n                          <div class=\"d-flex flex-column justify-content-center\">\n                            <h6 class=\"mb-0 text-xs\">Miriam Eric</h6>\n                            <p class=\"text-xs text-secondary mb-0\">miriam@creative-tim.com</p>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-bold mb-0\">Programtor</p>\n                        <p class=\"text-xs text-secondary mb-0\">Developer</p>\n                      </td>\n                      <td class=\"align-middle text-center text-sm\">\n                        <span class=\"badge badge-sm badge-secondary\">Offline</span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <span class=\"text-secondary text-xs font-weight-normal\">14/09/20</span>\n                      </td>\n                      <td class=\"align-middle\">\n                        <a href=\"#!\" class=\"text-secondary font-weight-normal text-xs\" data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                          Edit\n                        </a>\n                      </td>\n                    </tr>\n                  </tbody>\n                </table>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>table-responsive<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>table</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>table align-items-center mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>thead</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-uppercase text-secondary text-xxs font-weight-bolder opacity-7<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Author<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Function<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Technology<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Employed<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary opacity-7<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>thead</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tbody</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2 py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm me-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex flex-column justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>John Michael<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>john@creative-tim.com<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-bold mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Manager<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Organization<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-sm badge-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Online<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary text-xs font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>23/04/18<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>javascript:;<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary font-weight-normal text-xs<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit user<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Edit\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2 py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm me-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex flex-column justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Alexa Liras<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>alexa@creative-tim.com<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-bold mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Programator<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Developer<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-sm badge-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Offline<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary text-xs font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>11/01/19<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#!<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary font-weight-normal text-xs<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit user<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Edit\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2 py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm me-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex flex-column justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Laurent Perrier<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>laurent@creative-tim.com<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-bold mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Executive<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Projects<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-sm badge-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Online<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary text-xs font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>19/09/17<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#!<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary font-weight-normal text-xs<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit user<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Edit\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2 py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm me-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex flex-column justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Michael Levi<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>michael@creative-tim.com<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-bold mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Programator<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Developer<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-sm badge-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Online<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary text-xs font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>24/12/08<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#!<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary font-weight-normal text-xs<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit user<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Edit\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2 py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm me-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex flex-column justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Richard Gran<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>richard@creative-tim.com<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-bold mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Manager<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Executive<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-sm badge-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Offline<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary text-xs font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>04/10/21<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#!<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary font-weight-normal text-xs<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit user<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Edit\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2 py-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm me-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex flex-column justify-content-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Miriam Eric<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>miriam@creative-tim.com<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-bold mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Programtor<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Developer<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center text-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-sm badge-secondary<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Offline<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary text-xs font-weight-normal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>14/09/20<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#!<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-secondary font-weight-normal text-xs<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-original-title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Edit user<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Edit\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>a</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tbody</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>table</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"project-table\">Project Table</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"card\">\n              <div class=\"table-responsive\">\n                <table class=\"table align-items-center mb-0\">\n                  <thead>\n                    <tr>\n                      <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Project</th>\n                      <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">Budget</th>\n                      <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">Status</th>\n                      <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">Completion</th>\n                      <th></th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-spotify.svg\" class=\"avatar avatar-sm rounded-circle me-2\">\n                          </div>\n                          <div class=\"my-auto\">\n                            <h6 class=\"mb-0 text-xs\">Spotify</h6>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-normal mb-0\">$2,500</p>\n                      </td>\n                      <td>\n                        <span class=\"badge badge-dot me-4\">\n                          <i class=\"bg-info\"></i>\n                          <span class=\"text-dark text-xs\">working</span>\n                        </span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <div class=\"d-flex align-items-center\">\n                          <span class=\"me-2 text-xs\">60%</span>\n                        </div>\n                      </td>\n                      <td class=\"align-middle\">\n                        <button class=\"btn btn-link text-secondary mb-0\">\n                          <span class=\"material-icons\">\n                            more_vert\n                          </span>\n                        </button>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-invision.svg\" class=\"avatar avatar-sm rounded-circle me-2\">\n                          </div>\n                          <div class=\"my-auto\">\n                            <h6 class=\"mb-0 text-xs\">Invision</h6>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-normal mb-0\">$5,000</p>\n                      </td>\n                      <td>\n                        <span class=\"badge badge-dot me-4\">\n                          <i class=\"bg-success\"></i>\n                          <span class=\"text-dark text-xs\">done</span>\n                        </span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <div class=\"d-flex align-items-center\">\n                          <span class=\"me-2 text-xs\">100%</span>\n                        </div>\n                      </td>\n                      <td class=\"align-middle\">\n                        <button class=\"btn btn-link text-secondary mb-0\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                          <span class=\"material-icons\">\n                            more_vert\n                          </span>\n                        </button>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-jira.svg\" class=\"avatar avatar-sm rounded-circle me-2\">\n                          </div>\n                          <div class=\"my-auto\">\n                            <h6 class=\"mb-0 text-xs\">Jira</h6>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-normal mb-0\">$3,400</p>\n                      </td>\n                      <td>\n                        <span class=\"badge badge-dot me-4\">\n                          <i class=\"bg-danger\"></i>\n                          <span class=\"text-dark text-xs\">canceled</span>\n                        </span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <div class=\"d-flex align-items-center\">\n                          <span class=\"me-2 text-xs\">30%</span>\n                        </div>\n                      </td>\n                      <td class=\"align-middle\">\n                        <button class=\"btn btn-link text-secondary mb-0\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                          <span class=\"material-icons\">\n                            more_vert\n                          </span>\n                        </button>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-slack.svg\" class=\"avatar avatar-sm rounded-circle me-2\">\n                          </div>\n                          <div class=\"my-auto\">\n                            <h6 class=\"mb-0 text-xs\">Slack</h6>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-normal mb-0\">$1,000</p>\n                      </td>\n                      <td>\n                        <span class=\"badge badge-dot me-4\">\n                          <i class=\"bg-danger\"></i>\n                          <span class=\"text-dark text-xs\">canceled</span>\n                        </span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <div class=\"d-flex align-items-center\">\n                          <span class=\"me-2 text-xs\">0%</span>\n                        </div>\n                      </td>\n                      <td class=\"align-middle\">\n                        <button class=\"btn btn-link text-secondary mb-0\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                          <span class=\"material-icons\">\n                            more_vert\n                          </span>\n                        </button>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-webdev.svg\" class=\"avatar avatar-sm rounded-circle me-2\">\n                          </div>\n                          <div class=\"my-auto\">\n                            <h6 class=\"mb-0 text-xs\">Webdev</h6>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-normal mb-0\">$14,000</p>\n                      </td>\n                      <td>\n                        <span class=\"badge badge-dot me-4\">\n                          <i class=\"bg-info\"></i>\n                          <span class=\"text-dark text-xs\">working</span>\n                        </span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <div class=\"d-flex align-items-center\">\n                          <span class=\"me-2 text-xs\">80%</span>\n                        </div>\n                      </td>\n                      <td class=\"align-middle\">\n                        <button class=\"btn btn-link text-secondary mb-0\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                          <span class=\"material-icons\">\n                            more_vert\n                          </span>\n                        </button>\n                      </td>\n                    </tr>\n                    <tr>\n                      <td>\n                        <div class=\"d-flex px-2\">\n                          <div>\n                            <img src=\"https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-xd.svg\" class=\"avatar avatar-sm rounded-circle me-2\">\n                          </div>\n                          <div class=\"my-auto\">\n                            <h6 class=\"mb-0 text-xs\">Adobe XD</h6>\n                          </div>\n                        </div>\n                      </td>\n                      <td>\n                        <p class=\"text-xs font-weight-normal mb-0\">$2,300</p>\n                      </td>\n                      <td>\n                        <span class=\"badge badge-dot me-4\">\n                          <i class=\"bg-success\"></i>\n                          <span class=\"text-dark text-xs\">done</span>\n                        </span>\n                      </td>\n                      <td class=\"align-middle text-center\">\n                        <div class=\"d-flex align-items-center\">\n                          <span class=\"me-2 text-xs\">100%</span>\n                        </div>\n                      </td>\n                      <td class=\"align-middle\">\n                        <button class=\"btn btn-link text-secondary mb-0\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                          <span class=\"material-icons\">\n                            more_vert\n                          </span>\n                        </button>\n                      </td>\n                    </tr>\n                  </tbody>\n                </table>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>table-responsive<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>table</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>table align-items-center mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>thead</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-uppercase text-secondary text-xxs font-weight-bolder opacity-7<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Project<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Budget<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Status<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Completion<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>th</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>th</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>thead</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tbody</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-spotify.svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm rounded-circle me-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Spotify<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$2,500<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-dot me-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bg-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>working<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>me-2 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>60%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-secondary mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              more_vert\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-invision.svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm rounded-circle me-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Invision<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$5,000<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-dot me-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bg-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>me-2 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>100%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-secondary mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-haspopup</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              more_vert\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-jira.svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm rounded-circle me-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Jira<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$3,400<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-dot me-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bg-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>canceled<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>me-2 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>30%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-secondary mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-haspopup</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              more_vert\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-slack.svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm rounded-circle me-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Slack<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$1,000<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-dot me-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bg-danger<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>canceled<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>me-2 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>0%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-secondary mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-haspopup</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              more_vert\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-webdev.svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm rounded-circle me-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Webdev<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$14,000<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-dot me-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bg-info<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>working<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>me-2 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>80%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-secondary mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-haspopup</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              more_vert\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex px-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/small-logos/logo-xd.svg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>avatar avatar-sm rounded-circle me-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>my-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n                <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Adobe XD<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs font-weight-normal mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$2,300<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>badge badge-dot me-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bg-success<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>done<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex align-items-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>me-2 text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>100%<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>td</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>align-middle<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn btn-link text-secondary mb-0<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-haspopup</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-expanded</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>false<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              more_vert\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>td</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tr</span><span class=\"token punctuation\">&gt;</span></span>\n\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>tbody</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>table</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/components/tooltips.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Tooltips | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#position\">Position</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Tooltips\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">A Bootstrap tooltip plugin is a small pop-up element that appears while the user moves the mouse pointer over an element. <br> Keep reading these examples for adding custom tooltips with CSS and JavaScript using CSS3 for animations and data-attributes for local title storage.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"example\">Example</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <button type=\"button\" class=\"btn bg-gradient-primary btn-tooltip\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-container=\"body\" data-animation=\"true\" data-bs-original-title=\"Tooltip on top\">Primary</button>\n            <button type=\"button\" class=\"btn bg-gradient-info btn-tooltip\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-container=\"body\" data-animation=\"true\" data-bs-original-title=\"Tooltip on top\">Info</button>\n            <button type=\"button\" class=\"btn bg-gradient-success btn-tooltip\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-container=\"body\" data-animation=\"true\" data-bs-original-title=\"Tooltip on top\">Success</button>\n            <button type=\"button\" class=\"btn bg-gradient-warning btn-tooltip\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-container=\"body\" data-animation=\"true\" data-bs-original-title=\"Tooltip on top\">Warning</button>\n            <button type=\"button\" class=\"btn bg-gradient-danger btn-tooltip\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-container=\"body\" data-animation=\"true\" data-bs-original-title=\"Tooltip on top\">Danger</button>\n            <button type=\"button\" class=\"btn bg-gradient-default btn-tooltip\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-container=\"body\" data-animation=\"true\" data-bs-original-title=\"Tooltip on top\">Default</button>\n            <button type=\"button\" class=\"btn bg-gradient-secondary btn-tooltip\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-container=\"body\" data-animation=\"true\" data-bs-original-title=\"Tooltip on bottom\">Secondary</button>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary btn-tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Primary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-info btn-tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Info<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-success btn-tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Success<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-warning btn-tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Warning<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-danger btn-tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Danger<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-default btn-tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Default<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-secondary btn-tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-container</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>body<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-animation</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Secondary<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"position\">Position</h2>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <button type=\"button\" class=\"btn bg-gradient-primary\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"\" data-bs-original-title=\"Tooltip on top\">\n              Tooltip on top\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-primary\" data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" title=\"\" data-bs-original-title=\"Tooltip on right\">\n              Tooltip on right\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-primary\" data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" title=\"\" data-bs-original-title=\"Tooltip on bottom\">\n              Tooltip on bottom\n            </button>\n            <button type=\"button\" class=\"btn bg-gradient-primary\" data-bs-toggle=\"tooltip\" data-bs-placement=\"left\" title=\"\" data-bs-original-title=\"Tooltip on left\">\n              Tooltip on left\n            </button>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>top<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on top<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Tooltip on top\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>right<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on right<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Tooltip on right\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bottom<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on bottom<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Tooltip on bottom\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn bg-gradient-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>tooltip<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-placement</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>left<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Tooltip on left<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Tooltip on left\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/foundation/colors.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Colors | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"ct-docs-nav-sidenav-active \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#primary-colors\">Primary colors</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#light-neutrals\">Light neutrals</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Colors\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"primary-colors\">Primary colors</h2>\n          <p>Our primary palette is comprised of neutrals, white, and blue. These colors are present across most touch points from marketing to product.</p>\n          <div class=\"row\">\n            <div class=\"col-lg-4 col-md-6\">\n              <div class=\"color-swatch\">\n                <div class=\"color-swatch-header bg-primary\">\n                  <div class=\"pass-fail d-none\">\n                    <div class=\"pass-fail-item-wrap\">\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Fail</div>\n                        </div>\n                      </div>\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item white small\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Pass</div>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"color-swatch-body\">\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Name</div>\n                      <div class=\"value\">Primary</div>\n                    </div>\n                  </div>\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Hex</div>\n                      <div class=\"value\">#e91e63</div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-lg-4 col-md-6\">\n              <div class=\"color-swatch\">\n                <div class=\"color-swatch-header bg-secondary\">\n                  <div class=\"pass-fail d-none\">\n                    <div class=\"pass-fail-item-wrap\">\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Fail</div>\n                        </div>\n                      </div>\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item white small\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Pass</div>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"color-swatch-body\">\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Name</div>\n                      <div class=\"value\">Secondary</div>\n                    </div>\n                  </div>\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Hex</div>\n                      <div class=\"value\">#7b809a</div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-lg-4 col-md-6\">\n              <div class=\"color-swatch\">\n                <div class=\"color-swatch-header bg-info\">\n                  <div class=\"pass-fail d-none\">\n                    <div class=\"pass-fail-item-wrap\">\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Fail</div>\n                        </div>\n                      </div>\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item white small\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Pass</div>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"color-swatch-body\">\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Name</div>\n                      <div class=\"value\">Info</div>\n                    </div>\n                  </div>\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Hex</div>\n                      <div class=\"value\">#03a9f4</div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-lg-4 col-md-6\">\n              <div class=\"color-swatch\">\n                <div class=\"color-swatch-header bg-success\">\n                  <div class=\"pass-fail d-none\">\n                    <div class=\"pass-fail-item-wrap\">\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Fail</div>\n                        </div>\n                      </div>\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item white small\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Pass</div>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"color-swatch-body\">\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Name</div>\n                      <div class=\"value\">Success</div>\n                    </div>\n                  </div>\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Hex</div>\n                      <div class=\"value\">#4caf50</div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-lg-4 col-md-6\">\n              <div class=\"color-swatch\">\n                <div class=\"color-swatch-header bg-danger\">\n                  <div class=\"pass-fail d-none\">\n                    <div class=\"pass-fail-item-wrap\">\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Fail</div>\n                        </div>\n                      </div>\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item white small\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Pass</div>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"color-swatch-body\">\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Name</div>\n                      <div class=\"value\">Danger</div>\n                    </div>\n                  </div>\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Hex</div>\n                      <div class=\"value\">#f44335</div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"col-lg-4 col-md-6\">\n              <div class=\"color-swatch\">\n                <div class=\"color-swatch-header bg-warning\">\n                  <div class=\"pass-fail d-none\">\n                    <div class=\"pass-fail-item-wrap\">\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Fail</div>\n                        </div>\n                      </div>\n                      <div class=\"pass-fail-item-group\">\n                        <div class=\"pass-fail-item white small\">\n                          <div class=\"example\">A</div>\n                          <div class=\"lozenge\">Pass</div>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"color-swatch-body\">\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Name</div>\n                      <div class=\"value\">Warning</div>\n                    </div>\n                  </div>\n                  <div class=\"prop-item-wrap\">\n                    <div class=\"prop-item\">\n                      <div class=\"label\">Hex</div>\n                      <div class=\"value\">#fb8c00</div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <h2 id=\"light-neutrals\">Light neutrals</h2>\n          <p>Light neutrals are helpful for offsetting content in a primarily white layout without losing warmth and cleanliness, and are therefore often used as a background color for web components.</p>\n          <table class=\"table table-colors\">\n            <tbody>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #f8f9fa;\"></div>\n                  Gray 100\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #f8f9fa\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #e9ecef;\"></div>\n                  Gray 200\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #e9ecef\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #dee2e6;\"></div>\n                  Gray 300\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #dee2e6\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #ced4da;\"></div>\n                  Gray 400\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #ced4da\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #adb5bd;\"></div>\n                  Gray 500\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #adb5bd\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #6c757d;\"></div>\n                  Gray 600\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #6c757d\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #495057;\"></div>\n                  Gray 700\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #495057\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #343a40;\"></div>\n                  Gray 800\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #343a40\n                </td>\n              </tr>\n              <tr>\n                <td>\n                  <div class=\"swatch\" style=\"background-color: #212529;\"></div>\n                  Gray 900\n                </td>\n                <td>\n                  <div class=\"lozenge\">Hex</div>\n                  #212529\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/foundation/grid.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Grid | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/grid/material-dashboard\" />\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#grid-system\">Grid System</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#grid-options\">Grid Options</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#auto-layout-columns\">Auto-layout columns</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#equal-width\">Equal-width</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#setting-one-column-width\">Setting one column width</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#variable-width-content\">Variable width content</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#equal-width-multi-row\">Equal-width multi-row</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#responsive-classes\">Responsive Classes</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#breakpoints\">Breakpoints</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#stacked-to-horizontal\">Stacked to horizontal</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#mix-and-match\">Mix and match</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#layout\">Layout</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#container\">Container</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Grid\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Our Bootstrap grid is a powerful mobile-first flexbox grid which helps you build layouts of all shapes and sizes thanks to a twelve column system, five default responsive tiers, Sass variables and mixins, and dozens of predefined classes.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"grid-system\">Grid System</h2>\n          <p>Bootstrap grid system uses a series of containers, rows, and columns to layout and aligns content. It’s built with <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox\" rel=\"nofollow\" target=\"_blank\">flexbox</a> and is fully responsive. Below is an example and an in-depth look at how the grid comes together.</p>\n          <p><strong>New to or unfamiliar with flexbox?</strong> <a href=\"https://css-tricks.com/snippets/css/a-guide-to-flexbox/#flexbox-background\" rel=\"nofollow\" target=\"_blank\">Read this CSS Tricks flexbox guide</a> for background, terminology, guidelines, and code snippets.</p>\n          <div class=\"ct-example-row\">\n            <div class=\"container\">\n              <div class=\"row\">\n                <div class=\"col-sm\">\n                  <span>One of three columns</span>\n                </div>\n                <div class=\"col-sm\">\n                  <span>One of three columns</span>\n                </div>\n                <div class=\"col-sm\">\n                  <span>One of three columns</span>\n                </div>\n              </div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>One of three columns<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>One of three columns<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>One of three columns<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <p>The above example creates three equal-width columns on small, medium, large, and extra large devices using our predefined grid classes. Those columns are centered in the page with the parent <code class=\" highlighter-rouge language-plaintext\">.container</code>.</p>\n          <h2 id=\"grid-options\">Grid Options</h2>\n          <p>While Bootstrap uses <code class=\" highlighter-rouge language-plaintext\">em</code>s or <code class=\" highlighter-rouge language-plaintext\">rem</code>s for defining most sizes, <code class=\" highlighter-rouge language-plaintext\">px</code>s are used for grid breakpoints and container widths. This is because the viewport width is in pixels and does not change with the <a href=\"https://drafts.csswg.org/mediaqueries-3/#units\" rel=\"nofollow\" target=\"_blank\">font size</a>.</p>\n          <p>See how aspects of the Bootstrap grid system work across multiple devices with a handy table.</p>\n          <table class=\"table table-bordered table-striped\">\n            <thead>\n              <tr>\n                <th></th>\n                <th class=\"text-center\">\n                  Extra small<br>\n                  <small>&lt;576px</small>\n                </th>\n                <th class=\"text-center\">\n                  Small<br>\n                  <small>≥576px</small>\n                </th>\n                <th class=\"text-center\">\n                  Medium<br>\n                  <small>≥768px</small>\n                </th>\n                <th class=\"text-center\">\n                  Large<br>\n                  <small>≥992px</small>\n                </th>\n                <th class=\"text-center\">\n                  Extra large<br>\n                  <small>≥1200px</small>\n                </th>\n                <th class=\"text-center\">\n                  XXL<br>\n                  <small>≥1400px</small>\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr>\n                <th class=\"text-nowrap\" scope=\"row\">Max container width</th>\n                <td>None (auto)</td>\n                <td>540px</td>\n                <td>720px</td>\n                <td>960px</td>\n                <td>1140px</td>\n                <td>1320px</td>\n              </tr>\n              <tr>\n                <th class=\"text-nowrap\" scope=\"row\">Class prefix</th>\n                <td><code>.col-</code></td>\n                <td><code>.col-sm-</code></td>\n                <td><code>.col-md-</code></td>\n                <td><code>.col-lg-</code></td>\n                <td><code>.col-xl-</code></td>\n                <td><code>.col-xxl-</code></td>\n              </tr>\n              <tr>\n                <th class=\"text-nowrap\" scope=\"row\"># of columns</th>\n                <td colspan=\"6\">12</td>\n              </tr>\n              <tr>\n                <th class=\"text-nowrap\" scope=\"row\">Gutter width</th>\n                <td colspan=\"6\">30px (15px on each side of a column)</td>\n              </tr>\n              <tr>\n                <th class=\"text-nowrap\" scope=\"row\">Nestable</th>\n                <td colspan=\"6\">Yes</td>\n              </tr>\n              <tr>\n                <th class=\"text-nowrap\" scope=\"row\">Column ordering</th>\n                <td colspan=\"6\">Yes</td>\n              </tr>\n            </tbody>\n          </table>\n          <h2 id=\"auto-layout-columns\">Auto-layout columns</h2>\n          <p>Utilize breakpoint-specific column classes for easy column sizing without an explicit numbered class like <code class=\" highlighter-rouge language-plaintext\">.col-sm-6</code>.</p>\n          <h3 id=\"equal-width\">Equal-width</h3>\n          <p>For example, here are two grid layouts that apply to every device and viewport, from <code class=\" highlighter-rouge language-plaintext\">xs</code> to <code class=\" highlighter-rouge language-plaintext\">xl</code>. Add any number of unit-less classes for each breakpoint you need and every column will be the same width.</p>\n          <div class=\"ct-example-row\">\n            <div class=\"container\">\n              <div class=\"row\">\n                <div class=\"col\">\n                  <span>1 of 2</span>\n                </div>\n                <div class=\"col\">\n                  <span>2 of 2</span>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col\">\n                  <span>1 of 3</span>\n                </div>\n                <div class=\"col\">\n                  <span>2 of 3</span>\n                </div>\n                <div class=\"col\">\n                  <span>3 of 3</span>\n                </div>\n              </div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>1 of 2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>2 of 2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>1 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>2 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>3 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <p>Equal-width columns can be broken into multiple lines, but there was a <a href=\"https://github.com/philipwalton/flexbugs#flexbug-11\" rel=\"nofollow\" target=\"_blank\">Safari flexbox bug</a> that prevented this from working without an explicit <code class=\" highlighter-rouge language-plaintext\">flex-basis</code> or <code class=\" highlighter-rouge language-plaintext\">border</code>. There are workarounds for older browser versions, but they shouldn’t be necessary if you’re up-to-date.</p>\n          <div class=\"ct-example-row\">\n            <div class=\"container\">\n              <div class=\"row\">\n                <div class=\"col\"><span>Column</span></div>\n                <div class=\"col\"><span>Column</span></div>\n                <div class=\"w-100\"></div>\n                <div class=\"col\"><span>Column</span></div>\n                <div class=\"col\"><span>Column</span></div>\n              </div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Column<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Column<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>w-100<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Column<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Column<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <h3 id=\"setting-one-column-width\">Setting one column width</h3>\n          <p>Auto-layout for flexbox grid columns also means you can set the width of one column and have the sibling columns automatically resize around it. You may use predefined grid classes (as shown below), grid mixins, or inline widths. Note that the other columns will resize no matter the width of the center column.</p>\n          <div class=\"ct-example-row\">\n            <div class=\"container\">\n              <div class=\"row\">\n                <div class=\"col\">\n                  <span>1 of 3</span>\n                </div>\n                <div class=\"col-6\">\n                  <span>2 of 3 (wider)</span>\n                </div>\n                <div class=\"col\">\n                  <span>3 of 3</span>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col\">\n                  <span>1 of 3</span>\n                </div>\n                <div class=\"col-5\">\n                  <span>2 of 3 (wider)</span>\n                </div>\n                <div class=\"col\">\n                  <span>3 of 3</span>\n                </div>\n              </div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>1 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>2 of 3 (wider)<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>3 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>1 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>2 of 3 (wider)<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>3 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <h3 id=\"variable-width-content\">Variable width content</h3>\n          <p>Use <code class=\" highlighter-rouge language-plaintext\">col-{breakpoint}-auto</code> classes to size columns based on the natural width of their content.</p>\n          <div class=\"ct-example-row\">\n            <div class=\"container\">\n              <div class=\"row justify-content-md-center\">\n                <div class=\"col col-lg-2\">\n                  <span>1 of 3</span>\n                </div>\n                <div class=\"col-md-auto\">\n                  <span>Variable width content</span>\n                </div>\n                <div class=\"col col-lg-2\">\n                  <span>3 of 3</span>\n                </div>\n              </div>\n              <div class=\"row\">\n                <div class=\"col\">\n                  <span>1 of 3</span>\n                </div>\n                <div class=\"col-md-auto\">\n                  <span>Variable width content</span>\n                </div>\n                <div class=\"col col-lg-2\">\n                  <span>3 of 3</span>\n                </div>\n              </div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row justify-content-md-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col col-lg-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>1 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Variable width content<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col col-lg-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>3 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>1 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-md-auto<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>Variable width content<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col col-lg-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>3 of 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <h3 id=\"equal-width-multi-row\">Equal-width multi-row</h3>\n          <p>Create equal-width columns that span multiple rows by inserting a <code class=\" highlighter-rouge language-plaintext\">.w-100</code> where you want the columns to break to a new line. Make the breaks responsive by mixing the <code class=\" highlighter-rouge language-plaintext\">.w-100</code> with some responsive display utilities.</p>\n          <div class=\"ct-example-row\">\n            <div class=\"row\">\n              <div class=\"col\"><span>col</span></div>\n              <div class=\"col\"><span>col</span></div>\n              <div class=\"w-100\"></div>\n              <div class=\"col\"><span>col</span></div>\n              <div class=\"col\"><span>col</span></div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>w-100<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <h2 id=\"responsive-classes\">Responsive Classes</h2>\n          <p>Bootstrap’s grid includes five tiers of predefined classes for building complex responsive layouts. Customize the size of your columns on extra small, small, medium, large, or extra large devices however you see fit.</p>\n          <h3 id=\"breakpoints\">Breakpoints</h3>\n          <p>For grids that are the same from the smallest of devices to the largest, use the <code class=\" highlighter-rouge language-plaintext\">.col</code> and <code class=\" highlighter-rouge language-plaintext\">.col-*</code> classes. Specify a numbered class when you need a particularly sized column; otherwise, feel free to stick to <code class=\" highlighter-rouge language-plaintext\">.col</code>.</p>\n          <div class=\"ct-example-row\">\n            <div class=\"row\">\n              <div class=\"col\"><span>col</span></div>\n              <div class=\"col\"><span>col</span></div>\n              <div class=\"col\"><span>col</span></div>\n              <div class=\"col\"><span>col</span></div>\n            </div>\n            <div class=\"row\">\n              <div class=\"col-8\"><span>col-8</span></div>\n              <div class=\"col-4\"><span>col-4</span></div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col-8<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col-4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <h3 id=\"stacked-to-horizontal\">Stacked to horizontal</h3>\n          <p>Using a single set of <code class=\" highlighter-rouge language-plaintext\">.col-sm-*</code> classes, you can create a basic grid system that starts out stacked and becomes horizontal at the small breakpoint (<code class=\" highlighter-rouge language-plaintext\">sm</code>).</p>\n          <div class=\"ct-example-row\">\n            <div class=\"row\">\n              <div class=\"col-sm-8\"><span>col-sm-8</span></div>\n              <div class=\"col-sm-4\"><span>col-sm-4</span></div>\n            </div>\n            <div class=\"row\">\n              <div class=\"col-sm\"><span>col-sm</span></div>\n              <div class=\"col-sm\"><span>col-sm</span></div>\n              <div class=\"col-sm\"><span>col-sm</span></div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col-sm-8<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col-sm-4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col-sm<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col-sm<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>col-sm<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <h3 id=\"mix-and-match\">Mix and match</h3>\n          <p>Don’t want your columns to simply stack in some grid tiers? Use a combination of different classes for each tier as needed. See the example below for a better idea of how it all works.</p>\n          <div class=\"ct-example-row\">\n            <!-- Stack the columns on mobile by making one full-width and the other half-width -->\n            <div class=\"row\">\n              <div class=\"col-12 col-md-8\"><span>.col-12 .col-md-8</span></div>\n              <div class=\"col-6 col-md-4\"><span>.col-6 .col-md-4</span></div>\n            </div>\n            <!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop -->\n            <div class=\"row\">\n              <div class=\"col-6 col-md-4\"><span>.col-6 .col-md-4</span></div>\n              <div class=\"col-6 col-md-4\"><span>.col-6 .col-md-4</span></div>\n              <div class=\"col-6 col-md-4\"><span>.col-6 .col-md-4</span></div>\n            </div>\n            <!-- Columns are always 50% wide, on mobile and desktop -->\n            <div class=\"row\">\n              <div class=\"col-6\"><span>.col-6</span></div>\n              <div class=\"col-6\"><span>.col-6</span></div>\n            </div>\n            <div class=\"position-relative\">\n              <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token comment\">&lt;!-- Stack the columns on mobile by making one full-width and the other half-width --&gt;</span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-12 col-md-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>.col-12 .col-md-8<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-6 col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>.col-6 .col-md-4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token comment\">&lt;!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop --&gt;</span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-6 col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>.col-6 .col-md-4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-6 col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>.col-6 .col-md-4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-6 col-md-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>.col-6 .col-md-4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token comment\">&lt;!-- Columns are always 50% wide, on mobile and desktop --&gt;</span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>.col-6<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span><span class=\"token punctuation\">&gt;</span></span>.col-6<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n              </figure>\n            </div>\n          </div>\n          <h2 id=\"layout\">Layout</h2>\n          <p>For faster mobile-friendly and responsive development, Bootstrap includes dozens of utility classes for showing, hiding, aligning, and spacing content.</p>\n          <h2 id=\"container\">Container</h2>\n          <p>Containers are the most basic layout element in Bootstrap and are required when using our default grid system. Containers are used to contain, pad, and (sometimes) center the content within them. While containers can be nested, most layouts do not require a nested container.</p>\n          <p>Bootstrap comes with three different containers:</p>\n          <ul>\n            <li><code class=\" highlighter-rouge language-plaintext\">.container</code>, which sets a max-width at each responsive breakpoint</li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.container-fluid</code>, which is width: 100% at all breakpoints</li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.container-{breakpoint}</code>, which is width: 100% until the specified breakpoint</li>\n          </ul>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/foundation/icons.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Icons | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/icons/material-dashboard\" />\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#material-icons\">Material Icons</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#font-awesome-5\">Font Awesome 5</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#usage\">Usage</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#initialization\">Initialization</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#icons\">Icons</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap-glyphicons\">Bootstrap Glyphicons</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Icons\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Through most of the examples in this kit, we have used the default Icons for the Material Design provided by Google.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"material-icons\">Material Icons</h2>\n          <p>Through most of the examples in this dashboard, we have used the default <a href=\"https://fonts.google.com/icons\" target=\"_blank\" rel=\"nofollow\">Icons for the Material Design</a> provided by Google.</p>\n          <div class=\"ct-example\">\n            <i class=\"material-icons\">face</i>\n          </div>\n          <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>material-icons<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>face<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n          </figure>\n          <h2 id=\"font-awesome-5\">Font Awesome 5</h2>\n          <p>Optionally, Material Dashboard comes with Font Awesome which means 3000+ more vector icons made for you to use.</p>\n          <h3 id=\"usage\">Usage</h3>\n          <p>In order to use this icons on your page you will need to include the following script in the <code class=\" highlighter-rouge language-plaintext\">&lt;head&gt;</code> section of your page before the theme’s main style:</p>\n          <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>link</span> <span class=\"token attr-name\">href</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>/assets/vendor/@fortawesome/fontawesome-free/css/all.min.css<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">rel</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>stylesheet<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n          </figure>\n          <h3 id=\"initialization\">Initialization</h3>\n          <p>Start placing icons in your HTML’s <code class=\" highlighter-rouge language-plaintext\">&lt;body&gt;</code>. We recommend using a consistent HTML element, like <code class=\" highlighter-rouge language-plaintext\">&lt;i&gt;</code>. Find the right icon and learn how to reference it in your markup.</p>\n          <p>You need to know two bits of information to reference an icon:</p>\n          <ol>\n            <li>its name, prefixed with fa- and</li>\n            <li>the style you want to use’s corresponding prefix.</li>\n          </ol>\n          <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fas fa-heart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n          </figure>\n          <h3 id=\"icons\">Icons</h3>\n          <p>Get the icon you need on the official website:</p>\n          <p><a href=\"https://fontawesome.com/\" rel=\"nofollow\" target=\"_blank\" class=\"btn bg-gradient-primary\"> Go to Font Awesome</a></p>\n          <h2 id=\"bootstrap-glyphicons\">Bootstrap Glyphicons</h2>\n          <p>Another option for icons are <a href=\"https://www.glyphicons.com/sets/halflings/\" rel=\"nofollow\" target=\"_blank\"> Glyphicons</a>.</p>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/foundation/typography.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Typography | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/typography/material-dashboard\" />\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#headings\">Headings</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#customizing-headings\">Customizing headings</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#display-headings\">Display Headings</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#lead\">Lead</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#inline-text-elements\">Inline text elements</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#text-utilities\">Text utilities</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#abbreviations\">Abbreviations</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#blockquotes\">Blockquotes</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#naming-a-source\">Naming a source</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#alignment\">Alignment</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#lists\">Lists</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#unstyled\">Unstyled</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#inline\">Inline</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#description-list-alignment\">Description list alignment</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#responsive-typography\">Responsive Typography</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Typography\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Documentation and examples for Bootstrap typography, including global settings, headings, body text, lists, and more.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"headings\">Headings</h2>\n          <p>All HTML headings, <code class=\" highlighter-rouge language-plaintext\">&lt;h1&gt;</code> through <code class=\" highlighter-rouge language-plaintext\">&lt;h6&gt;</code>, are available.</p>\n          <table>\n            <thead>\n              <tr>\n                <th>Heading</th>\n                <th>Example</th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr>\n                <td>\n                  <p><code class=\" highlighter-rouge language-plaintext\">&lt;h1&gt;&lt;/h1&gt;</code></p>\n                </td>\n                <td><span class=\"h1\">h1. Bootstrap heading</span></td>\n              </tr>\n              <tr>\n                <td>\n                  <p><code class=\" highlighter-rouge language-plaintext\">&lt;h2&gt;&lt;/h2&gt;</code></p>\n                </td>\n                <td><span class=\"h2\">h2. Bootstrap heading</span></td>\n              </tr>\n              <tr>\n                <td>\n                  <p><code class=\" highlighter-rouge language-plaintext\">&lt;h3&gt;&lt;/h3&gt;</code></p>\n                </td>\n                <td><span class=\"h3\">h3. Bootstrap heading</span></td>\n              </tr>\n              <tr>\n                <td>\n                  <p><code class=\" highlighter-rouge language-plaintext\">&lt;h4&gt;&lt;/h4&gt;</code></p>\n                </td>\n                <td><span class=\"h4\">h4. Bootstrap heading</span></td>\n              </tr>\n              <tr>\n                <td>\n                  <p><code class=\" highlighter-rouge language-plaintext\">&lt;h5&gt;&lt;/h5&gt;</code></p>\n                </td>\n                <td><span class=\"h5\">h5. Bootstrap heading</span></td>\n              </tr>\n              <tr>\n                <td>\n                  <p><code class=\" highlighter-rouge language-plaintext\">&lt;h6&gt;&lt;/h6&gt;</code></p>\n                </td>\n                <td><span class=\"h6\">h6. Bootstrap heading</span></td>\n              </tr>\n            </tbody>\n          </table>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span><span class=\"token punctuation\">&gt;</span></span>h1. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h2</span><span class=\"token punctuation\">&gt;</span></span>h2. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h2</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h3</span><span class=\"token punctuation\">&gt;</span></span>h3. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h3</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span><span class=\"token punctuation\">&gt;</span></span>h4. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span><span class=\"token punctuation\">&gt;</span></span>h5. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span><span class=\"token punctuation\">&gt;</span></span>h6. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <p><code class=\" highlighter-rouge language-plaintext\">.h1</code> through <code class=\" highlighter-rouge language-plaintext\">.h6</code> classes are also available, for when you want to match the font styling of a heading but cannot use the associated HTML element.</p>\n          <div class=\"ct-example\">\n            <p class=\"h1\">h1. Bootstrap heading</p>\n            <p class=\"h2\">h2. Bootstrap heading</p>\n            <p class=\"h3\">h3. Bootstrap heading</p>\n            <p class=\"h4\">h4. Bootstrap heading</p>\n            <p class=\"h5\">h5. Bootstrap heading</p>\n            <p class=\"h6\">h6. Bootstrap heading</p>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>h1. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>h2. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>h3. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>h4. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>h5. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h6<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>h6. Bootstrap heading<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"customizing-headings\">Customizing headings</h3>\n          <p>Use the included utility classes to recreate the small secondary heading text from Bootstrap 3.</p>\n          <div class=\"ct-example\">\n            <span class=\"h3\">\n              Fancy display heading\n              <small class=\"text-muted\">With faded secondary text</small>\n            </span>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h3</span><span class=\"token punctuation\">&gt;</span></span>\n  Fancy display heading\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>small</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-muted<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>With faded secondary text<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>small</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h3</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"display-headings\">Display Headings</h2>\n          <p>Traditional heading elements are designed to work best in the meat of your page content. When you need a heading to stand out, consider using a <strong>display heading</strong>—a larger, slightly more opinionated heading style.</p>\n          <div class=\"ct-example bd-example-type\">\n            <table class=\"table\">\n              <tbody>\n                <tr>\n                  <td><span class=\"display-1\">Display 1</span></td>\n                </tr>\n                <tr>\n                  <td><span class=\"display-2\">Display 2</span></td>\n                </tr>\n                <tr>\n                  <td><span class=\"display-3\">Display 3</span></td>\n                </tr>\n                <tr>\n                  <td><span class=\"display-4\">Display 4</span></td>\n                </tr>\n              </tbody>\n            </table>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>display-1<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Display 1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>display-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Display 2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>display-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Display 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>display-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Display 4<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"lead\">Lead</h2>\n          <p>Make a paragraph stand out by adding <code class=\" highlighter-rouge language-plaintext\">.lead</code>.</p>\n          <div class=\"ct-example\">\n            <p class=\"lead\">\n              Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.\n            </p>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>lead<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"inline-text-elements\">Inline text elements</h2>\n          <p>Styling for common inline HTML5 elements.</p>\n          <div class=\"ct-example\">\n            <p>You can use the mark tag to <mark>highlight</mark> text.</p>\n            <p><del>This line of text is meant to be treated as deleted text.</del></p>\n            <p><s>This line of text is meant to be treated as no longer accurate.</s></p>\n            <p><ins>This line of text is meant to be treated as an addition to the document.</ins></p>\n            <p><u>This line of text will render as underlined</u></p>\n            <p><small>This line of text is meant to be treated as fine print.</small></p>\n            <p><strong>This line rendered as bold text.</strong></p>\n            <p><em>This line rendered as italicized text.</em></p>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>You can use the mark tag to <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>mark</span><span class=\"token punctuation\">&gt;</span></span>highlight<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>mark</span><span class=\"token punctuation\">&gt;</span></span> text.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>del</span><span class=\"token punctuation\">&gt;</span></span>This line of text is meant to be treated as deleted text.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>del</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>s</span><span class=\"token punctuation\">&gt;</span></span>This line of text is meant to be treated as no longer accurate.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>s</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ins</span><span class=\"token punctuation\">&gt;</span></span>This line of text is meant to be treated as an addition to the document.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ins</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>u</span><span class=\"token punctuation\">&gt;</span></span>This line of text will render as underlined<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>u</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>small</span><span class=\"token punctuation\">&gt;</span></span>This line of text is meant to be treated as fine print.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>small</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>strong</span><span class=\"token punctuation\">&gt;</span></span>This line rendered as bold text.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>strong</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>em</span><span class=\"token punctuation\">&gt;</span></span>This line rendered as italicized text.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>em</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <p><code class=\" highlighter-rouge language-plaintext\">.mark</code> and <code class=\" highlighter-rouge language-plaintext\">.small</code> classes are also available to apply the same styles as <code class=\" highlighter-rouge language-plaintext\">&lt;mark&gt;</code> and <code class=\" highlighter-rouge language-plaintext\">&lt;small&gt;</code> while avoiding any unwanted semantic implications that the tags would bring.</p>\n          <p>While not shown above, feel free to use <code class=\" highlighter-rouge language-plaintext\">&lt;b&gt;</code> and <code class=\" highlighter-rouge language-plaintext\">&lt;i&gt;</code> in HTML5. <code class=\" highlighter-rouge language-plaintext\">&lt;b&gt;</code> is meant to highlight words or phrases without conveying additional importance while <code class=\" highlighter-rouge language-plaintext\">&lt;i&gt;</code> is mostly for voice, technical terms, etc.</p>\n          <h2 id=\"text-utilities\">Text utilities</h2>\n          <p>Change text alignment, transform, style, weight, and color with our text utilities and color utilities.</p>\n          <h2 id=\"abbreviations\">Abbreviations</h2>\n          <p>Stylized implementation of HTML’s <code class=\" highlighter-rouge language-plaintext\">&lt;abbr&gt;</code> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations have a default underline and gain a help cursor to provide additional context on hover and to users of assistive technologies.</p>\n          <p>Add <code class=\" highlighter-rouge language-plaintext\">.initialism</code> to an abbreviation for a slightly smaller font-size.</p>\n          <div class=\"ct-example\">\n            <p><abbr title=\"attribute\">attr</abbr></p>\n            <p><abbr title=\"HyperText Markup Language\" class=\"initialism\">HTML</abbr></p>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>abbr</span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>attribute<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>attr<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>abbr</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>abbr</span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>HyperText Markup Language<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>initialism<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>HTML<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>abbr</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"blockquotes\">Blockquotes</h2>\n          <p>For quoting blocks of content from another source within your document. Wrap <code class=\" highlighter-rouge language-plaintext\">&lt;blockquote class=\"blockquote\"&gt;</code> around any <abbr title=\"HyperText Markup Language\">HTML</abbr> as the quote.</p>\n          <div class=\"ct-example\">\n            <blockquote class=\"blockquote\">\n              <p class=\"mb-0 ps-2\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>\n            </blockquote>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>blockquote</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-0 ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>blockquote</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"naming-a-source\">Naming a source</h3>\n          <p>Add a <code class=\" highlighter-rouge language-plaintext\">&lt;figcaption class=\"blockquote-footer\"&gt;</code> for identifying the source.</p>\n          <div class=\"ct-example\">\n            <figure>\n              <blockquote class=\"blockquote\">\n                <p class=\"ps-2\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>\n              </blockquote>\n              <figcaption class=\"blockquote-footer ps-3\">\n                Someone famous in <cite title=\"Source Title\">Source Title</cite>\n              </figcaption>\n            </figure>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figure</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>blockquote</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>blockquote</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figcaption</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote-footer ps-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Someone famous in <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>cite</span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Source Title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Source Title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>cite</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>figcaption</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>figure</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"alignment\">Alignment</h3>\n          <p>Use text utilities as needed to change the alignment of your blockquote.</p>\n          <div class=\"ct-example\">\n            <figure>\n              <blockquote class=\"blockquote text-center\">\n                <p class=\"ps-2\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>\n              </blockquote>\n              <figcaption class=\"blockquote-footer text-center\">\n                Someone famous in <cite title=\"Source Title\">Source Title</cite>\n              </figcaption>\n            </figure>\n            <figure>\n              <blockquote class=\"blockquote text-right\">\n                <p class=\"ps-2\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>\n              </blockquote>\n              <figcaption class=\"blockquote-footer text-right\">\n                Someone famous in <cite title=\"Source Title\">Source Title</cite>\n              </figcaption>\n            </figure>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figure</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>blockquote</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>blockquote</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figcaption</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote-footer text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Someone famous in <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>cite</span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Source Title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Source Title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>cite</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>figcaption</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>figure</span><span class=\"token punctuation\">&gt;</span></span>\n\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figure</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>blockquote</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote text-right<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>blockquote</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figcaption</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>blockquote-footer text-right<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    Someone famous in <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>cite</span> <span class=\"token attr-name\">title</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Source Title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Source Title<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>cite</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>figcaption</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>figure</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"lists\">Lists</h2>\n          <h3 id=\"unstyled\">Unstyled</h3>\n          <p>Remove the default <code class=\" highlighter-rouge language-plaintext\">list-style</code> and left margin on list items (immediate children only). <strong>This only applies to immediate children list items</strong>, meaning you will need to add the class for any nested lists as well.</p>\n          <div class=\"ct-example\">\n            <ul class=\"list-unstyled\">\n              <li>Lorem ipsum dolor sit amet</li>\n              <li>Consectetur adipiscing elit</li>\n              <li>Integer molestie lorem at massa</li>\n              <li>Facilisis in pretium nisl aliquet</li>\n              <li>Nulla volutpat aliquam velit\n                <ul>\n                  <li>Phasellus iaculis neque</li>\n                  <li>Purus sodales ultricies</li>\n                  <li>Vestibulum laoreet porttitor sem</li>\n                  <li>Ac tristique libero volutpat at</li>\n                </ul>\n              </li>\n              <li>Faucibus porta lacus fringilla vel</li>\n              <li>Aenean sit amet erat nunc</li>\n              <li>Eget porttitor lorem</li>\n            </ul>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-unstyled<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor sit amet<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Consectetur adipiscing elit<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Integer molestie lorem at massa<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Facilisis in pretium nisl aliquet<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Nulla volutpat aliquam velit\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Phasellus iaculis neque<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Purus sodales ultricies<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Vestibulum laoreet porttitor sem<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Ac tristique libero volutpat at<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Faucibus porta lacus fringilla vel<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Aenean sit amet erat nunc<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span><span class=\"token punctuation\">&gt;</span></span>Eget porttitor lorem<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"inline\">Inline</h3>\n          <p>Remove a list’s bullets and apply some light <code class=\" highlighter-rouge language-plaintext\">margin</code> with a combination of two classes, <code class=\" highlighter-rouge language-plaintext\">.list-inline</code> and <code class=\" highlighter-rouge language-plaintext\">.list-inline-item</code>.</p>\n          <div class=\"ct-example\">\n            <ul class=\"list-inline\">\n              <li class=\"list-inline-item\">Lorem ipsum</li>\n              <li class=\"list-inline-item\">Phasellus iaculis</li>\n              <li class=\"list-inline-item\">Nulla volutpat</li>\n            </ul>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>ul</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-inline<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-inline-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-inline-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Phasellus iaculis<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>li</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>list-inline-item<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Nulla volutpat<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>li</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>ul</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"description-list-alignment\">Description list alignment</h3>\n          <p>Align terms and descriptions horizontally by using our grid system’s predefined classes (or semantic mixins). For longer terms, you can optionally add a <code class=\" highlighter-rouge language-plaintext\">.text-truncate</code> class to truncate the text with an ellipsis.</p>\n          <div class=\"ct-example\">\n            <dl class=\"row\">\n              <dt class=\"col-sm-3\">Description lists</dt>\n              <dd class=\"col-sm-9\">A description list is perfect for defining terms.</dd>\n              <dt class=\"col-sm-3\">Euismod</dt>\n              <dd class=\"col-sm-9\">\n                <p>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</p>\n                <p>Donec id elit non mi porta gravida at eget metus.</p>\n              </dd>\n              <dt class=\"col-sm-3\">Malesuada porta</dt>\n              <dd class=\"col-sm-9\">Etiam porta sem malesuada magna mollis euismod.</dd>\n              <dt class=\"col-sm-3 text-truncate\">Truncated term is truncated</dt>\n              <dd class=\"col-sm-9\">Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</dd>\n              <dt class=\"col-sm-3\">Nesting</dt>\n              <dd class=\"col-sm-9\">\n                <dl class=\"row\">\n                  <dt class=\"col-sm-4\">Nested definition list</dt>\n                  <dd class=\"col-sm-8\">Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.</dd>\n                </dl>\n              </dd>\n            </dl>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dl</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dt</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Description lists<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dt</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dd</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-9<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>A description list is perfect for defining terms.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dd</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dt</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Euismod<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dt</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dd</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-9<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Donec id elit non mi porta gravida at eget metus.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dd</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dt</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Malesuada porta<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dt</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dd</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-9<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Etiam porta sem malesuada magna mollis euismod.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dd</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dt</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-3 text-truncate<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Truncated term is truncated<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dt</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dd</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-9<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dd</span><span class=\"token punctuation\">&gt;</span></span>\n\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dt</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Nesting<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dt</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dd</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-9<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dl</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dt</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Nested definition list<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dt</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>dd</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-8<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dd</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dl</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dd</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>dl</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"responsive-typography\">Responsive Typography</h2>\n          <p><em>Responsive typography</em> refers to scaling text and components by simply adjusting the root element’s <code class=\" highlighter-rouge language-plaintext\">font-size</code> within a series of media queries. Bootstrap doesn’t do this for you, but it’s fairly easy to add if you need it.</p>\n          <p>Here’s an example of it in practice. Choose whatever <code class=\" highlighter-rouge language-plaintext\">font-size</code>s and media queries you wish.</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-scss\"><code class=\" language-scss\" data-lang=\"scss\">html {\n  font-size: 1rem;\n}\n\n@include media-breakpoint-up(sm) {\n  html {\n    font-size: 1.2rem;\n  }\n}\n\n@include media-breakpoint-up(md) {\n  html {\n    font-size: 1.4rem;\n  }\n}\n\n@include media-breakpoint-up(lg) {\n  html {\n    font-size: 1.6rem;\n  }\n}</code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/foundation/utilities.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Utilities | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/utilities/material-dashboard\" />\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap-flexbox\">Bootstrap Flexbox</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-align-left\">Bootstrap Align Left</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-align-center\">Bootstrap Align Center</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-align-right\">Bootstrap Align Right</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap-text-alignment\">Bootstrap Text Alignment</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-text-left\">Bootstrap Text Left</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-text-center\">Bootstrap Text Center</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-text-right\">Bootstrap Text Right</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap-responsive-image\">Bootstrap Responsive Image</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Utilities\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Bootstrap 5 has a lot of utility/helper classes to quickly style elements without using any CSS code.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"bootstrap-flexbox\">Bootstrap Flexbox</h2>\n          <p>Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"d-flex p-2\">I'm a flexbox container!</div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>I'm a flexbox container!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"d-inline-flex p-2\">I'm an inline flexbox container!</div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-inline-flex p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>I'm an inline flexbox container!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <p>Responsive variations also exist for <code class=\" highlighter-rouge language-plaintext\">.d-flex</code> and <code class=\" highlighter-rouge language-plaintext\">.d-inline-flex</code>.</p>\n          <ul>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-inline-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-sm-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-sm-inline-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-md-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-md-inline-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-lg-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-lg-inline-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-xl-flex</code></li>\n            <li><code class=\" highlighter-rouge language-plaintext\">.d-xl-inline-flex</code></li>\n          </ul>\n          <h3 id=\"bootstrap-align-left\">Bootstrap Align Left</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"d-flex justify-content-start mb-3\">\n              <div class=\"p-2\">Flex item</div>\n              <div class=\"p-2\">Flex item</div>\n              <div class=\"p-2\">Flex item</div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-start mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bootstrap-align-center\">Bootstrap Align Center</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"d-flex justify-content-center mb-3\">\n              <div class=\"p-2\">Flex item</div>\n              <div class=\"p-2\">Flex item</div>\n              <div class=\"p-2\">Flex item</div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-center mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bootstrap-align-right\">Bootstrap Align Right</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <div class=\"d-flex justify-content-end mb-3\">\n              <div class=\"p-2\">Flex item</div>\n              <div class=\"p-2\">Flex item</div>\n              <div class=\"p-2\">Flex item</div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-flex justify-content-end mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>p-2<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Flex item<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"bootstrap-text-alignment\">Bootstrap Text Alignment</h2>\n          <p>Easily realign text to components with text alignment classes.</p>\n          <h3 id=\"bootstrap-text-left\">Bootstrap Text Left</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <p class=\"text-start\">Left aligned text.</p>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-start<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Left aligned text.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bootstrap-text-center\">Bootstrap Text Center</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <p class=\"text-center\">Center aligned text.</p>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Center aligned text.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bootstrap-text-right\">Bootstrap Text Right</h3>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <p class=\"text-end\">Right aligned text.</p>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-end<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Right aligned text.<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"bootstrap-responsive-image\">Bootstrap Responsive Image</h2>\n          <p>Images in Bootstrap are made responsive with <code class=\" highlighter-rouge language-plaintext\">.img-fluid</code>. <code class=\" highlighter-rouge language-plaintext\">max-width: 100%;</code> and <code class=\" highlighter-rouge language-plaintext\">height: auto;</code> are applied to the image so that it scales with the parent element.</p>\n          <div class=\"ct-example\" style=\"position: relative;border: 2px solid #f5f7ff !important;border-bottom: none !important;padding: 1rem 1rem 2rem 1rem;margin-bottom: -1.25rem;\">\n            <img src=\"https://images.unsplash.com/photo-1578271887552-5ac3a72752bc?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1950&amp;q=80\" class=\"img-fluid border-radius-lg\" alt=\"Responsive image\">\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>https://images.unsplash.com/photo-1578271887552-5ac3a72752bc?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1950&amp;q=80<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>img-fluid border-radius-lg<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">alt</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Responsive image<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/getting-started/bootstrap.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Colors | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap\">Bootstrap</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap-examples\">Bootstrap Examples</a></li>\n            <li class=\"toc-entry toc-h1\"><a href=\"#my-first-bootstrap-page\">My First Bootstrap Page</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#column-1\">Column 1</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#column-2\">Column 2</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#column-3\">Column 3</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              What is Bootstrap\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Build responsive, mobile-first projects on the web with the world’s most popular front-end component library.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"bootstrap\">Bootstrap</h2>\n          <p>Bootstrap is an open source toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with our Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful plugins.</p>\n          <p>Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins</p>\n          <h2 id=\"bootstrap-examples\">Bootstrap Examples</h2>\n          <div class=\"bg-light text-center border-radius-lg py-4 mb-4\">\n            <h1>My First Bootstrap Page</h1>\n            <p>Resize this responsive page to see the effect!</p>\n          </div>\n          <div class=\"container\">\n            <div class=\"row\">\n              <div class=\"col-sm-4\">\n                <h3>Column 1</h3>\n                <p>Lorem ipsum dolor..</p>\n              </div>\n              <div class=\"col-sm-4\">\n                <h3>Column 2</h3>\n                <p>Lorem ipsum dolor..</p>\n              </div>\n              <div class=\"col-sm-4\">\n                <h3>Column 3</h3>\n                <p>Lorem ipsum dolor..</p>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bg-light text-center border-radius-lg py-4 mb-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h1</span><span class=\"token punctuation\">&gt;</span></span>My First Bootstrap Page<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h1</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Resize this responsive page to see the effect!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h3</span><span class=\"token punctuation\">&gt;</span></span>Column 1<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h3</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor..<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h3</span><span class=\"token punctuation\">&gt;</span></span>Column 2<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h3</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor..<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-sm-4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h3</span><span class=\"token punctuation\">&gt;</span></span>Column 3<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h3</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span><span class=\"token punctuation\">&gt;</span></span>Lorem ipsum dolor..<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/getting-started/build-tools.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Build Tools | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#using-gulp\">Using Gulp</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#autoprefixer\">Autoprefixer</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#troubleshooting\">Troubleshooting</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Build tools\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Learn how to use Material Dashboard’s included npm scripts to start a local server, compile source scss code, run tests, and more.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>Bootstrap uses <a href=\"https://docs.npmjs.com/misc/scripts\" rel=\"nofollow\">NPM scripts</a> for its build system. Our package.json includes convenient methods for working with the framework, including compiling code, running tests, and more.</p>\n          <p>To use our build system and use Sass to customize your website you’ll need a copy of Material Dashboard source files and Node. Follow these steps and you should be ready to rock:</p>\n          <ol>\n            <li><a href=\"https://nodejs.org/en/download/\" rel=\"nofollow\">Download and install Node.js</a>, which we use to manage our dependencies.</li>\n            <li>Navigate to the root <code class=\" highlighter-rouge language-plaintext\">/</code> directory and run <code class=\" highlighter-rouge language-plaintext\">npm install</code> to install our local dependencies.</li>\n          </ol>\n          <p>When completed, you’ll be able to run the various commands provided from the command line.</p>\n          <h2 id=\"using-gulp\">Using Gulp</h2>\n          <table>\n            <thead>\n              <tr>\n                <th>Task</th>\n                <th>Description</th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr>\n                <td><code class=\" highlighter-rouge language-plaintext\">gulp open-app</code></td>\n                <td>for opening the Presentation Page (default) of the product. You can set in gulpfile.js from your downloaded archive any page you want to open in browser, at line 30: gulp.src(‘index.html’).</td>\n              </tr>\n              <tr>\n                <td><code class=\" highlighter-rouge language-plaintext\">gulp compile-scss</code></td>\n                <td>for a single compilation</td>\n              </tr>\n              <tr>\n                <td><code class=\" highlighter-rouge language-plaintext\">gulp watch</code></td>\n                <td>for continous compilation of the changes that you make in *.scss files. This command should be run in the same folder where gulpfile.js and package.json are located.</td>\n              </tr>\n            </tbody>\n          </table>\n          <h2 id=\"autoprefixer\">Autoprefixer</h2>\n          <p><b>Material Dashboard</b> uses <a href=\"https://github.com/postcss/autoprefixer\">Autoprefixer</a> (included in our build process) to automatically add vendor prefixes to some CSS properties at build time. Doing so saves us time and code by allowing us to write key parts of our CSS a single time while eliminating the need for vendor mixins like those found in v3.</p>\n          <h2 id=\"troubleshooting\">Troubleshooting</h2>\n          <p>Should you encounter problems with installing dependencies, uninstall all previous dependency versions (global and local). Then, rerun <code class=\" highlighter-rouge language-plaintext\">npm install</code>.</p>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/getting-started/installation.html",
    "content": "<!DOCTYPE html>\n<html>\n\n<head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n        Installation | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n        .async-hide {\n            opacity: 0 !important\n        }\n\n    </style>\n    <script>\n        (function (a, s, y, n, c, h, i, d, e) {\n            s.className += ' ' + y;\n            h.start = 1 * new Date;\n            h.end = i = function () {\n                s.className = s.className.replace(RegExp(' ?' + y), '')\n            };\n            (a[n] = a[n] || []).hide = h;\n            setTimeout(function () {\n                i();\n                h.end = null\n            }, c);\n            h.timeout = c;\n        })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n            'GTM-K9BGS8K': true\n        });\n\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n        (function (i, s, o, g, r, a, m) {\n            i['GoogleAnalyticsObject'] = r;\n            i[r] = i[r] || function () {\n                (i[r].q = i[r].q || []).push(arguments)\n            }, i[r].l = 1 * new Date();\n            a = s.createElement(o),\n                m = s.getElementsByTagName(o)[0];\n            a.async = 1;\n            a.src = g;\n            m.parentNode.insertBefore(a, m)\n        })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n        ga('create', 'UA-46172202-22', 'auto', {\n            allowLinker: true\n        });\n        ga('set', 'anonymizeIp', true);\n        ga('require', 'GTM-K9BGS8K');\n        ga('require', 'displayfeatures');\n        ga('require', 'linker');\n        ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n        (function (w, d, s, l, i) {\n            w[l] = w[l] || [];\n            w[l].push({\n                'gtm.start': new Date().getTime(),\n                event: 'gtm.js'\n            });\n            var f = d.getElementsByTagName(s)[0],\n                j = d.createElement(s),\n                dl = l != 'dataLayer' ? '&l=' + l : '';\n            j.async = true;\n            j.src =\n                'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n            f.parentNode.insertBefore(j, f);\n        })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n</head>\n\n<body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\"\n            style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n        <div class=\"ct-docs-main-content-row\">\n            <div class=\"ct-docs-sidebar-col\">\n                <nav class=\"ct-docs-sidebar-collapse-links\">\n                    <div class=\"ct-docs-sidebar-product\">\n                      <div class=\"ct-docs-sidebar-product-image\">\n                        <img src=\"../../assets/img/bootstrap.png\">\n                      </div>\n                      <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-active-40 text-white\"></i>\n                          </div>\n                        </div>\n                        Getting started\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/overview.html\">\n                            Overview\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/license.html\">\n                            License\n                          </a>\n                        </li>\n                        <li class=\"ct-docs-nav-sidenav-active\">\n                          <a href=\"../../documentation/getting-started/installation.html\">\n                            installation\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/build-tools.html\">\n                            Build Tools\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/bootstrap.html\">\n                            What is Bootstrap\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                        <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                          <div class=\"d-inline-block\">\n                            <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                              <i class=\"ni ni-folder-17 text-white\"></i>\n                            </div>\n                          </div>\n                          Laravel\n                        </a>\n                        <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/login.html\">\n                              Login\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/sign-up.html\">\n                              Sign Up\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/forgot-password.html\">\n                              Forgot Password\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/user-profile.html\">\n                              User Profile\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/user-management.html\">\n                              User Management\n                              <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                            </a>\n                          </li>\n                        </ul>\n                      </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-folder-17 text-white\"></i>\n                          </div>\n                        </div>\n                        Foundation\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\" ct-docs-nav-sidenav \">\n                          <a href=\"../../documentation/foundation/colors.html\">\n                            Colors\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/grid.html\">\n                            Grid\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/typography.html\">\n                            Typography\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/icons.html\">\n                            Icons\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/utilities.html\">\n                            Utilities\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-app text-white\"></i>\n                          </div>\n                        </div>\n                        Components\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/alerts.html\">\n                            Alerts\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/badge.html\">\n                            Badge\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/buttons.html\">\n                            Buttons\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/social-buttons.html\">\n                            Social Buttons\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/cards.html\">\n                            Cards\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/carousel.html\">\n                            Carousel\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/collapse.html\">\n                            Collapse\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/dropdowns.html\">\n                            Dropdowns\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/forms.html\">\n                            Forms\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/input-group.html\">\n                            Input Group\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/list-group.html\">\n                            List Group\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/modal.html\">\n                            Modal\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/navs.html\">\n                            Navs\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/navbar.html\">\n                            Navbar\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/pagination.html\">\n                            Pagination\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/popovers.html\">\n                            Popovers\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/progress.html\">\n                            Progress\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/spinners.html\">\n                            Spinners\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/tables.html\">\n                            Tables\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/tooltips.html\">\n                            Tooltips\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-settings text-white\"></i>\n                          </div>\n                        </div>\n                        Plugins\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/countUpJs.html\">\n                            CountUp JS\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/charts.html\">\n                            Charts\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/datepicker.html\">\n                            Datepicker\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/fullcalendar.html\">\n                            Fullcalendar\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/sliders.html\">\n                            Sliders\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/choices.html\">\n                            Choices\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/dropzone.html\">\n                            Dropzone\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/datatables.html\">\n                            Datatables\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/kanban.html\">\n                            Kanban\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/photo-swipe.html\">\n                            Photo Swipe\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/quill.html\">\n                            Quill\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                            Sweet Alerts\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/wizard.html\">\n                            Wizard\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                  </nav>\n            </div>\n            <div class=\"ct-docs-toc-col\">\n                <ul class=\"section-nav\">\n                    <li class=\"toc-entry toc-h2\">\n                        <a href=\"#prerequisites\">Prerequisites</a>\n                    </li>\n                    <li class=\"toc-entry toc-h2\">\n                        <a href=\"#installation\">Installation</a>\n                    </li>\n                    <li class=\"toc-entry toc-h2\">\n                        <a href=\"#usage\">Usage</a>\n                    </li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#tooling-setup\">Tooling setup</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap-cdn\">Bootstrap CDN</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#css\">CSS</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#js\">JS</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#dark-mode\">Dark mode</a></li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#bootstrap-starter-template\">Bootstrap starter template</a>\n                    </li>\n                    <li class=\"toc-entry toc-h2\"><a href=\"#important-globals\">Important globals</a>\n                        <ul>\n                            <li class=\"toc-entry toc-h3\"><a href=\"#html5-doctype\">HTML5 doctype</a></li>\n                            <li class=\"toc-entry toc-h3\"><a href=\"#responsive-meta-tag\">Responsive meta tag</a></li>\n                            <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-components\">Bootstrap components</a></li>\n                            <li class=\"toc-entry toc-h3\"><a href=\"#bootstrap-tutorial\">Bootstrap tutorial</a></li>\n                        </ul>\n                    </li>\n                </ul>\n            </div>\n            <main class=\"ct-docs-content-col\" role=\"main\">\n                <div class=\"ct-docs-page-title\">\n                    <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n                        Installation\n                    </h1>\n                    <div class=\"avatar-group mt-3\">\n                    </div>\n                </div>\n                <p class=\"ct-docs-page-title-lead\">To start using this dashboard you will need to import some files in\n                    your current project or start from scratch using our template (scroll down in this page to view it).\n                </p>\n                <hr class=\"ct-docs-hr\">\n                <h2 id=\"prerequisites\">Prerequisites</h2>\n                <p>\n                    If you don't already have an Apache local environment\n                    with PHP and MySQL, use one of the following links:\n                </p>\n                <ul>\n                    <li>\n                        Windows\n                        <a\n                            href=\"https://updivision.com/blog/post/beginner-s-guide-to-setting-up-your-local-development-environment-on-windows\">https://updivision.com/blog/post/beginner-s-guide-to-setting-up-your-local-development-environment-on-windows</a>\n                    </li>\n                    <li>\n                        Linux\n                        <a\n                            href=\"https://howtoubuntu.org/how-to-install-lamp-on-ubuntu\">https://howtoubuntu.org/how-to-install-lamp-on-ubuntu</a>\n                    </li>\n                    <li>\n                        Mac\n                        <a href=\" https://wpshout.com/quick-guides/how-to-install-mamp-on-your-mac/\">\n                            https://wpshout.com/quick-guides/how-to-install-mamp-on-your-mac/</a>\n                    </li>\n                </ul>\n                <p>\n                    Also, you will need to install Composer:\n                    <a href=\"https://getcomposer.org/doc/00-intro.md\">https://getcomposer.org/doc/00-intro.md</a>\n                </p>\n                <p>\n                    And Laravel:\n                    <a href=\"https://laravel.com/docs/9.x/installation\">https://laravel.com/docs/9.x/installation</a>\n                </p>\n\n                <h2 id=\"installation\">Installation</h2>\n                <h3>Via Composer</h3>\n                <ol>\n                  <li><b>Cd</b> to your Laravel app</li>\n                  <li>\n                    Type in your terminal: <code class=\"language-html\">composer require laravel/ui</code> and <code class=\"language-html\">php artisan ui vue --auth</code>.\n                  </li>\n                  <li>\n                    Install this preset via \n                      <code class=\"language-html\">composer require laravel-frontend-presets/material</code>. No need to register the service provider. Laravel 9.x & up can auto detect the package.\n                  </li>\n                  <li>\n                      Run\n                      <code class=\"language-html\">php artisan ui material</code> command to install the Argon preset. This will install all the necessary assets and also the custom auth views, it will also add the auth route in \n                      <code class=\"language-html\">routes/web.php</code> (NOTE: If you run this command several times, be sure to clean up the duplicate Auth entries in routes/web.php)\n                  </li>\n                  <li>\n                      In your terminal run\n                      <code class=\"language-html\">composer dump-autoload</code>\n                  </li>\n                  <li>\n                      Add your DB info in \n                      <code class=\"language-html\">.env</code>\n                  </li>\n                  <li>\n                      Run\n                      <code class=\"language-html\">php artisan migrate:fresh --seed\n                      </code>\n                      to create basic users table\n                  </li>\n                </ol>\n\n                <h3>By using the archive</h3>\n                <ol>\n                  <li>In your application's root create a <b>presets</b> folder</li>\n                  <li>Download the archive of the repo and unzip it</li>\n                  <li>Copy and paste the downloaded folder in presets (created in step 2) and rename it to material</li>\n                  <li>Open <code class=\"language-html\">composer.json</code></li>\n                  <li>\n                    Add <code class=\"language-html\">\"LaravelFrontendPresets\\\\MaterialPreset\\\\\": \"presets/material/src\"</code> to \n                    <code class=\"language-html\">autoload/psr-4</code> and to <code class=\"language-html\">autoload-dev/psr-4</code>.\n                  </li>\n                  <li>\n                    Add <code class=\"language-html\">LaravelFrontendPresets\\MaterialPreset\\MaterialPresetServiceProvider::class</code> to \n                    <code class=\"language-html\">config/app.php</code>.\n                  </li>\n                  <li>\n                    Type in your terminal: <code class=\"language-html\">composer require laravel/ui</code> and <code class=\"language-html\">php artisan ui vue --auth</code>.\n                  </li>\n                  <li>\n                    In your terminal run\n                    <code class=\"language-html\">composer dump-autoload</code>\n                  </li>\n                  <li>\n                      Run\n                      <code class=\"language-html\">php artisan ui material</code> command to install the Argon preset. This will install all the necessary assets and also the custom auth views, it will also add the auth route in \n                      <code class=\"language-html\">routes/web.php</code> (NOTE: If you run this command several times, be sure to clean up the duplicate Auth entries in routes/web.php)\n                  </li>\n                  <li>\n                      Add your DB info in \n                      <code class=\"language-html\">.env</code>\n                  </li>\n                  <li>\n                      Run\n                      <code class=\"language-html\">php artisan migrate:fresh --seed\n                      </code>\n                      to create basic users table\n                  </li>\n                </ol>\n\n                <h2 id=\"usage\">Usage</h2>\n                <p>\n                    Register an user or login with data from your database and start testing (make sure to run the\n                    migrations and seeders for the credentials to be available).\n                </p>\n                <p>\n\n                    Besides the dashboard, the auth pages, the billing and tables pages, it has also an edit profile\n                    page. All the necessary files are installed out of the box and all the needed routes are added to\n                    <code class=\"language-html\">routes/web.php</code>. Keep in mind that all of the features can be\n                    viewed once you login using the credentials provided or by registering your own user.\n                </p>\n                <h2 id=\"tooling-setup\">Tooling setup</h2>\n                <h2 id=\"bootstrap-cdn\">Bootstrap CDN</h2>\n                <p>Skip the download with <a href=\"https://www.bootstrapcdn.com/\" target=\"_blank\"\n                        rel=\"nofollow\">BootstrapCDN</a> to deliver cached version of Bootstrap’s compiled CSS and JS to\n                    your project.</p>\n                <figure class=\"highlight\">\n                    <pre><code class=\"language-html\" data-lang=\"html\"><span class=\"c\">&lt;!-- CSS only --&gt;</span>\n<span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"https://cdn.jsdelivr.net/npm/<a href=\"/cdn-cgi/l/email-protection\" class=\"__cf_email__\" data-cfemail=\"89ebe6e6fdfafdfbe8f9c9bca7b8a7b9\">[email&#160;protected]</a>/dist/css/bootstrap.min.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"na\">integrity=</span><span class=\"s\">\"sha384-wEmeIV1mKuiNpC+IOBjI7aAzPcEZeedi5yW5f2yOq55WWLwNGmvvx4Um1vskeMj0\"</span> <span class=\"na\">crossorigin=</span><span class=\"s\">\"anonymous\"</span><span class=\"nt\">&gt;</span>\n<span class=\"c\">&lt;!-- JavaScript Bundle with Popper --&gt;</span>\n<span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"https://cdn.jsdelivr.net/npm/<a href=\"/cdn-cgi/l/email-protection\" class=\"__cf_email__\" data-cfemail=\"a2c0cdcdd6d1d6d0c3d2e2978c938c92\">[email&#160;protected]</a>/dist/js/bootstrap.bundle.min.js\"</span> <span class=\"na\">integrity=</span><span class=\"s\">\"sha384-p34f1UUtsS3wqzfto5wAAmdvj+osOnFyQFpp4Ua3gs/ZVWx6oOypYoCJhGGScy+8\"</span> <span class=\"na\">crossorigin=</span><span class=\"s\">\"anonymous\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span></code></pre>\n                </figure>\n                <h2 id=\"css\">CSS</h2>\n                <p>Copy-paste the stylesheet <code class=\"language-plaintext highlighter-rouge\">&lt;link&gt;</code> into\n                    your <code class=\"language-plaintext highlighter-rouge\">&lt;head&gt;</code> before all other\n                    stylesheets to load our CSS.</p>\n                <figure class=\"highlight\">\n                    <pre><code class=\"language-html\" data-lang=\"html\"><span class=\"c\">&lt;!-- Fonts --&gt;</span>\n<span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span><span class=\"nt\">&gt;</span>\n\n<span class=\"c\">&lt;!-- Icons --&gt;</span>\n<span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/css/nucleo-icons.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span>\n<span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/css/nucleo-svg.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span>\n\n<span class=\"c\">&lt;!-- Font Awesome Icons --&gt;</span>\n<span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"https://kit.fontawesome.com/42d5adcbca.js\"</span> <span class=\"na\">crossorigin=</span><span class=\"s\">\"anonymous\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n\n<span class=\"c\">&lt;!-- CSS Files --&gt;</span>\n<span class=\"nt\">&lt;link</span> <span class=\"na\">id=</span><span class=\"s\">\"pagestyle\"</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/css/material-dashboard.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span></code></pre>\n                </figure>\n                <h2 id=\"js\">JS</h2>\n                <p>Many of our components require the use of JavaScript to function. Specifically , <a\n                        href=\"https://popper.js.org/\" rel=\"nofollow\">Popper.js</a>, and our own JavaScript plugins.\n                    Place the following <code class=\"language-plaintext highlighter-rouge\">&lt;script&gt;</code>s near\n                    the end of your pages, right before the closing <code\n                        class=\"language-plaintext highlighter-rouge\">&lt;/body&gt;</code> tag, to enable them. Popper.js\n                    must come and then our JavaScript plugins.</p>\n                <figure class=\"highlight\">\n                    <pre><code class=\"language-html\" data-lang=\"html\"><span class=\"c\">&lt;!-- Core --&gt;</span>\n<span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/core/popper.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n<span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/core/bootstrap.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n\n<span class=\"c\">&lt;!-- Theme JS --&gt;</span>\n<span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/material-dashboard.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span></code></pre>\n                </figure>\n                <p>Need to use a certain plugin in your page? You can find out how to integrate them and make them work\n                    in the Plugins dedicated page. In this way you will be sure that your website is optimized and uses\n                    only the needed resources.</p>\n                <h2 id=\"dark-mode\">Dark mode</h2>\n                <p>Material Dashboard PRO comes in 2 modes: dark &amp; light. To turn on the dark version you need to\n                    add <code class=\"language-plaintext highlighter-rouge\">dark-version</code> class on the body tag.\n                </p>\n                <figure class=\"highlight\">\n                    <pre><code class=\"language-html\" data-lang=\"html\"><span class=\"c\">&lt;!-- Dark version --&gt;</span>\n<span class=\"nt\">&lt;body</span> <span class=\"na\">class=</span><span class=\"s\">\"dark-version\"</span><span class=\"nt\">&gt;</span>\n...\n<span class=\"nt\">&lt;/body&gt;</span></code></pre>\n                </figure>\n                <h2 id=\"bootstrap-starter-template\">Bootstrap starter template</h2>\n                <p>Be sure to have your pages set up with the latest design and development standards. That means using\n                    an HTML5 doctype and including a viewport meta tag for proper responsive behaviors. Put it all\n                    together and your pages should look like this:</p>\n                <figure class=\"highlight\">\n                    <pre><code class=\"language-html\" data-lang=\"html\"><span class=\"cp\">&lt;!DOCTYPE html&gt;</span>\n<span class=\"nt\">&lt;html</span> <span class=\"na\">lang=</span><span class=\"s\">\"en\"</span><span class=\"nt\">&gt;</span>\n\n<span class=\"nt\">&lt;head&gt;</span>\n  <span class=\"nt\">&lt;meta</span> <span class=\"na\">charset=</span><span class=\"s\">\"utf-8\"</span> <span class=\"nt\">/&gt;</span>\n  <span class=\"nt\">&lt;meta</span> <span class=\"na\">name=</span><span class=\"s\">\"viewport\"</span> <span class=\"na\">content=</span><span class=\"s\">\"width=device-width, initial-scale=1, shrink-to-fit=no\"</span><span class=\"nt\">&gt;</span>\n  <span class=\"nt\">&lt;link</span> <span class=\"na\">rel=</span><span class=\"s\">\"apple-touch-icon\"</span> <span class=\"na\">sizes=</span><span class=\"s\">\"76x76\"</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/img/apple-icon.png\"</span><span class=\"nt\">&gt;</span>\n  <span class=\"nt\">&lt;link</span> <span class=\"na\">rel=</span><span class=\"s\">\"icon\"</span> <span class=\"na\">type=</span><span class=\"s\">\"image/png\"</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/img/favicon.png\"</span><span class=\"nt\">&gt;</span>\n  <span class=\"nt\">&lt;title&gt;</span>\n    Material Dashboard by Creative Tim\n  <span class=\"nt\">&lt;/title&gt;</span>\n  <span class=\"c\">&lt;!--     Fonts and icons     --&gt;</span>\n  <span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span>\n  <span class=\"c\">&lt;!-- Nucleo Icons --&gt;</span>\n  <span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/css/nucleo-icons.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span>\n  <span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/css/nucleo-svg.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span>\n  <span class=\"c\">&lt;!-- Font Awesome Icons --&gt;</span>\n  <span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"https://kit.fontawesome.com/42d5adcbca.js\"</span> <span class=\"na\">crossorigin=</span><span class=\"s\">\"anonymous\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n  <span class=\"nt\">&lt;link</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/css/nucleo-svg.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span>\n  <span class=\"c\">&lt;!-- CSS Files --&gt;</span>\n  <span class=\"nt\">&lt;link</span> <span class=\"na\">id=</span><span class=\"s\">\"pagestyle\"</span> <span class=\"na\">href=</span><span class=\"s\">\"../assets/css/material-dashboard.css\"</span> <span class=\"na\">rel=</span><span class=\"s\">\"stylesheet\"</span> <span class=\"nt\">/&gt;</span>\n<span class=\"nt\">&lt;/head&gt;</span>\n\n<span class=\"nt\">&lt;body</span> <span class=\"na\">class=</span><span class=\"s\">\"g-sidenav-show bg-gray-100\"</span><span class=\"nt\">&gt;</span>\n\n  <span class=\"nt\">&lt;h1&gt;</span>Hello, world!<span class=\"nt\">&lt;/h1&gt;</span>\n\n  <span class=\"c\">&lt;!--   Core JS Files   --&gt;</span>\n  <span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/core/popper.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n  <span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/core/bootstrap.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n\n  <span class=\"c\">&lt;!-- Plugin for the charts, full documentation here: https://www.chartjs.org/ --&gt;</span>\n  <span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/plugins/chartjs.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n  <span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/plugins/Chart.extension.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n\n  <span class=\"c\">&lt;!-- Control Center for Material Dashboard: parallax effects, scripts for the example pages etc --&gt;</span>\n  <span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../assets/js/material-dashboard.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span>\n<span class=\"nt\">&lt;/body&gt;</span>\n\n<span class=\"nt\">&lt;/html&gt;</span></code></pre>\n                </figure>\n                <h2 id=\"important-globals\">Important globals</h2>\n                <p>Material Dashboard employs a handful of important global styles and settings that you’ll need to be\n                    aware of when using it, all of which are almost exclusively geared towards the\n                    <em>normalization</em> of cross browser styles. Let’s dive in.</p>\n                <h3 id=\"html5-doctype\">HTML5 doctype</h3>\n                <p>Bootstrap requires the use of the HTML5 doctype. Without it, you’ll see some funky incomplete\n                    styling, but including it shouldn’t cause any considerable hiccups.</p>\n                <figure class=\"highlight\">\n                    <pre><code class=\"language-html\" data-lang=\"html\"><span class=\"cp\">&lt;!doctype html&gt;</span>\n<span class=\"nt\">&lt;html</span> <span class=\"na\">lang=</span><span class=\"s\">\"en\"</span><span class=\"nt\">&gt;</span>\n  ...\n<span class=\"nt\">&lt;/html&gt;</span></code></pre>\n                </figure>\n                <h3 id=\"responsive-meta-tag\">Responsive meta tag</h3>\n                <p>Bootstrap is developed <em>mobile first</em>, a strategy in which we optimize code for mobile devices\n                    first and then scale up components as necessary using CSS media queries. To ensure proper rendering\n                    and touch zooming for all devices, <strong>add the responsive viewport meta tag</strong> to your\n                    <code class=\"language-plaintext highlighter-rouge\">&lt;head&gt;</code>.</p>\n                <figure class=\"highlight\">\n                    <pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;meta</span> <span class=\"na\">name=</span><span class=\"s\">\"viewport\"</span> <span class=\"na\">content=</span><span class=\"s\">\"width=device-width, initial-scale=1, shrink-to-fit=no\"</span><span class=\"nt\">&gt;</span></code></pre>\n                </figure>\n                <p>You can see an example of this in action in the <a href=\"#starter-template\">starter template</a>.</p>\n                <h3 id=\"bootstrap-components\">Bootstrap components</h3>\n                <p>Many of Bootstrap’s components and utilities are built with <code\n                        class=\"language-plaintext highlighter-rouge\">@each</code> loops that iterate over a Sass map.\n                    This is especially helpful for generating variants of a component by our <code\n                        class=\"language-plaintext highlighter-rouge\">$theme-colors</code> and creating responsive\n                    variants for each breakpoint. As you customize these Sass maps and recompile, you’ll automatically\n                    see your changes reflected in these loops.</p>\n                <h3 id=\"bootstrap-tutorial\">Bootstrap tutorial</h3>\n                <p>Please check our official <a href=\"https://www.youtube.com/channel/UCVyTG4sCw-rOvB9oHkzZD1w/videos\"\n                        rel=\"nofollow\" target=\"_blank\">Youtube channel</a> for more tutorials.</p>\n            </main>\n        </div>\n        <div class=\"ct-docs-main-footer-row\">\n            <div class=\"ct-docs-main-footer-blank-col\">\n            </div>\n            <div class=\"ct-docs-main-footer-col\">\n              <footer class=\"ct-docs-footer\">\n                <div class=\"ct-docs-footer-inner-row\">\n                  <div class=\"ct-docs-footer-col\">\n                    <div class=\"ct-docs-footer-copyright\">\n                      © <script>\n                        document.write(new Date().getFullYear())\n                      </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                    </div>\n                  </div>\n                  <div class=\"ct-docs-footer-col\">\n                    <ul class=\"ct-docs-footer-nav-footer\">\n                      <li>\n                        <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                      </li>\n                      <li class=\"nav-item\">\n                        <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                    </li>\n                      <li>\n                        <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                      </li>\n                      <li>\n                        <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                      </li>\n                    </ul>\n                  </div>\n                </div>\n              </footer>\n            </div>\n        </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n        Holder.addTheme('gray', {\n            bg: '#777',\n            fg: 'rgba(255,255,255,.75)',\n            font: 'Helvetica',\n            fontweight: 'normal'\n        })\n\n    </script>\n    <script>\n        // Facebook Pixel Code Don't Delete\n        ! function (f, b, e, v, n, t, s) {\n            if (f.fbq) return;\n            n = f.fbq = function () {\n                n.callMethod ?\n                    n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n            };\n            if (!f._fbq) f._fbq = n;\n            n.push = n;\n            n.loaded = !0;\n            n.version = '2.0';\n            n.queue = [];\n            t = b.createElement(e);\n            t.async = !0;\n            t.src = v;\n            s = b.getElementsByTagName(e)[0];\n            s.parentNode.insertBefore(t, s)\n        }(window,\n            document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n        try {\n            fbq('init', '111649226022273');\n            fbq('track', \"PageView\");\n\n        } catch (err) {\n            console.log('Facebook Track Error:', err);\n        }\n\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/getting-started/license.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      License | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#free-demo-products\">Free Demo Products</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#pro-premium-products\">PRO premium products</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              License\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Learn more about the licenses Creative Tim offers and purchase the one that covers the needs of your project.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"free-demo-products\">Free Demo Products</h2>\n          <p>MIT License</p>\n          <p>Copyright (c) 2021 <a href=\"https://creative-tim.com\">Creative Tim</a></p>\n          <p>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</p>\n          <p>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</p>\n          <p>THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</p>\n          <h2 id=\"pro-premium-products\">PRO premium products</h2>\n          <hr>\n          <p><span class=\"badge badge-primary\">PRO</span></p>\n          <p>Currently, on <a href=\"https://creative-tim.com\">Creative Tim</a> you can get the products with two types of licenses: Personal or Developer. If you are making a paid purchase, be sure to go through the table with the rights and the guidelines, so you can know what is the best fit for you. View the rights table and the description for each license on our by clicking the button below.</p>\n          <p><a href=\"https://www.creative-tim.com/license\" target=\"_blank\">See licenses</a></p>\n          <p>Creating your web design from scratch with dedicated designers can be very expensive. Using our solutions you don’t have to worry about design. Save time and money by focusing on the business model. Are you ready to create something amazing?</p>\n          <p><a href=\"https://www.creative-tim.com/product/material-dashboard-pro\" target=\"_blank\">Purchase now</a></p>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/getting-started/overview.html",
    "content": "<!DOCTYPE html>\n<html>\n\n<head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n        Overview | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n        .async-hide {\n            opacity: 0 !important\n        }\n\n    </style>\n    <script>\n        (function (a, s, y, n, c, h, i, d, e) {\n            s.className += ' ' + y;\n            h.start = 1 * new Date;\n            h.end = i = function () {\n                s.className = s.className.replace(RegExp(' ?' + y), '')\n            };\n            (a[n] = a[n] || []).hide = h;\n            setTimeout(function () {\n                i();\n                h.end = null\n            }, c);\n            h.timeout = c;\n        })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n            'GTM-K9BGS8K': true\n        });\n\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n        (function (i, s, o, g, r, a, m) {\n            i['GoogleAnalyticsObject'] = r;\n            i[r] = i[r] || function () {\n                (i[r].q = i[r].q || []).push(arguments)\n            }, i[r].l = 1 * new Date();\n            a = s.createElement(o),\n                m = s.getElementsByTagName(o)[0];\n            a.async = 1;\n            a.src = g;\n            m.parentNode.insertBefore(a, m)\n        })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n        ga('create', 'UA-46172202-22', 'auto', {\n            allowLinker: true\n        });\n        ga('set', 'anonymizeIp', true);\n        ga('require', 'GTM-K9BGS8K');\n        ga('require', 'displayfeatures');\n        ga('require', 'linker');\n        ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n        (function (w, d, s, l, i) {\n            w[l] = w[l] || [];\n            w[l].push({\n                'gtm.start': new Date().getTime(),\n                event: 'gtm.js'\n            });\n            var f = d.getElementsByTagName(s)[0],\n                j = d.createElement(s),\n                dl = l != 'dataLayer' ? '&l=' + l : '';\n            j.async = true;\n            j.src =\n                'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n            f.parentNode.insertBefore(j, f);\n        })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n</head>\n\n<body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\"\n            style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n        <div class=\"ct-docs-main-content-row\">\n            <div class=\"ct-docs-sidebar-col\">\n                <nav class=\"ct-docs-sidebar-collapse-links\">\n                    <div class=\"ct-docs-sidebar-product\">\n                      <div class=\"ct-docs-sidebar-product-image\">\n                        <img src=\"../../assets/img/bootstrap.png\">\n                      </div>\n                      <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-active-40 text-white\"></i>\n                          </div>\n                        </div>\n                        Getting started\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"ct-docs-nav-sidenav-active\">\n                          <a href=\"../../documentation/getting-started/overview.html\">\n                            Overview\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/license.html\">\n                            License\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/installation.html\">\n                            Installation\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/build-tools.html\">\n                            Build Tools\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/getting-started/bootstrap.html\">\n                            What is Bootstrap\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                        <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                          <div class=\"d-inline-block\">\n                            <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                              <i class=\"ni ni-folder-17 text-white\"></i>\n                            </div>\n                          </div>\n                          Laravel\n                        </a>\n                        <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/login.html\">\n                              Login\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/sign-up.html\">\n                              Sign Up\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/forgot-password.html\">\n                              Forgot Password\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/user-profile.html\">\n                              User Profile\n                            </a>\n                          </li>\n                          <li class=\"\">\n                            <a href=\"../../documentation/laravel/user-management.html\">\n                              User Management\n                              <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                            </a>\n                          </li>\n                        </ul>\n                      </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-folder-17 text-white\"></i>\n                          </div>\n                        </div>\n                        Foundation\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\" ct-docs-nav-sidenav \">\n                          <a href=\"../../documentation/foundation/colors.html\">\n                            Colors\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/grid.html\">\n                            Grid\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/typography.html\">\n                            Typography\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/icons.html\">\n                            Icons\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/foundation/utilities.html\">\n                            Utilities\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-app text-white\"></i>\n                          </div>\n                        </div>\n                        Components\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/alerts.html\">\n                            Alerts\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/badge.html\">\n                            Badge\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/buttons.html\">\n                            Buttons\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/social-buttons.html\">\n                            Social Buttons\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/cards.html\">\n                            Cards\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/carousel.html\">\n                            Carousel\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/collapse.html\">\n                            Collapse\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/dropdowns.html\">\n                            Dropdowns\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/forms.html\">\n                            Forms\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/input-group.html\">\n                            Input Group\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/list-group.html\">\n                            List Group\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/modal.html\">\n                            Modal\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/navs.html\">\n                            Navs\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/navbar.html\">\n                            Navbar\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/pagination.html\">\n                            Pagination\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/popovers.html\">\n                            Popovers\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/progress.html\">\n                            Progress\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/spinners.html\">\n                            Spinners\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/tables.html\">\n                            Tables\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/components/tooltips.html\">\n                            Tooltips\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                    <div class=\"ct-docs-toc-item-active\">\n                      <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                        <div class=\"d-inline-block\">\n                          <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                            <i class=\"ni ni-settings text-white\"></i>\n                          </div>\n                        </div>\n                        Plugins\n                      </a>\n                      <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/countUpJs.html\">\n                            CountUp JS\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/charts.html\">\n                            Charts\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/datepicker.html\">\n                            Datepicker\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/fullcalendar.html\">\n                            Fullcalendar\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/sliders.html\">\n                            Sliders\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/choices.html\">\n                            Choices\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/dropzone.html\">\n                            Dropzone\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/datatables.html\">\n                            Datatables\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/kanban.html\">\n                            Kanban\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/photo-swipe.html\">\n                            Photo Swipe\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/quill.html\">\n                            Quill\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                            Sweet Alerts\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                        <li class=\"\">\n                          <a href=\"../../documentation/plugins/wizard.html\">\n                            Wizard\n                            <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                          </a>\n                        </li>\n                      </ul>\n                    </div>\n                  </nav>\n            </div>\n            <div class=\"ct-docs-toc-col\">\n                <ul class=\"section-nav\">\n                    <li class=\"toc-entry toc-h5\"><a href=\"#developer-first\">Developer First</a></li>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#high-quality\">High quality</a></li>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#community-helpers\">Community helpers</a></li>\n                    <li class=\"toc-entry toc-h3\"><a href=\"#resources-and-credits\">Resources and credits</a></li>\n                    <li class=\"toc-entry toc-h3\"><a href=\"#learn-more\">Learn more</a></li>\n                </ul>\n            </div>\n            <main class=\"ct-docs-content-col\" role=\"main\">\n                <div class=\"ct-docs-page-title\">\n                    <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n                        Material Dashboard Bootstrap\n                    </h1>\n                    <div class=\"avatar-group mt-3\">\n                    </div>\n                </div>\n                <p class=\"ct-docs-page-title-lead\">An user-friendly, open source and beautiful dashboard based on\n                    Bootstrap 5.</p>\n                <hr class=\"ct-docs-hr\">\n                <p>We at <a href=\"https://www.creative-tim.com/\" target=\"_blank\">Creative Tim</a> have always wanted to\n                    deliver great tools to all the web developers. We want to see better websites and web apps on the\n                    internet.</p>\n                <div class=\"row\">\n                    <div class=\"col-lg-4 col-md-6\">\n                        <div class=\"card bg-gradient-dark\">\n                            <div class=\"card-header bg-transparent mx-4 p-3 text-center\">\n                                <div\n                                    class=\"icon icon-shape icon-lg bg-gradient-primary text-center border-radius-lg mx-auto\">\n                                    <i class=\"material-icons opacity-10\">\n                                        integration_instructions\n                                    </i>\n                                </div>\n                            </div>\n                            <div class=\"card-body pt-0 p-3 text-center\">\n                                <h5 class=\"mb-2 text-white\">Developer First</h5>\n                                <p class=\"mb-0 text-white\">\n                                    Material Dashboard is a \"Developer First\" product, with a lot of variables for\n                                    colors, fonts, sizes and other elements.\n                                </p>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"col-lg-4 col-md-6\">\n                        <div class=\"card bg-gradient-dark\">\n                            <div class=\"card-header bg-transparent mx-4 p-3 text-center\">\n                                <div\n                                    class=\"icon icon-shape icon-lg bg-gradient-primary text-center border-radius-lg mx-auto\">\n                                    <i class=\"material-icons opacity-10\">\n                                        imagesearch_roller\n                                    </i>\n                                </div>\n                            </div>\n                            <div class=\"card-body pt-0 p-3 text-center\">\n                                <h5 class=\"mb-2 text-white\">High quality</h5>\n                                <p class=\"mb-0 text-white\">\n                                    We are following the latest code standards provided by the guys from Bootstrap, so\n                                    you will love working with this dashboard.\n                                </p>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"col-lg-4 col-md-6\">\n                        <div class=\"card  bg-gradient-dark\">\n                            <div class=\"card-header bg-transparent mx-4 p-3 text-center\">\n                                <div\n                                    class=\"icon icon-shape icon-lg bg-gradient-primary text-center border-radius-lg mx-auto\">\n                                    <i class=\"material-icons opacity-10\">\n                                        volunteer_activism\n                                    </i>\n                                </div>\n                            </div>\n                            <div class=\"card-body pt-0 p-3 text-center\">\n                                <h5 class=\"mb-2 text-white\">Community helpers</h5>\n                                <p class=\"mb-0 text-white\">\n                                    Since all our products are built on top of Open Source also Material Dashboard is\n                                    released under\n                                    <a class=\"font-weight-bolder text-white\"\n                                        href=\"https://github.com/creativetimofficial/material-dashboard-2/blob/master/LICENSE.md\"\n                                        target=\"_blank\" rel=\"nofollow\">MIT License</a>\n                                </p>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <h3 id=\"resources-and-credits\">Resources and credits</h3>\n                <p>This Dashboard is fully coded and built on top of Open Source, more details here:</p>\n                <ul>\n                    <li><a href=\"https://www.getbootstrap.com\" rel=\"nofollow\" target=\"_blank\">Bootstrap 5</a> - Open\n                        source front end framework</li>\n                    <li><a href=\"https://refreshless.com/nouislider/\" rel=\"nofollow\" target=\"_blank\">noUISlider</a> -\n                        JavaScript Range Slider</li>\n                    <li><a href=\"https://popper.js.org/\" rel=\"nofollow\" target=\"_blank\">Popper.js</a> - Kickass library\n                        used to manage poppers</li>\n                    <li><a href=\"https://flatpickr.js.org/\" rel=\"nofollow\" target=\"_blank\">Flatpickr</a> - Useful\n                        library used to select date</li>\n                    <li><a href=\"https://joshuajohnson.co.uk/Choices/\" rel=\"nofollow\" target=\"_blank\">Choices JS</a> - A\n                        nice plugin that select elements with intuitive multiselection and searching but also for\n                        managing tags.</li>\n                    <li><a href=\"https://inorganik.github.io/countUp.js/\" rel=\"nofollow\" target=\"_blank\">CountUp JS</a>\n                        - A dependency-free, lightweight JavaScript class that can be used to quickly create animations\n                        that display numerical data in a more interesting way.</li>\n                    <li><a href=\"https://www.chartjs.org/\" rel=\"nofollow\" target=\"_blank\">Charts Js</a> - Simple yet\n                        flexible JavaScript charting for designers &amp; developers</li>\n                    <li><a href=\"https://fullcalendar.io/\" rel=\"nofollow\" target=\"_blank\">FullCalendar</a> - Full-sized\n                        drag &amp; drop event calendar</li>\n                    <li><a href=\"https://www.dropzonejs.com/\" rel=\"nofollow\" target=\"_blank\">Dropzone</a> - An open\n                        source library that provides drag’n’drop file uploads with image previews.</li>\n                    <li><a href=\"https://github.com/fiduswriter/Simple-DataTables\" rel=\"nofollow\"\n                            target=\"_blank\">Datatables</a> - DataTables but in Vanilla ES2018 JS</li>\n                    <li><a href=\"http://www.riccardotartaglia.it/jkanban/\" rel=\"nofollow\" target=\"_blank\">jKanban</a> -\n                        Pure agnostic Javascript plugin for Kanban boards</li>\n                    <li><a href=\"https://photoswipe.com/\" rel=\"nofollow\" target=\"_blank\">PhotoSwipe</a> - JavaScript\n                        image gallery for mobile and desktop, modular, framework independent</li>\n                    <li><a href=\"https://quilljs.com/\" rel=\"nofollow\" target=\"_blank\">Quill</a> - A free, open source\n                        WYSIWYG editor built for the modern web</li>\n                    <li><a href=\"https://sweetalert2.github.io/\" rel=\"nofollow\" target=\"_blank\">Sweet Alerts</a> - A\n                        beautiful, responsive, customisable, accessible replacement for Javascript’s popup boxes.</li>\n                    <li><a href=\"https://threejs.org/\" rel=\"nofollow\" target=\"_blank\">three.js</a> - JavaScript 3D\n                        library</li>\n                    <li><a href=\"https://www.cssscript.com/multi-step-form-bootstrap/\" rel=\"nofollow\"\n                            target=\"_blank\">Wizard</a> - Animated Multi-step form for Bootstrap</li>\n                </ul>\n                <h3 id=\"learn-more\">Learn more</h3>\n                <p>Stay up to date on the development journey and connect with us on:</p>\n                <ul>\n                    <li>Follow <a href=\"https://twitter.com/creativetim\" rel=\"nofollow\" target=\"_blank\">Creative Tim on\n                            Twitter</a>.</li>\n                    <li>Read and subscribe to <a href=\"https://creative-tim.com/blog\" rel=\"nofollow\" target=\"_blank\">The\n                            Official Creative Tim Blog</a>.</li>\n                    <li>Follow <a href=\"https://www.instagram.com/creativetimofficial\" rel=\"nofollow\"\n                            target=\"_blank\">Creative Tim on Instagram</a>.</li>\n                    <li>Follow <a href=\"https://www.facebook.com/creativetim\" rel=\"nofollow\" target=\"_blank\">Creative\n                            Tim on Facebook</a>.</li>\n                </ul>\n                <h3>UPDIVISION</h3>\n                <ul>\n                    <li>\n                        Follow\n                        <a href=\"https://twitter.com/updivision\" rel=\"nofollow\" target=\"_blank\">UPDIVISION on\n                            Twitter</a>\n                    </li>\n                    <li>\n                        Read and subscribe to\n                        <a href=\" https://updivision.com/blog/\" rel=\"nofollow\" target=\"_blank\">The UPDIVISION Blog</a>.\n                    </li>\n                    <li>\n                        Follow\n                        <a href=\" https://www.linkedin.com/company/updivision\" rel=\"nofollow\" target=\"_blank\">UPDIVISION on Linkedin</a>.\n                    </li>\n                    <li>\n                        Follow\n                        <a href=\"https://www.facebook.com/updivision\" rel=\"nofollow\" target=\"_blank\">UPDIVISION on\n                            Facebook</a>.\n                    </li>\n                </ul>\n            </main>\n        </div>\n        <div class=\"ct-docs-main-footer-row\">\n            <div class=\"ct-docs-main-footer-blank-col\">\n            </div>\n            <div class=\"ct-docs-main-footer-col\">\n              <footer class=\"ct-docs-footer\">\n                <div class=\"ct-docs-footer-inner-row\">\n                  <div class=\"ct-docs-footer-col\">\n                    <div class=\"ct-docs-footer-copyright\">\n                      © <script>\n                        document.write(new Date().getFullYear())\n                      </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                    </div>\n                  </div>\n                  <div class=\"ct-docs-footer-col\">\n                    <ul class=\"ct-docs-footer-nav-footer\">\n                      <li>\n                        <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                      </li>\n                      <li class=\"nav-item\">\n                        <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                    </li>\n                      <li>\n                        <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                      </li>\n                      <li>\n                        <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                      </li>\n                    </ul>\n                  </div>\n                </div>\n              </footer>\n            </div>\n        </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n        Holder.addTheme('gray', {\n            bg: '#777',\n            fg: 'rgba(255,255,255,.75)',\n            font: 'Helvetica',\n            fontweight: 'normal'\n        })\n\n    </script>\n    <script>\n        // Facebook Pixel Code Don't Delete\n        ! function (f, b, e, v, n, t, s) {\n            if (f.fbq) return;\n            n = f.fbq = function () {\n                n.callMethod ?\n                    n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n            };\n            if (!f._fbq) f._fbq = n;\n            n.push = n;\n            n.loaded = !0;\n            n.version = '2.0';\n            n.queue = [];\n            t = b.createElement(e);\n            t.async = !0;\n            t.src = v;\n            s = b.getElementsByTagName(e)[0];\n            s.parentNode.insertBefore(t, s)\n        }(window,\n            document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n        try {\n            fbq('init', '111649226022273');\n            fbq('track', \"PageView\");\n\n        } catch (err) {\n            console.log('Facebook Track Error:', err);\n        }\n\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/laravel/forgot-password.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Forgot Password | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"ct-docs-nav-sidenav-active\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n                Forgot Password\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">If an existing user forgot his password he has the possibility of resetting his password.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>In the case of an user forgetting the credentials there is the possibility of resetting them. For resetting the password the user should use the <b>Forgot password?</b> button from the login page. The user must provide the email for the account and after that a link will be sent for resetting the password to the provided mail address. </p>\n          <p>The <code>App/Http/Controllers/SessionsController.php</code>  handles the recovery of the password.</p>\n          <div>\n              <pre>\n              <code class=\" language-html\" data-lang=\"html\">\n                public function update(){\n\n                    request()->validate([\n                        'token' => 'required',\n                        'email' => 'required|email',\n                        'password' => 'required|min:8|confirmed',\n                    ]);\n\n                    $status = Password::reset(\n                        request()->only('email', 'password', 'password_confirmation', 'token'),\n                        function ($user, $password) {\n                            $user->forceFill([\n                                'password' => ($password)\n                            ])->setRememberToken(Str::random(60));\n\n                            $user->save();\n\n                            event(new PasswordReset($user));\n                        }\n                    );\n\n                    return $status === Password::PASSWORD_RESET\n                                ? redirect()->route('login')->with('status', __($status))\n                                : back()->withErrors(['email' => [__($status)]]);\n                }\n              </code>\n              </pre>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/laravel/login.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Login | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"ct-docs-nav-sidenav-active \">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Login\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">To access the other pages the user needs to be logged into his account.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>If you are not logged in you can only access the Login page or the Sign Up page. The default url takes you to the Login page. Logging in is possible with already existing credentials. An email and a password must pe provided to log into your account.</p>\n          <p>The <code>App/Http/Controllers/SessionsController.php</code> handles the logging in of an existing user.</p>\n          <div>\n              <pre>\n              <code class=\" language-html\" data-lang=\"html\">\n                public function store()\n                {\n                    $attributes = request()->validate([\n                        'email' => 'required|email',\n                        'password' => 'required'\n                    ]);\n\n                    if (! auth()->attempt($attributes)) {\n                        throw ValidationException::withMessages([\n                            'email' => 'Your provided credentials could not be verified.'\n                        ]);\n                    }\n\n                    session()->regenerate();\n\n                    return redirect('/dashboard');\n\n                }\n              </code>\n              </pre>\n          </div>\n          <div>\n              <p>If the user forgot his password he can reset the password or if he doesn't have an account he can sign up.</p>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/laravel/sign-up.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Sign Up | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\" \">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"ct-docs-nav-sidenav-active\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Sign Up\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">You can register as a user by filling in the name, email and password for your account.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>You can do this by accessing the sign up page from the <b>Sign Up</b> button in the top navbar or by clicking the <b>Sign Up</b> button from the bottom of the log in form or if you are logged in from the <b>Sign Up</b> button from the sidebar. Another simple way is adding <code>/sign-up</code> in the url.</p>\n          <p>The <code>App/Http/Controllers/RegisterController.php</code> handles the registration of a new user.</p>\n          <div>\n              <pre>\n              <code class=\" language-html\" data-lang=\"html\">\n                public function store(){\n\n                    $attributes = request()->validate([\n                        'name' => 'required|max:255|unique:users,name',\n                        'email' => 'required|email|max:255|unique:users,email',\n                        'password' => 'required|min:5|max:255',\n                    ]);\n\n                    $user = User::create($attributes);\n                    auth()->login($user);\n\n                    return redirect('/dashboard');\n                }\n              </code>\n              </pre>\n          </div>\n          <div>\n              <p>The data entered by the user are checked before being added in the database and creating an account.</p>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/laravel/user-management.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      User Management | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\" \">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"ct-docs-nav-sidenav-active\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              User Management\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">The Admin user has access to a users management table page.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>The user management can be accessed by clicking <b>User Management</b> from the Laravel Examples section of the sidebar or adding <code>/user-management</code> in the url. This page is available for users with the Admin role and the user is able to add, edit and delete other users. For adding a new user you can press the + New User button. If you would like to edit or delete an user you can click on the Action column. It is also possible to sort the fields or to search in the fields.</p>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/laravel/user-profile.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      User Profile | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\" \">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"ct-docs-nav-sidenav-active\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" ct-docs-nav-sidenav \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n                User Profile\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">The user is able to change update his profile information.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>The profile can be accessed by a logged in user by clicking <b>User Profile</b> from the sidebar or adding <b>user-profile</b> in the url. The user can add information like phone number, location, description or change the name and email</p>\n          <p>The <code>App/Http/Controllers/ProfileController.php</code>  handles the user's profile information.</p>\n          <div>\n              <pre>\n              <code class=\" language-html\" data-lang=\"html\">\n                public function update()\n                {\n\n                    $user = request()->user();\n                    $attributes = request()->validate([\n                        'email' => 'required|email|unique:users,email,'.$user->id,\n                        'name' => 'required',\n                        'phone' => 'required|max:10',\n                        'about' => 'required:max:150',\n                        'location' => 'required'\n                    ]);\n                    auth()->user()->update($attributes);\n                    return back()->withStatus('Profile successfully updated.');\n\n            }\n              </code>\n              </pre>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/charts.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Charts | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#line-chart-example\">Line chart example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#line-chart-with-gradient-example\">Line chart with gradient example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bar-chart-example\">Bar chart example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bar-chart-horizontal-example\">Bar chart horizontal example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#mixed-chart-example\">Mixed chart example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#bubble-chart-example\">Bubble chart example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#doughnut-chart-example\">Doughnut chart example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#pie-chart-example\">Pie chart example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#radar-chart-example\">Radar chart example</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#polar-chart-example\">Polar chart example</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Charts\n            </h1>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">The Bootstrap charts refer to a graphical representation of data. <br> Keep reading these simple yet flexible Javascript charting for designers &amp; developers.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <p>In order to use this charts on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/chartjs.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <p>After that, simply copy one of the code examples demonstrated below and include it in your page.</p>\n          <h2 id=\"examples\">Examples</h2>\n          <h3 id=\"line-chart-example\">Line chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"line-chart\" class=\"chart-canvas\" height=\"375\" style=\"display: block; box-sizing: border-box; height: 300px; width: 547.1px;\" width=\"683\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>line-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>300px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"line-chart-with-gradient-example\">Line chart with gradient example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"line-chart-gradient\" class=\"chart-canvas\" height=\"375\" width=\"683\" style=\"display: block; box-sizing: border-box; height: 300px; width: 547.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>line-chart-gradient<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>300px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bar-chart-example\">Bar chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"bar-chart\" class=\"chart-canvas\" height=\"375\" width=\"683\" style=\"display: block; box-sizing: border-box; height: 300px; width: 547.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bar-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>300px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bar-chart-horizontal-example\">Bar chart horizontal example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"bar-chart-horizontal\" class=\"chart-canvas\" height=\"375\" width=\"683\" style=\"display: block; box-sizing: border-box; height: 300px; width: 547.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bar-chart-horizontal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>300px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"mixed-chart-example\">Mixed chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"mixed-chart\" class=\"chart-canvas\" height=\"375\" width=\"683\" style=\"display: block; box-sizing: border-box; height: 300px; width: 547.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mixed-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>300px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"bubble-chart-example\">Bubble chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"bubble-chart\" class=\"chart-canvas\" height=\"318\" width=\"683\" style=\"display: block; box-sizing: border-box; height: 255px; width: 547.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>bubble-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>140px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"doughnut-chart-example\">Doughnut chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"doughnut-chart\" class=\"chart-canvas\" height=\"375\" width=\"683\" style=\"display: block; box-sizing: border-box; height: 300px; width: 547.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>doughnut-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>300px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"pie-chart-example\">Pie chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"chart\">\n                <canvas id=\"pie-chart\" class=\"chart-canvas\" height=\"375\" width=\"683\" style=\"display: block; box-sizing: border-box; height: 300px; width: 547.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pie-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>300px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"radar-chart-example\">Radar chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-5\">\n              <div class=\"chart\">\n                <canvas id=\"radar-chart\" class=\"chart-canvas\" height=\"603\" width=\"603\" style=\"display: block; box-sizing: border-box; height: 483px; width: 483.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>radar-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"polar-chart-example\">Polar chart example</h3>\n          <div class=\"card mb-3\">\n            <div class=\"card-body p-5\">\n              <div class=\"chart\">\n                <canvas id=\"polar-chart\" class=\"chart-canvas\" height=\"603\" width=\"603\" style=\"display: block; box-sizing: border-box; height: 483px; width: 483.1px;\"></canvas>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card mb-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-5<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>canvas</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>polar-chart<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>chart-canvas<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">height</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>100px<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>canvas</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/chartjs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n\n    <script type=\"text/javascript\">\n      // Line chart\n      var ctx1 = document.getElementById(\"line-chart\").getContext(\"2d\");\n\n      new Chart(ctx1, {\n        type: \"line\",\n        data: {\n          labels: [\"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"],\n          datasets: [{\n              label: \"Organic Search\",\n              tension: 0.4,\n              borderWidth: 0,\n              pointRadius: 2,\n              pointBackgroundColor: \"#e3316e\",\n              borderColor: \"#e3316e\",\n              borderWidth: 3,\n              backgroundColor: 'transparent',\n              data: [50, 40, 300, 220, 500, 250, 400, 230, 500],\n              maxBarThickness: 6\n            },\n            {\n              label: \"Referral\",\n              tension: 0.4,\n              borderWidth: 0,\n              pointRadius: 2,\n              pointBackgroundColor: \"#3A416F\",\n              borderColor: \"#3A416F\",\n              borderWidth: 3,\n              backgroundColor: 'transparent',\n              data: [30, 90, 40, 140, 290, 290, 340, 230, 400],\n              maxBarThickness: 6\n            },\n            {\n              label: \"Direct\",\n              tension: 0.4,\n              borderWidth: 0,\n              pointRadius: 2,\n              pointBackgroundColor: \"#17c1e8\",\n              borderColor: \"#17c1e8\",\n              borderWidth: 3,\n              backgroundColor: 'transparent',\n              data: [40, 80, 70, 90, 30, 90, 140, 130, 200],\n              maxBarThickness: 6\n            },\n          ],\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false,\n            }\n          },\n          interaction: {\n            intersect: false,\n            mode: 'index',\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                padding: 10,\n                color: '#b2b9bf',\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: true,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                color: '#b2b9bf',\n                padding: 10,\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n          },\n        },\n      });\n\n      // Line chart with gradient\n      var ctx2 = document.getElementById(\"line-chart-gradient\").getContext(\"2d\");\n\n      new Chart(ctx2, {\n        type: \"line\",\n        data: {\n          labels: [\"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"],\n          datasets: [{\n              label: \"Mobile apps\",\n              tension: 0.4,\n              borderWidth: 0,\n              pointRadius: 0,\n              borderColor: \"#e3316e\",\n              borderWidth: 3,\n              backgroundColor: 'transparent',\n              fill: true,\n              data: [50, 40, 300, 220, 500, 250, 400, 230, 500],\n              maxBarThickness: 6\n\n            },\n            {\n              label: \"Websites\",\n              tension: 0.4,\n              borderWidth: 0,\n              pointRadius: 0,\n              borderColor: \"#3A416F\",\n              borderWidth: 3,\n              backgroundColor: 'transparent',\n              fill: true,\n              data: [30, 90, 40, 140, 290, 290, 340, 230, 400],\n              maxBarThickness: 6\n            },\n          ],\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false,\n            }\n          },\n          interaction: {\n            intersect: false,\n            mode: 'index',\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                padding: 10,\n                color: '#b2b9bf',\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: false,\n                drawOnChartArea: false,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                color: '#b2b9bf',\n                padding: 10,\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n          },\n        },\n      });\n\n      // Doughnut chart\n      var ctx3 = document.getElementById(\"doughnut-chart\").getContext(\"2d\");\n\n      new Chart(ctx3, {\n        type: \"doughnut\",\n        data: {\n          labels: ['Creative Tim', 'Github', 'Bootsnipp', 'Dev.to', 'Codeinwp'],\n          datasets: [{\n            label: \"Projects\",\n            weight: 9,\n            cutout: 60,\n            tension: 0.9,\n            pointRadius: 2,\n            borderWidth: 2,\n            backgroundColor: ['#03a9f4', '#3A416F', '#fb8c00', '#a8b8d8', '#e3316e'],\n            data: [15, 20, 12, 60, 20],\n            fill: false\n          }],\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false,\n            }\n          },\n          interaction: {\n            intersect: false,\n            mode: 'index',\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: false,\n                drawOnChartArea: false,\n                drawTicks: false,\n              },\n              ticks: {\n                display: false\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: false,\n                drawOnChartArea: false,\n                drawTicks: false,\n              },\n              ticks: {\n                display: false,\n              }\n            },\n          },\n        },\n      });\n\n      // Pie chart\n      var ctx4 = document.getElementById(\"pie-chart\").getContext(\"2d\");\n\n      new Chart(ctx4, {\n        type: \"pie\",\n        data: {\n          labels: ['Facebook', 'Direct', 'Organic', 'Referral'],\n          datasets: [{\n            label: \"Projects\",\n            weight: 9,\n            cutout: 0,\n            tension: 0.9,\n            pointRadius: 2,\n            borderWidth: 2,\n            backgroundColor: ['#17c1e8', '#e3316e', '#3A416F', '#a8b8d8'],\n            data: [15, 20, 12, 60],\n            fill: false\n          }],\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false,\n            }\n          },\n          interaction: {\n            intersect: false,\n            mode: 'index',\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: false,\n                drawOnChartArea: false,\n                drawTicks: false,\n              },\n              ticks: {\n                display: false\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: false,\n                drawOnChartArea: false,\n                drawTicks: false,\n              },\n              ticks: {\n                display: false,\n              }\n            },\n          },\n        },\n      });\n\n      // Bar chart\n      var ctx5 = document.getElementById(\"bar-chart\").getContext(\"2d\");\n\n      new Chart(ctx5, {\n        type: \"bar\",\n        data: {\n          labels: ['16-20', '21-25', '26-30', '31-36', '36-42', '42+'],\n          datasets: [{\n            label: \"Sales by age\",\n            weight: 5,\n            borderWidth: 0,\n            borderRadius: 4,\n            backgroundColor: '#3A416F',\n            data: [15, 20, 12, 60, 20, 15],\n            fill: false,\n            maxBarThickness: 35\n          }],\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false,\n            }\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                padding: 10,\n                color: '#9ca2b7'\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: false,\n                drawOnChartArea: true,\n                drawTicks: true,\n              },\n              ticks: {\n                display: true,\n                color: '#9ca2b7',\n                padding: 10\n              }\n            },\n          },\n        },\n      });\n\n      // Bar chart horizontal\n      var ctx6 = document.getElementById(\"bar-chart-horizontal\").getContext(\"2d\");\n\n      new Chart(ctx6, {\n        type: \"bar\",\n        data: {\n          labels: ['16-20', '21-25', '26-30', '31-36', '36-42', '42+'],\n          datasets: [{\n            label: \"Sales by age\",\n            weight: 5,\n            borderWidth: 0,\n            borderRadius: 4,\n            backgroundColor: '#3A416F',\n            data: [15, 20, 12, 60, 20, 15],\n            fill: false\n          }],\n        },\n        options: {\n          indexAxis: 'y',\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false,\n            }\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                padding: 10,\n                color: '#9ca2b7'\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: false,\n                drawOnChartArea: true,\n                drawTicks: true,\n              },\n              ticks: {\n                display: true,\n                color: '#9ca2b7',\n                padding: 10\n              }\n            },\n          },\n        },\n      });\n\n      // Mixed chart\n      var ctx7 = document.getElementById(\"mixed-chart\").getContext(\"2d\");\n\n      new Chart(ctx7, {\n        data: {\n          labels: [\"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"],\n          datasets: [{\n              type: \"bar\",\n              label: \"Organic Search\",\n              weight: 5,\n              tension: 0.4,\n              borderWidth: 0,\n              pointBackgroundColor: \"#3A416F\",\n              borderColor: \"#3A416F\",\n              backgroundColor: '#3A416F',\n              borderRadius: 4,\n              borderSkipped: false,\n              data: [50, 40, 300, 220, 500, 250, 400, 230, 500],\n              maxBarThickness: 10,\n            },\n            {\n              type: \"line\",\n              label: \"Referral\",\n              tension: 0.4,\n              borderWidth: 0,\n              pointRadius: 0,\n              pointBackgroundColor: \"#e3316e\",\n              borderColor: \"#e3316e\",\n              borderWidth: 3,\n              backgroundColor: 'transparent',\n              data: [30, 90, 40, 140, 290, 290, 340, 230, 400],\n              fill: true,\n            }\n          ],\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          plugins: {\n            legend: {\n              display: false,\n            }\n          },\n          interaction: {\n            intersect: false,\n            mode: 'index',\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                padding: 10,\n                color: '#b2b9bf',\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: true,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                color: '#b2b9bf',\n                padding: 10,\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n          },\n        },\n      });\n\n      // Bubble chart\n      var ctx8 = document.getElementById(\"bubble-chart\").getContext(\"2d\");\n\n      new Chart(ctx8, {\n        type: \"bubble\",\n        data: {\n          labels: ['0', '10', '20', '30', '40', '50', '60', '70', '80', '90'],\n          datasets: [{\n              label: 'Dataset 1',\n              data: [{\n                x: 100,\n                y: 0,\n                r: 10\n              }, {\n                x: 60,\n                y: 30,\n                r: 20\n              }, {\n                x: 40,\n                y: 350,\n                r: 10\n              }, {\n                x: 80,\n                y: 80,\n                r: 10\n              }, {\n                x: 20,\n                y: 30,\n                r: 15\n              }, {\n                x: 0,\n                y: 100,\n                r: 5\n              }],\n              backgroundColor: '#e3316e',\n            },\n            {\n              label: 'Dataset 2',\n              data: [{\n                x: 70,\n                y: 40,\n                r: 10\n              }, {\n                x: 30,\n                y: 60,\n                r: 20\n              }, {\n                x: 10,\n                y: 300,\n                r: 25\n              }, {\n                x: 60,\n                y: 200,\n                r: 10\n              }, {\n                x: 50,\n                y: 300,\n                r: 15\n              }, {\n                x: 20,\n                y: 350,\n                r: 5\n              }],\n              backgroundColor: '#3A416F',\n            }\n          ]\n        },\n        options: {\n          responsive: true,\n          plugins: {\n            legend: {\n              display: false\n            }\n          },\n          scales: {\n            y: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                padding: 10,\n                color: '#b2b9bf',\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n            x: {\n              grid: {\n                drawBorder: false,\n                display: true,\n                drawOnChartArea: true,\n                drawTicks: false,\n                borderDash: [5, 5]\n              },\n              ticks: {\n                display: true,\n                color: '#b2b9bf',\n                padding: 10,\n                font: {\n                  size: 11,\n                  family: \"Open Sans\",\n                  style: 'normal',\n                  lineHeight: 2\n                },\n              }\n            },\n          },\n        },\n      });\n\n      // Radar chart\n      var ctx9 = document.getElementById(\"radar-chart\").getContext(\"2d\");\n\n      new Chart(ctx9, {\n        type: \"radar\",\n        data: {\n          labels: [\"English\", \"Maths\", \"Physics\", \"Chemistry\", \"Biology\", \"History\"],\n          datasets: [{\n            label: \"Student A\",\n            backgroundColor: \"rgba(58,65,111,0.2)\",\n            data: [65, 75, 70, 80, 60, 80],\n            borderDash: [5, 5],\n          }, {\n            label: \"Student B\",\n            backgroundColor: \"rgba(203,12,159,0.2)\",\n            data: [54, 65, 60, 70, 70, 75]\n          }]\n        },\n        options: {\n          plugins: {\n            legend: {\n              display: false,\n            }\n          }\n        }\n      });\n\n      // Radar chart\n      var ctx10 = document.getElementById(\"polar-chart\").getContext(\"2d\");\n\n      new Chart(ctx10, {\n        type: \"polarArea\",\n        data: {\n          labels: [\n            'Red',\n            'Green',\n            'Yellow',\n            'Grey',\n            'Blue'\n          ],\n          datasets: [{\n            label: 'My First Dataset',\n            data: [11, 16, 7, 3, 14],\n            backgroundColor: ['#17c1e8', '#e3316e', '#3A416F', '#a8b8d8', '#4caf50'],\n          }]\n        },\n        options: {\n          plugins: {\n            legend: {\n              display: false,\n            }\n          }\n        }\n      });\n    </script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/choices.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Choices | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#single-selection\">Single Selection</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#tags\">Tags</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Choices\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">A vanilla JS customisable select box/text input plugin.</p>\n          <hr class=\"ct-docs-hr\">\n          <p>We have styled the select picker to look similar to the dropdown and the other inputs.</p>\n          <h2 id=\"examples\">Examples</h2>\n          <h3 id=\"single-selection\">Single Selection</h3>\n          <p><select class=\"form-control\" name=\"choices-button\" id=\"choices-button\" placeholder=\"Departure\">\n              <option value=\"Choice 1\" selected=\"\">Brazil</option>\n              <option value=\"Choice 2\">Bucharest</option>\n              <option value=\"Choice 3\">London</option>\n              <option value=\"Choice 4\">USA</option>\n            </select></p>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;select</span> <span class=\"na\">class=</span><span class=\"s\">\"form-control\"</span> <span class=\"na\">name=</span><span class=\"s\">\"choices-button\"</span> <span class=\"na\">id=</span><span class=\"s\">\"choices-button\"</span> <span class=\"na\">placeholder=</span><span class=\"s\">\"Departure\"</span><span class=\"nt\">&gt;</span>\n  <span class=\"nt\">&lt;option</span> <span class=\"na\">value=</span><span class=\"s\">\"Choice 1\"</span> <span class=\"na\">selected=</span><span class=\"s\">\"\"</span><span class=\"nt\">&gt;</span>Brazil<span class=\"nt\">&lt;/option&gt;</span>\n  <span class=\"nt\">&lt;option</span> <span class=\"na\">value=</span><span class=\"s\">\"Choice 2\"</span><span class=\"nt\">&gt;</span>Bucharest<span class=\"nt\">&lt;/option&gt;</span>\n  <span class=\"nt\">&lt;option</span> <span class=\"na\">value=</span><span class=\"s\">\"Choice 3\"</span><span class=\"nt\">&gt;</span>London<span class=\"nt\">&lt;/option&gt;</span>\n  <span class=\"nt\">&lt;option</span> <span class=\"na\">value=</span><span class=\"s\">\"Choice 4\"</span><span class=\"nt\">&gt;</span>USA<span class=\"nt\">&lt;/option&gt;</span>\n<span class=\"nt\">&lt;/select&gt;</span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"tags\">Tags</h3>\n          <p><input class=\"form-control\" id=\"choices-tags\" data-color=\"dark\" type=\"text\" value=\"vuejs, angular, react, laravel\" placeholder=\"Enter something\" /></p>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;input</span> <span class=\"na\">class=</span><span class=\"s\">\"form-control\"</span> <span class=\"na\">id=</span><span class=\"s\">\"choices-tags\"</span> <span class=\"na\">data-color=</span><span class=\"s\">\"dark\"</span> <span class=\"na\">type=</span><span class=\"s\">\"text\"</span> <span class=\"na\">value=</span><span class=\"s\">\"vuejs, angular, react, laravel\"</span> <span class=\"na\">placeholder=</span><span class=\"s\">\"Enter something\"</span> <span class=\"nt\">/&gt;</span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/choices.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n    <script type=\"text/javascript\">\n      if (document.getElementById('choices-button')) {\n        var element = document.getElementById('choices-button');\n        const example = new Choices(element, {});\n      }\n      var choicesTags = document.getElementById('choices-tags');\n      var color = choicesTags.dataset.color;\n      if (choicesTags) {\n        const example = new Choices(choicesTags, {\n          delimiter: ',',\n          editItems: true,\n          maxItemCount: 5,\n          removeItemButton: true,\n          addItems: true,\n          classNames: {\n            item: 'badge rounded-pill choices-' + color + ' me-2'\n          }\n        });\n      }\n    </script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/countUpJs.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      CountUp JS | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#earnings\">Earnings</a></li>\n                <li class=\"toc-entry toc-h4\"><a href=\"#-\">$ </a>\n                  <ul>\n                    <li class=\"toc-entry toc-h6\"><a href=\"#customers\">Customers</a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h4\"><a href=\"#--1\">$ </a>\n                  <ul>\n                    <li class=\"toc-entry toc-h6\"><a href=\"#avg-value\">Avg. Value</a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h4\"><a href=\"#--2\">$ </a>\n                  <ul>\n                    <li class=\"toc-entry toc-h6\"><a href=\"#refund-rate\">Refund Rate</a></li>\n                  </ul>\n                </li>\n                <li class=\"toc-entry toc-h4\"><a href=\"#--3\"> %</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap CountUp JS\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">CountUp.js is a dependency-free, lightweight JavaScript class that can be used to quickly create animations that display numerical data in a more interesting way.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/countup.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"example\">Example</h2>\n          <div class=\"row mb-3\">\n            <div class=\"col-lg-3 col-6 text-center\">\n              <div class=\"border border-light border-1 border-radius-md py-3\">\n                <h6 class=\"text-primary text-gradient mb-0\">Earnings</h6>\n                <h4 class=\"font-weight-bolder\"><span class=\"small\">$ </span><span id=\"state1\" countto=\"23980\">23,980</span></h4>\n              </div>\n            </div>\n            <div class=\"col-lg-3 col-6 text-center\">\n              <div class=\"border border-light border-1 border-radius-md py-3\">\n                <h6 class=\"text-primary text-gradient mb-0\">Customers</h6>\n                <h4 class=\"font-weight-bolder\"><span class=\"small\">$ </span><span id=\"state2\" countto=\"2400\">2,400</span></h4>\n              </div>\n            </div>\n            <div class=\"col-lg-3 col-6 text-center mt-4 mt-lg-0\">\n              <div class=\"border border-light border-1 border-radius-md py-3\">\n                <h6 class=\"text-primary text-gradient mb-0\">Avg. Value</h6>\n                <h4 class=\"font-weight-bolder\"><span class=\"small\">$ </span><span id=\"state3\" countto=\"48\">48</span></h4>\n              </div>\n            </div>\n            <div class=\"col-lg-3 col-6 text-center mt-4 mt-lg-0\">\n              <div class=\"border border-light border-1 border-radius-md py-3\">\n                <h6 class=\"text-primary text-gradient mb-0\">Refund Rate</h6>\n                <h4 class=\"font-weight-bolder\"><span id=\"state4\" countto=\"4\">4</span><span class=\"small\"> %</span></h4>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>row<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-lg-3 col-6 text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>border border-light border-1 border-radius-md py-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-primary text-gradient mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Earnings<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bolder<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>small<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$ <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>state1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">countTo</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>23980<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-lg-3 col-6 text-center<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>border border-light border-1 border-radius-md py-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-primary text-gradient mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Customers<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bolder<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>small<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$ <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>state2<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">countTo</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>2400<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-lg-3 col-6 text-center mt-4 mt-lg-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>border border-light border-1 border-radius-md py-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-primary text-gradient mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Avg. Value<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bolder<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>small<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>$ <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>state3<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">countTo</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>48<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>col-lg-3 col-6 text-center mt-4 mt-lg-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>border border-light border-1 border-radius-md py-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-primary text-gradient mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Refund Rate<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bolder<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>state4<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">countTo</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>small<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span> %<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">if (document.getElementById('state1')) {\n    const countUp = new CountUp('state1', document.getElementById(\"state1\").getAttribute(\"countTo\"));\n    if (!countUp.error) {\n      countUp.start();\n    } else {\n      console.error(countUp.error);\n    }\n  }\n  if (document.getElementById('state2')) {\n    const countUp = new CountUp('state2', document.getElementById(\"state2\").getAttribute(\"countTo\"));\n    if (!countUp.error) {\n      countUp.start();\n    } else {\n      console.error(countUp.error);\n    }\n  }\n  if (document.getElementById('state3')) {\n    const countUp = new CountUp('state3', document.getElementById(\"state3\").getAttribute(\"countTo\"));\n    if (!countUp.error) {\n      countUp.start();\n    } else {\n      console.error(countUp.error);\n    }\n  }\n  if (document.getElementById('state4')) {\n    const countUp = new CountUp('state4', document.getElementById(\"state4\").getAttribute(\"countTo\"));\n    if (!countUp.error) {\n      countUp.start();\n    } else {\n      console.error(countUp.error);\n    }\n  }</code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/countup.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n        if (document.getElementById('state1')) {\n          const countUp = new CountUp('state1', document.getElementById(\"state1\").getAttribute(\"countTo\"));\n          if (!countUp.error) {\n            countUp.start();\n          } else {\n            console.error(countUp.error);\n          }\n        }\n        if (document.getElementById('state2')) {\n          const countUp = new CountUp('state2', document.getElementById(\"state2\").getAttribute(\"countTo\"));\n          if (!countUp.error) {\n            countUp.start();\n          } else {\n            console.error(countUp.error);\n          }\n        }\n        if (document.getElementById('state3')) {\n          const countUp = new CountUp('state3', document.getElementById(\"state3\").getAttribute(\"countTo\"));\n          if (!countUp.error) {\n            countUp.start();\n          } else {\n            console.error(countUp.error);\n          }\n        }\n        if (document.getElementById('state4')) {\n          const countUp = new CountUp('state4', document.getElementById(\"state4\").getAttribute(\"countTo\"));\n          if (!countUp.error) {\n            countUp.start();\n          } else {\n            console.error(countUp.error);\n          }\n        }\n      </script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/datatables.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Datatables | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#datatable-basic-example\">Datatable Basic example</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Datatables\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Check out our Bootstrap datatables examples and learn how to add advanced interaction controls to your HTML tables the easy way.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/datatables.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"example\">Example</h2>\n          <h3 id=\"datatable-basic-example\">Datatable Basic example</h3>\n          <div class=\"table-responsive\">\n            <table class=\"table table-flush\" id=\"datatable-basic\">\n              <thead class=\"thead-light\">\n                <tr>\n                  <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Name</th>\n                  <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Position</th>\n                  <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Office</th>\n                  <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Age</th>\n                  <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Start date</th>\n                  <th class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">Salary</th>\n                </tr>\n              </thead>\n              <tbody>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Tiger Nixon</td>\n                  <td class=\"text-sm font-weight-normal\">System Architect</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">61</td>\n                  <td class=\"text-sm font-weight-normal\">2011/04/25</td>\n                  <td class=\"text-sm font-weight-normal\">$320,800</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Garrett Winters</td>\n                  <td class=\"text-sm font-weight-normal\">Accountant</td>\n                  <td class=\"text-sm font-weight-normal\">Tokyo</td>\n                  <td class=\"text-sm font-weight-normal\">63</td>\n                  <td class=\"text-sm font-weight-normal\">2011/07/25</td>\n                  <td class=\"text-sm font-weight-normal\">$170,750</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Ashton Cox</td>\n                  <td class=\"text-sm font-weight-normal\">Junior Technical Author</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">66</td>\n                  <td class=\"text-sm font-weight-normal\">2009/01/12</td>\n                  <td class=\"text-sm font-weight-normal\">$86,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Cedric Kelly</td>\n                  <td class=\"text-sm font-weight-normal\">Senior Javascript Developer</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">22</td>\n                  <td class=\"text-sm font-weight-normal\">2012/03/29</td>\n                  <td class=\"text-sm font-weight-normal\">$433,060</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Airi Satou</td>\n                  <td class=\"text-sm font-weight-normal\">Accountant</td>\n                  <td class=\"text-sm font-weight-normal\">Tokyo</td>\n                  <td class=\"text-sm font-weight-normal\">33</td>\n                  <td class=\"text-sm font-weight-normal\">2008/11/28</td>\n                  <td class=\"text-sm font-weight-normal\">$162,700</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Brielle Williamson</td>\n                  <td class=\"text-sm font-weight-normal\">Integration Specialist</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">61</td>\n                  <td class=\"text-sm font-weight-normal\">2012/12/02</td>\n                  <td class=\"text-sm font-weight-normal\">$372,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Herrod Chandler</td>\n                  <td class=\"text-sm font-weight-normal\">Sales Assistant</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">59</td>\n                  <td class=\"text-sm font-weight-normal\">2012/08/06</td>\n                  <td class=\"text-sm font-weight-normal\">$137,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Rhona Davidson</td>\n                  <td class=\"text-sm font-weight-normal\">Integration Specialist</td>\n                  <td class=\"text-sm font-weight-normal\">Tokyo</td>\n                  <td class=\"text-sm font-weight-normal\">55</td>\n                  <td class=\"text-sm font-weight-normal\">2010/10/14</td>\n                  <td class=\"text-sm font-weight-normal\">$327,900</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Colleen Hurst</td>\n                  <td class=\"text-sm font-weight-normal\">Javascript Developer</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">39</td>\n                  <td class=\"text-sm font-weight-normal\">2009/09/15</td>\n                  <td class=\"text-sm font-weight-normal\">$205,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Sonya Frost</td>\n                  <td class=\"text-sm font-weight-normal\">Software Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">23</td>\n                  <td class=\"text-sm font-weight-normal\">2008/12/13</td>\n                  <td class=\"text-sm font-weight-normal\">$103,600</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Jena Gaines</td>\n                  <td class=\"text-sm font-weight-normal\">Office Manager</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">30</td>\n                  <td class=\"text-sm font-weight-normal\">2008/12/19</td>\n                  <td class=\"text-sm font-weight-normal\">$90,560</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Quinn Flynn</td>\n                  <td class=\"text-sm font-weight-normal\">Support Lead</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">22</td>\n                  <td class=\"text-sm font-weight-normal\">2013/03/03</td>\n                  <td class=\"text-sm font-weight-normal\">$342,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Charde Marshall</td>\n                  <td class=\"text-sm font-weight-normal\">Regional Director</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">36</td>\n                  <td class=\"text-sm font-weight-normal\">2008/10/16</td>\n                  <td class=\"text-sm font-weight-normal\">$470,600</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Haley Kennedy</td>\n                  <td class=\"text-sm font-weight-normal\">Senior Marketing Designer</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">43</td>\n                  <td class=\"text-sm font-weight-normal\">2012/12/18</td>\n                  <td class=\"text-sm font-weight-normal\">$313,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Tatyana Fitzpatrick</td>\n                  <td class=\"text-sm font-weight-normal\">Regional Director</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">19</td>\n                  <td class=\"text-sm font-weight-normal\">2010/03/17</td>\n                  <td class=\"text-sm font-weight-normal\">$385,750</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Michael Silva</td>\n                  <td class=\"text-sm font-weight-normal\">Marketing Designer</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">66</td>\n                  <td class=\"text-sm font-weight-normal\">2012/11/27</td>\n                  <td class=\"text-sm font-weight-normal\">$198,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Paul Byrd</td>\n                  <td class=\"text-sm font-weight-normal\">Chief Financial Officer (CFO)</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">64</td>\n                  <td class=\"text-sm font-weight-normal\">2010/06/09</td>\n                  <td class=\"text-sm font-weight-normal\">$725,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Gloria Little</td>\n                  <td class=\"text-sm font-weight-normal\">Systems Administrator</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">59</td>\n                  <td class=\"text-sm font-weight-normal\">2009/04/10</td>\n                  <td class=\"text-sm font-weight-normal\">$237,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Bradley Greer</td>\n                  <td class=\"text-sm font-weight-normal\">Software Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">41</td>\n                  <td class=\"text-sm font-weight-normal\">2012/10/13</td>\n                  <td class=\"text-sm font-weight-normal\">$132,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Dai Rios</td>\n                  <td class=\"text-sm font-weight-normal\">Personnel Lead</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">35</td>\n                  <td class=\"text-sm font-weight-normal\">2012/09/26</td>\n                  <td class=\"text-sm font-weight-normal\">$217,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Jenette Caldwell</td>\n                  <td class=\"text-sm font-weight-normal\">Development Lead</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">30</td>\n                  <td class=\"text-sm font-weight-normal\">2011/09/03</td>\n                  <td class=\"text-sm font-weight-normal\">$345,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Yuri Berry</td>\n                  <td class=\"text-sm font-weight-normal\">Chief Marketing Officer (CMO)</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">40</td>\n                  <td class=\"text-sm font-weight-normal\">2009/06/25</td>\n                  <td class=\"text-sm font-weight-normal\">$675,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Caesar Vance</td>\n                  <td class=\"text-sm font-weight-normal\">Pre-Sales Support</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">21</td>\n                  <td class=\"text-sm font-weight-normal\">2011/12/12</td>\n                  <td class=\"text-sm font-weight-normal\">$106,450</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Doris Wilder</td>\n                  <td class=\"text-sm font-weight-normal\">Sales Assistant</td>\n                  <td class=\"text-sm font-weight-normal\">Sidney</td>\n                  <td class=\"text-sm font-weight-normal\">23</td>\n                  <td class=\"text-sm font-weight-normal\">2010/09/20</td>\n                  <td class=\"text-sm font-weight-normal\">$85,600</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Angelica Ramos</td>\n                  <td class=\"text-sm font-weight-normal\">Chief Executive Officer (CEO)</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">47</td>\n                  <td class=\"text-sm font-weight-normal\">2009/10/09</td>\n                  <td class=\"text-sm font-weight-normal\">$1,200,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Gavin Joyce</td>\n                  <td class=\"text-sm font-weight-normal\">Developer</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">42</td>\n                  <td class=\"text-sm font-weight-normal\">2010/12/22</td>\n                  <td class=\"text-sm font-weight-normal\">$92,575</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Jennifer Chang</td>\n                  <td class=\"text-sm font-weight-normal\">Regional Director</td>\n                  <td class=\"text-sm font-weight-normal\">Singapore</td>\n                  <td class=\"text-sm font-weight-normal\">28</td>\n                  <td class=\"text-sm font-weight-normal\">2010/11/14</td>\n                  <td class=\"text-sm font-weight-normal\">$357,650</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Brenden Wagner</td>\n                  <td class=\"text-sm font-weight-normal\">Software Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">28</td>\n                  <td class=\"text-sm font-weight-normal\">2011/06/07</td>\n                  <td class=\"text-sm font-weight-normal\">$206,850</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Fiona Green</td>\n                  <td class=\"text-sm font-weight-normal\">Chief Operating Officer (COO)</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">48</td>\n                  <td class=\"text-sm font-weight-normal\">2010/03/11</td>\n                  <td class=\"text-sm font-weight-normal\">$850,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Shou Itou</td>\n                  <td class=\"text-sm font-weight-normal\">Regional Marketing</td>\n                  <td class=\"text-sm font-weight-normal\">Tokyo</td>\n                  <td class=\"text-sm font-weight-normal\">20</td>\n                  <td class=\"text-sm font-weight-normal\">2011/08/14</td>\n                  <td class=\"text-sm font-weight-normal\">$163,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Michelle House</td>\n                  <td class=\"text-sm font-weight-normal\">Integration Specialist</td>\n                  <td class=\"text-sm font-weight-normal\">Sidney</td>\n                  <td class=\"text-sm font-weight-normal\">37</td>\n                  <td class=\"text-sm font-weight-normal\">2011/06/02</td>\n                  <td class=\"text-sm font-weight-normal\">$95,400</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Suki Burks</td>\n                  <td class=\"text-sm font-weight-normal\">Developer</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">53</td>\n                  <td class=\"text-sm font-weight-normal\">2009/10/22</td>\n                  <td class=\"text-sm font-weight-normal\">$114,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Prescott Bartlett</td>\n                  <td class=\"text-sm font-weight-normal\">Technical Author</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">27</td>\n                  <td class=\"text-sm font-weight-normal\">2011/05/07</td>\n                  <td class=\"text-sm font-weight-normal\">$145,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Gavin Cortez</td>\n                  <td class=\"text-sm font-weight-normal\">Team Leader</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">22</td>\n                  <td class=\"text-sm font-weight-normal\">2008/10/26</td>\n                  <td class=\"text-sm font-weight-normal\">$235,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Martena Mccray</td>\n                  <td class=\"text-sm font-weight-normal\">Post-Sales support</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">46</td>\n                  <td class=\"text-sm font-weight-normal\">2011/03/09</td>\n                  <td class=\"text-sm font-weight-normal\">$324,050</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Unity Butler</td>\n                  <td class=\"text-sm font-weight-normal\">Marketing Designer</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">47</td>\n                  <td class=\"text-sm font-weight-normal\">2009/12/09</td>\n                  <td class=\"text-sm font-weight-normal\">$85,675</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Howard Hatfield</td>\n                  <td class=\"text-sm font-weight-normal\">Office Manager</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">51</td>\n                  <td class=\"text-sm font-weight-normal\">2008/12/16</td>\n                  <td class=\"text-sm font-weight-normal\">$164,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Hope Fuentes</td>\n                  <td class=\"text-sm font-weight-normal\">Secretary</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">41</td>\n                  <td class=\"text-sm font-weight-normal\">2010/02/12</td>\n                  <td class=\"text-sm font-weight-normal\">$109,850</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Vivian Harrell</td>\n                  <td class=\"text-sm font-weight-normal\">Financial Controller</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">62</td>\n                  <td class=\"text-sm font-weight-normal\">2009/02/14</td>\n                  <td class=\"text-sm font-weight-normal\">$452,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Timothy Mooney</td>\n                  <td class=\"text-sm font-weight-normal\">Office Manager</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">37</td>\n                  <td class=\"text-sm font-weight-normal\">2008/12/11</td>\n                  <td class=\"text-sm font-weight-normal\">$136,200</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Jackson Bradshaw</td>\n                  <td class=\"text-sm font-weight-normal\">Director</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">65</td>\n                  <td class=\"text-sm font-weight-normal\">2008/09/26</td>\n                  <td class=\"text-sm font-weight-normal\">$645,750</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Olivia Liang</td>\n                  <td class=\"text-sm font-weight-normal\">Support Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">Singapore</td>\n                  <td class=\"text-sm font-weight-normal\">64</td>\n                  <td class=\"text-sm font-weight-normal\">2011/02/03</td>\n                  <td class=\"text-sm font-weight-normal\">$234,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Bruno Nash</td>\n                  <td class=\"text-sm font-weight-normal\">Software Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">38</td>\n                  <td class=\"text-sm font-weight-normal\">2011/05/03</td>\n                  <td class=\"text-sm font-weight-normal\">$163,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Sakura Yamamoto</td>\n                  <td class=\"text-sm font-weight-normal\">Support Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">Tokyo</td>\n                  <td class=\"text-sm font-weight-normal\">37</td>\n                  <td class=\"text-sm font-weight-normal\">2009/08/19</td>\n                  <td class=\"text-sm font-weight-normal\">$139,575</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Thor Walton</td>\n                  <td class=\"text-sm font-weight-normal\">Developer</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">61</td>\n                  <td class=\"text-sm font-weight-normal\">2013/08/11</td>\n                  <td class=\"text-sm font-weight-normal\">$98,540</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Finn Camacho</td>\n                  <td class=\"text-sm font-weight-normal\">Support Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">47</td>\n                  <td class=\"text-sm font-weight-normal\">2009/07/07</td>\n                  <td class=\"text-sm font-weight-normal\">$87,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Serge Baldwin</td>\n                  <td class=\"text-sm font-weight-normal\">Data Coordinator</td>\n                  <td class=\"text-sm font-weight-normal\">Singapore</td>\n                  <td class=\"text-sm font-weight-normal\">64</td>\n                  <td class=\"text-sm font-weight-normal\">2012/04/09</td>\n                  <td class=\"text-sm font-weight-normal\">$138,575</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Zenaida Frank</td>\n                  <td class=\"text-sm font-weight-normal\">Software Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">63</td>\n                  <td class=\"text-sm font-weight-normal\">2010/01/04</td>\n                  <td class=\"text-sm font-weight-normal\">$125,250</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Zorita Serrano</td>\n                  <td class=\"text-sm font-weight-normal\">Software Engineer</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">56</td>\n                  <td class=\"text-sm font-weight-normal\">2012/06/01</td>\n                  <td class=\"text-sm font-weight-normal\">$115,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Jennifer Acosta</td>\n                  <td class=\"text-sm font-weight-normal\">Junior Javascript Developer</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">43</td>\n                  <td class=\"text-sm font-weight-normal\">2013/02/01</td>\n                  <td class=\"text-sm font-weight-normal\">$75,650</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Cara Stevens</td>\n                  <td class=\"text-sm font-weight-normal\">Sales Assistant</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">46</td>\n                  <td class=\"text-sm font-weight-normal\">2011/12/06</td>\n                  <td class=\"text-sm font-weight-normal\">$145,600</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Hermione Butler</td>\n                  <td class=\"text-sm font-weight-normal\">Regional Director</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">47</td>\n                  <td class=\"text-sm font-weight-normal\">2011/03/21</td>\n                  <td class=\"text-sm font-weight-normal\">$356,250</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Lael Greer</td>\n                  <td class=\"text-sm font-weight-normal\">Systems Administrator</td>\n                  <td class=\"text-sm font-weight-normal\">London</td>\n                  <td class=\"text-sm font-weight-normal\">21</td>\n                  <td class=\"text-sm font-weight-normal\">2009/02/27</td>\n                  <td class=\"text-sm font-weight-normal\">$103,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Jonas Alexander</td>\n                  <td class=\"text-sm font-weight-normal\">Developer</td>\n                  <td class=\"text-sm font-weight-normal\">San Francisco</td>\n                  <td class=\"text-sm font-weight-normal\">30</td>\n                  <td class=\"text-sm font-weight-normal\">2010/07/14</td>\n                  <td class=\"text-sm font-weight-normal\">$86,500</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Shad Decker</td>\n                  <td class=\"text-sm font-weight-normal\">Regional Director</td>\n                  <td class=\"text-sm font-weight-normal\">Edinburgh</td>\n                  <td class=\"text-sm font-weight-normal\">51</td>\n                  <td class=\"text-sm font-weight-normal\">2008/11/13</td>\n                  <td class=\"text-sm font-weight-normal\">$183,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Michael Bruce</td>\n                  <td class=\"text-sm font-weight-normal\">Javascript Developer</td>\n                  <td class=\"text-sm font-weight-normal\">Singapore</td>\n                  <td class=\"text-sm font-weight-normal\">29</td>\n                  <td class=\"text-sm font-weight-normal\">2011/06/27</td>\n                  <td class=\"text-sm font-weight-normal\">$183,000</td>\n                </tr>\n                <tr>\n                  <td class=\"text-sm font-weight-normal\">Donna Snider</td>\n                  <td class=\"text-sm font-weight-normal\">Customer Support</td>\n                  <td class=\"text-sm font-weight-normal\">New York</td>\n                  <td class=\"text-sm font-weight-normal\">27</td>\n                  <td class=\"text-sm font-weight-normal\">2011/01/25</td>\n                  <td class=\"text-sm font-weight-normal\">$112,000</td>\n                </tr>\n              </tbody>\n            </table>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n\n    <script src=\"../../assets/js/datatables.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      const dataTableBasic = new simpleDatatables.DataTable(\"#datatable-basic\", {\n        searchable: false,\n        fixedHeight: true\n      });\n    </script>\n        <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n  </body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/datepicker.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Datepicker | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#initialization\">Initialization</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#range-datepicker\">Range datepicker</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Datepicker\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">The Bootstrap flatpickr is a lightweight and powerful datetime picker.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <p>In order to use this plugin on your page you will need to include the following script:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>/assets/js/plugins/flatpickr.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"initialization\">Initialization</h2>\n          <p>Add the <code class=\" highlighter-rouge language-plaintext\">.datepicker</code> class on the text input that you want to become a datepicker.</p>\n          <h2 id=\"range-datepicker\">Range datepicker</h2>\n          <div class=\"input-group input-group-static\">\n            <input class=\"form-control datepicker flatpickr-input\" placeholder=\"Please select date\" type=\"text\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\" readonly=\"readonly\">\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group input-group-static<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control datepicker<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Please select date<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocus</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>focused(this)<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">onfocusout</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>defocused(this)<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/flatpickr.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      if (document.querySelector('.datepicker')) {\n        flatpickr('.datepicker', {\n          mode: \"range\"\n        }); // flatpickr\n      }\n    </script><div class=\"flatpickr-calendar rangeMode animate\" tabindex=\"-1\"><div class=\"flatpickr-months\"><span class=\"flatpickr-prev-month\"><svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 17 17\"><g></g><path d=\"M5.207 8.471l7.146 7.147-0.707 0.707-7.853-7.854 7.854-7.853 0.707 0.707-7.147 7.146z\"></path></svg></span><div class=\"flatpickr-month\"><div class=\"flatpickr-current-month\"><select class=\"flatpickr-monthDropdown-months\" aria-label=\"Month\" tabindex=\"-1\"><option class=\"flatpickr-monthDropdown-month\" value=\"0\" tabindex=\"-1\">January</option><option class=\"flatpickr-monthDropdown-month\" value=\"1\" tabindex=\"-1\">February</option><option class=\"flatpickr-monthDropdown-month\" value=\"2\" tabindex=\"-1\">March</option><option class=\"flatpickr-monthDropdown-month\" value=\"3\" tabindex=\"-1\">April</option><option class=\"flatpickr-monthDropdown-month\" value=\"4\" tabindex=\"-1\">May</option><option class=\"flatpickr-monthDropdown-month\" value=\"5\" tabindex=\"-1\">June</option><option class=\"flatpickr-monthDropdown-month\" value=\"6\" tabindex=\"-1\">July</option><option class=\"flatpickr-monthDropdown-month\" value=\"7\" tabindex=\"-1\">August</option><option class=\"flatpickr-monthDropdown-month\" value=\"8\" tabindex=\"-1\">September</option><option class=\"flatpickr-monthDropdown-month\" value=\"9\" tabindex=\"-1\">October</option><option class=\"flatpickr-monthDropdown-month\" value=\"10\" tabindex=\"-1\">November</option><option class=\"flatpickr-monthDropdown-month\" value=\"11\" tabindex=\"-1\">December</option></select><div class=\"numInputWrapper\"><input class=\"numInput cur-year\" type=\"number\" tabindex=\"-1\" aria-label=\"Year\"><span class=\"arrowUp\"></span><span class=\"arrowDown\"></span></div></div></div><span class=\"flatpickr-next-month\"><svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 17 17\"><g></g><path d=\"M13.207 8.472l-7.854 7.854-0.707-0.707 7.146-7.146-7.146-7.148 0.707-0.707 7.854 7.854z\"></path></svg></span></div><div class=\"flatpickr-innerContainer\"><div class=\"flatpickr-rContainer\"><div class=\"flatpickr-weekdays\"><div class=\"flatpickr-weekdaycontainer\">\n      <span class=\"flatpickr-weekday\">\n        Sun</span><span class=\"flatpickr-weekday\">Mon</span><span class=\"flatpickr-weekday\">Tue</span><span class=\"flatpickr-weekday\">Wed</span><span class=\"flatpickr-weekday\">Thu</span><span class=\"flatpickr-weekday\">Fri</span><span class=\"flatpickr-weekday\">Sat\n      </span>\n      </div></div><div class=\"flatpickr-days\" tabindex=\"-1\"><div class=\"dayContainer\"><span class=\"flatpickr-day prevMonthDay\" aria-label=\"October 31, 2021\" tabindex=\"-1\">31</span><span class=\"flatpickr-day \" aria-label=\"November 1, 2021\" tabindex=\"-1\">1</span><span class=\"flatpickr-day \" aria-label=\"November 2, 2021\" tabindex=\"-1\">2</span><span class=\"flatpickr-day \" aria-label=\"November 3, 2021\" tabindex=\"-1\">3</span><span class=\"flatpickr-day \" aria-label=\"November 4, 2021\" tabindex=\"-1\">4</span><span class=\"flatpickr-day \" aria-label=\"November 5, 2021\" tabindex=\"-1\">5</span><span class=\"flatpickr-day \" aria-label=\"November 6, 2021\" tabindex=\"-1\">6</span><span class=\"flatpickr-day \" aria-label=\"November 7, 2021\" tabindex=\"-1\">7</span><span class=\"flatpickr-day \" aria-label=\"November 8, 2021\" tabindex=\"-1\">8</span><span class=\"flatpickr-day \" aria-label=\"November 9, 2021\" tabindex=\"-1\">9</span><span class=\"flatpickr-day \" aria-label=\"November 10, 2021\" tabindex=\"-1\">10</span><span class=\"flatpickr-day \" aria-label=\"November 11, 2021\" tabindex=\"-1\">11</span><span class=\"flatpickr-day \" aria-label=\"November 12, 2021\" tabindex=\"-1\">12</span><span class=\"flatpickr-day \" aria-label=\"November 13, 2021\" tabindex=\"-1\">13</span><span class=\"flatpickr-day \" aria-label=\"November 14, 2021\" tabindex=\"-1\">14</span><span class=\"flatpickr-day \" aria-label=\"November 15, 2021\" tabindex=\"-1\">15</span><span class=\"flatpickr-day \" aria-label=\"November 16, 2021\" tabindex=\"-1\">16</span><span class=\"flatpickr-day \" aria-label=\"November 17, 2021\" tabindex=\"-1\">17</span><span class=\"flatpickr-day \" aria-label=\"November 18, 2021\" tabindex=\"-1\">18</span><span class=\"flatpickr-day \" aria-label=\"November 19, 2021\" tabindex=\"-1\">19</span><span class=\"flatpickr-day \" aria-label=\"November 20, 2021\" tabindex=\"-1\">20</span><span class=\"flatpickr-day \" aria-label=\"November 21, 2021\" tabindex=\"-1\">21</span><span class=\"flatpickr-day today\" aria-label=\"November 22, 2021\" aria-current=\"date\" tabindex=\"-1\">22</span><span class=\"flatpickr-day \" aria-label=\"November 23, 2021\" tabindex=\"-1\">23</span><span class=\"flatpickr-day \" aria-label=\"November 24, 2021\" tabindex=\"-1\">24</span><span class=\"flatpickr-day \" aria-label=\"November 25, 2021\" tabindex=\"-1\">25</span><span class=\"flatpickr-day \" aria-label=\"November 26, 2021\" tabindex=\"-1\">26</span><span class=\"flatpickr-day \" aria-label=\"November 27, 2021\" tabindex=\"-1\">27</span><span class=\"flatpickr-day \" aria-label=\"November 28, 2021\" tabindex=\"-1\">28</span><span class=\"flatpickr-day \" aria-label=\"November 29, 2021\" tabindex=\"-1\">29</span><span class=\"flatpickr-day \" aria-label=\"November 30, 2021\" tabindex=\"-1\">30</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 1, 2021\" tabindex=\"-1\">1</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 2, 2021\" tabindex=\"-1\">2</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 3, 2021\" tabindex=\"-1\">3</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 4, 2021\" tabindex=\"-1\">4</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 5, 2021\" tabindex=\"-1\">5</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 6, 2021\" tabindex=\"-1\">6</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 7, 2021\" tabindex=\"-1\">7</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 8, 2021\" tabindex=\"-1\">8</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 9, 2021\" tabindex=\"-1\">9</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 10, 2021\" tabindex=\"-1\">10</span><span class=\"flatpickr-day nextMonthDay\" aria-label=\"December 11, 2021\" tabindex=\"-1\">11</span></div></div></div></div></div>\n    <script src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/js/material-dashboard.min.js?v=1.0.0\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/dropzone.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Dropzone | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#js\">JS</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Dropzone\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Dropzone JS is an open-source library that provides drag’n’ drop file uploads with image previews. It is lightweight, doesn’t depend on any other library (like jQuery) and is highly customisable. Dropzone JS supports image previews and shows nice progress bars. <br> Keep reading our Bootstrap Dropzone JS examples and learn how to use this plugin.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <h3 id=\"js\">JS</h3>\n          <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/dropzone.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"example\">Example</h2>\n          <div class=\"card\">\n            <form action=\"/file-upload\" class=\"form-control border dropzone\" id=\"dropzone\">\n              <div class=\"fallback\">\n                <input name=\"file\" type=\"file\" multiple=\"\" />\n              </div>\n            </form>\n          </div>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;form</span> <span class=\"na\">action=</span><span class=\"s\">\"/file-upload\"</span> <span class=\"na\">class=</span><span class=\"s\">\"form-control border dropzone\"</span> <span class=\"na\">id=</span><span class=\"s\">\"dropzone\"</span><span class=\"nt\">&gt;</span>\n  <span class=\"nt\">&lt;div</span> <span class=\"na\">class=</span><span class=\"s\">\"fallback\"</span><span class=\"nt\">&gt;</span>\n    <span class=\"nt\">&lt;input</span> <span class=\"na\">name=</span><span class=\"s\">\"file\"</span> <span class=\"na\">type=</span><span class=\"s\">\"file\"</span> <span class=\"na\">multiple</span> <span class=\"nt\">/&gt;</span>\n  <span class=\"nt\">&lt;/div&gt;</span>\n<span class=\"nt\">&lt;/form&gt;</span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/dropzone.min.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      Dropzone.autoDiscover = false;\n      var drop = document.getElementById('dropzone')\n      var myDropzone = new Dropzone(drop, {\n        url: \"/file/post\",\n        addRemoveLinks: true\n\n      });\n    </script><input type=\"file\" multiple=\"multiple\" class=\"dz-hidden-input\" style=\"visibility: hidden; position: absolute; top: 0px; left: 0px; height: 0px; width: 0px;\">\n       <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/fullcalendar.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Fullcalendar | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#js\">JS</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#example\">Example</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Fullcalendar\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Our Bootstrap Fullcalendar is a full-sized drag &amp; drop event calendar. <br> Keep reading our Bootstrap Fullcalendar examples and learn how to use this plugin.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <h3 id=\"js\">JS</h3>\n          <p>In order to use this plugin on your page you will need to include the following scripts in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/fullcalendar.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"example\">Example</h3>\n          <div class=\"card card-calendar mb-3\">\n            <div class=\"card-body p-3\">\n              <div class=\"calendar fc fc-media-screen fc-direction-ltr fc-theme-standard\" data-bs-toggle=\"calendar\" id=\"calendar\"><div class=\"fc-header-toolbar fc-toolbar \"><div class=\"fc-toolbar-chunk\"><h2 class=\"fc-toolbar-title\">December 2020</h2></div><div class=\"fc-toolbar-chunk\"></div><div class=\"fc-toolbar-chunk\"><button class=\"fc-today-button fc-button fc-button-primary\" type=\"button\">today</button><div class=\"fc-button-group\"><button class=\"fc-prev-button fc-button fc-button-primary\" type=\"button\" aria-label=\"prev\"><span class=\"fc-icon fc-icon-chevron-left\"></span></button><button class=\"fc-next-button fc-button fc-button-primary\" type=\"button\" aria-label=\"next\"><span class=\"fc-icon fc-icon-chevron-right\"></span></button></div></div></div><div class=\"fc-view-harness fc-view-harness-passive\"><div class=\"fc-daygrid fc-dayGridMonth-view fc-view\"><table class=\"fc-scrollgrid \"><thead><tr class=\"fc-scrollgrid-section fc-scrollgrid-section-header \"><td><div class=\"fc-scroller-harness\"><div class=\"fc-scroller\" style=\"overflow: visible;\"><table class=\"fc-col-header \" style=\"width: 791px;\"><colgroup></colgroup><tbody><tr><th class=\"fc-col-header-cell fc-day fc-day-sun\"><div class=\"fc-scrollgrid-sync-inner\"><a class=\"fc-col-header-cell-cushion \">Sun</a></div></th><th class=\"fc-col-header-cell fc-day fc-day-mon\"><div class=\"fc-scrollgrid-sync-inner\"><a class=\"fc-col-header-cell-cushion \">Mon</a></div></th><th class=\"fc-col-header-cell fc-day fc-day-tue\"><div class=\"fc-scrollgrid-sync-inner\"><a class=\"fc-col-header-cell-cushion \">Tue</a></div></th><th class=\"fc-col-header-cell fc-day fc-day-wed\"><div class=\"fc-scrollgrid-sync-inner\"><a class=\"fc-col-header-cell-cushion \">Wed</a></div></th><th class=\"fc-col-header-cell fc-day fc-day-thu\"><div class=\"fc-scrollgrid-sync-inner\"><a class=\"fc-col-header-cell-cushion \">Thu</a></div></th><th class=\"fc-col-header-cell fc-day fc-day-fri\"><div class=\"fc-scrollgrid-sync-inner\"><a class=\"fc-col-header-cell-cushion \">Fri</a></div></th><th class=\"fc-col-header-cell fc-day fc-day-sat\"><div class=\"fc-scrollgrid-sync-inner\"><a class=\"fc-col-header-cell-cushion \">Sat</a></div></th></tr></tbody></table></div></div></td></tr></thead><tbody><tr class=\"fc-scrollgrid-section fc-scrollgrid-section-body \"><td><div class=\"fc-scroller-harness\"><div class=\"fc-scroller\" style=\"overflow: visible;\"><div class=\"fc-daygrid-body fc-daygrid-body-unbalanced fc-daygrid-body-natural\" style=\"width: 791px;\"><table class=\"fc-scrollgrid-sync-table\" style=\"width: 791px;\"><colgroup></colgroup><tbody><tr><td class=\"fc-daygrid-day fc-day fc-day-sun fc-day-past fc-day-other\" data-date=\"2020-11-29\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">29</a></div><div class=\"fc-daygrid-day-events\"><div class=\"fc-daygrid-event-harness\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-success\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">All day conference</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-mon fc-day-past fc-day-other\" data-date=\"2020-11-30\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">30</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-tue fc-day-past\" data-date=\"2020-12-01\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">1</a></div><div class=\"fc-daygrid-day-events\"><div class=\"fc-daygrid-event-harness\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-info\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">Meeting with Mary</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-wed fc-day-past\" data-date=\"2020-12-02\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">2</a></div><div class=\"fc-daygrid-day-events\"><div class=\"fc-daygrid-event-harness\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-warning\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">Cyber Week</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-thu fc-day-past\" data-date=\"2020-12-03\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">3</a></div><div class=\"fc-daygrid-day-events\"><div class=\"fc-daygrid-event-harness\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-danger\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">Winter Hackaton</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-fri fc-day-past\" data-date=\"2020-12-04\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">4</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-sat fc-day-past\" data-date=\"2020-12-05\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">5</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td></tr><tr><td class=\"fc-daygrid-day fc-day fc-day-sun fc-day-past\" data-date=\"2020-12-06\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">6</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-mon fc-day-past\" data-date=\"2020-12-07\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">7</a></div><div class=\"fc-daygrid-day-events\" style=\"padding-bottom: 22.75px;\"><div class=\"fc-daygrid-event-harness fc-daygrid-event-harness-abs\" style=\"right: -113px;\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-warning\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">Digital event</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-tue fc-day-past\" data-date=\"2020-12-08\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">8</a></div><div class=\"fc-daygrid-day-events\" style=\"padding-bottom: 22.75px;\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-wed fc-day-past\" data-date=\"2020-12-09\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">9</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-thu fc-day-past\" data-date=\"2020-12-10\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">10</a></div><div class=\"fc-daygrid-day-events\"><div class=\"fc-daygrid-event-harness\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-primary\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">Marketing event</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-fri fc-day-past\" data-date=\"2020-12-11\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">11</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-sat fc-day-past\" data-date=\"2020-12-12\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">12</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td></tr><tr><td class=\"fc-daygrid-day fc-day fc-day-sun fc-day-past\" data-date=\"2020-12-13\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">13</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-mon fc-day-past\" data-date=\"2020-12-14\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">14</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-tue fc-day-past\" data-date=\"2020-12-15\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">15</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-wed fc-day-past\" data-date=\"2020-12-16\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">16</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-thu fc-day-past\" data-date=\"2020-12-17\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">17</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-fri fc-day-past\" data-date=\"2020-12-18\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">18</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-sat fc-day-past\" data-date=\"2020-12-19\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">19</a></div><div class=\"fc-daygrid-day-events\"><div class=\"fc-daygrid-event-harness\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-danger\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">Dinner with Family</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td></tr><tr><td class=\"fc-daygrid-day fc-day fc-day-sun fc-day-past\" data-date=\"2020-12-20\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">20</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-mon fc-day-past\" data-date=\"2020-12-21\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">21</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-tue fc-day-past\" data-date=\"2020-12-22\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">22</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-wed fc-day-past\" data-date=\"2020-12-23\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">23</a></div><div class=\"fc-daygrid-day-events\"><div class=\"fc-daygrid-event-harness\"><a class=\"fc-daygrid-event fc-daygrid-block-event fc-h-event fc-event fc-event-draggable fc-event-resizable fc-event-start fc-event-end fc-event-past bg-gradient-info\"><div class=\"fc-event-main\"><div class=\"fc-event-main-frame\"><div class=\"fc-event-title-container\"><div class=\"fc-event-title fc-sticky\">Black Friday</div></div></div></div><div class=\"fc-event-resizer fc-event-resizer-end\"></div></a></div></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-thu fc-day-past\" data-date=\"2020-12-24\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">24</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-fri fc-day-past\" data-date=\"2020-12-25\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">25</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-sat fc-day-past\" data-date=\"2020-12-26\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">26</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td></tr><tr><td class=\"fc-daygrid-day fc-day fc-day-sun fc-day-past\" data-date=\"2020-12-27\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">27</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-mon fc-day-past\" data-date=\"2020-12-28\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">28</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-tue fc-day-past\" data-date=\"2020-12-29\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">29</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-wed fc-day-past\" data-date=\"2020-12-30\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">30</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-thu fc-day-past\" data-date=\"2020-12-31\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">31</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-fri fc-day-past fc-day-other\" data-date=\"2021-01-01\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">1</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-sat fc-day-past fc-day-other\" data-date=\"2021-01-02\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">2</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td></tr><tr><td class=\"fc-daygrid-day fc-day fc-day-sun fc-day-past fc-day-other\" data-date=\"2021-01-03\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">3</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-mon fc-day-past fc-day-other\" data-date=\"2021-01-04\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">4</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-tue fc-day-past fc-day-other\" data-date=\"2021-01-05\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">5</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-wed fc-day-past fc-day-other\" data-date=\"2021-01-06\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">6</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-thu fc-day-past fc-day-other\" data-date=\"2021-01-07\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">7</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-fri fc-day-past fc-day-other\" data-date=\"2021-01-08\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">8</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td><td class=\"fc-daygrid-day fc-day fc-day-sat fc-day-past fc-day-other\" data-date=\"2021-01-09\"><div class=\"fc-daygrid-day-frame fc-scrollgrid-sync-inner\"><div class=\"fc-daygrid-day-top\"><a class=\"fc-daygrid-day-number\">9</a></div><div class=\"fc-daygrid-day-events\"></div><div class=\"fc-daygrid-day-bg\"></div></div></td></tr></tbody></table></div></div></div></td></tr></tbody></table></div></div></div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-calendar<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>calendar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>calendar<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>calendar<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">var calendar = new FullCalendar.Calendar(document.getElementById(\"calendar\"), {\n      initialView: \"dayGridMonth\",\n      headerToolbar: {\n        start: 'title', // will normally be on the left. if RTL, will be on the right\n        center: '',\n        end: 'today prev,next' // will normally be on the right. if RTL, will be on the left\n      },\n      selectable: true,\n      editable: true,\n      initialDate: '2020-12-01',\n      events: [{\n          title: 'Call with Dave',\n          start: '2020-11-18',\n          end: '2020-11-18',\n          className: 'bg-gradient-danger'\n        },\n\n        {\n          title: 'Lunch meeting',\n          start: '2020-11-21',\n          end: '2020-11-22',\n          className: 'bg-gradient-warning'\n        },\n\n        {\n          title: 'All day conference',\n          start: '2020-11-29',\n          end: '2020-11-29',\n          className: 'bg-gradient-success'\n        },\n\n        {\n          title: 'Meeting with Mary',\n          start: '2020-12-01',\n          end: '2020-12-01',\n          className: 'bg-gradient-info'\n        },\n\n        {\n          title: 'Winter Hackaton',\n          start: '2020-12-03',\n          end: '2020-12-03',\n          className: 'bg-gradient-danger'\n        },\n\n        {\n          title: 'Digital event',\n          start: '2020-12-07',\n          end: '2020-12-09',\n          className: 'bg-gradient-warning'\n        },\n\n        {\n          title: 'Marketing event',\n          start: '2020-12-10',\n          end: '2020-12-10',\n          className: 'bg-gradient-primary'\n        },\n\n        {\n          title: 'Dinner with Family',\n          start: '2020-12-19',\n          end: '2020-12-19',\n          className: 'bg-gradient-danger'\n        },\n\n        {\n          title: 'Black Friday',\n          start: '2020-12-23',\n          end: '2020-12-23',\n          className: 'bg-gradient-info'\n        },\n\n        {\n          title: 'Cyber Week',\n          start: '2020-12-02',\n          end: '2020-12-02',\n          className: 'bg-gradient-warning'\n        },\n\n      ],\n      views: {\n        month: {\n          titleFormat: {\n            month: \"long\",\n            year: \"numeric\"\n          }\n        },\n        agendaWeek: {\n          titleFormat: {\n            month: \"long\",\n            year: \"numeric\",\n            day: \"numeric\"\n          }\n        },\n        agendaDay: {\n          titleFormat: {\n            month: \"short\",\n            year: \"numeric\",\n            day: \"numeric\"\n          }\n        }\n      },\n    });\n\n    calendar.render();</code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/fullcalendar.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n    <script type=\"text/javascript\">\n      var calendar = new FullCalendar.Calendar(document.getElementById(\"calendar\"), {\n        contentHeight: 'auto',\n        initialView: \"dayGridMonth\",\n        headerToolbar: {\n          start: 'title', // will normally be on the left. if RTL, will be on the right\n          center: '',\n          end: 'today prev,next' // will normally be on the right. if RTL, will be on the left\n        },\n        selectable: true,\n        editable: true,\n        initialDate: '2020-12-01',\n        events: [{\n            title: 'Call with Dave',\n            start: '2020-11-18',\n            end: '2020-11-18',\n            className: 'bg-gradient-danger'\n          },\n\n          {\n            title: 'Lunch meeting',\n            start: '2020-11-21',\n            end: '2020-11-22',\n            className: 'bg-gradient-warning'\n          },\n\n          {\n            title: 'All day conference',\n            start: '2020-11-29',\n            end: '2020-11-29',\n            className: 'bg-gradient-success'\n          },\n\n          {\n            title: 'Meeting with Mary',\n            start: '2020-12-01',\n            end: '2020-12-01',\n            className: 'bg-gradient-info'\n          },\n\n          {\n            title: 'Winter Hackaton',\n            start: '2020-12-03',\n            end: '2020-12-03',\n            className: 'bg-gradient-danger'\n          },\n\n          {\n            title: 'Digital event',\n            start: '2020-12-07',\n            end: '2020-12-09',\n            className: 'bg-gradient-warning'\n          },\n\n          {\n            title: 'Marketing event',\n            start: '2020-12-10',\n            end: '2020-12-10',\n            className: 'bg-gradient-primary'\n          },\n\n          {\n            title: 'Dinner with Family',\n            start: '2020-12-19',\n            end: '2020-12-19',\n            className: 'bg-gradient-danger'\n          },\n\n          {\n            title: 'Black Friday',\n            start: '2020-12-23',\n            end: '2020-12-23',\n            className: 'bg-gradient-info'\n          },\n\n          {\n            title: 'Cyber Week',\n            start: '2020-12-02',\n            end: '2020-12-02',\n            className: 'bg-gradient-warning'\n          },\n\n        ],\n        views: {\n          month: {\n            titleFormat: {\n              month: \"long\",\n              year: \"numeric\"\n            }\n          },\n          agendaWeek: {\n            titleFormat: {\n              month: \"long\",\n              year: \"numeric\",\n              day: \"numeric\"\n            }\n          },\n          agendaDay: {\n            titleFormat: {\n              month: \"short\",\n              year: \"numeric\",\n              day: \"numeric\"\n            }\n          }\n        },\n      });\n\n      calendar.render();\n    </script>\n  </body>\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/kanban.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Kanban | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs\">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#js\">JS</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#example\">Example</a>\n                  <ul>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#choose-your-new-board-name\">Choose your new Board Name</a></li>\n                    <li class=\"toc-entry toc-h5\"><a href=\"#task-details\">Task details</a></li>\n                  </ul>\n                </li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Kanban\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Pure agnostic Javascript plugin for Kanban boards</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <p>Our kanban is built using jKanban. You cand <a href=\"http://www.riccardotartaglia.it/jkanban/\" rel=\"nofollow\" target=\"_blank\">www.riccardotartaglia.it/jkanban/</a>.</p>\n          <h3 id=\"js\">JS</h3>\n          <p>In order to use this plugin on your page you will need to include the following scripts in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token comment\">&lt;!-- Kanban scripts --&gt;</span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/dragula/dragula.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/jkanban/jkanban.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"example\">Example</h3>\n          <div class=\"mt-3 kanban-container\">\n            <div class=\"py-2 min-vh-100 d-inline-flex\" style=\"overflow-x: auto\">\n              <div id=\"myKanban\"><div class=\"kanban-container\" style=\"width: 1880px;\"><div data-id=\"_backlog\" data-order=\"1\" class=\"kanban-board\" style=\"width: 450px; margin-left: 10px; margin-right: 10px;\"><header class=\"kanban-board-header\"><div class=\"kanban-title-board\">Backlog</div><button class=\"kanban-title-button btn btn-sm btn-white\">+</button></header><main class=\"kanban-drag\"><div class=\"kanban-item border-radius-md\" data-eid=\"_task_1_title_id\" data-class=\"border-radius-md\">Click me to change title</div><div class=\"kanban-item border-radius-md\" data-eid=\"_task_2_title_id\" data-class=\"border-radius-md\">Drag me to 'In progress' section</div><div class=\"kanban-item border-radius-md is-moving\" data-eid=\"_task_do_something_id\" data-assignee=\"Done Joe\" data-description=\"This task's description is for something, but not for anything\" data-class=\"border-radius-md\"><img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/office-dark.jpg\" class=\"w-100\"><span class=\"mt-3 badge badge-sm bg-gradient-primary\">Pending</span><p class=\"text mt-2\">Website Design: New cards for blog section and profile details</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">3</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs rounded-circle me-2\" data-toggle=\"tooltip\" data-original-title=\"Audrey Love\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"rounded-circle\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"rounded-circle\"></a></div></div></div><div class=\"kanban-item border-radius-md is-moving\" data-eid=\"_task_do_something_4_id\" data-assignee=\"Done Joe\" data-description=\"This task's description is for something, but not for anything\" data-class=\"border-radius-md\"><img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/meeting.jpg\" class=\"w-100\"><span class=\"mt-3 badge badge-sm bg-gradient-info\">Updates</span><p class=\"text mt-2\">Vue 3 Updates</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">9</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs rounded-circle me-2\" data-toggle=\"tooltip\" data-original-title=\"Audrey Love\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"rounded-circle\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"rounded-circle\"></a></div></div></div><div class=\"kanban-item border-radius-md\" data-eid=\"_task_ok_id\" data-assignee=\"Done Joe\" data-description=\"This task's description is for something, but not for anything\" data-class=\"border-radius-md\"><span class=\"mt-2 badge badge-sm bg-gradient-success\">Done</span><p class=\"text mt-2\">Schedule winter campaign</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">2</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Laurence\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"rounded-circle\"></a></div></div></div></main><footer></footer></div><div data-id=\"_progress\" data-order=\"2\" class=\"kanban-board\" style=\"width: 450px; margin-left: 10px; margin-right: 10px;\"><header class=\"kanban-board-header\"><div class=\"kanban-title-board\">In progress</div><button class=\"kanban-title-button btn btn-sm btn-white\">+</button></header><main class=\"kanban-drag\"><div class=\"kanban-item border-radius-md\" data-eid=\"_task_3_title_id\" data-class=\"border-radius-md\"><span class=\"mt-2 badge badge-sm bg-gradient-warning\">Errors</span><p class=\"text mt-2\">Fix Firefox errors</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">11</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"\"></a></div></div></div><div class=\"kanban-item border-radius-md\" data-eid=\"_task_4_title_id\" data-class=\"border-radius-md\"><span class=\"mt-2 badge badge-sm bg-gradient-info\">Updates</span><p class=\"text mt-2\">Argon Dashboard PRO - Angular 11</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">3</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-5.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"\"></a></div></div></div></main><footer></footer></div><div data-id=\"_working\" data-order=\"3\" class=\"kanban-board\" style=\"width: 450px; margin-left: 10px; margin-right: 10px;\"><header class=\"kanban-board-header\"><div class=\"kanban-title-board\">In review</div><button class=\"kanban-title-button btn btn-sm btn-white\">+</button></header><main class=\"kanban-drag\"><div class=\"kanban-item border-radius-md\" data-eid=\"_task_do_something_2_id\" data-assignee=\"Done Joe\" data-description=\"This task's description is for something, but not for anything\" data-class=\"border-radius-md\"><span class=\"mt-2 badge badge-sm bg-gradient-warning\">In Testing</span><p class=\"text mt-2\">Responsive Changes</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">11</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"\"></a></div></div></div><div class=\"kanban-item border-radius-md\" data-eid=\"_task_run_id\" data-assignee=\"Done Joe\" data-description=\"This task's description is for something, but not for anything\" data-class=\"border-radius-md\"><span class=\"mt-2 badge badge-sm bg-gradient-success\">In review</span><p class=\"text mt-2 mb-1\">Change images dimension</p><div class=\"col\"><div class=\"progress progressm mb-3 w5\"><div class=\"progress-bar bg-gradient-success\" role=\"progressbar\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 80%;\"></div></div></div><div class=\"d-flex\"><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"\"></a></div></div></div><div class=\"kanban-item border-radius-md\" data-eid=\"_task_do_something_3_id\" data-assignee=\"Done Joe\" data-description=\"This task's description is for something, but not for anything\" data-class=\"border-radius-md\"><span class=\"mt-2 badge badge-sm bg-gradient-info\">In Review</span><p class=\"text mt-2 mb-1\">Update Links</p><div class=\"col\"><div class=\"progress progressm mb-3 w5\"><div class=\"progress-bar bg-gradient-info\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div></div></div><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">6</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-5.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Mike Alis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a></div></div></div></main><footer></footer></div><div data-id=\"_done\" data-order=\"4\" class=\"kanban-board\" style=\"width: 450px; margin-left: 10px; margin-right: 10px;\"><header class=\"kanban-board-header\"><div class=\"kanban-title-board\">Done</div><button class=\"kanban-title-button btn btn-sm btn-white\">+</button></header><main class=\"kanban-drag\"><div class=\"kanban-item border-radius-md is-moving\" data-eid=\"_task_all_right_id\" data-assignee=\"Done Joe\" data-description=\"This task's description is for something, but not for anything\" data-class=\"border-radius-md\"><img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/home-decor-1.jpg\" class=\"w-100\"><span class=\"mt-3 badge badge-sm bg-gradient-success\">Done</span><p class=\"text mt-2\">Redesign for the home page</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\" aria-hidden=\"true\"></i><span class=\"text-sm\">8</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-5.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs rounded-circle me-2\" data-toggle=\"tooltip\" data-original-title=\"Audrey Love\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"rounded-circle\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"rounded-circle\"></a></div></div></div></main><footer></footer></div></div></div>\n            </div>\n          </div>\n          <div class=\"modal fade\" id=\"new-board-modal\" role=\"dialog\">\n            <div class=\"modal-dialog\">\n              <div class=\"modal-content\">\n                <div class=\"modal-header\">\n                  <h5 class=\"h5 modal-title\">Choose your new Board Name</h5>\n                  <button type=\"button\" class=\"btn close pe-1\" data-dismiss=\"modal\" data-target=\"#new-board-modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">×</span>\n                  </button>\n                </div>\n                <div class=\"pt-4 modal-body\">\n                  <div class=\"mb-4 input-group\">\n                    <span class=\"input-group-text\">\n                      <i class=\"far fa-edit\" aria-hidden=\"true\"></i>\n                    </span>\n                    <input class=\"form-control\" placeholder=\"Board Name\" type=\"text\" id=\"jkanban-new-board-name\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                  <div class=\"text-end\">\n                    <button class=\"m-1 btn btn-primary\" id=\"jkanban-add-new-board\" data-toggle=\"modal\" data-target=\"#new-board-modal\">\n                      Save changes\n                    </button>\n                    <button class=\"m-1 btn btn-secondary\" data-dismiss=\"modal\" data-target=\"#new-board-modal\">\n                      Close\n                    </button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"hidden opacity-50 fixed inset-0 z-40 bg-black\" id=\"new-board-modal-backdrop\"></div>\n          <div class=\"modal fade\" id=\"jkanban-info-modal\" style=\"display: none\" tabindex=\"-1\" role=\"dialog\">\n            <div class=\"modal-dialog\">\n              <div class=\"modal-content\">\n                <div class=\"modal-header\">\n                  <h5 class=\"h5 modal-title\">Task details</h5>\n                  <button type=\"button\" class=\"btn-close text-dark\" data-bs-dismiss=\"modal\" aria-label=\"Close\">\n                    <span aria-hidden=\"true\">×</span>\n                  </button>\n                </div>\n                <div class=\"pt-4 modal-body\">\n                  <input id=\"jkanban-task-id\" class=\"d-none\">\n                  <div class=\"mb-4 input-group\">\n                    <span class=\"input-group-text\">\n                      <i class=\"far fa-edit\" aria-hidden=\"true\"></i>\n                    </span>\n                    <input class=\"form-control\" placeholder=\"Task Title\" type=\"text\" id=\"jkanban-task-title\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                  <div class=\"mb-4 input-group\">\n                    <span class=\"input-group-text\">\n                      <i class=\"fas fa-user\" aria-hidden=\"true\"></i>\n                    </span>\n                    <input class=\"form-control\" placeholder=\"Task Assignee\" type=\"text\" id=\"jkanban-task-assignee\" onfocus=\"focused(this)\" onfocusout=\"defocused(this)\">\n                  </div>\n                  <div class=\"form-group\">\n                    <textarea class=\"form-control\" placeholder=\"Task Description\" id=\"jkanban-task-description\" type=\"textarea\" rows=\"4\"></textarea>\n                  </div>\n                  <div class=\"alert alert-success d-none\">Changes saved!</div>\n                  <div class=\"text-end\">\n                    <button class=\"m-1 btn btn-primary\" id=\"jkanban-update-task\" data-toggle=\"modal\" data-target=\"#jkanban-info-modal\">\n                      Save changes\n                    </button>\n                    <button class=\"m-1 btn btn-secondary\" data-dismiss=\"modal\" data-target=\"#jkanban-info-modal\">\n                      Close\n                    </button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"hidden opacity-50 fixed inset-0 z-40 bg-black\" id=\"jkanban-info-modal-backdrop\"></div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"> <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mt-3 kanban-container<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>py-2 min-vh-100 d-inline-flex<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">overflow-x</span><span class=\"token punctuation\">:</span> auto</span><span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>myKanban<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>new-board-modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-header<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h5 modal-title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Choose your new Board Name<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn close pe-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#new-board-modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>×<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pt-4 modal-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-4 input-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>far fa-edit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Board Name<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-new-board-name<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-end<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>m-1 btn btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-add-new-board<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#new-board-modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Save changes\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>m-1 btn btn-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#new-board-modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Close\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>hidden opacity-50 fixed inset-0 z-40 bg-black<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>new-board-modal-backdrop<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal fade<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-info-modal<span class=\"token punctuation\">\"</span></span><span class=\"token style-attr language-css\"><span class=\"token attr-name\"> <span class=\"token attr-name\">style</span></span><span class=\"token punctuation\">=\"</span><span class=\"token attr-value\"><span class=\"token property\">display</span><span class=\"token punctuation\">:</span> none</span><span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">tabindex</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>-1<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">role</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>dialog<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-dialog<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-content<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal-header<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h5</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>h5 modal-title<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Task details<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h5</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>button<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>btn-close text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-bs-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">aria-label</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Close<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">aria-hidden</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>true<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token entity\" title=\"×\">&amp;times;</span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>pt-4 modal-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-task-id<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>d-none<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-4 input-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>far fa-edit<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Task Title<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-task-title<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>mb-4 input-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>input-group-text<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>i</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>fas fa-user<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>i</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>input</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Task Assignee<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-task-assignee<span class=\"token punctuation\">\"</span></span> <span class=\"token punctuation\">/&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-group<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>textarea</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>form-control<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">placeholder</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Task Description<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-task-description<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">type</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>textarea<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">rows</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>4<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>textarea</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>alert alert-success d-none<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Changes saved!<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-end<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>m-1 btn btn-primary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-update-task<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-toggle</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#jkanban-info-modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Save changes\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>button</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>m-1 btn btn-secondary<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-dismiss</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>modal<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">data-target</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>#jkanban-info-modal<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n              Close\n            <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>button</span><span class=\"token punctuation\">&gt;</span></span>\n          <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n        <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n      <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>hidden opacity-50 fixed inset-0 z-40 bg-black<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>jkanban-info-modal-backdrop<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n\n </code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n\n    <script src=\"../../assets/js/dragula.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/jkanban.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      (function() {\n        if (document.getElementById(\"myKanban\")) {\n          var KanbanTest = new jKanban({\n            element: \"#myKanban\",\n            gutter: \"10px\",\n            widthBoard: \"450px\",\n            click: el => {\n              let jkanbanInfoModal = document.getElementById(\"jkanban-info-modal\");\n\n              let jkanbanInfoModalTaskId = document.querySelector(\n                \"#jkanban-info-modal #jkanban-task-id\"\n              );\n              let jkanbanInfoModalTaskTitle = document.querySelector(\n                \"#jkanban-info-modal #jkanban-task-title\"\n              );\n              let jkanbanInfoModalTaskAssignee = document.querySelector(\n                \"#jkanban-info-modal #jkanban-task-assignee\"\n              );\n              let jkanbanInfoModalTaskDescription = document.querySelector(\n                \"#jkanban-info-modal #jkanban-task-description\"\n              );\n              let taskId = el.getAttribute(\"data-eid\");\n              let taskTitle = el.querySelector('p.text').innerHTML;\n              let taskAssignee = el.getAttribute(\"data-assignee\");\n              let taskDescription = el.getAttribute(\"data-description\");\n              jkanbanInfoModalTaskId.value = taskId;\n              jkanbanInfoModalTaskTitle.value = taskTitle;\n              jkanbanInfoModalTaskAssignee.value = taskAssignee;\n              jkanbanInfoModalTaskDescription.value = taskDescription;\n              var myModal = new bootstrap.Modal(jkanbanInfoModal, {\n                show: true\n              });\n              myModal.show();\n            },\n            buttonClick: function(el, boardId) {\n              if (\n                document.querySelector(\"[data-id='\" + boardId + \"'] .itemform\") ===\n                null\n              ) {\n                // create a form to enter element\n                var formItem = document.createElement(\"form\");\n                formItem.setAttribute(\"class\", \"itemform\");\n                formItem.innerHTML = `<div class=\"form-group\">\n        <textarea class=\"form-control\" rows=\"2\" autofocus></textarea>\n        </div>\n        <div class=\"form-group\">\n            <button type=\"submit\" class=\"btn bg-gradient-success btn-sm pull-end\">Add</button>\n            <button type=\"button\" id=\"kanban-cancel-item\" class=\"btn bg-gradient-light btn-sm pull-end me-2\">Cancel</button>\n        </div>`;\n\n                KanbanTest.addForm(boardId, formItem);\n                formItem.addEventListener(\"submit\", function(e) {\n                  e.preventDefault();\n                  var text = e.target[0].value;\n                  let newTaskId =\n                    \"_\" + text.toLowerCase().replace(/ /g, \"_\") + boardId;\n                  KanbanTest.addElement(boardId, {\n                    id: newTaskId,\n                    title: text,\n                    class: [\"border-radius-md\"]\n                  });\n                  formItem.parentNode.removeChild(formItem);\n                });\n                document.getElementById(\"kanban-cancel-item\").onclick = function() {\n                  formItem.parentNode.removeChild(formItem);\n                };\n              }\n            },\n            addItemButton: true,\n            boards: [{\n                id: \"_backlog\",\n                title: \"Backlog\",\n                item: [{\n                    id: \"_task_1_title_id\",\n                    title: \"Click me to change title\",\n                    class: [\"border-radius-md\"]\n                  },\n                  {\n                    id: \"_task_2_title_id\",\n                    title: \"Drag me to 'In progress' section\",\n                    class: [\"border-radius-md\"]\n                  },\n                  {\n                    id: \"_task_do_something_id\",\n                    title: '<img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/office-dark.jpg\" class=\"w-100\"><span class=\"mt-3 badge badge-sm bg-gradient-primary\">Pending</span><p class=\"text mt-2\">Website Design: New cards for blog section and profile details</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">3</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs rounded-circle me-2\" data-toggle=\"tooltip\" data-original-title=\"Audrey Love\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"rounded-circle\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"rounded-circle\"></a></div></div>',\n                    assignee: \"Done Joe\",\n                    description: \"This task's description is for something, but not for anything\",\n                    class: [\"border-radius-md\"]\n                  },\n                ]\n              },\n              {\n                id: \"_progress\",\n                title: \"In progress\",\n                item: [{\n                    id: \"_task_3_title_id\",\n                    title: '<span class=\"mt-2 badge badge-sm bg-gradient-warning\">Errors</span><p class=\"text mt-2\">Fix Firefox errors</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">11</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"\"></a></div></div>',\n                    class: [\"border-radius-md\"]\n                  },\n                  {\n                    id: \"_task_4_title_id\",\n                    title: '<span class=\"mt-2 badge badge-sm bg-gradient-info\">Updates</span><p class=\"text mt-2\">Argon Dashboard PRO - Angular 11</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">3</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-5.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"\"></a></div></div>',\n                    class: [\"border-radius-md\"]\n                  },\n                  {\n                    id: \"_task_do_something_4_id\",\n                    title: '<img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/meeting.jpg\" class=\"w-100\"><span class=\"mt-3 badge badge-sm bg-gradient-info\">Updates</span><p class=\"text mt-2\">Vue 3 Updates</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">9</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs rounded-circle me-2\" data-toggle=\"tooltip\" data-original-title=\"Audrey Love\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"rounded-circle\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"rounded-circle\"></a></div></div>',\n                    assignee: \"Done Joe\",\n                    description: \"This task's description is for something, but not for anything\",\n                    class: [\"border-radius-md\"]\n                  }\n                ]\n\n              },\n              {\n                id: \"_working\",\n                title: \"In review\",\n                item: [{\n                    id: \"_task_do_something_2_id\",\n                    title: '<span class=\"mt-2 badge badge-sm bg-gradient-warning\">In Testing</span><p class=\"text mt-2\">Responsive Changes</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">11</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-2.jpg\" class=\"\"></a></div></div>',\n                    assignee: \"Done Joe\",\n                    description: \"This task's description is for something, but not for anything\",\n                    class: [\"border-radius-md\"]\n                  },\n                  {\n                    id: \"_task_run_id\",\n                    title: '<span class=\"mt-2 badge badge-sm bg-gradient-success\">In review</span><p class=\"text mt-2 mb-1\">Change images dimension</p><div class=\"col\"><div class=\"progress progressm mb-3 w5\"><div class=\"progress-bar bg-gradient-success\" role=\"progressbar\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 80%;\"></div></div></div><div class=\"d-flex\"><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-3.jpg\" class=\"\"></a></div></div>',\n                    assignee: \"Done Joe\",\n                    description: \"This task's description is for something, but not for anything\",\n                    class: [\"border-radius-md\"]\n                  },\n                  {\n                    id: \"_task_do_something_3_id\",\n                    title: '<span class=\"mt-2 badge badge-sm bg-gradient-info\">In Review</span><p class=\"text mt-2 mb-1\">Update Links</p><div class=\"col\"><div class=\"progress progressm mb-3 w5\"><div class=\"progress-bar bg-gradient-info\" role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\" aria-valuemax=\"100\" style=\"width: 60%;\"></div></div></div><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">6</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jana Lucie\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-5.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Mike Alis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a></div></div>',\n                    assignee: \"Done Joe\",\n                    description: \"This task's description is for something, but not for anything\",\n                    class: [\"border-radius-md\"]\n                  }\n                ]\n              },\n              {\n                id: \"_done\",\n                title: \"Done\",\n                item: [{\n                    id: \"_task_all_right_id\",\n                    title: '<img src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/home-decor-1.jpg\" class=\"w-100\"><span class=\"mt-3 badge badge-sm bg-gradient-success\">Done</span><p class=\"text mt-2\">Redesign for the home page</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">8</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Jessica Rowland\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-5.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs rounded-circle me-2\" data-toggle=\"tooltip\" data-original-title=\"Audrey Love\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"rounded-circle\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"rounded-circle\"></a></div></div>',\n                    assignee: \"Done Joe\",\n                    description: \"This task's description is for something, but not for anything\",\n                    class: [\"border-radius-md\"]\n                  },\n                  {\n                    id: \"_task_ok_id\",\n                    title: '<span class=\"mt-2 badge badge-sm bg-gradient-success\">Done</span><p class=\"text mt-2\">Schedule winter campaign</p><div class=\"d-flex\"><div> <i class=\"fa fa-paperclip me-1 text-sm\"></i><span class=\"text-sm\">2</span></div><div class=\"avatar-group ms-auto\"><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Laurence\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-1.jpg\" class=\"\"></a><a href=\"#\" class=\"avatar avatar-xs me-2 rounded-circle\" data-toggle=\"tooltip\" data-original-title=\"Michael Lewis\"><img alt=\"Image placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/team-4.jpg\" class=\"rounded-circle\"></a></div></div>',\n                    assignee: \"Done Joe\",\n                    description: \"This task's description is for something, but not for anything\",\n                    class: [\"border-radius-md\"]\n                  }\n                ]\n              }\n            ]\n          });\n\n          var addBoardDefault = document.getElementById(\"jkanban-add-new-board\");\n          addBoardDefault.addEventListener(\"click\", function() {\n            let newBoardName = document.getElementById(\"jkanban-new-board-name\")\n              .value;\n            let newBoardId = \"_\" + newBoardName.toLowerCase().replace(/ /g, \"_\");\n            KanbanTest.addBoards([{\n              id: newBoardId,\n              title: newBoardName,\n              item: []\n            }]);\n            document.querySelector('#new-board-modal').classList.remove('show');\n            document.querySelector('body').classList.remove('modal-open');\n\n            document.querySelector('.modal-backdrop').remove();\n          });\n\n          var updateTask = document.getElementById(\"jkanban-update-task\");\n          updateTask.addEventListener(\"click\", function() {\n            let jkanbanInfoModalTaskId = document.querySelector(\n              \"#jkanban-info-modal #jkanban-task-id\"\n            );\n            let jkanbanInfoModalTaskTitle = document.querySelector(\n              \"#jkanban-info-modal #jkanban-task-title\"\n            );\n            let jkanbanInfoModalTaskAssignee = document.querySelector(\n              \"#jkanban-info-modal #jkanban-task-assignee\"\n            );\n            let jkanbanInfoModalTaskDescription = document.querySelector(\n              \"#jkanban-info-modal #jkanban-task-description\"\n            );\n            KanbanTest.replaceElement(jkanbanInfoModalTaskId.value, {\n              title: jkanbanInfoModalTaskTitle.value,\n              assignee: jkanbanInfoModalTaskAssignee.value,\n              description: jkanbanInfoModalTaskDescription.value\n            });\n            jkanbanInfoModalTaskId.value = jkanbanInfoModalTaskId.value;\n            jkanbanInfoModalTaskTitle.value = jkanbanInfoModalTaskTitle.value;\n            jkanbanInfoModalTaskAssignee.value = jkanbanInfoModalTaskAssignee.value;\n            jkanbanInfoModalTaskDescription.value = jkanbanInfoModalTaskDescription.value;\n            document.querySelector('#jkanban-info-modal').classList.remove('show');\n            document.querySelector('body').classList.remove('modal-open');\n            document.querySelector('.modal-backdrop').remove();\n          });\n        }\n      })();\n    </script>\n        <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/photo-swipe.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Photo Swipe | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#initialization\">Initialization</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#js\">JS</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Photo Swipe\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">JavaScript image gallery for mobile and desktop, modular, framework independent.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"initialization\">Initialization</h2>\n          <h3 id=\"js\">JS</h3>\n          <p>In order to use this plugin on your page you will need to include the following scripts in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../../assets/js/plugins/photoswipe.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../../assets/js/plugins/photoswipe-ui-default.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"example\">Example</h2>\n          <div class=\"row\">\n            <div class=\"col-10 text-center\">\n              <img class=\"w-100 border-radius-lg shadow-lg mx-auto\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-1.jpg\" alt=\"chair\">\n              <div class=\"my-gallery d-flex mt-4 pt-2\" itemscope=\"\" itemtype=\"http://schema.org/ImageGallery\" data-pswp-uid=\"1\">\n                <figure itemprop=\"associatedMedia\" itemscope=\"\" itemtype=\"http://schema.org/ImageObject\">\n                  <a href=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-2.jpg\" itemprop=\"contentUrl\" data-size=\"500x600\">\n                    <img class=\"w-100 min-height-100 max-height-100 border-radius-lg shadow\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-2.jpg\">\n                  </a>\n                </figure>\n                <figure class=\"ms-3\" itemprop=\"associatedMedia\" itemscope=\"\" itemtype=\"http://schema.org/ImageObject\">\n                  <a href=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-3.jpg\" itemprop=\"contentUrl\" data-size=\"500x600\">\n                    <img class=\"w-100 min-height-100 max-height-100 border-radius-lg shadow\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-3.jpg\" itemprop=\"thumbnail\" alt=\"Image description\">\n                  </a>\n                </figure>\n                <figure class=\"ms-3\" itemprop=\"associatedMedia\" itemscope=\"\" itemtype=\"http://schema.org/ImageObject\">\n                  <a href=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-4.jpg\" itemprop=\"contentUrl\" data-size=\"500x600\">\n                    <img class=\"w-100 min-height-100 max-height-100 border-radius-lg shadow\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-4.jpg\" itemprop=\"thumbnail\" alt=\"Image description\">\n                  </a>\n                </figure>\n                <figure class=\"ms-3\" itemprop=\"associatedMedia\" itemscope=\"\" itemtype=\"http://schema.org/ImageObject\">\n                  <a href=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-5.jpg?_ga=2.218417425.900775756.1637576941-1147030340.1637576941\" itemprop=\"contentUrl\" data-size=\"500x600\">\n                    <img class=\"w-100 min-height-100 max-height-100 border-radius-lg shadow\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-5.jpg\" itemprop=\"thumbnail\" alt=\"Image description\">\n                  </a>\n                </figure>\n              </div>\n              <!-- Root element of PhotoSwipe. Must have class pswp. -->\n              <div class=\"pswp\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\">\n                <!-- Background of PhotoSwipe.\n                    It's a separate element, as animating opacity is faster than rgba(). -->\n                <div class=\"pswp__bg\"></div>\n                <!-- Slides wrapper with overflow:hidden. -->\n                <div class=\"pswp__scroll-wrap\">\n                  <!-- Container that holds slides. PhotoSwipe keeps only 3 slides in DOM to save memory. -->\n                  <!-- don't modify these 3 pswp__item elements, data is added later on. -->\n                  <div class=\"pswp__container\" style=\"transform: translate3d(0px, 0px, 0px);\">\n                    <div class=\"pswp__item\" style=\"display: block; transform: translate3d(-1701px, 0px, 0px);\"><div class=\"pswp__zoom-wrap\" style=\"transform: translate3d(510px, 61px, 0px) scale(0.946372);\"><img class=\"pswp__img border-radius-lg\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-4.jpg\" style=\"opacity: 1; width: 528px; height: 634px;\"></div></div>\n                    <div class=\"pswp__item\" style=\"transform: translate3d(0px, 0px, 0px);\"><div class=\"pswp__zoom-wrap\" style=\"transform: translate3d(618.6px, 589.95px, 0px) scale(0.169968);\"><img class=\"pswp__img pswp__img--placeholder\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-5.jpg\" style=\"width: 528px; height: 634px; display: none;\"><img class=\"pswp__img\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-5.jpg?_ga=2.218417425.900775756.1637576941-1147030340.1637576941\" style=\"display: block; width: 528px; height: 634px;\"></div></div>\n                    <div class=\"pswp__item\" style=\"display: block; transform: translate3d(1701px, 0px, 0px);\"><div class=\"pswp__zoom-wrap\" style=\"transform: translate3d(510px, 61px, 0px) scale(0.946372);\"><img class=\"pswp__img border-radius-lg\" src=\"https://demos.creative-tim.com/test/material-dashboard-pro/assets/img/products/product-details-2.jpg\" style=\"opacity: 1; width: 528px; height: 634px;\"></div></div>\n                  </div>\n                  <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->\n                  <div class=\"pswp__ui pswp__ui--fit pswp__ui--hidden\">\n                    <div class=\"pswp__top-bar\">\n                      <!--  Controls are self-explanatory. Order can be changed. -->\n                      <div class=\"pswp__counter\">4 / 4</div>\n                      <button class=\"btn btn-white btn-sm pswp__button pswp__button--close\">Close (Esc)</button>\n                      <button class=\"btn btn-white btn-sm pswp__button pswp__button--fs\">Fullscreen</button>\n                      <button class=\"btn btn-white btn-sm pswp__button pswp__button--arrow--left\">Prev\n                      </button>\n                      <button class=\"btn btn-white btn-sm pswp__button pswp__button--arrow--right\">Next\n                      </button>\n                      <!-- Preloader demo https://codepen.io/dimsemenov/pen/yyBWoR -->\n                      <!-- element will get class pswp__preloader--active when preloader is running -->\n                      <div class=\"pswp__preloader\">\n                        <div class=\"pswp__preloader__icn\">\n                          <div class=\"pswp__preloader__cut\">\n                            <div class=\"pswp__preloader__donut\"></div>\n                          </div>\n                        </div>\n                      </div>\n                    </div>\n                    <div class=\"pswp__share-modal pswp__share-modal--hidden pswp__single-tap\">\n                      <div class=\"pswp__share-tooltip\"></div>\n                    </div>\n                    <div class=\"pswp__caption\">\n                      <div class=\"pswp__caption__center\"></div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\">// Products gallery\n\n  var initPhotoSwipeFromDOM = function(gallerySelector) {\n\n    // parse slide data (url, title, size ...) from DOM elements\n    // (children of gallerySelector)\n    var parseThumbnailElements = function(el) {\n      var thumbElements = el.childNodes,\n        numNodes = thumbElements.length,\n        items = [],\n        figureEl,\n        linkEl,\n        size,\n        item;\n\n      for (var i = 0; i &lt; numNodes; i++) {\n\n        figureEl = thumbElements[i]; // <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figure</span><span class=\"token punctuation\">&gt;</span></span> element\n        // include only element nodes\n        if (figureEl.nodeType !== 1) {\n          continue;\n        }\n\n        linkEl = figureEl.children[0]; // <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>a</span><span class=\"token punctuation\">&gt;</span></span> element\n\n        size = linkEl.getAttribute('data-size').split('x');\n\n        // create slide object\n        item = {\n          src: linkEl.getAttribute('href'),\n          w: parseInt(size[0], 10),\n          h: parseInt(size[1], 10)\n        };\n\n        if (figureEl.children.length &gt; 1) {\n          // <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>figcaption</span><span class=\"token punctuation\">&gt;</span></span> content\n          item.title = figureEl.children[1].innerHTML;\n        }\n\n        if (linkEl.children.length &gt; 0) {\n          // <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>img</span><span class=\"token punctuation\">&gt;</span></span> thumbnail element, retrieving thumbnail url\n          item.msrc = linkEl.children[0].getAttribute('src');\n        }\n\n        item.el = figureEl; // save link to element for getThumbBoundsFn\n        items.push(item);\n      }\n\n      return items;\n    };\n\n    // find nearest parent element\n    var closest = function closest(el, fn) {\n      return el &amp;&amp; (fn(el) ? el : closest(el.parentNode, fn));\n    };\n\n    // triggers when user clicks on thumbnail\n    var onThumbnailsClick = function(e) {\n      e = e || window.event;\n      e.preventDefault ? e.preventDefault() : e.returnValue = false;\n\n      var eTarget = e.target || e.srcElement;\n\n      // find root element of slide\n      var clickedListItem = closest(eTarget, function(el) {\n        return (el.tagName &amp;&amp; el.tagName.toUpperCase() === 'FIGURE');\n      });\n\n      if (!clickedListItem) {\n        return;\n      }\n\n      // find index of clicked item by looping through all child nodes\n      // alternatively, you may define index via data- attribute\n      var clickedGallery = clickedListItem.parentNode,\n        childNodes = clickedListItem.parentNode.childNodes,\n        numChildNodes = childNodes.length,\n        nodeIndex = 0,\n        index;\n\n      for (var i = 0; i &lt; numChildNodes; i++) {\n        if (childNodes[i].nodeType !== 1) {\n          continue;\n        }\n\n        if (childNodes[i] === clickedListItem) {\n          index = nodeIndex;\n          break;\n        }\n        nodeIndex++;\n      }\n\n\n\n      if (index &gt;= 0) {\n        // open PhotoSwipe if valid index found\n        openPhotoSwipe(index, clickedGallery);\n      }\n      return false;\n    };\n\n    // parse picture index and gallery index from URL (#&amp;pid=1&amp;gid=2)\n    var photoswipeParseHash = function() {\n      var hash = window.location.hash.substring(1),\n        params = {};\n\n      if (hash.length &lt; 5) {\n        return params;\n      }\n\n      var vars = hash.split('&amp;');\n      for (var i = 0; i &lt; vars.length; i++) {\n        if (!vars[i]) {\n          continue;\n        }\n        var pair = vars[i].split('=');\n        if (pair.length &lt; 2) {\n          continue;\n        }\n        params[pair[0]] = pair[1];\n      }\n\n      if (params.gid) {\n        params.gid = parseInt(params.gid, 10);\n      }\n\n      return params;\n    };\n\n    var openPhotoSwipe = function(index, galleryElement, disableAnimation, fromURL) {\n      var pswpElement = document.querySelectorAll('.pswp')[0],\n        gallery,\n        options,\n        items;\n\n      items = parseThumbnailElements(galleryElement);\n\n      // define options (if needed)\n      options = {\n\n        // define gallery index (for URL)\n        galleryUID: galleryElement.getAttribute('data-pswp-uid'),\n\n        getThumbBoundsFn: function(index) {\n          // See Options -&gt; getThumbBoundsFn section of documentation for more info\n          var thumbnail = items[index].el.getElementsByTagName('img')[0], // find thumbnail\n            pageYScroll = window.pageYOffset || document.documentElement.scrollTop,\n            rect = thumbnail.getBoundingClientRect();\n\n          return {\n            x: rect.left,\n            y: rect.top + pageYScroll,\n            w: rect.width\n          };\n        }\n\n      };\n\n      // PhotoSwipe opened from URL\n      if (fromURL) {\n        if (options.galleryPIDs) {\n          // parse real index when custom PIDs are used\n          // http://photoswipe.com/documentation/faq.html#custom-pid-in-url\n          for (var j = 0; j &lt; items.length; j++) {\n            if (items[j].pid == index) {\n              options.index = j;\n              break;\n            }\n          }\n        } else {\n          // in URL indexes start from 1\n          options.index = parseInt(index, 10) - 1;\n        }\n      } else {\n        options.index = parseInt(index, 10);\n      }\n\n      // exit if index not found\n      if (isNaN(options.index)) {\n        return;\n      }\n\n      if (disableAnimation) {\n        options.showAnimationDuration = 0;\n      }\n\n      // Pass data to PhotoSwipe and initialize it\n      gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);\n      gallery.init();\n    };\n\n    // loop through all gallery elements and bind events\n    var galleryElements = document.querySelectorAll(gallerySelector);\n\n    for (var i = 0, l = galleryElements.length; i &lt; l; i++) {\n      galleryElements[i].setAttribute('data-pswp-uid', i + 1);\n      galleryElements[i].onclick = onThumbnailsClick;\n    }\n\n    // Parse URL and open gallery if it contains #&amp;pid=3&amp;gid=1\n    var hashData = photoswipeParseHash();\n    if (hashData.pid &amp;&amp; hashData.gid) {\n      openPhotoSwipe(hashData.pid, galleryElements[hashData.gid - 1], true, true);\n    }\n  };\n\n  // execute above function\n  initPhotoSwipeFromDOM('.my-gallery');</code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n\n    <script src=\"../../assets/js/photoswipe.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/photoswipe-ui-default.min.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      // Products gallery\n\n      var initPhotoSwipeFromDOM = function(gallerySelector) {\n\n        // parse slide data (url, title, size ...) from DOM elements\n        // (children of gallerySelector)\n        var parseThumbnailElements = function(el) {\n          var thumbElements = el.childNodes,\n            numNodes = thumbElements.length,\n            items = [],\n            figureEl,\n            linkEl,\n            size,\n            item;\n\n          for (var i = 0; i < numNodes; i++) {\n\n            figureEl = thumbElements[i]; // <figure> element\n            // include only element nodes\n            if (figureEl.nodeType !== 1) {\n              continue;\n            }\n\n            linkEl = figureEl.children[0]; // <a> element\n\n            size = linkEl.getAttribute('data-size').split('x');\n\n            // create slide object\n            item = {\n              src: linkEl.getAttribute('href'),\n              w: parseInt(size[0], 10),\n              h: parseInt(size[1], 10)\n            };\n\n            if (figureEl.children.length > 1) {\n              // <figcaption> content\n              item.title = figureEl.children[1].innerHTML;\n            }\n\n            if (linkEl.children.length > 0) {\n              // <img> thumbnail element, retrieving thumbnail url\n              item.msrc = linkEl.children[0].getAttribute('src');\n            }\n\n            item.el = figureEl; // save link to element for getThumbBoundsFn\n            items.push(item);\n          }\n\n          return items;\n        };\n\n        // find nearest parent element\n        var closest = function closest(el, fn) {\n          return el && (fn(el) ? el : closest(el.parentNode, fn));\n        };\n\n        // triggers when user clicks on thumbnail\n        var onThumbnailsClick = function(e) {\n          e = e || window.event;\n          e.preventDefault ? e.preventDefault() : e.returnValue = false;\n\n          var eTarget = e.target || e.srcElement;\n\n          // find root element of slide\n          var clickedListItem = closest(eTarget, function(el) {\n            return (el.tagName && el.tagName.toUpperCase() === 'FIGURE');\n          });\n\n          if (!clickedListItem) {\n            return;\n          }\n\n          // find index of clicked item by looping through all child nodes\n          // alternatively, you may define index via data- attribute\n          var clickedGallery = clickedListItem.parentNode,\n            childNodes = clickedListItem.parentNode.childNodes,\n            numChildNodes = childNodes.length,\n            nodeIndex = 0,\n            index;\n\n          for (var i = 0; i < numChildNodes; i++) {\n            if (childNodes[i].nodeType !== 1) {\n              continue;\n            }\n\n            if (childNodes[i] === clickedListItem) {\n              index = nodeIndex;\n              break;\n            }\n            nodeIndex++;\n          }\n\n\n\n          if (index >= 0) {\n            // open PhotoSwipe if valid index found\n            openPhotoSwipe(index, clickedGallery);\n          }\n          return false;\n        };\n\n        // parse picture index and gallery index from URL (#&pid=1&gid=2)\n        var photoswipeParseHash = function() {\n          var hash = window.location.hash.substring(1),\n            params = {};\n\n          if (hash.length < 5) {\n            return params;\n          }\n\n          var vars = hash.split('&');\n          for (var i = 0; i < vars.length; i++) {\n            if (!vars[i]) {\n              continue;\n            }\n            var pair = vars[i].split('=');\n            if (pair.length < 2) {\n              continue;\n            }\n            params[pair[0]] = pair[1];\n          }\n\n          if (params.gid) {\n            params.gid = parseInt(params.gid, 10);\n          }\n\n          return params;\n        };\n\n        var openPhotoSwipe = function(index, galleryElement, disableAnimation, fromURL) {\n          var pswpElement = document.querySelectorAll('.pswp')[0],\n            gallery,\n            options,\n            items;\n\n          items = parseThumbnailElements(galleryElement);\n\n          // define options (if needed)\n          options = {\n\n            // define gallery index (for URL)\n            galleryUID: galleryElement.getAttribute('data-pswp-uid'),\n\n            getThumbBoundsFn: function(index) {\n              // See Options -> getThumbBoundsFn section of documentation for more info\n              var thumbnail = items[index].el.getElementsByTagName('img')[0], // find thumbnail\n                pageYScroll = window.pageYOffset || document.documentElement.scrollTop,\n                rect = thumbnail.getBoundingClientRect();\n\n              return {\n                x: rect.left,\n                y: rect.top + pageYScroll,\n                w: rect.width\n              };\n            }\n\n          };\n\n          // PhotoSwipe opened from URL\n          if (fromURL) {\n            if (options.galleryPIDs) {\n              // parse real index when custom PIDs are used\n              // http://photoswipe.com/documentation/faq.html#custom-pid-in-url\n              for (var j = 0; j < items.length; j++) {\n                if (items[j].pid == index) {\n                  options.index = j;\n                  break;\n                }\n              }\n            } else {\n              // in URL indexes start from 1\n              options.index = parseInt(index, 10) - 1;\n            }\n          } else {\n            options.index = parseInt(index, 10);\n          }\n\n          // exit if index not found\n          if (isNaN(options.index)) {\n            return;\n          }\n\n          if (disableAnimation) {\n            options.showAnimationDuration = 0;\n          }\n\n          // Pass data to PhotoSwipe and initialize it\n          gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);\n          gallery.init();\n        };\n\n        // loop through all gallery elements and bind events\n        var galleryElements = document.querySelectorAll(gallerySelector);\n\n        for (var i = 0, l = galleryElements.length; i < l; i++) {\n          galleryElements[i].setAttribute('data-pswp-uid', i + 1);\n          galleryElements[i].onclick = onThumbnailsClick;\n        }\n\n        // Parse URL and open gallery if it contains #&pid=3&gid=1\n        var hashData = photoswipeParseHash();\n        if (hashData.pid && hashData.gid) {\n          openPhotoSwipe(hashData.pid, galleryElements[hashData.gid - 1], true, true);\n        }\n      };\n\n      // execute above function\n      initPhotoSwipeFromDOM('.my-gallery');\n    </script>\n        <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/quill.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Quill | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#initialization\">Initialization</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#js\">JS</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Quill\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">The Bootstrap Quill is a powerful rich text editor built for compatibility and extensibility. <br> Keep reading our Bootstrap Quill examples and learn how to use this plugin.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"initialization\">Initialization</h2>\n          <h3 id=\"js\">JS</h3>\n          <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/quill.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"example\">Example</h2>\n          <div class=\"card\">\n            <div id=\"editor\">\n              <p>Hello World!</p>\n              <p>Some initial <strong>bold</strong> text</p>\n              <p><br /></p>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;div</span> <span class=\"na\">id=</span><span class=\"s\">\"editor\"</span><span class=\"nt\">&gt;</span>\n  <span class=\"nt\">&lt;p&gt;</span>Hello World!<span class=\"nt\">&lt;/p&gt;</span>\n  <span class=\"nt\">&lt;p&gt;</span>Some initial <span class=\"nt\">&lt;strong&gt;</span>bold<span class=\"nt\">&lt;/strong&gt;</span> text<span class=\"nt\">&lt;/p&gt;</span>\n  <span class=\"nt\">&lt;p&gt;&lt;br&gt;&lt;/p&gt;</span>\n<span class=\"nt\">&lt;/div&gt;</span></code></pre>\n            </figure>\n          </div>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\">var quill = new Quill('#editor', {\n  theme: 'snow' // Specify theme in configuration\n});</code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/quill.min.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      var quill = new Quill('#editor', {\n        theme: 'snow' // Specify theme in configuration\n      });\n    </script>\n        <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n  </body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/sliders.html",
    "content": "<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Sliders | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#initialization\">Initialization</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#slider\">Slider</a></li>\n                <li class=\"toc-entry toc-h3\"><a href=\"#range-slider\">Range slider</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#round-sliders\">Round sliders</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage-1\">Usage</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h6\"><a href=\"#device-limit\">Device limit</a></li>\n                <li class=\"toc-entry toc-h4\"><a href=\"#21c\">21°C</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Sliders\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Our Bootstrap Sliders (customised noUiSlider) refers to a lightweight JavaScript range slider library. The slider offers a wide selection of options and settings and is compatible with a ton of (touch) devices, including those running iOS, Android, Windows 8/8.1/10, Windows Phone 8.1 and Windows Mobile 10. <br> Keep reading our Bootstrap Sliders examples and learn how to use this plugin.</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>/assets/vendor/nouislider/js/nouislider.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"initialization\">Initialization</h2>\n          <p>Simply copy one of the code examples demonstrated below and include it in your page. Afterwards, you can modify the slider’s values with the ones you need.</p>\n          <h2 id=\"examples\">Examples</h2>\n          <h3 id=\"slider\">Slider</h3>\n          <!-- Simple slider -->\n          <!-- Simple slider -->\n          <div class=\"mb-5\">\n            <div id=\"sliderRegular\"></div>\n          </div>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"c\">&lt;!-- Simple slider --&gt;</span>\n<span class=\"nt\">&lt;div</span> <span class=\"na\">id=</span><span class=\"s\">\"sliderDouble\"</span><span class=\"nt\">&gt;&lt;/div&gt;</span></code></pre>\n            </figure>\n          </div>\n          <h3 id=\"range-slider\">Range slider</h3>\n          <!-- Range slider container -->\n          <div class=\"mb-5\">\n            <div id=\"sliderDouble\"></div>\n          </div>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"c\">&lt;!-- Range slider container --&gt;</span>\n<span class=\"nt\">&lt;div</span> <span class=\"na\">id=</span><span class=\"s\">\"sliderDouble\"</span><span class=\"nt\">&gt;&lt;/div&gt;</span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"round-sliders\">Round sliders</h2>\n          <h2 id=\"usage-1\">Usage</h2>\n          <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../../assets/js/plugins/round-slider.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"example\">Example</h2>\n          <div class=\"card card-plain\">\n            <div class=\"card-body text-center p-3\">\n              <h6 class=\"text-start\">Device limit</h6>\n              <round-slider value=\"21\" valuelabel=\"Temperature\"></round-slider>\n              <h4 class=\"font-weight-bold mt-n7\"><span class=\"text-dark\" id=\"value\">21</span><span class=\"text-body\">°C</span></h4>\n              <p class=\"ps-1 mt-5 mb-0\"><span class=\"text-xs\">16°C</span><span class=\"px-3\">Temperature</span><span class=\"text-xs\">38°C</span></p>\n            </div>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card card-plain<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>div</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>card-body text-center p-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h6</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-start<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Device limit<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h6</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>round-slider</span> <span class=\"token attr-name\">value</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>21<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">valueLabel</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>Temperature<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>round-slider</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>h4</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>font-weight-bold mt-n7<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-dark<span class=\"token punctuation\">\"</span></span> <span class=\"token attr-name\">id</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>value<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>21<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-body<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>°C<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>h4</span><span class=\"token punctuation\">&gt;</span></span>\n    <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>p</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>ps-1 mt-5 mb-0<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>16°C<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>px-3<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>Temperature<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>span</span> <span class=\"token attr-name\">class</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>text-xs<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span>38°C<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>span</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>p</span><span class=\"token punctuation\">&gt;</span></span>\n  <span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>div</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"><span class=\"token language-javascript\">\n    <span class=\"token comment\">// Rounded slider</span>\n    <span class=\"token keyword\">const</span> <span class=\"token function-variable function\">setValue</span> <span class=\"token operator\">=</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">value<span class=\"token punctuation\">,</span> active</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n      document<span class=\"token punctuation\">.</span><span class=\"token function\">querySelectorAll</span><span class=\"token punctuation\">(</span><span class=\"token string\">\"round-slider\"</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">.</span><span class=\"token function\">forEach</span><span class=\"token punctuation\">(</span><span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">el</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n        <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>el<span class=\"token punctuation\">.</span>value <span class=\"token operator\">===</span> <span class=\"token keyword\">undefined</span><span class=\"token punctuation\">)</span> <span class=\"token keyword\">return</span><span class=\"token punctuation\">;</span>\n        el<span class=\"token punctuation\">.</span>value <span class=\"token operator\">=</span> value<span class=\"token punctuation\">;</span>\n      <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n      <span class=\"token keyword\">const</span> span <span class=\"token operator\">=</span> document<span class=\"token punctuation\">.</span><span class=\"token function\">querySelector</span><span class=\"token punctuation\">(</span><span class=\"token string\">\"#value\"</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n      span<span class=\"token punctuation\">.</span>innerHTML <span class=\"token operator\">=</span> value<span class=\"token punctuation\">;</span>\n      <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>active<span class=\"token punctuation\">)</span>\n        span<span class=\"token punctuation\">.</span>style<span class=\"token punctuation\">.</span>color <span class=\"token operator\">=</span> <span class=\"token string\">'red'</span><span class=\"token punctuation\">;</span>\n      <span class=\"token keyword\">else</span>\n        span<span class=\"token punctuation\">.</span>style<span class=\"token punctuation\">.</span>color <span class=\"token operator\">=</span> <span class=\"token string\">'black'</span><span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span>\n\n    document<span class=\"token punctuation\">.</span><span class=\"token function\">querySelectorAll</span><span class=\"token punctuation\">(</span><span class=\"token string\">\"round-slider\"</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">.</span><span class=\"token function\">forEach</span><span class=\"token punctuation\">(</span><span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">el</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n      el<span class=\"token punctuation\">.</span><span class=\"token function\">addEventListener</span><span class=\"token punctuation\">(</span><span class=\"token string\">'value-changed'</span><span class=\"token punctuation\">,</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">ev</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n        <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>value <span class=\"token operator\">!==</span> <span class=\"token keyword\">undefined</span><span class=\"token punctuation\">)</span>\n          <span class=\"token function\">setValue</span><span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>value<span class=\"token punctuation\">,</span> <span class=\"token boolean\">false</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n        <span class=\"token keyword\">else</span> <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>low <span class=\"token operator\">!==</span> <span class=\"token keyword\">undefined</span><span class=\"token punctuation\">)</span>\n          <span class=\"token function\">setLow</span><span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>low<span class=\"token punctuation\">,</span> <span class=\"token boolean\">false</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n        <span class=\"token keyword\">else</span> <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>high <span class=\"token operator\">!==</span> <span class=\"token keyword\">undefined</span><span class=\"token punctuation\">)</span>\n          <span class=\"token function\">setHigh</span><span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>high<span class=\"token punctuation\">,</span> <span class=\"token boolean\">false</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n      <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n      el<span class=\"token punctuation\">.</span><span class=\"token function\">addEventListener</span><span class=\"token punctuation\">(</span><span class=\"token string\">'value-changing'</span><span class=\"token punctuation\">,</span> <span class=\"token keyword\">function</span><span class=\"token punctuation\">(</span><span class=\"token parameter\">ev</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n        <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>value <span class=\"token operator\">!==</span> <span class=\"token keyword\">undefined</span><span class=\"token punctuation\">)</span>\n          <span class=\"token function\">setValue</span><span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>value<span class=\"token punctuation\">,</span> <span class=\"token boolean\">true</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n        <span class=\"token keyword\">else</span> <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>low <span class=\"token operator\">!==</span> <span class=\"token keyword\">undefined</span><span class=\"token punctuation\">)</span>\n          <span class=\"token function\">setLow</span><span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>low<span class=\"token punctuation\">,</span> <span class=\"token boolean\">true</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n        <span class=\"token keyword\">else</span> <span class=\"token keyword\">if</span> <span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>high <span class=\"token operator\">!==</span> <span class=\"token keyword\">undefined</span><span class=\"token punctuation\">)</span>\n          <span class=\"token function\">setHigh</span><span class=\"token punctuation\">(</span>ev<span class=\"token punctuation\">.</span>detail<span class=\"token punctuation\">.</span>high<span class=\"token punctuation\">,</span> <span class=\"token boolean\">true</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n      <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n    <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</span></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/nouislider.min.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      var slider = document.getElementById('sliderRegular');\n      noUiSlider.create(slider, {\n        start: 40,\n        connect: [true, false],\n        range: {\n          min: 0,\n          max: 100\n        }\n      });\n      var slider2 = document.getElementById('sliderDouble');\n      noUiSlider.create(slider2, {\n        start: [20, 60],\n        connect: true,\n        range: {\n          min: 0,\n          max: 100\n        }\n      });\n    </script>\n    <script src=\"../../assets/js/round-slider.min.js\" type=\"text/javascript\"></script>\n    <script type=\"text/javascript\">\n      const setValue = function(value, active) {\n        document.querySelectorAll(\"round-slider\").forEach(function(el) {\n          if (el.value === undefined) return;\n          el.value = value;\n        });\n        const span = document.querySelector(\"#value\");\n        span.innerHTML = value;\n        if (active)\n          span.style.color = 'red';\n        else\n          span.style.color = 'black';\n      }\n\n      document.querySelectorAll(\"round-slider\").forEach(function(el) {\n        el.addEventListener('value-changed', function(ev) {\n          if (ev.detail.value !== undefined)\n            setValue(ev.detail.value, false);\n          else if (ev.detail.low !== undefined)\n            setLow(ev.detail.low, false);\n          else if (ev.detail.high !== undefined)\n            setHigh(ev.detail.high, false);\n        });\n\n        el.addEventListener('value-changing', function(ev) {\n          if (ev.detail.value !== undefined)\n            setValue(ev.detail.value, true);\n          else if (ev.detail.low !== undefined)\n            setLow(ev.detail.low, true);\n          else if (ev.detail.high !== undefined)\n            setHigh(ev.detail.high, true);\n        });\n      });\n    </script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n    <script type=\"text/javascript\">\n      var slider = document.getElementById('sliderRegular');\n      noUiSlider.create(slider, {\n        start: 40,\n        connect: [true, false],\n        range: {\n          min: 0,\n          max: 100\n        }\n      });\n      var slider2 = document.getElementById('sliderDouble');\n      noUiSlider.create(slider2, {\n        start: [20, 60],\n        connect: true,\n        range: {\n          min: 0,\n          max: 100\n        }\n      });\n    </script>\n\n</body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/sweet-alerts.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Sweet Alerts | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs\" style=\"padding-right: 0px;\">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a>\n              <ul>\n                <li class=\"toc-entry toc-h3\"><a href=\"#js\">JS</a></li>\n              </ul>\n            </li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#examples\">Examples</a></li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n            <div class=\"ct-docs-page-title\">\n              <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n                Bootstrap Sweet Alerts\n              </h1>\n              <span class=\"ct-docs-page-title-pro-line\"> - </span>\n              <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n              <div class=\"avatar-group mt-3\">\n              </div>\n            </div>\n            <p class=\"ct-docs-page-title-lead\">Our Bootstrap Sweet Alerts are beautiful, responsive, customisable, accessible replacements for Javascript’s popup boxes. <br /> Keep reading our Bootstrap Alerts examples and learn how to use this plugin.</p>\n            <hr class=\"ct-docs-hr\">\n            <h2 id=\"usage\">Usage</h2>\n            <h3 id=\"js\">JS</h3>\n            <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n            <div class=\"position-relative\">\n              <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;script </span><span class=\"na\">src=</span><span class=\"s\">\"../../assets/js/plugins/sweetalert.min.js\"</span><span class=\"nt\">&gt;&lt;/script&gt;</span></code></pre>\n              </figure>\n            </div>\n            <h2 id=\"examples\">Examples</h2>\n            <div class=\"row mb-5\">\n              <div class=\"col-lg-12 col-md-12 mx-auto\">\n                <div class=\"row mt-5\">\n                  <div class=\"col-md-4\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">Basic example</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('basic')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-md-4 mt-4 mt-md-0\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">A success message</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('success-message')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-md-4 mt-4 mt-md-0\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">Custom HTML description</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('custom-html')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"row mt-4\">\n                  <div class=\"col-md-4\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">Gitgub avatar request</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('input-field')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-md-4 mt-4 mt-md-0\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">A title with a text under</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('title-and-text')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-md-4 mt-4 mt-md-0\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">A message with auto close</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('auto-close')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"row mt-4 mb-5\">\n                  <div class=\"col-md-4\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">A warning message, with a function attached to the \"Confirm\" Button...</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('warning-message-and-confirmation')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-md-4 mt-4 mt-md-0\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">...and by passing a parameter, you can execute something else for \"Cancel\"</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('warning-message-and-cancel')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                  <div class=\"col-md-4 mt-4 mt-md-0\">\n                    <div class=\"card\">\n                      <div class=\"card-body text-center\">\n                        <p class=\"card-text\">Right-to-left support for Arabic, Persian, Hebrew, and other RTL languages</p>\n                        <button class=\"btn bg-gradient-primary mb-0\" onclick=\"material.showSwal('rtl-language')\">Try me!</button>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class=\"position-relative\">\n              <figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('basic')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('success-message')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('custom-html')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('input-field')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('title-and-text')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('auto-close')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('warning-message-and-confirmation')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('warning-message-and-cancel')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span>\n  <span class=\"nt\">&lt;button</span> <span class=\"na\">class=</span><span class=\"s\">\"btn bg-gradient-primary mb-0\"</span> <span class=\"na\">onclick=</span><span class=\"s\">\"material.showSwal('rtl-language')\"</span><span class=\"nt\">&gt;</span>Try me!<span class=\"nt\">&lt;/button&gt;</span></code></pre>\n              </figure>\n            </div>\n          </main>\n        </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/plugins/sweetalert.min.js\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/docs.js\"></script>\n  </body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/material/documentation/plugins/wizard.html",
    "content": "\n<!DOCTYPE html>\n<html>\n\n  <head>\n    <meta charset=\"utf-8\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"../../assets/img/apple-icon.png\">\n    <link rel=\"icon\" href=\"../../assets/img/favicon.png\" type=\"image/png\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <meta name=\"author\" content=\"Creative Tim\">\n    <title>\n      Wizard | Material Dashboard 2 FREE Laravel by Creative Tim & UPDIVISION\n    </title>\n    <link rel=\"canonical\" href=\"https://www.creative-tim.com/learning-lab/bootstrap/colors/material-dashboard\" />\n\n    <meta name=\"keywords\" content=\"creative tim, updivision, html dashboard, laravel, material, html css dashboard laravel, material dashboard laravel, laravel material dashboard, material admin, laravel dashboard, laravel admin, web dashboard, bootstrap 5 dashboard laravel, bootstrap 5, css3 dashboard, bootstrap 5 admin laravel, material dashboard bootstrap 5 laravel, frontend, responsive bootstrap 5 dashboard, material dashboard, material laravel bootstrap 5 dashboard\" />\n    <meta name=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"name\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta itemprop=\"description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta itemprop=\"image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta name=\"twitter:card\" content=\"product\" />\n    <meta name=\"twitter:site\" content=\"@creativetim\" />\n    <meta name=\"twitter:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta name=\"twitter:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta name=\"twitter:creator\" content=\"@creativetim\" />\n    <meta name=\"twitter:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"fb:app_id\" content=\"655968634437471\" />\n    <meta property=\"og:title\" content=\"Material Dashboard 2 Laravel by Creative Tim & UPDIVISION\" />\n    <meta property=\"og:type\" content=\"article\" />\n    <meta property=\"og:url\" content=\"https://www.creative-tim.com/live/material-dashboard-laravel\" />\n    <meta property=\"og:image\" content=\"https://s3.amazonaws.com/creativetim_bucket/products/598/original/material-dashboard-laravel.jpg\" />\n    <meta property=\"og:description\" content=\"A free Laravel Dashboard featuring dozens of UI components & basic Laravel CRUDs.\" />\n    <meta property=\"og:site_name\" content=\"Creative Tim\" />\n\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nucleo-icons.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/nextjs-material-dashboard-pro.min.css\" type=\"text/css\">\n\n    <link rel=\"stylesheet\" href=\"../../assets/css/material-dashboard.min.css\" type=\"text/css\">\n    <link rel=\"stylesheet\" href=\"../../assets/css/demo.css\" type=\"text/css\">\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n\n    <link href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700\" rel=\"stylesheet\">\n\n    <link href=\"../../assets/css/nucleo-icons.css\" rel=\"stylesheet\">\n\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Anti-flicker snippet (recommended)  -->\n    <style>\n      .async-hide {\n        opacity: 0 !important\n      }\n    </style>\n    <script>\n      (function(a, s, y, n, c, h, i, d, e) {\n        s.className += ' ' + y;\n        h.start = 1 * new Date;\n        h.end = i = function() {\n          s.className = s.className.replace(RegExp(' ?' + y), '')\n        };\n        (a[n] = a[n] || []).hide = h;\n        setTimeout(function() {\n          i();\n          h.end = null\n        }, c);\n        h.timeout = c;\n      })(window, document.documentElement, 'async-hide', 'dataLayer', 4000, {\n        'GTM-K9BGS8K': true\n      });\n    </script>\n    <!-- Analytics-Optimize Snippet -->\n    <script>\n      (function(i, s, o, g, r, a, m) {\n        i['GoogleAnalyticsObject'] = r;\n        i[r] = i[r] || function() {\n          (i[r].q = i[r].q || []).push(arguments)\n        }, i[r].l = 1 * new Date();\n        a = s.createElement(o),\n          m = s.getElementsByTagName(o)[0];\n        a.async = 1;\n        a.src = g;\n        m.parentNode.insertBefore(a, m)\n      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');\n      ga('create', 'UA-46172202-22', 'auto', {\n        allowLinker: true\n      });\n      ga('set', 'anonymizeIp', true);\n      ga('require', 'GTM-K9BGS8K');\n      ga('require', 'displayfeatures');\n      ga('require', 'linker');\n      ga('linker:autoLink', [\"2checkout.com\", \"avangate.com\"]);\n    </script>\n    <!-- end Analytics-Optimize Snippet -->\n    <!-- Google Tag Manager -->\n    <script>\n      (function(w, d, s, l, i) {\n        w[l] = w[l] || [];\n        w[l].push({\n          'gtm.start': new Date().getTime(),\n          event: 'gtm.js'\n        });\n        var f = d.getElementsByTagName(s)[0],\n          j = d.createElement(s),\n          dl = l != 'dataLayer' ? '&l=' + l : '';\n        j.async = true;\n        j.src =\n          'https://www.googletagmanager.com/gtm.js?id=' + i + dl;\n        f.parentNode.insertBefore(j, f);\n      })(window, document, 'script', 'dataLayer', 'GTM-NKDMSK6');\n    </script>\n    <!-- End Google Tag Manager -->\n    <!-- This is for docs typography and layout -->\n    <link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700\" rel=\"stylesheet\">\n    <link href=\"../../assets/css/docs.css\" rel=\"stylesheet\" />\n  </head>\n  <body class=\"docs \">\n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6\" height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n    <header class=\"ct-docs-navbar\">\n      <a class=\"ct-docs-navbar-brand\" href=\"javascript:void(0)\" aria-label=\"Bootstrap\">\n        </a><a href=\"https://www.creative-tim.com/\" class=\"ct-docs-navbar-text\" target=\"_blank\">\n          Creative Tim\n        </a>\n        <div class=\"ct-docs-navbar-border\"></div>\n        <a href=\"../../documentation/getting-started/installation.html\" class=\"ct-docs-navbar-text\">\n          Docs\n        </a>\n\n      <ul class=\"ct-docs-navbar-nav-left\">\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Live Preview</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownPreview\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://material-dashboard-pro-laravel.creative-tim.com\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n        <li class=\"ct-docs-nav-item-dropdown\">\n          <a href=\"javascript:;\" class=\"ct-docs-navbar-nav-link\" role=\"button\">\n            <span class=\"ct-docs-navbar-nav-link-inner--text\">Support</span>\n          </a>\n          <div class=\"ct-docs-navbar-dropdown-menu\" aria-labelledby=\"DropdownSupport\">\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Laravel\n            </a>\n            <a class=\"ct-docs-navbar-dropdown-item\" href=\"https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues\" target=\"_blank\">\n              Material Dashboard 2 Pro Laravel\n            </a>\n          </div>\n        </li>\n      </ul>\n      <ul class=\"ct-docs-navbar-nav-right\">\n        <li class=\"ct-docs-navbar-nav-item\">\n          <a class=\"ct-docs-navbar-nav-link\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Download Free</a>\n        </li>\n      </ul>\n      <a href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" class=\"ct-docs-btn-upgrade\">\n        <span class=\"ct-docs-btn-inner--icon\">\n          <i class=\"fas fa-download mr-2\" aria-hidden=\"true\"></i>\n        </span>\n        <span class=\"ct-docs-navbar-nav-link-inner--text\">Upgrade to PRO</span>\n      </a>\n      <button class=\"ct-docs-navbar-toggler\" type=\"button\">\n        <span class=\"ct-docs-navbar-toggler-icon\"></span>\n      </button>\n    </header>\n    <div class=\"ct-docs-main-container\">\n      <div class=\"ct-docs-main-content-row\">\n        <div class=\"ct-docs-sidebar-col\">\n          <nav class=\"ct-docs-sidebar-collapse-links\">\n            <div class=\"ct-docs-sidebar-product\">\n              <div class=\"ct-docs-sidebar-product-image\">\n                <img src=\"../../assets/img/bootstrap.png\">\n              </div>\n              <p class=\"ct-docs-sidebar-product-text\">Material Dashboard</p>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-active-40 text-white\"></i>\n                  </div>\n                </div>\n                Getting started\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/overview.html\">\n                    Overview\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/license.html\">\n                    License\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/installation.html\">\n                    Installation\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/build-tools.html\">\n                    Build Tools\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/getting-started/bootstrap.html\">\n                    What is Bootstrap\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n                <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                  <div class=\"d-inline-block\">\n                    <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                      <i class=\"ni ni-folder-17 text-white\"></i>\n                    </div>\n                  </div>\n                  Laravel\n                </a>\n                <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/login.html\">\n                      Login\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/sign-up.html\">\n                      Sign Up\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/forgot-password.html\">\n                      Forgot Password\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-profile.html\">\n                      User Profile\n                    </a>\n                  </li>\n                  <li class=\"\">\n                    <a href=\"../../documentation/laravel/user-management.html\">\n                      User Management\n                      <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                    </a>\n                  </li>\n                </ul>\n              </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-folder-17 text-white\"></i>\n                  </div>\n                </div>\n                Foundation\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/colors.html\">\n                    Colors\n                  </a>\n                </li>\n                <li class=\" \">\n                  <a href=\"../../documentation/foundation/grid.html\">\n                    Grid\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/typography.html\">\n                    Typography\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/icons.html\">\n                    Icons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/foundation/utilities.html\">\n                    Utilities\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-app text-white\"></i>\n                  </div>\n                </div>\n                Components\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/components/alerts.html\">\n                    Alerts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/badge.html\">\n                    Badge\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/buttons.html\">\n                    Buttons\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/social-buttons.html\">\n                    Social Buttons\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/cards.html\">\n                    Cards\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/carousel.html\">\n                    Carousel\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/collapse.html\">\n                    Collapse\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/dropdowns.html\">\n                    Dropdowns\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/forms.html\">\n                    Forms\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/input-group.html\">\n                    Input Group\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/list-group.html\">\n                    List Group\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/modal.html\">\n                    Modal\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navs.html\">\n                    Navs\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/navbar.html\">\n                    Navbar\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/pagination.html\">\n                    Pagination\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/popovers.html\">\n                    Popovers\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/progress.html\">\n                    Progress\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/spinners.html\">\n                    Spinners\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tables.html\">\n                    Tables\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/components/tooltips.html\">\n                    Tooltips\n                  </a>\n                </li>\n              </ul>\n            </div>\n            <div class=\"ct-docs-toc-item-active\">\n              <a class=\"ct-docs-toc-link\" href=\"javascript:void(0)\">\n                <div class=\"d-inline-block\">\n                  <div class=\"icon icon-xs border-radius-md bg-gradient-primary text-center mr-2 d-flex align-items-center justify-content-center me-1\">\n                    <i class=\"ni ni-settings text-white\"></i>\n                  </div>\n                </div>\n                Plugins\n              </a>\n              <ul class=\"ct-docs-nav-sidenav ms-4 ps-1\">\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/countUpJs.html\">\n                    CountUp JS\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/charts.html\">\n                    Charts\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datepicker.html\">\n                    Datepicker\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/fullcalendar.html\">\n                    Fullcalendar\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sliders.html\">\n                    Sliders\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/choices.html\">\n                    Choices\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/dropzone.html\">\n                    Dropzone\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/datatables.html\">\n                    Datatables\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/kanban.html\">\n                    Kanban\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/photo-swipe.html\">\n                    Photo Swipe\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/quill.html\">\n                    Quill\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"\">\n                  <a href=\"../../documentation/plugins/sweet-alerts.html\">\n                    Sweet Alerts\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n                <li class=\"ct-docs-nav-sidenav-active\">\n                  <a href=\"../../documentation/plugins/wizard.html\">\n                    Wizard\n                    <span class=\"ct-docs-sidenav-pro-badge\">Pro</span>\n                  </a>\n                </li>\n              </ul>\n            </div>\n          </nav>\n        </div>\n        <div class=\"ct-docs-toc-col\">\n          <ul class=\"section-nav\">\n            <li class=\"toc-entry toc-h2\"><a href=\"#usage\">Usage</a></li>\n            <li class=\"toc-entry toc-h2\"><a href=\"#example\">Example</a>\n              <ul>\n                <li class=\"toc-entry toc-h5\"><a href=\"#about-me\">About me</a></li>\n                <li class=\"toc-entry toc-h5\"><a href=\"#address\">Address</a></li>\n                <li class=\"toc-entry toc-h5\"><a href=\"#socials\">Socials</a></li>\n                <li class=\"toc-entry toc-h5\"><a href=\"#profile\">Profile</a></li>\n              </ul>\n            </li>\n          </ul>\n        </div>\n        <main class=\"ct-docs-content-col\" role=\"main\">\n          <div class=\"ct-docs-page-title\">\n            <h1 class=\"ct-docs-page-h1-title\" id=\"content\">\n              Bootstrap Wizard\n            </h1>\n            <span class=\"ct-docs-page-title-pro-line\"> - </span>\n            <div class=\"ct-docs-page-title-pro-bage\">Pro Component</div>\n            <div class=\"avatar-group mt-3\">\n            </div>\n          </div>\n          <p class=\"ct-docs-page-title-lead\">Animated Multi-step Form For Bootstrap</p>\n          <hr class=\"ct-docs-hr\">\n          <h2 id=\"usage\">Usage</h2>\n          <p>In order to use this plugin on your page you will need to include the following script in the “Optional JS” area from the page’s footer:</p>\n          <div class=\"position-relative\">\n            <div class=\"bd-clipboard\"><span class=\"btn-clipboard\" title=\"\" data-bs-original-title=\"Copy to clipboard\">Copy</span></div><figure class=\"highlight\"><pre class=\" language-html\"><code class=\" language-html\" data-lang=\"html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation\">=</span><span class=\"token punctuation\">\"</span>../../assets/js/plugins/multistep-form.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">&gt;</span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">&gt;</span></span></code></pre>\n            </figure>\n          </div>\n          <h2 id=\"example\">Example</h2>\n          <p>Simply copy one of the code examples demonstrated below and include it in your page.</p>\n          <div class=\"row mt-5\">\n            <div class=\"col-12 col-lg-10 m-auto\">\n              <div class=\"card border border-2\">\n                <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                  <div class=\"bg-gradient-primary shadow-primary border-radius-lg pt-4 pb-3\">\n                    <div class=\"multisteps-form__progress\">\n                      <button class=\"multisteps-form__progress-btn js-active\" type=\"button\" title=\"User Info\">\n                        <span>User Info</span>\n                      </button>\n                      <button class=\"multisteps-form__progress-btn\" type=\"button\" title=\"Address\">Address</button>\n                      <button class=\"multisteps-form__progress-btn\" type=\"button\" title=\"Socials\">Socials</button>\n                      <button class=\"multisteps-form__progress-btn\" type=\"button\" title=\"Profile\">Profile</button>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"card-body\">\n                  <form class=\"multisteps-form__form\">\n                    <!--single form panel-->\n                    <div class=\"multisteps-form__panel border-radius-xl bg-white js-active\" data-animation=\"FadeIn\">\n                      <h5 class=\"font-weight-bolder mb-0\">About me</h5>\n                      <p class=\"mb-0 text-sm\">Mandatory informations</p>\n                      <div class=\"multisteps-form__content\">\n                        <div class=\"row mt-3\">\n                          <div class=\"col-12 col-sm-6\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">First Name</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                          <div class=\"col-12 col-sm-6 mt-3 mt-sm-0\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Last Name</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"row mt-3\">\n                          <div class=\"col-12 col-sm-6\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Company</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                          <div class=\"col-12 col-sm-6 mt-3 mt-sm-0\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Email Address</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"email\" />\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"row mt-3\">\n                          <div class=\"col-12 col-sm-6\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Password</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"password\" />\n                            </div>\n                          </div>\n                          <div class=\"col-12 col-sm-6 mt-3 mt-sm-0\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Repeat Password</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"password\" />\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"button-row d-flex mt-4\">\n                          <button class=\"btn bg-gradient-dark ms-auto mb-0 js-btn-next\" type=\"button\" title=\"Next\">Next</button>\n                        </div>\n                      </div>\n                    </div>\n                    <!--single form panel-->\n                    <div class=\"multisteps-form__panel border-radius-xl bg-white\" data-animation=\"FadeIn\">\n                      <h5 class=\"font-weight-bold mb-0\">Address</h5>\n                      <p class=\"mb-0 text-sm\">Tell us where are you living</p>\n                      <div class=\"multisteps-form__content\">\n                        <div class=\"row mt-3\">\n                          <div class=\"col\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Address 1</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"row mt-3\">\n                          <div class=\"col\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Address 2</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"row mt-3\">\n                          <div class=\"col-12 col-sm-6\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">City</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                          <div class=\"col-6 col-sm-4 mt-3 mt-sm-0\">\n                            <select class=\"form-control\" name=\"choices-state\" id=\"choices-state\">\n                              <option value=\"Asia\" selected=\"\">Asia</option>\n                              <option value=\"America\">America</option>\n                            </select>\n                          </div>\n                          <div class=\"col-6 col-sm-2 mt-3 mt-sm-0\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Zip</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"button-row d-flex mt-4\">\n                          <button class=\"btn bg-gradient-light mb-0 js-btn-prev\" type=\"button\" title=\"Prev\">Prev</button>\n                          <button class=\"btn bg-gradient-dark ms-auto mb-0 js-btn-next\" type=\"button\" title=\"Next\">Next</button>\n                        </div>\n                      </div>\n                    </div>\n                    <!--single form panel-->\n                    <div class=\"multisteps-form__panel border-radius-xl bg-white\" data-animation=\"FadeIn\">\n                      <h5 class=\"font-weight-bolder mb-0\">Socials</h5>\n                      <p class=\"mb-0 text-sm\">Please provide at least one social link</p>\n                      <div class=\"multisteps-form__content\">\n                        <div class=\"row mt-3\">\n                          <div class=\"col-12\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Twitter Handle</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                          <div class=\"col-12 mt-3\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Facebook Account</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                          <div class=\"col-12 mt-3\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <label class=\"form-label\">Instagram Account</label>\n                              <input class=\"multisteps-form__input form-control\" type=\"text\" />\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"row\">\n                          <div class=\"button-row d-flex mt-4 col-12\">\n                            <button class=\"btn bg-gradient-light mb-0 js-btn-prev\" type=\"button\" title=\"Prev\">Prev</button>\n                            <button class=\"btn bg-gradient-dark ms-auto mb-0 js-btn-next\" type=\"button\" title=\"Next\">Next</button>\n                          </div>\n                        </div>\n                      </div>\n                    </div>\n                    <!--single form panel-->\n                    <div class=\"multisteps-form__panel border-radius-xl bg-white h-100\" data-animation=\"FadeIn\">\n                      <h5 class=\"font-weight-bolder mb-0\">Profile</h5>\n                      <p class=\"mb-0 text-sm\">Optional informations</p>\n                      <div class=\"multisteps-form__content mt-3\">\n                        <div class=\"row\">\n                          <div class=\"col-12 mt-3\">\n                            <div class=\"input-group input-group-dynamic\">\n                              <textarea class=\"multisteps-form__textarea form-control\" rows=\"5\" placeholder=\"Say a few words about who you are or what you're working on.\"></textarea>\n                            </div>\n                          </div>\n                        </div>\n                        <div class=\"button-row d-flex mt-4\">\n                          <button class=\"btn bg-gradient-light mb-0 js-btn-prev\" type=\"button\" title=\"Prev\">Prev</button>\n                          <button class=\"btn bg-gradient-dark ms-auto mb-0\" type=\"button\" title=\"Send\">Send</button>\n                        </div>\n                      </div>\n                    </div>\n                  </form>\n                </div>\n              </div>\n            </div>\n          </div>\n        </main>\n      </div>\n      <div class=\"ct-docs-main-footer-row\">\n        <div class=\"ct-docs-main-footer-blank-col\">\n        </div>\n        <div class=\"ct-docs-main-footer-col\">\n          <footer class=\"ct-docs-footer\">\n            <div class=\"ct-docs-footer-inner-row\">\n              <div class=\"ct-docs-footer-col\">\n                <div class=\"ct-docs-footer-copyright\">\n                  © <script>\n                    document.write(new Date().getFullYear())\n                  </script> <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">Creative Tim</a> & <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-copyright-author\" target=\"_blank\">UPDIVISION</a>\n                </div>\n              </div>\n              <div class=\"ct-docs-footer-col\">\n                <ul class=\"ct-docs-footer-nav-footer\">\n                  <li>\n                    <a href=\"https://creative-tim.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Creative Tim</a>\n                  </li>\n                  <li class=\"nav-item\">\n                    <a href=\"https://www.updivision.com\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">UPDIVISION</a>\n                </li>\n                  <li>\n                    <a href=\"https://www.creative-tim.com/contact-us\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Contact Us</a>\n                  </li>\n                  <li>\n                    <a href=\"https://creative-tim.com/blog\" class=\"ct-docs-footer-nav-link\" target=\"_blank\">Blog</a>\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </footer>\n        </div>\n      </div>\n    </div>\n    <script src=\"../../assets/js/jquery.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/popper.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/core/bootstrap.bundle.min.js\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/prism.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/docs.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/holder.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/moment.min.js\" type=\"text/javascript\"></script>\n    <script src=\"../../assets/js/material-dashboard.min.js\" type=\"text/javascript\"></script>\n    <script>\n      Holder.addTheme('gray', {\n        bg: '#777',\n        fg: 'rgba(255,255,255,.75)',\n        font: 'Helvetica',\n        fontweight: 'normal'\n      })\n    </script>\n    <script>\n      // Facebook Pixel Code Don't Delete\n      ! function(f, b, e, v, n, t, s) {\n        if (f.fbq) return;\n        n = f.fbq = function() {\n          n.callMethod ?\n            n.callMethod.apply(n, arguments) : n.queue.push(arguments)\n        };\n        if (!f._fbq) f._fbq = n;\n        n.push = n;\n        n.loaded = !0;\n        n.version = '2.0';\n        n.queue = [];\n        t = b.createElement(e);\n        t.async = !0;\n        t.src = v;\n        s = b.getElementsByTagName(e)[0];\n        s.parentNode.insertBefore(t, s)\n      }(window,\n        document, 'script', '//connect.facebook.net/en_US/fbevents.js');\n\n      try {\n        fbq('init', '111649226022273');\n        fbq('track', \"PageView\");\n\n      } catch (err) {\n        console.log('Facebook Track Error:', err);\n      }\n    </script>\n    <script src=\"../../assets/js/multistep-form.js\" type=\"text/javascript\"></script>\n\n    <script src=\"../../assets/js/docs.js\"></script>\n  </body>\n  </html>\n"
  },
  {
    "path": "src/material-stubs/resources/views/components/footers/auth.blade.php",
    "content": "<footer class=\"footer py-4  \">\n    <div class=\"container-fluid\">\n        <div class=\"row align-items-center justify-content-lg-between\">\n            <div class=\"col-lg-6 mb-lg-0 mb-4\">\n                <div class=\"copyright text-center text-sm text-muted text-lg-start\">\n                    © <script>\n                        document.write(new Date().getFullYear())\n\n                    </script>,\n                    made with <i class=\"fa fa-heart\"></i> by\n                    <a href=\"https://www.creative-tim.com\" class=\"font-weight-bold\" target=\"_blank\">Creative Tim</a> &\n                    <a href=\"https://www.updivision.com\" class=\"font-weight-bold\" target=\"_blank\"> UPDIVISION</a>\n                    for a better web.\n                </div>\n            </div>\n            <div class=\"col-lg-6\">\n                <ul class=\"nav nav-footer justify-content-center justify-content-lg-end\">\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com\" class=\"nav-link text-muted\" target=\"_blank\">Creative\n                            Tim</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.updivision.com\" class=\"nav-link text-muted\" target=\"_blank\">UPDIVISION</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com/presentation\" class=\"nav-link text-muted\"\n                            target=\"_blank\">About Us</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com/blog\" class=\"nav-link text-muted\" target=\"_blank\">Blog</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com/license\" class=\"nav-link pe-0 text-muted\"\n                            target=\"_blank\">License</a>\n                    </li>\n                </ul>\n            </div>\n        </div>\n    </div>\n</footer>\n"
  },
  {
    "path": "src/material-stubs/resources/views/components/footers/guest.blade.php",
    "content": "<footer class=\"footer position-absolute bottom-footer py-2 w-100 z-index-1\">\n    <div class=\"container\">\n        <div class=\"row align-items-center justify-content-lg-between\">\n            <div class=\"col-12 col-md-6 my-auto\">\n                <div class=\"copyright text-center text-sm text-white text-lg-start\">\n                    © <script>\n                        document.write(new Date().getFullYear())\n\n                    </script>,\n                    made with <i class=\"fa fa-heart\" aria-hidden=\"true\"></i> by\n                    <a href=\"https://www.creative-tim.com\" class=\"font-weight-bold text-white\" target=\"_blank\">Creative\n                        Tim</a> & <a href=\"https://www.updivision.com\" class=\"font-weight-bold text-white\" target=\"_blank\">UPDIVISION</a>\n                    for a better web.\n                </div>\n            </div>\n            <div class=\"col-12 col-md-6\">\n                <ul class=\"nav nav-footer justify-content-center justify-content-lg-end\">\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com\" class=\"nav-link text-white\" target=\"_blank\">Creative\n                            Tim</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.updivision.com\" class=\"nav-link text-white\" target=\"_blank\">UPDIVISION</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com/presentation\" class=\"nav-link text-white\"\n                            target=\"_blank\">About Us</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com/blog\" class=\"nav-link text-white\" target=\"_blank\">Blog</a>\n                    </li>\n                    <li class=\"nav-item\">\n                        <a href=\"https://www.creative-tim.com/license\" class=\"nav-link pe-0 text-white\"\n                            target=\"_blank\">License</a>\n                    </li>\n                </ul>\n            </div>\n        </div>\n    </div>\n</footer>\n"
  },
  {
    "path": "src/material-stubs/resources/views/components/layout.blade.php",
    "content": "<!--\n=========================================================\n* Material Dashboard 2 - v3.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/material-dashboard\n* Copyright 2021 Creative Tim (https://www.creative-tim.com) & UPDIVISION (https://www.updivision.com)\n* Licensed under MIT (https://www.creative-tim.com/license)\n* Coded by www.creative-tim.com & www.updivision.com\n\n=========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n-->\n@props(['bodyClass'])\n<!DOCTYPE html>\n<html lang=\"en\">\n\n<head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"{{ asset('assets') }}/img/apple-icon.png\">\n    <link rel=\"icon\" type=\"image/png\" href=\"{{ asset('assets') }}/img/favicon.png\">\n    <title>\n        Material Dashboard 2 by Creative Tim & UPDIVISION\n    </title>\n    <!--     Fonts and icons     -->\n    <link rel=\"stylesheet\" type=\"text/css\"\n        href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900|Roboto+Slab:400,700\" />\n    <!-- Nucleo Icons -->\n    <link href=\"{{ asset('assets') }}/css/nucleo-icons.css\" rel=\"stylesheet\" />\n    <link href=\"{{ asset('assets') }}/css/nucleo-svg.css\" rel=\"stylesheet\" />\n    <!-- Font Awesome Icons -->\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Material Icons -->\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n    <!-- CSS Files -->\n    <link id=\"pagestyle\" href=\"{{ asset('assets') }}/css/material-dashboard.css?v=3.0.0\" rel=\"stylesheet\" />\n</head>\n<body class=\"{{ $bodyClass }}\">\n\n{{ $slot }}\n\n<script src=\"{{ asset('assets') }}/js/core/popper.min.js\"></script>\n<script src=\"{{ asset('assets') }}/js/core/bootstrap.min.js\"></script>\n<script src=\"{{ asset('assets') }}/js/plugins/perfect-scrollbar.min.js\"></script>\n<script src=\"{{ asset('assets') }}/js/plugins/smooth-scrollbar.min.js\"></script>\n@stack('js')\n<script>\n    var win = navigator.platform.indexOf('Win') > -1;\n    if (win && document.querySelector('#sidenav-scrollbar')) {\n        var options = {\n            damping: '0.5'\n        }\n        Scrollbar.init(document.querySelector('#sidenav-scrollbar'), options);\n    }\n\n</script>\n<!-- Github buttons -->\n<script async defer src=\"https://buttons.github.io/buttons.js\"></script>\n<!-- Control Center for Material Dashboard: parallax effects, scripts for the example pages etc -->\n<script src=\"{{ asset('assets') }}/js/material-dashboard.min.js?v=3.0.0\"></script>\n</body>\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/views/components/navbars/navs/auth.blade.php",
    "content": "@props(['titlePage'])\n\n<nav class=\"navbar navbar-main navbar-expand-lg px-0 mx-4 shadow-none border-radius-xl\" id=\"navbarBlur\"\n    navbar-scroll=\"true\">\n    <div class=\"container-fluid py-1 px-3\">\n        <nav aria-label=\"breadcrumb\">\n            <ol class=\"breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5\">\n                <li class=\"breadcrumb-item text-sm\"><a class=\"opacity-5 text-dark\" href=\"javascript:;\">Pages</a></li>\n                <li class=\"breadcrumb-item text-sm text-dark active\" aria-current=\"page\">{{ $titlePage }}</li>\n            </ol>\n            <h6 class=\"font-weight-bolder mb-0\">{{ $titlePage }}</h6>\n        </nav>\n        <div class=\"collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4\" id=\"navbar\">\n            <div class=\"ms-md-auto pe-md-3 d-flex align-items-center\">\n                <div class=\"input-group input-group-outline\">\n                    <label class=\"form-label\">Type here...</label>\n                    <input type=\"text\" class=\"form-control\">\n                </div>\n            </div>\n            <form method=\"POST\" action=\"{{ route('logout') }}\" class=\"d-none\" id=\"logout-form\">\n                @csrf\n            </form>\n            <ul class=\"navbar-nav  justify-content-end\">\n                <li class=\"nav-item d-flex align-items-center\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body font-weight-bold px-0\">\n                        <i class=\"fa fa-user me-sm-1\"></i>\n                        <span class=\"d-sm-inline d-none\"\n                            onclick=\"event.preventDefault();document.getElementById('logout-form').submit();\">Sign\n                            Out</span>\n                    </a>\n                </li>\n                <li class=\"nav-item d-xl-none ps-3 d-flex align-items-center\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0\" id=\"iconNavbarSidenav\">\n                        <div class=\"sidenav-toggler-inner\">\n                            <i class=\"sidenav-toggler-line\"></i>\n                            <i class=\"sidenav-toggler-line\"></i>\n                            <i class=\"sidenav-toggler-line\"></i>\n                        </div>\n                    </a>\n                </li>\n                <li class=\"nav-item px-3 d-flex align-items-center\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                        <i class=\"fa fa-cog fixed-plugin-button-nav cursor-pointer\"></i>\n                    </a>\n                </li>\n                <li class=\"nav-item dropdown pe-2 d-flex align-items-center\">\n                    <a href=\"javascript:;\" class=\"nav-link text-body p-0\" id=\"dropdownMenuButton\"\n                        data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                        <i class=\"fa fa-bell cursor-pointer\"></i>\n                    </a>\n                    <ul class=\"dropdown-menu  dropdown-menu-end  px-2 py-3 me-sm-n4\"\n                        aria-labelledby=\"dropdownMenuButton\">\n                        <li class=\"mb-2\">\n                            <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                                <div class=\"d-flex py-1\">\n                                    <div class=\"my-auto\">\n                                        <img src=\"{{ asset('assets') }}/img/team-2.jpg\" class=\"avatar avatar-sm  me-3 \">\n                                    </div>\n                                    <div class=\"d-flex flex-column justify-content-center\">\n                                        <h6 class=\"text-sm font-weight-normal mb-1\">\n                                            <span class=\"font-weight-bold\">New message</span> from Laur\n                                        </h6>\n                                        <p class=\"text-xs text-secondary mb-0\">\n                                            <i class=\"fa fa-clock me-1\"></i>\n                                            13 minutes ago\n                                        </p>\n                                    </div>\n                                </div>\n                            </a>\n                        </li>\n                        <li class=\"mb-2\">\n                            <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                                <div class=\"d-flex py-1\">\n                                    <div class=\"my-auto\">\n                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-spotify.svg\"\n                                            class=\"avatar avatar-sm bg-gradient-dark  me-3 \">\n                                    </div>\n                                    <div class=\"d-flex flex-column justify-content-center\">\n                                        <h6 class=\"text-sm font-weight-normal mb-1\">\n                                            <span class=\"font-weight-bold\">New album</span> by Travis Scott\n                                        </h6>\n                                        <p class=\"text-xs text-secondary mb-0\">\n                                            <i class=\"fa fa-clock me-1\"></i>\n                                            1 day\n                                        </p>\n                                    </div>\n                                </div>\n                            </a>\n                        </li>\n                        <li>\n                            <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                                <div class=\"d-flex py-1\">\n                                    <div class=\"avatar avatar-sm bg-gradient-secondary  me-3  my-auto\">\n                                        <svg width=\"12px\" height=\"12px\" viewBox=\"0 0 43 36\" version=\"1.1\"\n                                            xmlns=\"http://www.w3.org/2000/svg\"\n                                            xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                                            <title>credit-card</title>\n                                            <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                                                <g transform=\"translate(-2169.000000, -745.000000)\" fill=\"#FFFFFF\"\n                                                    fill-rule=\"nonzero\">\n                                                    <g transform=\"translate(1716.000000, 291.000000)\">\n                                                        <g transform=\"translate(453.000000, 454.000000)\">\n                                                            <path class=\"color-background\"\n                                                                d=\"M43,10.7482083 L43,3.58333333 C43,1.60354167 41.3964583,0 39.4166667,0 L3.58333333,0 C1.60354167,0 0,1.60354167 0,3.58333333 L0,10.7482083 L43,10.7482083 Z\"\n                                                                opacity=\"0.593633743\"></path>\n                                                            <path class=\"color-background\"\n                                                                d=\"M0,16.125 L0,32.25 C0,34.2297917 1.60354167,35.8333333 3.58333333,35.8333333 L39.4166667,35.8333333 C41.3964583,35.8333333 43,34.2297917 43,32.25 L43,16.125 L0,16.125 Z M19.7083333,26.875 L7.16666667,26.875 L7.16666667,23.2916667 L19.7083333,23.2916667 L19.7083333,26.875 Z M35.8333333,26.875 L28.6666667,26.875 L28.6666667,23.2916667 L35.8333333,23.2916667 L35.8333333,26.875 Z\">\n                                                            </path>\n                                                        </g>\n                                                    </g>\n                                                </g>\n                                            </g>\n                                        </svg>\n                                    </div>\n                                    <div class=\"d-flex flex-column justify-content-center\">\n                                        <h6 class=\"text-sm font-weight-normal mb-1\">\n                                            Payment successfully completed\n                                        </h6>\n                                        <p class=\"text-xs text-secondary mb-0\">\n                                            <i class=\"fa fa-clock me-1\"></i>\n                                            2 days\n                                        </p>\n                                    </div>\n                                </div>\n                            </a>\n                        </li>\n                    </ul>\n                </li>\n            </ul>\n        </div>\n    </div>\n</nav>\n"
  },
  {
    "path": "src/material-stubs/resources/views/components/navbars/navs/guest.blade.php",
    "content": "@props(['signin', 'signup'])\n\n<nav\n    class=\"navbar navbar-expand-lg blur border-radius-lg top-0 z-index-3 shadow position-absolute mt-4 py-2 start-0 end-0 mx-4\">\n    <div class=\"container-fluid ps-2 pe-0\">\n        <a class=\"navbar-brand font-weight-bolder ms-lg-0 ms-3 d-flex flex-column\" href=\"{{ route('dashboard') }}\">\n            Material Dashboard 2\n            <span>Laravel</span>\n        </a>\n        <button class=\"navbar-toggler shadow-none ms-2\" type=\"button\" data-bs-toggle=\"collapse\"\n            data-bs-target=\"#navigation\" aria-controls=\"navigation\" aria-expanded=\"false\"\n            aria-label=\"Toggle navigation\">\n            <span class=\"navbar-toggler-icon mt-2\">\n                <span class=\"navbar-toggler-bar bar1\"></span>\n                <span class=\"navbar-toggler-bar bar2\"></span>\n                <span class=\"navbar-toggler-bar bar3\"></span>\n            </span>\n        </button>\n        <div class=\"collapse navbar-collapse\" id=\"navigation\">\n            <ul class=\"navbar-nav mx-auto\">\n                @auth\n                <li class=\"nav-item\">\n                    <a class=\"nav-link d-flex align-items-center me-2 active\" aria-current=\"page\"\n                        href=\"{{ route('dashboard') }}\">\n                        <i class=\"fa fa-chart-pie opacity-6 text-dark me-1\"></i>\n                        Dashboard\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link me-2\" href=\"{{ route('profile') }}\">\n                        <i class=\"fa fa-user opacity-6 text-dark me-1\"></i>\n                        Profile\n                    </a>\n                </li>\n                @endauth\n                <li class=\"nav-item\">\n                    <a class=\"nav-link me-2\" href=\"{{ route($signup) }}\">\n                        <i class=\"fas fa-user-circle opacity-6 text-dark me-1\"></i>\n                        Sign Up\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link me-2\" href=\"{{ route($signin) }}\">\n                        <i class=\"fas fa-key opacity-6 text-dark me-1\"></i>\n                        Sign In\n                    </a>\n                </li>\n            </ul>\n            <ul class=\"navbar-nav d-lg-block d-none\">\n                <li class=\"nav-item\">\n                    <a href=\"https://www.creative-tim.com/product/material-dashboard-laravel\"\n                        class=\"btn btn-sm mb-0 me-1 bg-gradient-dark\" target=\"_blank\">Free download</a>\n                </li>\n            </ul>\n        </div>\n    </div>\n</nav>\n"
  },
  {
    "path": "src/material-stubs/resources/views/components/navbars/sidebar.blade.php",
    "content": "@props(['activePage'])\n\n<aside\n    class=\"sidenav navbar navbar-vertical navbar-expand-xs border-0 border-radius-xl my-3 fixed-start ms-3   bg-gradient-dark\"\n    id=\"sidenav-main\">\n    <div class=\"sidenav-header\">\n        <i class=\"fas fa-times p-3 cursor-pointer text-white opacity-5 position-absolute end-0 top-0 d-none d-xl-none\"\n            aria-hidden=\"true\" id=\"iconSidenav\"></i>\n        <a class=\"navbar-brand m-0 d-flex text-wrap align-items-center\" href=\" {{ route('dashboard') }} \">\n            <img src=\"{{ asset('assets') }}/img/logo-ct.png\" class=\"navbar-brand-img h-100\" alt=\"main_logo\">\n            <span class=\"ms-2 font-weight-bold text-white\">Material Dashboard 2 Laravel</span>\n        </a>\n    </div>\n    <hr class=\"horizontal light mt-0 mb-2\">\n    <div class=\"collapse navbar-collapse  w-auto  max-height-vh-100\" id=\"sidenav-collapse-main\">\n        <ul class=\"navbar-nav\">\n            <li class=\"nav-item mt-3\">\n                <h6 class=\"ps-4 ms-2 text-uppercase text-xs text-white font-weight-bolder opacity-8\">Laravel examples</h6>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'user-profile' ? 'active bg-gradient-primary' : '' }} \"\n                    href=\"{{ route('user-profile') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i style=\"font-size: 1.2rem;\" class=\"fas fa-user-circle ps-2 pe-2 text-center\"></i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">User Profile</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'user-management' ? ' active bg-gradient-primary' : '' }} \"\n                    href=\"{{ route('user-management') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i style=\"font-size: 1rem;\" class=\"fas fa-lg fa-list-ul ps-2 pe-2 text-center\"></i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">User Management</span>\n                </a>\n            </li>\n            <li class=\"nav-item mt-3\">\n                <h6 class=\"ps-4 ms-2 text-uppercase text-xs text-white font-weight-bolder opacity-8\">Pages</h6>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'dashboard' ? ' active bg-gradient-primary' : '' }} \"\n                    href=\"{{ route('dashboard') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">dashboard</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Dashboard</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'tables' ? ' active bg-gradient-primary' : '' }} \"\n                    href=\"{{ route('tables') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">table_view</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Tables</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'billing' ? ' active bg-gradient-primary' : '' }}  \"\n                    href=\"{{ route('billing') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">receipt_long</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Billing</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'virtual-reality' ? ' active bg-gradient-primary' : '' }}  \"\n                    href=\"{{ route('virtual-reality') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">view_in_ar</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Virtual Reality</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'rtl' ? ' active bg-gradient-primary' : '' }}  \"\n                    href=\"{{ route('rtl') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">format_textdirection_r_to_l</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">RTL</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'notifications' ? ' active bg-gradient-primary' : '' }}  \"\n                    href=\"{{ route('notifications') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">notifications</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Notifications</span>\n                </a>\n            </li>\n            <li class=\"nav-item mt-3\">\n                <h6 class=\"ps-4 ms-2 text-uppercase text-xs text-white font-weight-bolder opacity-8\">Account pages</h6>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white {{ $activePage == 'profile' ? ' active bg-gradient-primary' : '' }}  \"\n                    href=\"{{ route('profile') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">person</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Profile</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white \" href=\"{{ route('static-sign-in') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">login</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Sign In</span>\n                </a>\n            </li>\n            <li class=\"nav-item\">\n                <a class=\"nav-link text-white \" href=\"{{ route('static-sign-up') }}\">\n                    <div class=\"text-white text-center me-2 d-flex align-items-center justify-content-center\">\n                        <i class=\"material-icons opacity-10\">assignment</i>\n                    </div>\n                    <span class=\"nav-link-text ms-1\">Sign Up</span>\n                </a>\n            </li>\n        </ul>\n    </div>\n    <div class=\"sidenav-footer position-absolute w-100 bottom-0 \">\n        <div class=\"mx-3\">\n            <a class=\"btn bg-gradient-primary w-100\" href=\"https://www.creative-tim.com/product/material-dashboard-laravel\" target=\"_blank\">Free Download</a>\n        </div>\n        <div class=\"mx-3\">\n            <a class=\"btn bg-gradient-primary w-100\" href=\"../../documentation/getting-started/installation.html\" target=\"_blank\">View documentation</a>\n        </div>\n        <div class=\"mx-3\">\n            <a class=\"btn bg-gradient-primary w-100\"\n                href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\" target=\"_blank\" type=\"button\">Upgrade\n                to pro</a>\n        </div>\n    </div>\n</aside>\n"
  },
  {
    "path": "src/material-stubs/resources/views/components/plugins.blade.php",
    "content": "<div class=\"fixed-plugin\">\n    <a class=\"fixed-plugin-button text-dark position-fixed px-3 py-2\">\n        <i class=\"material-icons py-2\">settings</i>\n    </a>\n    <div class=\"card shadow-lg\">\n        <div class=\"card-header pb-0 pt-3\">\n            <div class=\"float-start\">\n                <h5 class=\"mt-3 mb-0\">Material UI Configurator</h5>\n                <p>See our dashboard options.</p>\n            </div>\n            <div class=\"float-end mt-4\">\n                <button class=\"btn btn-link text-dark p-0 fixed-plugin-close-button\">\n                    <i class=\"material-icons\">clear</i>\n                </button>\n            </div>\n            <!-- End Toggle Button -->\n        </div>\n        <hr class=\"horizontal dark my-1\">\n        <div class=\"card-body pt-sm-3 pt-0\">\n            <!-- Sidebar Backgrounds -->\n            <div>\n                <h6 class=\"mb-0\">Sidebar Colors</h6>\n            </div>\n            <a href=\"javascript:void(0)\" class=\"switch-trigger background-color\">\n                <div class=\"badge-colors my-2 text-start\">\n                    <span class=\"badge filter bg-gradient-primary active\" data-color=\"primary\"\n                        onclick=\"sidebarColor(this)\"></span>\n                    <span class=\"badge filter bg-gradient-dark\" data-color=\"dark\" onclick=\"sidebarColor(this)\"></span>\n                    <span class=\"badge filter bg-gradient-info\" data-color=\"info\" onclick=\"sidebarColor(this)\"></span>\n                    <span class=\"badge filter bg-gradient-success\" data-color=\"success\"\n                        onclick=\"sidebarColor(this)\"></span>\n                    <span class=\"badge filter bg-gradient-warning\" data-color=\"warning\"\n                        onclick=\"sidebarColor(this)\"></span>\n                    <span class=\"badge filter bg-gradient-danger\" data-color=\"danger\"\n                        onclick=\"sidebarColor(this)\"></span>\n                </div>\n            </a>\n            <!-- Sidenav Type -->\n            <div class=\"mt-3\">\n                <h6 class=\"mb-0\">Sidenav Type</h6>\n                <p class=\"text-sm\">Choose between 2 different sidenav types.</p>\n            </div>\n            <div class=\"d-flex\">\n                <button class=\"btn bg-gradient-dark px-3 mb-2 active\" data-class=\"bg-gradient-dark\"\n                    onclick=\"sidebarType(this)\">Dark</button>\n                <button class=\"btn bg-gradient-dark px-3 mb-2 ms-2\" data-class=\"bg-transparent\"\n                    onclick=\"sidebarType(this)\">Transparent</button>\n                <button class=\"btn bg-gradient-dark px-3 mb-2 ms-2\" data-class=\"bg-white\"\n                    onclick=\"sidebarType(this)\">White</button>\n            </div>\n            <p class=\"text-sm d-xl-none d-block mt-2\">You can change the sidenav type just on desktop view.</p>\n            <!-- Navbar Fixed -->\n            <div class=\"mt-3 d-flex\">\n                <h6 class=\"mb-0\">Navbar Fixed</h6>\n                <div class=\"form-check form-switch ps-0 ms-auto my-auto\">\n                    <input class=\"form-check-input mt-1 ms-auto\" type=\"checkbox\" id=\"navbarFixed\"\n                        onclick=\"navbarFixed(this)\">\n                </div>\n            </div>\n            <hr class=\"horizontal dark my-3\">\n            <div class=\"mt-2 d-flex\">\n                <h6 class=\"mb-0\">Light / Dark</h6>\n                <div class=\"form-check form-switch ps-0 ms-auto my-auto\">\n                    <input class=\"form-check-input mt-1 ms-auto\" type=\"checkbox\" id=\"dark-version\"\n                        onclick=\"darkMode(this)\">\n                </div>\n            </div>\n            <hr class=\"horizontal dark my-sm-4\">\n            <a class=\"btn btn-outline-dark w-100\" href=\"../../documentation/getting-started/installation.html\">View documentation</a>\n            <div class=\"w-100 text-center\">\n                <a class=\"github-button\" href=\"https://github.com/creativetimofficial/material-dashboard-laravel\"\n                    data-icon=\"octicon-star\" data-size=\"large\" data-show-count=\"true\"\n                    aria-label=\"Star creativetimofficial/material-dashboard on GitHub\">Star</a>\n                <h6 class=\"mt-3\">Thank you for sharing!</h6>\n                <a href=\"https://twitter.com/intent/tweet?text=Check%20Material%20Dashboard%202%20Laravel%20made%20by%20%40CreativeTim%20%26%20%40UPDIVISION%20%23webdesign%20%23dashboard%20%23bootstrap5%20%23laravel&amp;url=https%3A%2F%2Fwww.creative-tim.com%2Fproduct%2Fmaterial-dashboard-laravel\"\n                    class=\"btn btn-dark mb-0 me-2\" target=\"_blank\">\n                    <i class=\"fab fa-twitter me-1\" aria-hidden=\"true\"></i> Tweet\n                </a>\n                <a href=\"https://www.facebook.com/sharer/sharer.php?u=https://www.creative-tim.com/product/material-dashboard-laravel\"\n                    class=\"btn btn-dark mb-0 me-2\" target=\"_blank\">\n                    <i class=\"fab fa-facebook-square me-1\" aria-hidden=\"true\"></i> Share\n                </a>\n            </div>\n        </div>\n    </div>\n</div>\n"
  },
  {
    "path": "src/material-stubs/resources/views/dashboard/index.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show  bg-gray-200\">\n    <x-navbars.sidebar activePage='dashboard'></x-navbars.sidebar>\n    <main class=\"main-content position-relative max-height-vh-100 h-100 border-radius-lg \">\n        <!-- Navbar -->\n        <x-navbars.navs.auth titlePage=\"Dashboard\"></x-navbars.navs.auth>\n        <!-- End Navbar -->\n        <div class=\"container-fluid py-4\">\n            <div class=\"row\">\n                <div class=\"col-xl-3 col-sm-6 mb-xl-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-dark shadow-dark text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">weekend</i>\n                            </div>\n                            <div class=\"text-end pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">Today's Money</p>\n                                <h4 class=\"mb-0\">$53k</h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0\"><span class=\"text-success text-sm font-weight-bolder\">+55% </span>than\n                                lask week</p>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-xl-3 col-sm-6 mb-xl-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-primary shadow-primary text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">person</i>\n                            </div>\n                            <div class=\"text-end pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">Today's Users</p>\n                                <h4 class=\"mb-0\">2,300</h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0\"><span class=\"text-success text-sm font-weight-bolder\">+3% </span>than\n                                lask month</p>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-xl-3 col-sm-6 mb-xl-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-success shadow-success text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">person</i>\n                            </div>\n                            <div class=\"text-end pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">New Clients</p>\n                                <h4 class=\"mb-0\">3,462</h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0\"><span class=\"text-danger text-sm font-weight-bolder\">-2%</span> than\n                                yesterday</p>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-xl-3 col-sm-6\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-info shadow-info text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">weekend</i>\n                            </div>\n                            <div class=\"text-end pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">Sales</p>\n                                <h4 class=\"mb-0\">$103,430</h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0\"><span class=\"text-success text-sm font-weight-bolder\">+5% </span>than\n                                yesterday</p>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row mt-4\">\n                <div class=\"col-lg-4 col-md-6 mt-4 mb-4\">\n                    <div class=\"card z-index-2 \">\n                        <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent\">\n                            <div class=\"bg-gradient-primary shadow-primary border-radius-lg py-3 pe-1\">\n                                <div class=\"chart\">\n                                    <canvas id=\"chart-bars\" class=\"chart-canvas\" height=\"170\"></canvas>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body\">\n                            <h6 class=\"mb-0 \">Website Views</h6>\n                            <p class=\"text-sm \">Last Campaign Performance</p>\n                            <hr class=\"dark horizontal\">\n                            <div class=\"d-flex \">\n                                <i class=\"material-icons text-sm my-auto me-1\">schedule</i>\n                                <p class=\"mb-0 text-sm\"> campaign sent 2 days ago </p>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-4 col-md-6 mt-4 mb-4\">\n                    <div class=\"card z-index-2  \">\n                        <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent\">\n                            <div class=\"bg-gradient-success shadow-success border-radius-lg py-3 pe-1\">\n                                <div class=\"chart\">\n                                    <canvas id=\"chart-line\" class=\"chart-canvas\" height=\"170\"></canvas>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body\">\n                            <h6 class=\"mb-0 \"> Daily Sales </h6>\n                            <p class=\"text-sm \"> (<span class=\"font-weight-bolder\">+15%</span>) increase in today\n                                sales. </p>\n                            <hr class=\"dark horizontal\">\n                            <div class=\"d-flex \">\n                                <i class=\"material-icons text-sm my-auto me-1\">schedule</i>\n                                <p class=\"mb-0 text-sm\"> updated 4 min ago </p>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-4 mt-4 mb-3\">\n                    <div class=\"card z-index-2 \">\n                        <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent\">\n                            <div class=\"bg-gradient-dark shadow-dark border-radius-lg py-3 pe-1\">\n                                <div class=\"chart\">\n                                    <canvas id=\"chart-line-tasks\" class=\"chart-canvas\" height=\"170\"></canvas>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body\">\n                            <h6 class=\"mb-0 \">Completed Tasks</h6>\n                            <p class=\"text-sm \">Last Campaign Performance</p>\n                            <hr class=\"dark horizontal\">\n                            <div class=\"d-flex \">\n                                <i class=\"material-icons text-sm my-auto me-1\">schedule</i>\n                                <p class=\"mb-0 text-sm\">just updated</p>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row mb-4\">\n                <div class=\"col-lg-8 col-md-6 mb-md-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header pb-0\">\n                            <div class=\"row\">\n                                <div class=\"col-lg-6 col-7\">\n                                    <h6>Projects</h6>\n                                    <p class=\"text-sm mb-0\">\n                                        <i class=\"fa fa-check text-info\" aria-hidden=\"true\"></i>\n                                        <span class=\"font-weight-bold ms-1\">30 done</span> this month\n                                    </p>\n                                </div>\n                                <div class=\"col-lg-6 col-5 my-auto text-end\">\n                                    <div class=\"dropdown float-lg-end pe-4\">\n                                        <a class=\"cursor-pointer\" id=\"dropdownTable\" data-bs-toggle=\"dropdown\"\n                                            aria-expanded=\"false\">\n                                            <i class=\"fa fa-ellipsis-v text-secondary\"></i>\n                                        </a>\n                                        <ul class=\"dropdown-menu px-2 py-3 ms-sm-n4 ms-n5\"\n                                            aria-labelledby=\"dropdownTable\">\n                                            <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">Action</a>\n                                            </li>\n                                            <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">Another\n                                                    action</a></li>\n                                            <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">Something\n                                                    else here</a></li>\n                                        </ul>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body px-0 pb-2\">\n                            <div class=\"table-responsive\">\n                                <table class=\"table align-items-center mb-0\">\n                                    <thead>\n                                        <tr>\n                                            <th\n                                                class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                Companies</th>\n                                            <th\n                                                class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">\n                                                Members</th>\n                                            <th\n                                                class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                Budget</th>\n                                            <th\n                                                class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                Completion</th>\n                                        </tr>\n                                    </thead>\n                                    <tbody>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-xd.svg\"\n                                                            class=\"avatar avatar-sm me-3\" alt=\"xd\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">Material XD Version</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-1.jpg\" alt=\"team1\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-2.jpg\" alt=\"team2\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Alexander Smith\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-3.jpg\" alt=\"team3\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\" alt=\"team4\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $14,000 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">60%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-60\"\n                                                            role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-atlassian.svg\"\n                                                            class=\"avatar avatar-sm me-3\" alt=\"atlassian\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">Add Progress Track</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-2.jpg\" alt=\"team5\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\" alt=\"team6\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $3,000 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">10%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-10\"\n                                                            role=\"progressbar\" aria-valuenow=\"10\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-slack.svg\"\n                                                            class=\"avatar avatar-sm me-3\" alt=\"team7\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">Fix Platform Errors</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-3.jpg\" alt=\"team8\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-1.jpg\" alt=\"team9\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> Not set </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">100%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-success w-100\"\n                                                            role=\"progressbar\" aria-valuenow=\"100\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-spotify.svg\"\n                                                            class=\"avatar avatar-sm me-3\" alt=\"spotify\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">Launch our Mobile App</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\" alt=\"user1\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-3.jpg\" alt=\"user2\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Alexander Smith\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\" alt=\"user3\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-1.jpg\" alt=\"user4\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $20,500 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">100%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-success w-100\"\n                                                            role=\"progressbar\" aria-valuenow=\"100\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-jira.svg\"\n                                                            class=\"avatar avatar-sm me-3\" alt=\"jira\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">Add the New Pricing Page</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\" alt=\"user5\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $500 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">25%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-25\"\n                                                            role=\"progressbar\" aria-valuenow=\"25\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"25\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-invision.svg\"\n                                                            class=\"avatar avatar-sm me-3\" alt=\"invision\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">Redesign New Online Shop</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-1.jpg\" alt=\"user6\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\" alt=\"user7\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $2,000 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">40%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-40\"\n                                                            role=\"progressbar\" aria-valuenow=\"40\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"40\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                    </tbody>\n                                </table>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-4 col-md-6\">\n                    <div class=\"card h-100\">\n                        <div class=\"card-header pb-0\">\n                            <h6>Orders overview</h6>\n                            <p class=\"text-sm\">\n                                <i class=\"fa fa-arrow-up text-success\" aria-hidden=\"true\"></i>\n                                <span class=\"font-weight-bold\">24%</span> this month\n                            </p>\n                        </div>\n                        <div class=\"card-body p-3\">\n                            <div class=\"timeline timeline-one-side\">\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-success text-gradient\">notifications</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">$2400, Design changes\n                                        </h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">22 DEC 7:20 PM\n                                        </p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-danger text-gradient\">code</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">New order #1832412</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">21 DEC 11 PM\n                                        </p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-info text-gradient\">shopping_cart</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">Server payments for\n                                            April</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">21 DEC 9:34 PM\n                                        </p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-warning text-gradient\">credit_card</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">New card added for order\n                                            #4395133</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">20 DEC 2:20 AM\n                                        </p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-primary text-gradient\">key</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">Unlock packages for\n                                            development</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">18 DEC 4:54 AM\n                                        </p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-dark text-gradient\">payments</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">New order #9583120</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">17 DEC</p>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <x-footers.auth></x-footers.auth>\n        </div>\n    </main>\n    <x-plugins></x-plugins>\n    </div>\n    @push('js')\n    <script src=\"{{ asset('assets') }}/js/plugins/chartjs.min.js\"></script>\n    <script>\n        var ctx = document.getElementById(\"chart-bars\").getContext(\"2d\");\n\n        new Chart(ctx, {\n            type: \"bar\",\n            data: {\n                labels: [\"M\", \"T\", \"W\", \"T\", \"F\", \"S\", \"S\"],\n                datasets: [{\n                    label: \"Sales\",\n                    tension: 0.4,\n                    borderWidth: 0,\n                    borderRadius: 4,\n                    borderSkipped: false,\n                    backgroundColor: \"rgba(255, 255, 255, .8)\",\n                    data: [50, 20, 10, 22, 50, 10, 40],\n                    maxBarThickness: 6\n                }, ],\n            },\n            options: {\n                responsive: true,\n                maintainAspectRatio: false,\n                plugins: {\n                    legend: {\n                        display: false,\n                    }\n                },\n                interaction: {\n                    intersect: false,\n                    mode: 'index',\n                },\n                scales: {\n                    y: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            suggestedMin: 0,\n                            suggestedMax: 500,\n                            beginAtZero: true,\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                            color: \"#fff\"\n                        },\n                    },\n                    x: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                },\n            },\n        });\n\n\n        var ctx2 = document.getElementById(\"chart-line\").getContext(\"2d\");\n\n        new Chart(ctx2, {\n            type: \"line\",\n            data: {\n                labels: [\"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"],\n                datasets: [{\n                    label: \"Mobile apps\",\n                    tension: 0,\n                    borderWidth: 0,\n                    pointRadius: 5,\n                    pointBackgroundColor: \"rgba(255, 255, 255, .8)\",\n                    pointBorderColor: \"transparent\",\n                    borderColor: \"rgba(255, 255, 255, .8)\",\n                    borderColor: \"rgba(255, 255, 255, .8)\",\n                    borderWidth: 4,\n                    backgroundColor: \"transparent\",\n                    fill: true,\n                    data: [50, 40, 300, 320, 500, 350, 200, 230, 500],\n                    maxBarThickness: 6\n\n                }],\n            },\n            options: {\n                responsive: true,\n                maintainAspectRatio: false,\n                plugins: {\n                    legend: {\n                        display: false,\n                    }\n                },\n                interaction: {\n                    intersect: false,\n                    mode: 'index',\n                },\n                scales: {\n                    y: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                    x: {\n                        grid: {\n                            drawBorder: false,\n                            display: false,\n                            drawOnChartArea: false,\n                            drawTicks: false,\n                            borderDash: [5, 5]\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                },\n            },\n        });\n\n        var ctx3 = document.getElementById(\"chart-line-tasks\").getContext(\"2d\");\n\n        new Chart(ctx3, {\n            type: \"line\",\n            data: {\n                labels: [\"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"],\n                datasets: [{\n                    label: \"Mobile apps\",\n                    tension: 0,\n                    borderWidth: 0,\n                    pointRadius: 5,\n                    pointBackgroundColor: \"rgba(255, 255, 255, .8)\",\n                    pointBorderColor: \"transparent\",\n                    borderColor: \"rgba(255, 255, 255, .8)\",\n                    borderWidth: 4,\n                    backgroundColor: \"transparent\",\n                    fill: true,\n                    data: [50, 40, 300, 220, 500, 250, 400, 230, 500],\n                    maxBarThickness: 6\n\n                }],\n            },\n            options: {\n                responsive: true,\n                maintainAspectRatio: false,\n                plugins: {\n                    legend: {\n                        display: false,\n                    }\n                },\n                interaction: {\n                    intersect: false,\n                    mode: 'index',\n                },\n                scales: {\n                    y: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            display: true,\n                            padding: 10,\n                            color: '#f8f9fa',\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                    x: {\n                        grid: {\n                            drawBorder: false,\n                            display: false,\n                            drawOnChartArea: false,\n                            drawTicks: false,\n                            borderDash: [5, 5]\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                },\n            },\n        });\n\n    </script>\n    @endpush\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/errors/401.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n  <div class=\"container position-sticky z-index-sticky top-0\">\n      <div class=\"row\">\n          <div class=\"col-12\">\n              <!-- Navbar -->\n              <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n              <!-- End Navbar -->\n          </div>\n      </div>\n  </div>\n  <div class=\"page-header justify-content-center min-vh-100\"\n      style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n      <span class=\"mask bg-gradient-dark opacity-6\"></span>\n      <div class=\"container text-center\">\n          <div class=\"row\">\n              <div class=\"col-md-12\">\n                <h1 class=\"title text-light\">401</h1>\n                <h2 class=\"text-light\">Page not found </h2>\n                <h4 class=\"text-light\">Ooooups! Looks like you got lost.</h4>\n              </div>\n            </div>\n      </div>\n  </div>\n      <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/errors/403.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n  <div class=\"container position-sticky z-index-sticky top-0\">\n      <div class=\"row\">\n          <div class=\"col-12\">\n              <!-- Navbar -->\n              <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n              <!-- End Navbar -->\n          </div>\n      </div>\n  </div>\n  <div class=\"page-header justify-content-center min-vh-100\"\n      style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n      <span class=\"mask bg-gradient-dark opacity-6\"></span>\n      <div class=\"container text-center\">\n          <div class=\"row\">\n              <div class=\"col-md-12\">\n                <h1 class=\"title text-light\">403</h1>\n                <h2 class=\"text-light\">Forbidden </h2>\n                <h4 class=\"text-light\">Ooooups! Looks like you got lost.</h4>\n              </div>\n            </div>\n      </div>\n  </div>\n      <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/errors/404.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n  <div class=\"container position-sticky z-index-sticky top-0\">\n      <div class=\"row\">\n          <div class=\"col-12\">\n              <!-- Navbar -->\n              <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n              <!-- End Navbar -->\n          </div>\n      </div>\n  </div>\n  <div class=\"page-header justify-content-center min-vh-100\"\n      style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n      <span class=\"mask bg-gradient-dark opacity-6\"></span>\n      <div class=\"container text-center\">\n          <div class=\"row\">\n              <div class=\"col-md-12\">\n                <h1 class=\"title text-light\">404</h1>\n                <h2 class=\"text-light\">Page not found </h2>\n                <h4 class=\"text-light\">Ooooups! Looks like you got lost.</h4>\n              </div>\n            </div>\n      </div>\n  </div>\n      <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/errors/405.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n    <div class=\"container position-sticky z-index-sticky top-0\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <!-- Navbar -->\n                <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n                <!-- End Navbar -->\n            </div>\n        </div>\n    </div>\n    <div class=\"page-header justify-content-center min-vh-100\"\n        style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n        <span class=\"mask bg-gradient-dark opacity-6\"></span>\n        <div class=\"container text-center\">\n            <div class=\"row\">\n                <div class=\"col-md-12\">\n                  <h1 class=\"title text-light\">405</h1>\n                  <h2 class=\"text-light\">Method Not Allowed </h2>\n                  <h4 class=\"text-light\">Ooooups! Looks like you got lost.</h4>\n                </div>\n              </div>\n        </div>\n    </div>\n        <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/errors/419.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n  <div class=\"container position-sticky z-index-sticky top-0\">\n      <div class=\"row\">\n          <div class=\"col-12\">\n              <!-- Navbar -->\n              <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n              <!-- End Navbar -->\n          </div>\n      </div>\n  </div>\n  <div class=\"page-header justify-content-center min-vh-100\"\n      style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n      <span class=\"mask bg-gradient-dark opacity-6\"></span>\n      <div class=\"container text-center\">\n          <div class=\"row\">\n              <div class=\"col-md-12\">\n                <h1 class=\"title text-light\">419</h1>\n                <h2 class=\"text-light\">Page expired</h2>\n                <h4 class=\"text-light\">Ooooups! Looks like your token has expired</h4>\n              </div>\n            </div>\n      </div>\n  </div>\n      <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/errors/429.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n  <div class=\"container position-sticky z-index-sticky top-0\">\n      <div class=\"row\">\n          <div class=\"col-12\">\n              <!-- Navbar -->\n              <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n              <!-- End Navbar -->\n          </div>\n      </div>\n  </div>\n  <div class=\"page-header justify-content-center min-vh-100\"\n      style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n      <span class=\"mask bg-gradient-dark opacity-6\"></span>\n      <div class=\"container text-center\">\n          <div class=\"row\">\n              <div class=\"col-md-12\">\n                <h1 class=\"title text-light\">429</h1>\n                <h2 class=\"text-light\">Too Many Requests </h2>\n                <h4 class=\"text-light\">Ooooups! Looks like your did too many requests</h4>\n              </div>\n            </div>\n      </div>\n  </div>\n      <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/errors/500.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n  <div class=\"container position-sticky z-index-sticky top-0\">\n      <div class=\"row\">\n          <div class=\"col-12\">\n              <!-- Navbar -->\n              <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n              <!-- End Navbar -->\n          </div>\n      </div>\n  </div>\n  <div class=\"page-header justify-content-center min-vh-100\"\n      style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n      <span class=\"mask bg-gradient-dark opacity-6\"></span>\n      <div class=\"container text-center\">\n          <div class=\"row\">\n              <div class=\"col-md-12\">\n                <h1 class=\"title text-light\">500</h1>\n                <h2 class=\"text-light\">Server Error </h2>\n                <h4 class=\"text-light\">Ooooups! Looks like something went wrong</h4>\n              </div>\n            </div>\n      </div>\n  </div>\n      <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/errors/503.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n  <div class=\"container position-sticky z-index-sticky top-0\">\n      <div class=\"row\">\n          <div class=\"col-12\">\n              <!-- Navbar -->\n              <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n              <!-- End Navbar -->\n          </div>\n      </div>\n  </div>\n  <div class=\"page-header justify-content-center min-vh-100\"\n      style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n      <span class=\"mask bg-gradient-dark opacity-6\"></span>\n      <div class=\"container text-center\">\n          <div class=\"row\">\n              <div class=\"col-md-12\">\n                <h1 class=\"title text-light\">Service Unavailable</h1>\n                <h2 class=\"text-light\">Server Error </h2>\n                <h4 class=\"text-light\">Ooooups! Looks like the service is unavailable</h4>\n              </div>\n            </div>\n      </div>\n  </div>\n      <x-footers.guest></x-footers.guest>\n</x-layout>"
  },
  {
    "path": "src/material-stubs/resources/views/pages/billing.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show  bg-gray-200\">\n\n    <x-navbars.sidebar activePage=\"billing\"></x-navbars.sidebar>\n    <main class=\"main-content position-relative max-height-vh-100 h-100 border-radius-lg \">\n        <!-- Navbar -->\n        <x-navbars.navs.auth titlePage=\"Billing\"></x-navbars.navs.auth>\n        <!-- End Navbar -->\n        <div class=\"container-fluid py-4\">\n            <div class=\"row\">\n                <div class=\"col-lg-8\">\n                    <div class=\"row\">\n                        <div class=\"col-xl-6 mb-xl-0 mb-4\">\n                            <div class=\"card bg-transparent shadow-xl\">\n                                <div class=\"overflow-hidden position-relative border-radius-xl\">\n                                    <img src=\"{{ asset('assets') }}/img/illustrations/pattern-tree.svg\"\n                                        class=\"position-absolute opacity-2 start-0 top-0 w-100 z-index-1 h-100\"\n                                        alt=\"pattern-tree\">\n                                    <span class=\"mask bg-gradient-dark opacity-10\"></span>\n                                    <div class=\"card-body position-relative z-index-1 p-3\">\n                                        <i class=\"material-icons text-white p-2\">wifi</i>\n                                        <h5 class=\"text-white mt-4 mb-5 pb-2\">\n                                            4562&nbsp;&nbsp;&nbsp;1122&nbsp;&nbsp;&nbsp;4594&nbsp;&nbsp;&nbsp;7852\n                                        </h5>\n                                        <div class=\"d-flex\">\n                                            <div class=\"d-flex\">\n                                                <div class=\"me-4\">\n                                                    <p class=\"text-white text-sm opacity-8 mb-0\">Card Holder</p>\n                                                    <h6 class=\"text-white mb-0\">Jack Peterson</h6>\n                                                </div>\n                                                <div>\n                                                    <p class=\"text-white text-sm opacity-8 mb-0\">Expires</p>\n                                                    <h6 class=\"text-white mb-0\">11/22</h6>\n                                                </div>\n                                            </div>\n                                            <div class=\"ms-auto w-20 d-flex align-items-end justify-content-end\">\n                                                <img class=\"w-60 mt-2\"\n                                                    src=\"{{ asset('assets') }}/img/logos/mastercard.png\" alt=\"logo\">\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"col-xl-6\">\n                            <div class=\"row\">\n                                <div class=\"col-md-6 col-6\">\n                                    <div class=\"card\">\n                                        <div class=\"card-header mx-4 p-3 text-center\">\n                                            <div\n                                                class=\"icon icon-shape icon-lg bg-gradient-primary shadow text-center border-radius-lg\">\n                                                <i class=\"material-icons opacity-10\">account_balance</i>\n                                            </div>\n                                        </div>\n                                        <div class=\"card-body pt-0 p-3 text-center\">\n                                            <h6 class=\"text-center mb-0\">Salary</h6>\n                                            <span class=\"text-xs\">Belong Interactive</span>\n                                            <hr class=\"horizontal dark my-3\">\n                                            <h5 class=\"mb-0\">+$2000</h5>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"col-md-6 col-6\">\n                                    <div class=\"card\">\n                                        <div class=\"card-header mx-4 p-3 text-center\">\n                                            <div\n                                                class=\"icon icon-shape icon-lg bg-gradient-primary shadow text-center border-radius-lg\">\n                                                <i class=\"material-icons opacity-10\">account_balance_wallet</i>\n                                            </div>\n                                        </div>\n                                        <div class=\"card-body pt-0 p-3 text-center\">\n                                            <h6 class=\"text-center mb-0\">Paypal</h6>\n                                            <span class=\"text-xs\">Freelance Payment</span>\n                                            <hr class=\"horizontal dark my-3\">\n                                            <h5 class=\"mb-0\">$455.00</h5>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"col-md-12 mb-lg-0 mb-4\">\n                            <div class=\"card mt-4\">\n                                <div class=\"card-header pb-0 p-3\">\n                                    <div class=\"row\">\n                                        <div class=\"col-6 d-flex align-items-center\">\n                                            <h6 class=\"mb-0\">Payment Method</h6>\n                                        </div>\n                                        <div class=\"col-6 text-end\">\n                                            <a class=\"btn bg-gradient-dark mb-0\" href=\"javascript:;\"><i\n                                                    class=\"material-icons text-sm\">add</i>&nbsp;&nbsp;Add New\n                                                Card</a>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"card-body p-3\">\n                                    <div class=\"row\">\n                                        <div class=\"col-md-6 mb-md-0 mb-4\">\n                                            <div\n                                                class=\"card card-body border card-plain border-radius-lg d-flex align-items-center flex-row\">\n                                                <img class=\"w-10 me-3 mb-0\"\n                                                    src=\"{{ asset('assets') }}/img/logos/mastercard.png\" alt=\"logo\">\n                                                <h6 class=\"mb-0\">\n                                                    ****&nbsp;&nbsp;&nbsp;****&nbsp;&nbsp;&nbsp;****&nbsp;&nbsp;&nbsp;7852\n                                                </h6>\n                                                <i class=\"material-icons ms-auto text-dark cursor-pointer\"\n                                                    data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                    title=\"Edit Card\">edit</i>\n                                            </div>\n                                        </div>\n                                        <div class=\"col-md-6\">\n                                            <div\n                                                class=\"card card-body border card-plain border-radius-lg d-flex align-items-center flex-row\">\n                                                <img class=\"w-10 me-3 mb-0\"\n                                                    src=\"{{ asset('assets') }}/img/logos/visa.png\" alt=\"logo\">\n                                                <h6 class=\"mb-0\">\n                                                    ****&nbsp;&nbsp;&nbsp;****&nbsp;&nbsp;&nbsp;****&nbsp;&nbsp;&nbsp;5248\n                                                </h6>\n                                                <i class=\"material-icons ms-auto text-dark cursor-pointer\"\n                                                    data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                    title=\"Edit Card\">edit</i>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-4\">\n                    <div class=\"card h-100\">\n                        <div class=\"card-header pb-0 p-3\">\n                            <div class=\"row\">\n                                <div class=\"col-6 d-flex align-items-center\">\n                                    <h6 class=\"mb-0\">Invoices</h6>\n                                </div>\n                                <div class=\"col-6 text-end\">\n                                    <button class=\"btn btn-outline-primary btn-sm mb-0\">View All</button>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body p-3 pb-0\">\n                            <ul class=\"list-group\">\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"mb-1 text-dark font-weight-bold text-sm\">March, 01, 2020</h6>\n                                        <span class=\"text-xs\">#MS-415646</span>\n                                    </div>\n                                    <div class=\"d-flex align-items-center text-sm\">\n                                        $180\n                                        <button class=\"btn btn-link text-dark text-sm mb-0 px-0 ms-4\"><i\n                                                class=\"material-icons text-lg position-relative me-1\">picture_as_pdf</i>\n                                            PDF</button>\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"text-dark mb-1 font-weight-bold text-sm\">February, 10, 2021</h6>\n                                        <span class=\"text-xs\">#RV-126749</span>\n                                    </div>\n                                    <div class=\"d-flex align-items-center text-sm\">\n                                        $250\n                                        <button class=\"btn btn-link text-dark text-sm mb-0 px-0 ms-4\"><i\n                                                class=\"material-icons text-lg position-relative me-1\">picture_as_pdf</i>\n                                            PDF</button>\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"text-dark mb-1 font-weight-bold text-sm\">April, 05, 2020</h6>\n                                        <span class=\"text-xs\">#FB-212562</span>\n                                    </div>\n                                    <div class=\"d-flex align-items-center text-sm\">\n                                        $560\n                                        <button class=\"btn btn-link text-dark text-sm mb-0 px-0 ms-4\"><i\n                                                class=\"material-icons text-lg position-relative me-1\">picture_as_pdf</i>\n                                            PDF</button>\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"text-dark mb-1 font-weight-bold text-sm\">June, 25, 2019</h6>\n                                        <span class=\"text-xs\">#QW-103578</span>\n                                    </div>\n                                    <div class=\"d-flex align-items-center text-sm\">\n                                        $120\n                                        <button class=\"btn btn-link text-dark text-sm mb-0 px-0 ms-4\"><i\n                                                class=\"material-icons text-lg position-relative me-1\">picture_as_pdf</i>\n                                            PDF</button>\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"text-dark mb-1 font-weight-bold text-sm\">March, 01, 2019</h6>\n                                        <span class=\"text-xs\">#AR-803481</span>\n                                    </div>\n                                    <div class=\"d-flex align-items-center text-sm\">\n                                        $300\n                                        <button class=\"btn btn-link text-dark text-sm mb-0 px-0 ms-4\"><i\n                                                class=\"material-icons text-lg position-relative me-1\">picture_as_pdf</i>\n                                            PDF</button>\n                                    </div>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row\">\n                <div class=\"col-md-7 mt-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header pb-0 px-3\">\n                            <h6 class=\"mb-0\">Billing Information</h6>\n                        </div>\n                        <div class=\"card-body pt-4 p-3\">\n                            <ul class=\"list-group\">\n                                <li class=\"list-group-item border-0 d-flex p-4 mb-2 bg-gray-100 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"mb-3 text-sm\">Oliver Liam</h6>\n                                        <span class=\"mb-2 text-xs\">Company Name: <span\n                                                class=\"text-dark font-weight-bold ms-sm-2\">Viking\n                                                Burrito</span></span>\n                                        <span class=\"mb-2 text-xs\">Email Address: <span\n                                                class=\"text-dark ms-sm-2 font-weight-bold\">oliver@burrito.com</span></span>\n                                        <span class=\"text-xs\">VAT Number: <span\n                                                class=\"text-dark ms-sm-2 font-weight-bold\">FRB1235476</span></span>\n                                    </div>\n                                    <div class=\"ms-auto text-end\">\n                                        <a class=\"btn btn-link text-danger text-gradient px-3 mb-0\"\n                                            href=\"javascript:;\"><i\n                                                class=\"material-icons text-sm me-2\">delete</i>Delete</a>\n                                        <a class=\"btn btn-link text-dark px-3 mb-0\" href=\"javascript:;\"><i\n                                                class=\"material-icons text-sm me-2\">edit</i>Edit</a>\n                                    </div>\n                                </li>\n                                <li class=\"list-group-item border-0 d-flex p-4 mb-2 mt-3 bg-gray-100 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"mb-3 text-sm\">Lucas Harper</h6>\n                                        <span class=\"mb-2 text-xs\">Company Name: <span\n                                                class=\"text-dark font-weight-bold ms-sm-2\">Stone Tech\n                                                Zone</span></span>\n                                        <span class=\"mb-2 text-xs\">Email Address: <span\n                                                class=\"text-dark ms-sm-2 font-weight-bold\">lucas@stone-tech.com</span></span>\n                                        <span class=\"text-xs\">VAT Number: <span\n                                                class=\"text-dark ms-sm-2 font-weight-bold\">FRB1235476</span></span>\n                                    </div>\n                                    <div class=\"ms-auto text-end\">\n                                        <a class=\"btn btn-link text-danger text-gradient px-3 mb-0\"\n                                            href=\"javascript:;\"><i\n                                                class=\"material-icons text-sm me-2\">delete</i>Delete</a>\n                                        <a class=\"btn btn-link text-dark px-3 mb-0\" href=\"javascript:;\"><i\n                                                class=\"material-icons text-sm me-2\">edit</i>Edit</a>\n                                    </div>\n                                </li>\n                                <li class=\"list-group-item border-0 d-flex p-4 mb-2 mt-3 bg-gray-100 border-radius-lg\">\n                                    <div class=\"d-flex flex-column\">\n                                        <h6 class=\"mb-3 text-sm\">Ethan James</h6>\n                                        <span class=\"mb-2 text-xs\">Company Name: <span\n                                                class=\"text-dark font-weight-bold ms-sm-2\">Fiber\n                                                Notion</span></span>\n                                        <span class=\"mb-2 text-xs\">Email Address: <span\n                                                class=\"text-dark ms-sm-2 font-weight-bold\">ethan@fiber.com</span></span>\n                                        <span class=\"text-xs\">VAT Number: <span\n                                                class=\"text-dark ms-sm-2 font-weight-bold\">FRB1235476</span></span>\n                                    </div>\n                                    <div class=\"ms-auto text-end\">\n                                        <a class=\"btn btn-link text-danger text-gradient px-3 mb-0\"\n                                            href=\"javascript:;\"><i\n                                                class=\"material-icons text-sm me-2\">delete</i>Delete</a>\n                                        <a class=\"btn btn-link text-dark px-3 mb-0\" href=\"javascript:;\"><i\n                                                class=\"material-icons text-sm me-2\">edit</i>Edit</a>\n                                    </div>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-md-5 mt-4\">\n                    <div class=\"card h-100 mb-4\">\n                        <div class=\"card-header pb-0 px-3\">\n                            <div class=\"row\">\n                                <div class=\"col-md-6\">\n                                    <h6 class=\"mb-0\">Your Transaction's</h6>\n                                </div>\n                                <div\n                                    class=\"col-md-6 d-flex justify-content-start justify-content-md-end align-items-center\">\n                                    <i class=\"material-icons me-2 text-lg\">date_range</i>\n                                    <small>23 - 30 March 2020</small>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body pt-4 p-3\">\n                            <h6 class=\"text-uppercase text-body text-xs font-weight-bolder mb-3\">Newest</h6>\n                            <ul class=\"list-group\">\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex align-items-center\">\n                                        <button\n                                            class=\"btn btn-icon-only btn-rounded btn-outline-danger mb-0 me-3 p-3 btn-sm d-flex align-items-center justify-content-center\"><i\n                                                class=\"material-icons text-lg\">expand_more</i></button>\n                                        <div class=\"d-flex flex-column\">\n                                            <h6 class=\"mb-1 text-dark text-sm\">Netflix</h6>\n                                            <span class=\"text-xs\">27 March 2020, at 12:30 PM</span>\n                                        </div>\n                                    </div>\n                                    <div\n                                        class=\"d-flex align-items-center text-danger text-gradient text-sm font-weight-bold\">\n                                        - $ 2,500\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex align-items-center\">\n                                        <button\n                                            class=\"btn btn-icon-only btn-rounded btn-outline-success mb-0 me-3 p-3 btn-sm d-flex align-items-center justify-content-center\"><i\n                                                class=\"material-icons text-lg\">expand_less</i></button>\n                                        <div class=\"d-flex flex-column\">\n                                            <h6 class=\"mb-1 text-dark text-sm\">Apple</h6>\n                                            <span class=\"text-xs\">27 March 2020, at 04:30 AM</span>\n                                        </div>\n                                    </div>\n                                    <div\n                                        class=\"d-flex align-items-center text-success text-gradient text-sm font-weight-bold\">\n                                        + $ 2,000\n                                    </div>\n                                </li>\n                            </ul>\n                            <h6 class=\"text-uppercase text-body text-xs font-weight-bolder my-3\">Yesterday</h6>\n                            <ul class=\"list-group\">\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex align-items-center\">\n                                        <button\n                                            class=\"btn btn-icon-only btn-rounded btn-outline-success mb-0 me-3 p-3 btn-sm d-flex align-items-center justify-content-center\"><i\n                                                class=\"material-icons text-lg\">expand_less</i></button>\n                                        <div class=\"d-flex flex-column\">\n                                            <h6 class=\"mb-1 text-dark text-sm\">Stripe</h6>\n                                            <span class=\"text-xs\">26 March 2020, at 13:45 PM</span>\n                                        </div>\n                                    </div>\n                                    <div\n                                        class=\"d-flex align-items-center text-success text-gradient text-sm font-weight-bold\">\n                                        + $ 750\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex align-items-center\">\n                                        <button\n                                            class=\"btn btn-icon-only btn-rounded btn-outline-success mb-0 me-3 p-3 btn-sm d-flex align-items-center justify-content-center\"><i\n                                                class=\"material-icons text-lg\">expand_less</i></button>\n                                        <div class=\"d-flex flex-column\">\n                                            <h6 class=\"mb-1 text-dark text-sm\">HubSpot</h6>\n                                            <span class=\"text-xs\">26 March 2020, at 12:30 PM</span>\n                                        </div>\n                                    </div>\n                                    <div\n                                        class=\"d-flex align-items-center text-success text-gradient text-sm font-weight-bold\">\n                                        + $ 1,000\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex align-items-center\">\n                                        <button\n                                            class=\"btn btn-icon-only btn-rounded btn-outline-success mb-0 me-3 p-3 btn-sm d-flex align-items-center justify-content-center\"><i\n                                                class=\"material-icons text-lg\">expand_less</i></button>\n                                        <div class=\"d-flex flex-column\">\n                                            <h6 class=\"mb-1 text-dark text-sm\">Creative Tim</h6>\n                                            <span class=\"text-xs\">26 March 2020, at 08:30 AM</span>\n                                        </div>\n                                    </div>\n                                    <div\n                                        class=\"d-flex align-items-center text-success text-gradient text-sm font-weight-bold\">\n                                        + $ 2,500\n                                    </div>\n                                </li>\n                                <li\n                                    class=\"list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg\">\n                                    <div class=\"d-flex align-items-center\">\n                                        <button\n                                            class=\"btn btn-icon-only btn-rounded btn-outline-dark mb-0 me-3 p-3 btn-sm d-flex align-items-center justify-content-center\"><i\n                                                class=\"material-icons text-lg\">priority_high</i></button>\n                                        <div class=\"d-flex flex-column\">\n                                            <h6 class=\"mb-1 text-dark text-sm\">Webflow</h6>\n                                            <span class=\"text-xs\">26 March 2020, at 05:00 AM</span>\n                                        </div>\n                                    </div>\n                                    <div class=\"d-flex align-items-center text-dark text-sm font-weight-bold\">\n                                        Pending\n                                    </div>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <x-footers.auth></x-footers.auth>\n        </div>\n    </main>\n    <x-plugins></x-plugins>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/laravel-examples/user-management.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show  bg-gray-200\">\n\n    <x-navbars.sidebar activePage=\"user-management\"></x-navbars.sidebar>\n    <main class=\"main-content position-relative max-height-vh-100 h-100 border-radius-lg \">\n        <!-- Navbar -->\n        <x-navbars.navs.auth titlePage=\"User Management\"></x-navbars.navs.auth>\n        <!-- End Navbar -->\n        <div class=\"container-fluid py-4\">\n            <div class=\"row\">\n                <div class=\"col-12\">\n                    <div class=\"card my-4\">\n                        <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                            <div class=\"bg-gradient-primary shadow-primary border-radius-lg pt-4 pb-3\">\n                                <h6 class=\"text-white mx-3\"><strong> Add, Edit, Delete features are not\n                                        functional!</strong> This is a<strong> PRO</strong> feature! Click\n                                    <strong><a\n                                            href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\"\n                                            target=\"_blank\" class=\"text-white\"><u>here</u> </a></strong>to see\n                                    the PRO product!</h6>\n                            </div>\n                        </div>\n                        <div class=\" me-3 my-3 text-end\">\n                            <a class=\"btn bg-gradient-dark mb-0\" href=\"javascript:;\"><i\n                                    class=\"material-icons text-sm\">add</i>&nbsp;&nbsp;Add New\n                                User</a>\n                        </div>\n                        <div class=\"card-body px-0 pb-2\">\n                            <div class=\"table-responsive p-0\">\n                                <table class=\"table align-items-center mb-0\">\n                                    <thead>\n                                        <tr>\n                                            <th\n                                                class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                ID\n                                            </th>\n                                            <th\n                                                class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                PHOTO</th>\n                                            <th\n                                                class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">\n                                                NAME</th>\n                                            <th\n                                                class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                EMAIL</th>\n                                            <th\n                                                class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                ROLE</th>\n                                            <th\n                                                class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                CREATION DATE\n                                            </th>\n                                            <th class=\"text-secondary opacity-7\"></th>\n                                        </tr>\n                                    </thead>\n                                    <tbody>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <p class=\"mb-0 text-sm\">1</p>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/team-2.jpg\"\n                                                            class=\"avatar avatar-sm me-3 border-radius-lg\" alt=\"user1\">\n                                                    </div>\n\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex flex-column justify-content-center\">\n                                                    <h6 class=\"mb-0 text-sm\">John</h6>\n\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <p class=\"text-xs text-secondary mb-0\">john@creative-tim.com\n                                                </p>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">Admin</span>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">22/03/18</span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <a rel=\"tooltip\" class=\"btn btn-success btn-link\"\n                                                    href=\"\" data-original-title=\"\"\n                                                    title=\"\">\n                                                    <i class=\"material-icons\">edit</i>\n                                                    <div class=\"ripple-container\"></div>\n                                                </a>\n                                                \n                                                <button type=\"button\" class=\"btn btn-danger btn-link\"\n                                                data-original-title=\"\" title=\"\">\n                                                <i class=\"material-icons\">close</i>\n                                                <div class=\"ripple-container\"></div>\n                                            </button>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <p class=\"mb-0 text-sm\">2</p>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/team-3.jpg\"\n                                                            class=\"avatar avatar-sm me-3 border-radius-lg\" alt=\"user2\">\n                                                    </div>\n\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex flex-column justify-content-center\">\n                                                    <h6 class=\"mb-0 text-sm\">Alexa</h6>\n\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    alexa@creative-tim.com</p>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">Creator</span>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">16/06/18</span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <a rel=\"tooltip\" class=\"btn btn-success btn-link\"\n                                                href=\"\" data-original-title=\"\"\n                                                title=\"\">\n                                                <i class=\"material-icons\">edit</i>\n                                                <div class=\"ripple-container\"></div>\n                                            </a>\n                                             <button type=\"button\" class=\"btn btn-danger btn-link\"\n                                                    data-original-title=\"\" title=\"\">\n                                                    <i class=\"material-icons\">close</i>\n                                                    <div class=\"ripple-container\"></div>\n                                                </button>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <p class=\"mb-0 text-sm\">3</p>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\"\n                                                            class=\"avatar avatar-sm me-3 border-radius-lg\" alt=\"user3\">\n                                                    </div>\n\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex flex-column justify-content-center\">\n                                                    <h6 class=\"mb-0 text-sm\">Laurent</h6>\n\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    laurent@creative-tim.com</p>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">Member</span>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">30/06/18</span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <a rel=\"tooltip\" class=\"btn btn-success btn-link\"\n                                                    href=\"\" data-original-title=\"\"\n                                                    title=\"\">\n                                                    <i class=\"material-icons\">edit</i>\n                                                    <div class=\"ripple-container\"></div>\n                                                </a>\n                                                <button type=\"button\" class=\"btn btn-danger btn-link\"\n                                                data-original-title=\"\" title=\"\">\n                                                <i class=\"material-icons\">close</i>\n                                                <div class=\"ripple-container\"></div>\n                                            </button>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <p class=\"mb-0 text-sm\">4</p>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/team-3.jpg\"\n                                                            class=\"avatar avatar-sm me-3 border-radius-lg\" alt=\"user4\">\n                                                    </div>\n\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex flex-column justify-content-center\">\n                                                    <h6 class=\"mb-0 text-sm\">Michael</h6>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    michael@creative-tim.com</p>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">Member</span>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">16/06/19</span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <a rel=\"tooltip\" class=\"btn btn-success btn-link\"\n                                                    href=\"\" data-original-title=\"\"\n                                                    title=\"\">\n                                                    <i class=\"material-icons\">edit</i>\n                                                    <div class=\"ripple-container\"></div>\n                                                </a>\n                                                <button type=\"button\" class=\"btn btn-danger btn-link\"\n                                                data-original-title=\"\" title=\"\">\n                                                <i class=\"material-icons\">close</i>\n                                                <div class=\"ripple-container\"></div>\n                                            </button>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <p class=\"mb-0 text-sm\">5</p>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/team-2.jpg\"\n                                                            class=\"avatar avatar-sm me-3 border-radius-lg\" alt=\"user5\">\n                                                    </div>\n\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex flex-column justify-content-center\">\n                                                    <h6 class=\"mb-0 text-sm\">Richard</h6>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    richard@creative-tim.com</p>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">Creator</span>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">16/06/18</span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <a rel=\"tooltip\" class=\"btn btn-success btn-link\"\n                                                    href=\"\" data-original-title=\"\"\n                                                    title=\"\">\n                                                    <i class=\"material-icons\">edit</i>\n                                                    <div class=\"ripple-container\"></div>\n                                                </a>\n                                                <button type=\"button\" class=\"btn btn-danger btn-link\"\n                                                data-original-title=\"\" title=\"\">\n                                                <i class=\"material-icons\">close</i>\n                                                <div class=\"ripple-container\"></div>\n                                            </button>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <p class=\"mb-0 text-sm\">6</p>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/team-4.jpg\"\n                                                            class=\"avatar avatar-sm me-3 border-radius-lg\" alt=\"user6\">\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"d-flex flex-column justify-content-center\">\n                                                    <h6 class=\"mb-0 text-sm\">Miriam</h6>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    miriam@creative-tim.com</p>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">Creator</span>\n                                            </td>\n                                            <td class=\"align-middle text-center\">\n                                                <span class=\"text-secondary text-xs font-weight-bold\">26/06/18</span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <a rel=\"tooltip\" class=\"btn btn-success btn-link\"\n                                                    href=\"\" data-original-title=\"\"\n                                                    title=\"\">\n                                                    <i class=\"material-icons\">edit</i>\n                                                    <div class=\"ripple-container\"></div>\n                                                </a>\n                                                <button type=\"button\" class=\"btn btn-danger btn-link\"\n                                                    data-original-title=\"\" title=\"\">\n                                                    <i class=\"material-icons\">close</i>\n                                                    <div class=\"ripple-container\"></div>\n                                                </button>\n                                            </td>\n                                        </tr>\n                                    </tbody>\n                                </table>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <x-footers.auth></x-footers.auth>\n        </div>\n    </main>\n    <x-plugins></x-plugins>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/laravel-examples/user-profile.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show bg-gray-200\">\n\n    <x-navbars.sidebar activePage=\"user-profile\"></x-navbars.sidebar>\n    <div class=\"main-content position-relative bg-gray-100 max-height-vh-100 h-100\">\n        <!-- Navbar -->\n        <x-navbars.navs.auth titlePage='User Profile'></x-navbars.navs.auth>\n        <!-- End Navbar -->\n        <div class=\"container-fluid px-2 px-md-4\">\n            <div class=\"page-header min-height-300 border-radius-xl mt-4\"\n                style=\"background-image: url('https://images.unsplash.com/photo-1531512073830-ba890ca4eba2?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80');\">\n                <span class=\"mask  bg-gradient-primary  opacity-6\"></span>\n            </div>\n            <div class=\"card card-body mx-3 mx-md-4 mt-n6\">\n                <div class=\"row gx-4 mb-2\">\n                    <div class=\"col-auto\">\n                        <div class=\"avatar avatar-xl position-relative\">\n                            <img src=\"{{ asset('assets') }}/img/bruce-mars.jpg\" alt=\"profile_image\"\n                                class=\"w-100 border-radius-lg shadow-sm\">\n                        </div>\n                    </div>\n                    <div class=\"col-auto my-auto\">\n                        <div class=\"h-100\">\n                            <h5 class=\"mb-1\">\n                                {{ auth()->user()->name }}\n                            </h5>\n                            <p class=\"mb-0 font-weight-normal text-sm\">\n                                CEO / Co-Founder\n                            </p>\n                        </div>\n                    </div>\n                    <div class=\"col-lg-4 col-md-6 my-sm-auto ms-sm-auto me-sm-0 mx-auto mt-3\">\n                        <div class=\"nav-wrapper position-relative end-0\">\n                            <ul class=\"nav nav-pills nav-fill p-1\" role=\"tablist\">\n                                <li class=\"nav-item\">\n                                    <a class=\"nav-link mb-0 px-0 py-1 active \" data-bs-toggle=\"tab\" href=\"javascript:;\"\n                                        role=\"tab\" aria-selected=\"true\">\n                                        <i class=\"material-icons text-lg position-relative\">home</i>\n                                        <span class=\"ms-1\">App</span>\n                                    </a>\n                                </li>\n                                <li class=\"nav-item\">\n                                    <a class=\"nav-link mb-0 px-0 py-1 \" data-bs-toggle=\"tab\" href=\"javascript:;\"\n                                        role=\"tab\" aria-selected=\"false\">\n                                        <i class=\"material-icons text-lg position-relative\">email</i>\n                                        <span class=\"ms-1\">Messages</span>\n                                    </a>\n                                </li>\n                                <li class=\"nav-item\">\n                                    <a class=\"nav-link mb-0 px-0 py-1 \" data-bs-toggle=\"tab\" href=\"javascript:;\"\n                                        role=\"tab\" aria-selected=\"false\">\n                                        <i class=\"material-icons text-lg position-relative\">settings</i>\n                                        <span class=\"ms-1\">Settings</span>\n                                    </a>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"card card-plain h-100\">\n                    <div class=\"card-header pb-0 p-3\">\n                        <div class=\"row\">\n                            <div class=\"col-md-8 d-flex align-items-center\">\n                                <h6 class=\"mb-3\">Profile Information</h6>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"card-body p-3\">\n                        @if (session('status'))\n                        <div class=\"row\">\n                            <div class=\"alert alert-success alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">{{ Session::get('status') }}</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\"\n                                    data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                        </div>\n                        @endif\n                        @if (Session::has('demo'))\n                                <div class=\"row\">\n                                    <div class=\"alert alert-danger alert-dismissible text-white\" role=\"alert\">\n                                        <span class=\"text-sm\">{{ Session::get('demo') }}</span>\n                                        <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\"\n                                            data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                                            <span aria-hidden=\"true\">&times;</span>\n                                        </button>\n                                    </div>\n                                </div>\n                        @endif\n                        <form method='POST' action='{{ route('user-profile') }}'>\n                            @csrf\n                            <div class=\"row\">\n                                \n                                <div class=\"mb-3 col-md-6\">\n                                    <label class=\"form-label\">Email address</label>\n                                    <input type=\"email\" name=\"email\" class=\"form-control border border-2 p-2\" value='{{ old('email', auth()->user()->email) }}'>\n                                    @error('email')\n                                <p class='text-danger inputerror'>{{ $message }} </p>\n                                @enderror\n                                </div>\n                                \n                                <div class=\"mb-3 col-md-6\">\n                                    <label class=\"form-label\">Name</label>\n                                    <input type=\"text\" name=\"name\" class=\"form-control border border-2 p-2\" value='{{ old('name', auth()->user()->name) }}'>\n                                    @error('name')\n                                <p class='text-danger inputerror'>{{ $message }} </p>\n                                @enderror\n                                </div>\n                               \n                                <div class=\"mb-3 col-md-6\">\n                                    <label class=\"form-label\">Phone</label>\n                                    <input type=\"number\" name=\"phone\" class=\"form-control border border-2 p-2\" value='{{ old('phone', auth()->user()->phone) }}'>\n                                    @error('phone')\n                                    <p class='text-danger inputerror'>{{ $message }} </p>\n                                    @enderror\n                                </div>\n                                \n                                <div class=\"mb-3 col-md-6\">\n                                    <label class=\"form-label\">Location</label>\n                                    <input type=\"text\" name=\"location\" class=\"form-control border border-2 p-2\" value='{{ old('location', auth()->user()->location) }}'>\n                                    @error('location')\n                                    <p class='text-danger inputerror'>{{ $message }} </p>\n                                    @enderror\n                                </div>\n                                \n                                <div class=\"mb-3 col-md-12\">\n                                    <label for=\"floatingTextarea2\">About</label>\n                                    <textarea class=\"form-control border border-2 p-2\"\n                                        placeholder=\" Say something about yourself\" id=\"floatingTextarea2\" name=\"about\"\n                                        rows=\"4\" cols=\"50\">{{ old('about', auth()->user()->about) }}</textarea>\n                                        @error('about')\n                                        <p class='text-danger inputerror'>{{ $message }} </p>\n                                        @enderror\n                                </div>\n                            </div>\n                            <button type=\"submit\" class=\"btn bg-gradient-dark\">Submit</button>\n                        </form>\n\n                    </div>\n                </div>\n            </div>\n\n        </div>\n        <x-footers.auth></x-footers.auth>\n    </div>\n    <x-plugins></x-plugins>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/notifications.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show  bg-gray-200\">\n\n    <x-navbars.sidebar activePage=\"notifications\"></x-navbars.sidebar>\n    <main class=\"main-content position-relative max-height-vh-100 h-100 border-radius-lg \">\n        <!-- Navbar -->\n        <x-navbars.navs.auth titlePage=\"Notifications\"></x-navbars.navs.auth>\n        <!-- End Navbar -->\n        <div class=\"container-fluid py-4\">\n            <div class=\"row\">\n                <div class=\"col-lg-8 col-md-10 mx-auto\">\n                    <div class=\"card mt-4\">\n                        <div class=\"card-header p-3\">\n                            <h5 class=\"mb-0\">Alerts</h5>\n                        </div>\n                        <div class=\"card-body p-3 pb-0\">\n                            <div class=\"alert alert-primary alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple primary alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                            <div class=\"alert alert-secondary alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple secondary alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                            <div class=\"alert alert-success alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple success alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                            <div class=\"alert alert-danger alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple danger alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                            <div class=\"alert alert-warning alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple warning alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                            <div class=\"alert alert-info alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple info alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                            <div class=\"alert alert-light alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple light alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                            <div class=\"alert alert-dark alert-dismissible text-white\" role=\"alert\">\n                                <span class=\"text-sm\">A simple dark alert with <a href=\"javascript:;\"\n                                        class=\"alert-link text-white\">an example link</a>. Give it a click if you\n                                    like.</span>\n                                <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\" data-bs-dismiss=\"alert\"\n                                    aria-label=\"Close\">\n                                    <span aria-hidden=\"true\">&times;</span>\n                                </button>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"card mt-4\">\n                        <div class=\"card-header p-3\">\n                            <h5 class=\"mb-0\">Notifications</h5>\n                            <p class=\"text-sm mb-0\">\n                                Notifications on this page use Toasts from Bootstrap. Read more details <a\n                                    href=\"https://getbootstrap.com/docs/5.0/components/toasts/\" target=\"\n          \">here</a>.\n                            </p>\n                        </div>\n                        <div class=\"card-body p-3\">\n                            <div class=\"row\">\n                                <div class=\"col-lg-3 col-sm-6 col-12\">\n                                    <button class=\"btn bg-gradient-success w-100 mb-0 toast-btn\" type=\"button\"\n                                        data-target=\"successToast\">Success</button>\n                                </div>\n                                <div class=\"col-lg-3 col-sm-6 col-12 mt-sm-0 mt-2\">\n                                    <button class=\"btn bg-gradient-info w-100 mb-0 toast-btn\" type=\"button\"\n                                        data-target=\"infoToast\">Info</button>\n                                </div>\n                                <div class=\"col-lg-3 col-sm-6 col-12 mt-lg-0 mt-2\">\n                                    <button class=\"btn bg-gradient-warning w-100 mb-0 toast-btn\" type=\"button\"\n                                        data-target=\"warningToast\">Warning</button>\n                                </div>\n                                <div class=\"col-lg-3 col-sm-6 col-12 mt-lg-0 mt-2\">\n                                    <button class=\"btn bg-gradient-danger w-100 mb-0 toast-btn\" type=\"button\"\n                                        data-target=\"dangerToast\">Danger</button>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"position-fixed bottom-1 end-1 z-index-2\">\n                <div class=\"toast fade hide p-2 bg-white\" role=\"alert\" aria-live=\"assertive\" id=\"successToast\"\n                    aria-atomic=\"true\">\n                    <div class=\"toast-header border-0\">\n                        <i class=\"material-icons text-success me-2\">\n                            check\n                        </i>\n                        <span class=\"me-auto font-weight-bold\">Material Dashboard </span>\n                        <small class=\"text-body\">11 mins ago</small>\n                        <i class=\"fas fa-times text-md ms-3 cursor-pointer\" data-bs-dismiss=\"toast\"\n                            aria-label=\"Close\"></i>\n                    </div>\n                    <hr class=\"horizontal dark m-0\">\n                    <div class=\"toast-body\">\n                        Hello, world! This is a notification message.\n                    </div>\n                </div>\n                <div class=\"toast fade hide p-2 mt-2 bg-gradient-info\" role=\"alert\" aria-live=\"assertive\" id=\"infoToast\"\n                    aria-atomic=\"true\">\n                    <div class=\"toast-header bg-transparent border-0\">\n                        <i class=\"material-icons text-white me-2\">\n                            notifications\n                        </i>\n                        <span class=\"me-auto text-white font-weight-bold\">Material Dashboard </span>\n                        <small class=\"text-white\">11 mins ago</small>\n                        <i class=\"fas fa-times text-md text-white ms-3 cursor-pointer\" data-bs-dismiss=\"toast\"\n                            aria-label=\"Close\"></i>\n                    </div>\n                    <hr class=\"horizontal light m-0\">\n                    <div class=\"toast-body text-white\">\n                        Hello, world! This is a notification message.\n                    </div>\n                </div>\n                <div class=\"toast fade hide p-2 mt-2 bg-white\" role=\"alert\" aria-live=\"assertive\" id=\"warningToast\"\n                    aria-atomic=\"true\">\n                    <div class=\"toast-header border-0\">\n                        <i class=\"material-icons text-warning me-2\">\n                            travel_explore\n                        </i>\n                        <span class=\"me-auto font-weight-bold\">Material Dashboard </span>\n                        <small class=\"text-body\">11 mins ago</small>\n                        <i class=\"fas fa-times text-md ms-3 cursor-pointer\" data-bs-dismiss=\"toast\"\n                            aria-label=\"Close\"></i>\n                    </div>\n                    <hr class=\"horizontal dark m-0\">\n                    <div class=\"toast-body\">\n                        Hello, world! This is a notification message.\n                    </div>\n                </div>\n                <div class=\"toast fade hide p-2 mt-2 bg-white\" role=\"alert\" aria-live=\"assertive\" id=\"dangerToast\"\n                    aria-atomic=\"true\">\n                    <div class=\"toast-header border-0\">\n                        <i class=\"material-icons text-danger me-2\">\n                            campaign\n                        </i>\n                        <span class=\"me-auto text-gradient text-danger font-weight-bold\">Material Dashboard </span>\n                        <small class=\"text-body\">11 mins ago</small>\n                        <i class=\"fas fa-times text-md ms-3 cursor-pointer\" data-bs-dismiss=\"toast\"\n                            aria-label=\"Close\"></i>\n                    </div>\n                    <hr class=\"horizontal dark m-0\">\n                    <div class=\"toast-body\">\n                        Hello, world! This is a notification message.\n                    </div>\n                </div>\n            </div>\n            <x-footers.auth></x-footers.auth>\n        </div>\n    </main>\n    <x-plugins></x-plugins>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/profile.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show  bg-gray-200\">\n    <x-navbars.sidebar activePage=\"profile\"></x-navbars.sidebar>\n    <div class=\"main-content position-relative bg-gray-100 max-height-vh-100 h-100\">\n        <!-- Navbar -->\n        <x-navbars.navs.auth titlePage='Profile'></x-navbars.navs.auth>\n        <!-- End Navbar -->\n        <div class=\"container-fluid px-2 px-md-4\">\n            <div class=\"page-header min-height-300 border-radius-xl mt-4\"\n                style=\"background-image: url('https://images.unsplash.com/photo-1531512073830-ba890ca4eba2?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80');\">\n                <span class=\"mask  bg-gradient-primary  opacity-6\"></span>\n            </div>\n            <div class=\"card card-body mx-3 mx-md-4 mt-n6\">\n                <div class=\"row gx-4 mb-2\">\n                    <div class=\"col-auto\">\n                        <div class=\"avatar avatar-xl position-relative\">\n                            <img src=\"{{ asset('assets') }}/img/bruce-mars.jpg\" alt=\"profile_image\"\n                                class=\"w-100 border-radius-lg shadow-sm\">\n                        </div>\n                    </div>\n                    <div class=\"col-auto my-auto\">\n                        <div class=\"h-100\">\n                            <h5 class=\"mb-1\">\n                                Richard Davis\n                            </h5>\n                            <p class=\"mb-0 font-weight-normal text-sm\">\n                                CEO / Co-Founder\n                            </p>\n                        </div>\n                    </div>\n                    <div class=\"col-lg-4 col-md-6 my-sm-auto ms-sm-auto me-sm-0 mx-auto mt-3\">\n                        <div class=\"nav-wrapper position-relative end-0\">\n                            <ul class=\"nav nav-pills nav-fill p-1\" role=\"tablist\">\n                                <li class=\"nav-item\">\n                                    <a class=\"nav-link mb-0 px-0 py-1 active \" data-bs-toggle=\"tab\" href=\"javascript:;\"\n                                        role=\"tab\" aria-selected=\"true\">\n                                        <i class=\"material-icons text-lg position-relative\">home</i>\n                                        <span class=\"ms-1\">App</span>\n                                    </a>\n                                </li>\n                                <li class=\"nav-item\">\n                                    <a class=\"nav-link mb-0 px-0 py-1 \" data-bs-toggle=\"tab\" href=\"javascript:;\"\n                                        role=\"tab\" aria-selected=\"false\">\n                                        <i class=\"material-icons text-lg position-relative\">email</i>\n                                        <span class=\"ms-1\">Messages</span>\n                                    </a>\n                                </li>\n                                <li class=\"nav-item\">\n                                    <a class=\"nav-link mb-0 px-0 py-1 \" data-bs-toggle=\"tab\" href=\"javascript:;\"\n                                        role=\"tab\" aria-selected=\"false\">\n                                        <i class=\"material-icons text-lg position-relative\">settings</i>\n                                        <span class=\"ms-1\">Settings</span>\n                                    </a>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"row\">\n                    <div class=\"row\">\n                        <div class=\"col-12 col-xl-4\">\n                            <div class=\"card card-plain h-100\">\n                                <div class=\"card-header pb-0 p-3\">\n                                    <h6 class=\"mb-0\">Platform Settings</h6>\n                                </div>\n                                <div class=\"card-body p-3\">\n                                    <h6 class=\"text-uppercase text-body text-xs font-weight-bolder\">Account</h6>\n                                    <ul class=\"list-group\">\n                                        <li class=\"list-group-item border-0 px-0\">\n                                            <div class=\"form-check form-switch ps-0\">\n                                                <input class=\"form-check-input ms-auto\" type=\"checkbox\"\n                                                    id=\"flexSwitchCheckDefault\" checked>\n                                                <label class=\"form-check-label text-body ms-3 text-truncate w-80 mb-0\"\n                                                    for=\"flexSwitchCheckDefault\">Email me when someone follows\n                                                    me</label>\n                                            </div>\n                                        </li>\n                                        <li class=\"list-group-item border-0 px-0\">\n                                            <div class=\"form-check form-switch ps-0\">\n                                                <input class=\"form-check-input ms-auto\" type=\"checkbox\"\n                                                    id=\"flexSwitchCheckDefault1\">\n                                                <label class=\"form-check-label text-body ms-3 text-truncate w-80 mb-0\"\n                                                    for=\"flexSwitchCheckDefault1\">Email me when someone answers on\n                                                    my post</label>\n                                            </div>\n                                        </li>\n                                        <li class=\"list-group-item border-0 px-0\">\n                                            <div class=\"form-check form-switch ps-0\">\n                                                <input class=\"form-check-input ms-auto\" type=\"checkbox\"\n                                                    id=\"flexSwitchCheckDefault2\" checked>\n                                                <label class=\"form-check-label text-body ms-3 text-truncate w-80 mb-0\"\n                                                    for=\"flexSwitchCheckDefault2\">Email me when someone mentions\n                                                    me</label>\n                                            </div>\n                                        </li>\n                                    </ul>\n                                    <h6 class=\"text-uppercase text-body text-xs font-weight-bolder mt-4\">Application\n                                    </h6>\n                                    <ul class=\"list-group\">\n                                        <li class=\"list-group-item border-0 px-0\">\n                                            <div class=\"form-check form-switch ps-0\">\n                                                <input class=\"form-check-input ms-auto\" type=\"checkbox\"\n                                                    id=\"flexSwitchCheckDefault3\">\n                                                <label class=\"form-check-label text-body ms-3 text-truncate w-80 mb-0\"\n                                                    for=\"flexSwitchCheckDefault3\">New launches and projects</label>\n                                            </div>\n                                        </li>\n                                        <li class=\"list-group-item border-0 px-0\">\n                                            <div class=\"form-check form-switch ps-0\">\n                                                <input class=\"form-check-input ms-auto\" type=\"checkbox\"\n                                                    id=\"flexSwitchCheckDefault4\" checked>\n                                                <label class=\"form-check-label text-body ms-3 text-truncate w-80 mb-0\"\n                                                    for=\"flexSwitchCheckDefault4\">Monthly product updates</label>\n                                            </div>\n                                        </li>\n                                        <li class=\"list-group-item border-0 px-0 pb-0\">\n                                            <div class=\"form-check form-switch ps-0\">\n                                                <input class=\"form-check-input ms-auto\" type=\"checkbox\"\n                                                    id=\"flexSwitchCheckDefault5\">\n                                                <label class=\"form-check-label text-body ms-3 text-truncate w-80 mb-0\"\n                                                    for=\"flexSwitchCheckDefault5\">Subscribe to newsletter</label>\n                                            </div>\n                                        </li>\n                                    </ul>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"col-12 col-xl-4\">\n                            <div class=\"card card-plain h-100\">\n                                <div class=\"card-header pb-0 p-3\">\n                                    <div class=\"row\">\n                                        <div class=\"col-md-8 d-flex align-items-center\">\n                                            <h6 class=\"mb-0\">Profile Information</h6>\n                                        </div>\n                                        <div class=\"col-md-4 text-end\">\n                                            <a href=\"javascript:;\">\n                                                <i class=\"fas fa-user-edit text-secondary text-sm\"\n                                                    data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                    title=\"Edit Profile\"></i>\n                                            </a>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"card-body p-3\">\n                                    <p class=\"text-sm\">\n                                        Hi, I’m Alec Thompson, Decisions: If you can’t decide, the answer is no. If\n                                        two equally difficult paths, choose the one more painful in the short term\n                                        (pain avoidance is creating an illusion of equality).\n                                    </p>\n                                    <hr class=\"horizontal gray-light my-4\">\n                                    <ul class=\"list-group\">\n                                        <li class=\"list-group-item border-0 ps-0 pt-0 text-sm\"><strong\n                                                class=\"text-dark\">Full Name:</strong> &nbsp; Alec M. Thompson</li>\n                                        <li class=\"list-group-item border-0 ps-0 text-sm\"><strong\n                                                class=\"text-dark\">Mobile:</strong> &nbsp; (44) 123 1234 123</li>\n                                        <li class=\"list-group-item border-0 ps-0 text-sm\"><strong\n                                                class=\"text-dark\">Email:</strong> &nbsp; alecthompson@mail.com</li>\n                                        <li class=\"list-group-item border-0 ps-0 text-sm\"><strong\n                                                class=\"text-dark\">Location:</strong> &nbsp; USA</li>\n                                        <li class=\"list-group-item border-0 ps-0 pb-0\">\n                                            <strong class=\"text-dark text-sm\">Social:</strong> &nbsp;\n                                            <a class=\"btn btn-facebook btn-simple mb-0 ps-1 pe-2 py-0\"\n                                                href=\"javascript:;\">\n                                                <i class=\"fab fa-facebook fa-lg\"></i>\n                                            </a>\n                                            <a class=\"btn btn-twitter btn-simple mb-0 ps-1 pe-2 py-0\"\n                                                href=\"javascript:;\">\n                                                <i class=\"fab fa-twitter fa-lg\"></i>\n                                            </a>\n                                            <a class=\"btn btn-instagram btn-simple mb-0 ps-1 pe-2 py-0\"\n                                                href=\"javascript:;\">\n                                                <i class=\"fab fa-instagram fa-lg\"></i>\n                                            </a>\n                                        </li>\n                                    </ul>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"col-12 col-xl-4\">\n                            <div class=\"card card-plain h-100\">\n                                <div class=\"card-header pb-0 p-3\">\n                                    <h6 class=\"mb-0\">Conversations</h6>\n                                </div>\n                                <div class=\"card-body p-3\">\n                                    <ul class=\"list-group\">\n                                        <li class=\"list-group-item border-0 d-flex align-items-center px-0 mb-2 pt-0\">\n                                            <div class=\"avatar me-3\">\n                                                <img src=\"{{ asset('assets') }}/img/kal-visuals-square.jpg\" alt=\"kal\"\n                                                    class=\"border-radius-lg shadow\">\n                                            </div>\n                                            <div class=\"d-flex align-items-start flex-column justify-content-center\">\n                                                <h6 class=\"mb-0 text-sm\">Sophie B.</h6>\n                                                <p class=\"mb-0 text-xs\">Hi! I need more information..</p>\n                                            </div>\n                                            <a class=\"btn btn-link pe-3 ps-0 mb-0 ms-auto w-25 w-md-auto\"\n                                                href=\"javascript:;\">Reply</a>\n                                        </li>\n                                        <li class=\"list-group-item border-0 d-flex align-items-center px-0 mb-2\">\n                                            <div class=\"avatar me-3\">\n                                                <img src=\"{{ asset('assets') }}/img/marie.jpg\" alt=\"kal\"\n                                                    class=\"border-radius-lg shadow\">\n                                            </div>\n                                            <div class=\"d-flex align-items-start flex-column justify-content-center\">\n                                                <h6 class=\"mb-0 text-sm\">Anne Marie</h6>\n                                                <p class=\"mb-0 text-xs\">Awesome work, can you..</p>\n                                            </div>\n                                            <a class=\"btn btn-link pe-3 ps-0 mb-0 ms-auto w-25 w-md-auto\"\n                                                href=\"javascript:;\">Reply</a>\n                                        </li>\n                                        <li class=\"list-group-item border-0 d-flex align-items-center px-0 mb-2\">\n                                            <div class=\"avatar me-3\">\n                                                <img src=\"{{ asset('assets') }}/img/ivana-square.jpg\" alt=\"kal\"\n                                                    class=\"border-radius-lg shadow\">\n                                            </div>\n                                            <div class=\"d-flex align-items-start flex-column justify-content-center\">\n                                                <h6 class=\"mb-0 text-sm\">Ivanna</h6>\n                                                <p class=\"mb-0 text-xs\">About files I can..</p>\n                                            </div>\n                                            <a class=\"btn btn-link pe-3 ps-0 mb-0 ms-auto w-25 w-md-auto\"\n                                                href=\"javascript:;\">Reply</a>\n                                        </li>\n                                        <li class=\"list-group-item border-0 d-flex align-items-center px-0 mb-2\">\n                                            <div class=\"avatar me-3\">\n                                                <img src=\"{{ asset('assets') }}/img/team-4.jpg\" alt=\"kal\"\n                                                    class=\"border-radius-lg shadow\">\n                                            </div>\n                                            <div class=\"d-flex align-items-start flex-column justify-content-center\">\n                                                <h6 class=\"mb-0 text-sm\">Peterson</h6>\n                                                <p class=\"mb-0 text-xs\">Have a great afternoon..</p>\n                                            </div>\n                                            <a class=\"btn btn-link pe-3 ps-0 mb-0 ms-auto w-25 w-md-auto\"\n                                                href=\"javascript:;\">Reply</a>\n                                        </li>\n                                        <li class=\"list-group-item border-0 d-flex align-items-center px-0\">\n                                            <div class=\"avatar me-3\">\n                                                <img src=\"{{ asset('assets') }}/img/team-3.jpg\" alt=\"kal\"\n                                                    class=\"border-radius-lg shadow\">\n                                            </div>\n                                            <div class=\"d-flex align-items-start flex-column justify-content-center\">\n                                                <h6 class=\"mb-0 text-sm\">Nick Daniel</h6>\n                                                <p class=\"mb-0 text-xs\">Hi! I need more information..</p>\n                                            </div>\n                                            <a class=\"btn btn-link pe-3 ps-0 mb-0 ms-auto w-25 w-md-auto\"\n                                                href=\"javascript:;\">Reply</a>\n                                        </li>\n                                    </ul>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"col-12 mt-4\">\n                            <div class=\"mb-5 ps-3\">\n                                <h6 class=\"mb-1\">Projects</h6>\n                                <p class=\"text-sm\">Architects design houses</p>\n                            </div>\n                            <div class=\"row\">\n                                <div class=\"col-xl-3 col-md-6 mb-xl-0 mb-4\">\n                                    <div class=\"card card-blog card-plain\">\n                                        <div class=\"card-header p-0 mt-n4 mx-3\">\n                                            <a class=\"d-block shadow-xl border-radius-xl\">\n                                                <img src=\"{{ asset('assets') }}/img/home-decor-1.jpg\"\n                                                    alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-xl\">\n                                            </a>\n                                        </div>\n                                        <div class=\"card-body p-3\">\n                                            <p class=\"mb-0 text-sm\">Project #2</p>\n                                            <a href=\"javascript:;\">\n                                                <h5>\n                                                    Modern\n                                                </h5>\n                                            </a>\n                                            <p class=\"mb-4 text-sm\">\n                                                As Uber works through a huge amount of internal management turmoil.\n                                            </p>\n                                            <div class=\"d-flex align-items-center justify-content-between\">\n                                                <button type=\"button\" class=\"btn btn-outline-primary btn-sm mb-0\">View\n                                                    Project</button>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Elena Morison\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Milly\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-2.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Nick Daniel\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Peterson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"col-xl-3 col-md-6 mb-xl-0 mb-4\">\n                                    <div class=\"card card-blog card-plain\">\n                                        <div class=\"card-header p-0 mt-n4 mx-3\">\n                                            <a class=\"d-block shadow-xl border-radius-xl\">\n                                                <img src=\"{{ asset('assets') }}/img/home-decor-2.jpg\"\n                                                    alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-lg\">\n                                            </a>\n                                        </div>\n                                        <div class=\"card-body p-3\">\n                                            <p class=\"mb-0 text-sm\">Project #1</p>\n                                            <a href=\"javascript:;\">\n                                                <h5>\n                                                    Scandinavian\n                                                </h5>\n                                            </a>\n                                            <p class=\"mb-4 text-sm\">\n                                                Music is something that every person has his or her own specific\n                                                opinion about.\n                                            </p>\n                                            <div class=\"d-flex align-items-center justify-content-between\">\n                                                <button type=\"button\" class=\"btn btn-outline-primary btn-sm mb-0\">View\n                                                    Project</button>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Nick Daniel\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Peterson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Elena Morison\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Milly\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-2.jpg\">\n                                                    </a>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"col-xl-3 col-md-6 mb-xl-0 mb-4\">\n                                    <div class=\"card card-blog card-plain\">\n                                        <div class=\"card-header p-0 mt-n4 mx-3\">\n                                            <a class=\"d-block shadow-xl border-radius-xl\">\n                                                <img src=\"{{ asset('assets') }}/img/home-decor-3.jpg\"\n                                                    alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-xl\">\n                                            </a>\n                                        </div>\n                                        <div class=\"card-body p-3\">\n                                            <p class=\"mb-0 text-sm\">Project #3</p>\n                                            <a href=\"javascript:;\">\n                                                <h5>\n                                                    Minimalist\n                                                </h5>\n                                            </a>\n                                            <p class=\"mb-4 text-sm\">\n                                                Different people have different taste, and various types of music.\n                                            </p>\n                                            <div class=\"d-flex align-items-center justify-content-between\">\n                                                <button type=\"button\" class=\"btn btn-outline-primary btn-sm mb-0\">View\n                                                    Project</button>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Peterson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Nick Daniel\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Milly\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-2.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Elena Morison\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"col-xl-3 col-md-6 mb-xl-0 mb-4\">\n                                    <div class=\"card card-blog card-plain\">\n                                        <div class=\"card-header p-0 mt-n4 mx-3\">\n                                            <a class=\"d-block shadow-xl border-radius-xl\">\n                                                <img src=\"https://images.unsplash.com/photo-1606744824163-985d376605aa?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=80\"\n                                                    alt=\"img-blur-shadow\" class=\"img-fluid shadow border-radius-xl\">\n                                            </a>\n                                        </div>\n                                        <div class=\"card-body p-3\">\n                                            <p class=\"mb-0 text-sm\">Project #4</p>\n                                            <a href=\"javascript:;\">\n                                                <h5>\n                                                    Gothic\n                                                </h5>\n                                            </a>\n                                            <p class=\"mb-4 text-sm\">\n                                                Why would anyone pick blue over pink? Pink is obviously a better\n                                                color.\n                                            </p>\n                                            <div class=\"d-flex align-items-center justify-content-between\">\n                                                <button type=\"button\" class=\"btn btn-outline-primary btn-sm mb-0\">View\n                                                    Project</button>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Peterson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Nick Daniel\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Milly\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-2.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Elena Morison\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n        <x-footers.auth></x-footers.auth>\n    </div>\n    <x-plugins></x-plugins>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/rtl.blade.php",
    "content": "<!DOCTYPE html>\n<html lang=\"ar\" dir=\"rtl\">\n\n<head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\">\n    <link rel=\"apple-touch-icon\" sizes=\"76x76\" href=\"{{ asset('assets') }}/img/apple-icon.png\">\n    <link rel=\"icon\" type=\"image/png\" href=\"{{ asset('assets') }}/img/favicon.png\">\n    <title>\n        Material Dashboard 2 by Creative Tim\n    </title>\n    <!--     Fonts and icons     -->\n    <link rel=\"stylesheet\" type=\"text/css\"\n        href=\"https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900|Roboto+Slab:400,700\" />\n    <!-- Nucleo Icons -->\n    <link href=\"{{ asset('assets') }}/css/nucleo-icons.css\" rel=\"stylesheet\" />\n    <link href=\"{{ asset('assets') }}/css/nucleo-svg.css\" rel=\"stylesheet\" />\n    <!-- Font Awesome Icons -->\n    <script src=\"https://kit.fontawesome.com/42d5adcbca.js\" crossorigin=\"anonymous\"></script>\n    <!-- Material Icons -->\n    <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons+Round\" rel=\"stylesheet\">\n    <!-- CSS Files -->\n    <link id=\"pagestyle\" href=\"{{ asset('assets') }}/css/material-dashboard.css?v=3.0.0\" rel=\"stylesheet\" />\n</head>\n\n<body class=\"g-sidenav-show rtl bg-gray-200\">\n    <aside\n        class=\"sidenav navbar navbar-vertical navbar-expand-xs border-0 border-radius-xl my-3 fixed-end me-3 rotate-caret  bg-gradient-dark\"\n        id=\"sidenav-main\">\n        <div class=\"sidenav-header\">\n            <i class=\"fas fa-times p-3 cursor-pointer text-white opacity-5 position-absolute start-0 top-0 d-none d-xl-none\"\n                aria-hidden=\"true\" id=\"iconSidenav\"></i>\n                <a class=\"navbar-brand m-0 d-flex text-wrap align-items-center\" href=\" {{ route('dashboard') }} \">\n                    <img src=\"{{ asset('assets') }}/img/logo-ct.png\" class=\"navbar-brand-img h-100\" alt=\"main_logo\">\n                    <span class=\"ms-1 font-weight-bold text-white\">Material Dashboard 2 Laravel</span>\n                </a>\n        </div>\n        <hr class=\"horizontal light mt-0 mb-2\">\n        <div class=\"collapse navbar-collapse px-0 w-auto  max-height-vh-100\" id=\"sidenav-collapse-main\">\n            <ul class=\"navbar-nav\">\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('dashboard') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">dashboard</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">لوحة القيادة</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('tables') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">table_view</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">الجداول</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('billing') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">receipt_long</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">الفواتير</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('virtual-reality') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">view_in_ar</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">الواقع الافتراضي</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link active\" href=\"{{ route('rtl') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">format_textdirection_r_to_l</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">RTL</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('notifications') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons opacity-10\">notifications</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">إشعارات</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('profile') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">person</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">حساب تعريفي</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('static-sign-in') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">login</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">تسجيل الدخول</span>\n                    </a>\n                </li>\n                <li class=\"nav-item\">\n                    <a class=\"nav-link \" href=\"{{ route('static-sign-up') }}\">\n                        <div class=\"text-white text-center ms-2 d-flex align-items-center justify-content-center\">\n                            <i class=\"material-icons-round opacity-10\">assignment</i>\n                        </div>\n                        <span class=\"nav-link-text me-1\">اشتراك</span>\n                    </a>\n                </li>\n            </ul>\n        </div>\n        <div class=\"sidenav-footer position-absolute w-100 bottom-0 \">\n            <div class=\"mx-3\">\n                <a class=\"btn bg-gradient-primary mt-4 w-100\"\n                    href=\"https://www.creative-tim.com/product/material-dashboard-pro-laravel\"\n                    type=\"button\">Upgrade to pro</a>\n            </div>\n        </div>\n    </aside>\n    <main class=\"main-content position-relative max-height-vh-100 h-100 border-radius-lg overflow-x-hidden\">\n        <!-- Navbar -->\n        <nav class=\"navbar navbar-main navbar-expand-lg px-0 mx-4 shadow-none border-radius-xl\" id=\"navbarBlur\"\n            navbar-scroll=\"true\">\n            <div class=\"container-fluid py-1 px-3\">\n                <nav aria-label=\"breadcrumb\">\n                    <ol class=\"breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 \">\n                        <li class=\"breadcrumb-item text-sm ps-2\"><a class=\"opacity-5 text-dark\"\n                                href=\"javascript:;\">لوحات القيادة</a></li>\n                        <li class=\"breadcrumb-item text-sm text-dark active\" aria-current=\"page\">RTL</li>\n                    </ol>\n                    <h6 class=\"font-weight-bolder mb-0\">RTL</h6>\n                </nav>\n                <div class=\"collapse navbar-collapse mt-sm-0 mt-2 px-0\" id=\"navbar\">\n                    <div class=\"ms-md-auto pe-md-3 d-flex align-items-center\">\n                        <div class=\"input-group input-group-outline\">\n                            <label class=\"form-label\">أكتب هنا...</label>\n                            <input type=\"text\" class=\"form-control\">\n                        </div>\n                    </div>\n                    <form method=\"POST\" action=\"{{ route('logout') }}\" class=\"d-none\" id=\"logout-form\">\n                        @csrf\n                    </form>\n                    <ul class=\"navbar-nav me-auto ms-0 justify-content-end\">\n                        <li class=\"nav-item d-flex align-items-center\">\n                            <a href=\"javascript:;\" class=\"nav-link text-body font-weight-bold px-0\">\n                                <i class=\"fa fa-user me-sm-1\"></i>\n                                <span class=\"d-sm-inline d-none\"\n                                    onclick=\"event.preventDefault();document.getElementById('logout-form').submit();\">يسجل دخول</span>\n                            </a>\n                        </li>\n                        <li class=\"nav-item d-xl-none pe-3 d-flex align-items-center\">\n                            <a href=\"javascript:;\" class=\"nav-link text-body p-0\" id=\"iconNavbarSidenav\">\n                                <div class=\"sidenav-toggler-inner\">\n                                    <i class=\"sidenav-toggler-line\"></i>\n                                    <i class=\"sidenav-toggler-line\"></i>\n                                    <i class=\"sidenav-toggler-line\"></i>\n                                </div>\n                            </a>\n                        </li>\n                        <li class=\"nav-item px-3 d-flex align-items-center\">\n                            <a href=\"javascript:;\" class=\"nav-link text-body p-0\">\n                                <i class=\"fa fa-cog fixed-plugin-button-nav cursor-pointer\"></i>\n                            </a>\n                        </li>\n                        <li class=\"nav-item dropdown ps-2 d-flex align-items-center\">\n                            <a href=\"javascript:;\" class=\"nav-link text-body p-0\" id=\"dropdownMenuButton\"\n                                data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                                <i class=\"fa fa-bell cursor-pointer\"></i>\n                            </a>\n                            <ul class=\"dropdown-menu  px-2 py-3 me-sm-n4\" aria-labelledby=\"dropdownMenuButton\">\n                                <li class=\"mb-2\">\n                                    <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                                        <div class=\"d-flex py-1\">\n                                            <div class=\"my-auto\">\n                                                <img src=\"{{ asset('assets') }}/img/team-2.jpg\"\n                                                    class=\"avatar avatar-sm  ms-3 \">\n                                            </div>\n                                            <div class=\"d-flex flex-column justify-content-center\">\n                                                <h6 class=\"text-sm font-weight-normal mb-1\">\n                                                    <span class=\"font-weight-bold\">New message</span> from Laur\n                                                </h6>\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    <i class=\"fa fa-clock me-1\"></i>\n                                                    13 minutes ago\n                                                </p>\n                                            </div>\n                                        </div>\n                                    </a>\n                                </li>\n                                <li class=\"mb-2\">\n                                    <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                                        <div class=\"d-flex py-1\">\n                                            <div class=\"my-auto\">\n                                                <img src=\"{{ asset('assets') }}/img/small-logos/logo-spotify.svg\"\n                                                    class=\"avatar avatar-sm bg-gradient-dark  ms-3 \">\n                                            </div>\n                                            <div class=\"d-flex flex-column justify-content-center\">\n                                                <h6 class=\"text-sm font-weight-normal mb-1\">\n                                                    <span class=\"font-weight-bold\">New album</span> by Travis Scott\n                                                </h6>\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    <i class=\"fa fa-clock me-1\"></i>\n                                                    1 day\n                                                </p>\n                                            </div>\n                                        </div>\n                                    </a>\n                                </li>\n                                <li>\n                                    <a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">\n                                        <div class=\"d-flex py-1\">\n                                            <div class=\"avatar avatar-sm bg-gradient-secondary  ms-3  my-auto\">\n                                                <svg width=\"12px\" height=\"12px\" viewBox=\"0 0 43 36\" version=\"1.1\"\n                                                    xmlns=\"http://www.w3.org/2000/svg\"\n                                                    xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                                                    <title>credit-card</title>\n                                                    <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                                                        <g transform=\"translate(-2169.000000, -745.000000)\"\n                                                            fill=\"#FFFFFF\" fill-rule=\"nonzero\">\n                                                            <g transform=\"translate(1716.000000, 291.000000)\">\n                                                                <g transform=\"translate(453.000000, 454.000000)\">\n                                                                    <path class=\"color-background\"\n                                                                        d=\"M43,10.7482083 L43,3.58333333 C43,1.60354167 41.3964583,0 39.4166667,0 L3.58333333,0 C1.60354167,0 0,1.60354167 0,3.58333333 L0,10.7482083 L43,10.7482083 Z\"\n                                                                        opacity=\"0.593633743\"></path>\n                                                                    <path class=\"color-background\"\n                                                                        d=\"M0,16.125 L0,32.25 C0,34.2297917 1.60354167,35.8333333 3.58333333,35.8333333 L39.4166667,35.8333333 C41.3964583,35.8333333 43,34.2297917 43,32.25 L43,16.125 L0,16.125 Z M19.7083333,26.875 L7.16666667,26.875 L7.16666667,23.2916667 L19.7083333,23.2916667 L19.7083333,26.875 Z M35.8333333,26.875 L28.6666667,26.875 L28.6666667,23.2916667 L35.8333333,23.2916667 L35.8333333,26.875 Z\">\n                                                                    </path>\n                                                                </g>\n                                                            </g>\n                                                        </g>\n                                                    </g>\n                                                </svg>\n                                            </div>\n                                            <div class=\"d-flex flex-column justify-content-center\">\n                                                <h6 class=\"text-sm font-weight-normal mb-1\">\n                                                    Payment successfully completed\n                                                </h6>\n                                                <p class=\"text-xs text-secondary mb-0\">\n                                                    <i class=\"fa fa-clock me-1\"></i>\n                                                    2 days\n                                                </p>\n                                            </div>\n                                        </div>\n                                    </a>\n                                </li>\n                            </ul>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </nav>\n        <!-- End Navbar -->\n        <div class=\"container-fluid py-4\">\n            <div class=\"row\">\n                <div class=\"col-lg-3 col-sm-6 mb-lg-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-dark shadow-dark text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">weekend</i>\n                            </div>\n                            <div class=\"text-start pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">أموال اليوم</p>\n                                <h4 class=\"mb-0\">$53k</h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0 text-start\"><span class=\"text-success text-sm font-weight-bolder ms-1\">+55%\n                                </span>من الأسبوع الماضي</p>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-3 col-sm-6 mb-lg-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-primary shadow-primary text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">leaderboard</i>\n                            </div>\n                            <div class=\"text-start pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">مستخدمو اليوم</p>\n                                <h4 class=\"mb-0\">2,300</h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0 text-start\"><span class=\"text-success text-sm font-weight-bolder ms-1\">+33%\n                                </span>من الأسبوع الماضي</p>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-3 col-sm-6 mb-lg-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-success shadow-success text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">store</i>\n                            </div>\n                            <div class=\"text-start pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">عملاء جدد</p>\n                                <h4 class=\"mb-0\">\n                                    <span class=\"text-danger text-sm font-weight-bolder ms-1\">-2%</span>\n                                    +3,462\n                                </h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0 text-start\"><span class=\"text-success text-sm font-weight-bolder ms-1\">+5%\n                                </span>من الشهر الماضي</p>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-3 col-sm-6\">\n                    <div class=\"card\">\n                        <div class=\"card-header p-3 pt-2\">\n                            <div\n                                class=\"icon icon-lg icon-shape bg-gradient-info shadow-info text-center border-radius-xl mt-n4 position-absolute\">\n                                <i class=\"material-icons opacity-10\">person_add</i>\n                            </div>\n                            <div class=\"text-start pt-1\">\n                                <p class=\"text-sm mb-0 text-capitalize\">مبيعات</p>\n                                <h4 class=\"mb-0\">$103,430</h4>\n                            </div>\n                        </div>\n                        <hr class=\"dark horizontal my-0\">\n                        <div class=\"card-footer p-3\">\n                            <p class=\"mb-0 text-start\"><span class=\"text-success text-sm font-weight-bolder ms-1\">+7%\n                                </span>مقارنة بيوم أمس</p>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row mt-4\">\n                <div class=\"col-lg-4 col-md-6 mt-4 mb-4\">\n                    <div class=\"card z-index-2 \">\n                        <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent\">\n                            <div class=\"bg-gradient-primary shadow-primary border-radius-lg py-3 pe-1\">\n                                <div class=\"chart\">\n                                    <canvas id=\"chart-bars\" class=\"chart-canvas\" height=\"170\"></canvas>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body\">\n                            <h6 class=\"mb-0 \">مشاهدات الموقع</h6>\n                            <p class=\"text-sm \">آخر أداء للحملة</p>\n                            <hr class=\"dark horizontal\">\n                            <div class=\"d-flex \">\n                                <i class=\"material-icons text-sm my-auto ms-1\">schedule</i>\n                                <p class=\"mb-0 text-sm\"> الحملة أرسلت قبل يومين </p>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-4 col-md-6 mt-4 mb-4\">\n                    <div class=\"card z-index-2  \">\n                        <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent\">\n                            <div class=\"bg-gradient-success shadow-success border-radius-lg py-3 pe-1\">\n                                <div class=\"chart\">\n                                    <canvas id=\"chart-line\" class=\"chart-canvas\" height=\"170\"></canvas>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body\">\n                            <h6 class=\"mb-0 \"> المبيعات اليومية </h6>\n                            <p class=\"text-sm \"> (<span class=\"font-weight-bolder\">+15%</span>) زيادة في مبيعات اليوم.\n                            </p>\n                            <hr class=\"dark horizontal\">\n                            <div class=\"d-flex \">\n                                <i class=\"material-icons text-sm my-auto ms-1\">schedule</i>\n                                <p class=\"mb-0 text-sm\"> تم التحديث منذ 4 دقائق </p>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-4 mt-4 mb-3\">\n                    <div class=\"card z-index-2 \">\n                        <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent\">\n                            <div class=\"bg-gradient-dark shadow-dark border-radius-lg py-3 pe-1\">\n                                <div class=\"chart\">\n                                    <canvas id=\"chart-line-tasks\" class=\"chart-canvas\" height=\"170\"></canvas>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body\">\n                            <h6 class=\"mb-0 \">المهام المكتملة</h6>\n                            <p class=\"text-sm \">آخر أداء للحملة</p>\n                            <hr class=\"dark horizontal\">\n                            <div class=\"d-flex \">\n                                <i class=\"material-icons text-sm my-auto me-1\">schedule</i>\n                                <p class=\"mb-0 text-sm\">تم تحديثه للتو</p>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"row my-4\">\n                <div class=\"col-lg-8 col-md-6 mb-md-0 mb-4\">\n                    <div class=\"card\">\n                        <div class=\"card-header pb-0\">\n                            <div class=\"row mb-3\">\n                                <div class=\"col-6\">\n                                    <h6>المشاريع</h6>\n                                    <p class=\"text-sm\">\n                                        <i class=\"fa fa-check text-info\" aria-hidden=\"true\"></i>\n                                        <span class=\"font-weight-bold ms-1\">30 انتهى</span> هذا الشهر\n                                    </p>\n                                </div>\n                                <div class=\"col-6 my-auto text-start\">\n                                    <div class=\"dropdown float-start ps-4\">\n                                        <a class=\"cursor-pointer\" id=\"dropdownTable\" data-bs-toggle=\"dropdown\"\n                                            aria-expanded=\"false\">\n                                            <i class=\"fa fa-ellipsis-v text-secondary\"></i>\n                                        </a>\n                                        <ul class=\"dropdown-menu dropdown-menu-end px-2 py-3 me-n4\"\n                                            aria-labelledby=\"dropdownTable\">\n                                            <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">عمل</a>\n                                            </li>\n                                            <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">عمل\n                                                    آخر</a></li>\n                                            <li><a class=\"dropdown-item border-radius-md\" href=\"javascript:;\">شيء آخر\n                                                    هنا</a></li>\n                                        </ul>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"card-body p-0 pb-2\">\n                            <div class=\"table-responsive\">\n                                <table class=\"table align-items-center mb-0\">\n                                    <thead>\n                                        <tr>\n                                            <th\n                                                class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                المشروع</th>\n                                            <th\n                                                class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">\n                                                أعضاء</th>\n                                            <th\n                                                class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                ميزانية</th>\n                                            <th\n                                                class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                إكمال</th>\n                                        </tr>\n                                    </thead>\n                                    <tbody>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-xd.svg\"\n                                                            class=\"avatar avatar-sm ms-3\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">Material XD الإصدار</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-2.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Alexander Smith\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $14,000 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">60%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-60\"\n                                                            role=\"progressbar\" aria-valuenow=\"60\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-atlassian.svg\"\n                                                            class=\"avatar avatar-sm ms-3\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">أضف مسار التقدم إلى التطبيق الداخلي\n                                                        </h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-2.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $3,000 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">10%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-10\"\n                                                            role=\"progressbar\" aria-valuenow=\"10\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-slack.svg\"\n                                                            class=\"avatar avatar-sm ms-3\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">إصلاح أخطاء النظام الأساسي</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> غير مضبوط </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">100%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-success w-100\"\n                                                            role=\"progressbar\" aria-valuenow=\"100\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-spotify.svg\"\n                                                            class=\"avatar avatar-sm ms-3\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">إطلاق تطبيق الهاتف المحمول الخاص بنا\n                                                        </h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Romina Hadid\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Alexander Smith\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $20,500 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">100%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-success w-100\"\n                                                            role=\"progressbar\" aria-valuenow=\"100\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"100\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-jira.svg\"\n                                                            class=\"avatar avatar-sm ms-3\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">أضف صفحة التسعير الجديدة</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $500 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">25%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-25\"\n                                                            role=\"progressbar\" aria-valuenow=\"25\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"25\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                        <tr>\n                                            <td>\n                                                <div class=\"d-flex px-2 py-1\">\n                                                    <div>\n                                                        <img src=\"{{ asset('assets') }}/img/small-logos/logo-invision.svg\"\n                                                            class=\"avatar avatar-sm ms-3\">\n                                                    </div>\n                                                    <div class=\"d-flex flex-column justify-content-center\">\n                                                        <h6 class=\"mb-0 text-sm\">إعادة تصميم متجر جديد على الإنترنت</h6>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                            <td>\n                                                <div class=\"avatar-group mt-2\">\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Ryan Tompson\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                    </a>\n                                                    <a href=\"javascript:;\" class=\"avatar avatar-xs rounded-circle\"\n                                                        data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\"\n                                                        title=\"Jessica Doe\">\n                                                        <img alt=\"Image placeholder\"\n                                                            src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                    </a>\n                                                </div>\n                                            </td>\n                                            <td class=\"align-middle text-center text-sm\">\n                                                <span class=\"text-xs font-weight-bold\"> $2,000 </span>\n                                            </td>\n                                            <td class=\"align-middle\">\n                                                <div class=\"progress-wrapper w-75 mx-auto\">\n                                                    <div class=\"progress-info\">\n                                                        <div class=\"progress-percentage\">\n                                                            <span class=\"text-xs font-weight-bold\">40%</span>\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"progress\">\n                                                        <div class=\"progress-bar bg-gradient-info w-40\"\n                                                            role=\"progressbar\" aria-valuenow=\"40\" aria-valuemin=\"0\"\n                                                            aria-valuemax=\"40\"></div>\n                                                    </div>\n                                                </div>\n                                            </td>\n                                        </tr>\n                                    </tbody>\n                                </table>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"col-lg-4 col-md-6\">\n                    <div class=\"card h-100\">\n                        <div class=\"card-header pb-0\">\n                            <h6>نظرة عامة على الطلبات</h6>\n                            <p class=\"text-sm\">\n                                <i class=\"fa fa-arrow-up text-success\" aria-hidden=\"true\"></i>\n                                <span class=\"font-weight-bold\">24%</span> هذا الشهر\n                            </p>\n                        </div>\n                        <div class=\"card-body p-3\">\n                            <div class=\"timeline timeline-one-side\">\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-success text-gradient\">notifications</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">$2400, تغييرات في التصميم\n                                        </h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">22 DEC 7:20 PM</p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-danger text-gradient\">code</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">طلب جديد #1832412</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">21 DEC 11 PM</p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-info text-gradient\">shopping_cart</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">مدفوعات الخادم لشهر أبريل\n                                        </h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">21 DEC 9:34 PM</p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-warning text-gradient\">credit_card</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">تمت إضافة بطاقة جديدة للطلب\n                                            #4395133</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">20 DEC 2:20 AM</p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block mb-3\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-primary text-gradient\">key</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">فتح الحزم من أجل التطوير\n                                        </h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">18 DEC 4:54 AM</p>\n                                    </div>\n                                </div>\n                                <div class=\"timeline-block\">\n                                    <span class=\"timeline-step\">\n                                        <i class=\"material-icons text-dark text-gradient\">payments</i>\n                                    </span>\n                                    <div class=\"timeline-content\">\n                                        <h6 class=\"text-dark text-sm font-weight-bold mb-0\">طلب جديد #9583120</h6>\n                                        <p class=\"text-secondary font-weight-bold text-xs mt-1 mb-0\">17 DEC</p>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <footer class=\"footer py-4  \">\n                <div class=\"container-fluid\">\n                    <div class=\"row align-items-center justify-content-lg-between\">\n                        <div class=\"col-lg-6 mb-lg-0 mb-4\">\n                            <div class=\"copyright text-center text-sm text-muted text-lg-end\">\n                                © <script>\n                                    document.write(new Date().getFullYear())\n\n                                </script>,\n                                made with <i class=\"fa fa-heart\"></i> by\n                                <a href=\"https://www.creative-tim.com\" class=\"font-weight-bold\" target=\"_blank\">Creative\n                                    Tim & UPDIVISION</a>\n                                for a better web.\n                            </div>\n                        </div>\n                        <div class=\"col-lg-6\">\n                            <ul class=\"nav nav-footer justify-content-center justify-content-lg-end\">\n                                <li class=\"nav-item\">\n                                    <a href=\"https://www.creative-tim.com\" class=\"nav-link text-muted\"\n                                        target=\"_blank\">Creative Tim</a>\n                                </li>\n                                <li class=\"nav-item\">\n                                    <a href=\"https://www.creative-tim.com/presentation\" class=\"nav-link text-muted\"\n                                        target=\"_blank\">About Us</a>\n                                </li>\n                                <li class=\"nav-item\">\n                                    <a href=\"https://www.creative-tim.com/blog\" class=\"nav-link text-muted\"\n                                        target=\"_blank\">Blog</a>\n                                </li>\n                                <li class=\"nav-item\">\n                                    <a href=\"https://www.creative-tim.com/license\" class=\"nav-link pe-0 text-muted\"\n                                        target=\"_blank\">License</a>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n            </footer>\n        </div>\n    </main>\n    <div class=\"fixed-plugin\">\n        <a class=\"fixed-plugin-button text-dark position-fixed px-3 py-2\">\n            <i class=\"material-icons py-2\">settings</i>\n        </a>\n        <div class=\"card shadow-lg\">\n            <div class=\"card-header pb-0 pt-3\">\n                <div class=\"float-end\">\n                    <h5 class=\"mt-3 mb-0\">Material UI Configurator</h5>\n                    <p>See our dashboard options.</p>\n                </div>\n                <div class=\"float-start mt-4\">\n                    <button class=\"btn btn-link text-dark p-0 fixed-plugin-close-button\">\n                        <i class=\"material-icons\">clear</i>\n                    </button>\n                </div>\n                <!-- End Toggle Button -->\n            </div>\n            <hr class=\"horizontal dark my-1\">\n            <div class=\"card-body pt-sm-3 pt-0\">\n                <!-- Sidebar Backgrounds -->\n                <div>\n                    <h6 class=\"mb-0\">Sidebar Colors</h6>\n                </div>\n                <a href=\"javascript:void(0)\" class=\"switch-trigger background-color\">\n                    <div class=\"badge-colors my-2 text-end\">\n                        <span class=\"badge filter bg-gradient-primary active\" data-color=\"primary\"\n                            onclick=\"sidebarColor(this)\"></span>\n                        <span class=\"badge filter bg-gradient-dark\" data-color=\"dark\"\n                            onclick=\"sidebarColor(this)\"></span>\n                        <span class=\"badge filter bg-gradient-info\" data-color=\"info\"\n                            onclick=\"sidebarColor(this)\"></span>\n                        <span class=\"badge filter bg-gradient-success\" data-color=\"success\"\n                            onclick=\"sidebarColor(this)\"></span>\n                        <span class=\"badge filter bg-gradient-warning\" data-color=\"warning\"\n                            onclick=\"sidebarColor(this)\"></span>\n                        <span class=\"badge filter bg-gradient-danger\" data-color=\"danger\"\n                            onclick=\"sidebarColor(this)\"></span>\n                    </div>\n                </a>\n                <!-- Sidenav Type -->\n                <div class=\"mt-3\">\n                    <h6 class=\"mb-0\">Sidenav Type</h6>\n                    <p class=\"text-sm\">Choose between 2 different sidenav types.</p>\n                </div>\n                <div class=\"d-flex\">\n                    <button class=\"btn bg-gradient-dark px-3 mb-2 active\" data-class=\"bg-gradient-dark\"\n                        onclick=\"sidebarType(this)\">Dark</button>\n                    <button class=\"btn bg-gradient-dark px-3 mb-2 ms-2\" data-class=\"bg-transparent\"\n                        onclick=\"sidebarType(this)\">Transparent</button>\n                    <button class=\"btn bg-gradient-dark px-3 mb-2 me-2\" data-class=\"bg-white\"\n                        onclick=\"sidebarType(this)\">White</button>\n                </div>\n                <p class=\"text-sm d-xl-none d-block mt-2\">You can change the sidenav type just on desktop view.</p>\n                <!-- Navbar Fixed -->\n                <div class=\"mt-3 d-flex\">\n                    <h6 class=\"mb-0\">Navbar Fixed</h6>\n                    <div class=\"form-check form-switch me-auto my-auto\">\n                        <input class=\"form-check-input mt-1 float-end me-auto\" type=\"checkbox\" id=\"navbarFixed\"\n                            onclick=\"navbarFixed(this)\">\n                    </div>\n                </div>\n                <hr class=\"horizontal dark my-3\">\n                <div class=\"mt-2 d-flex\">\n                    <h6 class=\"mb-0\">Light / Dark</h6>\n                    <div class=\"form-check form-switch me-auto my-auto\">\n                        <input class=\"form-check-input mt-1 float-end me-auto\" type=\"checkbox\" id=\"dark-version\"\n                            onclick=\"darkMode(this)\">\n                    </div>\n                </div>\n                <hr class=\"horizontal dark my-sm-4\">\n                <a class=\"btn btn-outline-dark w-100\" href=\"\">View documentation</a>\n                <div class=\"w-100 text-center\">\n                    <a class=\"github-button\" href=\"https://github.com/creativetimofficial/material-dashboard\"\n                        data-icon=\"octicon-star\" data-size=\"large\" data-show-count=\"true\"\n                        aria-label=\"Star creativetimofficial/material-dashboard on GitHub\">Star</a>\n                    <h6 class=\"mt-3\">Thank you for sharing!</h6>\n                    <a href=\"https://twitter.com/intent/tweet?text=Check%20Material%20UI%20Dashboard%20made%20by%20%40CreativeTim%20%23webdesign%20%23dashboard%20%23bootstrap5&amp;url=https%3A%2F%2Fwww.creative-tim.com%2Fproduct%2Fsoft-ui-dashboard\"\n                        class=\"btn btn-dark mb-0 me-2\" target=\"_blank\">\n                        <i class=\"fab fa-twitter me-1\" aria-hidden=\"true\"></i> Tweet\n                    </a>\n                    <a href=\"https://www.facebook.com/sharer/sharer.php?u=https://www.creative-tim.com/product/material-dashboard\"\n                        class=\"btn btn-dark mb-0 me-2\" target=\"_blank\">\n                        <i class=\"fab fa-facebook-square me-1\" aria-hidden=\"true\"></i> Share\n                    </a>\n                </div>\n            </div>\n        </div>\n    </div>\n    <!--   Core JS Files   -->\n    <script src=\"{{ asset('assets') }}/js/core/popper.min.js\"></script>\n    <script src=\"{{ asset('assets') }}/js/core/bootstrap.min.js\"></script>\n    <script src=\"{{ asset('assets') }}/js/plugins/perfect-scrollbar.min.js\"></script>\n    <script src=\"{{ asset('assets') }}/js/plugins/smooth-scrollbar.min.js\"></script>\n    <script src=\"{{ asset('assets') }}/js/plugins/chartjs.min.js\"></script>\n    <script>\n        var ctx = document.getElementById(\"chart-bars\").getContext(\"2d\");\n\n        new Chart(ctx, {\n            type: \"bar\",\n            data: {\n                labels: [\"M\", \"T\", \"W\", \"T\", \"F\", \"S\", \"S\"],\n                datasets: [{\n                    label: \"Sales\",\n                    tension: 0.4,\n                    borderWidth: 0,\n                    borderRadius: 4,\n                    borderSkipped: false,\n                    backgroundColor: \"rgba(255, 255, 255, .8)\",\n                    data: [50, 20, 10, 22, 50, 10, 40],\n                    maxBarThickness: 6\n                }, ],\n            },\n            options: {\n                responsive: true,\n                maintainAspectRatio: false,\n                plugins: {\n                    legend: {\n                        display: false,\n                    }\n                },\n                interaction: {\n                    intersect: false,\n                    mode: 'index',\n                },\n                scales: {\n                    y: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            suggestedMin: 0,\n                            suggestedMax: 500,\n                            beginAtZero: true,\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                            color: \"#fff\"\n                        },\n                    },\n                    x: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                },\n            },\n        });\n\n\n        var ctx2 = document.getElementById(\"chart-line\").getContext(\"2d\");\n\n        new Chart(ctx2, {\n            type: \"line\",\n            data: {\n                labels: [\"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"],\n                datasets: [{\n                    label: \"Mobile apps\",\n                    tension: 0,\n                    borderWidth: 0,\n                    pointRadius: 5,\n                    pointBackgroundColor: \"rgba(255, 255, 255, .8)\",\n                    pointBorderColor: \"transparent\",\n                    borderColor: \"rgba(255, 255, 255, .8)\",\n                    borderColor: \"rgba(255, 255, 255, .8)\",\n                    borderWidth: 4,\n                    backgroundColor: \"transparent\",\n                    fill: true,\n                    data: [50, 40, 300, 320, 500, 350, 200, 230, 500],\n                    maxBarThickness: 6\n\n                }],\n            },\n            options: {\n                responsive: true,\n                maintainAspectRatio: false,\n                plugins: {\n                    legend: {\n                        display: false,\n                    }\n                },\n                interaction: {\n                    intersect: false,\n                    mode: 'index',\n                },\n                scales: {\n                    y: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                    x: {\n                        grid: {\n                            drawBorder: false,\n                            display: false,\n                            drawOnChartArea: false,\n                            drawTicks: false,\n                            borderDash: [5, 5]\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                },\n            },\n        });\n\n        var ctx3 = document.getElementById(\"chart-line-tasks\").getContext(\"2d\");\n\n        new Chart(ctx3, {\n            type: \"line\",\n            data: {\n                labels: [\"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"],\n                datasets: [{\n                    label: \"Mobile apps\",\n                    tension: 0,\n                    borderWidth: 0,\n                    pointRadius: 5,\n                    pointBackgroundColor: \"rgba(255, 255, 255, .8)\",\n                    pointBorderColor: \"transparent\",\n                    borderColor: \"rgba(255, 255, 255, .8)\",\n                    borderWidth: 4,\n                    backgroundColor: \"transparent\",\n                    fill: true,\n                    data: [50, 40, 300, 220, 500, 250, 400, 230, 500],\n                    maxBarThickness: 6\n\n                }],\n            },\n            options: {\n                responsive: true,\n                maintainAspectRatio: false,\n                plugins: {\n                    legend: {\n                        display: false,\n                    }\n                },\n                interaction: {\n                    intersect: false,\n                    mode: 'index',\n                },\n                scales: {\n                    y: {\n                        grid: {\n                            drawBorder: false,\n                            display: true,\n                            drawOnChartArea: true,\n                            drawTicks: false,\n                            borderDash: [5, 5],\n                            color: 'rgba(255, 255, 255, .2)'\n                        },\n                        ticks: {\n                            display: true,\n                            padding: 10,\n                            color: '#f8f9fa',\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                    x: {\n                        grid: {\n                            drawBorder: false,\n                            display: false,\n                            drawOnChartArea: false,\n                            drawTicks: false,\n                            borderDash: [5, 5]\n                        },\n                        ticks: {\n                            display: true,\n                            color: '#f8f9fa',\n                            padding: 10,\n                            font: {\n                                size: 14,\n                                weight: 300,\n                                family: \"Roboto\",\n                                style: 'normal',\n                                lineHeight: 2\n                            },\n                        }\n                    },\n                },\n            },\n        });\n\n    </script>\n    <script>\n        var win = navigator.platform.indexOf('Win') > -1;\n        if (win && document.querySelector('#sidenav-scrollbar')) {\n            var options = {\n                damping: '0.5'\n            }\n            Scrollbar.init(document.querySelector('#sidenav-scrollbar'), options);\n        }\n\n    </script>\n    <!-- Github buttons -->\n    <script async defer src=\"https://buttons.github.io/buttons.js\"></script>\n    <!-- Control Center for Material Dashboard: parallax effects, scripts for the example pages etc -->\n    <script src=\"{{ asset('assets') }}/js/material-dashboard.min.js?v=3.0.0\"></script>\n</body>\n\n</html>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/static-sign-in.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n    <div class=\"container position-sticky z-index-sticky top-0\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <!-- Navbar -->\n                <x-navbars.navs.guest signin='static-sign-in' signup='static-sign-up'></x-navbars.navs.guest>\n                <!-- End Navbar -->\n            </div>\n        </div>\n    </div>\n    <main class=\"main-content  mt-0\">\n        <div class=\"page-header align-items-start min-vh-100\"\n            style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n            <span class=\"mask bg-gradient-dark opacity-6\"></span>\n            <div class=\"container my-auto\">\n                <div class=\"row\">\n                    <div class=\"col-lg-4 col-md-8 col-12 mx-auto\">\n                        <div class=\"card z-index-0 fadeIn3 fadeInBottom\">\n                            <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                                <div class=\"bg-gradient-primary shadow-primary border-radius-lg py-3 pe-1\">\n                                    <h4 class=\"text-white font-weight-bolder text-center mt-2 mb-0\">Sign in</h4>\n                                    <div class=\"row mt-3\">\n                                        <div class=\"col-2 text-center ms-auto\">\n                                            <a class=\"btn btn-link px-3\" href=\"javascript:;\">\n                                                <i class=\"fa fa-facebook text-white text-lg\"></i>\n                                            </a>\n                                        </div>\n                                        <div class=\"col-2 text-center px-1\">\n                                            <a class=\"btn btn-link px-3\" href=\"javascript:;\">\n                                                <i class=\"fa fa-github text-white text-lg\"></i>\n                                            </a>\n                                        </div>\n                                        <div class=\"col-2 text-center me-auto\">\n                                            <a class=\"btn btn-link px-3\" href=\"javascript:;\">\n                                                <i class=\"fa fa-google text-white text-lg\"></i>\n                                            </a>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                            <div class=\"card-body\">\n                                <form role=\"form\" class=\"text-start\">\n                                    <div class=\"input-group input-group-outline my-3\">\n                                        <label class=\"form-label\">Email</label>\n                                        <input type=\"email\" class=\"form-control\" name=\"email\" required>\n                                    </div>\n                                    <div class=\"input-group input-group-outline mb-3\">\n                                        <label class=\"form-label\">Password</label>\n                                        <input type=\"password\" class=\"form-control\" name=\"password\" required>\n                                    </div>\n                                    <div class=\"form-check form-switch d-flex align-items-center mb-3\">\n                                        <input class=\"form-check-input\" type=\"checkbox\" id=\"rememberMe\">\n                                        <label class=\"form-check-label mb-0 ms-2\" for=\"rememberMe\">Remember\n                                            me</label>\n                                    </div>\n                                    <div class=\"text-center\">\n                                        <button type=\"submit\" class=\"btn bg-gradient-primary w-100 my-4 mb-2\">Sign\n                                            in</button>\n                                    </div>\n                                    <p class=\"mt-4 text-sm text-center\">\n                                        Don't have an account?\n                                        <a href=\"{{ route('static-sign-up') }}\"\n                                            class=\"text-primary text-gradient font-weight-bold\">Sign up</a>\n                                    </p>\n                                </form>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <x-footers.guest></x-footers.guest>\n        </div>\n    </main>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/static-sign-up.blade.php",
    "content": "<x-layout bodyClass=\"\">\n\n    <div>\n        <div class=\"container position-sticky z-index-sticky top-0\">\n            <div class=\"row\">\n                <div class=\"col-12\">\n                    <!-- Navbar -->\n                    <x-navbars.navs.guest signin='static-sign-in' signup='static-sign-up'></x-navbars.navs.guest>\n                    <!-- End Navbar -->\n                </div>\n            </div>\n        </div>\n        <main class=\"main-content  mt-0\">\n            <section>\n                <div class=\"page-header min-vh-100\">\n                    <div class=\"container\">\n                        <div class=\"row\">\n                            <div\n                                class=\"col-6 d-lg-flex d-none h-100 my-auto pe-0 position-absolute top-0 start-0 text-center justify-content-center flex-column\">\n                                <div class=\"position-relative bg-gradient-primary h-100 m-3 px-7 border-radius-lg d-flex flex-column justify-content-center\"\n                                    style=\"background-image: url('{{ asset('assets') }}/img/illustrations/illustration-signup.jpg'); background-size: cover;\">\n                                </div>\n                            </div>\n                            <div\n                                class=\"col-xl-4 col-lg-5 col-md-7 d-flex flex-column ms-auto me-auto ms-lg-auto me-lg-5\">\n                                <div class=\"card card-plain\">\n                                    <div class=\"card-header\">\n                                        <h4 class=\"font-weight-bolder\">Sign Up</h4>\n                                        <p class=\"mb-0\">Enter your email and password to register</p>\n                                    </div>\n                                    <div class=\"card-body\">\n                                        <form>\n                                            <div class=\"input-group input-group-outline mb-3\">\n                                                <label class=\"form-label\">Name</label>\n                                                <input type=\"text\" class=\"form-control\" name=\"name\" required>\n                                            </div>\n                                            <div class=\"input-group input-group-outline mb-3\">\n                                                <label class=\"form-label\">Email</label>\n                                                <input type=\"email\" class=\"form-control\" name=\"email\" required>\n                                            </div>\n                                            <div class=\"input-group input-group-outline mb-3\">\n                                                <label class=\"form-label\">Password</label>\n                                                <input type=\"password\" class=\"form-control\" name=\"password\" required>\n                                            </div>\n                                            <div class=\"form-check form-check-info text-start ps-0\">\n                                                <input class=\"form-check-input\" type=\"checkbox\" value=\"\"\n                                                    id=\"flexCheckDefault\" checked>\n                                                <label class=\"form-check-label\" for=\"flexCheckDefault\">\n                                                    I agree the <a href=\"javascript:;\"\n                                                        class=\"text-dark font-weight-bolder\">Terms and Conditions</a>\n                                                </label>\n                                            </div>\n                                            <div class=\"text-center\">\n                                                <button type=\"submit\"\n                                                    class=\"btn btn-lg bg-gradient-primary btn-lg w-100 mt-4 mb-0\">Sign\n                                                    Up</button>\n                                            </div>\n                                        </form>\n                                    </div>\n                                    <div class=\"card-footer text-center pt-0 px-lg-2 px-1\">\n                                        <p class=\"mb-2 text-sm mx-auto\">\n                                            Already have an account?\n                                            <a href=\"{{ route('static-sign-in') }}\"\n                                                class=\"text-primary text-gradient font-weight-bold\">Sign in</a>\n                                        </p>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </section>\n        </main>\n    </div>\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/tables.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show  bg-gray-200\">\n        <x-navbars.sidebar activePage=\"tables\"></x-navbars.sidebar>\n        <main class=\"main-content position-relative max-height-vh-100 h-100 border-radius-lg \">\n            <!-- Navbar -->\n            <x-navbars.navs.auth titlePage=\"Tables\"></x-navbars.navs.auth>\n            <!-- End Navbar -->\n            <div class=\"container-fluid py-4\">\n                <div class=\"row\">\n                    <div class=\"col-12\">\n                        <div class=\"card my-4\">\n                            <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                                <div class=\"bg-gradient-primary shadow-primary border-radius-lg pt-4 pb-3\">\n                                    <h6 class=\"text-white text-capitalize ps-3\">Authors table</h6>\n                                </div>\n                            </div>\n                            <div class=\"card-body px-0 pb-2\">\n                                <div class=\"table-responsive p-0\">\n                                    <table class=\"table align-items-center mb-0\">\n                                        <thead>\n                                            <tr>\n                                                <th\n                                                    class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                    Author</th>\n                                                <th\n                                                    class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">\n                                                    Function</th>\n                                                <th\n                                                    class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                    Status</th>\n                                                <th\n                                                    class=\"text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                    Employed</th>\n                                                <th class=\"text-secondary opacity-7\"></th>\n                                            </tr>\n                                        </thead>\n                                        <tbody>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2 py-1\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/team-2.jpg\"\n                                                                class=\"avatar avatar-sm me-3 border-radius-lg\"\n                                                                alt=\"user1\">\n                                                        </div>\n                                                        <div class=\"d-flex flex-column justify-content-center\">\n                                                            <h6 class=\"mb-0 text-sm\">John Michael</h6>\n                                                            <p class=\"text-xs text-secondary mb-0\">john@creative-tim.com\n                                                            </p>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-xs font-weight-bold mb-0\">Manager</p>\n                                                    <p class=\"text-xs text-secondary mb-0\">Organization</p>\n                                                </td>\n                                                <td class=\"align-middle text-center text-sm\">\n                                                    <span class=\"badge badge-sm bg-gradient-success\">Online</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <span\n                                                        class=\"text-secondary text-xs font-weight-bold\">23/04/18</span>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <a href=\"javascript:;\"\n                                                        class=\"text-secondary font-weight-bold text-xs\"\n                                                        data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                                                        Edit\n                                                    </a>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2 py-1\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/team-3.jpg\"\n                                                                class=\"avatar avatar-sm me-3 border-radius-lg\"\n                                                                alt=\"user2\">\n                                                        </div>\n                                                        <div class=\"d-flex flex-column justify-content-center\">\n                                                            <h6 class=\"mb-0 text-sm\">Alexa Liras</h6>\n                                                            <p class=\"text-xs text-secondary mb-0\">\n                                                                alexa@creative-tim.com</p>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-xs font-weight-bold mb-0\">Programator</p>\n                                                    <p class=\"text-xs text-secondary mb-0\">Developer</p>\n                                                </td>\n                                                <td class=\"align-middle text-center text-sm\">\n                                                    <span class=\"badge badge-sm bg-gradient-secondary\">Offline</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <span\n                                                        class=\"text-secondary text-xs font-weight-bold\">11/01/19</span>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <a href=\"javascript:;\"\n                                                        class=\"text-secondary font-weight-bold text-xs\"\n                                                        data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                                                        Edit\n                                                    </a>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2 py-1\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/team-4.jpg\"\n                                                                class=\"avatar avatar-sm me-3 border-radius-lg\"\n                                                                alt=\"user3\">\n                                                        </div>\n                                                        <div class=\"d-flex flex-column justify-content-center\">\n                                                            <h6 class=\"mb-0 text-sm\">Laurent Perrier</h6>\n                                                            <p class=\"text-xs text-secondary mb-0\">\n                                                                laurent@creative-tim.com</p>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-xs font-weight-bold mb-0\">Executive</p>\n                                                    <p class=\"text-xs text-secondary mb-0\">Projects</p>\n                                                </td>\n                                                <td class=\"align-middle text-center text-sm\">\n                                                    <span class=\"badge badge-sm bg-gradient-success\">Online</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <span\n                                                        class=\"text-secondary text-xs font-weight-bold\">19/09/17</span>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <a href=\"javascript:;\"\n                                                        class=\"text-secondary font-weight-bold text-xs\"\n                                                        data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                                                        Edit\n                                                    </a>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2 py-1\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/team-3.jpg\"\n                                                                class=\"avatar avatar-sm me-3 border-radius-lg\"\n                                                                alt=\"user4\">\n                                                        </div>\n                                                        <div class=\"d-flex flex-column justify-content-center\">\n                                                            <h6 class=\"mb-0 text-sm\">Michael Levi</h6>\n                                                            <p class=\"text-xs text-secondary mb-0\">\n                                                                michael@creative-tim.com</p>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-xs font-weight-bold mb-0\">Programator</p>\n                                                    <p class=\"text-xs text-secondary mb-0\">Developer</p>\n                                                </td>\n                                                <td class=\"align-middle text-center text-sm\">\n                                                    <span class=\"badge badge-sm bg-gradient-success\">Online</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <span\n                                                        class=\"text-secondary text-xs font-weight-bold\">24/12/08</span>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <a href=\"javascript:;\"\n                                                        class=\"text-secondary font-weight-bold text-xs\"\n                                                        data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                                                        Edit\n                                                    </a>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2 py-1\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/team-2.jpg\"\n                                                                class=\"avatar avatar-sm me-3 border-radius-lg\"\n                                                                alt=\"user5\">\n                                                        </div>\n                                                        <div class=\"d-flex flex-column justify-content-center\">\n                                                            <h6 class=\"mb-0 text-sm\">Richard Gran</h6>\n                                                            <p class=\"text-xs text-secondary mb-0\">\n                                                                richard@creative-tim.com</p>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-xs font-weight-bold mb-0\">Manager</p>\n                                                    <p class=\"text-xs text-secondary mb-0\">Executive</p>\n                                                </td>\n                                                <td class=\"align-middle text-center text-sm\">\n                                                    <span class=\"badge badge-sm bg-gradient-secondary\">Offline</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <span\n                                                        class=\"text-secondary text-xs font-weight-bold\">04/10/21</span>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <a href=\"javascript:;\"\n                                                        class=\"text-secondary font-weight-bold text-xs\"\n                                                        data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                                                        Edit\n                                                    </a>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2 py-1\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/team-4.jpg\"\n                                                                class=\"avatar avatar-sm me-3 border-radius-lg\"\n                                                                alt=\"user6\">\n                                                        </div>\n                                                        <div class=\"d-flex flex-column justify-content-center\">\n                                                            <h6 class=\"mb-0 text-sm\">Miriam Eric</h6>\n                                                            <p class=\"text-xs text-secondary mb-0\">\n                                                                miriam@creative-tim.com</p>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-xs font-weight-bold mb-0\">Programator</p>\n                                                    <p class=\"text-xs text-secondary mb-0\">Developer</p>\n                                                </td>\n                                                <td class=\"align-middle text-center text-sm\">\n                                                    <span class=\"badge badge-sm bg-gradient-secondary\">Offline</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <span\n                                                        class=\"text-secondary text-xs font-weight-bold\">14/09/20</span>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <a href=\"javascript:;\"\n                                                        class=\"text-secondary font-weight-bold text-xs\"\n                                                        data-toggle=\"tooltip\" data-original-title=\"Edit user\">\n                                                        Edit\n                                                    </a>\n                                                </td>\n                                            </tr>\n                                        </tbody>\n                                    </table>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"row\">\n                    <div class=\"col-12\">\n                        <div class=\"card my-4\">\n                            <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                                <div class=\"bg-gradient-primary shadow-primary border-radius-lg pt-4 pb-3\">\n                                    <h6 class=\"text-white text-capitalize ps-3\">Projects table</h6>\n                                </div>\n                            </div>\n                            <div class=\"card-body px-0 pb-2\">\n                                <div class=\"table-responsive p-0\">\n                                    <table class=\"table align-items-center justify-content-center mb-0\">\n                                        <thead>\n                                            <tr>\n                                                <th\n                                                    class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7\">\n                                                    Project</th>\n                                                <th\n                                                    class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">\n                                                    Budget</th>\n                                                <th\n                                                    class=\"text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2\">\n                                                    Status</th>\n                                                <th\n                                                    class=\"text-uppercase text-secondary text-xxs font-weight-bolder text-center opacity-7 ps-2\">\n                                                    Completion</th>\n                                                <th></th>\n                                            </tr>\n                                        </thead>\n                                        <tbody>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/small-logos/logo-asana.svg\"\n                                                                class=\"avatar avatar-sm rounded-circle me-2\"\n                                                                alt=\"spotify\">\n                                                        </div>\n                                                        <div class=\"my-auto\">\n                                                            <h6 class=\"mb-0 text-sm\">Asana</h6>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-sm font-weight-bold mb-0\">$2,500</p>\n                                                </td>\n                                                <td>\n                                                    <span class=\"text-xs font-weight-bold\">working</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <div class=\"d-flex align-items-center justify-content-center\">\n                                                        <span class=\"me-2 text-xs font-weight-bold\">60%</span>\n                                                        <div>\n                                                            <div class=\"progress\">\n                                                                <div class=\"progress-bar bg-gradient-info\"\n                                                                    role=\"progressbar\" aria-valuenow=\"60\"\n                                                                    aria-valuemin=\"0\" aria-valuemax=\"100\"\n                                                                    style=\"width: 60%;\"></div>\n                                                            </div>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <button class=\"btn btn-link text-secondary mb-0\">\n                                                        <i class=\"fa fa-ellipsis-v text-xs\"></i>\n                                                    </button>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/small-logos/github.svg\"\n                                                                class=\"avatar avatar-sm rounded-circle me-2\"\n                                                                alt=\"invision\">\n                                                        </div>\n                                                        <div class=\"my-auto\">\n                                                            <h6 class=\"mb-0 text-sm\">Github</h6>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-sm font-weight-bold mb-0\">$5,000</p>\n                                                </td>\n                                                <td>\n                                                    <span class=\"text-xs font-weight-bold\">done</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <div class=\"d-flex align-items-center justify-content-center\">\n                                                        <span class=\"me-2 text-xs font-weight-bold\">100%</span>\n                                                        <div>\n                                                            <div class=\"progress\">\n                                                                <div class=\"progress-bar bg-gradient-success\"\n                                                                    role=\"progressbar\" aria-valuenow=\"100\"\n                                                                    aria-valuemin=\"0\" aria-valuemax=\"100\"\n                                                                    style=\"width: 100%;\"></div>\n                                                            </div>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <button class=\"btn btn-link text-secondary mb-0\"\n                                                        aria-haspopup=\"true\" aria-expanded=\"false\">\n                                                        <i class=\"fa fa-ellipsis-v text-xs\"></i>\n                                                    </button>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/small-logos/logo-atlassian.svg\"\n                                                                class=\"avatar avatar-sm rounded-circle me-2\" alt=\"jira\">\n                                                        </div>\n                                                        <div class=\"my-auto\">\n                                                            <h6 class=\"mb-0 text-sm\">Atlassian</h6>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-sm font-weight-bold mb-0\">$3,400</p>\n                                                </td>\n                                                <td>\n                                                    <span class=\"text-xs font-weight-bold\">canceled</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <div class=\"d-flex align-items-center justify-content-center\">\n                                                        <span class=\"me-2 text-xs font-weight-bold\">30%</span>\n                                                        <div>\n                                                            <div class=\"progress\">\n                                                                <div class=\"progress-bar bg-gradient-danger\"\n                                                                    role=\"progressbar\" aria-valuenow=\"30\"\n                                                                    aria-valuemin=\"0\" aria-valuemax=\"30\"\n                                                                    style=\"width: 30%;\"></div>\n                                                            </div>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <button class=\"btn btn-link text-secondary mb-0\"\n                                                        aria-haspopup=\"true\" aria-expanded=\"false\">\n                                                        <i class=\"fa fa-ellipsis-v text-xs\"></i>\n                                                    </button>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/small-logos/bootstrap.svg\"\n                                                                class=\"avatar avatar-sm rounded-circle me-2\"\n                                                                alt=\"webdev\">\n                                                        </div>\n                                                        <div class=\"my-auto\">\n                                                            <h6 class=\"mb-0 text-sm\">Bootstrap</h6>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-sm font-weight-bold mb-0\">$14,000</p>\n                                                </td>\n                                                <td>\n                                                    <span class=\"text-xs font-weight-bold\">working</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <div class=\"d-flex align-items-center justify-content-center\">\n                                                        <span class=\"me-2 text-xs font-weight-bold\">80%</span>\n                                                        <div>\n                                                            <div class=\"progress\">\n                                                                <div class=\"progress-bar bg-gradient-info\"\n                                                                    role=\"progressbar\" aria-valuenow=\"80\"\n                                                                    aria-valuemin=\"0\" aria-valuemax=\"80\"\n                                                                    style=\"width: 80%;\"></div>\n                                                            </div>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <button class=\"btn btn-link text-secondary mb-0\"\n                                                        aria-haspopup=\"true\" aria-expanded=\"false\">\n                                                        <i class=\"fa fa-ellipsis-v text-xs\"></i>\n                                                    </button>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/small-logos/logo-slack.svg\"\n                                                                class=\"avatar avatar-sm rounded-circle me-2\"\n                                                                alt=\"slack\">\n                                                        </div>\n                                                        <div class=\"my-auto\">\n                                                            <h6 class=\"mb-0 text-sm\">Slack</h6>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-sm font-weight-bold mb-0\">$1,000</p>\n                                                </td>\n                                                <td>\n                                                    <span class=\"text-xs font-weight-bold\">canceled</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <div class=\"d-flex align-items-center justify-content-center\">\n                                                        <span class=\"me-2 text-xs font-weight-bold\">0%</span>\n                                                        <div>\n                                                            <div class=\"progress\">\n                                                                <div class=\"progress-bar bg-gradient-success\"\n                                                                    role=\"progressbar\" aria-valuenow=\"0\"\n                                                                    aria-valuemin=\"0\" aria-valuemax=\"0\"\n                                                                    style=\"width: 0%;\"></div>\n                                                            </div>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <button class=\"btn btn-link text-secondary mb-0\"\n                                                        aria-haspopup=\"true\" aria-expanded=\"false\">\n                                                        <i class=\"fa fa-ellipsis-v text-xs\"></i>\n                                                    </button>\n                                                </td>\n                                            </tr>\n                                            <tr>\n                                                <td>\n                                                    <div class=\"d-flex px-2\">\n                                                        <div>\n                                                            <img src=\"{{ asset('assets') }}/img/small-logos/devto.svg\"\n                                                                class=\"avatar avatar-sm rounded-circle me-2\" alt=\"xd\">\n                                                        </div>\n                                                        <div class=\"my-auto\">\n                                                            <h6 class=\"mb-0 text-sm\">Devto</h6>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td>\n                                                    <p class=\"text-sm font-weight-bold mb-0\">$2,300</p>\n                                                </td>\n                                                <td>\n                                                    <span class=\"text-xs font-weight-bold\">done</span>\n                                                </td>\n                                                <td class=\"align-middle text-center\">\n                                                    <div class=\"d-flex align-items-center justify-content-center\">\n                                                        <span class=\"me-2 text-xs font-weight-bold\">100%</span>\n                                                        <div>\n                                                            <div class=\"progress\">\n                                                                <div class=\"progress-bar bg-gradient-success\"\n                                                                    role=\"progressbar\" aria-valuenow=\"100\"\n                                                                    aria-valuemin=\"0\" aria-valuemax=\"100\"\n                                                                    style=\"width: 100%;\"></div>\n                                                            </div>\n                                                        </div>\n                                                    </div>\n                                                </td>\n                                                <td class=\"align-middle\">\n                                                    <button class=\"btn btn-link text-secondary mb-0\"\n                                                        aria-haspopup=\"true\" aria-expanded=\"false\">\n                                                        <i class=\"fa fa-ellipsis-v text-xs\"></i>\n                                                    </button>\n                                                </td>\n                                            </tr>\n                                        </tbody>\n                                    </table>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <x-footers.auth></x-footers.auth>\n            </div>\n        </main>\n        <x-plugins></x-plugins>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/pages/virtual-reality.blade.php",
    "content": "<x-layout bodyClass=\"g-sidenav-show  bg-gray-200 virtual-reality\">\n\n    <div class=\"mt-n3\">\n        <!-- Navbar -->\n        <x-navbars.navs.auth titlePage=\"Virtual Reality\"></x-navbars.navs.auth>\n        <!-- End Navbar -->\n    </div>\n    <div class=\"border-radius-xl mx-2 mx-md-3 position-relative\"\n        style=\"background-image: url('{{ asset('assets') }}/img/vr-bg.jpg'); background-size: cover;\">\n        <x-navbars.sidebar activePage=\"virtual-reality\"></x-navbars.sidebar>\n        <main class=\"main-content border-radius-lg h-100\">\n            <div class=\"section min-vh-85 position-relative transform-scale-0 transform-scale-md-7\">\n                <div class=\"container-fluid\">\n                    <div class=\"row pt-10\">\n                        <div class=\"col-lg-1 col-md-1 pt-5 pt-lg-0 ms-lg-5 text-center\">\n                            <a href=\"javascript:;\" class=\"avatar avatar-lg border-0 p-1\" data-bs-toggle=\"tooltip\"\n                                data-bs-placement=\"right\" title=\"My Profile\">\n                                <img class=\"border-radius-lg\" alt=\"Image placeholder\"\n                                    src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                            </a>\n                            <button class=\"btn btn-white border-radius-lg p-2 mt-n4 mt-md-2\" type=\"button\"\n                                data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" title=\"Home\">\n                                <i class=\"material-icons p-2\">home</i>\n                            </button>\n                            <button class=\"btn btn-white border-radius-lg p-2 mt-n4 mt-md-0\" type=\"button\"\n                                data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" title=\"Search\">\n                                <i class=\"material-icons p-2\">search</i>\n                            </button>\n                            <button class=\"btn btn-white border-radius-lg p-2 mt-n4 mt-md-0\" type=\"button\"\n                                data-bs-toggle=\"tooltip\" data-bs-placement=\"right\" title=\"Minimize\">\n                                <i class=\"material-icons p-2\">more_horiz</i>\n                            </button>\n                        </div>\n                        <div class=\"col-lg-8 col-md-11 ps-md-5 mb-5 mb-md-0\">\n                            <div class=\"d-flex\">\n                                <div class=\"me-auto\">\n                                    <h1 class=\"display-1 font-weight-bold mt-n3 mb-0 text-white\">28°C</h1>\n                                    <h6 class=\"text-uppercase mb-0 ms-1 text-white\">Cloudy</h6>\n                                </div>\n                                <div class=\"ms-auto\">\n                                    <img class=\"w-50 float-end mt-n6 mt-lg-n4\"\n                                        src=\"{{ asset('assets') }}/img/small-logos/icon-sun-cloud.png\" alt=\"image sun\">\n                                </div>\n                            </div>\n                            <div class=\"row mt-4\">\n                                <div class=\"col-lg-4 col-md-6\">\n                                    <div class=\"card move-on-hover overflow-hidden\">\n                                        <div class=\"card-body\">\n                                            <div class=\"d-flex\">\n                                                <h6 class=\"mb-0 me-3\">08:00</h6>\n                                                <h6 class=\"mb-0\">Synk up with Mark\n                                                    <small class=\"text-secondary font-weight-normal\">Hangouts</small>\n                                                </h6>\n                                            </div>\n                                            <hr class=\"horizontal dark\">\n                                            <div class=\"d-flex\">\n                                                <h6 class=\"mb-0 me-3\">09:30</h6>\n                                                <h6 class=\"mb-0\">Gym <br />\n                                                    <small class=\"text-secondary font-weight-normal\">World\n                                                        Class</small>\n                                                </h6>\n                                            </div>\n                                            <hr class=\"horizontal dark\">\n                                            <div class=\"d-flex\">\n                                                <h6 class=\"mb-0 me-3\">11:00</h6>\n                                                <h6 class=\"mb-0\">Design Review<br />\n                                                    <small class=\"text-secondary font-weight-normal\">Zoom</small>\n                                                </h6>\n                                            </div>\n                                        </div>\n                                        <a href=\"javascript:;\" class=\"bg-gray-100 w-100 text-center py-1\"\n                                            data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Show More\">\n                                            <i class=\"material-icons text-primary\">expand_more</i>\n                                        </a>\n                                    </div>\n                                </div>\n                                <div class=\"col-lg-4 col-md-6 mt-4 mt-sm-0\">\n                                    <div class=\"card bg-gradient-dark move-on-hover\">\n                                        <div class=\"card-body\">\n                                            <div class=\"d-flex\">\n                                                <h5 class=\"mb-0 text-white\">To Do</h5>\n                                                <div class=\"ms-auto\">\n                                                    <h1 class=\"text-white text-end mb-0 mt-n2\">7</h1>\n                                                    <p class=\"text-sm mb-0 text-white\">items</p>\n                                                </div>\n                                            </div>\n                                            <p class=\"text-white mb-0\">Shopping</p>\n                                            <p class=\"mb-0 text-white\">Meeting</p>\n                                        </div>\n                                        <a href=\"javascript:;\" class=\"w-100 text-center py-1\" data-bs-toggle=\"tooltip\"\n                                            data-bs-placement=\"top\" title=\"Show More\">\n                                            <i class=\"material-icons text-white\">expand_more</i>\n                                        </a>\n                                    </div>\n                                    <div class=\"card move-on-hover mt-4\">\n                                        <div class=\"card-body\">\n                                            <div class=\"d-flex\">\n                                                <p class=\"mb-0\">Emails (21)</p>\n                                                <a href=\"javascript:;\" class=\"ms-auto\" data-bs-toggle=\"tooltip\"\n                                                    data-bs-placement=\"top\" title=\"Check your emails\">\n                                                    Check\n                                                </a>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"col-lg-4 col-md-12 mt-4 mt-lg-0\">\n                                    <div\n                                        class=\"card card-background card-background-mask-dark move-on-hover align-items-start\">\n                                        <div class=\"cursor-pointer\">\n                                            <div class=\"full-background\"\n                                                style=\"background-image: url('https://images.unsplash.com/photo-1470813740244-df37b8c1edcb?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=600&q=80')\">\n                                            </div>\n                                            <div class=\"card-body\">\n                                                <h5 class=\"text-white mb-0\">Night Jazz</h5>\n                                                <p class=\"text-white text-sm\">Gary Coleman</p>\n                                                <div class=\"d-flex mt-5\">\n                                                    <button class=\"btn btn-outline-white rounded-circle p-2 mb-0\"\n                                                        type=\"button\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                        title=\"Prev\">\n                                                        <i class=\"material-icons p-2 mt-0\">skip_previous</i>\n                                                    </button>\n                                                    <button class=\"btn btn-outline-white rounded-circle p-2 mx-2 mb-0\"\n                                                        type=\"button\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                        title=\"Pause\">\n                                                        <i class=\"material-icons p-2 mt-0\">play_arrow</i>\n                                                    </button>\n                                                    <button class=\"btn btn-outline-white rounded-circle p-2 mb-0\"\n                                                        type=\"button\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                        title=\"Next\">\n                                                        <i class=\"material-icons p-2 mt-0\">skip_next</i>\n                                                    </button>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                    <div class=\"card move-on-hover mt-4\">\n                                        <div class=\"card-body\">\n                                            <div class=\"d-flex\">\n                                                <p class=\"my-auto\">Messages</p>\n                                                <div class=\"ms-auto\">\n                                                    <div class=\"avatar-group\">\n                                                        <a href=\"javascript:;\"\n                                                            class=\"avatar avatar-sm border-0 rounded-circle\"\n                                                            data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                            title=\"2 New Messages\">\n                                                            <img alt=\"Image placeholder\"\n                                                                src=\"{{ asset('assets') }}/img/team-1.jpg\">\n                                                        </a>\n                                                        <a href=\"javascript:;\"\n                                                            class=\"avatar avatar-sm border-0 rounded-circle\"\n                                                            data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                            title=\"1 New Message\">\n                                                            <img alt=\"Image placeholder\"\n                                                                src=\"{{ asset('assets') }}/img/team-2.jpg\">\n                                                        </a>\n                                                        <a href=\"javascript:;\"\n                                                            class=\"avatar avatar-sm border-0 rounded-circle\"\n                                                            data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                            title=\"13 New Messages\">\n                                                            <img alt=\"Image placeholder\"\n                                                                src=\"{{ asset('assets') }}/img/team-3.jpg\">\n                                                        </a>\n                                                        <a href=\"javascript:;\"\n                                                            class=\"avatar avatar-sm border-0 rounded-circle\"\n                                                            data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\n                                                            title=\"7 New Messages\">\n                                                            <img alt=\"Image placeholder\"\n                                                                src=\"{{ asset('assets') }}/img/team-4.jpg\">\n                                                        </a>\n                                                    </div>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </main>\n    </div>\n    <x-footers.auth>\n        </x-footer.auth>\n        <x-plugins></x-plugins>\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/register/create.blade.php",
    "content": "<x-layout bodyClass=\"\">\n\n    <div>\n        <div class=\"container position-sticky z-index-sticky top-0\">\n            <div class=\"row\">\n                <div class=\"col-12\">\n                    <!-- Navbar -->\n                    <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n                    <!-- End Navbar -->\n                </div>\n            </div>\n        </div>\n        <main class=\"main-content  mt-0\">\n            <section>\n                <div class=\"page-header min-vh-100\">\n                    <div class=\"container\">\n                        <div class=\"row\">\n                            <div\n                                class=\"col-6 d-lg-flex d-none h-100 my-auto pe-0 position-absolute top-0 start-0 text-center justify-content-center flex-column\">\n                                <div class=\"position-relative bg-gradient-primary h-100 m-3 px-7 border-radius-lg d-flex flex-column justify-content-center\"\n                                    style=\"background-image: url('../assets/img/illustrations/illustration-signup.jpg'); background-size: cover;\">\n                                </div>\n                            </div>\n                            <div\n                                class=\"col-xl-4 col-lg-5 col-md-7 d-flex flex-column ms-auto me-auto ms-lg-auto me-lg-5\">\n                                <div class=\"card card-plain\">\n                                    <div class=\"card-header\">\n                                        <h4 class=\"font-weight-bolder\">Sign Up</h4>\n                                        <p class=\"mb-0\">Enter your name, email and password to register</p>\n                                    </div>\n                                    <div class=\"card-body\">\n                                        <form method=\"POST\" action=\"{{ route('register') }}\">\n                                            @csrf\n                                            <div class=\"input-group input-group-outline mt-3\">\n                                                <label class=\"form-label\">Name</label>\n                                                <input type=\"text\" class=\"form-control\" name=\"name\"\n                                                    value=\"{{ old('name') }}\">\n                                            </div>\n                                            @error('name')\n                                            <p class='text-danger inputerror'>{{ $message }} </p>\n                                            @enderror\n                                            <div class=\"input-group input-group-outline mt-3\">\n                                                <label class=\"form-label\">Email</label>\n                                                <input type=\"email\" class=\"form-control\" name=\"email\"\n                                                    value=\"{{ old('email') }}\">\n                                            </div>\n                                            @error('email')\n                                            <p class='text-danger inputerror'>{{ $message }} </p>\n                                            @enderror\n                                            <div class=\"input-group input-group-outline mt-3\">\n                                                <label class=\"form-label\">Password</label>\n                                                <input type=\"password\" class=\"form-control\" name=\"password\">\n                                            </div>\n                                            @error('password')\n                                            <p class='text-danger inputerror'>{{ $message }} </p>\n                                            @enderror\n                                            <div class=\"form-check form-check-info text-start ps-0 mt-3\">\n                                                <input class=\"form-check-input\" type=\"checkbox\" value=\"\"\n                                                    id=\"flexCheckDefault\" checked>\n                                                <label class=\"form-check-label\" for=\"flexCheckDefault\">\n                                                    I agree the <a href=\"javascript:;\"\n                                                        class=\"text-dark font-weight-bolder\">Terms and Conditions</a>\n                                                </label>\n                                            </div>\n                                            <div class=\"text-center\">\n                                                <button type=\"submit\"\n                                                    class=\"btn btn-lg bg-gradient-primary btn-lg w-100 mt-4 mb-0\">Sign\n                                                    Up</button>\n                                            </div>\n                                        </form>\n                                    </div>\n                                    <div class=\"card-footer text-center pt-0 px-lg-2 px-1\">\n                                        <p class=\"mb-2 text-sm mx-auto\">\n                                            Already have an account?\n                                            <a href=\"{{ route('login') }}\"\n                                                class=\"text-primary text-gradient font-weight-bold\">Sign in</a>\n                                        </p>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </section>\n        </main>\n    </div>\n\n    @push('js')\n    <script src=\"{{ asset('assets') }}/js/jquery.min.js\"></script>\n    <script>\n        $(function() {\n    \n        var text_val = $(\".input-group input\").val();\n        if (text_val === \"\") {\n          $(\".input-group\").removeClass('is-filled');\n        } else {\n          $(\".input-group\").addClass('is-filled');\n        }\n    });\n    </script>\n    @endpush\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/sessions/create.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n\n        <div class=\"container position-sticky z-index-sticky top-0\">\n            <div class=\"row\">\n                <div class=\"col-12\">\n                    <!-- Navbar -->\n                    <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n                    <!-- End Navbar -->\n                </div>\n            </div>\n        </div>\n        <main class=\"main-content  mt-0\">\n            <div class=\"page-header align-items-start min-vh-100\"\n                style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n                <span class=\"mask bg-gradient-dark opacity-6\"></span>\n                <div class=\"container mt-5\">\n                    <div class=\"row signin-margin\">\n                        <div class=\"col-lg-4 col-md-8 col-12 mx-auto\">\n                            <div class=\"card z-index-0 fadeIn3 fadeInBottom\">\n                                <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                                    <div class=\"bg-gradient-primary shadow-primary border-radius-lg py-3 pe-1\">\n                                        <h4 class=\"text-white font-weight-bolder text-center mt-2 mb-0\">Sign in</h4>\n                                        <div class=\"row mt-3\">\n                                            <h6 class='text-white text-center'>\n                                                <span class=\"font-weight-normal\">Email:</span> admin@material.com\n                                                <br>\n                                                <span class=\"font-weight-normal\">Password:</span> secret</h6>\n                                            <div class=\"col-2 text-center ms-auto\">\n                                                <a class=\"btn btn-link px-3\" href=\"javascript:;\">\n                                                    <i class=\"fa fa-facebook text-white text-lg\"></i>\n                                                </a>\n                                            </div>\n                                            <div class=\"col-2 text-center px-1\">\n                                                <a class=\"btn btn-link px-3\" href=\"javascript:;\">\n                                                    <i class=\"fa fa-github text-white text-lg\"></i>\n                                                </a>\n                                            </div>\n                                            <div class=\"col-2 text-center me-auto\">\n                                                <a class=\"btn btn-link px-3\" href=\"javascript:;\">\n                                                    <i class=\"fa fa-google text-white text-lg\"></i>\n                                                </a>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                                <div class=\"card-body\">\n                                    <form role=\"form\" method=\"POST\" action=\"{{ route('login') }}\" class=\"text-start\">\n                                        @csrf\n                                        @if (Session::has('status'))\n                                        <div class=\"alert alert-success alert-dismissible text-white\" role=\"alert\">\n                                            <span class=\"text-sm\">{{ Session::get('status') }}</span>\n                                            <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\"\n                                                data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                                                <span aria-hidden=\"true\">&times;</span>\n                                            </button>\n                                        </div>\n                                        @endif\n                                        <div class=\"input-group input-group-outline mt-3\">\n                                            <label class=\"form-label\">Email</label>\n                                            <input type=\"email\" class=\"form-control\" name=\"email\" value=\"{{ 'admin@material.com' }}\">\n                                        </div>\n                                        @error('email')\n                                        <p class='text-danger inputerror'>{{ $message }} </p>\n                                        @enderror\n                                        <div class=\"input-group input-group-outline mt-3\">\n                                            <label class=\"form-label\">Password</label>\n                                            <input type=\"password\" class=\"form-control\" name=\"password\" value='{{ 'secret'}}'>\n                                        </div>\n                                        @error('password')\n                                        <p class='text-danger inputerror'>{{ $message }} </p>\n                                        @enderror\n                                        <div class=\"form-check form-switch d-flex align-items-center my-3\">\n                                            <input class=\"form-check-input\" type=\"checkbox\" id=\"rememberMe\">\n                                            <label class=\"form-check-label mb-0 ms-2\" for=\"rememberMe\">Remember\n                                                me</label>\n                                        </div>\n                                        <div class=\"text-center\">\n                                            <button type=\"submit\" class=\"btn bg-gradient-primary w-100 my-4 mb-2\">Sign\n                                                in</button>\n                                        </div>\n                                        <p class=\"mt-4 text-sm text-center\">\n                                            Don't have an account?\n                                            <a href=\"{{ route('register') }}\"\n                                                class=\"text-primary text-gradient font-weight-bold\">Sign up</a>\n                                        </p>\n                                        <p class=\"text-sm text-center\">\n                                            Forgot your password? Reset your password\n                                            <a href=\"{{ route('verify') }}\"\n                                                class=\"text-primary text-gradient font-weight-bold\">here</a>\n                                        </p>\n                                    </form>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <x-footers.guest></x-footers.guest>\n            </div>\n        </main>\n        @push('js')\n<script src=\"{{ asset('assets') }}/js/jquery.min.js\"></script>\n<script>\n    $(function() {\n\n    var text_val = $(\".input-group input\").val();\n    if (text_val === \"\") {\n      $(\".input-group\").removeClass('is-filled');\n    } else {\n      $(\".input-group\").addClass('is-filled');\n    }\n});\n</script>\n@endpush\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/sessions/password/reset.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n\n\n    <div class=\"container position-sticky z-index-sticky top-0\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <!-- Navbar -->\n                <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n                <!-- End Navbar -->\n            </div>\n        </div>\n    </div>\n    <main class=\"main-content  mt-0\">\n        <div class=\"page-header align-items-start min-vh-100\"\n            style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n            <span class=\"mask bg-gradient-dark opacity-6\"></span>\n            <div class=\"container my-auto\">\n                <div class=\"row\">\n                    <div class=\"col-lg-4 col-md-8 col-12 mx-auto\">\n                        <div class=\"card z-index-0 fadeIn3 fadeInBottom\">\n                            <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                                <div class=\"bg-gradient-primary shadow-primary border-radius-lg py-3 pe-1\">\n                                    <h4 class=\"text-white font-weight-bolder text-center mt-2 mb-0\">Change your password</h4>\n                                </div>\n                            </div>\n                            <div class=\"card-body\">\n                                <form role=\"form\" method=\"POST\" action=\"{{ route('password.update', ['token' => $token]) }}\" class=\"text-start\">\n                                    @csrf\n                                    <input type=\"hidden\" name=\"token\" value=\"{{ $token }}\">\n                                    <div class=\"input-group input-group-outline mb-3\">\n                                        <label class=\"form-label\">Email</label>\n                                        <input type=\"email\" class=\"form-control\" name=\"email\">\n                                    </div>\n                                    @error('email')\n                                    <p class='text-danger inputerror'>{{ $message }} </p>\n                                    @enderror\n                                    <div class=\"input-group input-group-outline my-3\">\n                                        <label class=\"form-label\">New password</label>\n                                        <input type=\"password\" class=\"form-control\" name=\"password\">\n                                    </div>\n                                    @error('password')\n                                    <p class='text-danger inputerror'>{{ $message }} </p>\n                                    @enderror\n                                    <div class=\"input-group input-group-outline my-3\">\n                                        <label class=\"form-label\">Confirm Password</label>\n                                        <input type=\"password\" class=\"form-control\" name=\"password_confirmation\">\n                                    </div>\n                                    @error('password_confirmation')\n                                    <p class='text-danger inputerror'>{{ $message }} </p>\n                                    @enderror\n                                    <div class=\"text-center\">\n                                        <button type=\"submit\" class=\"btn bg-gradient-primary w-100 my-4 mb-2\">Change\n                                            password</button>\n                                    </div>\n                                    <p class=\"mt-4 text-sm text-center\">\n                                        Don't have an account?\n                                        <a href=\"{{ route('register') }}\"\n                                            class=\"text-primary text-gradient font-weight-bold\">Sign up</a>\n                                    </p>\n                                </form>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <x-footers.guest></x-footers.guest>\n        </div>\n    </main>\n\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/sessions/password/verify.blade.php",
    "content": "<x-layout bodyClass=\"bg-gray-200\">\n\n    <div class=\"container position-sticky z-index-sticky top-0\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <!-- Navbar -->\n                <x-navbars.navs.guest signin='login' signup='register'></x-navbars.navs.guest>\n                <!-- End Navbar -->\n            </div>\n        </div>\n    </div>\n    <main class=\"main-content  mt-0\">\n        <div class=\"page-header align-items-start min-vh-100\"\n            style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n            <span class=\"mask bg-gradient-dark opacity-6\"></span>\n            <div class=\"container my-auto\">\n                <div class=\"row\">\n                    <div class=\"col-lg-4 col-md-8 col-12 mx-auto\">\n                        <div class=\"card z-index-0 fadeIn3 fadeInBottom\">\n                            <div class=\"card-header p-0 position-relative mt-n4 mx-3 z-index-2\">\n                                <div class=\"bg-gradient-primary shadow-primary border-radius-lg py-3 pe-1\">\n                                    <h4 class=\"text-white font-weight-bolder text-center mt-2 mb-0\">Reset password</h4>\n                                    <p class='text-light p-2'>You will receive an e-mail in maximum 60 seconds</p>\n                                </div>\n                            </div>\n                            <div class=\"card-body\">\n                                @if (Session::has('status'))\n                                <div class=\"alert alert-success alert-dismissible text-white\" role=\"alert\">\n                                    <span class=\"text-sm\">{{ Session::get('status') }}</span>\n                                    <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\"\n                                        data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                                        <span aria-hidden=\"true\">&times;</span>\n                                    </button>\n                                </div>\n                                @elseif (Session::has('email'))\n\n                                <div class=\"alert alert-danger alert-dismissible text-white\" role=\"alert\">\n                                    <span class=\"text-sm\">{{ Session::get('email') }}</span>\n                                    <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\"\n                                        data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                                        <span aria-hidden=\"true\">&times;</span>\n                                    </button>\n                                </div>\n                                @endif\n                                @if (Session::has('demo'))\n                                <div class=\"row\">\n                                    <div class=\"alert alert-danger alert-dismissible text-white\" role=\"alert\">\n                                        <span class=\"text-sm\">{{ Session::get('demo') }}</span>\n                                        <button type=\"button\" class=\"btn-close text-lg py-3 opacity-10\"\n                                            data-bs-dismiss=\"alert\" aria-label=\"Close\">\n                                            <span aria-hidden=\"true\">&times;</span>\n                                        </button>\n                                    </div>\n                                </div>\n                                @endif\n                                <form role=\"form\" method=\"POST\" action=\"{{ route('verify') }}\" class=\"text-start\">\n                                    @csrf\n                                    <div class=\"input-group input-group-outline my-3\">\n                                        <label class=\"form-label\">Email</label>\n                                        <input type=\"email\" class=\"form-control\" name=\"email\">\n                                    </div>\n                                    @error('email')\n                                    <p class='text-danger inputerror'>{{ $message }} </p>\n                                    @enderror\n                                    <div class=\"text-center\">\n                                        <button type=\"submit\"\n                                            class=\"btn bg-gradient-primary w-100 my-4 mb-2\">Send</button>\n                                    </div>\n                                    <p class=\"mt-4 text-sm text-center\">\n                                        Don't have an account?\n                                        <a href=\"{{ route('register') }}\"\n                                            class=\"text-primary text-gradient font-weight-bold\">Sign up</a>\n                                    </p>\n                                </form>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <x-footers.guest></x-footers.guest>\n        </div>\n    </main>\n    @push('js')\n    <script src=\"{{ asset('assets') }}/js/jquery.min.js\"></script>\n    <script>\n        $(function() {\n    \n        var text_val = $(\".input-group input\").val();\n        if (text_val === \"\") {\n          $(\".input-group\").removeClass('is-filled');\n        } else {\n          $(\".input-group\").addClass('is-filled');\n        }\n    });\n    </script>\n    @endpush\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/resources/views/welcome.blade.php",
    "content": "<x-layout bodyClass=\"\">\n    <div class=\"container position-sticky z-index-sticky top-0\">\n        <div class=\"row\">\n            <div class=\"col-12\">\n                <x-navbars.navs.guest signup='register' signin='login'></x-navbars.navs.guest>\n            </div>\n        </div>\n    </div>\n    <div class=\"page-header justify-content-center min-vh-100\"\n        style=\"background-image: url('https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80');\">\n        <span class=\"mask bg-gradient-dark opacity-6\"></span>\n        <div class=\"container\">\n            <h1 class=\"text-light text-center\">Welcome to Material Dashboard FREE Laravel Live Preview.</h1>\n        </div>\n    </div>\n        <x-footers.guest></x-footers.guest>\n</x-layout>\n"
  },
  {
    "path": "src/material-stubs/webpack.mix.js",
    "content": "const mix = require('laravel-mix');\n\n/*\n |--------------------------------------------------------------------------\n | Mix Asset Management\n |--------------------------------------------------------------------------\n |\n | Mix provides a clean, fluent API for defining some Webpack build steps\n | for your Laravel applications. By default, we are compiling the CSS\n | file for the application as well as bundling up all the JS files.\n |\n */\n\nmix.js('resources/js/app.js', 'public/js')\n    .postCss('resources/css/material-dashboard.css', 'public/css', [\n        //\n    ]);\n"
  }
]