User:Sneakers-the-rat/common.css

Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

/* Remove this top-level DISABLED tag to use */

@media DISABLED{

:root {
  --text-color: #ff3fbd;
  --bg-color: #111;
  --bg-color-table: #000;
  --header-color: #BFECFF;
  --accent-color: #fff200;
}

body {
  color: #ff3fbd !important;
  background-color: var(--bg-color-table) !important;
  font-family: "Comic Sans", "Comic Sans MS", sans-serif;
}

.mw-page-container {
  background-color: var(--bg-color) !important;
}

.mw-sidebar, 
#vector-main-menu,
.wikitable, 
.sidebar-toc, 
.smw-factbox, 
.smw-factbox-view.skin-vector #mw-data-after-content .smw-factbox,
.smw-factbox .smwfact,
.smwfact,
.catlinks {
  background-color: var(--bg-color-table) !important;
  border: 5px dotted var(--text-color) !important;
  color: var(--text-color) !important;
}

.smwfact .smw-table-row:nth-child(2n+1) {
  background-color: var(--bg-color-table) !important;
}

.smwfact .smw-table-row:nth-child(2n) {
  background-color: var(--bg-color) !important;
}

.wikitable > tr > th, .wikitable > * > tr > th {
  background-color: var(--bg-color-table) !important;
  color: var(--text-color) !important;
}

.sidebar-toc .sidebar-toc-list-item-active > .sidebar-toc-link {
  color: var(--text-color) !important;
  font-weight: bold !important;
}

#vector-main-menu li>a {
	color: var(--accent-color) !important;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--header-color) !important;
  font-family: Papyrus, Helvetica, sans-serif !important;
}

.mw-body-content h2 {
  font-size: 3em !important;
}

/*
---------------- 
~Aminations~
----------------
*/

@media (prefers-reduced-motion: no-preference){
	a {
	  transition: transform 1s ease-in;
	  display: inline-block;
	  position: relative;
	}
	
	a:hover {
	  transform: rotate(360deg);
	  transition: transform 1s ease-in;
	}
	
	.banner p {
	  display: flex;
	  flex-direction: row;
	  justify-content: space-between;
	  width: 100%;
	}
}



/*
---------------- 
MARQUEE
----------------
*/

@media (prefers-reduced-motion: no-preference){
	.marquee {
	    height: 3em;
	    overflow: hidden;
	    position: relative;
	    padding: 1em;
	    border: 1px solid var(--accent-color);
	}
	
	.marquee p {
	    display: inline-block;
	    width: max-content;
	    margin: 0;
	    font-size: 2em;
	    font-weight: bold;
	
	    padding-left: 100%;
	    /* show the marquee just outside the paragraph */
	    will-change: transform;
	    animation: scroll-left 10s ease-in-out infinite;
	}
	
	.marquee p:hover {
	  animation-play-state: paused;
	  font-size: 6em;
	  transition: font-size 1s ease-out;
	}
	
	.marquee p:hover::after {
	  content: "DOWNLOAD OR BE DOWNLOADED";
	  position: absolute;
	  left: 50%;
	  top: 24px;
	  min-width: 200px;
	  border: 1px #aaaaaa solid;
	  border-radius: 10px;
	  background-color: #ffffcc;
	  padding: 12px;
	  color: #000000;
	  font-size: 14px;
	  z-index: 1;
	}
	
	.marquee:hover {
	  overflow: visible;
	}
	
}

} /* DISABLED media query ends here */
	
@keyframes scroll-left {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-100%);
    }
}