hacktoberfestdark-themesonarrradarrplexorganizrnginxthemethemes-csssubfilterguacamoleskinsombilidarrdocker-modsdark-themesdark-modecustom-csscssthemes-custom
		
		
		
		
			You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							861 lines
						
					
					
						
							20 KiB
						
					
					
				
			
		
		
		
			
			
			
				
					
				
				
					
				
			
		
		
	
	
							861 lines
						
					
					
						
							20 KiB
						
					
					
				
								/* 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 "https://theme-park.dev/css/addons/organizr/glass/organizr-base-old.css"
							 | 
						|
								@import "https://theme-park.dev/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;
							 | 
						|
								    }
							 | 
						|
								}
							 |