MediaWiki:Wikia.css

@import url('https://fonts.googleapis.com/css?family=Indie+Flower|Niconne|Raleway|Chiller|Audiowide|Handlee|Architects+Daughter|Bubblegum+Sans|Quicksand|Patrick+Hand|Comfortaa|Nanum+Pen+Script|Another+Scream|Open+Sans|Cursive|Shadows+into+Light|Gill+sans|Pacifico');

.sunnytheme { background: linear-gradient(to right, rgba(000, 000, 000, 0.3), rgba(000, 000, 000, 0.3)), url("https://www.freevector.com/blue-sparkles-vector") center / cover no-repeat fixed !important; }

div.sunnytheme { width: 250px; box-shadow: 0 4px 8px 0 rgba(173, 216, 230, 0.2), 0 6px 20px 0 rgba(173, 216, 230, 0.19); } a[href$=":Sunnyshine666"], a[href$="/Sunnyshine666"] { color: #58D3F7! important; font-family:"Comic Sans MS"; } /*Popular pages thing*/ section#recirculation-rail { background: linear-gradient(to bottom right, magenta, cyan); border-radius: 20px; border: 3px solid white; box-shadow: 0px 0px 0px pink; animation: RainbowModules 2s infinite! important; }/**/ .scale-up-center { -webkit-animation: scale-up-center 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) infinite alternate forwards; animation: scale-up-center 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) infinite alternate forwards; } @-webkit-keyframes scale-up-center { 0% {   -webkit-transform: scale(0.5); transform: scale(0.5); } 100% {    -webkit-transform: scale(1); transform: scale(1); } } @keyframes scale-up-center { 0% {   -webkit-transform: scale(0.5); transform: scale(0.5); } 100% {    -webkit-transform: scale(1); transform: scale(1); } } /* head color*/ section#Wikia-recent-activity h2 { color: #ffffff; text-shadow: 0 0 8px white; } /*rainbow CSS animation for activity*/ @keyframes RainbowModules{ 0% {		color: violet; }	14.3% {		color: blue; }	28% {		color: orange }	42.9% {		color: red; }	57.1% {		color: green; }	71.4% {		color: yellow; }	85.7% {		color: teal; }	100% {		color: red; } } /**/ /*Activity*/ section#wikia-recent-activity { border-radius: 20px; border: 3px solid white; animation: RainbowModules 2s infinite! important; background: linear-gradient(	to bottom, magenta, cyan)! important; box-shadow: 0 0 10px cyan;

}/**/ /* Pink and Blue animation for serenity */ @keyframes PinkBlue{ 0% {		color: blue; }	10% {		color: pink; }	30.4% {		color: cyan; }	40% {		color: violet; }	50% {		color: teal; }	60% {		color: magenta; }	70% {		color: skyblue; }	100% {		color: pink; }

} @keyframes PinkBlue{ from { -webkit-filter:hue-rotate(15deg); filter:hue-rotate(15deg); } to { -webkit-filter:hue-rotate(360deg); filter:hue-rotate(360deg); } } .scale-up-bl { -webkit-animation: scale-up-bl 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) infinite alternate both; animation: scale-up-bl 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) infinite alternate both; } @-webkit-keyframes scale-up-bl { 0% {   -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } 100% {    -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } } @keyframes scale-up-bl { 0% {   -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } 100% {    -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } } .scale-up-ver-top { -webkit-animation: scale-up-ver-top 0.4s ease-in infinite alternate-reverse forwards; animation: scale-up-ver-top 0.4s ease-in infinite alternate-reverse forwards; } @-webkit-keyframes scale-up-ver-top { 0% {   -webkit-transform: scaleY(0.4); transform: scaleY(0.4); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } 100% {    -webkit-transform: scaleY(1); transform: scaleY(1); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } } @keyframes scale-up-ver-top { 0% {   -webkit-transform: scaleY(0.4); transform: scaleY(0.4); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } 100% {    -webkit-transform: scaleY(1); transform: scaleY(1); -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } } /* Scale UP*/ .rotate-scale-up { animation: rotate-scale-up 0.65s linear infinite both; } @keyframes rotate-scale-up { 0% {   transform: scale(1) rotateZ(0); } 50% {    transform: scale(2) rotateZ(180deg); } 100% {    transform: scale(1) rotateZ(360deg); } }

.color-change-2x { -webkit-animation: color-change-2x 2s linear infinite alternate both; animation: color-change-2x 2s linear infinite alternate both; } @-webkit-keyframes color-change-2x { 0% {   background: cyan; } 100% {    background: blue; } } @keyframes color-change-2x { 0% {   background: cyan; } 100% {    background: blue; } } /* animation? i guess? */ @keyframes rainbow{ 0%{color:blue;} 50%{color:darkmagenta;} 100%{color:navy;} } .rainbow{ animation: rainbow 2s infinite; } body { cursor: url(https://static.wikia.nocookie.net/signature/images/4/4c/Cursor.png/revision/latest?cb=20210122054446), auto !important; } .firefly-hover { animation: firefly-hover 3s linear 0s infinite; position:relative; top:-5px; left:0px; } @keyframes firefly-hover { 0% {top:-5px;left:0px} 25% {top:-6px;left:1px} 50% {top:-4px;left:0px} 75% {top:-6px;left:-1px} 100% {top:-5px;left:0px} } @-webkit-keyframes wobble { 0%, 100% {    -webkit-transform: translateX(0%); transform: translateX(0%); -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } 15% {    -webkit-transform: translateX(-30px) rotate(-6deg); transform: translateX(-30px) rotate(-6deg); } 30% {    -webkit-transform: translateX(15px) rotate(6deg); transform: translateX(15px) rotate(6deg); } 45% {    -webkit-transform: translateX(-15px) rotate(-3.6deg); transform: translateX(-15px) rotate(-3.6deg); } 60% {    -webkit-transform: translateX(9px) rotate(2.4deg); transform: translateX(9px) rotate(2.4deg); } 75% {    -webkit-transform: translateX(-6px) rotate(-1.2deg); transform: translateX(-6px) rotate(-1.2deg); } } @keyframes wobble { 0%, 100% {    -webkit-transform: translateX(0%); transform: translateX(0%); -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } 15% {    -webkit-transform: translateX(-30px) rotate(-6deg); transform: translateX(-30px) rotate(-6deg); } 30% {    -webkit-transform: translateX(15px) rotate(6deg); transform: translateX(15px) rotate(6deg); } 45% {    -webkit-transform: translateX(-15px) rotate(-3.6deg); transform: translateX(-15px) rotate(-3.6deg); } 60% {    -webkit-transform: translateX(9px) rotate(2.4deg); transform: translateX(9px) rotate(2.4deg); } 75% {    -webkit-transform: translateX(-6px) rotate(-1.2deg); transform: translateX(-6px) rotate(-1.2deg); } } .wobble { -webkit-animation: wobble-hor-bottom 2s cubic-bezier(0.550, 0.055, 0.675, 0.190) infinite both; animation: wobble-hor-bottom 2s cubic-bezier(0.550, 0.055, 0.675, 0.190) infinite both; } @-webkit-keyframes vibrate-1 { 0% {   -webkit-transform: translate(0); transform: translate(0); } 20% {    -webkit-transform: translate(-2px, 2px); transform: translate(-2px, 2px); } 40% {    -webkit-transform: translate(-2px, -2px); transform: translate(-2px, -2px); } 60% {    -webkit-transform: translate(2px, 2px); transform: translate(2px, 2px); } 80% {    -webkit-transform: translate(2px, -2px); transform: translate(2px, -2px); } 100% {    -webkit-transform: translate(0); transform: translate(0); } } @keyframes vibrate-1 { 0% {   -webkit-transform: translate(0); transform: translate(0); } 20% {    -webkit-transform: translate(-2px, 2px); transform: translate(-2px, 2px); } 40% {    -webkit-transform: translate(-2px, -2px); transform: translate(-2px, -2px); } 60% {    -webkit-transform: translate(2px, 2px); transform: translate(2px, 2px); } 80% {    -webkit-transform: translate(2px, -2px); transform: translate(2px, -2px); } 100% {    -webkit-transform: translate(0); transform: translate(0); } } .vibrate-1 { -webkit-animation: vibrate-1 1s linear infinite both; animation: vibrate-1 1s linear infinite both; }