MediaWiki:Common.css

/* General */ @import url(https://fonts.googleapis.com/css?family=Denk+One); @import url(https://fonts.googleapis.com/css?family=Titillium+Web); @import url('https://fonts.googleapis.com/css?family=Poppins'); @font-face { font-family:'Troika'; src:url(https://starcade.gamepedia.com/media/hydra/fonts/troika.otf) format('woff'); src: url('https://starcade.gamepedia.com/media/hydra/fonts/troika.eot'), src: url('https://starcade.gamepedia.com/media/hydra/fonts/troika.eot?iefix') format('eot'), url('https://starcade.gamepedia.com/media/hydra/fonts/troika.woff') format('woff'), url('https://starcade.gamepedia.com/media/hydra/fonts/troika.ttf') format('truetype'), url("https://starcade.gamepedia.com/media/hydra/fonts/troika.svg#webfont") format("svg"); }

html{ font-size: 0.8em; }

html, body, #mw-head, #content { border: none; }

body { background-image: url(https://static.wikia.nocookie.net/starcade_gamepedia_en/images/0/09/Wiki-bg.png/revision/latest)!important; background: #1E3A3E; background-repeat: no-repeat!important; background-size: 100%!important; background-attachment: fixed; background-position-y: bottom!important; margin: 0; padding: 0; height: 100%; overflow-x: hidden; overflow-y: auto; }

width: 5px; background: #1c1e1e; }
 * 1) wpTextbox1::-webkit-scrollbar {

background: #39cec5; }
 * 1) wpTextbox1::-webkit-scrollbar-thumb {

body, html { scrollbar-width: none; }   scrollbar-color: #39cec5 #1c1e1e; }
 * 1) wpTextbox1, #content, #mw-panel, body, html {

scrollbar-width: thin; }
 * 1) wpTextbox1, #content, #mw-panel {

body::-webkit-scrollbar { width: 0px; background: #1c1e1e; }

body::-webkit-scrollbar-thumb { background: #39cec5; }

width: 5px; background: #1c1e1e; }
 * 1) content::-webkit-scrollbar {

background: #39cec5; }
 * 1) content::-webkit-scrollbar-thumb {

width: 3px; background: #1c1e1e; }
 * 1) mw-panel::-webkit-scrollbar {

background: #39cec5; }
 * 1) mw-panel::-webkit-scrollbar-thumb {

overflow: visible; }

outline: none!important; }

/* End of General */ /* Sidebar */ background: rgba(0,0,0,0.75)!important; }
 * 1) global-wrapper {

margin-top: 0; overflow-y: scroll; overflow-x: hidden; top: 80px!important; position: sticky; font-size: 1vw!important; padding-top: 0!important; padding: 0 0 2.1em 8px;
 * 1) mw-panel {

}

background: rgba(0, 0, 0, 0.75); width: 23%!important; left: 0em; }
 * 1) mw-panel, #p-logo {

.portal > h3 > a { font-size: 1vw!important; line-height: 2!important; }

color: #4d4d4d; text-decoration: none; font-size: 1vw!important; }
 * 1) mw-panel.collapsible-nav .portal h3 a {

.body > ul > li { font-size: 1vw!important; }

.portal > h3 { margin-bottom: 0.5vw!important; }

background: #12363f!important; width: 85%; margin-top: -2px; height: 81px; }
 * 1) mw-head {

display: none; }
 * 1) mw-page-base,
 * 2) mw-head-base {

height: 81px; width: 81px; background-size: 100% 100%; margin: 0 auto; }
 * 1) p-logo a {

position: fixed; padding-left: 8px; height: 81px; width: 81px; top: 28px !important; background: #12363f; transition: 0.5s; display:block; z-index: 2; }
 * 1) p-logo {

position: absolute; margin-left: 5px; -webkit-transition: 1s all ease; transition: 1s all ease; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; }
 * 1) p-logo:hover > .navlogo > .navlogo1 {

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; margin-left: 5px; }
 * 1) p-logo:hover > .navlogo > .navlogo2 {

transform: rotate(-360deg); }
 * 1) p-logo:hover > .navlogo > .navlogo1 {

transform: rotate(-540deg); }
 * 1) p-logo:hover > .navlogo > .navlogo2 {

.navlogo1 { position: absolute; -webkit-transition: 1s all ease; transition: 1s all ease; top: 50%; margin-left: 1%; height: 32%; }

.navlogo2 { position: absolute; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; -webkit-transition: 1s all ease; transition: 1s all ease; top: 50%; margin-left: 1%; height: 32%; }

.navlogotext { position: absolute; height: 28px; margin-left: 50px; cursor: pointer; top: 55%; width: 70%; }

margin-top: 60px; }
 * 1) mw-panel #p-logo + div.portal {

text-decoration: none; }
 * 1) mw-panel.collapsible-nav .portal.collapsed h3:hover {

.portal > h3 > a { color: white!important; }

.portal > h3 { display: block; margin: 2px 4px 2px -12px!important; padding: 8px 16px 0px 16px!important; background-color: rgba(22, 68, 79, 0.5); border-radius: 2px; font-family: 'Troika', sans-serif; font-size: 1.4vw!important; letter-spacing: 1.5px; line-height: 1.5; text-transform: uppercase; }

.portal > div a { display: block; margin: 0px; padding: 0px; text-decoration: none; color: #35ffea!important; font-family: 'Open Sans', sans-serif; font-size: 1.1vw; line-height: 1.7; font-weight: 600; text-transform: uppercase; z-index }

.portal > div a:after{ display:block; content: ''; border-bottom: solid 3px #39cec5; margin-top: 7px; transform: scaleX(0); -webkit-transition: 200ms all; transition: 200ms all; z-index: 1; }

.vectorMenu:hover div.menu { display: block; height: 0px; }

.vectorMenu:hover .menu img { height: 0px; }

margin-left: 0px; }
 * 1) p-cactions .menu {

.menu { border: none!important; margin-top: 25px; background: #0a4e5c!important; }

.menu > ul { background: #0a4e5c!important; }

display: block; border: none!important; margin-left: -140px; }
 * 1) p-sharing .menu {

display: inline-flex; }
 * 1) socialIconImages {

width: 64px!important; }
 * 1) socialIconImages img {

.vectorMenu .menu img { height: 0; transition: 0.3s; }

.vectorMenu .menu, #socialIconImages { height: 0; border: none; transition: 0.3s; transition-delay: 0.3s; }

display: block; height: 95px; border: 5px solid #0a4e5c!important; border-bottom: 10px solid #0a4e5c!important; padding: 5px; }
 * 1) p-cactions:hover .menu {

height: 95px; }
 * 1) p-cactions:hover .menu img {

display: block; height: 50px; border: 5px solid #0a4e5c!important; border-bottom: 10px solid #0a4e5c!important; padding: 5px; }
 * 1) p-sharing:hover .menu {

height: 50px; }
 * 1) p-sharing:hover .menu img {

display: block; height: 50px; border: 5px solid #0a4e5c!important; padding: 10px; }
 * 1) p-cactions .vectorMenuCheckbox:checked ~ .menu {

height: 50px; }
 * 1) p-cactions .vectorMenuCheckbox:checked ~ .menu img {

display: block; height: 50px; border: 5px solid #0a4e5c!important; padding: 10px; }
 * 1) p-sharing .vectorMenuCheckbox:checked ~ .menu {

height: 50px; }
 * 1) p-sharing .vectorMenuCheckbox:checked ~ .menu img {

.menu a { color: #ffffff!important; font-family: troika; }

.portal > div a:hover{ color: #ffffff!important; }

.portal > div a:hover:after{ transform: scaleX(1); }

.skin-hydradark #mw-panel.collapsible-nav .portal h3, .skin-hydradark #mw-panel.collapsible-nav .portal.collapsed h3 { background-image: none; line-height: 2!important; }

.skin-hydradark #mw-panel.collapsible-nav .portal h3:after { content: '-'; color: white; float: right; }

.skin-hydradark #mw-panel.collapsible-nav .portal.collapsed h3:after { content: '+'; color: white; float: right; }

/* End of Sidebar */ /* Topbar */

width: auto; line-height: calc( 91px - 1em ); padding: 0 25px 0 0.615em; }
 * 1) p-sharing span,
 * 2) p-cactions span {

overflow: visible; height: 65px; height: calc( 81px - 1em ); }
 * 1) mw-head .vectorMenu h3 {

div.vectorMenu h3 span:after { background-image: url(https://gamepedia.cursecdn.com/starcade_gamepedia_en/d/d7/Starcade_Arrow.svg?version=5cf57582b6aa136c2999612f9011c6ad); background-size: 25%; filter: invert(0%); top: 25px; bottom: 25px; }

.vectorTabs, #mw-head .vectorMenu h3, .vectorTabs span, .vectorTabs ul li, .vectorTabs ul { background: transparent!important; border: none; }

margin-left: 15ch; }
 * 1) left-navigation {

margin-top: 1em; margin-bottom: 1.5em; }
 * 1) left-navigation, #right-navigation {

.vectorTabs { height: 65px; height: calc( 81px - 1em ); }

.vectorTabs > ul > li > span > a:hover { color: #35ffea!important; text-decoration: none; }

.vectorTabs > ul > li > span > a { color: white!important; font-size: 1.15vw; font-family: 'Troika', sans-serif!important; letter-spacing: 1.5px; padding-top: 0; line-height: 65px; line-height: calc( 91px - 1em ); }

.vectorTabs > ul > li > span > a { color: white!important; font-size: 1.15vw; font-family: 'Troika', sans-serif!important; letter-spacing: 1.5px; }

.vectorTabs > ul > li#ca-watch.icon > span > a, .vectorTabs > ul > li#ca-unwatch.icon > span > a { color: transparent !important; padding-top: 65px; padding-top: calc( 81px - 1em ); }

color: white!important; font-size: 1.15vw; font-family: 'Troika',sans-serif!important; letter-spacing: 1.5px; }
 * 1) p-sharing > #p-sharing-label > span,
 * 2) p-cactions > #p-cactions-label > span {

div.vectorMenu .vectorMenuCheckbox:checked + h3 span:after { background-size: auto 115%; position: absolute; -webkit-animation: rotate-scale-up 0.3s linear both; animation: rotate-scale-up 0.3s linear both; }

div.vectorMenu .vectorMenuCheckbox + h3 span:after { -webkit-animation: rotate-scale-down 0.3s linear both; animation: rotate-scale-down 0.3s linear both; background-size: auto 100%; position: absolute;; }

div.vectorMenu .menu { top: 65px; top: calc( 81px - 1em ); }

.vectorTabs > ul > li.selected > span > a { color: #39cec5!important; }

.vectorTabs > ul > li.selected > span > a:hover { color: #ffffff!important; }

.vectorTabs > ul > li.selected > span > a:after { display:block; content: ''; border-bottom: solid 3px #39cec5; margin-top: 7px; transform: scaleX(0); -webkit-transition: 200ms all; transition: 200ms all; z-index: 1; }

.vectorTabs > ul > li.selected > span > a:hover:after { transform: scaleX(1); }

margin-top: 20px; }
 * 1) p-search {

position: relative; outline: none; border: none; background-color: #26545f!important; padding: 5px!important; font-family: 'Open Sans', sans-serif; font-size: 0.92vw!important; font-weight: bold; line-height: 1; color: white!important; border-radius: 0px; width: 83%!important; height: 25px!important; margin-left: 10px!important; color: white!important; bottom: 5px; }
 * 1) searchInput {

.suggestions { right: 6px!important; margin-top: -20px; top: 90px!important; }

.suggestions-result, .suggestions-results, .suggestions-special { background-color: #2a616f!important; border-color: #2a616f!important; }

.suggestions-result .highlight { color: white!important; font-weight: normal; }

color: white!important; }
 * 1) searchInput::placeholder {

background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/b/bc/Download_%281%29.svg")!important; background-size: 40px 30px; background-position-y: -5px!important; width: 40px!important; margin-top: -3px!important; margin-right: 5px!important; }
 * 1) searchButton {

outline: none; }
 * 1) searchButton:focus {

border: none!important; background: none!important; padding-right: 0px; height: 100%; }
 * 1) simpleSearch {

/* End of Topbar */ /* Content */

.sectionGifWrapper > pre { all: unset; }

.sectionTitleWrapper { border-bottom: 3px solid #39cec5!important; margin-top: 1em; font-size: 2vw; } .weblogo { display: none; }

.FAQWrapper { background: #0C2429; padding: 8px; margin-bottom: 16px; }

.FAQuestion { font-size: 17.5px; font-family: troika; }

.FAAnswer { font-family: Titillium Web; font-size: 0; padding-top: 3px; transition: 0.3s height, 1s opacity; opacity: 0; height: 0; }

.FAQWrapper:hover > .FAAnswer { border-top: 3px solid #39CEC5; height: 50px; opacity: 1; font-size: 12px; }

overflow-y: auto; overflow-x: hidden; }
 * 1) wpTextbox1 {

.homePage { margin-top: 37px; }

visibility: hidden; }
 * 1) contentSub {

html body.mediawiki #global-wrapper { margin-bottom: 0!important; }

.overlay > p { margin: -3.5px; }

.mw-body, #footer { width: 70.5%; float: right; padding-right: 2%; }

padding-left: 100%; background: rgba(0,0,0,0.90); }
 * 1) footer {

background: transparent!important; overflow-y: auto; padding-left: 3.3%; position: absolute; top: 80px!important; float: right; z-index: 1; right: 0; padding: 1em 1.1% 1.1em 1.1%; margin: 0; overflow-x: hidden; }
 * 1) content {

height: 33.281249em; }
 * 1) mw-content {

.infoSection { position: relative; display: flex; flex-direction: row; margin: -35px 0 20px 0; width: 100%; height: 18.4vw; }

.latestnews { background: #13171B; height: 77.5%; width: 30%; }

.newscontainer { overflow: hidden; margin-top: 2.5%; height: 75%; font-family: "Poppins"; }

.newscontainer .desc { font-size: 1vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 0.25vw; font-family: "Poppins"; }

.newscontainer span { float: right; margin-top: -1.45vw; font-size: 1vw; font-family: "Poppins"; font-weight: bold; color: #2e7384; }

.newscontainer .desc:nth-child(1) { width: 65%; }

.newscontainer .desc:nth-child(3) { width: 60%; }

.newscontainer .desc:nth-child(5) { width: 65%; }

.newscontainer .desc:nth-child(7) { width: 55%; }

.newscontainer .desc:nth-child(9) { width: 65%; }

.newscontainer .desc:nth-child(11) { width: 50%; }

.newscontainer .desc:nth-child(13) { width: 60%; }

.community { background: #13171B; height: 77.5%; width: 41%; }

.communitycontainer { display: inline-block; }

.communitycontainerbuttons { padding-bottom: 1.15vw; border-bottom: 3px solid #16444f; text-align: center; }

.communitybuttons:hover { background: #2e7384; transition: 0.3s; cursor: pointer; }

.communitybuttons { background: #16444f; height: 2.5vw; width: 8.7vw; display: inline-flex; margin: 1vw 1vw -0.25vw 1vw; color: #39cec5; font-family: 'Troika',sans-serif; justify-content: center; align-items: center; font-size: 1vw; }

.communityicons { margin-top: 1vw; text-align: center; }

.communityicons img { height: 2.5vw; width: 2.5vw; margin: -0.25vw 0.5VW; cursor: pointer; }

.communityicons img:hover { filter: hue-rotate(170deg); transition: 1s; -webkit-animation: flip-diagonal-2-fwd 0.8s cubic-bezier(0.455,0.030,0.515,0.955) both; animation: flip-diagonal-2-fwd 0.8s cubic-bezier(0.455,0.030,0.515,0.955) both; cursor: pointer; }

.trailerbanner { background: #13171B; height: 58.803%; width: 30%; }

.trailerbanner img { height: 10.469vw; width: 18.668vw; }

.info { margin: 2.5% 1%; padding: 10px; }

.info:last-child { padding: 10px 10px 5.5% 10px; }

.infoheader { height: 10%; width: 100%; padding-bottom: 5%; border-bottom: 3px solid #39cec5; }

.infotitle { font-family: 'Troika', sans-serif; font-size: 1.5vw; }

.infoarchive { float: right; font-family: 'Titillium Web', sans-serif; margin-top: -1.9vw; font-size: 1vw; font-family: "Poppins"; }

.infoarchive > a { color: #39cec5; text-decoration: none; }

.info { margin: 2.5% 1%; }

.tbbuttons { margin-top: 5%; }

.sectionButton { position: relative; display: inline-block; font-family: "Troika",sans-serif; width: 35.2%; margin: 0; padding: 0.6vw 7.5px; border-radius: 4px; text-align: center; text-transform: uppercase; transition: 0.3s; font-size: 120%; letter-spacing: 1.1px; line-height: 1.1; white-space: nowrap; cursor: pointer; overflow: hidden; z-index: 2; }

.feedback { float: right; }

.sectionButton:hover{ color: white; }

.sectionButton:after{ position: absolute; transition: 0.3s; content: ""; width: 0; bottom: -50%; background: #E64670; height: 200%; left: -10%; transform: skewX(15deg); z-index: -1; }

.sectionButton:hover:after{ left: -10%; width: 120%; }

.sectionButtonAccent { border: 0.2vw solid #E64670; color: #E64670; }

.sectionButtonSpecial { border: 0.2vw solid #2e7384; color: #2e7384; }

.sectionButtonCool { border: 0.2vw solid #39cec5; color: #39cec5; }

.sectionButtonAccent:after { background: #E64670; }

.sectionButtonSpecial:after { background: #2e7384; }

.sectionButtonCool:after { background: #39cec5; }

.games { margin: 0 auto; width: 100%; max-height: 100%; }

.featuredgames, .originalgames, .partnergames, .upcominggames, .newgames, .allgames { margin: 0; padding: 0 0 0 1.9%; }

.filterButtons { width: 100%; height: 75px; margin: 0 2.5%; }

.fbutton { width: 17.8%; max-height: 80%; border: 0.2vw solid #39CEC5; display: inline-block; margin: 1.4vw 0.3vw; border-radius: 3px; font-family: 'troika',sans-serif; font-size: 1.4vw; text-align: center; line-height: 150%; cursor: pointer; color: white; }

.fbutton:first-child { margin-left: 0; }

.fbutton:nth-child(3) { margin-right: 0; }

.activebutton { background: white; color: #3C7C8B; border: 3px solid white; }

.fbutton:hover { background: #39cec5; transition: 0.3s; }

.activebutton:hover { background: #fff; color: #e64670; transition: 0.5s; }

.gamesSectionHeader > .featDiv { width: 27.5%; margin-top: -40px; }

.gamesSectionHeader > .featDiv:nth-child(2) { float: right; }

.gamesSectionHeader { padding: 0 5%; }

.gameContainer { position: relative; display: inline-block; width: 12.4vw; height: 12.4vw; margin: 5px 1.5%; overflow: hidden; white-space: normal; transform: scale(1); transition: 1s; }

.pawp { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/f/f2/Pawp.png/180px-Pawp.png"); background-size: 12.4vw; }

.brutalMania { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/6/65/Brutal.png/180px-Brutal.png"); background-size: 12.4vw; }

.knuckol { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/a/ac/Knuckol.png/180px-Knuckol.png"); background-size: 12.4vw; }

.pockey { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/6/62/Pockey.png/180px-Pockey.png"); background-size: 12.4vw; }

.evoWars { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/3/39/Evowars.png/180px-Evowars.png"); background-size: 12.4vw; }

.blobbyFish { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/9/9b/Blobbyfish.png/180px-Blobbyfish.png"); background-size: 12.4vw; }

.devast { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/a/a9/Unknown_%289%29.png/180px-Unknown_%289%29.png"); background-size: 12.4vw; }

.limax { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/5/59/Unknown_%288%29.png/180px-Unknown_%288%29.png"); background-size: 12.4vw; }

.starve { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/6/6e/Unknown_%287%29.png/180px-Unknown_%287%29.png"); background-size: 12.4vw; }

.oib { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/f/f4/Unknown_%286%29.png/180px-Unknown_%286%29.png"); background-size: 12.4vw; }

.krunker { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/0/0f/Unknown_%283%29.png/180px-Unknown_%283%29.png"); background-size: 12.4vw; }

.driftin { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/f/f6/Unknown_%282%29.png/180px-Unknown_%282%29.png"); background-size: 12.4vw; }

.bloble { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/e/e0/Unknown_%281%29.png/180px-Unknown_%281%29.png"); background-size: 12.4vw; }

.moomoo { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/5/51/Unknown_%285%29.png/180px-Unknown_%285%29.png"); background-size: 12.4vw; }

.nend { background-image: url("https://gamepedia.cursecdn.com/starcade_gamepedia_en/thumb/8/87/Unknown_%284%29.png/180px-Unknown_%284%29.png"); background-size: 12.4vw; }

.overlay { position: absolute; left: 0; bottom: 0; width: 12vw; height: 1.3vw; padding: 0 5.5px; background-color: rgba(0, 0, 0, 0.75); -webkit-transition: height .5s ease; transition: height .5s ease; }

.overlay .gameTitle { position: relative; font-family: 'Troika',sans-serif; font-size: 1.32vw; letter-spacing: 1.1px; line-height: 2.2em; color: white; top: -4px; text-transform: uppercase; }

.gameContainer:hover .overlay { height: 11vw; }

.gameContainer:hover .overlayContent { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; }

.overlay #fav { fill: #2e7384; -webkit-transition: 200ms all; transition: 200ms all; }

.overlay #fav:hover { fill: #e64670; cursor: pointer; }

.overlay #heart { position: absolute; right: 0; top: -2px; }

.overlay .overlayContent { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; margin-top: -14px; -webkit-transition: opacity .5s ease; transition: opacity .5s ease; }

.overlayContent .divider { display: block; height: 3px; width: 100%; border: 0; border-top: 3px solid #2e7384; border-radius: 2px; margin: 0em 0 0.8em 0; padding: 0; }

.overlayContent .gameDescription { position: relative; margin: -8px 0 4px 0; font-weight: 480; font-family: 'Open Sans', sans-serif; font-size: 0.75vw; line-height: 1.25; }

.overlayContent .phonecon { position: relative; padding: 5px; }

.overlayContent .gameDeveloper { position: relative; float: right; font-family: 'Open Sans', sans-serif; font-size: 0.9vw; line-height: 1; font-weight: bold; text-transform: uppercase; margin-top: 3px; text-align: right; }

.overlayContent #dev { position: relative; color: #39cec5; text-decoration: none; }

.overlayContent #dev:after { content: url("https://paagoria.net/star/res/blank2.png"); }

.overlayContent #iconArrowRight { fill: #e64670; transform: scale(0.8); }

.overlayContent #devArrow { position: absolute; top: 13px; right: -9px; }

.overlayContent .playButton { width: 85%; position: absolute; bottom: 0.75vw!important; left: 0; visibility: hidden; }

.gameContainer:hover .overlayContent .playButton { bottom: 120px; visibility: visible; }

.sorted { transform: scale(1)!important; margin: 0 10px 24px 10px!important; }

.sectionWrapper { display: inline-flex; margin-top: 5%; width: 100%; }

.mw-headline { color: #fff; }

.mw-editsection span { display: none; }

.mw-editsection .mw-editsection-visualeditor { margin-left: 15px; }

.mw-editsection a { color: #fff; transition: 0.5s; text-decoration: none; border-bottom: none; float: right; }

.mw-editsection a:hover { border-bottom: 3px solid #39cec5; }

.sectionTextWrapper { width: 75%; background: rgba(0,0,0,0.5); padding: 0 25px; }

.sectionGifWrapper > p { line-height: inherit; margin: unset; }

.sectionGifWrapper { width: 25%; padding: 15px; background: rgba(0,0,0,0.5); margin-left: 5%; margin-top: 0; }

.sectionGifWrapper img { width: 100%; height: 100%; }

.sectionTitle, .sectionEditWrapper, .sectionEditing { display: inline-block; font-family: 'troika'; font-size: 1.64vw; }

.sectionEditing { float: right; }

.sectionEditing:first-child > a { padding-right: 0; }

.sectionTitleWrapper a { color: white!important; background: none!important; }

.pockeythumbnail { background-image: url("https://static.wikia.nocookie.net/starcade_gamepedia_en/images/4/49/Wiki-gamepockey-alt.png/revision/latest"); background-size: 100%; background-repeat: no-repeat; width: 321px; height: 123px; margin: 0 auto; }

.starcadethumbnail { background-image: url("https://static.wikia.nocookie.net/starcade_gamepedia_en/images/6/60/Sc_logotype-1.svg/revision/latest"); background-size: 100%; background-repeat: no-repeat; width: 321px; height: 123px; margin: 0 auto; }

.sectionTextWrapper h2 { border-bottom: 3px solid #39cec5!important; }

position: fixed!important; top: 0px!important; }
 * 1) netbar {

/* End of Content*/ /* Little Media */

@media only screen and (max-width: 1310px) { .infoSection .featDiv { border-radius: 2px; margin-top: -6px; }

.navlogotext { margin-left: 42px; }

#left-navigation { margin-left: 12vw; }

#right-navigation { margin-right: 0px; }

.infoSection { margin: 0 0 20px 0; }

}

@media only screen and (min-width: 700px) { #mw-panel, #p-logo { width: 25%!important; }

.mw-body, #footer { width: 69vw; }

}

@media only screen and (min-width: 800px) { #mw-panel, #p-logo { width: 25%!important; }

.mw-body, #footer { width: 69vw; }

}

@media only screen and (min-width: 900px) { #mw-panel, #p-logo { width: 27%!important; }

.mw-body, #footer { width: 69vw; }

}

@media only screen and (min-width: 1000px) { #mw-panel, #p-logo { width: 25%!important; }

.mw-body, #footer { width: 70vw; }

}

@media only screen and (min-width: 1100px) { #mw-panel, #p-logo { width: 22%!important; }

.mw-body, #footer { width: 71vw; }

}

@media only screen and (min-width: 1200px) { #mw-panel, #p-logo { width: 22%!important; }

.mw-body, #footer { width: 72vw; }

}

@media only screen and (min-width: 1300px) { #mw-panel, #p-logo { width: 21%!important; }

.mw-body, #footer { width: 73vw; }

}

@media only screen and (min-width: 1400px) { #mw-panel, #p-logo { width: 20%!important; }

.mw-body, #footer { width: 75vw; }

}

@media only screen and (min-width: 1500px) { #mw-panel, #p-logo { width: 19%!important; }

.mw-body, #footer { width: 76vw; }

}

@media only screen and (min-width: 1600px) { #mw-panel, #p-logo { width: 16%!important; }

.mw-body, #footer { width: 79vw; }

}

@media only screen and (min-width: 1700px) { #mw-panel, #p-logo { width: 17%!important; }

.mw-body, #footer { width: 78vw; }

}

@media only screen and (min-width: 1800px) { #mw-panel, #p-logo { width: 16%!important; }

.mw-body, #footer { width: 79vw; }

}

@media only screen and (min-width: 1900px) { #mw-panel, #p-logo { width: 15.5%!important; }

.mw-body, #footer { width: 80vw; }

}

@media only screen and (max-width: 1310px) { .featureSection { margin-top: 0; }

}

@media only screen and (max-width: 2599px) { .gameContainer { background-size: 13vw; width: 13vw; height: 13vw; }

.overlay { width: 13vw; height: 2vw; }

.gameContainer:hover .overlay { height: 10.4vw; }

.overlay > .gameTitle { font-size: 1.5vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.25vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 80%!important; height: 1.5vw; font-size: 1vw; line-height: 1.5; } }

@media only screen and (max-width: 2138px) { .gameContainer { background-size: 12.9vw; width: 12.9vw; height: 12.9vw; }

.overlay { width: 12.9vw; height: 2vw; }

.gameContainer:hover .overlay { height: 10.3vw; }

.overlay > .gameTitle { font-size: 1.5vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1.25; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.25vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 80%!important; height: 1.5vw; font-size: 1vw; line-height: 1.5; } }

@media only screen and (max-width: 1956px) { .gameContainer { background-size: 12.8vw; width: 12.8vw; height: 12.8vw; }

.overlay { width: 12.8vw; height: 2vw; }

.gameContainer:hover .overlay { height: 10.2vw; }

.overlay > .gameTitle { font-size: 1.5vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1.25; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.25vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 80%!important; height: 1.5vw; font-size: 1vw; line-height: 1.5; } }

@media only screen and (max-width: 1899px) { .gameContainer { background-size: 12.6vw; width: 12.6vw; height: 12.6vw; }

.overlay { width: 12.6vw; height: 2vw; }

.gameContainer:hover .overlay { height: 10.1vw; }

.overlay > .gameTitle { font-size: 1.5vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1.25; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.25vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 80%!important; height: 1.5vw; font-size: 1vw; line-height: 1.5; } }

@media only screen and (max-width: 1799px) { .gameContainer { background-size: 12.4vw; width: 12.4vw; height: 12.4vw; }

.overlay { width: 12.4vw; height: 2vw; }

.gameContainer:hover .overlay { height: 10vw; }

.overlay > .gameTitle { font-size: 1.4vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1.3; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.25vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 80%!important; height: 1.5vw; font-size: 1vw; line-height: 1.5; } }

@media only screen and (max-width: 1599px) { .gameContainer { background-size: 11.8vw; width: 11.8vw; height: 11.8vw; }

.overlay { width: 11.9vw; height: 2vw; }

.gameContainer:hover .overlay { height: 9.4vw; }

.overlay > .gameTitle { font-size: 1.4vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.25vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 72.5%!important; height: 1.2vw; font-size: 1vw; line-height: 1.5; } }

@media only screen and (max-width: 1499px) { .gameContainer { background-size: 11.5vw; width: 11.5vw; height: 11.5vw; }

.overlay { width: 11.5vw; height: 2vw; }

.gameContainer:hover .overlay { height: 9.4vw; }

.overlay > .gameTitle { font-size: 1.4vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.15vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 72.5%!important; height: 0.8vw; font-size: 1vw; line-height: 0.9; } }

@media only screen and (max-width: 1399px) { .gameContainer { background-size: 11.1vw; width: 11.1vw; height: 11.1vw; }

.overlay { width: 11.1vw; height: 2vw; }

.gameContainer:hover .overlay { height: 8.9vw; }

.overlay > .gameTitle { font-size: 1.4vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.2vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 72.5%!important; height: 0.5vw; font-size: 1vw; line-height: 0.5; } }

@media only screen and (max-width: 1321px) { .gameContainer { background-size: 11vw; width: 11vw; height: 11vw; }

.overlay { width: 11vw; height: 2vw; }

.gameContainer:hover .overlay { height: 8.8vw; }

.overlay > .gameTitle { font-size: 1.4vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.15vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 72.5%!important; height: 0.75vw; font-size: 1vw; line-height: 0.9; } }

@media only screen and (max-width: 1299px) { .gameContainer { background-size: 10.5vw; width: 10.5vw; height: 10.5vw; }

.overlay { width: 10.5vw; height: 2vw; }

.gameContainer:hover .overlay { height: 9.2vw; }

.overlay > .gameTitle { font-size: 1.4vw; }

.overlay .gameDescription { font-size: 0.75vw; line-height: 1; font-family: cursive; width: 95%; text-align: center; }

.sectionButtonCool { border: 0.2vw solid #39cec5; color: #39cec5; margin-left: 0.5vw; width: 72.5%!important; height: 0.5vw; font-size: 1vw; line-height: 0.5; } }

@media screen and (max-width: 720px) { div#mw-head { position: unset !important; margin-top: 0em; }

#mw-panel, #p-logo { width: 25%!important; } }

@media only screen and (min-width: 1400px) { .gamesSectionHeader { margin-bottom: 75px; padding: 0 3.5%; } }

@media only screen and (min-width: 1500px) { .gamesSectionHeader { margin-bottom: 75px; padding: 0 2.5%; } }

@media only screen and (min-width: 1600px) { .gamesSectionHeader { margin-bottom: 75px; padding: 0 0.5%; } }

@media only screen and (min-width: 1800px) { .gamesSectionHeader { margin-bottom: 75px; padding: 0 0; } }

@media only screen and (min-width: 1900px) { .gamesSectionList { margin-top: 50px; } }

@media screen and (max-width:720px){ div#p-sharing{ top:unset; }   div#mw-head{ position:absolute !important; margin-top:-2px; }   div#mw-navigation div#mw-panel{ display:block; position:absolute; table-layout:unset; width:25%!important; overflow-y: scroll; overflow-x: hidden; font-size:1vw!important; }   div#mw-navigation div#mw-panel .portal{ display:block; width:10em; }   div#mw-navigation div#mw-panel ul li{ list-style: none none; }   div#p-logo{ display: block; }   body #footer{ margin-left:10em; padding-top:0.75em; }   body #footer #footer-info-lastmod,body #footer #footer-info-viewcount{ display:block; }   div#p-personal{ display:none; position:unset; width:unset; top:unset; left:unset; right:unset; }   div#p-personal ul{ padding-left:100%; }   div#p-namespaces,div#p-views,div#p-variants{ position: unset; top: unset; }   div#p-namespaces{ padding-left: unset; }   div#p-cactions{ top: unset; float: unset; }   div#p-search{ float: left; position: unset; right: unset; width: unset; margin: unset; }   div#simpleSearch{ margin: unset; width: unset; padding: unset; }   div.vectorMenu div.menu{ left:-1px; right:unset; }   div#content{ border-left:none; margin-left:0px; } }

/* End of Little Media */ /* Animation */

@-webkit-keyframes flip-diagonal-2-fwd{ 0%{       -webkit-transform:translateZ(0) rotate3d(-1,1,0,0deg); transform:translateZ(0) rotate3d(-1,1,0,0deg) }   100%{        -webkit-transform:translateZ(160px) rotate3d(-1,1,0,180deg); transform:translateZ(160px) rotate3d(-1,1,0,180deg) } } @keyframes flip-diagonal-2-fwd{ 0%{       -webkit-transform:translateZ(0) rotate3d(-1,1,0,0deg); transform:translateZ(0) rotate3d(-1,1,0,0deg) }   100%{        -webkit-transform:translateZ(160px) rotate3d(-1,1,0,180deg); transform:translateZ(160px) rotate3d(-1,1,0,360deg) } }

@keyframes rotate-scale-up { 0% {   transform: scale(1) rotateZ(0); } 100% {    transform: scale(1) rotateZ(180deg); } }

@keyframes rotate-scale-down { 0% {   transform: scale(1) rotateZ(180deg); } 100% {    transform: scale(1) rotateZ(360deg); } }

/* End of Animation */

/* TOC and h1-h6 headings */ font-family:'Troika',sans-serif; border-bottom:0; font-size:1.5vw; } font-size:1.8vw; } font-size:2vw; } .mw-editsection{ font-family:'Troika',sans-serif; font-size:0.9vw; } font-family: sans-serif; font-size:1.1vw; } div#toc, div.toc, div.mw-warning{ background:rgba(0,0,0,0.5); border:none; border-radius:5px; }
 * 1) firstHeading,
 * 2) content h2,
 * 3) content h3,
 * 4) content h4,
 * 5) content h5,
 * 6) content h6{
 * 1) content h3{
 * 1) content h2 {
 * 1) content .mw-body-content .toc h2 {

/* End of TOC and h1-h6 headings */

/* This governs the sections on the Community portal */ .cpbox { display: flex; flex-direction: row-reverse; flex-wrap: wrap; }

.cpbox #admins { box-sizing: border-box; width: calc(33% - 10px); margin: 5px; flex-grow: 1; min-width: 300px; }

.cpbox #help { box-sizing: border-box; width: calc(67% - 10px); margin: 5px; flex-grow: 1; }