MediaWiki:Mobile.css

/* CSS placed here will affect users of the mobile site */ html, body { background-image: none !important; }

.overlay-enabled, #content { background: url(https://static.jojowiki.com/images/customizations/Jojobg.png); }

/* Navbox Mobile */ /* Only for desktop devices */ .nomobile { display:none; }

.tabber .tabbertab { border: none !important; }

.ajaxpoll { max-width: 250px; margin-left: auto; margin-right: auto; }

.ajaxpoll .ajaxpoll-id-info { display: none; }

/* ==========================  Headings ==========================*/ .mw-body .firstHeading { font-family: 'Rubik',Tahoma,Trebuchet MS,sans-serif; color: #3a3a3a; } .mw-headline { font-family: 'Rubik',sans-serif; text-transform: uppercase; padding-top: 10px; font-weight: 500; letter-spacing: 2px; color: #3a3a3a; }

.mw-body-content { font-family: "Trebuchet MS"; }

/*******************   Colors color: #ff0000; font-style: italic; }
 * 1) mw-content-text a.new {
 * 1) mw-content-text a.new {

color: #d10e7b; }
 * 1) mw-content-text a {

a, a:visited { color: #d10e7b; text-decoration: none; }

/***************************************/ /*              Hover                 */ /***************************************/ .show-when-hovering { display: none; } .hover-container:hover .show-when-hovering { display: inline; } .hover-container:hover .hide-when-hovering { display: none; } .fadeout img:hover { opacity:0; transition:none !important; -webkit-transition: none !important; } .fadeout img:active { opacity:0; transition:none !important; -webkit-transition: none !important; } body:not(.editor) .fadeout-container.fadeout-hide-bottom > .fadein { visibility: hidden; }

body:not(.editor) .fadeout-container.fadeout-hide-bottom > .fadeout:hover + .fadein { visibility: visible; }

.fadeout-container.img.lzyTrans { transition: none !important; -webkit-transition: none !important; }

.edittab { background: url('https://static.jojowiki.com/images/0/0e/EditTab.png') no-repeat; }

.fadeinimg { opacity: 0.1; } .fadeinimg:hover { opacity: 1.0; }

.closerange tr > td { border: 2px #f88 solid; padding: 0.2em; } .longrange tr > td { border: 2px #c8f9bb solid; padding: 0.2em; } .autopilot tr > td { border: 2px #268BD2 solid; padding: 0.2em; } .rangeirrelevant tr > td { border: 2px #E3B52C solid; padding: 0.2em; }

div#nihongo span#jpn { display: inline; }

div#nihongo:hover span#jpn { display: none; }

div#nihongo span#romaji { display: none; }

div#nihongo:hover span#romaji { display: inline; }

span#hovertext span#outer { display: inline; }

span#hovertext:hover span#outer { display: none; }

span#hovertext span#hidden { display: none; }

span#hovertext:hover span#hidden { display: inline; }

div#hovertext span#outer { display: inline; }

div#hovertext:hover span#outer { display: none; }

div#hovertext span#hidden { display: none; }

div#hovertext:hover span#hidden { display: inline; }

.diamond { background-image:url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important; background-size: 300px; background-position: center; background-blend-mode: soft-light; }

.diamond2 { background-image:url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important; background-position: center; background-blend-mode: soft-light; }

.diamondgradient { background-image:linear-gradient(rgba(234, 90, 232, 0.52), rgba(116, 21, 205, 0.52)), url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important; background-position: center; background-blend-mode: multiply; }

.diamonds tr > td { border: 1px solid #aaaaaa; padding: 0.2em; }

.diamonds a { color: #df479c; }

/* Make collapsible table's link white/normal font */ .diamonds .mw-collapsible-toggle a { color: #ffffff; font-weight: normal; }

.diamonds tr > th { background-image:url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important; background-size: 300px; background-position: center; background-blend-mode: soft-light; border: 1px solid #aaaaaa; }

.cquote tr > td { border: none !important; }

.cquote tr > th { border: none !important; }

/**********************************/ /*           USERPAGES           */ /**********************************/ a[href$=":MetallicKaiser"] { color: #ff98ba !important; font-weight: bold !important; }

a[href$=":Vish"] { color: #496cd4 !important; font-weight: bold !important; } a[href$=":Paisley_Park"] { color: #df6295 !important; font-weight: bold !important; font-style: italic !important; } a[href$=":Nabu"] { color: #C0C0C0 !important; font-weight: bold !important; } a[href$=":The_Speedwagon_Foundation"] { color: #9a652e !important; font-weight: bold !important; font-style: italic !important; }

a[href$=":Morganstedmanms"] { color: #a481e4 !important; font-weight: bold !important; }

/**********************************/ /*           NAVBOXES            */ /**********************************/ .navbox { width: 100%; background: #000; margin: 1em auto; font-size: 85%; clear: both; padding: 2px; border-spacing: 0; border: 3px solid #000; line-height: 18px; }

.navbox a { color: #51045d !important; } /* Merges navboxes that are directly under eachother */ .navbox + .navbox { margin-top: -11px; } .navbox .navbox-title { background: #9da1c0; color: #000; font-weight: bold; } .navbox .navbox-title a, .navbox .navbox-footer a { color: #000 !important; } .navbox .navbox-vde { float:left; width:65px; color:#fff; } .navbox .navbox-title-padright { padding-right: 65px; } .navbox .navbox-title-padleft { padding-left: 65px; } .navbox .navbox-subgroup { border-spacing: 0; width: 100%; } .navbox .navbox-gutter { height: 2px; } .navbox .navbox-subgroup .navbox-gutter { background: #000; } .navbox .navbox-section-row > td { padding: 0; height: 100%; } .navbox .navbox-section { width: 100%; border-spacing: 0; } .navbox .navbox-above, .navbox .navbox-below { background: #c7d2ff; text-align: center; } .navbox .navbox-image { background: #000; text-align: center; } .navbox .navbox-group, .navbox .navbox-header { background: #a7a5de; color: #000; font-weight: bold; height: 100%; padding: 2px 4px; } .navbox .navbox-header-collapsible { padding-left: 65px; } .navbox .navbox-group { text-align: right; padding-right: 1em; } .navbox .navbox-group, .navbox .navbox-image-left { border-right: 2px solid #000; } .navbox-image-right { border-left: 2px solid #000; } .navbox .navbox-list { background: #c7d2ff; color: black; width: 100%; height: 100%; padding: 0; } .navbox .alt > .navbox-list { background: #F7F7F7; } .navbox .navbox-list div { padding: 0px 4px; } .navbox .navbox-list.no-group { text-align: center; padding-top: 2px; padding-bottom: 2px; } .navbox .mw-collapsible-toggle { width: 65px; }

.content table { margin: 0 !important; }

@media (max-width: 720px) { .content table { display: table; } }

.header { background-color: #c4bfdc; background-image: url(https://static.jojowiki.com/images/customizations/DiamondBG.png); background-blend-mode: soft-light; background-position-x: center; }

.minerva-footer { background-color: #c4bfdc; }

.navigation-enabled #mw-mf-viewport { background-color: #c4bfdc; }

.header-container.header-chrome { background-color: #c4bfdc !important; background-image: url(https://static.jojowiki.com/images/customizations/DiamondBG.png); background-blend-mode: soft-light; background-position-x: center; }

.overlay.search-overlay .overlay-header { background-color: inherit !important; }

footer .last-modified-bar { background-color: #dbd9ef; }

.client-js .toc-mobile { background-color: #dbd9ef; }

.recentFeedNoLegend .mw-changeslist-legend { display: none; }

.parenttabs:hover { background-color:#cbc5c5 !important; }

.parenttabs:active { filter: grayscale; }

.parenttabs:active a { color: white !important; }

.parenttabs a { position: absolute; z-index: 10; width: 100%; height: 100%; left: 0; top: 0; text-decoration: none; }

.parenttabs a.mw-selflink { color: white !important; }

@media (max-width:450px) { .parenttabs { font-size: 80% !important; } }

.mw-gallery-packed-overlay li.gallerybox { width:100px!important; margin:0px!important; margin-top:0px!important; } .mw-gallery-packed-overlay .gallerybox div { width:100px !important; } .mw-gallery-packed-overlay .gallerybox .thumb a img { width:150px!important; height:150px!important } .mw-gallery-packed-overlay .gallerybox img { object-fit:cover!important; object-position:top }

ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper { max-height:45%; }

.containedGallery .gallerybox img { object-fit: contain !important; }

.mw-gallery-packed-overlay div.gallerytext { font-size: 60% !important; padding: 0 !important; margin-left: -8% !important; }

ul.gallery { padding-left: 0 !important; width: 100% !important; }

.header .branding-box h1 span, .header .branding-box a span { font-family: 'Rubik',Tahoma,Trebuchet MS,sans-serif; }

.pre-content h1, .content h1 { font-family: 'Rubik',Tahoma,Trebuchet MS,sans-serif!important; font-size: 1.45em !important; font-weight: bold !important; text-align: center !important; }

.content h2 { font-family: Rubik !important; }

.portable-infobox .pi-background { /* The background underneath the entire infobox. */   background-color: #F0F0F0; }

.portable-infobox .pi-data-value .image img { margin-left: auto; margin-right: auto; display: block; }

.portable-infobox .pi-secondary-background { /* The background behind headers and navigation. */   background: #c1bcd9; }

.portable-infobox.pi-theme-statinfo { float:unset !important; margin-left:-5px; border: none; border-radius: unset; }

.portable-infobox .pi-title { color: #000; background-image:url('https://static.jojowiki.com/images/customizations/DiamondBG.png'); background: #c1bcd9; font-size: 20px; font-family: 'Lato'; text-align: center; letter-spacing: inherit; font-weight: bold; text-transform: none; border: 0px solid #F0F0F0; padding: 1px; }

.portable-infobox .pi-header { text-align: center; font-family: 'Rubik'; }

.header .search-box { padding-left: 15px; }

.whitelink a { color: white !important; }

.content .in-block { word-break: inherit; }

.mobilemain { width: 100% !important; }

.gradient { background: rgb(154,133,183); background: linear-gradient(180deg, rgba(154,133,183,1) 0%, rgba(70,81,130,1) 100%); }

.portable-infobox img.pi-image-thumbnail { width:100% }

@media (max-width:600px) { .charbox { width:67px; } .charstatus { font-size: 40% !important; } .charname { height: 45px !important; padding-bottom: 15% !important; font-size: 75% !important; line-height: 1.3 !important; }

.charstand { font-size: 65% !important; } }

.noshadow .charicon img { box-shadow:none !important; }

.castImg .image img, .castImg .image-lazy-loaded { max-width: 80px !important; max-height: 80px !important; }

@media (max-width:600px) { .resizeImg .charicon img { height:67px !important; width: auto; } .resizeImg .fadeout img { height:67px !important; width: 67px !important; } .resizeImg .fadein img { height:67px !important; width: 67px !important; } }

.resizeImg2 img { max-height: 67px; width: auto !important; max-width: 67px; }

@media (min-width:601px) { .charbox { width:100px; } .charname { line-height:1.5 !important; padding:5% 0 !important; height:60px !important } } @media (min-width:601px) { .resizeImg .charicon img { height:100px !important; width: auto; } }

@media (max-width:800px) { .mw-gallery-packed .gallerybox { width:30% !important; } }

.chariconbg .diamond { background-image: none !important; }

/* Comments */ .full { width: auto; }

.reply { width: auto; }

.f-message { width: auto; }

.r-message { width: auto; }

textarea#comment { max-width: 300px; }

.pppfullbox { zoom: 85%; }

.skin-minerva .portable-infobox { font-size: 90%; box-shadow: 0px 0px 7px #c5c5c5; }

.skin-minerva .portable-infobox .pi-item-spacing { padding: 0; }

.skin-minerva .portable-infobox .pi-data .pi-data-label { padding-left: 5px; }

.portable-infobox a > img { max-width:unset !important; width: 100%; }

.portable-infobox.pi-theme-PhantomBlood .pi-title, .portable-infobox.pi-theme-PhantomBlood .pi-header { background: #3055A1; color: white; }

.portable-infobox.pi-theme-BattleTendency .pi-title, .portable-infobox.pi-theme-BattleTendency .pi-header { background: #952F58; color: white; }

.portable-infobox.pi-theme-StardustCrusaders .pi-title, .portable-infobox.pi-theme-StardustCrusaders .pi-header { background: #1b3f95; color: white; }

.portable-infobox.pi-theme-DiamondIsUnbreakable .pi-title, .portable-infobox.pi-theme-DiamondIsUnbreakable .pi-header { background: #78a4cd; color: white; }

.portable-infobox.pi-theme-VentoAureo .pi-title, .portable-infobox.pi-theme-VentoAureo .pi-header { background: #E15FB6; color: white; }

.portable-infobox.pi-theme-StoneOcean .pi-title, .portable-infobox.pi-theme-StoneOcean .pi-header { background: #842D85; color: white; }

.portable-infobox.pi-theme-SteelBallRun .pi-title, .portable-infobox.pi-theme-SteelBallRun .pi-header { background: #D4813D; color: white; }

.portable-infobox.pi-theme-JoJolion .pi-title, .portable-infobox.pi-theme-JoJolion .pi-header { background: #53A599; color: white; }

.portable-infobox.pi-theme-OneShot .pi-title, .portable-infobox.pi-theme-OneShot .pi-header { background: #0068B8; color: white; }

.portable-infobox.pi-theme-Jorge .pi-title, .portable-infobox.pi-theme-Jorge .pi-header { background: #49885d; color: white; }

.portable-infobox.pi-theme-Baoh .pi-title, .portable-infobox.pi-theme-Baoh .pi-header { background: #4b8ac4; color: white; }

.portable-infobox.pi-theme-Irene .pi-title, .portable-infobox.pi-theme-Irene .pi-header { background: #D58C00; color: white; }

.charstand a { color: white !important; }

/* Logos */ .page-Phantom_Blood .page-heading { background-image:url(https://static.jojowiki.com/images/b/b4/Phantom_Blood_Logo.png); height: 75px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-Phantom_Blood .page-heading i { display: none !important; }

.page-Battle_Tendency .page-heading { background-image:url(https://static.jojowiki.com/images/6/60/Battle_Tendency_Logo.png); height: 70px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-Battle_Tendency .page-heading i { display: none !important; }

.page-Stardust_Crusaders .page-heading { background-image:url(https://static.jojowiki.com/images/b/b6/Stardust_Crusaders_Logo.png); height: 60px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-Stardust_Crusaders .page-heading i { display: none !important; }

.page-Diamond_is_Unbreakable .page-heading { background-image:url(https://static.jojowiki.com/images/8/8c/Diamond_is_Unbreakable_Logo.png); height: 60px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-Diamond_is_Unbreakable .page-heading i { display: none !important; }

.page-Vento_Aureo .page-heading { background-image:url(https://static.jojowiki.com/images/3/30/Vento_Aureo_Logo.png); height: 75px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-Vento_Aureo .page-heading i { display: none !important; }

.page-Stone_Ocean .page-heading { background-image:url(https://static.jojowiki.com/images/7/79/Stone_Ocean_Logo.png); height: 75px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-Stone_Ocean .page-heading i { display: none !important; }

.page-Steel_Ball_Run .page-heading { background-image:url(https://static.jojowiki.com/images/d/d9/Steel_Ball_Run_Logo.png); height: 75px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-Steel_Ball_Run .page-heading i { display: none !important; }

.page-JoJolion .page-heading { background-image:url(https://static.jojowiki.com/images/5/59/JoJolion_Logo.png); height: 75px; background-size:contain; background-repeat:no-repeat; background-position:center; }

.page-JoJolion .page-heading i { display: none !important; }

.mnimage { display: block !important; }

.mncolumn2 { display: table-row; }

.popup { border-bottom: 1px dotted; position: relative; }

.popup .title { position: absolute; top: 20px; background: silver; padding: 4px; left: 0; white-space: nowrap; }

.tb { display: table !important; }

.frontbuttons { width: 100px !important; }

.imagebox { width: 100px !important; font-size: 70%;

}

.imageboxb { height: 100px !important; }

.frontbuttons img { width: 100px; height: 100px; }

/* FONTS */ /* bangers-regular - vietnamese_latin-ext_latin */ @font-face { font-family: 'Bangers'; font-style: normal; font-weight: 400; src: local('Bangers Regular'), local('Bangers-Regular'), url('../fonts/bangers-v12-vietnamese_latin-ext_latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../fonts/bangers-v12-vietnamese_latin-ext_latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ font-display: swap; }

/* lato-regular - latin-ext_latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/lato-v16-latin-ext_latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../fonts/lato-v16-latin-ext_latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ font-display: swap; }

/* quicksand-regular - vietnamese_latin-ext_latin */ @font-face { font-family: 'Quicksand'; font-style: normal; font-weight: 400; src: local(''), url('../fonts/quicksand-v20-vietnamese_latin-ext_latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../fonts/quicksand-v20-vietnamese_latin-ext_latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ font-display: swap; }

/* raleway-regular - latin-ext_latin */ @font-face { font-family: 'Raleway'; font-style: normal; font-weight: 400; src: local('Raleway'), local('Raleway-Regular'), url('../fonts/raleway-v14-latin-ext_latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../fonts/raleway-v14-latin-ext_latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ font-display: swap; }

/* roboto-slab-regular - vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic */ @font-face { font-family: 'Roboto Slab'; font-style: normal; font-weight: 400; src: local(''), url('../fonts/roboto-slab-v11-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../fonts/roboto-slab-v11-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ font-display: swap; } /* rubik-regular - latin-ext_latin_hebrew_cyrillic */ @font-face { font-family: 'Rubik'; font-style: normal; font-weight: 400; src: local('Rubik'), local('Rubik-Regular'), url('../fonts/rubik-v9-latin-ext_latin_hebrew_cyrillic-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../fonts/rubik-v9-latin-ext_latin_hebrew_cyrillic-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ font-display: swap; }