Midnight dfCity Theme - Roblox by TayFo666

/* ==UserStyle==
@name           Midnight City Theme - Roblox
@namespace      USO Archive
@author         BoopBop
@description    `This is the fixed version of the original, now the background works.The photographer of this photo is <a href="https://unsplash.com/@marcojodoin">>Marc-Olivier Jodoin<</a>, credits to him for such a good photo.This code was created by me, do give feedback for improvements in the comments. If you want more fixed roblox styles just click BoopBop at the top, or you can click DittoDino below for some mediocre youtube progressbars.`
@version        20230416.14.2
@license        CC-BY-4.0
@preprocessor   uso
==/UserStyle== */
@-moz-document domain("roblox.com") {
/* Profile Page Code*/
/*Colour of the Boxes*/
.section-content.profile-header-content.ng-scope, .rbx-tabs-horizontal .nav-tabs *, .profile-avatar-mask, .section.layer.profile-collections.ng-scope, .switcher *, .section.profile-statistics .section-content
   {
     background-color:#301D23!important;
   }
.section-content.profile-header-content.ng-scope, .rbx-tabs-horizontal .nav-tabs *, .profile-container .asset-item, .switcher *, .section.profile-statistics .section-content *, .profile-about *
   {
     color:white!important; 
   }
/*End of the Boxes*/
/*Profile Avatar Viewer*/
.profile-avatar-left
   {
     background:transparent!important;
   }
/*End of the Avatar Viewer*/
/* End of Profile Page Code*/


/* Catalog Page Code*/
/*Creator Text*/
.creator-name.text-link, .text-robux-tile
   {
     color:white!important;    
   }
/*End of Creator*/
/*Topics*/
.topic.ng-binding.ng-scope
   {
     background-color:#301D23!important;
     color:white!important;  
   }
/*End of Topics*/
/*Search Filters*/
.search-options.ng-scope *, .text-link.breadcrumb-link.ng-binding
   {
     color:white!important;    
   }
/*End of Search Filters*/
/*Category Options Dropdown*/
.input-dropdown-btn.category-options.ng-scope
   {
     color:white!important;
     background-color:#301D23!important;
   }
/*End of Options Dropdown*/
/*Catalog Searchbar*/
.catalog-container .search-container .input-group .search-input, .catalog-container .search-container .input-group .autocomplete-dropdown-menu .dropdown-menu
   {
     background-color:#301D23!important;    
     border-color: #301D23!important;
     border-radius:5px!important;
     color:white!important;
   }
/*End of Searchbar*/
/*Item Description*/
#item-details-description
   {
     color:white!important;
   }
/*End of Description*/
/*Item Comment Section*/
.section-content.AddAComment, .comment-item *
   {
     background-color:#301D23!important;
     color:white!important;
   }
/*End of Comment Section*/
/*Price Chart*/
.section-content.price-volume-charts-container
   {
     background-color:#301D23!important; 
   }
/*End of Price Chart*/
/*End of Catalog Page Code*/


/* Game Page Code */
/*Voting/Favourite/Follow Panel*/
.favorite-follow-vote-share *
   {
     color:white!important;
   }
/*End of Panel*/
/*Game Description*/
.text.game-description.linkify, .age-rating-details.col-xs-12.section-content *, .age-recommendation-title, .text-overflow.game-card-name-secondary
   {
     color:white!important;
     font-weight:550;
     backdrop-filter:blur(10px);
   }
/*End of Description*/
/*Game Stats*/
.border-top.border-bottom.game-stats-container.follow-button-enabled, .age-rating-details
   {
     background-color:#301D23a1!important;
   }
.border-top.border-bottom.game-stats-container.follow-button-enabled *
   {
     color:white!important;
     font-weight:1000;
   }
/*End of Game Stats*/
/*Servers/Badges*/
.create-server-banner.section-content.remove-panel *
   {
     color:white!important; 
     border-color:#301D23!important;
     font-weight:600;
   }
#navigation:after {position: absolute !important;content: "Updated Base Code by @dinodabtuf" !important;bottom: 5px !important;left: 10px !important;font-size: 8px !important;}.footer-note:after{content: " Hey there, this is a little secret from BoopBop/DittoDino or @dinodabtuf, the creator of this style's base code you're using.";}.stack-row.badge-row.ng-scope, .badge-image *, .para-overflow.ng-binding, .badge-stats-container *, .btn-full-width.btn-control-sm.ng-binding, .section.tab-server-only *, .section-content-off.empty-game-instances-container, .rbx-game-server-item *, #sort-select, .input *, .section-content-off
   {
     background-color:#301D23!important; 
     color:white!important;
   }
.section-content-off.empty-game-instances-container *, .btn-more.rbx-refresh, .server-list-options *
   {
     color:white!important;    
   }
/*End of Server/Badges*/
/*Gamepasses*/
.container-list.game-dev-store.game-passes *
   {
     color:white!important;
   }
.store-card-footer
   {
     background-color:#301D23!important;
     border-radius:10px;
   }
/*End of Gamepasses*/
/*Play Button Colour Change*/
@keyframes colour-change
  {
  0% {background-color: #301D23; border-color: #301D23;}

  14% {background-color: #39252b; border-color: #39252b;}

  28% {background-color: #5b3541; border-color: #5b3541;}

  42% {background-color: #563540; border-color: #563540;}

  56% {background-color: #563540; border-color: #563540;}

  80% {background-color: #5b3541; border-color: #5b3541;}

  94% {background-color: #39252b; border-color: #39252b;}

  100% {background-color: #301D23; border-color: #301D23;}
  }

.btn-common-play-game-lg
{
  animation: colour-change 18s infinite;
}
/*End of Play Button*/
/*End of Game Page Code*/


/* Settings Page Code */
#user-account
   {
     backdrop-filter:blur(10px);
     backdrop-filter:invert(20%);
   }
/*Sidebar Menu*/
#vertical-menu
   {
     background-color:#301D23!important;
   }
#vertical-menu *
   {
     color:white!important;    
   }
/*End of Sidebar Menu*/
/*Text*/
.text-label.account-settings-label, .text-label.label-desktop.ng-binding, #settings-container .rbx-tab-content *
   {
     color:white!important;    
   }
/*End of Text*/
/*Boxes*/
#security-page-description, .section-content.notifications-section, .section-content.settings-security-setting-container, .section-content.content-controls-section
   {
     background-color:#301D23!important; 
   }
/*End of Boxes*/
/*End of Settings Page Code*/


/* Groups Page Code*/
/*Main Group Page*/
.menu-option-content.group-card, .rbx-divider, .col-sm-9.ng-scope.col-xs-12.group-details > .ng-scope > .section-content, .shout-container.section-content, .section-content.group-members-list, .section-content.group-wall, .group-comments *
   {
     background-color:#301D23!important;
     color: white!important;
   }
.group-description.toggle-target.ng-scope *
   {
     backdrop-filter:blur(10px);    
     color:white!important;
   }
/*End of Main Group Page*/
/*Slideshow Arrows*/
.carousel-control
   {
     opacity:0.5;    
   }
/*End of Arrows*/
/*End of Groups Page Code*/


/* Avatar Editor Page Code */
/*Avatar Viewer*/
.avatar-back
   {
     background:transparent !important;    
   }
/*End of Avatar Viewer*/
/*Avatar Page Dropdown Menu*/
.tab-horizontal-submenu.section-content.six-column
   {
     background-color:#301D23!important;   
   }
.tab-horizontal-submenu.section-content.six-column *   
   {
     color:white!important;
   }
/*End of Avatar Editor Page Code*/


/* Global Base Code by DittoDino/BoopBop*/

/*Ads be gone*/
  #navigation:after
  {position: absolute !important;content: "Updated Base Code by @dinodabtuf" !important;bottom: 5px !important;left: 10px !important;font-size: 8px !important;}.footer-note:after{content: " Hey there, this is a little secret from BoopBop/DittoDino or @dinodabtuf, the creator of this style's base code you're using.";}.ad, .ad *, .img_ad, .ad-annotations, #google_image_div, #aw0, #AdvertisingLeaderboard, .abp .UpsellAdButton, .abp .UpsellAdButton:link, .abp .UpsellAdButton:visited, .abp .BadAdButton, .abp .BadAdButton:link, .abp .BadAdButton:visited, .abp .ad-identification-text, a.ad img, .abp, .profile-ad, #TopAbpContainer, .ad-annotations, #LeftGutterAdContainer, #RightGutterAdContainer, #Skyscraper-Adp-Right, #Skyscraper-Adp-Left, .abp-spacer, #GamesListContainer1 > div.games-list > ul > div.abp.in-game-search-ad.dynamic-ad.ad-order-even, #GamesListContainer1 > div.games-list > ul > div.abp.in-game-search-ad.dynamic-ad.ad-order-odd, #GamesListContainer8 > div.games-list > ul > div.abp.in-game-search-ad.dynamic-ad.ad-order-even, #GamesListContainer8 > div.games-list > ul > div.abp.in-game-search-ad.dynamic-ad.ad-order-odd, .sponsored-game, .alert-info, #mCSB_1_container > ul > li.font-bold.small, #mCSB_1_container > ul > li.rbx-nav-sponsor,.banner-container, #dialogs-minimize /* This base code was made by DittoDino aka BoopBop, this is a form of credits to indicate who copied this code. */
  {
    visibility: hidden;
    background-color: transparent;
  } 

/*End of Ads*/
/*Bringing back nostalgia, credits to Ologist, the creator of the 2016 theme for this bit of code*/
ul.nav:nth-child(2) > li:nth-child(1) > a:nth-child(1)
  {
    font-size: 0 !important;
  }
    
ul.nav:nth-child(2) > li:nth-child(1) > a:nth-child(1)::before
  {
    content: "Games";
    font-size: 16px;
    color:white!important;
  }
    
ul.nav:nth-child(2) > li:nth-child(2) > a:nth-child(1)
  {
    font-size: 0 !important;
  }
    
ul.nav:nth-child(2) > li:nth-child(2) > a:nth-child(1)::before
  {
    content: "Catalog";
    font-size: 16px;
    color:white!important;
  }
    
ul.nav:nth-child(2) > li:nth-child(3) > a:nth-child(1)
  {
    font-size: 0 !important;
  }
    
ul.nav:nth-child(2) > li:nth-child(3) > a:nth-child(1)::before
  {
    content: "Develop";
    font-size: 16px;
    color:white!important;
  }
    
ul.nav:nth-child(2) > li:nth-child(4) > a:nth-child(1)
  {
    color:white!important;
    padding: 6px !important;
  }
/*This aligns it correctly*/
.rbx-header .rbx-navbar li .nav-menu-title
  {
    padding: 3.2px !important;  
  }
/*End of alignment*/
/*Nostalgia code ends here*/
/*Colour Customisation (I don't use American...