Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* XXX: CSS is very important to Robloxiapedia. */
 
/* edit counters have been re-enabled in robloxiapedia */
/* please request to robloxiapedia staff if you want them re-disabled (up to 24 hours due to complaints) */
@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sixtyfour&display=swap');
@import url('https://fonts.googleapis.com/css2?family=New+Rocker&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nova+Square&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bungee+Inline&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Norican&display=swap');
/* just adding a few things */
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:SpoilerBlur.css&only=styles";
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
.cdx-message.cdx-message--warning, .mw-message-box-warning, .warningbox {
    background-color: rgba(255,0,0,.25);
    border: 1px solid rgb(255,0,0);
    color: inherit;
}
/* disable saving - this extension we didn't ask */
.SaveToCollectionModal-module_modal__beYg- {
	display:none;
}

@keyframes rainbow-bg{
	0%{
		filter:hue-rotate(0deg)
	}
	100%{
		filter:hue-rotate(360deg)
	}
}
.page-counter{
	opacity:1;
}
/* our font. if your font is "Inter", i suggest getting the 
Builder Sans font from roblox and downloading it. not required*/
.resizable-container {
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
}

/* customize the buttons too, why not */
.wds-pill-button{
	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
}

 /**
 * if you want your username colored, please talk to me with what color you want.
 * -chikoritatherobloxian
 * staff can add colors without asking me for permission
 */
 
/* important but funny article you should read*/
a[href$="/wiki/Chikorita152e/meta-vigilante"] {     
display:none;
}
/* those articles are important */
a[href$="/wiki/Brookhaven"] {     
    font-weight: 900;
    font-style: oblique;
}
a[href$="/wiki/Robloxia"] {     
    font-weight: 900;
    font-style: oblique;
}

/* user flair, for special users */
a[href$="/wiki/User:ChikoritaTheRobloxian"] {     
	font-family:"Arial";
    font-weight: 900; 
    color: #0ff;
}

a[href$="/wiki/User:Nxteonx"] {     
    font-family:"Arial";
    font-weight: 800;
    color: #7c7c00;
}

a[href$="/wiki/User:ArandomfurryYt"] {     
    font-weight: 700;
    color: #800080;

}

a[href$="/wiki/User:AndroidTan"] {     
    font-family:"Courier";
    font-weight: 500;
    color: #a40000;

}

a[href$="/wiki/User:Yellow_Puma_Plus"] {     
    font-family:"Arial";
    font-weight: 900;
    color: #cc9900;

}

a[href$="/wiki/User:Lana0nyxnite"] {     
    font-family:"Fantasy";
    font-weight: 900;
    background: linear-gradient(to top, #3352DC  25%, #5CB6FF 50%, #7CE0FF 75%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 0.13px white;
  
  
}
/** end of all
flair and beginng
of page styling */


/* Removed elements that detract from the Fandom user experience. */



/* we will let fandom deal with hyperlink colors */



.mw-parser-output tbody td {
  text-align: center;
}

.mw-parser-output tfoot th {
  text-align: right;
}
/* caption tables */

caption {
  padding: 20px;
  font-style: normal;
  caption-side: top;
  text-align: center;
}
/* elaborate on the block quote */
blockquote {
  min-height: 5em;
  padding   : 1em 4em;
  position  : relative;
  background-color: #ffeb3b ;
  color: black;
}

blockquote::before,
blockquote::after {
  position: absolute;
  height  : 3rem;
}

blockquote::before {
  content: '“';
  top    : 0.3rem;
  left   : 0.9rem;
}

blockquote::after {
  content: '”';
  bottom : 0.3rem;
  right  : 0.8rem;
}

blockquote:lang(fr)::before {
  content: '«';
  top    : -1.5rem;
  left   : 0.5rem;
}

blockquote:lang(fr)::after {
  content: '»';
  bottom : 2.6rem;
  right  : 0.5rem
}
blockquote {
  resize: both;
  overflow: auto;
}
/* just in case user wants a dark theme but cannot see
the spoken word */
.theme-fandomdesktop-dark blockquote {   min-height: 5em;
  padding   : 1em 4em;
  position  : relative;
  background-color: #0014c4 !important; }

table {
  resize: both;
  overflow: auto;
}

/* stuff added for style. may want to touch with 30 foot pole
later */



/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #EFEFEF;
  color: #000000;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
   position: absolute;
  z-index: 1;
}
/* Tooltip text */
.theme-fandomdesktop-dark .tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #101010;
  color: #FFFFFF;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
   position: absolute;
  z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}
/* Make sure that padding behaves as expected */
* {box-sizing:border-box}

/* Container for progress bars */
.container {
  width: 100%; /* Full width */

}

.skills {
  text-align: right; /* Right-align text */
  padding-top: 10px; /* Add top padding */
  padding-bottom: 10px; /* Add bottom padding */
}

.progress {width: 50%; background-color: #008000;} 

.hide {
  display: none;
}

.myDIV:hover + .hide {
  display: block;
}
.loader {
  border-top: 16px solid hsl(0, 100%, 50%);
  border-right: 16px solid hsl(90, 100%, 50%);
  border-bottom: 16px solid hsl(180, 100%, 50%);
  border-left: 16px solid hsl(270, 100%, 50%);
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s ease-in-out infinite;
}

@keyframes spin {
  0% { transform: rotate3d(1, 0, 0, 0);}
  100% { transform: rotate3d(1, 0, 0, 360deg); }
}
/* The alert message box */
.alert .inner {
  display: block;
  padding: 6px;
  margin: 6px;
  border-radius: 3px;
  border: 1px solid #767676;
  background-color: #990000;
  color: #ffffff;
}
.theme-fandomdesktop-dark .alert .inner {
  display: block;
  padding: 6px;
  margin: 6px;
  border-radius: 3px;
  border: 1px solid #767676;
  background-color: #E50000;
  color: #000000;
}


/* Callout box - fixed position at the bottom of the page */
.callout {
  position: fixed;
  bottom: 35px;
  right: 20px;
  margin-left: 20px;
  max-width: 300px;
}

/* Callout header */
.callout-header {
  padding: 25px 15px;
  background: #04246a;
  font-size: 30px;
  color: white;
}

/* Callout container/body */
.callout-container {
  padding: 15px;
  background-color: #d4d0c8;
}
/* The flip box container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-box {
  background-color: transparent;
  width: 300px;
  height: 200px;
  border: 1px solid #f1f1f1;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-box:hover .flip-box-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the back side */
.flip-box-back {
  transform: rotateY(180deg);
}
/* For making circles! */
.dot {
  height: 25px;
  width: 25px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
}
/** make a very unique highlighting experience in robloxiapedia */

::selection {
  background: rgb(161, 236, 128);
}
.theme-fandomdesktop-dark ::selection{
	background:#5e137f;
}
/* vertical lines */
.vl {
  border-left: 6px solid green;
  height: 500px;
  position: absolute;
  left: 50%;
  margin-left: -3px;
  top: 0;
}
/* Float five columns side by side */
.column {
  float: left;
  width: 20%;
  padding: 0 5px;
}

.row {margin: 0 -5px;}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive columns */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
    display: block;
    margin-bottom: 10px;
  }
}

/* Style the counter cards */
.card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  padding: 16px;
  text-align: center;
  background-color: #444;
  color: white;
}

.fa {font-size:50px;}
a
/* Add some content at the bottom of the video/page */
.chikorita {
  position: fixed;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 100%;
  padding: 20px;
}
/* Builder Sans Supremacy */
.oo-ui-buttonElement > .oo-ui-buttonElement-button{

 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;

}
.oo-ui-fieldLayout-header{ 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;
}
/* more Builder Sans supremacy */
.oo-ui-barToolGroup-tools > .oo-ui-tool.oo-ui-iconElement.oo-ui-tool-with-label > .oo-ui-tool-link .oo-ui-tool-title{
 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;
}
.oo-ui-labelElement-label{
 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;

}
.oo-ui-tool-link{
 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;


}
.ve-ui-mwTemplatePage-description ve-ui-mwTemplatePage-description-missing{
 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;


	
}
.ve-ui-mwParameterPage-label{
	
 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;

}
.ve-ui-linearContextItem-body{
 	    margin: 0;
 	-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
 	font-family:"Builder Sans","Inter";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    
    text-align: left;


}
/* i am not ok with fandom colors, but i am ok with fandom */
.search-modal__content{
    background-color: var(--theme-page-background-color);
    border: 1px solid #04246A;
}
.top-results__link{
	color: var(--theme-link-color);
}
.SearchResults-module_results__p4ucz.wds-list.wds-is-linked>li>a{
		color: var(--theme-link-color);
}
	
/* text subs cause why not...  */
.community-page-help-module .community-page-policy-link{
	 visibility: hidden;
    position: relative;
}
.theme-fandomdesktop-dark .community-page-help-module .community-page-policy-link{
		 visibility: hidden;
    position: relative;
}
.community-page-help-module .community-page-policy-link:after{
    visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Rules of Robloxiapedia";
}
.theme-fandomdesktop-dark .community-page-help-module .community-page-policy-link:after{
    visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Rules of Robloxiapedia";
}
.wds-dialog__title{
			 visibility: hidden;
    position: relative;
}
.theme-fandomdesktop-dark .wds-dialog__title{
			 visibility: hidden;
    position: relative;
}
.ve-ui-summaryPanel-copyrightWarningFooter{
				 visibility: hidden;
    position: relative;
}
/* let the user know that their edit must follow the rules. previous message
was jargon. also let everyone know our wiki is still cc-by-sa*/
.ve-ui-summaryPanel-copyrightWarningFooter:after{
 	    visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "By saving your edit, you agree that your edit follows the Robloxiapedia rules. All edits are CC-BY-SA";
}


.SearchResults-module_results__k8itn.wds-list.wds-is-linked>li>a.SearchResults-module_seeAllResults__TFicN{
		visibility: hidden;
	position: relative;
}
.SearchResults-module_results__k8itn.wds-list.wds-is-linked>li>a.SearchResults-module_seeAllResults__TFicN:after{
	 visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Show all results";
}
.top-results__header--bold{
			visibility: hidden;
	position: relative;
}
.top-results__header--bold:after{
		 visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Trending searches";
}
.community-page-cards-module .community-page-card-module .community-page-card-module-description{
					visibility: hidden;
	position: relative;
}
/* drastic simplification of the previous notice */
.community-page-cards-module .community-page-card-module .community-page-card-module-description:after{
		 visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Share your idea to Robloxiapedia.";
}
.community-page-module .community-page-module-additional-text{
						visibility: hidden;
	position: relative;
}
/* notifying users that we are the only legit staff out there*/
.community-page-module .community-page-module-additional-text:after{
		 visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Ask us anything. We’d love to hear what brought you to Robloxiapedia. "
}



.article-content .all-maps__description, .page-content .all-maps__description{
									visibility: hidden;
	position: relative;
}
/* description of the maps */
.article-content .all-maps__description, .page-content .all-maps__description:after{
		 visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Browse custom interactive maps inspired by a world featured in Robloxiapedia. Explore and visualize locations, items, and more!"
}
.sitenotice__title{
										visibility: hidden;
	position: relative;
}
/* just in we have to do this */
.sitenotice__title:after{
		 visibility: visible;
    position: absolute;
    top: 0;
    left: 0;
    content: "Notice:"
}
/* makes it a valid sentence, don't you think? */
.recent-wiki-activity__timeago:before {
    content: "edited";
    margin: 0 3px;
}


body {
  margin:0;
}
.id-card-wrapper {
  height: 100vh;
  width:100%;
  background-color: #091214;
  display: flex;
}
.id-card {
  flex-basis: 100%;
  max-width: 30em;
  border: 1px solid rgb(97, 245, 245);
  margin: auto;
  color: #fff;
  padding: 1em;
  background-color: #0A2129;
  box-shadow: 0 0 3px 1px #12a0a0, inset 0 0 3px 1px #12a0a0;
}

.profile-row {
  display: flex;
}
.profile-row .dp {
  flex-basis: 33.3%;
  position: relative;
  margin: 24px;
  align-self: center;
}
.profile-row .desc {
  flex-basis: 66.6%;
}

.profile-row .dp img {
  max-width: 100%;
  border-radius: 50%;
  display: block;
  box-shadow: 0 0 4px 3px #12a0a0;
}
.profile-row .desc {
  padding: 1em;
}

.profile-row .dp .dp-arc-inner {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 6px solid transparent;
  border-top-color: #0AE0DF;
  border-radius: 50%;
  top: -6px;
  left: -6px;

  animation-duration: 2s;
  animation-name: rotate-clock;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes rotate-clock {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.profile-row .dp .dp-arc-outer {
  position: absolute;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  border: 6px solid transparent;
  border-bottom-color: #0AE0DF;
  border-radius: 50%;
  top: -16px;
  left: -16px;

  animation-duration: 2s;
  animation-name: rotate-anticlock;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes rotate-anticlock {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(-360deg);
  }
}

.profile-row .desc {
  font-family: "Builder Sans";
  color: #ecfcfb;
  text-shadow: 0 0 4px #12a0a0;
  letter-spacing: 1px;
}
.profile-row .desc {
  margin: 0;
}

/* make the empty comment sections truly empty */
.CommentList_empty-state-title__Prw1V{
	display:none;
}
.CommentList_empty-state-message__vSE-S{
	display:none;
}
/* make the empty message walls truly empty */
#MessageWall .MessageWallForum__empty-state-title{
	display:none;
}
#MessageWall .MessageWallForum__empty-state-message{
	display:none;
}
.notSafeForBlur{
	filter: blur(1rem);
}
.wds-widget-frame__header .wds-widget-frame__logo{ /* what is this logo*/
	display:none;
}

.inactive-user {
text-transform: uppercase;
}


/* grant me immunity to being blocked/demoted by any user on robloxiapedia, even by accident */
a[href$="/wiki/Special:Block/ChikoritaTheRobloxian"]{
	display:none;
}
a[href$="/wiki/Special:UserRights/ChikoritaTheRobloxian"]{
		display:none;
}
a[href$="//createnewwiki.fandom.com/Special:CreateNewWiki"]{ /* i do not like the new fandom ui */
	display:none;
}
.global-explore-navigation__top{ /* #CHANGEITBACK */
	display:none;
}
.global-action-notifications .notifications__counter{
	background:rgb(255,59,48);
}
.wds-modal__modal, .wds-modal__overlay {
    animation: fade-in-modal 0s ease-in-out; /* make it faster */
}




/* EXPERIMENTAL: Align main text to the left */
.mw-parser-output {
    text-align: left;
}
/* Keep templates centered */
.center-template, .template, .infobox{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
/* If template specify for centered text */
.center-template .infobox,
.center-template .wikitable{
    text-align: center !important; /* !important ensures override */
    margin-left: auto;
    margin-right: auto;
}

/* Ensure italics and subscript in infoboxes, navboxes and other containers align left */
table i,
.infobox i,
.navbox i{
    display: inline;
    text-align: left;
}
/* Ensure italics and subscript in tables, infoboxes, navboxes and other containers align left */
table i,
.infobox i,
.navbox i{
    display: inline;
    text-align: left !important;

}
/* EXPERIMENTAL FIX: Move comment section below article content */
#WikiaArticle, #WikiaRail, #WikiaPage {
    display: flex;
    flex-direction: column; /* Stack content vertically */
}

/* Target the comment section */
.WDSCommentSection {
    order: 999; /* Push section to the bottom of the container */
    margin-top: 20px;
}

/* Adjust spacing and general layout if needed */
#WikiaArticle {
    margin-bottom: 40px; 
}
/* Example: Changing the order of flex items if the comment section is inside a flex container */
main {
  display: flex;
  flex-direction: column;
}

.comment-section {
  order: -1; /* Moves the comment section above other siblings */
}

/* Warning: Replace .comment-section with the actual current selector */