deploy: 5914b4e889

2024-10-03 22:17:08 +02:00 · 2022-04-09 14:45:24 +00:00 · 2022-04-09 14:45:24 +00:00 · 3e3908e668
commit 3e3908e668
2079 changed files with 73304 additions and 0 deletions
--- a/.github/CONTRIBUTING.md
+++ b/.github/CONTRIBUTING.md
@ -0,0 +1,30 @@
+# Contributing to theme.park
+
+- If you want to discuss changes, you can also bring it up in our Discord server
+- PR's are done against the develop branch.
+
+## New theme option
+
+- The current variables in use can be found in any of the CSS files in `/css/theme-options/` and `/css/community-theme-options/`
+
+- New community contributed theme options will be placed in the `Community Themes` category on our docs page.
+
+- Community themes are not officially supported but as long as they follow the same variable structure as the other theme options it should look fine on all applications.
+
+- When contributing a new option, you must have example screeenshots of the theme being used. Preferrably at least 10 with the same image size. See examples on our [docs page](https://docs.theme-park.dev/community-themes/).
+
+### Specials
+
+Remember to also to change the variables in the the `Specials` section even if you dont use the application the variable refers to.
+
+- `--arr-queue-color` Please refrain from using an orange/yellowish color on the variable as its confusing from a UX standpoint as the "arrs" use that color range when something is wrong in the queue.
+
+## New application theme
+
+- When creating a new theme for an application please test multiple theme options to make sure it looks good on all options not just your favorite.
+
+- The PR must contain a screenshot of all the different theme options. Optionally you can also include screenshots with the community theme options.
+
+## Bug fixes
+
+- When submitting bugfixes please show a before and after screenshot of the fix, and a description of what the fix does.
--- a/.github/FUNDING.yml
+++ b/.github/FUNDING.yml
@ -0,0 +1,3 @@
+# These are supported funding model platforms
+
+github: GilbN
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@ -0,0 +1,49 @@
+---
+name: Bug report
+about: Create a report to help us improve
+title: ''
+labels: 'bug'
+assignees: ''
+
+---
+
+**Describe the bug**
+A clear and concise description of what the bug is.
+
+**Theme Install Method** (Don't skip)
+- Docker run / Compose Config
+- Webserver subfilter Config
+- Stylus Config
+
+**Application Info** (Don't skip)
+- Version
+- Branch
+- Container
+
+**To Reproduce**
+Steps to reproduce the behavior:
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behavior**
+A clear and concise description of what you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+
+**Desktop (If applicable) (please complete the following information):**
+ - OS: [e.g. iOS]
+ - Browser [e.g. chrome, safari]
+ - Version [e.g. 22]
+
+**Smartphone (If applicable) (please complete the following information):**
+ - Device: [e.g. iPhone6]
+ - OS: [e.g. iOS8.1]
+ - Browser [e.g. stock browser, safari]
+ - Version [e.g. 22]
+
+**Additional context**
+Add any other context about the problem here.
--- a/.github/pull_request_template.md
+++ b/.github/pull_request_template.md
@ -0,0 +1,35 @@
+<!--- Provide a general summary of your changes in the Title above -->
+
+[themeparkurl]: https://theme-park.dev
+[![theme-park.dev](https://raw.githubusercontent.com/GilbN/theme.park/master/banners/tp_banner.png)][themeparkurl]
+
+
+<!--- Before submitting a pull request please check the following -->
+
+<!---  If this is a fix for a typo (in code, documentation, or the README) please file an issue and let us sort it out. We do not need a PR  -->
+<!---  Ask yourself if this modification is something the whole userbase will benefit from, if this is a specific change for corner case functionality/styling please look at making an addon instead. https://docs.theme-park.dev/themes/addons/sonarr/ -->
+<!---  That if the PR is addressing an existing issue include, closes #<issue number> , in the body of the PR commit message   -->
+<!---  You have included links to any files / patches etc your PR may be using in the body of the PR commit message -->
+
+------------------------------
+
+ - [ ] I have read the [contributing](https://github.com/GilbN/theme.park/blob/master/.github/CONTRIBUTING.md) guideline and understand that I have made the correct modifications
+
+------------------------------
+
+<!--- We welcome all PR’s though this doesn’t guarantee it will be accepted. -->
+
+## Description:
+<!--- Describe your changes in detail -->
+<!--- Add before and after screenshots of your changes -->
+
+## Benefits of this PR and context:
+<!--- Please explain why we should accept this PR. If this fixes an outstanding bug, please reference the issue # -->
+
+## How Has This Been Tested?
+<!--- Please describe in detail how you tested your changes. -->
+<!--- Include details of your testing environment, and the tests you ran to -->
+<!--- see how your change affects other areas of the code, etc. -->
+
+## Source / References:
+<!--- Please include any forum posts/github links relevant to the PR -->
--- a/.github/release.yml
+++ b/.github/release.yml
@ -0,0 +1,25 @@
+# release.yml
+
+changelog:
+  exclude:
+    labels:
+      - ignore-for-release
+    authors:
+      - github-actions
+  categories:
+    - title: Breaking Changes 🛠
+      labels:
+        - Semver-Major
+        - breaking-change
+    - title: Exciting New Features 🎉
+      labels:
+        - Semver-Minor
+        - enhancement
+        - added
+    - title: Fixes
+      labels:
+        - fix
+        - fixed
+    - title: Other Changes
+      labels:
+        - "*"
--- a/.github/workflows/auto-build.yml
+++ b/.github/workflows/auto-build.yml
@ -0,0 +1,71 @@
+name: autobuildallthemods
+on:
+  push:
+    branches: 
+      - master
+    paths:
+    - 'docker-mods/**'
+jobs:
+  push_to_ghcr_io:
+    runs-on: ubuntu-latest
+    steps:
+      - name: checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: get changed files
+        id: getfile
+        run: |
+          echo "::set-output name=files::$(git diff-tree --no-commit-id --name-only -r ${{ github.sha }} docker-mods/| xargs)"
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v1
+        with:
+          registry: ghcr.io
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GH_PAT }}
+      - name: find correct directory then build&push
+        run: |
+          for i in ${{ steps.getfile.outputs.files }}
+            do
+              directory="$( echo $i | cut -d'/' -f2 -s )"
+              if [ -z "$directory" ]; then
+                continue # Skip root dir
+              elif [ "$i" == *.md ]; then
+                continue # Skip markdown files
+              elif [ "$i" == *.yml ]; then
+                continue # Skip YAML files
+              fi
+              docker build docker-mods/$directory --tag ghcr.io/gilbn/theme.park:$directory
+              docker push ghcr.io/gilbn/theme.park:$directory
+            done
+  push_to_dockerhub:
+    runs-on: ubuntu-latest
+    steps:
+      - name: checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: get changed files
+        id: getfile
+        run: |
+          echo "::set-output name=files::$(git diff-tree --no-commit-id --name-only -r ${{ github.sha }} docker-mods/| xargs)"
+      - name: Login to Docker Hub
+        uses: docker/login-action@v1
+        with:
+          username: ${{ secrets.DH_USER }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+      - name: find correct directory then build&push
+        run: |
+          for i in ${{ steps.getfile.outputs.files }}
+            do
+              directory="$( echo $i | cut -d'/' -f2 -s )"
+              if [ -z "$directory" ]; then
+                continue # Skip root dir
+              elif [ "$i" == *.md ]; then
+                continue # Skip markdown files
+              elif [ "$i" == *.yml ]; then
+                continue # Skip YAML files
+              fi
+              docker build docker-mods/$directory --tag gilbn/theme.park:$directory
+              docker push gilbn/theme.park:$directory
+            done
--- a/.github/workflows/docker-build.yml
+++ b/.github/workflows/docker-build.yml
@ -0,0 +1,148 @@
+name: docker build
+on:
+  release:
+    types:
+      - released
+  workflow_dispatch:
+    inputs:
+      branch:
+        description: 'Select branch'
+        required: true
+        type: choice
+        options:
+        - master
+        - develop
+        - testing
+      tag:
+        description: 'Add a tag'
+  push:
+    branches:
+      - develop
+      - testing
+    paths-ignore:
+        - '.github/**'
+jobs:
+  build-and-push-it-to-the-limit:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        architecture: [linux-arm-v7,linux-arm64,linux-amd64]
+    steps:
+      - name: checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Prepare
+        id: prep
+        run: |
+          ARCHITECTURE=${{ matrix.architecture }}
+          echo ::set-output name=created::$(date -u +'%Y-%m-%dT%H:%M:%SZ')
+          echo ::set-output name=title::${GITHUB_REPOSITORY,,}:${{ github.ref_name }}
+          echo ::set-output name=revision::${GITHUB_SHA}
+          echo ::set-output name=source::${GITHUB_SERVER_URL}/${GITHUB_REPOSITORY,,}/tree/${{ github.ref_name }}
+          echo ::set-output name=vendor::${{ github.repository_owner }}
+          echo ::set-output name=url::${GITHUB_SERVER_URL}/${GITHUB_REPOSITORY,,}/blob/master/README.md
+          echo ::set-output name=VERSION::${{ github.event.release.tag_name }}
+          echo ::set-output name=platform::${ARCHITECTURE//-/\/}
+          echo ::set-output name=cache::${GITHUB_REPOSITORY,,}:${{ github.ref_name }}-cache-${{ matrix.architecture }}
+          echo ::set-output name=tag::${GITHUB_REPOSITORY,,}:${{ github.ref_name }}-${GITHUB_SHA:0:7}-${GITHUB_RUN_NUMBER}-${{ matrix.architecture }}
+          echo ::set-output name=release::${{ github.event.release.target_commitish }}
+
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v1
+
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v1
+
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v1
+        with:
+          registry: ghcr.io
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GH_PAT }}
+
+      - name: Login to Docker Hub
+        uses: docker/login-action@v1
+        with:
+          username: ${{ secrets.DH_USER }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      - name: build&push
+        uses: docker/build-push-action@v2
+        with:
+          push: ${{ github.event_name != 'pull_request' }}
+          platforms: ${{ steps.prep.outputs.platform }}
+          file: ./${{ matrix.architecture }}.Dockerfile
+          cache-from: docker.io/${{ steps.prep.outputs.cache }}
+          cache-to: docker.io/${{ steps.prep.outputs.cache }}
+          tags: |
+            docker.io/${{ steps.prep.outputs.tag }}
+            ghcr.io/${{ steps.prep.outputs.tag }}
+          labels: |
+            org.opencontainers.image.created=${{ steps.prep.outputs.created }}
+            org.opencontainers.image.title=${{ steps.prep.outputs.title }}
+            org.opencontainers.image.revision=${{ steps.prep.outputs.revision }}
+            org.opencontainers.image.source=${{ steps.prep.outputs.source }}
+            org.opencontainers.image.vendor=${{ steps.prep.outputs.vendor }}
+            org.opencontainers.image.url=${{ steps.prep.outputs.url }}
+            org.opencontainers.image.version=${{ steps.prep.outputs.VERSION }}
+          build-args: |
+            TP_RELEASE=${{ steps.prep.outputs.VERSION }}
+            BUILD_DATE=${{ steps.date_time.outputs.created }}
+            BUILD_ARCHITECTURE=${{ matrix.architecture }}
+
+  publish:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        registry: [docker.io, ghcr.io]
+    needs: [build-and-push-it-to-the-limit]
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: Login to DockerHub
+        if: matrix.registry == 'docker.io'
+        uses: docker/login-action@v1
+        with:
+          registry: docker.io
+          username: ${{ secrets.DH_USER }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      - name: Login to GitHub Container Registry
+        if: matrix.registry == 'ghcr.io'
+        uses: docker/login-action@v1
+        with:
+          registry: ghcr.io
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GH_PAT }}
+
+      - name: Create manifests
+        env:
+          DOCKER_CLI_EXPERIMENTAL: enabled
+        run: |
+          IMAGE=${{ matrix.registry }}/${GITHUB_REPOSITORY,,}
+          TAG=${{ github.ref_name }}
+          SOURCE=${IMAGE}:${TAG}-${GITHUB_SHA:0:7}-${GITHUB_RUN_NUMBER}
+          VERSION=${{ steps.prep.outputs.VERSION }}
+          [[ -f linux-amd64.Dockerfile ]]  && AMD64=${SOURCE}-linux-amd64
+          [[ -f linux-arm64.Dockerfile ]]  && ARM64=${SOURCE}-linux-arm64
+          [[ -f linux-arm-v7.Dockerfile ]] && ARMV7=${SOURCE}-linux-arm-v7
+          docker manifest create ${IMAGE}:${TAG} ${AMD64} ${ARM64} ${ARMV7}
+          docker manifest push ${IMAGE}:${TAG}
+          docker manifest create ${IMAGE}:${TAG}-${GITHUB_SHA:0:7} ${AMD64} ${ARM64} ${ARMV7}
+          docker manifest push ${IMAGE}:${TAG}-${GITHUB_SHA:0:7}
+      - name: Latest manifest
+        if: ${{ github.event.release.target_commitish == 'master' }}
+        env:
+          DOCKER_CLI_EXPERIMENTAL: enabled
+        run: |
+          IMAGE=${{ matrix.registry }}/${GITHUB_REPOSITORY,,}
+          TAG=${{ github.ref_name }}
+          SOURCE=${IMAGE}:${TAG}-${GITHUB_SHA:0:7}-${GITHUB_RUN_NUMBER}
+          [[ -f linux-amd64.Dockerfile ]] && AMD64=${SOURCE}-linux-amd64
+          [[ -f linux-arm64.Dockerfile ]] && ARM64=${SOURCE}-linux-arm64
+          [[ -f linux-arm-v7.Dockerfile ]] && ARMV7=${SOURCE}-linux-arm-v7
+          docker manifest create ${IMAGE}:latest ${AMD64} ${ARM64} ${ARMV7}
+          docker manifest push ${IMAGE}:latest
--- a/.github/workflows/minify-and-deploy.yml
+++ b/.github/workflows/minify-and-deploy.yml
@ -0,0 +1,88 @@
+name: Minify CSS and deploy to live branch
+on:
+  push:
+    branches:
+      - master
+      - develop
+      - testing 
+    paths-ignore:
+        - 'docker-mods/**'
+        - '.vscode/**'
+        - '.github/**'
+  workflow_dispatch:
+    inputs:
+      branch:
+        description: 'Select branch'
+        required: true
+        type: choice
+        options:
+        - master
+        - develop
+        - testing
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Wrong domain check
+        run: |
+          echo "$(git diff-tree --no-commit-id --name-only -r ${{ github.sha }})"
+          if git grep -q -E ${{ secrets.DOMAIN }} -- *.css; then
+            echo "Game over man!"
+            exit 1
+          fi
+      - name: Set up Python ${{ matrix.python-version }}
+        uses: actions/setup-python@v2
+      - name: Run themes.py
+        run: |
+          python themes.py
+      - name: Minify CSS
+        if: ${{ github.ref == 'refs/heads/master' }}
+        run: |
+          sudo npm install -g minify@7.2.2
+          sudo apt-get update
+          sudo apt-get -y install moreutils
+
+          minify_file(){
+              directory=$1
+              basename=$(basename $directory);
+              extension="${basename##*.}"
+              output="${directory%/*}/"
+              filename="${basename%.*}"
+              output_path="${output}${filename}.${extension}"
+              minify ${directory} | sponge ${output_path}
+              echo "Minified ${directory} > ${output_path}"
+          }
+          
+            find ./css -type f -iname *base.css | while read fname
+                do
+                    if [[ "$fname" != *"min."* ]]; then
+                        minify_file $fname
+                    fi
+                done
+      - name: Deploy
+        uses: peaceiris/actions-gh-pages@v3
+        if: ${{ github.ref == 'refs/heads/master' || github.event.inputs.branch == 'master' }}
+        with:
+          publish_dir: ./
+          publish_branch: live
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          exclude_assets: ''
+      - name: Deploy Develop
+        uses: peaceiris/actions-gh-pages@v3
+        if: ${{ github.ref == 'refs/heads/develop' || github.event.inputs.branch == 'develop' }}
+        with:
+          publish_dir: ./
+          publish_branch: live_develop
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          exclude_assets: ''
+      - name: Deploy Testing
+        uses: peaceiris/actions-gh-pages@v3
+        if: ${{ github.ref == 'refs/heads/testing' || github.event.inputs.branch == 'testing' }}
+        with:
+          publish_dir: ./
+          publish_branch: live_testing
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          exclude_assets: ''
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1 @@
+.vscode/*
--- a/.nojekyll
+++ b/.nojekyll
@ -0,0 +1 @@
+
--- a/1
+++ b/1
@ -0,0 +1 @@
+theme-park.dev
--- a/CODE_OF_CONDUCT.md
+++ b/CODE_OF_CONDUCT.md
@ -0,0 +1,128 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+We as members, contributors, and leaders pledge to make participation in our
+community a harassment-free experience for everyone, regardless of age, body
+size, visible or invisible disability, ethnicity, sex characteristics, gender
+identity and expression, level of experience, education, socio-economic status,
+nationality, personal appearance, race, religion, or sexual identity
+and orientation.
+
+We pledge to act and interact in ways that contribute to an open, welcoming,
+diverse, inclusive, and healthy community.
+
+## Our Standards
+
+Examples of behavior that contributes to a positive environment for our
+community include:
+
+* Demonstrating empathy and kindness toward other people
+* Being respectful of differing opinions, viewpoints, and experiences
+* Giving and gracefully accepting constructive feedback
+* Accepting responsibility and apologizing to those affected by our mistakes,
+  and learning from the experience
+* Focusing on what is best not just for us as individuals, but for the
+  overall community
+
+Examples of unacceptable behavior include:
+
+* The use of sexualized language or imagery, and sexual attention or
+  advances of any kind
+* Trolling, insulting or derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or email
+  address, without their explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Enforcement Responsibilities
+
+Community leaders are responsible for clarifying and enforcing our standards of
+acceptable behavior and will take appropriate and fair corrective action in
+response to any behavior that they deem inappropriate, threatening, offensive,
+or harmful.
+
+Community leaders have the right and responsibility to remove, edit, or reject
+comments, commits, code, wiki edits, issues, and other contributions that are
+not aligned to this Code of Conduct, and will communicate reasons for moderation
+decisions when appropriate.
+
+## Scope
+
+This Code of Conduct applies within all community spaces, and also applies when
+an individual is officially representing the community in public spaces.
+Examples of representing our community include using an official e-mail address,
+posting via an official social media account, or acting as an appointed
+representative at an online or offline event.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported to the community leaders responsible for enforcement at
+contact@theme-park.dev.
+All complaints will be reviewed and investigated promptly and fairly.
+
+All community leaders are obligated to respect the privacy and security of the
+reporter of any incident.
+
+## Enforcement Guidelines
+
+Community leaders will follow these Community Impact Guidelines in determining
+the consequences for any action they deem in violation of this Code of Conduct:
+
+### 1. Correction
+
+**Community Impact**: Use of inappropriate language or other behavior deemed
+unprofessional or unwelcome in the community.
+
+**Consequence**: A private, written warning from community leaders, providing
+clarity around the nature of the violation and an explanation of why the
+behavior was inappropriate. A public apology may be requested.
+
+### 2. Warning
+
+**Community Impact**: A violation through a single incident or series
+of actions.
+
+**Consequence**: A warning with consequences for continued behavior. No
+interaction with the people involved, including unsolicited interaction with
+those enforcing the Code of Conduct, for a specified period of time. This
+includes avoiding interactions in community spaces as well as external channels
+like social media. Violating these terms may lead to a temporary or
+permanent ban.
+
+### 3. Temporary Ban
+
+**Community Impact**: A serious violation of community standards, including
+sustained inappropriate behavior.
+
+**Consequence**: A temporary ban from any sort of interaction or public
+communication with the community for a specified period of time. No public or
+private interaction with the people involved, including unsolicited interaction
+with those enforcing the Code of Conduct, is allowed during this period.
+Violating these terms may lead to a permanent ban.
+
+### 4. Permanent Ban
+
+**Community Impact**: Demonstrating a pattern of violation of community
+standards, including sustained inappropriate behavior,  harassment of an
+individual, or aggression toward or disparagement of classes of individuals.
+
+**Consequence**: A permanent ban from any sort of public interaction within
+the community.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage],
+version 2.0, available at
+https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
+
+Community Impact Guidelines were inspired by [Mozilla's code of conduct
+enforcement ladder](https://github.com/mozilla/diversity).
+
+[homepage]: https://www.contributor-covenant.org
+
+For answers to common questions about this code of conduct, see the FAQ at
+https://www.contributor-covenant.org/faq. Translations are available at
+https://www.contributor-covenant.org/translations.
--- a/22
+++ b/22
@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2019 GilbN
+
+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:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+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.
+ 
--- a/README.md
+++ b/README.md
@ -0,0 +1,298 @@
+<img src="banners/tp_banner.png"/>
+
+[![Docs](https://img.shields.io/static/v1.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge&label=theme-park.dev&message=Docs)](https://docs.theme-park.dev "Documentation for all the themes in this repository.")
+[![Discord](https://img.shields.io/discord/591352397830553601.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge&label=Discord&logo=discord)](https://discord.gg/HM5uUKU "Discord for theme installation support")
+[![GitHub Stars](https://img.shields.io/github/stars/gilbn/theme.park.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge&logo=github)](https://github.com/GilbN/theme.park)
+[![Support](https://img.shields.io/static/v1.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge&label=&message=sponsor&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABN0lEQVQ4T2NkoBAwIuv/HxDggMT/wLhhwwUQ/39AgAEDA4MATI5xw4YDcDaaAf+R+AcZN2wAG/g/IACkwR7JALjFYAbU5v0k+sYR5BLG/wEBCQwMDAUMDAz6DM3NDAxz5zIwPHhAjFkXGRgYJoAMaGBgYKgH6wgPZ2DYt4+B4fVrYgwAqWlENYBYbQwMDO8+sjH8+cvUSbYB6w9Kv/vwlW0aWYE4Z5MCAwfrf7fYnxN3wwwAxTEorvHGBMjZBy+Ivvv6jSXi20+OU+kMnR/RExIoQEGxIo8eHM/fcDA8fc114/J9/jVJv/prsSYkaJqYwMDAEIBsCMjme894bl6+w7s76e/EXGTDUVwAk0CJWgYGBliAIduM0wVIhoCS8X7kAMMWy1hdAPUKOGCXbJdnhQUYSQYQm6YAtdh8zhSGm1AAAAAASUVORK5CYII=)](https://github.com/sponsors/GilbN "Donate!")
+[![GitHub](https://img.shields.io/github/license/gilbn/theme.park.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge)](https://github.com/gilbN/theme.park/blob/master/LICENSE)
+[![GitHub Package Repository](https://img.shields.io/static/v1.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge&label=theme-park.dev&message=Packages&logo=github)](https://github.com/users/GilbN/packages/container/package/theme.park)
+[![Docker Pulls](https://img.shields.io/docker/pulls/gilbn/theme.park.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge&label=pulls&logo=docker)](https://hub.docker.com/r/gilbn/theme.park)
+[![Blog](https://img.shields.io/static/v1.svg?color=009688&labelColor=555555&logoColor=ffffff&style=for-the-badge&label=technicalramblings&message=Blog)](https://technicalramblings.com/ "A blog with different guides :)")
+
+<p align="center">A collection of themes/skins for your favorite apps!</p>
+<div align="center">
+    <a href="https://docs.theme-park.dev/theme-options/aquamarine/" rel="noopener"><img src="https://docs.theme-park.dev/theme-options/screenshots/ombi_aquamarine_small.png" alt="Screen Shot 1" width="49.15%" /></a>
+    <a href="https://docs.theme-park.dev/theme-options/hotpink/" rel="noopener"><img src="https://docs.theme-park.dev/theme-options/screenshots/radarr_hotpink_small.png" alt="Screen Shot 2" width="49.15%" /></a>
+    <a href="https://docs.theme-park.dev/theme-options/overseerr/" rel="noopener"><img src="https://docs.theme-park.dev/theme-options/screenshots/petio_overseerr_small.png" alt="Screen Shot 3" width="49.15%" /></a>
+    <a href="https://docs.theme-park.dev/theme-options/dracula/" rel="noopener"><img src="https://docs.theme-park.dev/theme-options/screenshots/bazarr_dracula_small.png" alt="Screen Shot 4" width="49.15%" /></a>
+</div>
+
+<h1><a href="https://docs.theme-park.dev/themes/">Themes</a></h1>
+
+<p align="center">Click on the banners for screenshots.</p>
+
+<a href="https://docs.theme-park.dev/theme-options/dracula"><img src="https://docs.theme-park.dev/theme-options/dracula_banner_small.png" alt="Dracula" width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/overseerr"><img src="https://docs.theme-park.dev/theme-options/overseerr_banner_small.png" alt="Overseerr" width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/organizr"><img src="https://docs.theme-park.dev/theme-options/organizr_banner_small.png" alt="Organizr"  width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/aquamarine"><img src="https://docs.theme-park.dev/theme-options/aquamarine_banner_small.png" alt="Aquamarine"  width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/hotline"><img src="https://docs.theme-park.dev/theme-options/hotline_banner_small.png" alt="Hotline"  width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/hotpink"><img src="https://docs.theme-park.dev/theme-options/hotpink_banner_small.png" alt="Hotpink"  width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/space-gray"><img src="https://docs.theme-park.dev/theme-options/space gray_banner_small.png" alt="Space-Gray"  width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/dark"><img src="https://docs.theme-park.dev/theme-options/dark_banner_small.png" alt="Dark"  width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/plex"><img src="https://docs.theme-park.dev/theme-options/plex_banner_small.png" alt="Plex"  width="49.49%"/></a>
+<a href="https://docs.theme-park.dev/theme-options/nord"><img src="https://docs.theme-park.dev/theme-options/nord_banner_small.png" alt="Nord"  width="49.49%"/></a>
+
+<h2><a href="https://docs.theme-park.dev/setup">Installation</a></h2>
+
+<h2><a href="https://docs.theme-park.dev/themes/addons">Addons</a></h2>
+
+<h2><a href="https://docs.theme-park.dev/community-themes/">Community Themes</a></h2>
+
+<h2><a href="https://docs.theme-park.dev/custom/">Adding your own theme-options</a></h2>
+
+<p align="center">Current themes in the repo</p>
+
+<div align="center">
+<table cellspacing="10" cellpadding="10">
+<tbody>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/sonarr"><img src="https://docs.theme-park.dev/site_assets/sonarr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/sonarr">Sonarr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/radarr"><img src="https://docs.theme-park.dev/site_assets/radarr/logo.png" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/radarr">Radarr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/lidarr"><img src="https://docs.theme-park.dev/site_assets/lidarr/logo.png" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/lidarr">Lidarr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/readarr"><img src="https://docs.theme-park.dev/site_assets/readarr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/readarr">Readarr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/prowlarr"><img src="https://docs.theme-park.dev/site_assets/prowlarr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/prowlarr">Prowlarr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/bazarr"><img src="https://docs.theme-park.dev/site_assets/bazarr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/bazarr">Bazarr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/plex"><img src="https://docs.theme-park.dev/site_assets/plex/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/plex">Plex</a></p>
+</td>
+</tr>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/jellyfin"><img src="https://docs.theme-park.dev/site_assets/jellyfin/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/jellyfin">Jellyfin</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/emby"><img src="https://docs.theme-park.dev/site_assets/emby/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/emby">Emby</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/ombi"><img src="https://docs.theme-park.dev/site_assets/ombi/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/ombi">Ombi</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/tautulli"><img src="https://docs.theme-park.dev/site_assets/tautulli/logo.png" alt="" width="48" height="45" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/tautulli">Tautulli</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/organizr"><img src="https://docs.theme-park.dev/site_assets/organizr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/organizr">Organizr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/overseerr"><img src="https://docs.theme-park.dev/site_assets/overseerr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/overseerr">Overseerr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/deluge"><img src="https://docs.theme-park.dev/site_assets/deluge/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/deluge">Deluge</a></p>
+</td>
+</tr>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/qbittorrent"><img src="https://docs.theme-park.dev/site_assets/qbittorrent/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/qbittorrent">qBittorrent</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/rutorrent"><img src="https://docs.theme-park.dev/site_assets/rutorrent/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/rutorrent">ruTorrent</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/transmission"><img src="https://docs.theme-park.dev/site_assets/transmission/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/transmission">Transmission</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/sabnzbd"><img src="https://docs.theme-park.dev/site_assets/sabnzbd/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/sabnzbd">SABnzbd</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/nzbget"><img src="https://docs.theme-park.dev/site_assets/nzbget/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/nzbget">NZBGet</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/nzbhydra2"><img src="https://docs.theme-park.dev/site_assets/nzbhydra2/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/nzbhydra2">NZBHydra 2</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/jackett"><img src="https://docs.theme-park.dev/site_assets/jackett/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/jackett">Jackett</a></p>
+</td>
+</tr>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/netdata"><img src="https://docs.theme-park.dev/site_assets/netdata/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/netdata">Netdata</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/portainer"><img src="https://docs.theme-park.dev/site_assets/portainer/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/portainer">Portainer</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/pihole"><img src="https://docs.theme-park.dev/site_assets/pihole/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/pihole">Pi-hole</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/guacamole"><img src="https://docs.theme-park.dev/site_assets/guacamole/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/guacamole">Guacamole</a></p>
+</td>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/dozzle"><img src="https://docs.theme-park.dev/site_assets/dozzle/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/dozzle">Dozzle</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/calibreweb"><img src="https://docs.theme-park.dev/site_assets/calibreweb/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/calibreweb">Calibre-web</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/xbackbone"><img src="https://docs.theme-park.dev/site_assets/xbackbone/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/xbackbone">Xbackbone</a></p>
+</td>
+</tr>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/filebrowser"><img src="https://docs.theme-park.dev/site_assets/filebrowser/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/filebrowser">Filebrowser</a></p>
+
+<td>
+<p><a href="https://docs.theme-park.dev/themes/librespeed"><img src="https://docs.theme-park.dev/site_assets/librespeed/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/librespeed">librespeed</a></p>
+</td>
+
+<td>
+<p><a href="https://docs.theme-park.dev/themes/lazylibrarian"><img src="https://docs.theme-park.dev/site_assets/lazylibrarian/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/lazylibrarian">Lazylibrarian</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/adguard"><img src="https://docs.theme-park.dev/site_assets/adguard/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/adguard">Adguard</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/gaps"><img src="https://docs.theme-park.dev/site_assets/gaps/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/gaps">Gaps</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/uptime-kuma"><img src="https://docs.theme-park.dev/site_assets/uptime-kuma/logo.png" alt="" width="48" height="45" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/uptime-kuma">Uptime Kuma</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/mylar3"><img src="https://docs.theme-park.dev/site_assets/mylar3/logo.png" alt="" width="48" height="45" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/mylar3">Mylar 3</a></p>
+</td>
+</tr>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/bitwarden"><img src="https://docs.theme-park.dev/site_assets/bitwarden/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/bitwarden">Bitwarden</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/duplicacy"><img src="https://docs.theme-park.dev/site_assets/duplicacy/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/duplicacy">Duplicacy</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/kitana"><img src="https://docs.theme-park.dev/site_assets/kitana/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/kitana">Kitana</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/resilio-sync"><img src="https://docs.theme-park.dev/site_assets/resilio-sync/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/resilio-sync">Resilio-Sync</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/gitea"><img src="https://docs.theme-park.dev/site_assets/gitea/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/gitea">Gitea</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/unraid"><img src="https://docs.theme-park.dev/site_assets/unraid/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/unraid">Unraid</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/moviematch"><img src="https://docs.theme-park.dev/site_assets/moviematch/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/moviematch">Moviematch</a></p>
+</td>
+</tr>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/petio"><img src="https://docs.theme-park.dev/site_assets/petio/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/petio">Petio</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/flood"><img src="https://docs.theme-park.dev/site_assets/flood/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/flood">Flood</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/vuetorrent"><img src="https://docs.theme-park.dev/site_assets/vuetorrent/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/vuetorrent">VueTorrent</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/requestrr"><img src="https://docs.theme-park.dev/site_assets/requestrr/logo.png" alt="" width="48" height="45" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/requestrr">Requestrr</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/duplicati"><img src="https://docs.theme-park.dev/site_assets/duplicati/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/duplicati">Duplicati</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/synclounge"><img src="https://docs.theme-park.dev/site_assets/synclounge/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/synclounge">Synclounge</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/thelounge"><img src="https://docs.theme-park.dev/site_assets/thelounge/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/thelounge">The Lounge (Deprecated)</a></p>
+</td>
+</tr>
+<tr>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/grafana"><img src="https://docs.theme-park.dev/site_assets/grafana/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/grafana">Grafana (Deprecated)</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/monitorr"><img src="https://docs.theme-park.dev/site_assets/monitorr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/monitorr">Monitorr (Deprecated)</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/webtools"><img src="https://docs.theme-park.dev/site_assets/webtools/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/webtools">Webtools (Deprecated)</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/logarr"><img src="https://docs.theme-park.dev/site_assets/logarr/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/logarr">Logarr (Deprecated)</a></p>
+</td>
+<td>
+<p><a href="https://docs.theme-park.dev/themes/plpp"><img src="https://docs.theme-park.dev/site_assets/plpp/logo.png" alt="" width="48" height="48" /></a></p>
+<p><a href="https://docs.theme-park.dev/themes/plpp">PLPP (Deprecated)</a></p>
+</td>
+<td>
+<!-- <p><a href=""><img src="" alt="" width="48" height="48" /></a></p>
+<p><a href=""></a></p> -->
+</td>
+<td>
+<!-- <p><a href=""><img src="" alt="" width="48" height="48" /></a></p>
+<p><a href=""></a></p> -->
+</td>
+</tr>
+</tbody>
+</table>
+</div>
+
+<br>
+
+<h3>Honourable mentions</h3>
+
+<p><a href="https://github.com/Archmonger/Blackberry-Themes">Archmonger/Blackberry-Themes</a></p>
--- a/banners/tp_banner.png
+++ b/banners/tp_banner.png
--- a/css/addons/bazarr/bazarr-4k-logo/bazarr-4k-logo.css
+++ b/css/addons/bazarr/bazarr-4k-logo/bazarr-4k-logo.css
@ -0,0 +1,35 @@
+/* Desktop */ 
+@media (min-width: 752px) {
+    .header-icon.px-3.m-0.d-none.d-md-block img  {
+        display: none !important;
+    }
+    .header-icon.px-3.m-0.d-none.d-md-block:before {
+        background-image: url("/css/addons/bazarr/bazarr-4k-logo/bazarr4k.png");
+        display: inline-block;
+        width: 32px; 
+        height: 32px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+    }    
+} 
+
+/* Mobile */
+@media (max-width: 767px) {
+   .sidebar-title.d-flex.align-items-center.d-md-none.container img  {
+        display: none !important;
+    }   
+   .sidebar-title.d-flex.align-items-center.d-md-none.container:before {
+        background-image: url("/css/addons/bazarr/bazarr-4k-logo/bazarr4k.png");
+        display: inline-block;
+        width: 32px; 
+        height: 32px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+    } 
+}
--- a/css/addons/bazarr/bazarr-4k-logo/bazarr4k.png
+++ b/css/addons/bazarr/bazarr-4k-logo/bazarr4k.png
--- a/css/addons/bazarr/bazarr-darker/bazarr-darker.css
+++ b/css/addons/bazarr/bazarr-darker/bazarr-darker.css
@ -0,0 +1,65 @@
+:root {
+    --main-bg-color: #313544;
+
+    --modal-bg-color: #252833;
+    --modal-header-color: #252833;
+    --modal-footer-color: #252833;
+
+    --drop-down-menu-bg: #252833;
+
+    --button-color: #911f93;
+    --button-color-hover: #721873;
+    --button-text: #eee;
+    --button-text-hover: #fff;
+
+    --accent-color: 145, 31, 147;
+    --accent-color-hover: rgb(var(--accent-color), .8);
+    --link-color: #b828bb;
+    --link-color-hover: #911f93;
+    --label-text-color: #eee;
+
+    --text: #ccc;
+    --text-hover: #fff;
+    --text-muted: #999;
+
+    /*Specials*/
+    --arr-queue-color: #6c757d;
+    --side-menu-active: #252833;
+    --side-menu-color: #3a3f51;
+    --side-menu-link-color: #fff;
+    --scroller-hover: #606060;
+    --scroller: #707070;
+    --border-color: #606060;
+    --label-color: #911f93;
+    --label-info: #5d9cec;
+    --header-color: #911f93;
+}
+
+/* HEADER */
+.header-container .bg-primary {
+    background-color: var(--header-color) !important;
+}
+
+/* SIDE MENU */
+.sidebar-container {
+    background-color: var(--side-menu-color) !important;
+    color: white !important;
+}
+
+.sidebar-container .sidebar-button {
+    color: var(--side-menu-link-color) !important;
+}
+
+.sidebar-container .sidebar-button {
+    background-color: var(--side-menu-color) !important;
+}
+.sidebar-container .sidebar-button.sb-active, .sidebar-container .sidebar-button.sb-active:hover {
+    color: var(--side-menu-link-color) !important;
+    background-color: var(--side-menu-active) !important;
+}
+
+
+.sidebar-container .sidebar-button:hover {
+    background-color: var(--side-menu-active) !important;
+    color: var(--side-menu-link-color) !important;
+}
--- a/css/addons/lidarr/lidarr-darker/lidarr-darker.css
+++ b/css/addons/lidarr/lidarr-darker/lidarr-darker.css
@ -0,0 +1,117 @@
+:root {
+    --main-bg-color: #454545;
+
+    --modal-bg-color: #353535;
+    --modal-header-color: #353535;
+    --modal-footer-color: #353535;
+
+    --drop-down-menu-bg: #4d8069;
+
+    --button-color: #5899eb;
+    --button-color-hover: #4b91ea;
+    --button-text: #eee;
+    --button-text-hover: #fff;
+
+    --accent-color: 0, 166, 91;
+    --accent-color-hover: rgb(0, 166, 91, .8);
+    --link-color: rgb(0, 166, 91);
+    --link-color-hover: rgb(0, 166, 91, .8);
+    --label-text-color: #eee;
+
+    --text: #ccc;
+    --text-hover: #fff;
+    --text-muted: #999;
+
+    /*Specials*/
+    --arr-queue-color: #00a65b;
+    --side-menu-active: #252525;
+    --scroller-hover: #606060;
+    --scroller: #707070;
+    --border-color: #606060;
+    --label-color: #1d563d;
+    --label-info: #5d9cec;
+    --header-color: #00a65b;
+    --side-menu-color: #353535;
+}
+
+/* HEADER */
+
+[class*="PageHeader-header-"] {
+    background-color: var(--header-color);
+    color: #fff;
+}
+
+[class*="PageToolbar-toolbar-"] {
+    background-color: #1d563d;
+    color: #e1e2e3;
+}
+
+/* SIDE MENU */
+
+[class*="PageSidebar-sidebar-"] {
+    background-color: #353535;
+    color: #fff;
+}
+
+[class*=PageSidebarItem-link-]:focus {
+    color: rgb(var(--accent-color)) !important;
+}
+
+[class*=PageSidebarItem-isActiveLink-] {
+    color: var(--link-color) !important;
+}
+
+[class*=PageSidebarItem-isActiveParentLink-] {
+    background-color: var(--side-menu-active);
+}
+
+/* SCROLLER */
+
+[class*=OverlayScroller-thumb-]:hover {
+    background-color: var(--scroller-hover) !important;
+}
+
+[class*="OverlayScroller-thumb-"],
+[class*=Scroller-scroller-]::-webkit-scrollbar-thumb {
+    background-color: var(--scroller) !important;
+}
+
+/* MODALS */
+
+[class*=ModalHeader-modalHeader-],
+[class*=FieldSet-legend-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+[class*=ModalFooter-modalFooter-] {
+    border-top: 1px solid var(--border-color);
+}
+
+/* LABLES */
+
+[class*="Label-default-"] {
+    border-color: var(--label-color);
+    background-color: var(--label-color);
+    color: white;
+}
+
+[class*="Label-info-"]:not([class*="PageSidebarItem-status-"] [class*="Label-info-"]) {
+    border-color: var(--label-info);
+    background-color: var(--label-info);
+    color: #fff;
+}
+
+/* SETTINGS */
+
+[class*=Settings-link-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+/* SEARCH DROP DOWN */
+
+[class*=ArtistSearchInput-containerOpen-] [class*=ArtistSearchInput-artistContainer-] {
+    border: 1px solid var(--main-bg-color);
+    background-color: var(--main-bg-color);
+    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
+    color: #e1e2e3;
+}
--- a/css/addons/organizr/glass/example.jpg
+++ b/css/addons/organizr/glass/example.jpg
--- a/css/addons/organizr/glass/glass-base.css
+++ b/css/addons/organizr/glass/glass-base.css
@ -0,0 +1,861 @@
+/* Set the Organizr theme to either Aquamarine or Hotline */
+/* Import the glass-base.css and root variables in the Custom Theme CSS box like below */
+/* 
+@import "/css/addons/organizr/glass/organizr-base-old.css"
+@import "/css/addons/organizr/glass/glass-base.css"; 
+:root {
+    --main-bg-color: url(https://domain.com/your/hosted/wallpaper.jpg) center center/cover no-repeat fixed;
+    --mobile-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
+
+    --link-color: #fff;
+    --custom-buttons-color: radial-gradient(ellipse at center, #3F51B5 0%, #009688 100%) center center/cover no-repeat fixed;
+    --hompage-item-hover: radial-gradient(ellipse at center, rgba(0, 150, 136, 0.33) 0%, #b53f3f73 100%) center center/cover no-repeat fixed;
+    --notification-box-line: #000;
+
+    --div-background-color-10: rgba(0, 0, 0, 0.15);
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+    --div-background-color-25: rgba(0, 0, 0, 0.35);
+    --div-background-color-35: rgba(0, 0, 0, 0.45);
+}
+
+*/
+
+/* Replace the variables if you have a dark background  */
+/* Light colors for dark backgrounds */
+/*
+    --div-background-color-10: rgba(255, 255, 255, 0.1);
+    --div-background-color-15: rgba(255, 255, 255, 0.15);
+    --div-background-color-25: rgba(255, 255, 255, 0.25);
+    --div-background-color-35: rgba(255, 255, 255, 0.35);
+*/
+/* Dark blur colors for bright backgrounds */
+/*
+    --div-background-color-10: rgba(0, 0, 0, 0.15);
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+    --div-background-color-25: rgba(0, 0, 0, 0.35);
+    --div-background-color-35: rgba(0, 0, 0, 0.45);
+	
+*/
+
+/*Settings */
+
+.feeds li>div i {
+    color: black !important;
+}
+
+.row-in i {
+    font-size: 24px;
+    color: black;
+}
+
+.profile-social-icons a {
+    color: #eee;
+}
+
+.btn-info.btn-outline {
+    color: #eee !important;
+}
+
+.btn-info.btn-outline:hover {
+    background: var(--div-background-color-15);
+    color: #fff;
+}
+
+.content-wrap {
+    background: var(--div-background-color-15) !important;
+    border-radius: 0 0 15px 15px;
+}
+
+.content-wrap section.content-current {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: rgba(0, 0, 0, 0);
+    border-radius: 0 0 15px 15px;
+}
+
+.panel-blue .panel-heading,
+.panel-info .panel-heading {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: transparent;
+
+}
+
+.panel .table {
+    background: transparent !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+.sttabs nav ul {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-radius: 15px 15px 0 0;
+
+}
+
+.sttabs nav {
+    background: var(--div-background-color-25);
+    border-radius: 15px 15px 0 0;
+}
+
+#settings-main-system-settings-anchor>.sttabs nav ul li {
+    border-radius: 15px;
+}
+
+.tab-content>.active {
+    background: transparent;
+}
+
+.bg-title {
+    background: var(--div-background-color-10);
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+.white-box {
+    background: transparent;
+}
+
+.white-popup-block {
+    background: var(--div-background-color-10) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+}
+
+.user-bg {
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+}
+
+#internal-Settings .nav-tabs>li.active>a,
+.nav-tabs>li.active>a:hover {
+    padding-top: 10px;
+}
+
+/* Nav bar
+.navbar-header {
+    background: transparent !important;
+}
+*/
+@media (min-width: 768px) {
+    .navbar-static-top {
+        background: var(--main-bg) !important;
+    }
+}
+
+/* Dropdown */
+.dropdown-menu {
+    background: var(--div-background-color-25);
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+.open>.dropdown-menu {
+    display: block;
+    border-radius: 15px;
+}
+
+.navbar-top-links .dropdown-user {
+    border-radius: 15px;
+}
+
+#plexRecent .recent-filter {
+    background: var(--div-background-color-25) !important;
+    border-radius: 15px;
+}
+
+/* Side bar */
+.sidebar {
+    background: var(--div-background-color-15) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    box-shadow: none;
+
+}
+
+.sidebar-head {
+    background: transparent !important;
+}
+
+/*Calendar */
+.fc-toolbar {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: var(--div-background-color-15) !important;
+
+}
+
+.fc-view {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: var(--div-background-color-15) !important;
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+}
+
+.fc-popover {
+    background: var(--div-background-color-25);
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+#homepageOrdercalendar .fc-toolbar {
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+
+}
+
+.fc-row,
+.fc-unthemed {
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+}
+
+/* Calendar mobile*/
+.fc th.fc-widget-header {
+    padding-left: 5px;
+}
+
+/*Error page */
+.error-body {
+    padding-top: 15%;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    height: -webkit-fill-available;
+    margin-top: -10%;
+
+}
+
+
+/* notify - popup */
+.iziToast.update-notify.iziToast-layout2,
+.iziToast.success-notify.iziToast-layout2 {
+    border: none;
+    background: var(--div-background-color-25) !important;
+    border-bottom: transparent;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+.iziToast.warning-notify.iziToast-layout2 {
+    background: var(--div-background-color-25);
+    border: 1px solid transparent;
+    border-bottom: transparent;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+.iziToast:after {
+    background: transparent !important;
+}
+
+.mfp-container {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+.mfp-zoom-out.mfp-ready.mfp-bg {
+    opacity: 1 !important;
+    background: var(--main-bg-color) !important;
+}
+
+.mfp-wrap {
+    background: var(--main-bg-color);
+}
+
+.main-email-panel .panel-body {
+    background: var(--div-background-color-25) !important;
+    border-bottom-right-radius: 15px !important;
+    border-bottom-left-radius: 15px !important;
+}
+
+.white-popup-block {
+    background: var(--div-background-color-25) !important;
+}
+
+.white-popup .panel-footer {
+    background: var(--div-background-color-25);
+    border-top: 1px solid #fff;
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+}
+
+.panel>.table-responsive:last-child>.table:last-child,
+.panel>.table:last-child {
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+}
+
+/* Homepage downloader */
+
+#homepageOrderdownloader {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: var(--div-background-color-15);
+    padding: 10px;
+    border-radius: 15px;
+
+}
+
+#homepageOrderdownloader .nav-tabs>li.active>a,
+.nav-tabs>li.active>a:hover {
+    padding-top: 14px;
+}
+
+#homepageOrderdownloader .nav-tabs>li>a {
+    padding-top: 14px;
+}
+
+/* Homepage card */
+.nowPlayingItem>.white-box>.el-card-item {
+    background: var(--div-background-color-15) !important;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-radius: 15px;
+
+}
+
+.active-tab-Homepage .white-popup .panel-body,
+.white-popup>.col-md-6>.white-box:nth-child(2) {
+    background: var(--div-background-color-25) !important;
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+}
+
+#plexStreams .el-element-overlay .el-card-item .el-overlay-1 img,
+#plexStreams .el-element-overlay:hover .el-card-item:hover .el-overlay-1:hover img:hover {
+    border-top-right-radius: 15px;
+    border-top-left-radius: 15px;
+}
+
+.el-element-overlay .el-card-item .el-overlay-1 {
+    border-top-right-radius: 15px;
+    border-top-left-radius: 15px;
+}
+
+.el-element-overlay .el-card-item .el-overlay {
+    border-top-right-radius: 15px;
+    border-top-left-radius: 15px;
+}
+
+.white-popup .panel-heading,
+.white-popup>.col-md-6>.white-box:first-child {
+    background: var(--div-background-color-25) !important;
+    border-top-right-radius: 15px;
+    border-top-left-radius: 15px;
+}
+
+
+.label-info {
+    background: var(--div-background-color-25);
+}
+
+#plexRecent,
+#homepageOrderplexplaylist,
+#homepageOrdercalendar,
+#homepageOrderembyrecent,
+#ombi-requests,
+#homepageOrderdeluge,
+#homepageOrdernzbget,
+#homepageOrdertransmission,
+#homepageOrderrTorrent,
+#homepageOrderjdownloader,
+#homepageOrdersabnzbd,
+#homepageOrderqBittorrent {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: var(--div-background-color-15);
+    margin: 5px;
+    border-radius: 15px;
+
+}
+
+.bg-info {
+    background-color: transparent !important;
+}
+
+/* Health checks */
+.card-body {
+    background: var(--div-background-color-25) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+
+}
+
+.bg-inverse .healthPosition {
+    background: var(--div-background-color-25) !important;
+    -webkit-backdrop-filter: saturate(180%) blur(30px);
+    backdrop-filter: saturate(180%) blur(30px);
+
+}
+
+/* Unifi cards */
+.unifiCards .panel-wrapper.collapse.in {
+    background: var(--div-background-color-15);
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+
+}
+
+.unifiCards .panel-heading {
+    background: var(--div-background-color-35) !important;
+    color: #fff !important;
+    border-color: transparent !important;
+    text-align: inherit !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+    border-bottom: 0px;
+}
+
+.unifiCards .panel-warning .panel-heading,
+.unifiCards .panel-success .panel-heading {
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+    border-bottom-right-radius: 0px;
+    border-bottom-left-radius: 0px;
+}
+
+#allUnifi .unifiCards .panel .panel-warning {
+    border-radius: 15px !important;
+
+}
+
+.unifiCards .ti-close:before {
+    content: "\f111";
+    font-family: FontAwesome;
+    font-size: 20px;
+    color: rgba(255, 69, 58, 1);
+}
+
+.unifiCards .ti-minus:before {
+    content: "\f111";
+    font-family: FontAwesome;
+    font-size: 20px;
+    color: rgba(255, 204, 0, 1);
+}
+
+.unifiCards .ti-plus:before {
+    content: "\f111";
+    font-family: FontAwesome;
+    font-size: 20px;
+    color: rgba(40, 205, 65, 1);
+}
+
+/* Weather boxes */
+#homepageOrderWeatherAndAir .col-lg-2 .white-box,
+#homepageOrderWeatherAndAir>div:nth-child(1)>div.col-lg-4.col-sm-12.col-xs-12>div,
+#homepageOrderWeatherAndAir>div:nth-child(2)>div.col-lg-4.col-sm-12.col-xs-12>div {
+    background: var(--div-background-color-25) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px)
+}
+
+/* Custom HTML */
+#homepageOrdercustomhtmlTwo,
+#homepageOrdercustomhtml {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: var(--div-background-color-15);
+    border-radius: 15px;
+    padding-left: 10px;
+    padding-right: 10px;
+    margin-bottom: 5px;
+}
+
+/* Invite */
+#invite-area .bg-org {
+    background: var(--div-background-color-15) !important;
+    border-radius: 15px;
+}
+
+#new-invite-area .white-popup .panel-body,
+#new-invite-area .white-popup>.col-md-6>.white-box:nth-child(2) {
+    background: var(--div-background-color-15) !important;
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+}
+
+.white-popup .panel-body,
+.white-popup>.col-md-6>.white-box:nth-child(2) {
+    background: var(--div-background-color-15) !important;
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+    -webkit-backdrop-filter: blur(10px) !important;
+    backdrop-filter: blur(10px) !important;
+}
+
+/* Email users */
+.email-div .panel-body {
+    border-radius: 0px !important;
+}
+
+/* Speedtest popup */
+
+#speedtest-area .white-popup .panel-footer {
+    background: var(--div-background-color-25) !important;
+    border-bottom-right-radius: 15px;
+    border-bottom-left-radius: 15px;
+}
+
+#speedtest-area .white-popup .panel-body,
+#speedtest-area .white-popup>.col-md-6>.white-box:nth-child(2) {
+    border-bottom-right-radius: 0px !important;
+    border-bottom-left-radius: 0px !important;
+}
+
+/* Modal */
+.modal-content,
+.modal-header,
+.modal-footer,
+.modal-body {
+    background: var(--div-background-color-10) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-color: transparent;
+}
+
+.modal-body {
+    border-bottom-left-radius: 15px;
+    border-bottom-right-radius: 15px;
+}
+
+.modal-header {
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+}
+
+.modal-open .modal {
+    background: var(--main-bg-color);
+}
+
+.modal-content {
+    border-radius: 15px;
+    box-shadow: none;
+}
+
+/* loginpage sidemenu */
+@media (max-width: 480px) {
+    #wrapper .login-register>.login-box>.white-box {
+        background: transparent !important;
+        margin-top: auto !important;
+        width: 100% !important;
+        -webkit-backdrop-filter: blur(0px) !important;
+        backdrop-filter: blur(0px) !important;
+
+
+    }
+}
+
+@media (max-width: 480px) {
+    .login-box.login-sidebar {
+        background: var(--div-background-color-15) !important;
+        -webkit-backdrop-filter: blur(10px);
+        backdrop-filter: blur(10px);
+
+    }
+}
+
+/* logo */
+.white-box .visible-xs {
+    display: block !important;
+}
+
+.loginLogo {
+    border: 0;
+    margin-top: -60%;
+    transform: translateY(-10%);
+}
+
+@media (max-width: 480px) {
+    .loginLogo {
+        margin-top: -10% !important;
+    }
+}
+
+.blockUI {
+    opacity: 1 !important;
+    background-color: transparent !important;
+}
+
+.blockMsg {
+    background: rgba(0, 0, 0, 0.9) !important;
+    border: none !important;
+}
+
+.login-register>.login-box>.white-box {
+    background: var(--div-background-color-25) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-radius: 15px;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+}
+
+
+.login-register {
+
+    height: 100%;
+    position: fixed;
+}
+
+.slideInRight {
+    -webkit-animation-name: none;
+    animation-name: none;
+}
+
+.login-register .login-box .white-box .bg-org {
+    background-color: transparent !important;
+}
+
+/*2FA login button*/
+.panel-wrapper .panel-body>.btn-warning,
+.btn-warning.disabled {
+    background: var(--div-background-color-15) !important;
+    border: 1px solid #ffc36d00 !important;
+}
+
+/*2FA animation header*/
+.panel-warning .panel-heading,
+.panel-yellow .panel-heading {
+    color: #fff;
+    border-radius: 3px;
+    background-color: rgba(0, 0, 0, 0.3);
+    border-color: #00000000;
+}
+
+/*oAuth Successful*/
+.panel-green .panel-heading,
+.panel-success .panel-heading {
+    color: #53e69d;
+    text-align: center;
+    text-transform: uppercase;
+    border-radius: 3px;
+    background-color: transparent;
+    border-color: transparent;
+}
+
+/*Login sidebar*/
+.login-box.login-sidebar,
+#login-panels .panel-body,
+#login-panels .panel {
+    background: transparent;
+}
+
+#login-panels .form-control,
+#login-panels .btn {
+    background: rgba(255, 255, 255, 0.35);
+    color: white;
+    border-radius: 25px;
+    border: none;
+}
+
+/*  #login-panels {
+    height: 44px;
+    }*/
+#login-panles .btn-info.disabled.focus .btn-info.disabled:focus .btn-info.disabled:hover .btn-info.focus .btn-info:focus .btn-info:hover .btn:hover {
+    background: rgba(255, 255, 255, 0.65);
+    border: none;
+
+}
+
+/*Center login Box*/
+.login-sidebar {
+    position: relative;
+    right: initial;
+}
+
+#lockScreen .white-box {
+    width: 400px;
+    height: 345px;
+}
+
+.login-sidebar .white-box {
+    width: 100%;
+    position: absolute;
+    top: 50%;
+    transform: translateY(-50%);
+}
+
+#lockScreen .white-box {
+    position: absolute;
+    top: 50%;
+    transform: translateY(-50%);
+    background: var(--div-background-color-25);
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-radius: 15px;
+}
+
+.form-control::placeholder {
+    color: white;
+}
+
+#login-username-Input,
+#login-password-Input {
+    text-align: center;
+}
+
+.panel .panel-heading .panel-title,
+label,
+span,
+.fa-lock:before {
+    color: #ffffff;
+}
+
+/* Lock screen */
+#lockScreen .form-material .form-control,
+.form-material .form-control:focus {
+    background: rgba(255, 255, 255, 0.35);
+    border-radius: 25px;
+    padding: inherit;
+    text-align: center;
+}
+
+#lockScreen .btn-info {
+    background: rgba(255, 255, 255, 0.35);
+    border-radius: 25px;
+}
+
+/* Extra */
+.cbutton {
+    background-color: var(--div-background-color-25) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-radius: 15px !important;
+    border: none !important;
+    padding: 4px !important;
+
+}
+
+.cbutton:hover {
+    background: var(--div-background-color-25) !important;
+    -webkit-backdrop-filter: saturate(180%) blur(30px) !important;
+    backdrop-filter: saturate(180%) blur(30px) !important;
+    opacity: 1 !important;
+
+}
+
+/* Debug modal */
+.mdi-package-variant-closed:before {
+    content: "\F3D7";
+    color: black;
+}
+
+.mdi-receipt:before {
+    content: "\F449";
+    color: black;
+}
+
+.debugModal .modal-body {
+    border-bottom-left-radius: 0px !important;
+    border-bottom-right-radius: 0px !important;
+}
+
+.debugModal .modal-footer {
+    background: var(--div-background-color-10) !important;
+    border-bottom-left-radius: 15px !important;
+    border-bottom-right-radius: 15px !important;
+}
+
+#debugPreInfo .slimScrollDiv,
+#debugResults .slimScrollDiv {
+    background: var(--div-background-color-15);
+}
+
+/* Swal popup */
+.swal-overlay--show-modal .swal-modal {
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    background: var(--div-background-color-25);
+    border-radius: 15px;
+}
+
+.swal-title {
+    color: white;
+}
+
+.swal-overlay--show-modal {
+    background: var(--main-bg-color);
+}
+
+/* Mobile*/
+@media (max-width: 480px) {
+    * {
+        -webkit-backdrop-filter: none !important;
+        backdrop-filter: none !important;
+    }
+
+    #page-wrapper {
+        background: var(--mobile-bg-color) !important;
+        background-size: cover;
+        background-repeat: no-repeat;
+        width: 100%;
+        height: 100%;
+    }
+
+    #side-menu {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    .navbar-header {
+        background: var(--div-background-color-25) !important;
+    }
+
+    .navbar-default,
+    .show-sidebar .sidebar .sidebar-head {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    .dropdown-menu {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    #internal-Settings {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    .mfp-zoom-out.mfp-ready.mfp-bg {
+        opacity: 1 !important;
+        background: var(--mobile-bg-color) !important;
+    }
+
+    .mfp-wrap {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    .modal-open .modal {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    #page-wrapper {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    #internal-Settings,
+    #preloader,
+    .preloader,
+    .active-tab-Settings,
+    .error-page {
+        background: var(--mobile-bg-color) !important;
+    }
+
+    html {
+        background: var(--mobile-bg-color) !important;
+    }
+}
--- a/css/addons/organizr/glass/glass-login.css
+++ b/css/addons/organizr/glass/glass-login.css
@ -0,0 +1,192 @@
+:root {
+    --div-background-color-10: rgba(0, 0, 0, 0.15);
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+    --div-background-color-25: rgba(0, 0, 0, 0.35);
+    --div-background-color-35: rgba(0, 0, 0, 0.45);
+}
+
+/* Replace the variables if you have a dark background  */
+/* Light colors for dark backgrounds */
+/*
+    --div-background-color-10: rgba(255, 255, 255, 0.1);
+    --div-background-color-15: rgba(255, 255, 255, 0.15);
+    --div-background-color-25: rgba(255, 255, 255, 0.25);
+    --div-background-color-35: rgba(255, 255, 255, 0.35);
+*/
+/* Dark blur colors for bright backgrounds */
+/*
+    --div-background-color-10: rgba(0, 0, 0, 0.15);
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+    --div-background-color-25: rgba(0, 0, 0, 0.35);
+    --div-background-color-35: rgba(0, 0, 0, 0.45);
+	
+*/
+
+/* loginpage sidemenu */
+@media (max-width: 480px) {
+   #wrapper .login-register > .login-box > .white-box {
+     background: transparent !important;
+     margin-top: auto !important;
+     width: 100% !important;
+    -webkit-backdrop-filter: blur(0px) !important;
+    backdrop-filter: blur(0px) !important;
+
+
+   }
+   }
+
+@media (max-width: 480px) {
+   .login-box.login-sidebar {
+    background: var(--div-background-color-15) !important;
+    -webkit-backdrop-filter:  blur(10px);
+    backdrop-filter:  blur(10px);
+
+}
+}
+
+/* logo */
+	.white-box .visible-xs {
+		display: block!important;
+	}
+	.loginLogo {
+    border: 0;
+    margin-top: -60%;
+    transform: translateY(-10%);
+	}
+	@media (max-width: 480px) {
+		.loginLogo {
+		margin-top: -10% !important;
+		}
+	}
+	.blockUI {
+		opacity: 1 !important;
+		background-color: transparent !important;
+	}
+	.blockMsg {
+		background: rgba(0, 0, 0, 0.9) !important;
+		border: none !important;
+	}
+	
+    .login-register > .login-box > .white-box {
+    background: var(--div-background-color-25) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    border-radius: 15px;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    }
+
+
+    .login-register {
+		
+        height: 100%;
+        position: fixed;
+    }
+
+	.slideInRight {
+		-webkit-animation-name: none;
+		animation-name: none;
+	}
+
+	.login-register  .login-box  .white-box  .bg-org {
+		background-color: transparent !important;
+    }
+
+	/*2FA login button*/
+	.panel-wrapper .panel-body > .btn-warning, .btn-warning.disabled {
+        background: var(--div-background-color-15) !important;
+        border: 1px solid #ffc36d00 !important;
+        }
+
+        /*2FA animation header*/
+        .panel-warning .panel-heading, .panel-yellow .panel-heading {
+        color: #fff;
+        border-radius: 3px;
+        background-color: rgba(0, 0, 0, 0.3);
+        border-color: #00000000;
+        }
+
+        /*oAuth Successful*/
+        .panel-green .panel-heading, .panel-success .panel-heading {
+        color: #53e69d;
+        text-align: center;
+        text-transform: uppercase;
+        border-radius: 3px;
+        background-color: transparent;
+        border-color: transparent;
+        }
+
+	/*Login sidebar*/
+	.login-box.login-sidebar,
+	#login-panels .panel-body,
+	#login-panels .panel {
+		background: transparent;
+	}
+	
+    #login-panels  .form-control ,  #login-panels .btn {
+    background: rgba(255, 255, 255, 0.35);
+    color: white;
+    border-radius: 25px;
+    border: none;
+    }
+  /*  #login-panels {
+    height: 44px;
+    }*/
+    #login-panles .btn-info.disabled.focus .btn-info.disabled:focus .btn-info.disabled:hover .btn-info.focus .btn-info:focus .btn-info:hover .btn:hover {
+    background: rgba(255,255, 255, 0.65);
+    border:none;
+
+    }
+	/*Center login Box*/
+	.login-sidebar {
+		position: relative;
+		right: initial;
+	}
+
+	#lockScreen .white-box {
+		width: 400px;
+		height: 345px;
+	}
+	.login-sidebar .white-box {
+		width: 100%;
+		position: absolute;
+		top: 50%;
+		transform: translateY(-50%);
+	}
+
+	#lockScreen .white-box {
+		position: absolute;
+		top: 50%;
+		transform: translateY(-50%);
+		background: var(--div-background-color-25);
+		-webkit-box-shadow: none;
+		box-shadow: none;
+		-webkit-backdrop-filter: blur(10px);
+		backdrop-filter: blur(10px);
+		border-radius: 15px;
+    }
+    .form-control::placeholder {
+        color: white;
+    }
+    #login-username-Input, #login-password-Input {
+            text-align: center;
+    }
+    .panel .panel-heading .panel-title, label, span, .fa-lock:before {
+    color: #ffffff;
+    }
+	/* Lock screen */ 
+	#lockScreen .form-material .form-control, .form-material .form-control:focus {
+		background: rgba(255, 255, 255, 0.35);
+		border-radius: 25px;
+		padding: inherit;
+		text-align: center;
+	}
+	 #lockScreen  .btn-info {
+		background: rgba(255, 255, 255, 0.35);
+		border-radius: 25px;
+		border: 1px solid transparent;
+	 }
+	 #lockScreen .btn-info:hover {
+		 border: 1px solid transparent;
+	 }
+	
--- a/css/addons/organizr/glass/organizr-base-old.css
+++ b/css/addons/organizr/glass/organizr-base-old.css
--- a/css/addons/plex/overseerr-side-menu/overseerr-side-menu.css
+++ b/css/addons/plex/overseerr-side-menu/overseerr-side-menu.css
@ -0,0 +1,111 @@
+/*    dP   dP                                                                  dP        */
+/*    88   88                                                                  88        */
+/*  d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b.    88d888b. .d8888b. 88d888b. 88  .dP   */
+/*    88   88'  `88 88ooood8 88'`88'`88 88ooood8    88'  `88 88'  `88 88'  `88 88888"    */
+/*    88   88    88 88.  ... 88  88  88 88.  ...    88.  .88 88.  .88 88       88  `8b.  */
+/*    dP   dP    dP `88888P' dP  dP  dP `88888P' 88 88Y888P' `88888P8 dP       dP   `YP  */
+/*                                                  88                                   */
+/*                                                  dP					 */
+
+/*		   		        Made by @gilbN					 */
+/*			      https://github.com/gilbN/theme.park			 */
+
+/* PLEX OVERSEERR SIDE MENU */
+
+/* APP VARS*/
+:root {
+    --sidebar-color: #1f2937;
+    --menu-item: #111827;
+    --menu-item-hover: #374151;
+}
+
+/* EXTRA CSS */
+[class*="SourceSidebar-openSidebar-"][class*="SourceSidebar-sidebar-"],
+[class*="SourceSidebar-sidebar-"] {
+    background: var(--sidebar-color) !important;
+    padding-top: 10px;
+}
+
+[class*="SourceSidebarLink-isSelected-"]:before {
+    background-color: transparent !important;
+}
+
+[class*="NavBar-container-"] {
+    background: rgb(0 0 0 / 0%) !important;
+}
+
+[class*="SourceSidebar-openSidebar-"] [class*="SourceSidebarLink-isSelected-"] {
+    background: var(--menu-item);
+    box-shadow: inset 4px 0 0 0 transparent !important;
+    border-radius: 5px;
+    margin-bottom: 5px;
+
+}
+
+[class*="SourceSidebarLink-isSelected-"] [class*="SourceSidebarLink-iconContainer-"],
+[class*="SourceSidebarLink-isSelected-"] [class*="SourceSidebarLink-title-"] {
+    color: white;
+}
+
+[class*="SourceSidebar-openSidebar-"] [class*="SourceSidebarLink-button-"]:hover,
+[class*="SourceSidebar-openSidebar-"] [class*="SourceSidebarLink-isActive-"] {
+    background: var(--menu-item-hover);
+    border-radius: 5px;
+}
+
+[class*="SourceSidebarLink-button-"] {
+    margin-bottom: 5px;
+}
+
+[class*="SourceSidebar-expandedSidebar-"][class*="SourceSidebar-sidebar-"] {
+    background: var(--sidebar-color) !important;
+}
+
+[class*="SourceSidebar-expandedSidebar-"][class*="SourceSidebar-sidebar-"] [class*="SourceSidebarLink-isSelected-"] {
+    background: var(--menu-item) !important;
+}
+
+[class*="SourceSidebarContent-expandedSidebarContent-"],
+[class*="AllSourcesSidebarContent-container-"] {
+    padding: 10px;
+}
+
+[class*="SourceSidebar-collapsedSidebar-"][class*="SourceSidebar-sidebar-"] [class*="AllSourcesSidebarContent-container-"] {
+    padding: 0px;
+}
+
+[class*="SourceSidebarContent-expandedSidebarContent-"] div {
+    border-radius: 5px;
+}
+
+[class*="SourceSidebarContent-expandedSidebarContent-"] div:hover:not([data-qa-id="sidebarMore"] div) {
+    background-color: var(--menu-item-hover);
+}
+
+[class*="SourceSidebar-collapsedSidebar-"] [class*="SourceSidebar-sidebar-"] {
+    border-radius: 0px !important;
+}
+
+[class*="SourceSidebarContent-expandedSidebarContent-"] [class*="SourceSidebarLink-button-"][class*="SidebarLink-sidebarLink-"][class*="Link-default-"][class*="SourceSidebarLink-small-"][class*="SourceSidebarLink-isSelected-"] {
+    box-shadow: none !important;
+    border-radius: 5px;
+}
+
+[class*="SourceSidebar-collapsedSidebar-"][class*="SourceSidebar-sidebar-"] [class*="SourceSidebarItem-button-"][class*="SourceSidebarLink-button-"][class*="SidebarLink-sidebarLink-"][class*="Link-default-"][class*="SourceSidebarLink-small-"][class*="SourceSidebarItem-isSelected-"][class*="SourceSidebarLink-isSelected-"] {
+    box-shadow: inset 4px 0 0 0 rgb(var(--accent-color)) !important;
+    border-radius: 0px;
+}
+
+[class*="SourceSidebarLink-button-"][class*="SidebarLink-sidebarLink-"][class*="Link-default-"][class*="SourceSidebarLink-small-"][class*="SourceSidebarLink-isSelected-"]:hover {
+    box-shadow: none !important;
+    background: var(--menu-item-hover) !important;
+}
+
+[class*="SourceSidebar-collapsedSidebar-"][class*="SourceSidebarLink-button-"][class*="SidebarLink-sidebarLink-"][class*="Link-default-"][class*="SourceSidebarLink-small-"][class*="SourceSidebarLink-isSelected-"]:hover {
+    box-shadow: inset 4px 0 0 0 rgb(var(--accent-color)) !important;
+}
+
+[class*="SourceSidebarLink-sourceLink-"]:hover [class*="SourceSidebarLink-iconContainer-"],
+[class*="SourceSidebarLink-sourceLink-"]:hover [class*="SourceSidebarLink-title-"] {
+    color: white;
+}
--- a/css/addons/plex/plex-alt-logo/SeekPng.com_your-logo-here-png_2467553.png
+++ b/css/addons/plex/plex-alt-logo/SeekPng.com_your-logo-here-png_2467553.png
--- a/css/addons/plex/plex-alt-logo/plex-alt-logo.css
+++ b/css/addons/plex/plex-alt-logo/plex-alt-logo.css
@ -0,0 +1,8 @@
+[class*="NavBar-plexLogo-"] {
+    background-image: url("/css/addons/plex/plex-alt-logo/SeekPng.com_your-logo-here-png_2467553.png");
+    background-position: 50%;
+    background-repeat: no-repeat;
+    background-size: contain;
+    margin: 0 10px;
+    width: 45px;
+}
--- a/css/addons/prowlarr/prowlarr-darker/prowlarr-darker.css
+++ b/css/addons/prowlarr/prowlarr-darker/prowlarr-darker.css
@ -0,0 +1,133 @@
+:root {
+    --main-bg-color: #454545;
+
+    --modal-bg-color: #454545;
+    --modal-header-color: #454545;
+    --modal-footer-color: #454545;
+
+    --drop-down-menu-bg: #606060;
+
+    --button-color: #5899eb;
+    --button-color-hover: #4b91ea;
+    --button-text: #eee;
+    --button-text-hover: #fff;
+
+    --accent-color: 230, 96, 0;
+    --accent-color-hover: rgb(var(--accent-color),.8);
+    --link-color: rgb(230, 96, 0);
+    --link-color-hover: rgb(230, 96, 0, .8);
+    --label-text-color: #eee;
+
+    --text: #ccc;
+    --text-hover: #fff;
+    --text-muted: #999;
+
+    /*Specials*/
+    --arr-queue-color: #5d9cec;
+    --side-menu-active: #333333;
+    --scroller-hover: #606060;
+    --scroller: #707070;
+    --border-color: #606060;
+    --label-color: #707070;
+    --label-info: #5d9cec;
+    --header-color: #e66000;
+    --side-menu-color: #595959;
+    --side-menu-link-color: #e66000;
+}
+
+/* HEADER */
+
+[class*="PageHeader-header-"] {
+    background-color: var(--header-color);
+    color: #fff;
+}
+
+[class*="PageToolbar-toolbar-"] {
+    background-color: #707070;
+    color: var(--text);
+}
+
+/* SIDE MENU */
+
+[class*="PageSidebar-sidebar-"] {
+    background-color: var(--side-menu-color);
+    color: #fff;
+}
+
+[class*=PageSidebarItem-link-]:focus {
+    color: rgb(var(--accent-color)) !important;
+}
+
+[class*=PageSidebarItem-isActiveLink-] {
+    color: var(--side-menu-link-color) !important;
+}
+
+[class*=PageSidebarItem-isActiveParentLink-] {
+    background-color: var(--side-menu-active);
+}
+
+/* SCROLLER */
+
+[class*=ImportSeriesSelectSeries-results-]::-webkit-scrollbar-thumb:hover,
+[class*=OverlayScroller-thumb-]:hover {
+    background-color: var(--scroller-hover) !important;
+}
+
+[class*="OverlayScroller-thumb-"],
+[class*=Scroller-scroller-]::-webkit-scrollbar-thumb {
+    background-color: var(--scroller) !important;
+}
+
+/* MODALS */
+
+[class*=ModalHeader-modalHeader-],
+[class*=FieldSet-legend-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+[class*=ModalFooter-modalFooter-] {
+    border-top: 1px solid var(--border-color);
+}
+
+/* LABLES */
+
+[class*="Label-default-"] {
+    border-color: var(--label-color);
+    background-color: var(--label-color);
+    color: white;
+}
+
+[class*="Label-info-"]:not([class*="PageSidebarItem-status-"] [class*="Label-info-"]) {
+    border-color: var(--label-info);
+    background-color: var(--label-info);
+    color: #fff;
+}
+
+[class*="Label-disabled-"][class*="Label-outline-"] {
+    color: #000;
+}
+
+[class*="Label-outline-"] {
+    background-color: #989898;
+}
+
+[class*="Label-success-"] {
+    color: #000;
+}
+
+/* SETTINGS */
+
+[class*=Settings-link-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+/* SEARCH DROP DOWN */
+
+[class*=IndexerSearchInput-containerOpen-] [class*=IndexerSearchInput-movieContainer-] {
+    border: 1px solid var(--drop-down-menu-bg);
+    background-color: var(--drop-down-menu-bg);
+    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
+    color: #e1e2e3;
+}
+
+/* BUTTONS */
--- a/css/addons/radarr/radarr-4k-logo/radarr-4k-logo.css
+++ b/css/addons/radarr/radarr-4k-logo/radarr-4k-logo.css
@ -0,0 +1,96 @@
+/* Desktop */
+@media (min-width: 752px) {
+    .navbar-brand>img {
+        display:none !important; 
+        }
+    .navbar > .container-fluid .navbar-brand:before {
+        background-image: url("/css/addons/radarr/radarr-4k-logo/radarr4k.png");
+        display: inline-block;
+        width: 128px; 
+        height: 128px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+        }
+    }
+    /* Mobile */
+    @media (max-width: 767px) {
+    .navbar-brand  .visible-xs img {
+        display: none !important;
+        } 
+    .navbar-brand .visible-xs  {
+        display: inline !important;
+        }     
+    .navbar > .container-fluid .navbar-brand:before {
+        background-image: url("/css/addons/radarr/radarr-4k-logo/radarr4k.png");
+        display: inline-block;
+        width: 32px; 
+        height: 32px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+        margin-bottom: -12px;
+        }
+    }
+
+/* Radarr V3*/
+@media (min-width: 752px) {
+    [class*="PageHeader-logoFull-"]  {
+        display: none !important;
+    }
+    [class*="PageHeader-logoContainer-"]:before {
+        background-image: url("/css/addons/radarr/radarr-4k-logo/radarr4k-v3.png");
+        display: inline-block;
+        width: 148px; 
+        height: 48px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+    }    
+} 
+
+@media (max-width: 767px) {
+    [class*="PageHeader-logo-"]  {
+        display: none !important;
+    }
+    [class*="PageHeader-logoContainer-"]{
+        background-image: url("/css/addons/radarr/radarr-4k-logo/radarr-v3-mobile.png");
+        display: inline-block;
+        width: 32px; 
+        height: 32px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+        margin-left: 20px;
+        margin-right: 8px;
+        flex: 0 0 32px;
+    } 
+}
+
+[class*="LoadingPage-logoFull-"] {
+    display: none !important;
+}
+
+[class*="LoadingPage-page-"]:before {
+        background-image: url("/css/addons/radarr/radarr-4k-logo/radarr4k-v3.png");
+        display: inline-block;
+        width: 148px; 
+        height: 48px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+        margin-top: 50px;
+        margin-right: auto;
+        margin-left: auto;
+
+}
--- a/css/addons/radarr/radarr-4k-logo/radarr-v3-mobile.png
+++ b/css/addons/radarr/radarr-4k-logo/radarr-v3-mobile.png
--- a/css/addons/radarr/radarr-4k-logo/radarr4k-v3.png
+++ b/css/addons/radarr/radarr-4k-logo/radarr4k-v3.png
--- a/css/addons/radarr/radarr-4k-logo/radarr4k.png
+++ b/css/addons/radarr/radarr-4k-logo/radarr4k.png
--- a/css/addons/radarr/radarr-darker/radarr-darker.css
+++ b/css/addons/radarr/radarr-darker/radarr-darker.css
@ -0,0 +1,124 @@
+:root {
+    --main-bg-color: #454545;
+
+    --modal-bg-color: #595959;
+    --modal-header-color: #595959;
+    --modal-footer-color: #595959;
+
+    --drop-down-menu-bg: #606060;
+
+    --button-color: #5899eb;
+    --button-color-hover: #4b91ea;
+    --button-text: #eee;
+    --button-text-hover: #fff;
+
+    --accent-color: 255, 194, 48;
+    --accent-color-hover: rgb(255, 194, 48, .8);
+    --link-color: rgb(255, 194, 48);
+    --link-color-hover: rgb(255, 194, 48, .8);
+    --label-text-color: #eee;
+
+    --text: #ccc;
+    --text-hover: #fff;
+    --text-muted: #999;
+
+    /*Specials*/
+    --arr-queue-color: #5d9cec;
+    --side-menu-active: #333333;
+    --scroller-hover: #606060;
+    --scroller: #707070;
+    --border-color: #606060;
+    --label-color: #707070;
+    --label-info: #5d9cec;
+    --header-color: #464b51;
+    --side-menu-color: #595959;
+}
+
+/* HEADER */
+
+[class*="PageHeader-header-"] {
+    background-color: var(--header-color);
+    color: #fff;
+}
+
+[class*="PageToolbar-toolbar-"] {
+    background-color: #707070;
+    color: var(--text);
+}
+
+/* SIDE MENU */
+
+[class*="PageSidebar-sidebar-"] {
+    background-color: var(--side-menu-color);
+    color: #fff;
+}
+
+[class*=PageSidebarItem-link-]:focus {
+    color: rgb(var(--accent-color)) !important;
+}
+
+[class*=PageSidebarItem-isActiveLink-] {
+    color: var(--link-color) !important;
+}
+
+[class*=PageSidebarItem-isActiveParentLink-] {
+    background-color: var(--side-menu-active);
+}
+
+/* SCROLLER */
+[class*=ImportSeriesSelectSeries-results-]::-webkit-scrollbar-thumb:hover,
+[class*=OverlayScroller-thumb-]:hover {
+    background-color: var(--scroller-hover) !important;
+}
+
+[class*="OverlayScroller-thumb-"],
+[class*=Scroller-scroller-]::-webkit-scrollbar-thumb {
+    background-color: var(--scroller) !important;
+}
+
+/* MODALS */
+
+[class*=ModalHeader-modalHeader-],
+[class*=FieldSet-legend-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+[class*=ModalFooter-modalFooter-] {
+    border-top: 1px solid var(--border-color);
+}
+
+/* LABLES */
+
+[class*="Label-default-"] {
+    border-color: var(--label-color);
+    background-color: var(--label-color);
+    color: white;
+}
+
+[class*="Label-info-"]:not([class*="PageSidebarItem-status-"] [class*="Label-info-"]) {
+    border-color: var(--label-info);
+    background-color: var(--label-info);
+    color: #fff;
+}
+
+/* SETTINGS */
+
+[class*=Settings-link-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+/* SEARCH DROP DOWN */
+
+[class*="MovieSearchInput-containerOpen-"] [class*="MovieSearchInput-movieContainer-"] {
+    border: 1px solid var(--drop-down-menu-bg);
+    background-color: var(--drop-down-menu-bg);
+    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
+    color: #e1e2e3;
+}
+
+/* SERIES PAGE */
+
+[class*="MovieIndexPoster-controls-"] {
+    background-color: var(--label-color) !important;
+    color: #fff !important;
+}
--- a/css/addons/readarr/readarr-alt-logo/readarr-alt-logo.css
+++ b/css/addons/readarr/readarr-alt-logo/readarr-alt-logo.css
@ -0,0 +1,53 @@
+@media (min-width: 752px) {
+    [class*="PageHeader-logo-"]  {
+        display: none !important;
+    }
+    [class*="PageHeader-logoContainer-"]:before {
+        background-image: url("/css/addons/readarr/readarr-alt-logo/readarr_alt.png");
+        display: inline-block;
+        width: 34px; 
+        height: 34px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+    }    
+} 
+
+@media (max-width: 767px) {
+    [class*="PageHeader-logo-"]   {
+        display: none !important;
+    }   
+    [class*="PageHeader-logoContainer-"]:before {
+        background-image: url("/css/addons/readarr/readarr-alt-logo/readarr_alt.png");
+        display: inline-block;
+        width: 34px; 
+        height: 34px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+    } 
+}
+
+[class*="LoadingPage-logoFull-"] {
+    display: none !important;
+}
+
+[class*="LoadingPage-page-"]:before {
+        background-image: url("/css/addons/readarr/readarr-alt-logo/readarr_alt.png");
+        display: inline-block;
+        width: 48px; 
+        height: 48px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+        margin-top: 50px;
+        margin-right: auto;
+        margin-left: auto;
+
+}
--- a/css/addons/readarr/readarr-alt-logo/readarr_alt.png
+++ b/css/addons/readarr/readarr-alt-logo/readarr_alt.png
--- a/css/addons/readarr/readarr-alt-logo/readme.md
+++ b/css/addons/readarr/readarr-alt-logo/readme.md
@ -0,0 +1,3 @@
+Headphone Icon svg made by monkik from www.flaticon.com
+
+https://www.flaticon.com/free-icon/music_2503487?term=headset&related_id=2503487
--- a/css/addons/readarr/readarr-darker/readarr-darker.css
+++ b/css/addons/readarr/readarr-darker/readarr-darker.css
@ -0,0 +1,126 @@
+:root {
+    --main-bg-color: #4a4a4b;
+
+    --modal-bg-color: #353535;
+    --modal-header-color: #353535;
+    --modal-footer-color: #353535;
+
+    --drop-down-menu-bg: #66001a;
+
+    --button-color: #5899eb;
+    --button-color-hover: #4b91ea;
+    --button-text: #eee;
+    --button-text-hover: #fff;
+
+    --accent-color: 202, 48, 45;
+    --accent-color-hover: rgb(var(--accent-color), .8);
+    --link-color: rgb(93, 156, 236);
+    --link-color-hover: rgb(93, 156, 236, .8);
+    --label-text-color: #eee;
+
+    --text: #ccc;
+    --text-hover: #fff;
+    --text-muted: #999;
+
+    /*Specials*/
+    --arr-queue-color: #1d563d;
+    --side-menu-active: #252525;
+    --scroller-hover: #606060;
+    --scroller: #707070;
+    --border-color: #606060;
+    --label-color: #810020;
+    --label-info: #5d9cec;
+    --header-color: #a41726;
+    --side-menu-color: #353535;
+    --side-menu-link-color: #ca302d;
+}
+
+/* HEADER */
+
+[class*="PageHeader-header-"] {
+    background-color: var(--header-color);
+    color: #fff;
+}
+
+[class*="PageToolbar-toolbar-"] {
+    background-color: #810020;
+    color: #e1e2e3;
+}
+
+/* SIDE MENU */
+
+[class*="PageSidebar-sidebar-"] {
+    background-color: #353535;
+    color: #fff;
+}
+
+[class*=PageSidebarItem-link-]:focus {
+    color: rgb(var(--accent-color)) !important;
+}
+
+[class*=PageSidebarItem-isActiveLink-] {
+    color: var(--side-menu-link-color) !important;
+}
+
+[class*=PageSidebarItem-isActiveParentLink-] {
+    background-color: var(--side-menu-active);
+}
+
+/* SCROLLER */
+[class*=ImportSeriesSelectSeries-results-]::-webkit-scrollbar-thumb:hover,
+[class*=OverlayScroller-thumb-]:hover {
+    background-color: var(--scroller-hover) !important;
+}
+
+[class*="OverlayScroller-thumb-"],
+[class*=Scroller-scroller-]::-webkit-scrollbar-thumb {
+    background-color: var(--scroller) !important;
+}
+
+/* MODALS */
+[class*=ModalHeader-modalHeader-],
+[class*=FieldSet-legend-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+[class*=ModalFooter-modalFooter-] {
+    border-top: 1px solid var(--border-color);
+}
+
+/* LABLES */
+[class*="Label-default-"] {
+    border-color: var(--label-color);
+    background-color: var(--label-color);
+    color: white;
+}
+
+[class*="Label-info-"]:not([class*="PageSidebarItem-status-"] [class*="Label-info-"]) {
+    border-color: var(--label-info);
+    background-color: var(--label-info);
+    color: #fff;
+}
+.Label-default-xecWd {
+    border-color: #810020;
+    background-color: #810020;
+}
+
+/* SETTINGS */
+
+[class*=Settings-link-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+/* SEARCH DROP DOWN */
+[class*="MovieSearchInput-containerOpen-"] [class*="MovieSearchInput-movieContainer-"] {
+    border: 1px solid var(--drop-down-menu-bg);
+    background-color: var(--drop-down-menu-bg);
+    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
+    color: #e1e2e3;
+}
+
+/* AUTHOR PAGE */
+
+[class*="AuthorDetailsHeader-headerContent-"], [class*="BookDetailsHeader-headerContent-"] {
+    color: #fff;
+    background: #4a4a4b;
+}
--- a/css/addons/sonarr/sonarr-4k-logo/sonarr-4k-logo.css
+++ b/css/addons/sonarr/sonarr-4k-logo/sonarr-4k-logo.css
@ -0,0 +1,53 @@
+@media (min-width: 752px) {
+    [class*="PageHeader-logo-"]  {
+        display: none !important;
+    }
+    [class*="PageHeader-logoContainer-"]:before {
+        background-image: url("/css/addons/sonarr/sonarr-4k-logo/sonarr-4k.png");
+        display: inline-block;
+        width: 32px; 
+        height: 32px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+    }    
+} 
+
+@media (max-width: 767px) {
+    [class*="PageHeader-logo-"]   {
+        display: none !important;
+    }   
+    [class*="PageHeader-logoContainer-"]:before {
+        background-image: url("/css/addons/sonarr/sonarr-4k-logo/sonarr-4k.png");
+        display: inline-block;
+        width: 32px; 
+        height: 32px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+    } 
+}
+
+[class*="LoadingPage-logoFull-"] {
+    display: none !important;
+}
+
+[class*="LoadingPage-page-"]:before {
+        background-image: url("/css/addons/sonarr/sonarr-4k-logo/sonarr-4k.png");
+        display: inline-block;
+        width: 48px; 
+        height: 48px;
+        content:"";
+        background-size:  cover;
+        -webkit-background-size:  cover;
+        -moz-background-size:  cover;
+        -o-background-size: cover;
+        margin-top: 50px;
+        margin-right: auto;
+        margin-left: auto;
+
+}
--- a/css/addons/sonarr/sonarr-4k-logo/sonarr-4k.png
+++ b/css/addons/sonarr/sonarr-4k-logo/sonarr-4k.png
--- a/css/addons/sonarr/sonarr-darker/sonarr-darker.css
+++ b/css/addons/sonarr/sonarr-darker/sonarr-darker.css
@ -0,0 +1,125 @@
+:root {
+    --main-bg-color: #4f566f;
+
+    --modal-bg-color: #3a3f51;
+    --modal-header-color: #3a3f51;
+    --modal-footer-color: #3a3f51;
+
+    --drop-down-menu-bg: #3a3f51;
+
+    --button-color: #5899eb;
+    --button-color-hover: #3483e7;
+    --button-text: #eee;
+    --button-text-hover: #fff;
+
+    --accent-color: 53, 197, 244;
+    --accent-color-hover: rgb(33, 147, 181);
+    --link-color: #35c5f4;
+    --link-color-hover: rgb(53, 197, 244, .8);
+    --label-text-color: #4f566f;
+
+    --text: #ccc;
+    --text-hover: #fff;
+    --text-muted: #999;
+
+    /*Specials*/
+    --arr-queue-color: #35c5f4;
+    --side-menu-active: #252833;
+    --scroller-hover: #656d8c;
+    --scroller: #9ea4b9;
+    --border-color: #4f566f;
+    --label-color: #4f566f;
+    --label-info: #5d9cec;
+    --header-color: #2193b5;
+    --side-menu-color: #3a3f51;
+}
+
+/* HEADER */
+
+[class*="PageHeader-header-"] {
+    background-color: var(--header-color);
+    color: #fff;
+}
+
+/* SIDE MENU */
+
+[class*="PageSidebar-sidebar-"] {
+    background-color: var(--side-menu-color);
+    color: #fff;
+}
+
+[class*=PageSidebarItem-link-]:focus {
+    color: rgb(var(--accent-color)) !important;
+}
+
+[class*=PageSidebarItem-isActiveLink-] {
+    color: var(--link-color) !important;
+}
+
+[class*=PageSidebarItem-isActiveParentLink-] {
+    background-color: var(--side-menu-active);
+}
+
+/* SCROLLER */
+[class*=ImportSeriesSelectSeries-results-]::-webkit-scrollbar-thumb:hover,
+[class*=OverlayScroller-thumb-]:hover {
+    background-color: var(--scroller-hover) !important;
+}
+
+[class*="OverlayScroller-thumb-"],
+[class*=Scroller-scroller-]::-webkit-scrollbar-thumb {
+    background-color: var(--scroller) !important;
+}
+
+/* MODALS */
+[class*=ModalHeader-modalHeader-],
+[class*=FieldSet-legend-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+[class*=ModalFooter-modalFooter-] {
+    border-top: 1px solid var(--border-color);
+}
+
+/* LABLES */
+[class*=Label-default-] {
+    border-color: var(--label-color);
+    background-color: var(--label-color);
+    color: white;
+}
+
+[class*="Label-info-"]:not([class*="PageSidebarItem-status-"] [class*="Label-info-"]) {
+    border-color: var(--label-info);
+    background-color: var(--label-info);
+    color: white;
+}
+
+/* SETTINGS */
+
+[class*=Settings-link-] {
+    border-bottom: 1px solid var(--border-color);
+}
+
+/* SEARCH DROP DOWN */
+[class*="SeriesSearchInput-containerOpen-"] [class*="SeriesSearchInput-seriesContainer-"] {
+    border: 1px solid var(--drop-down-menu-bg);
+    background-color: var(--drop-down-menu-bg);
+    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
+    color: #e1e2e3;
+}
+
+/* SERIES PAGE */
+[class*="SeriesIndexPoster-controls-"] {
+    background-color: var(--label-color) !important;
+    color: #fff !important;
+}
+
+[class*="SeriesIndexPoster-posterContainer-"]>span>button {
+    background-color: transparent;
+    color: white !important;
+}
+
+[class*="SeriesIndexPoster-action-"]:hover,
+[class*=SeriesIndexPoster-action-] .fa-search:hover {
+    color: #ccc !important;
+}
--- a/css/addons/unraid/login-page/alien/alien_base.css
+++ b/css/addons/unraid/login-page/alien/alien_base.css
@ -0,0 +1,245 @@
+@import "https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css";
+@import "https://fonts.googleapis.com/css?family=Share+Tech+Mono&display=swap";
+@import "https://fonts.googleapis.com/css?family=VT323";
+
+
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-10: rgba(255, 255, 255, 0.1);
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+        --div-background-color-25: rgba(255, 255, 255, 0.25);
+        --div-background-color-35: rgba(255, 255, 255, 0.35);
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+
+    https://codepen.io/lbebber/pen/XJRdrV/ CRT KEY FRAMES
+    https://brennan.io/2017/06/14/alien-computer-card/
+    https://www.cssmatic.com/noise-texture
+
+    https://codepen.io/somethingformed/pen/raWJXV
+    radial-gradient(ellipse at center,#0f7 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed,
+    */
+
+* {
+    outline: none;
+}
+
+@media only screen and (max-width: 500px) {
+    #login {
+        -webkit-backdrop-filter: blur(0px);
+        backdrop-filter: blur(0px);
+        position: absolute;
+        top: 0;
+        left: 0;
+        bottom: 0;
+        right: 0;
+        height: 100%;
+        width: 100%;
+        border-radius: none !important;
+    }
+    .background-wrap,#video-bg-elem  {display: none;}
+    
+    #login {
+        -webkit-box-shadow: inset 0px 0px 0px 2px #F000 !important;
+        box-shadow: inset 0px 0px 0px 2px #F000 !important;
+    }
+}
+
+html {
+    background: var(--main-bg) !important;
+}
+
+body {
+    background: var(--main-bg) !important;
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+}
+@media only screen and (max-width: 768px) {
+    #login {
+        min-width: 300px;
+    }
+}
+/*FOR VIDEO BACKGROUND*/
+.background-wrap {
+    position: fixed;
+    z-index: -1000;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    top: 0;
+    left: 0;
+}
+#video-bg-elem {
+    position: absolute;
+    top: 0;
+    left: 0;
+    min-height: 100%;
+    min-width: 100%;
+}
+/*TEXT COLOR*/
+#login h1,
+#login h2,
+#login .error {
+    color: var(--text-color) !important;
+    text-shadow: var(--text-shadow) var(--text-color);
+    font-size: 20px;
+}
+#login a {
+    color: var(--link-color);
+    text-shadow: var(--text-shadow) var(--text-color);
+}
+#login a:hover {
+    color: var(--link-color-hover);
+    text-shadow: var(--text-shadow) var(--text-color);
+}
+#login input {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-color);
+}
+#login ::placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-color);
+}
+#login ::-webkit-input-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-color);
+}
+#login ::-moz-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-color);
+}
+#login :-ms-input-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-color);
+}
+#login :-moz-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-color);
+}
+#login input:focus::-webkit-input-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+#login input:focus:-moz-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+#login input:focus::-moz-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+#login input:focus:-ms-input-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+
+/*TEXT FONT*/
+#login h1,
+#login h2,
+#login a,
+#login .button,
+#login .error {
+    font-family: var(--text-font);
+    -webkit-font-smoothing: none;
+    line-height: 1.2;
+}
+
+/* CASE COLOR */
+#login [class^='case-'],
+#login [class*=' case-'] {
+    font-family: cases!important;
+    speak: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    color: var(--case-color);
+    text-shadow: var(--text-shadow) var(--text-color);
+}
+/*INPUT FORMS*/
+#login [type=text],
+#login [type=password] {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    border: 2px solid transparent;
+    text-transform: uppercase;
+    border-radius: 5px;
+}
+#login [type=text]:active,
+#login [type=text]:focus,
+#login [type=password]:active,
+#login [type=password]:focus {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    border: 2px solid transparent;
+    text-transform: uppercase;
+
+}
+
+
+/*BUTTON*/
+#login .button {
+    color: var(--button-text-color);
+    text-shadow: var(--text-shadow) var(--text-color);
+    background: linear-gradient(90deg, var(--button-color2) 0, var(--button-color)) 0 0 no-repeat, linear-gradient(90deg, var(--button-color2) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color2) 0, var(--button-color2)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 100% 100% no-repeat;
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color))) 0 0 no-repeat, -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color2)), to(var(--button-color2))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 100% 100% no-repeat;
+    background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100%;
+}
+#login .button:hover {
+    color: var(--button-text-color-hover);
+    text-shadow: var(--text-shadow) var(--button-color-hover);
+    box-shadow: var(--box-shadow) var(--button-color-hover);
+    background-color: var(--button-color-hover);
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color2-hover)), to(var(--button-color-hover)));
+    background: linear-gradient(90deg, var(--button-color2-hover) 0, var(--button-color-hover));
+}
+
+
+#login {
+    background: var(--div-background-color-15) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    padding-top: 1rem;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%) !;
+    -ms-transform: translate(-50%, -50%);
+    -webkit-transform: translate(-50%, -50%);
+    margin: 0 !important;
+    text-transform: uppercase;
+    min-width: 300px;
+}
+
+#login .angle:after {
+    display: none;
+}
+#login .wordmark {
+    display: none;
+}
+
+#login .logo {
+    background: var(--logo);
+    background-size: contain;
+    padding: 2rem;
+    border-radius: 0;
+    margin: 0rem 1rem 0rem 1rem;
+}
+#login .error {
+    animation-name: shake;
+    animation-duration: .8s;
+}
+/*LOGIN BOX SHADOW*/
+.shadow {
+    -webkit-box-shadow: inset 0px 0px 0px 2px var(--text-color) !important;
+    box-shadow: inset 0px 0px 0px 2px var(--text-color) !important;
+}
--- a/css/addons/unraid/login-page/alien/custom.css
+++ b/css/addons/unraid/login-page/alien/custom.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/hallway2.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/nostromogreen2.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/hallway.css
+++ b/css/addons/unraid/login-page/alien/hallway.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/hallway.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/wings_green.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/hallway2.css
+++ b/css/addons/unraid/login-page/alien/hallway2.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/hallway2.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/wings_green.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/hallway3.css
+++ b/css/addons/unraid/login-page/alien/hallway3.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/hallway3.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/wings_green.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/hallway4.css
+++ b/css/addons/unraid/login-page/alien/hallway4.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/hallway4.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/wings_green.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/isolation.css
+++ b/css/addons/unraid/login-page/alien/isolation.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/isolation.png) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/wings_green.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/isolation_video.css
+++ b/css/addons/unraid/login-page/alien/isolation_video.css
@ -0,0 +1,21 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: transparent;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/wings_green.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/js/isolation.js
+++ b/css/addons/unraid/login-page/alien/js/isolation.js
@ -0,0 +1,6 @@
+// Adds a video background
+
+let video = `
+<div class="background-wrap"><video id="video-bg-elem" preload="auto" autoplay="true" loop="loop" muted="muted"> <source src="https:\/\/gilbn.github.io\/theme.park\/css\/addons\/unraid\/login-page\/alien\/video\/isolation.mp4" type="video\/mp4">Video not supported</video></div>
+`
+document.body.innerHTML += video
--- a/css/addons/unraid/login-page/alien/logo/uscss_3nostromo.png
+++ b/css/addons/unraid/login-page/alien/logo/uscss_3nostromo.png
--- a/css/addons/unraid/login-page/alien/logo/uscss_nostromo.jpg
+++ b/css/addons/unraid/login-page/alien/logo/uscss_nostromo.jpg
--- a/css/addons/unraid/login-page/alien/logo/uscss_nostromo2.jpg
+++ b/css/addons/unraid/login-page/alien/logo/uscss_nostromo2.jpg
--- a/css/addons/unraid/login-page/alien/logo/weyland-yutani-logo-by-synthetic-dreamer1.png
+++ b/css/addons/unraid/login-page/alien/logo/weyland-yutani-logo-by-synthetic-dreamer1.png
--- a/css/addons/unraid/login-page/alien/logo/wings.png
+++ b/css/addons/unraid/login-page/alien/logo/wings.png
--- a/css/addons/unraid/login-page/alien/logo/wings_blue.png
+++ b/css/addons/unraid/login-page/alien/logo/wings_blue.png
--- a/css/addons/unraid/login-page/alien/logo/wings_green.png
+++ b/css/addons/unraid/login-page/alien/logo/wings_green.png
--- a/css/addons/unraid/login-page/alien/logo/wings_green2.png
+++ b/css/addons/unraid/login-page/alien/logo/wings_green2.png
--- a/css/addons/unraid/login-page/alien/logo/wings_red.png
+++ b/css/addons/unraid/login-page/alien/logo/wings_red.png
--- a/css/addons/unraid/login-page/alien/logo/wings_shadow.png
+++ b/css/addons/unraid/login-page/alien/logo/wings_shadow.png
--- a/css/addons/unraid/login-page/alien/logo/wings_yellow.png
+++ b/css/addons/unraid/login-page/alien/logo/wings_yellow.png
--- a/css/addons/unraid/login-page/alien/nightmare.css
+++ b/css/addons/unraid/login-page/alien/nightmare.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/nightmare.png) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/wings_red.png) center no-repeat;
+    --text-color: #e22828;
+    --input-color: #e22828;
+    --link-color: #e22828;
+    --link-color-hover: #f07777;
+    --case-color: #e22828;
+    --button-text-color: #e22828;
+    --button-text-color-hover: #000;
+    --button-color: #e22828;
+    --button-color2: #e22828;
+    --button-color-hover: #db3232;
+    --button-color2-hover: #db3232;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 0, 0, 0.55);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/scanner.css
+++ b/css/addons/unraid/login-page/alien/scanner.css
@ -0,0 +1,22 @@
+@import url("/css/addons/unraid/login-page/alien/alien_base.css");
+:root {
+    --main-bg: radial-gradient(ellipse at center,rgba(0, 255, 119, 0.1) 0,rgba(0,255,119,0) 100%) center center/cover no-repeat fixed, 
+    url(/css/addons/unraid/login-page/alien/wallpaper/scanner.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/alien/logo/nostromogreen2.png) center no-repeat;
+    --text-color: #37f592;
+    --input-color: #37f592;
+    --link-color: #37f592;
+    --link-color-hover: #68ffff;
+    --case-color: #37f592;
+    --button-text-color: #37f592;
+    --button-text-color-hover: #000;
+    --button-color: #37f592;
+    --button-color2: #0C833D;
+    --button-color-hover: #68ffff;
+    --button-color2-hover: #68ffff;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;   /*'VT323', 'Share Tech Mono'*/
+    --div-background-color-15: rgba(0, 255, 111, 0.03);
+    --text-shadow: 0 0 8px;
+    --box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/alien/video/isolation.mp4
+++ b/css/addons/unraid/login-page/alien/video/isolation.mp4
--- a/css/addons/unraid/login-page/alien/wallpaper/hallway.jpg
+++ b/css/addons/unraid/login-page/alien/wallpaper/hallway.jpg
--- a/css/addons/unraid/login-page/alien/wallpaper/hallway2.jpg
+++ b/css/addons/unraid/login-page/alien/wallpaper/hallway2.jpg
--- a/css/addons/unraid/login-page/alien/wallpaper/hallway3.jpg
+++ b/css/addons/unraid/login-page/alien/wallpaper/hallway3.jpg
--- a/css/addons/unraid/login-page/alien/wallpaper/hallway4.jpg
+++ b/css/addons/unraid/login-page/alien/wallpaper/hallway4.jpg
--- a/css/addons/unraid/login-page/alien/wallpaper/isolation.png
+++ b/css/addons/unraid/login-page/alien/wallpaper/isolation.png
--- a/css/addons/unraid/login-page/alien/wallpaper/nightmare.png
+++ b/css/addons/unraid/login-page/alien/wallpaper/nightmare.png
--- a/css/addons/unraid/login-page/alien/wallpaper/noise.png
+++ b/css/addons/unraid/login-page/alien/wallpaper/noise.png
--- a/css/addons/unraid/login-page/alien/wallpaper/ripley.jpg
+++ b/css/addons/unraid/login-page/alien/wallpaper/ripley.jpg
--- a/css/addons/unraid/login-page/alien/wallpaper/scanner.jpg
+++ b/css/addons/unraid/login-page/alien/wallpaper/scanner.jpg
--- a/css/addons/unraid/login-page/alien/wallpaper/xeno.jpg
+++ b/css/addons/unraid/login-page/alien/wallpaper/xeno.jpg
--- a/css/addons/unraid/login-page/custom_login.sh
+++ b/css/addons/unraid/login-page/custom_login.sh
@ -0,0 +1,67 @@
+#!/bin/bash
+TYPE="retro-terminal"
+THEME="green.css"
+DOMAIN="theme-park.dev" #if you update the domain after the script has been run, You must disable and re enable JS or the whole theme.  
+ADD_JS="true"
+JS="custom_text_header.js"
+DISABLE_THEME="false"
+
+echo -e "Variables set:\\n\
+THEME         = ${THEME}\\n\
+DOMAIN        = ${DOMAIN}\\n\
+ADD_JS        = ${ADD_JS}\\n\
+JS            = ${JS}\\n\
+DISABLE_THEME = ${DISABLE_THEME}\\n"
+
+# Restore login.php
+if [ ${DISABLE_THEME} = "true" ]; then
+  echo "Restoring backup of login.php" 
+  cp -p /usr/local/emhttp/login.php.backup /usr/local/emhttp/login.php
+  exit 0
+fi
+
+# Backup login page if needed.
+if [ ! -f /usr/local/emhttp/login.php.backup ]; then
+  echo "Creating backup of login.php" 
+  cp -p /usr/local/emhttp/login.php /usr/local/emhttp/login.php.backup
+fi
+
+# Use correct domain style
+case ${DOMAIN} in
+  *"github.io"*)
+  echo "Switching to github.io URL style"
+    DOMAIN="${DOMAIN}\/theme.park"
+    ;;
+esac
+
+# Adding stylesheets
+if ! grep -q ${DOMAIN} /usr/local/emhttp/login.php; then
+  echo "Adding stylesheet"
+  sed -i -e "\@<style>@i\    <link rel='stylesheet' href='https://${DOMAIN}/css/addons/unraid/login-page/${TYPE}/${THEME}'>" /usr/local/emhttp/login.php
+  echo 'Stylesheet set to' ${THEME}
+fi
+
+# Adding/Removing javascript
+if [ ${ADD_JS} = "true" ]; then
+  if ! grep -q ${JS} /usr/local/emhttp/login.php; then
+    if grep -q "<script type='text/javascript' src='https://${DOMAIN}/css/addons/unraid/login-page/" /usr/local/emhttp/login.php; then
+      echo "Replacing Javascript"
+      sed -i "/<script type='text\/javascript' src='https:\/\/${DOMAIN}\/css\/addons\/unraid\/login-page/c <script type='text/javascript' src='https://${DOMAIN}/css/addons/unraid/login-page/${TYPE}/js/${JS}'></script>" /usr/local/emhttp/login.php
+    else
+      echo "Adding javascript"
+      sed -i -e "\@</body>@i\    <script type='text/javascript' src='https://${DOMAIN}/css/addons/unraid/login-page/${TYPE}/js/${JS}'></script>" /usr/local/emhttp/login.php
+    fi
+  fi
+else
+  if grep -q ${JS} /usr/local/emhttp/login.php; then
+    echo "Removing javascript.."
+    sed -i "/<script type='text\/javascript' src='https:\/\/${DOMAIN}\/css\/addons\/unraid\/login-page/d" /usr/local/emhttp/login.php
+  fi
+fi
+
+# Changing stylesheet
+if ! grep -q ${TYPE}"/"${THEME} /usr/local/emhttp/login.php; then
+  echo "Changing existing custom stylesheet.." 
+  sed -i "/<link rel='stylesheet' href='https:\/\/${DOMAIN}\/css\/addons\/unraid\/login-page/c <link rel='stylesheet' href='https://${DOMAIN}/css/addons/unraid/login-page/${TYPE}/${THEME}'>" /usr/local/emhttp/login.php
+  echo 'Stylesheet set to' ${THEME}
+fi
--- a/css/addons/unraid/login-page/fallout/custom.css
+++ b/css/addons/unraid/login-page/fallout/custom.css
@ -0,0 +1,218 @@
+@import "https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css";
+@import "https://fonts.googleapis.com/css?family=Share+Tech+Mono&display=swap";
+@import "https://fonts.googleapis.com/css?family=VT323";
+:root {
+    --main-bg-color: url(/css/addons/unraid/login-page/fallout/wallpaper/rocky-wall.png), url(/css/addons/unraid/login-page/fallout/wallpaper/6Ua3u8.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/fallout/logo/vault.png) center no-repeat;
+    --text-color: #14F074;
+    --input-color: #14F074;
+    --link-color: #14F074;
+    --link-color-hover: #0C833D;
+    --case-color: #14F074;
+    --button-text-color: #14F074;
+    --button-text-color-hover: #FFFFFF;
+    --button-color: #14F074;
+    --button-color2: #0C833D;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-10: rgba(255, 255, 255, 0.1);
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+        --div-background-color-25: rgba(255, 255, 255, 0.25);
+        --div-background-color-35: rgba(255, 255, 255, 0.35);
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+    */
+}
+
+@media (max-width: 500px) {
+    #login {
+        -webkit-backdrop-filter: blur(0px);
+        backdrop-filter: blur(0px);
+        position: absolute;
+        top: 0;
+        left: 0;
+        bottom: 0;
+        right: 0;
+        height: 100%;
+        width: 100%;
+        border-radius: none !important;
+    }
+    .background-wrap,#video-bg-elem  {display: none;}
+}
+
+html {
+    background: var(--main-bg-color) !important;
+}
+body {
+    background: var(--main-bg-color) !important;
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+}
+@media only screen and (max-width: 768px) {
+    #login {
+        min-width: 300px;
+    }
+}
+/*FOR VIDEO BACKGROUND*/
+.background-wrap {
+    position: fixed;
+    z-index: -1000;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    top: 0;
+    left: 0;
+}
+#video-bg-elem {
+    position: absolute;
+    top: 0;
+    left: 0;
+    min-height: 100%;
+    min-width: 100%;
+}
+/*TEXT COLOR*/
+#login h1,
+#login h2,
+#login .error {
+    color: var(--text-color) !important;
+}
+#login a {
+    color: var(--link-color);
+}
+#login a:hover {
+    color: var(--link-color-hover);
+}
+#login input {
+    color: var(--input-color);
+}
+#login ::placeholder {
+    color: var(--input-color);
+}
+#login ::-webkit-input-placeholder {
+    color: var(--input-color);
+}
+#login ::-moz-placeholder {
+    color: var(--input-color);
+}
+#login :-ms-input-placeholder {
+    color: var(--input-color);
+}
+#login :-moz-placeholder {
+    color: var(--input-color);
+}
+#login input:focus::-webkit-input-placeholder {
+    color: transparent !important;
+}
+#login input:focus:-moz-placeholder {
+    color: transparent !important;
+}
+#login input:focus::-moz-placeholder {
+    color: transparent !important;
+}
+#login input:focus:-ms-input-placeholder {
+    color: transparent !important;
+}
+
+/*TEXT FONT*/
+#login h1,
+#login h2,
+#login a,
+#login .button,
+#login .error {
+    font-family: var(--text-font);
+}
+
+/* CASE COLOR */
+#login [class^='case-'],
+#login [class*=' case-'] {
+    font-family: cases!important;
+    speak: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    color: var(--case-color);
+}
+/*INPUT FORMS*/
+#login [type=text],
+#login [type=password] {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    border: 2px solid transparent;
+    text-transform: uppercase;
+    border-radius: 5px;
+}
+#login [type=text]:active,
+#login [type=text]:focus,
+#login [type=password]:active,
+#login [type=password]:focus {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    border: 2px solid transparent;
+    text-transform: uppercase;
+
+}
+
+
+/*BUTTON*/
+#login .button {
+    color: var(--button-text-color);
+    background: linear-gradient(90deg, var(--button-color2) 0, var(--button-color)) 0 0 no-repeat, linear-gradient(90deg, var(--button-color2) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color2) 0, var(--button-color2)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 100% 100% no-repeat;
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color))) 0 0 no-repeat, -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color2)), to(var(--button-color2))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 100% 100% no-repeat;
+    background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100%;
+}
+#login .button:hover {
+    color: var(--button-text-color-hover);
+    background-color: var(--button-color);
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color)));
+    background: linear-gradient(90deg, var(--button-color2) 0, var(--button-color));
+}
+
+
+#login {
+    background: var(--div-background-color-15) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    padding-top: 1rem;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%) !;
+    -ms-transform: translate(-50%, -50%);
+    -webkit-transform: translate(-50%, -50%);
+    margin: 0 !important;
+    text-transform: uppercase;
+    min-width: 300px;
+}
+
+#login .angle:after {
+    display: none;
+}
+#login .wordmark {
+    display: none;
+}
+
+#login .logo {
+    background: var(--logo);
+    background-size: contain;
+    padding: 2rem;
+    border-radius: 0;
+    margin: 0rem 1rem 0rem 1rem;
+}
+#login .error {
+    animation-name: shake;
+    animation-duration: .8s;
+}
--- a/css/addons/unraid/login-page/fallout/dirty_terminal.css
+++ b/css/addons/unraid/login-page/fallout/dirty_terminal.css
@ -0,0 +1,28 @@
+@import url("/css/addons/unraid/login-page/fallout/fallout_base.css");
+:root {
+    --main-bg-color: url(/css/addons/unraid/login-page/fallout/wallpaper/rocky-wall.png),
+    url(/css/addons/unraid/login-page/fallout/wallpaper/terminal.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/fallout/logo/vault-tec_green.png) center no-repeat;
+    --text-color: #14F074;
+    --input-color: #14F074;
+    --link-color: #14F074;
+    --link-color-hover: #0C833D;
+    --case-color: #14F074;
+    --button-text-color: #14F074;
+    --button-text-color-hover: #FFFFFF;
+    --button-color: #14F074;
+    --button-color2: #0C833D;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+    */
+}
--- a/css/addons/unraid/login-page/fallout/dirty_terminal2.css
+++ b/css/addons/unraid/login-page/fallout/dirty_terminal2.css
@ -0,0 +1,28 @@
+@import url("/css/addons/unraid/login-page/fallout/fallout_base.css");
+:root {
+    --main-bg-color: url(/css/addons/unraid/login-page/fallout/wallpaper/rocky-wall.png),
+    url(/css/addons/unraid/login-page/fallout/wallpaper/terminal2.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/fallout/logo/vault-tec_green.png) center no-repeat;
+    --text-color: #14F074;
+    --input-color: #14F074;
+    --link-color: #14F074;
+    --link-color-hover: #0C833D;
+    --case-color: #14F074;
+    --button-text-color: #14F074;
+    --button-text-color-hover: #FFFFFF;
+    --button-color: #14F074;
+    --button-color2: #0C833D;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+    */
+}
--- a/css/addons/unraid/login-page/fallout/fallout_base.css
+++ b/css/addons/unraid/login-page/fallout/fallout_base.css
@ -0,0 +1,195 @@
+@import "https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css";
+@import "https://fonts.googleapis.com/css?family=Share+Tech+Mono&display=swap";
+@import "https://fonts.googleapis.com/css?family=VT323";
+
+
+* {
+    outline: none;
+}
+
+@media (max-width: 500px) {
+    #login {
+        -webkit-backdrop-filter: blur(0px);
+        backdrop-filter: blur(0px);
+        position: absolute;
+        top: 0;
+        left: 0;
+        bottom: 0;
+        right: 0;
+        height: 100%;
+        width: 100%;
+        border-radius: none !important;
+    }
+    .background-wrap,#video-bg-elem  {display: none;}
+}
+
+html {
+    background: var(--main-bg-color) !important;
+}
+body {
+    background: var(--main-bg-color) !important;
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+}
+@media only screen and (max-width: 768px) {
+    #login {
+        min-width: 300px;
+    }
+}
+/*FOR VIDEO BACKGROUND*/
+.background-wrap {
+    position: fixed;
+    z-index: -1000;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    top: 0;
+    left: 0;
+}
+#video-bg-elem {
+    display: block;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    z-index: 1;
+}
+/*TEXT COLOR*/
+#login h1,
+#login h2,
+#login .error {
+    color: var(--text-color) !important;
+}
+#login a {
+    color: var(--link-color);
+}
+#login a:hover {
+    color: var(--link-color-hover);
+}
+#login input {
+    color: var(--input-color);
+}
+#login ::placeholder {
+    color: var(--input-color);
+}
+#login ::-webkit-input-placeholder {
+    color: var(--input-color);
+}
+#login ::-moz-placeholder {
+    color: var(--input-color);
+}
+#login :-ms-input-placeholder {
+    color: var(--input-color);
+}
+#login :-moz-placeholder {
+    color: var(--input-color);
+}
+#login input:focus::-webkit-input-placeholder {
+    color: transparent !important;
+}
+#login input:focus:-moz-placeholder {
+    color: transparent !important;
+}
+#login input:focus::-moz-placeholder {
+    color: transparent !important;
+}
+#login input:focus:-ms-input-placeholder {
+    color: transparent !important;
+}
+
+/*TEXT FONT*/
+#login h1,
+#login h2,
+#login a,
+#login .button,
+#login .error {
+    font-family: var(--text-font);
+}
+
+/* CASE COLOR */
+#login [class^='case-'],
+#login [class*=' case-'] {
+    font-family: cases!important;
+    speak: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    color: var(--case-color);
+}
+/*INPUT FORMS*/
+#login [type=text],
+#login [type=password] {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    border: 2px solid transparent;
+    text-transform: uppercase;
+    border-radius: 5px;
+}
+#login [type=text]:active,
+#login [type=text]:focus,
+#login [type=password]:active,
+#login [type=password]:focus {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    border: 2px solid transparent;
+    text-transform: uppercase;
+
+}
+
+
+/*BUTTON*/
+#login .button {
+    color: var(--button-text-color);
+    background: linear-gradient(90deg, var(--button-color2) 0, var(--button-color)) 0 0 no-repeat, linear-gradient(90deg, var(--button-color2) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color2) 0, var(--button-color2)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 100% 100% no-repeat;
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color))) 0 0 no-repeat, -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color2)), to(var(--button-color2))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 100% 100% no-repeat;
+    background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100%;
+}
+#login .button:hover {
+    color: var(--button-text-color-hover);
+    background-color: var(--button-color);
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color2)), to(var(--button-color)));
+    background: linear-gradient(90deg, var(--button-color2) 0, var(--button-color));
+}
+
+
+#login {
+    background: var(--div-background-color-15) !important;
+    -webkit-backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px);
+    padding-top: 1rem;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%) !;
+    -ms-transform: translate(-50%, -50%);
+    -webkit-transform: translate(-50%, -50%);
+    margin: 0 !important;
+    text-transform: uppercase;
+    min-width: 300px;
+}
+
+#login .angle:after {
+    display: none;
+}
+#login .wordmark {
+    display: none;
+}
+
+#login .logo {
+    background: var(--logo);
+    background-size: contain;
+    padding: 2rem;
+    border-radius: 0;
+    margin: 0rem 1rem 0rem 1rem;
+}
+#login .error {
+    animation-name: shake;
+    animation-duration: .8s;
+}
--- a/css/addons/unraid/login-page/fallout/fallout_video.css
+++ b/css/addons/unraid/login-page/fallout/fallout_video.css
@ -0,0 +1,35 @@
+@import url("/css/addons/unraid/login-page/fallout/fallout_base.css");
+:root {
+    --main-bg-color: transparent;
+    --logo: url(/css/addons/unraid/login-page/fallout/logo/vault-tec_green.png) center no-repeat;
+    --text-color: #14F074;
+    --input-color: #14F074;
+    --link-color: #14F074;
+    --link-color-hover: #0C833D;
+    --case-color: #14F074;
+    --button-text-color: #14F074;
+    --button-text-color-hover: #FFFFFF;
+    --button-color: #14F074;
+    --button-color2: #0C833D;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;
+    --div-background-color-15: #0ea85118;
+
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+    */
+}
+@media (max-width: 500px) {
+    body {
+        background: url(/css/addons/unraid/login-page/fallout/wallpaper/terminal.jpg) center center/cover no-repeat fixed !important;
+    }
+    :root {
+        --div-background-color-15: transparent; 
+    }
+}
--- a/css/addons/unraid/login-page/fallout/js/please_stand_by.js
+++ b/css/addons/unraid/login-page/fallout/js/please_stand_by.js
@ -0,0 +1,7 @@
+// Adds a video background
+// Source: https://www.youtube.com/watch?v=ehvduomE0AU
+
+let video = `
+<div class="background-wrap"><video id="video-bg-elem" preload="auto" autoplay="true" loop="loop" muted="muted"> <source src="https:\/\/gilbn.github.io\/theme.park\/css\/addons\/unraid\/login-page\/fallout\/video\/please_stand_by.mp4" type="video\/mp4">Video not supported</video></div>
+`
+document.body.innerHTML += video
--- a/css/addons/unraid/login-page/fallout/js/vault-tec-crt.js
+++ b/css/addons/unraid/login-page/fallout/js/vault-tec-crt.js
@ -0,0 +1,7 @@
+// Adds a video background
+// Source: https://steamcommunity.com/sharedfiles/filedetails/?id=920035918
+
+let video = `
+<div class="background-wrap"><video id="video-bg-elem" preload="auto" autoplay="true" loop="loop" muted="muted"> <source src="https:\/\/gilbn.github.io\/theme.park\/css\/addons\/unraid\/login-page\/fallout\/video\/VaultTecCRTLoop.mp4" type="video\/mp4">Video not supported</video></div>
+`
+document.body.innerHTML += video;
--- a/css/addons/unraid/login-page/fallout/js/vault-tec-crt_no-scanline.js
+++ b/css/addons/unraid/login-page/fallout/js/vault-tec-crt_no-scanline.js
@ -0,0 +1,7 @@
+// Adds a video background
+// Source: https://www.youtube.com/watch?v=ehvduomE0AU
+
+let video = `
+<div class="background-wrap"><video id="video-bg-elem" preload="auto" autoplay="true" loop="loop" muted="muted"> <source src="https:\/\/gilbn.github.io\/theme.park\/css\/addons\/unraid\/login-page\/fallout\/video\/VaultTecCRTLoopNoScanline.mp4" type="video\/mp4">Video not supported</video></div>
+`
+document.body.innerHTML += video
--- a/css/addons/unraid/login-page/fallout/logo/vault-tec_green.png
+++ b/css/addons/unraid/login-page/fallout/logo/vault-tec_green.png
--- a/css/addons/unraid/login-page/fallout/logo/vault-tec_green.psd
+++ b/css/addons/unraid/login-page/fallout/logo/vault-tec_green.psd
--- a/css/addons/unraid/login-page/fallout/logo/vault-tec_white.png
+++ b/css/addons/unraid/login-page/fallout/logo/vault-tec_white.png
--- a/css/addons/unraid/login-page/fallout/terminal.css
+++ b/css/addons/unraid/login-page/fallout/terminal.css
@ -0,0 +1,27 @@
+@import url("/css/addons/unraid/login-page/fallout/fallout_base.css");
+:root {
+    --main-bg-color: url(/css/addons/unraid/login-page/fallout/wallpaper/terminal.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/fallout/logo/vault-tec_green.png) center no-repeat;
+    --text-color: #14F074;
+    --input-color: #14F074;
+    --link-color: #14F074;
+    --link-color-hover: #0C833D;
+    --case-color: #14F074;
+    --button-text-color: #14F074;
+    --button-text-color-hover: #FFFFFF;
+    --button-color: #14F074;
+    --button-color2: #0C833D;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+    */
+}
--- a/css/addons/unraid/login-page/fallout/terminal2.css
+++ b/css/addons/unraid/login-page/fallout/terminal2.css
@ -0,0 +1,27 @@
+@import url("/css/addons/unraid/login-page/fallout/fallout_base.css");
+:root {
+    --main-bg-color: url(/css/addons/unraid/login-page/fallout/wallpaper/terminal2.jpg) center center/cover no-repeat fixed;
+    --logo: url(/css/addons/unraid/login-page/fallout/logo/vault-tec_green.png) center no-repeat;
+    --text-color: #14F074;
+    --input-color: #14F074;
+    --link-color: #14F074;
+    --link-color-hover: #0C833D;
+    --case-color: #14F074;
+    --button-text-color: #14F074;
+    --button-text-color-hover: #FFFFFF;
+    --button-color: #14F074;
+    --button-color2: #0C833D;
+    --input-font: 'Share Tech Mono', monospace;
+    --text-font: 'Share Tech Mono', monospace;
+    --div-background-color-15: rgba(0, 0, 0, 0.25);
+
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+    */
+}
--- a/css/addons/unraid/login-page/fallout/video/VaultTecCRTLoop.mp4
+++ b/css/addons/unraid/login-page/fallout/video/VaultTecCRTLoop.mp4
--- a/css/addons/unraid/login-page/fallout/video/VaultTecCRTLoopNoScanline.mp4
+++ b/css/addons/unraid/login-page/fallout/video/VaultTecCRTLoopNoScanline.mp4
--- a/css/addons/unraid/login-page/fallout/video/please_stand_by.mp4
+++ b/css/addons/unraid/login-page/fallout/video/please_stand_by.mp4
--- a/css/addons/unraid/login-page/fallout/wallpaper/rocky-wall.png
+++ b/css/addons/unraid/login-page/fallout/wallpaper/rocky-wall.png
--- a/css/addons/unraid/login-page/fallout/wallpaper/terminal.jpg
+++ b/css/addons/unraid/login-page/fallout/wallpaper/terminal.jpg
--- a/css/addons/unraid/login-page/fallout/wallpaper/terminal2.jpg
+++ b/css/addons/unraid/login-page/fallout/wallpaper/terminal2.jpg
--- a/css/addons/unraid/login-page/retro-terminal/amber.css
+++ b/css/addons/unraid/login-page/retro-terminal/amber.css
@ -0,0 +1,33 @@
+/*_____________________AMBER_THEME______________________*/
+/* --body-before:#00ff771a; /* This is the background that creates the crt lines, background uses a transparency of 10% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-after: #00ff7733; /* This is the background that creates the crt lines, background uses a transparency of 20% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-animation: flicker; This is the background that flickers. SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+/* --custom-text-header-animation: textflicker; /* SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+
+@import url(/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css);
+:root {
+--main-bg-color:black;
+--body-before:#ffb52a1a;
+--body-after: #ffb52a33;
+--body-animation: flicker;
+--logo: url(/css/addons/unraid/login-page/alien/logo/wings_yellow.png) center no-repeat;
+--text-color: #ffb52a;
+--input-color: #ffb52a;
+--link-color: #ffb52a;
+--link-color-hover: #ff6868;
+--case-color: #ffb52a;
+--button-text-color: #ffb52a;
+--button-text-color-hover: #000;
+--button-color: #ffb52a;
+--button-color-hover: #ff6868;
+--selection-color: #ff6868;
+--custom-text-header:#ffb52a;
+--custom-text-header-shadow:#ffb52a;
+--custom-text-header-animation: textflicker;
+--input-font: 'Share Tech Mono', monospace;
+--text-font: 'Share Tech Mono', monospace;
+--loginbox-background-color: transparent;
+--text-shadow: 0 0 8px;
+--text-shadow-color: #ffb52a;
+--box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/retro-terminal/blue.css
+++ b/css/addons/unraid/login-page/retro-terminal/blue.css
@ -0,0 +1,33 @@
+/*_____________________BLUE_THEME______________________*/
+/* --body-before:#00ff771a; /* This is the background that creates the crt lines, background uses a transparency of 10% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-after: #00ff7733; /* This is the background that creates the crt lines, background uses a transparency of 20% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-animation: flicker; This is the background that flickers. SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+/* --custom-text-header-animation: textflicker; /* SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+
+@import url(/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css);
+:root {
+--main-bg-color:black;
+--body-before:#70d7f61a;
+--body-after: #70d7f633;
+--body-animation: flicker;
+--logo: url(/css/addons/unraid/login-page/alien/logo/wings_blue.png) center no-repeat;
+--text-color: #70d7f6;
+--input-color: #70d7f6;
+--link-color: #70d7f6;
+--link-color-hover: #8f2809;
+--case-color: #70d7f6;
+--button-text-color: #70d7f6;
+--button-text-color-hover: #000;
+--button-color: #70d7f6;
+--button-color-hover: #8f2809;
+--selection-color: #8f2809;
+--custom-text-header:#70d7f6;
+--custom-text-header-shadow:#70d7f6;
+--custom-text-header-animation: textflicker;
+--input-font: 'Share Tech Mono', monospace;
+--text-font: 'Share Tech Mono', monospace;
+--loginbox-background-color: transparent;
+--text-shadow: 0 0 8px;
+--text-shadow-color: #70d7f6;
+--box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/retro-terminal/custom.css
+++ b/css/addons/unraid/login-page/retro-terminal/custom.css
@ -0,0 +1,33 @@
+/*_____________________CUSTOM_THEME______________________*/
+/* --body-before:#00ff771a; /* This is the background that creates the crt lines, background uses a transparency of 10% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-after: #00ff7733; /* This is the background that creates the crt lines, background uses a transparency of 20% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-animation: flicker; This is the background that flickers. SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+/* --custom-text-header-animation: textflicker; /* SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+
+@import url(/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css);
+:root {
+--main-bg-color:black;
+--body-before:#70d7f61a;
+--body-after: #70d7f633;
+--body-animation: flicker;
+--logo: url(/css/addons/unraid/login-page/alien/logo/wings_shadow.png) center no-repeat;
+--text-color: #ffffff;
+--input-color: #ffffff;
+--link-color: #ffffff;
+--link-color-hover: #8f2809;
+--case-color: #ffffff;
+--button-text-color: #ffffff;
+--button-text-color-hover: #000;
+--button-color: #ffffff;
+--button-color-hover: #af0606;
+--selection-color: #8f2809;
+--custom-text-header:#ffffff;
+--custom-text-header-shadow:#ffffff;
+--custom-text-header-animation: textflicker;
+--input-font: 'Share Tech Mono', monospace;
+--text-font: 'Share Tech Mono', monospace;
+--loginbox-background-color: transparent;
+--text-shadow: 0 0 8px;
+--text-shadow-color: #ffffff;
+--box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/retro-terminal/green.css
+++ b/css/addons/unraid/login-page/retro-terminal/green.css
@ -0,0 +1,33 @@
+/*_____________________GREEN_THEME______________________*/
+/* --body-before:#00ff771a; /* This is the background that creates the crt lines, background uses a transparency of 10% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-after: #00ff7733; /* This is the background that creates the crt lines, background uses a transparency of 20% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-animation: flicker; This is the background that flickers. SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+/* --custom-text-header-animation: textflicker; /* SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+
+@import url(/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css);
+:root {
+--main-bg-color:black;
+--body-before:#00ff771a;
+--body-after: #00ff7733;
+--body-animation: flicker;
+--logo: url(/css/addons/unraid/login-page/alien/logo/wings_green.png) center no-repeat;
+--text-color: #37f592;
+--input-color: #37f592;
+--link-color: #37f592;
+--link-color-hover: #68ffff;
+--case-color: #37f592;
+--button-text-color: #37f592;
+--button-text-color-hover: #000;
+--button-color: #37f592;
+--button-color-hover: #68ffff;
+--selection-color: #68ffff;
+--custom-text-header:#37f592;
+--custom-text-header-shadow:#37f592;
+--custom-text-header-animation: textflicker;
+--input-font: 'Share Tech Mono', monospace;
+--text-font: 'Share Tech Mono', monospace;
+--loginbox-background-color: transparent;
+--text-shadow: 0 0 8px;
+--text-shadow-color: #37f592;
+--box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/retro-terminal/js/custom_text_header.js
+++ b/css/addons/unraid/login-page/retro-terminal/js/custom_text_header.js
@ -0,0 +1,16 @@
+
+ //Custom Text Header //
+ // ACSII slant font
+
+// Needs to be inside <section id="login" class="shadow">
+// YOU MUST ESCAPE ANY SINGLE BACKSLASHES LIKE SO: \\
+
+let custom_text_header = `
+<div class="custom-text-header"> <pre>                     __                             ___       __  
+   ____  ____  _____/ /__________  ____ ___  ____  / (_)___  / /__
+  / __ \\/ __ \\/ ___/ __/ ___/ __ \\/ __ '__ \\/ __ \\/ / / __ \\/ //_/
+ / / / / /_/ (__  ) /_/ /  / /_/ / / / / / / /_/ / / / / / / ,&lt;   
+/_/ /_/\\____/____/\\__/_/   \\____/_/ /_/ /_/\\____/_/_/_/ /_/_/|_|  
+                                                                 </pre> </div>
+`;
+document.getElementById("login").innerHTML += custom_text_header
--- a/css/addons/unraid/login-page/retro-terminal/red.css
+++ b/css/addons/unraid/login-page/retro-terminal/red.css
@ -0,0 +1,33 @@
+/*_____________________RED_THEME______________________*/
+/* --body-before:#00ff771a; /* This is the background that creates the crt lines, background uses a transparency of 10% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-after: #00ff7733; /* This is the background that creates the crt lines, background uses a transparency of 20% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-animation: flicker; This is the background that flickers. SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+/* --custom-text-header-animation: textflicker; /* SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+
+@import url(/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css);
+:root {
+--main-bg-color: black;
+--body-before: #ff00001a;
+--body-after: #ff000033;
+--body-animation: flicker;
+--logo: url(/css/addons/unraid/login-page/alien/logo/wings_red.png) center no-repeat;
+--text-color: #e22828;
+--input-color: #e22828;
+--link-color: #e22828;
+--link-color-hover: #ffffff;
+--case-color: #e22828;
+--button-text-color: #e22828;
+--button-text-color-hover: #000;
+--button-color: #e22828;
+--button-color-hover: #ffffff;
+--selection-color: #ffffff;
+--custom-text-header: #e22828;
+--custom-text-header-shadow: #e22828;
+--custom-text-header-animation: textflicker;
+--input-font: 'Share Tech Mono', monospace;
+--text-font: 'Share Tech Mono', monospace;
+--loginbox-background-color: transparent;
+--text-shadow: 0 0 8px;
+--text-shadow-color: #e22828;
+--box-shadow: 0 0 15px;
+}
--- a/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css
+++ b/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css
@ -0,0 +1,362 @@
+@import "https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css";
+@import "https://fonts.googleapis.com/css?family=Share+Tech+Mono&display=swap";
+@import "https://fonts.googleapis.com/css?family=VT323";
+
+/*___FONTS___*/
+/* 'VT323', 'Share Tech Mono' */
+    /* Replace the variables if you have a dark background  */
+    /* Light colors for dark backgrounds */
+    /*
+        --div-background-color-15: rgba(255, 255, 255, 0.15);
+
+    https://www.transparenttextures.com/patterns/hexellence.png
+    https://www.transparenttextures.com/patterns/gplay.png
+    https://www.transparenttextures.com/patterns/simple-horizontal-light.png
+    https://www.colourlovers.com/palette/3428762/Fallout?widths=1
+    
+    https://codepen.io/meduzen/pen/zxbwRV
+    https://codepen.io/lbebber/pen/XJRdrV/ CRT KEY FRAMES
+    https://brennan.io/2017/06/14/alien-computer-card/
+    https://www.cssmatic.com/noise-texture
+
+    https://codepen.io/somethingformed/pen/raWJXV
+
+
+    ============ SOURCES =============
+    https://github.com/brenns10/alien-console
+    https://github.com/Swordfish90/cool-retro-term
+    https://github.com/andersevenrud/retro-css-shell-demo CRT INTERLACE
+    https://codepen.io/lbebber/pen/XJRdrV/ CRT KEY FRAMES
+    https://codepen.io/patrickhlauke/pen/YaoBop TEXT FLIKER
+
+    */
+
+
+* {
+    outline: none;
+}
+
+@media (max-width: 500px) {
+    #login {
+        -webkit-backdrop-filter: blur(0px);
+        backdrop-filter: blur(0px);
+        position: absolute;
+        padding-top: 0rem !important;
+        top: 0;
+        left: 0;
+        bottom: 0;
+        right: 0;
+        height: 100%;
+        width: 100%;
+        border-radius: none !important;
+    }
+    .background-wrap,#video-bg-elem,.custom-text-header  {display: none;}
+    #login {
+        border:none !important;
+    }
+}
+
+html {background: var(--main-bg-color) !important;}
+body {background: var(--main-bg-color) !important;}
+/* CRT SCREEN FLICKER*/
+body::before {
+    content: "";
+    background: radial-gradient(ellipse at center,var(--body-before) 0,rgb(0, 0, 0) 100%) !important;
+    background-repeat: repeat-y !important;
+    background-size: 100% 4px !important;
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+    animation: var(--body-animation) 0.01s infinite;
+    pointer-events: none;
+}
+/* CRT BACKGROUND WITH LINES*/
+body::after {
+    content: "";
+    background: radial-gradient(ellipse at center,var(--body-after) 0,rgba(0, 0, 0, 0.6) 80%) center center/cover no-repeat fixed, linear-gradient(#0000 0%,#0000 0%) !important;
+    background-repeat: repeat-y !important;
+    background-size: 100% 4px !important;
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+    pointer-events: none;
+}
+
+@keyframes flicker {0% {opacity: 0.37633;}5% {opacity: 0.70002;}10% {opacity: 0.64427;}15% {opacity: 0.35591;}20% {opacity: 0.34054;}25% {opacity: 0.54917;}30% {opacity: 0.41056;}35% {opacity: 0.67637;}40% {opacity: 0.23681;}45% {opacity: 0.64945;}50% {opacity: 0.67522;}55% {opacity: 0.56049;}60% {opacity: 0.06113;}65% {opacity: 0.95766;}70% {opacity: 0.77945;}75% {opacity: 0.33817;}80% {opacity: 0.19735;}85% {opacity: 0.84337;}90% {opacity: 0.82867;}95% {opacity: 0.65512;}100% {opacity: 0.15179;}}
+
+@media only screen and (max-width: 768px) {
+    #login {
+        min-width: 300px;
+    }
+}
+/*FOR VIDEO BACKGROUND*/
+.background-wrap {
+    position: fixed;
+    z-index: -1000;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    top: 0;
+    left: 0;
+}
+#video-bg-elem {
+    position: absolute;
+    top: 0;
+    left: 0;
+    min-height: 100%;
+    min-width: 100%;
+}
+/*TEXT COLOR*/
+#login h1,
+#login h2,
+#login .error {
+    color: var(--text-color) !important;
+    text-shadow: var(--text-shadow) var(--text-shadow-color);
+}
+#login a {
+    color: var(--link-color);
+    text-shadow: var(--text-shadow) var(--text-shadow-color);
+}
+#login a:hover {
+    color: var(--link-color-hover);
+    text-shadow: var(--text-shadow) var(--text-shadow-color);
+}
+#login input {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-shadow-color);
+}
+#login ::placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-shadow-color);
+}
+#login ::-webkit-input-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-shadow-color);
+}
+#login ::-moz-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-shadow-color);
+}
+#login :-ms-input-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-shadow-color);
+}
+#login :-moz-placeholder {
+    color: var(--input-color);
+    text-shadow: 0 0 5px var(--text-shadow-color);
+}
+#login input:focus::-webkit-input-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+#login input:focus:-moz-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+#login input:focus::-moz-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+#login input:focus:-ms-input-placeholder {
+    color: transparent !important;
+    text-shadow: 0 0 0px transparent;
+}
+
+/*TEXT FONT*/
+#login h1,
+#login h2,
+#login a,
+#login .button,
+#login .error {
+    font-family: var(--text-font);
+    -webkit-font-smoothing: none;
+    line-height: 1.2;
+}
+h1 {
+    font-size: 3em;
+    margin: 0;
+}
+
+/* CASE COLOR */
+#login [class^='case-'],
+#login [class*=' case-'] {
+    font-family: cases!important;
+    speak: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    color: var(--case-color);
+    text-shadow: var(--text-shadow) var(--text-shadow-color);
+}
+/*INPUT FORMS*/
+#login [type=text],
+#login [type=password] {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    border: 2px solid transparent;
+    text-transform: uppercase;
+    border-radius: 0px;
+    border: 3px solid var(--text-color);
+    color: var(--text-color);
+}
+#login [type=text]:active,
+#login [type=text]:focus,
+#login [type=password]:active,
+#login [type=password]:focus {
+    font-family: var(--input-font);
+    background-color: rgba(0, 0, 0, 0.25);
+    text-transform: uppercase;
+}
+
+
+
+/*BUTTON*/
+#login .button {
+    color: var(--button-text-color);
+    text-shadow: var(--text-shadow) var(--text-shadow-color);
+    background: linear-gradient(90deg, var(--button-color) 0, var(--button-color)) 0 0 no-repeat, linear-gradient(90deg, var(--button-color) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 100% 100% no-repeat;
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color)), to(var(--button-color))) 0 0 no-repeat, -webkit-gradient(linear, left top, right top, from(var(--button-color)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 100% 100% no-repeat;
+    background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100%;
+    
+}
+#login .button:hover {
+    color: var(--button-text-color-hover);
+    text-shadow: var(--text-shadow) var(--button-color-hover);
+    box-shadow: var(--box-shadow) var(--button-color-hover);
+    background-color: var(--button-color-hover);
+    background: -webkit-gradient(linear, left top, right top, from(var(--button-color-hover)), to(var(--button-color-hover)));
+    background: linear-gradient(90deg, var(--button-color-hover) 0, var(--button-color-hover));
+}
+
+/*LOGIN ID*/
+#login {
+    background: var(--loginbox-background-color) !important;
+    padding-top: 1rem;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    -ms-transform: translate(-50%, -50%);
+    -webkit-transform: translate(-50%, -50%);
+    margin: 0 !important;
+    text-transform: uppercase;
+    min-width: 300px;
+    border-radius: 0px !important;
+    border: 3px dashed var(--text-color);
+}
+#login .angle::after {
+    display:none;
+}
+#login .wordmark svg {
+    display: none;
+}
+#login .logo {
+    background: var(--logo);
+    background-size: contain;
+    padding: 2rem;
+    border-radius: 0;
+    margin: 0rem 1rem 0rem 1rem;
+}
+logo.angle {
+    -webkit-box-shadow: inset 0px 0px 0px 2px var(--text-color) !important;
+    box-shadow: inset 0px 0px 0px 2px var(--text-color) !important;
+    border-radius: 0px !important;
+}
+#login .error {
+    animation-name: shake;
+    animation-duration: .7s;
+}
+
+/*CUSTOM HEADER*/
+.custom-text-header {
+    white-space: pre;
+    letter-spacing: 2px;
+    font-family: var(--text-font);
+    -webkit-font-smoothing: none;
+    font-weight: 900;
+    line-height: 1.5;
+    color: var(--custom-text-header) !important;
+    text-shadow: 0 0 20px var(--custom-text-header-shadow);
+    position: absolute;
+    left: 50%;
+    top: -15%;
+    transform: translate(-50%, -50%);
+    -ms-transform: translate(-50%, -50%);
+    -webkit-transform: translate(-50%, -50%);
+    animation-duration: 0.01s;
+    animation-name: var(--custom-text-header-animation);
+    animation-iteration-count: infinite;
+    animation-direction: alternate;
+    font-weight: 900;
+}
+.custom-text-header:after {
+    content: "";
+    position: absolute;
+    top: 135px;
+    right: -15px;
+    background-color: var(--custom-text-header);
+    vertical-align: top;
+    width: 20px;
+    height: 2px;
+    -webkit-animation: blink 1s step-end infinite;
+    animation: blink 1s step-end infinite;
+}
+@-webkit-keyframes blink {
+    0% { opacity: 1.0; }
+    50% { opacity: 0.0; }
+    100% { opacity: 1.0; }
+  }
+  
+  @keyframes blink {
+    0% { opacity: 1.0; }
+    50% { opacity: 0.0; }
+    100% { opacity: 1.0; }
+  }
+
+  @keyframes textflicker {
+    from {
+      text-shadow: 1px 0 0 #ea36af, -2px 0 0 #75fa69;
+      border: 10px 0 0 #ea36af, -2px 0 0 #75fa69;
+    }
+    to {
+      text-shadow: 2px 0.5px 2px #ea36af, -1px -0.5px 2px #75fa69;
+      border: 2px 0.5px 2px #ea36af, -1px -0.5px 2px #75fa69;
+    }
+  }
+
+  ::selection {
+    background: var(--selection-color); /* WebKit/Blink Browsers */
+  }
+  ::-moz-selection {
+    background: var(--selection-color); /* Gecko Browsers */
+  }
+
+
+/*
+
+                     __                             ___       __  
+   ____  ____  _____/ /__________  ____ ___  ____  / (_)___  / /__
+  / __ \/ __ \/ ___/ __/ ___/ __ \/ __ `__ \/ __ \/ / / __ \/ //_/
+ / / / / /_/ (__  ) /_/ /  / /_/ / / / / / / /_/ / / / / / / ,<   
+/_/ /_/\____/____/\__/_/   \____/_/ /_/ /_/\____/_/_/_/ /_/_/|_|  
+                                                                 
+*/
+/*
+<div class="custom-text-header"> <pre>                     __                             ___       __  
+   ____  ____  _____/ /__________  ____ ___  ____  / (_)___  / /__
+  / __ \/ __ \/ ___/ __/ ___/ __ \/ __ '__ \/ __ \/ / / __ \/ //_/
+ / / / / /_/ (__  ) /_/ /  / /_/ / / / / / / /_/ / / / / / / ,&lt;   
+/_/ /_/\____/____/\__/_/   \____/_/ /_/ /_/\____/_/_/_/ /_/_/|_|  
+                                                                 </pre> </div>
+*/
--- a/css/addons/unraid/login-page/retro-terminal/white.css
+++ b/css/addons/unraid/login-page/retro-terminal/white.css
@ -0,0 +1,33 @@
+/*_____________________WHITE_THEME______________________*/
+/* --body-before:#00ff771a; /* This is the background that creates the crt lines, background uses a transparency of 10% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-after: #00ff7733; /* This is the background that creates the crt lines, background uses a transparency of 20% SET TO NONE TO REMOVE CRT EFFECT */
+/* --body-animation: flicker; This is the background that flickers. SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+/* --custom-text-header-animation: textflicker; /* SET TO NONE TO REMOVE THE FLICKER ANIMATION! */
+
+@import url(/css/addons/unraid/login-page/retro-terminal/retro-terminal-base.css);
+:root {
+--main-bg-color:black;
+--body-before:#70d7f61a;
+--body-after: #70d7f633;
+--body-animation: flicker;
+--logo: url(/css/addons/unraid/login-page/alien/logo/wings_shadow.png) center no-repeat;
+--text-color: #ffffff;
+--input-color: #ffffff;
+--link-color: #ffffff;
+--link-color-hover: #af0606;
+--case-color: #ffffff;
+--button-text-color: #ffffff;
+--button-text-color-hover: #000;
+--button-color: #ffffff;
+--button-color-hover: #af0606;
+--selection-color: #8f2809;
+--custom-text-header:#ffffff;
+--custom-text-header-shadow:#ffffff;
+--custom-text-header-animation: textflicker;
+--input-font: 'Share Tech Mono', monospace;
+--text-font: 'Share Tech Mono', monospace;
+--loginbox-background-color: transparent;
+--text-shadow: 0 0 8px;
+--text-shadow-color: #000000;
+--box-shadow: 0 0 15px;
+}
--- a/Show More
+++ b/Show More