MediaWiki:Common.css

From JoJo's Bizarre Encyclopedia - JoJo Wiki
Revision as of 05:32, 14 February 2023 by Vish (talk | contribs)
Jump to navigation Jump to search

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)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/***** CSS placed here will be applied to all skins on the entire site. *****/

html, body {
    	background: url(https://static.jojowiki.com/images/customizations/BlueDiamond.jpg) center;
		background-attachment: fixed;
}
    
#mw-head {
	background-image: url(https://static.jojowiki.com/images/customizations/HeaderBG.png);
	background-repeat: no-repeat;
	background-position: 192px 0;
}

.mw-wiki-logo {
    background-size: cover;
}
#p-logo {
    margin-left: auto;
    margin-right: auto;
}

.mw-content-ltr {
    word-wrap: break-word;
}

#mw-panel .emptyPortlet {
    display: block;
}

#content {
    min-height: 1200px;
}

/*  MENU     */

@media only screen and (max-width:1300px) {
  .menuwrapper {
    right: 5% !important;
  }
}

#menu, #menu .submenu {
	font-size: 90%;
}

.portal #menu li {
  line-height:0.8em;
}
.menuwrapper {
	text-align:center;
	position:inherit;
	top: 30%;
	right: 0;
}

#menu ul {
  margin: 0;
  padding: 0;
}

#menu .main-menu {
  display: none;
}

#menu input[type="checkbox"], 
#menu ul span.drop-icon {
  display: none;
}

#menu li, 
#toggle-menu, 
#menu .sub-menu {
  border-style: solid;
  border-color: rgba(0, 0, 0, .05);
}

#menu li, 
#toggle-menu {
  border-width: 0 0 1px;
}

#menu .sub-menu {
  border: 2px solid #5e637f;
  background-color: #444;
  margin: 0 1em;
  box-shadow: 2px 2px 3px #434343;
}

#menu .sub-menu li:last-child {
  border-width: 0;
}

#menu li, 
#toggle-menu, 
#menu a {
  position: relative;
  display: block;
  color: white;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .125);
}

#menu, 
#toggle-menu {
  background-color: #8e94ba;
  display: inline-block;
  border: 2px solid #7f83a2;
  box-shadow: 1px 1px 2px #4c4f67;
}

#toggle-menu, 
#menu a {
  padding: 0.5em 0.55em;
}

.menuicon {
  padding: 0.4em 0.8em !important;
}

#menu a {
  background-color: #9da1c0;
  transition: all .125s ease-in-out;
  -webkit-transition: all .125s ease-in-out;
  font-family: Lato;
}

#menu a:hover {
  background-color: #474e7a;
  color: #db8ae2;
}

#menu .sub-menu {
  display: none;
}

#menu .sub-menu a:hover {
    color: #db8ae2;
}

#toggle-menu .drop-icon, 
#menu li label.drop-icon {
  position: absolute;
  right: 1.5em;
  top: 1.25em;
}

#menu label.drop-icon, #toggle-menu span.drop-icon {
  border-radius: 50%;
  width: 1em;
  height: 1em;
  text-align: center;
  background-color: rgba(0, 0, 0, .125);
  text-shadow: 0 0 0 transparent;
  color: rgba(255, 255, 255, .75);
}

#menu .drop-icon {
  line-height: 1;
}

@media only screen and (max-width:80em) and (min-width:61em) {
  
    #p-personal {
    z-index: 0;
    background-color: #8e94ba;
border: 2px solid #3d3d51;
  }
}

@media only screen and (max-width:61em) and (min-width:40em) {
  
    #p-personal {
    z-index: 0;
    background-color: #8e94ba;
border: 2px solid #3d3d51;
  }
  
  .menuwrapper {
    font-size: 72% !important;
  }
}

@media only screen and (max-width: 64em) and (min-width: 40em) {
  #menu li {
    width: auto;
  }

  #menu .sub-menu li {
    width: auto;
  }
}

@media only screen and (min-width: 40em) {
  #menu .main-menu {
    display: block;
  }

  #toggle-menu, 
  #menu label.drop-icon {
    display: none;
  }

  #menu ul span.drop-icon {
    display: inline-block;
  }


  #menu li {
    float: left;
    border-width: 0 1px 0 0;
  }

  #menu .sub-menu li {
    float: none;
  }


  #menu .sub-menu {
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    width: 10em;
    white-space: nowrap;
    background-color: #595994;
    z-index: 3000;
  }

  #menu .sub-menu, 
  #menu input[type="checkbox"]:checked + .sub-menu {
    display: none;
  }

  #menu .sub-menu li {
    border-width: 0 0 1px;
  }


  #menu .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }
  
  #menu .smallmenu {
  	font-size: 12px;
  }
  
  #menu .sub-menu .smallmenu {
  	white-space: nowrap;
  	width: auto;
  }

  #menu li:hover > input[type="checkbox"] + .sub-menu {
    display: block;
  }
}


/* Sidebar */
/* increase Vector sidebar width to accommodate ads */
#mw-panel { width: 12em; }

#mw-panel .vector-menu-content-list {
  background-color: white;
  padding: 5px;
  border-radius: 15px;
  margin-bottom: 10px;
  border: 2px solid gray;
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  font-family: Lato;
}


#n-News {
  background-color: var(--jjbe);
  padding: 0.5em 0.55em;
  border: 2px solid #7f83a2;
  box-shadow: 1px 1px 2px #4c4f67;
  font-size: 15px;
  margin-bottom: 5px;
}

#n-News:hover {
  background-color: var(--jjbe3);
}


#n-News a {
  color: white;
  width: 100%;
  display: block;
}

#n-Forum {
  background-color: var(--jjbe);
  padding: 0.5em 0.55em;
  border: 2px solid #7f83a2;
  box-shadow: 1px 1px 2px #4c4f67;
  font-size: 15px;
  margin-bottom: 5px;
}

#n-Forum:hover {
  background-color: var(--jjbe3);
}

#n-Forum a {
  color: white;
  width: 100%;
  display: block;
}

#n-recentchanges {
  background-color: var(--jjbe);
  padding: 0.5em 0.55em;
  border: 2px solid #7f83a2;
  box-shadow: 1px 1px 2px #4c4f67;
  font-size: 15px;
  margin-bottom: 5px;
}

#n-recentchanges:hover {
  background-color: var(--jjbe3);
}


#n-recentchanges a {
  color: white;
  width: 100%;
  display: block;
}

#n-Wiki-Policies {
  background-color: var(--jjbe);
  padding: 0.5em 0.55em;
  border: 2px solid #7f83a2;
  box-shadow: 1px 1px 2px #4c4f67;
  font-size: 15px;
  margin-bottom: 5px;
}

#n-Wiki-Policies:hover {
  background-color: var(--jjbe3);
}

#n-Wiki-Policies a {
  color: white;
  width: 100%;
  display: block;
}

#mw-panel .vector-menu-heading {
  background-color: var(--jjbe4) !important;
  color: white !important;
  padding: 7px !important;
  margin: .5em .5em .5em .5em;
  text-align: center !important;
  border-radius: 5px !important;
  border: 2px solid #9f53c8;
  box-shadow: 1px 1px 2px #70477c;
  font-size: 1em;
  background-image: url(https://static.jojowiki.com/images/customizations/DiamondBG.png);
  background-repeat: repeat;
  background-size: contain;
  background-blend-mode: soft-light;
  font-family: Rubik;
}

#footer, #mw-head-base, #content, #mw-data-after-content { margin-left: 12em; }

#left-navigation { margin-left: 12em; }
#mw-data-after-content {
	margin-top: 2em;
	border-top: 2px solid #d5d6d8;
}

#mw-page-base {
    height: 8em;
}

/* ==========================
   Main Width
   ==========================*/
#jojowiki-body {
	position: relative;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 1280px;
	background-color: white;
	background-image: url(https://static.jojowiki.com/images/customizations/Jojobg.png);
	border: 5px solid #3d3d51;
	border-top: none;
	-webkit-box-shadow: 0px 2px 3px 6px rgba(0,0,0,0.77);
	-moz-box-shadow: 0px 2px 3px 6px rgba(0,0,0,0.77);
	box-shadow: 0px 2px 3px 6px rgba(0,0,0,0.77);
}
    /* set max width and fix the background */
    @media screen and (min-width: 1425px) {
    
    #container {
    	background-image: url(https://static.jojowiki.com/images/customizations/CharOverlay2023.webp);
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-position: top center;
    }
    }
    
    @media screen and (max-width: 1425px) {
	.skin-minerva html {
		background-image:url(https://static.jojowiki.com/images/customizations/WikiMinimalBG.jpg) !important;
	}
	
	#container {
		background-image: none;
	}
	}

	@media screen and (max-width: 500px) {
	.skin-minerva html, body {
		background-image: none !important;
	}
	}
    
    /* set right border */
    .mw-body { 
    	border-right: 1px solid #A7D7F9;
    	border-color: #c2b7de;
    	background-image: url(https://static.jojowiki.com/images/customizations/Jojobg.png);
    }
   
    /** fix the position of:
    			personal user menu
    			search bar
    			the pop-up indicator of language selector
    **/
    #p-search { margin-right: 3pt; }
    .imeselector { position: fixed; }


#mw-panel {
    padding-left: 0;
	background: #d2cee9;
	background-image: url(https://static.jojowiki.com/images/customizations/SymbolBG.png);
	background-blend-mode: multiply;
	border-bottom-left-radius: 20px;
	background-size: 250px;
}

#mw-panel a {
  font-family: Rubik;
}

#footer {
    background: white;
}

/* Mark redirects in Special:Allpages and Special:Watchlist */
.allpagesredirect {
   font-style: italic;
}
.allpagesredirect:after {
   color: #808080; content: " (redirect)"
}
.watchlistredir {
   font-style: italic;
}

pre, .mw-code {
    overflow: scroll;
}


/* ==========================
   Table of Contents
   ==========================*/
	.toc {
    	border: 1px solid #9a85b7;
    	float: center;
    	clear: center;
    	background: transparent;
    	min-width: 360px;
    	border-radius: 10px;
    	text-align: left;
    	padding: 5px;
	}
	
	.toctitle {
    	text-transform: uppercase;
    	font-family: 'Rubik',sans-serif;
	}
	
	.toctogglelabel {
    	color:#d10e7b;
    	text-transform: capitalize;
	}

	.tocnumber, .toctext {
		font-size: 15px;
	}

/* ==========================
   Thumbnails
   ==========================*/
	div.tright, div.tleft {
		border: 0px transparent !important;
	}

	html .thumbimage {
		border: 1px solid #000;
		border-radius: 4px;
	}

	div.thumbinner {
		border: 2px solid #000 !important;
		border-radius: 6px;
		padding: 3px 6px 3px 4px;
		background-image: url(https://static.jojowiki.com/images/customizations/ThumbnailDiamondBG.png);
		background-position: bottom;
	}
	
	.thumbinner:hover {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transition: .2s;
    z-index: 1;
}

/* ==========================
   Headings
   ==========================*/
.mw-body .firstHeading {
	font-family: 'Rubik',sans-serif;
	font-weight: 400;
	font-size: 36px;
	color: #3a3a3a;
	position: relative;
}
	
.mw-headline {
	font-family: 'Rubik',sans-serif;
	text-transform: uppercase;
	padding-top: 10px;
	font-weight: 500;
	font-size: 1em;
	color: #3a3a3a;
}

.mw-body-content {
    font-size: 15.5px;
    font-family: "Trebuchet MS";
}
.mw-body-content p {
    margin: .4em 0 1em;
}

.mw-body-content h2 {
    font-size: 28px;
    font-family: 'Rubik',sans-serif;
}

.mw-body-content h3 {
    font-size: 22px;
}

.mw-body-content h4 {
    font-size: 20px;
}

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

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

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

a.mw-selflink {
    color: #000;
    color: inherit !important;
}
 

/*===========================*/
/*        INFOBOX TABS       */
/*===========================*/

.infoboxtabs .tabbertab p {
  margin: 0.5px !important;
}
 
/*   Styles for both InfoboxTabs and InfoboxTabs2   */
ul.tabbernav li.tabberactive a:hover {
    color: #000 !important;
}
ul.tabbernav li.tabberactive a {
    color: black !important;
}

/*   The main container and subcontainer   */
.infoboxtabs, .infoboxtabs2, .infoboxtabs .tabberlive, .infoboxtabs2 .tabberlive {
    margin: 0;
    padding: 0;
}
/*   The link of the active tab   */
.infoboxtabs ul.tabbernav li.tabberactive a, .infoboxtabs ul.tabbernav li.tabberactive a:hover, .infoboxtabs2 ul.tabbernav li.tabberactive a, .infoboxtabs2 ul.tabbernav li.tabberactive a:hover {
}
 
/*   Styles for InfoboxTabs   */
 
/*   The block that contains the tabs   */
.infoboxtabs ul.tabbernav {
    border-bottom: 1px outset #c0c0c0;
    border-bottom: 1px outset #c0c0c0;
}

ul.pi-image-collection-tabs {
    margin: 0 !important;
}

.tabber .tabbertab {
	border: 0px !important;
}

/*   General styles for the links   */
.infoboxtabs ul.tabbernav li a, .infoboxtabs ul.tabbernav li a:hover {
    color: #000 !important;
}
/*   The link of the active tab   */
.infoboxtabs ul.tabbernav li.tabberactive a, .infoboxtabs ul.tabbernav li.tabberactive a:hover {
    border-style: inset outset solid inset;
    border-width: 1px;
}
/*   The block that contains the image   */
.infoboxtabs .tabberlive .tabbertab {
    border-bottom: 1px outset #c0c0c0;
    border-left: 1px inset #c0c0c0;
    border-right: 1px outset #c0c0c0;
}

/*   Styles for InfoboxTabs2   */
 
/*   The block that contains the tabs   */
.infoboxtabs2 ul.tabbernav {
    border: 0;
    line-height: 12px;
    overflow: hidden;
}

/*   General styles for the links   */
.infoboxtabs2 ul.tabbernav li a, .infoboxtabs2 ul.tabbernav li a:hover {
    font-family: "Rubik", sans-serif;
    font-size: 90%;
    color:#000;
    margin: 0;
}

.infoboxtabs2 ul.tabbernav li a:hover, .infoboxtabs2 ul.tabbernav li.tabberactive a{
	background-color: darkgrey !important;
}

/*   The first tab   */
.infoboxtabs2 ul.tabbernav li:first-child a, .infoboxtabs2 ul.tabbernav li:first-child a:hover {
    border-left: 0 !important;
}
/*   The block that contains the image   */
.infoboxtabs2 .tabberlive .tabbertab {
    border: 0;
    padding: 0;
    background-color: transparent !important;
}

/*   Styles for InfoboxTabs3   */
 
/*   The block that contains the tabs   */
.infoboxtabs3 ul.tabbernav {
    border: 0;
    line-height: 12px;
    overflow: hidden;
    padding: 0;
}

/*   General styles for the links   */
.infoboxtabs3 ul.tabbernav li a, .infoboxtabs3 ul.tabbernav li a:hover {
    border-right: 0 !important;
    font-family: "Raleway", sans-serif;
    font-size: 90%;
    color:#000;
    margin: 0;
}
/*   The first tab   */
.infoboxtabs3 ul.tabbernav li:first-child a, .infoboxtabs3 ul.tabbernav li:first-child a:hover {
    border-left: 0 !important;
}
/*   The block that contains the image   */
.infoboxtabs3 .tabberlive .tabbertab {
    border: 0;
    padding: 0;
    background-color: transparent !important;
}

.infoboxtabs3 .tabberlive {
    width: 130px;
    margin-top: 0 !important;
}

/* Recent changes byte indicators */
.mw-plusminus-pos {
   color: #006500;
}
.mw-plusminus-neg {
   color: #8B0000;
}

/* Image frame fix */
div.tright, div.tleft {
   border: 1px solid silver;
}

#article div.thumb {
   color:inherit;
}

li.message-removed.hide {
        display: none;
 }


/*******************
 * Template Documentation
 *******************/
.template-documentation {
	border: 1px solid #b68333;
	margin: .5em;
	margin-top: 2em;
	background: #A66908;
}

.template-docu-header,
.template-docu-footer {
	background: #C68723;
	color: #DDD;
	padding: 1em;
	margin: 0em;
}

.template-docu-footer {
	padding: .5em;
	font-size: 85%;
	text-align: right;	
}

.template-docu-content {
	padding: 1em;
	padding-bottom: 0em;
	margin: 0em;
}

.template-docu-content code {
	background: #AA6D0C;
	padding: 1px;
	border: 1px solid #B67918;
	border-radius: 3px;
}

/* hlist */
.hlist-pipe dd:last-child:after,
.hlist-pipe li:last-child:after {
  content: none !important;
}

.hlist-pipe dd:after,
.hlist-pipe li:after {
 content:" | " !important;
 color:black
}

.hlist ul {
    margin: 0;
    list-style: none;
}
 
.hlist li, .hlist ul ul {
    display: inline;
}
 
.hlist li a {
    white-space: nowrap;
}
 
.hlist ul ul:before {
    content: "("
}
 
.hlist ul ul:after {
    content: ")"
}
 
.hlist li:after {
    content: " • ";
}
 
.hlist ul ul li:after {
    content: "/";
}
 
.hlist li:last-child:after, .hlist ul ul li:last-child:after {
    content: none;
}

.portable-infobox {
    overflow: hidden;
    font-size: 90%;
    background-image:url('https://static.jojowiki.com/images/customizations/Jojobg.png');
    border: 2px solid #9da1c0;
    border-radius: 10px;
    font-size: smaller;
    line-height: 1.5;
    width: 270px;
    background: transparent !important;
}

.portable-infobox .tabbertab p {
  margin: 0;
}

.portable-infobox .tabberlive .tabbertab {
  padding: 0px !important;
}

.portable-infobox .pi-data-label a {
	text-decoration: underline;
	color:white !important
}

.portable-infobox .tabbertab img {
  background-image: url('https://static.jojowiki.com/images/customizations/DiamondBG.png');
}

.portable-infobox .image img {
 background-image: url('https://static.jojowiki.com/images/customizations/DiamondBG.png');
}

.portable-infobox .image img {
  max-width: 270px;
  height: auto;
}


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

.portable-infobox .pi-data .pi-data-value {
    font-size: 12px;
}

.portable-infobox .pi-horizontal-group-item.pi-data-value {
    padding-left: 5px;
    padding-right: 5px;
}

.portable-infobox .pi-data .pi-data-value:not(:first-child) {
    flex-basis: 1% !important;
}
.portable-infobox.pi-theme-thin .pi-secondary-font {
    background-color: #9da1c0;
}

.portable-infobox.pi-theme-thin .pi-data .pi-data-label {
    flex-basis: 30% !important;
    background-color:#666A89;
}

/* Stand Info */
.portable-infobox.pi-theme-stand {
    width: 270px;
}

/* Character Info */
.portable-infobox.pi-theme-thin {
    width: 270px;
}

.pi-title, .pi-header {
	background-image: url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important;
	background-blend-mode: soft-light !important;
}

.portable-infobox.pi-theme-wide .pi-title, .portable-infobox.pi-theme-wide .pi-header {
	background-image: url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important;
	background-blend-mode: soft-light !important;
}

.portable-infobox.pi-theme-episodes .pi-title, .portable-infobox.pi-theme-episodes .pi-header {
	background-image: url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important;
	background-blend-mode: soft-light !important;
}

.portable-infobox.pi-theme-stand .pi-title, .portable-infobox.pi-theme-stand .pi-header {
	background-image: url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important;
	background-blend-mode: soft-light !important;
}

.pi-horizontal-group-item.pi-data-label {
    color: #000;
}

.episodes, .portable-infobox.pi-theme-episodes .pi-horizontal-group-item.pi-data-label,
.portable-infobox.pi-theme-episodes .pi-horizontal-group-item.pi-data-value {
    font-size: 12px !important;
}

/* Custom Colors */
/* Phantom Blood */
.PhantomBlood, .portable-infobox.pi-theme-PhantomBlood {
    width: 270px;
    border: 2px solid #3055A1;
}
.portable-infobox.pi-theme-PhantomBlood .pi-title, .portable-infobox.pi-theme-PhantomBlood .pi-header {
    background-color: #3055A1;
    color: white;
}
.portable-infobox.pi-theme-PhantomBlood .pi-data .pi-data-label {
    background-color: #777690;
}
.portable-infobox.pi-theme-PhantomBlood .pi-horizontal-group-item.pi-data-label {
    background-color: #777690;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-PhantomBlood .pi-image-collection-tabs li.current {
    background: #c7d0e2;
}
.portable-infobox.pi-theme-PhantomBlood .pi-navigation {
    background: #3055A1 !important;
}
/* Battle Tendency */
.BattleTendency, .portable-infobox.pi-theme-BattleTendency {
    width: 270px;
    border: 2px solid #952F58;
}
.portable-infobox.pi-theme-BattleTendency .pi-title, .portable-infobox.pi-theme-BattleTendency .pi-header {
    background-color: #952F58;
    color: white;
}
.portable-infobox.pi-theme-BattleTendency .pi-data .pi-data-label {
    background-color: #DF9330;
}
.portable-infobox.pi-theme-BattleTendency .pi-horizontal-group-item.pi-data-label {
    background-color: #DF9330;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-BattleTendency .pi-image-collection-tabs li.current {
    background: #e7cdaa;
}
.portable-infobox.pi-theme-BattleTendency .pi-navigation {
    background: #952F58 !important;
}
/* PB BT */
.PhantomBloodBattleTendency,
.portable-infobox.pi-theme-PhantomBloodBattleTendency {
 width:270px;
 border:2px solid #3055A1
}
.portable-infobox.pi-theme-PhantomBloodBattleTendency .pi-title,
.portable-infobox.pi-theme-PhantomBloodBattleTendency .pi-header {
 background:linear-gradient(to right,var(--pb),var(--bt)),url(https://static.jojowiki.com/images/customizations/DiamondBG.png) !important;
 color:white
}
.portable-infobox.pi-theme-PhantomBloodBattleTendency .pi-data .pi-data-label {
 background:#777690;
}
.portable-infobox.pi-theme-PhantomBloodBattleTendency .pi-horizontal-group-item.pi-data-label {
 background:#777690;
 border:2px solid white;
 border-top:none;
 color:white
}
.portable-infobox.pi-theme-PhantomBloodBattleTendency .pi-image-collection-tabs li.current {
 background:linear-gradient(#C7D0E2, #E7CDAA) !important;
}
.portable-infobox.pi-theme-PhantomBloodBattleTendency .pi-navigation {
 background:linear-gradient(to right,#3055A1, #952F58) !important;
}

/* Stardust Crusaders */
.StardustCrusaders, .portable-infobox.pi-theme-StardustCrusaders {
    width: 270px;
    border: 2px solid #363067;
}
.portable-infobox.pi-theme-StardustCrusaders .pi-title, .portable-infobox.pi-theme-StardustCrusaders .pi-header {
    background-color: #57508f;
    color: white;
}
.portable-infobox.pi-theme-StardustCrusaders .pi-data .pi-data-label {
    background-color: #b7a972;
}
.portable-infobox.pi-theme-StardustCrusaders .pi-horizontal-group-item.pi-data-label {
    background-color: #b7a972;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-StardustCrusaders .pi-image-collection-tabs li.current {
    background: #958958;
}
.portable-infobox.pi-theme-StardustCrusaders .pi-navigation {
    background: #57508f !important;
}

/* Diamond is Unbreakable */
.DiamondIsUnbreakable, .portable-infobox.pi-theme-DiamondIsUnbreakable {
    width: 270px;
    border: 2px solid #2d6090;
}
.portable-infobox.pi-theme-DiamondIsUnbreakable .pi-title, .portable-infobox.pi-theme-DiamondIsUnbreakable .pi-header {
    background-color: #78a4cd;
    color: white;
}
.portable-infobox.pi-theme-DiamondIsUnbreakable .pi-data .pi-data-label {
    background-color: #F599A3;
}
.portable-infobox.pi-theme-DiamondIsUnbreakable .pi-horizontal-group-item.pi-data-label {
    background-color: #F599A3;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-DiamondIsUnbreakable .pi-image-collection-tabs li.current {
    background: #ffcd53;
}
.portable-infobox.pi-theme-DiamondIsUnbreakable .pi-navigation {
    background: #78a4cd !important;
}
/* Vento Aureo */
.VentoAureo, .portable-infobox.pi-theme-VentoAureo {
    width: 270px;
    border: 2px solid #E15FB6;
}
.portable-infobox.pi-theme-VentoAureo .pi-title, .portable-infobox.pi-theme-VentoAureo .pi-header {
    background-color: #E15FB6;
    color: white;
}
.VentoAureo,
.portable-infobox.pi-theme-VentoAureo .pi-data-label a {
  color: black !important;
}
.portable-infobox.pi-theme-VentoAureo .pi-data .pi-data-label {
    background-color: #F4DA6D;
    color: black !important;
}
.portable-infobox.pi-theme-VentoAureo .pi-horizontal-group-item.pi-data-label {
    background-color: #F4DA6D;
    border: 2px solid white;
    border-top: none;
    color: black !important;
}
.portable-infobox.pi-theme-VentoAureo .pi-image-collection-tabs li.current {
    background: #fff5c9;
}
.portable-infobox.pi-theme-VentoAureo .pi-navigation {
    background: #E15FB6 !important;
}

/* Stone Ocean */
.StoneOcean, .portable-infobox.pi-theme-StoneOcean {
    width: 270px;
    border: 2px solid #136378;
}
.portable-infobox.pi-theme-StoneOcean .pi-title, .portable-infobox.pi-theme-StoneOcean .pi-header {
    background-color: #2F93AD;
    color: white;
}
.portable-infobox.pi-theme-StoneOcean .pi-data .pi-data-label {
    background-color: #739866;
}
.portable-infobox.pi-theme-StoneOcean .pi-horizontal-group-item.pi-data-label {
    background-color: #739866;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-StoneOcean .pi-image-collection-tabs li.current {
    background: #b4e8b0;
}
.portable-infobox.pi-theme-StoneOcean .pi-navigation {
    background: #2F93AD !important;
}
/* Steel Ball Run */
.SteelBallRun, .portable-infobox.pi-theme-SteelBallRun {
    width: 270px;
    border: 2px solid #D4813D;
}
.portable-infobox.pi-theme-SteelBallRun .pi-title, .portable-infobox.pi-theme-SteelBallRun .pi-header {
    background-color: #D4813D;
    color: white;
}
.portable-infobox.pi-theme-SteelBallRun .pi-data .pi-data-label {
    background-color: #a19b9b;
}
.portable-infobox.pi-theme-SteelBallRun .pi-horizontal-group-item.pi-data-label {
    background-color: #a19b9b;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-SteelBallRun .pi-image-collection-tabs li.current {
    background: #c5ded9;
}
.portable-infobox.pi-theme-SteelBallRun .pi-navigation {
    background: #D4813D !important;
}
/* JoJolion */
.JoJolion, .portable-infobox.pi-theme-JoJolion {
    width: 270px;
    border: 2px solid #53A599;
}
.portable-infobox.pi-theme-JoJolion .pi-title, .portable-infobox.pi-theme-JoJolion .pi-header {
    background-color: #53A599;
    color: white;
}
.portable-infobox.pi-theme-JoJolion .pi-data .pi-data-label {
    background-color: #F8A1E8;
}
.portable-infobox.pi-theme-JoJolion .pi-horizontal-group-item.pi-data-label {
    background-color: #F8A1E8;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-JoJolion .pi-image-collection-tabs li.current {
    background: #e7cdaa;
}
.portable-infobox.pi-theme-JoJolion .pi-navigation {
    background: #53A599 !important;
}

/* TheJOJOLands */
.TheJOJOLands, .portable-infobox.pi-theme-TheJOJOLands {
    width: 270px;
    border: 2px solid #535353;
}
.portable-infobox.pi-theme-TheJOJOLands .pi-title, .portable-infobox.pi-theme-TheJOJOLands .pi-header {
    background-color: #19236d;
    color: white;
}
.portable-infobox.pi-theme-TheJOJOLands .pi-data .pi-data-label {
    background-color: #ca3189;
}
.portable-infobox.pi-theme-TheJOJOLands .pi-horizontal-group-item.pi-data-label {
    background-color: #ca3189;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-TheJOJOLands .pi-image-collection-tabs li.current {
    background: #e7cdaa;
}
.portable-infobox.pi-theme-TheJOJOLands .pi-navigation {
    background: #19236d !important;
}

/* Thus Spoke Kishibe Rohan */
.TSKR, .portable-infobox.pi-theme-TSKR {
    width: 270px;
    border: 2px solid #20445d;
}

.portable-infobox.pi-theme-TSKR .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-TSKR .pi-title, .portable-infobox.pi-theme-TSKR .pi-header {
    background-color: #49885d;
    color: white;
}
.portable-infobox.pi-theme-TSKR .pi-data .pi-data-label {
    background-color: #AD76C9;
}
.portable-infobox.pi-theme-TSKR .pi-horizontal-group-item.pi-data-label {
    background-color: #AD76C9;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-TSKR .pi-image-collection-tabs li.current {
    background: #e7cdaa;
}
.portable-infobox.pi-theme-TSKR .pi-navigation {
    background: #49885d !important;
}

/* Oneshot */
.OneShot, .portable-infobox.pi-theme-OneShot {
    width: 270px;
    border: 2px solid #20445d;
}

.portable-infobox.pi-theme-OneShot .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-OneShot .pi-title, .portable-infobox.pi-theme-OneShot .pi-header {
    background-color: #49885d;
    color: white;
}
.portable-infobox.pi-theme-OneShot .pi-data .pi-data-label {
    background-color: #AD76C9;
}
.portable-infobox.pi-theme-OneShot .pi-horizontal-group-item.pi-data-label {
    background-color: #AD76C9;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-OneShot .pi-image-collection-tabs li.current {
    background: #e7cdaa;
}
.portable-infobox.pi-theme-OneShot .pi-navigation {
    background: #49885d !important;
}

/* Under Execution, Under Jailbreak */
.UEUJ, .portable-infobox.pi-theme-UEUJ {
    width: 270px;
    border: 2px solid #bb5785;
}

.portable-infobox.pi-theme-UEUJ .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-UEUJ .pi-title, .portable-infobox.pi-theme-UEUJ .pi-header {
    background-color: #d8699c;
    color: white;
}
.portable-infobox.pi-theme-UEUJ .pi-data .pi-data-label {
    background-color: #326a94;
}
.portable-infobox.pi-theme-UEUJ .pi-horizontal-group-item.pi-data-label {
    background-color: #326a94;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-UEUJ .pi-image-collection-tabs li.current {
    background: #455699;
}
.portable-infobox.pi-theme-UEUJ .pi-navigation {
    background: #d8699c !important;
}

/* JORGE JOESTAR */
.Jorge, .portable-infobox.pi-theme-Jorge {
    width: 270px;
    border: 2px solid #e03374;
}

.portable-infobox.pi-theme-Jorge .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-Jorge .pi-title, .portable-infobox.pi-theme-Jorge .pi-header {
    background-color: #e03374;
    color: white;
}
.portable-infobox.pi-theme-Jorge .pi-data .pi-data-label {
    background-color: #629a64;
}
.portable-infobox.pi-theme-Jorge .pi-horizontal-group-item.pi-data-label {
    background-color: #629a64;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-Jorge .pi-image-collection-tabs li.current {
    background: #818a94;
}
.portable-infobox.pi-theme-Jorge .pi-navigation {
    background: #e03374 !important;
}

/* Baoh */
.Baoh, .portable-infobox.pi-theme-Baoh {
    width: 270px;
    border: 2px solid #2b6396;
}

.portable-infobox.pi-theme-Baoh .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-Baoh .pi-title, .portable-infobox.pi-theme-Baoh .pi-header {
    background-color: #4B509B;
    color: white;
}
.portable-infobox.pi-theme-Baoh .pi-data .pi-data-label {
    background-color: #7999BC;
}
.portable-infobox.pi-theme-Baoh .pi-horizontal-group-item.pi-data-label {
    background-color: #7999BC;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-Baoh .pi-image-collection-tabs li.current {
    background: #818a94;
}
.portable-infobox.pi-theme-Baoh .pi-navigation {
    background: #4B509B !important;
}

/* GORGEOUS IRENE */
.Irene, .portable-infobox.pi-theme-Irene {
    width: 270px;
    border: 2px solid #E75C1D;
}

.portable-infobox.pi-theme-Irene .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-Irene .pi-title, .portable-infobox.pi-theme-Irene .pi-header {
    background-color: #D58C00;
    color: white;
}
.portable-infobox.pi-theme-Irene .pi-data .pi-data-label {
    background-color: #8FA84D;
}
.portable-infobox.pi-theme-Irene .pi-horizontal-group-item.pi-data-label {
    background-color: #8FA84D;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-Irene .pi-image-collection-tabs li.current {
    background: #818a94;
}
.portable-infobox.pi-theme-Irene .pi-navigation {
    background: #D58C00 !important;
}

/* COOL SHOCK BT */
.CoolShockBT, .portable-infobox.pi-theme-CoolShockBT {
    width: 270px;
    border: 2px solid #3d194a;
}

.portable-infobox.pi-theme-CoolShockBT .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-CoolShockBT .pi-title, .portable-infobox.pi-theme-CoolShockBT .pi-header {
    background-color: #83449a;
    color: white;
}
.portable-infobox.pi-theme-CoolShockBT .pi-data .pi-data-label {
    background-color: #C35622;
}
.portable-infobox.pi-theme-CoolShockBT .pi-horizontal-group-item.pi-data-label {
    background-color: #C35622;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-CoolShockBT .pi-image-collection-tabs li.current {
    background: #C35622;
}
.portable-infobox.pi-theme-CoolShockBT .pi-navigation {
    background: #83449a !important;
}

/* Eccentrics */
.Eccentrics, .portable-infobox.pi-theme-Eccentrics {
    width: 270px;
    border: 2px solid #352466;
}

.portable-infobox.pi-theme-Eccentrics .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-Eccentrics .pi-title, .portable-infobox.pi-theme-Eccentrics .pi-header {
    background-color: #643CD2;
    color: white;
}
.portable-infobox.pi-theme-Eccentrics .pi-data .pi-data-label {
    background-color: #D23F5B;
}
.portable-infobox.pi-theme-Eccentrics .pi-horizontal-group-item.pi-data-label {
    background-color: #D23F5B;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-Eccentrics .pi-image-collection-tabs li.current {
    background: #D23F5B;
}
.portable-infobox.pi-theme-Eccentrics .pi-navigation {
    background: #643CD2 !important;
}

/* ReyInfinito */
.ReyInfinito, .portable-infobox.pi-theme-ReyInfinito {
    width: 270px;
    border: 2px solid #23161d;
}

.portable-infobox.pi-theme-ReyInfinito .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-ReyInfinito .pi-title, .portable-infobox.pi-theme-ReyInfinito .pi-header {
    background-color: #301623;
    color: white;
}
.portable-infobox.pi-theme-ReyInfinito .pi-data .pi-data-label {
    background-color: #e1ddd1;
    color: black !important;
}

.portable-infobox.pi-theme-ReyInfinito .pi-data .pi-data-label a {
    color: black !important;
}

.portable-infobox.pi-theme-ReyInfinito .pi-horizontal-group-item.pi-data-label {
    background-color: #e1ddd1;
    border: 2px solid white;
    border-top: none;
    color: black !important;
}

.portable-infobox.pi-theme-ReyInfinito .pi-horizontal-group-item.pi-data-label a {
    color: black !important;
}

.portable-infobox.pi-theme-ReyInfinito .pi-image-collection-tabs li.current {
    background: #e1ddd1;
}
.portable-infobox.pi-theme-ReyInfinito .pi-navigation {
    background: #301623 !important;
}


/* WEEKLY SHONEN JUMP */
.WeeklyShonenJump, .portable-infobox.pi-theme-WeeklyShonenJump {
    width: 270px;
    border: 2px solid #591817;
}

.portable-infobox.pi-theme-WeeklyShonenJump .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-WeeklyShonenJump .pi-title, .portable-infobox.pi-theme-WeeklyShonenJump .pi-header {
    background-color: #c03a3a;
    color: white;
}
.portable-infobox.pi-theme-WeeklyShonenJump .pi-data .pi-data-label {
    background-color: #98812b;
}
.portable-infobox.pi-theme-WeeklyShonenJump .pi-horizontal-group-item.pi-data-label {
    background-color: #98812b;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-WeeklyShonenJump .pi-image-collection-tabs li.current {
    background: #98812b;
}
.portable-infobox.pi-theme-WeeklyShonenJump .pi-navigation {
    background: #c03a3a !important;
}

/* CRAZY DIAMOND'S DEMONIC HEARTBREAK */
.CDDH, .portable-infobox.pi-theme-CDDH {
    width: 270px;
    border: 2px solid #a12b4c;
}

.portable-infobox.pi-theme-CDDH .pi-data-label a {
  color: white !important;
}

.portable-infobox.pi-theme-CDDH .pi-title, .portable-infobox.pi-theme-CDDH .pi-header {
    background-color: #da4f4f;
    color: white;
}
.portable-infobox.pi-theme-CDDH .pi-data .pi-data-label {
    background-color: #728166;
}
.portable-infobox.pi-theme-CDDH .pi-horizontal-group-item.pi-data-label {
    background-color: #728166;
    border: 2px solid white;
    border-top: none;
    color: white;
}
.portable-infobox.pi-theme-CDDH .pi-image-collection-tabs li.current {
    background: #728166;
}
.portable-infobox.pi-theme-CDDH .pi-navigation {
    background: #e7527b !important;
}

/* Episode Info */
.portable-infobox.pi-theme-wide {
    width: 270px;
}

.portable-infobox .pi-item {
    /* a row */
}

.portable-infobox .pi-item-spacing {
    /* The padding around titles, captions, data, headers, and navigation */
	padding: 0;
}

.portable-infobox .pi-border-color {
    /* The separator between data and groups. */
    border-color: #F0F0F0;
}

.portable-infobox .pi-font {
    /* The font of data values. */
    font-family: 'Rubik';
}

.portable-infobox .pi-secondary-font {
    /* The font of labels, headers, and navigation. */
    color: #fff;
    font-family: 'Rubik';
    letter-spacing: inherit;
    font-weight: normal;
    text-transform: none;
    
    padding: 4px;
}

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

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

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

.portable-infobox .pi-image {
    padding: 0;
    background-image:url('https://static.jojowiki.com/images/customizations/DiamondBG.png');
    margin: 1px;
}

.portable-infobox .pi-image-thumbnail {
    width: 100%;
    height: auto;
}

.portable-infobox .pi-data .pi-data-label {
    /* border-top: 1px solid #999;
    border-bottom: 1px solid #f0f0f0; */
    background-color: #7F83A2;
    font-family: 'Rubik';
    color: white;
    letter-spacing: inherit;
    flex-basis: 40%;
    min-width: 55px;
    font-size: 12px;
    padding-top: 1px;
}

.portable-infobox.pi-theme-wide .pi-data .pi-data-label {
    text-align: center;
    min-width: 50px;
}

.portable-infobox .pi-data .pi-data-value {
    background-image:gradient(linear, 0% 0%, 0% 100%, color-stop(25%, #FFFFFF), color-stop(75%, #f0f0f0));
    background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(25%, #FFFFFF), color-stop(75%, #F0F0F0));
    background-image:-moz-linear-gradient(top, #FFFFFF 25%, #F0F0F0 75%);
    background-image:-o-linear-gradient(top, #FFFFFF 25%, #F0F0F0 75%);
    background-image:-ms-linear-gradient(top, #FFFFFF 25%, #F0F0F0 75%);
}


.portable-infobox .pi-data .pi-data-value:not(:first-child) {
    padding-left: 4px;
    padding: 4px;
}

.portable-infobox .pi-horizontal-group-item.pi-data-label,
.portable-infobox .pi-horizontal-group-item.pi-data-value {
    text-align: center;
    vertical-align: top;
    font-size: 85%;
}


.portable-infobox .pi-horizontal-group {
    width: 102%;
    border-spacing: 0;
    margin-left: -2px;
}

.portable-infobox .pi-horizontal-group-item.pi-data-label {
    background-color: #7F83A2;
    border: 2px solid white;
	border-top: none;
}

.portable-infobox .pi-horizontal-group-item.pi-data-value {
    background-image: gradient(linear,0% 0%,0% 100%,color-stop(25%,#FFFFFF),color-stop(75%,#f0f0f0));
    background-image: -webkit-gradient(linear,0% 0%,0% 100%,color-stop(25%,#FFFFFF),color-stop(75%,#F0F0F0));
    background-image: -moz-linear-gradient(top,#FFFFFF 25%,#F0F0F0 75%);
    background-image: -o-linear-gradient(top,#FFFFFF 25%,#F0F0F0 75%);
    background-image: -ms-linear-gradient(top,#FFFFFF 25%,#F0F0F0 75%);
}

/* Game */
.portable-infobox.pi-theme-Game {
    border: 2px solid #6e7a97;
}
.portable-infobox.pi-theme-Game .pi-title, .portable-infobox.pi-theme-Game .pi-header {
    background-color: #6e7a97;
    color: white;
}
.portable-infobox.pi-theme-Game .pi-data .pi-data-label {
    background-color: #d3d3af;
    color: black !important;
}

.portable-infobox.pi-theme-Game .pi-data .pi-data-label a {
    color: black !important;
}

.portable-infobox.pi-theme-Game .pi-horizontal-group-item.pi-data-label {
    background-color: #d3d3af;
    border: 2px solid white;
    border-top: none;
    color: black;
}
.portable-infobox.pi-theme-Game .pi-image-collection-tabs li.current {
    background: #c7d0e2;
}
.portable-infobox.pi-theme-Game .pi-navigation {
    background: #6e7a97  !important;
}

/*Tabbers*/
/* This is for all tabs */
.portable-infobox .pi-image-collection-tabs li {
  color: #63487f;  
}
/* This is for the current selected tab */
.portable-infobox .pi-image-collection-tabs li.current {
  background: #ffe2ec; /*your color here*/
  color: #63487f;
}

/* Episode is black text */
.portable-infobox .pi-header {
    border-bottom: 2px solid #F0F0F0;
    text-align: center;
    background-color: #8994e7;
    font-size: 16px;
    font-weight: bold;
}

.infoboxtabs2 ul.tabbernav li, .tabbertab ul.tabbernav li, .portable-infobox ul.tabbernav li, .phantom-blood-tabs ul.tabbernav li, .battle-tendency-tabs ul.tabbernav li, .stardust-crusaders-tabs ul.tabbernav li, .diamond-is-unbreakable-tabs ul.tabbernav li, .vento-aureo-tabs ul.tabbernav li, .stone-ocean-tabs ul.tabbernav li, .steel-ball-run-tabs ul.tabbernav li, .jojolion-tabs ul.tabbernav li, .oneshot-tabs ul.tabbernav li {
    padding-top: 0;
}

.portable-infobox.pi-theme-wide .pi-header {
    color: black;
    font-size: smaller;
}

.portable-infobox.pi-theme-wide .pi-horizontal-group {
    width: inherit;
}

.portable-infobox .pi-navigation {
    text-align: center;
}

/************************************/
/********** TABBER DESIGNS *********/
/**********************************/

div.infoboxtabs2 ul.tabbernav li a {
  padding-left: 10px !important;
  padding-right: 10px !important;
  padding-top: 2px !important;
  font-size: 11px !important;
  border-radius: 0 !important;
}

div.multitab ul.tabbernav li a {
  padding-left: 10px !important;
  padding-right: 10px !important;
  padding-top: 2px !important;
  font-size: 11px !important;
  border-radius: 0 !important;
}

/***************************************/
/*               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;
}

.hide {
	visibility: hidden;
}

.visible {
	visibility: visible;
}

.fadein img:hover {
	opacity:0;
	transition:none !important;
	-webkit-transition: none !important;
}

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

/* Hover Box for switching the visibility of the selected item */
.hoverbox { display:inline-block; padding:0em; }
.hoverbox .hoveritem { display:none; margin:0em; padding:0em; }
.hoverbox .hoveritem.selected { display:inline-block; }
.hoverbox:hover .hoveritem { display:inline-block; }
.hoverbox:hover .hoveritem.selected { display:none; }

.customedit { 
  background: url('https://static.jojowiki.com/images/d/d2/Edit.png') no-repeat; 
}

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

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;
}

.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;
}

.diamond {
	background-image:url('https://static.jojowiki.com/images/customizations/DiamondBG.png') !important;
    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');
    background-position: center;
    background-blend-mode: multiply;
}

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

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

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

.cquote {
	line-height: 26px;
}

.mw-body .editsection {
    font-size: 0 !important;
    opacity: 0.5 !important;
}

.mw-body .editsection:hover {
    opacity: 1 !important;
}

/* Tooltips */
/* Main CSS class of the tooltip */
.main-tooltip {
    border: 1px solid #cac4b5;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    margin-bottom: 5px;
    padding: 2px 5px;
    background-color: #fbeecb;
}
 
/* Adds padding to the wrapper to make space for a shadow */
#tooltip-wrapper {
    padding: 3px 7px 2px 3px;
}
 
/* Hides tooltips with redlinks, not yet loaded ones and elements containing tooltip contents for advanced tooltips */
.has-redlinks, .tooltip-loading, .advanced-tooltip .tooltip-contents {
    display: none;
}
 
.tooltips-init-complete {
    cursor: help;
}

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

a[href$=":Vishkugeta"] {
    color: #496cd4 !important;
    font-weight: bold !important;
}

a[href$=":Vish"] {
    color: #496cd4 !important;
    font-weight: bold !important;
}
 
a[href$="User: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;
}

a[href$="User:Sticky_Fingers"] {
	color: #3359CC !important;
	font-weight: bold !important;
	font-style: italic !important;
}

a[href$=":Fr0stiFusionZ"] {
	color: #7ac7e7 !important;
	font-weight: bold !important;
}

a[href$=":FrizzleLamb"] {
	color: #51d359 !important;
	font-weight: bold !important;
}

/* Bureaucrats Roles */
.page-User_Vish #honorific-level:before, .page-User_MetallicKaiser #honorific-level:before {
    content: "Bureaucrat";
    background-color: #ab2222;
    border-radius: 30px;
    padding: 3px 5px;
    font-weight: bold;
    color: white;
}

#honorific-level {margin: 5px 0 0 0 !important;}

/* Moderators Roles */
.page-User_Nabu #honorific-level:before, .page-User_Morganstedmanms #honorific-level:before, .page-User_Fr0stiFusionZ #honorific-level:before, .page-User_FrizzleLamb #honorific-level:before {
    content: "Wiki Moderator";
    background-color: #44446f;
    border-radius: 30px;
    padding: 3px 5px;
    font-weight: bold;
    color: white;
}

/* Bots Roles */
.page-User_Paisley_Park #honorific-level:before, .page-User_Sticky_Fingers #honorific-level:before, .page-User_The_Speedwagon_Foundation #honorific-level:before {
    content: "Automated Bot";
    background-color: #444;
    border-radius: 30px;
    padding: 3px 5px;
    font-weight: bold;
    color: white;
}

.page-User_Paisley_Park #points-level, .page-User_Sticky_Fingers #points-level, .page-User_The_Speedwagon_Foundation #points-level {
    display: none;
}

/**********************************/
/*            NAVBOXES            */
/**********************************/
/* Style for horizontal lists (separator following item).
   @source mediawiki.org/wiki/Snippets/Horizontal_lists
   @revision 8 (2016-05-21)
   @author [[User:Edokter]]
 */
.hlist dl,
.hlist ol,
.hlist ul {
	margin: 0;
	padding: 0;
}
/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
	margin: 0;
	display: inline;
}
/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
	display: inline;
}
/* Hide empty list items */
.hlist .mw-empty-li {
	display: none;
}
/* Generate interpuncts */
.hlist dt:after {
	content: ": ";
}
/**
 * Note hlist style usage differd in
 * the Minerva skin. Remember .hlist is a class defined in core as well! Please check Minerva desktop (and Minerva.css) when changing
 * See https://phabricator.wikimedia.org/T213239
 */
.hlist dd:after,
.hlist li:after {
	content: " · ";
	font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
	content: none;
}
/* Add parentheses around nested lists */
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
	content: " (";
	font-weight: normal;
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
	content: ")";
	font-weight: normal;
}
/* Put ordinals in front of ordered list items */
.hlist ol {
	counter-reset: listitem;
}
.hlist ol > li {
	counter-increment: listitem;
}
.hlist ol > li:before {
	content: " " counter(listitem) "\a0";
}
.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
	content: " (" counter(listitem) "\a0";
}

/* Unbulleted lists */
.plainlist ol,
.plainlist ul {
	line-height: inherit;
	list-style: none none;
	margin: 0;
}
.plainlist ol li,
.plainlist ul li {
	margin-bottom: 0;
}


/* Default style for navigation boxes */
.navbox {                     /* Navbox container style */
	box-sizing: border-box;
	border: 1px solid #a2a9b1;
	width: 100%;
	clear: both;
	font-size: 88%;
	text-align: center;
	padding: 1px;
	margin: 1em auto 0;       /* Prevent preceding content from clinging to navboxes */
	max-width: 100%;
}
.navbox .navbox {
	margin-top: 0;            /* No top margin for nested navboxes */
}
.navbox + .navbox {
	margin-top: -1px;         /* Single pixel border between adjacent navboxes */
}
.navbox-inner,
.navbox-subgroup {
	width: 100%;
}
.navbox-group,
.navbox-title,
.navbox-abovebelow {
	padding: 0.25em 1em;      /* Title, group and above/below styles */
	line-height: 1.5em;
	text-align: center;
}
th.navbox-group {             /* Group style */
	text-align: right;
}
.navbox,
.navbox-subgroup {
	background-color: #fdfdfd; /* Background color */
}
.navbox-list {
	line-height: 1.5em;
	border-color: #fdfdfd;    /* Must match background color */
}
/* cell spacing for navbox cells */
tr + tr > .navbox-abovebelow,
tr + tr > .navbox-group,
tr + tr > .navbox-image,
tr + tr > .navbox-list {    /* Borders above 2nd, 3rd, etc. rows */
	border-top: 2px solid #fdfdfd; /* Must match background color */
}
.navbox th,
.navbox-title {
	background-color: #8a8ac9;      /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
	background-color: #c2c2e0;      /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
	background-color: #a6a6d2;      /* Level 3 color */
}
.navbox-even {
	background-color: #f7f7f7;      /* Even row striping */
}
.navbox-odd {
	background-color: transparent;  /* Odd row striping */
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
	padding: 0.125em 0;       /* Adjust hlist padding in navboxes */
	text-align: center;
}

/* Default styling for Navbar template */
.navbar {
	display: inline;
	font-size: 88%;
	font-weight: normal;
}
.navbar ul {
	display: inline-block;
	white-space: nowrap;
}
.mw-body-content .navbar ul {
	line-height: inherit;
}
.navbar li {
	word-spacing: -0.125em;
}
.navbar.mini li abbr[title] {
	font-variant: small-caps;
	border-bottom: none;
	text-decoration: none;
	cursor: inherit;
	color: white;
}
/* Navbar styling when nested in infobox and navbox */
.infobox .navbar {
	font-size: 100%;
}
.navbox .navbar {
	display: block;
	font-size: 100%;
}
.navbox-title .navbar {
	
	float: left;
	
	text-align: left;
	
	margin-right: 0.5em;
}

.navbox a {
    color: #25053b !important;
}

.navbox-title a {
  color: white !important;
}

/* ==========================
  Gallery
   ==========================*/

.thumbcaption {
    font-size: 90% !important;
    color: #5c5959;
}

div.gallerytext {
    font-size: 75%;
}

.gallerytextwrapper {
  width: 150px !important;
}

.gallerybox .thumb {
  max-width: 170px !important;
}

ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper {
    background: 
rgba(0, 0, 0, 0.8);
color: white;
}

ul.mw-gallery-packed-hover li.gallerybox div.gallerytextwrapper, ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper, ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {
  height: 20% !important;
}

ul.mw-gallery-packed-hover li.gallerybox div.gallerytextwrapper:hover, ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper:hover, ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper:hover {
  height: auto !important;;
}

.page-Special_NewFiles li.gallerybox video  {
  height: 150px !important;

}

.page-Special_NewFiles li.gallerybox div.thumb {
    height: 150px !important;
}

/* CSS Hover Gallery for Mediawiki
 * 
 * @author: Unknown
 * current version crafted together by [[User:Christharp]] from several CSS sites. For my website:[http://www.yellpedia.com/wiki/Main_Page Yellpedia]
 */
 
.zoomimg img:hover {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transition: .2s;
    z-index: 1;
}

.zoom_img img{
	-moz-transition:-moz-transform 0.1s ease-in; 
	-webkit-transition:-webkit-transform 0.1s ease-in; 
	-o-transition:-o-transform 0.1s ease-in;
	transition:transform 0.1 ease-in;
}

.zoom_img img:hover{
	z-index:1;
	box-shadow: 0px 0px 10px #888888;
	position:relative;
	-moz-transform:scale(2); 
	-webkit-transform:scale(2);
	-o-transform:scale(2);
	transform:scale(2);
}



.mw-gallery-packed li.gallerybox div.thumb {
    max-height: 160px;
    margin: 0 !important;
}

.mw-gallery-packed li.gallerybox div.thumb img {
    max-height: 160px;
    max-width: fit-content;
}

.mw-gallery-packed li.gallerybox div.thumb img {
    border: 2px solid black;
}

.mw-gallery-packed .gallerytext {
    background-image: url(https://static.jojowiki.com/images/customizations/DiamondBG.png);
    border: 2px solid black;
    background-blend-mode: soft-light;
    background-color: #aeabbd;
    padding-top: 8px;
    margin-top: 8px;
}

/* ==========================
   Profile
   ==========================*/

#profile-toggle-button {
    background-color: #b0b4cf;
	border: groove #b0b4cf;
}

#profile-toggle-button:hover {
	background-color: #7780b5;
}

#profile-image img {
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    transition: all 0.6s ease;
}
#profile-image:hover img {
    transform: rotate(360deg);
    box-shadow: 0 0 20px black;
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
}

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

.reply {
    width: auto;
}

.f-message {
    width: auto;
}

.r-message {
    width: auto;
}

/* Recent Changes 
.mw-changeslist .special li {
  font-size: 11px; 
  list-style: none;
}*/

/* Poll */
.ajaxpoll .ajaxpoll-id-info {
    display: none;
}

.ajaxpoll {
    width: auto;
}

/* Navbox Mobile */
/* Only for mobile devices */
.onlymobile {
display:none;
}

/* More Button BG */
.vectorMenu {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAIAAADITs03AAAAO0lEQVR4AeSKhREAMQzDdN5/5uixuEKDpqgBjl2f78wd2DVj1+26/h///PfteVMN7zoGebcg1/Y/ZQQAlAUtQCujIJMAAAAASUVORK5CYII=);
}

/* Main Page */

.mainpage-header {
    display: flex;
    margin: 1em 1.75em 1.5em;
}

.mainpage-header .header-intro {
    flex: 2;
}

.mainpage-header .header-intro .mw-headline {
	font-family: Bangers;
}

.mainpage-header .header-intro h2 {
    font-size: 2em;
    border: none;
    margin: 0 0 0.15em;
}

body.wgl-readermode .mainpage-header .header-intro h1 {
    font-size: 2.25em;
}

.mainpage-header .header-intro p {
    font-size: 1.1em;
    line-height: 1.7em;
}

.mainpage-header .header-stats {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -1em;
}

.mainpage-header .header-stats ul {
    list-style: none;
}

.mainpage-header .announcement {
    margin: 0.5em 0 1.5em;
}

.mainpage-header .announcement a {
    background: #f9fafa;
    border: 1px solid #e4eaee;
    color: #5d6773;
    font-size: 0.9em;
    line-height: 1.25em;
    padding: 0.25em 0.75em;
    border-radius: 10em;
    transition: 0.25s ease;
    display: inline-flex;
    align-items: center;
}

.mainpage-header .announcement a:hover {
    text-decoration: none;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
}

.mainpage-header .announcement .announcement-pill {
    background: #6bc71f;
    color: #ffffff;
    font-size: 0.85em;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: 10em;
    padding: 0.1em 0.6em;
    margin: 0 0.5em 0 -0.5em;
}

.mainpage-header .announcement .arrow.dark {
    margin-left: 0.5em;
    filter: invert(50%);
}

#left-navigation { margin-top: 5.4em; }
#right-navigation { margin-top: 5.4em; }

.mw-parser-output .banner-box-2 {
    margin-top: 14em !important;
}

/* Removes External Link Icon */
.mw-parser-output a.external {
    background-image: none;
    padding-right: 0;
}

#ca-talk.new {
    display: none;
}

td.mw-wikiforum-thread-main, td.mw-wikiforum-thread-sub {
    word-break: normal;
}

#p-personal a {
  color: white !important;
  font-weight: 400 !important;
  text-shadow: 1px 1px 3px gray;
}

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

.imgtile {
	transition: 0.4s ease-out;
}
.imgtile:hover {
	transform: scale(1.04);
}
.frontbuttons img {
  border-radius: 5px;
}

.hoverButton img:hover {
    filter: grayscale(100%);
}

/* ==========================
   GALLERIES
   ==========================*/
.mw-gallery-packed-overlay li.gallerybox {
 width:172px!important;
 margin:-3px!important;
 margin-top:0!important
}

.mw-gallery-packed-overlay li.gBoxVideo {
 width:275px !important;
 margin: auto !important;
}

.mw-gallery-packed .gallerybox:hover:not(.zoom_img) {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transition: .2s;
    z-index: 1;
}

.mw-gallery-packed-overlay .gallerybox:hover:not(.zoom_img) {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transition: .2s;
    z-index: 1;
}

.mw-gallery-packed-overlay .gallerybox .thumb a img {
 width:170px!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%;
}

.mw-gallery-packed-overlay .gBoxVideo div {
    width: 275px !important;
    text-align: center;
}

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

ul.mw-gallery-packed-hover li.gallerybox, ul.mw-gallery-packed-overlay li.gallerybox {
	background-color: #3939392e;
}

#p-personal ul {
    padding-left: 0;
}


#p-personal {
	right: 0;
    padding: 2px 12px 2px 0;
    border-radius: 2px 2px 10px 10px;
    border-style: solid;
    border-color: #7F83A2;
	border-width: 2px;
	top: -0.09em;
	background-color:#9da1c0;
	box-shadow: 1px 1px 2px #4c4f67;
}

#points-level {
    background-color: #e0c9ed;
    border-radius: 30px;
}

.profile-tab-on {
    background-color: #2e354e;
    padding: 6px 6px 3px 5px;
    border-radius: 30px;
    font-size: 13px;
}

.profile-tab {
    background-color: #595f7f;
    padding: 6px 6px 3px 5px;
    border-radius: 30px;
    font-size: 13px;
}

.profile-tab-on a, .profile-tab a {
  color: white !important;
}

.eye-container .title {
    color: #000;
}


.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: 12%;	
 text-decoration: none;
}

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

pre, .mw-code {
    overflow: auto;
}

table.mw-wikiforum-footerrow {
    font-size: 15px;
}

.wikiforum-avatar-image {
    float: left;
    padding: 5px;
    background-color: #e5eaff;
	border: 2px solid white;
    margin-right: 20px;
}

td.mw-wikiforum-thread-main, td.mw-wikiforum-thread-sub {
    padding-bottom: 20px;
    padding-top: 10px;
}
td.mw-wikiforum-thread-main {
    border: 1px solid #454671;
    border-radius: 20px;
}

td.mw-wikiforum-thread-sub {
	border: 1px solid #4d2b51;
	background: #ede8ff;
	border-radius: 20px;
}

th.mw-wikiforum-thread-top {
	border: 1px solid #4d2b51;
	background: url(https://static.jojowiki.com/images/customizations/DiamondBG.png);
}

/* BLOGS */
p.main-page-sub-links {
	font-size: 20px;
    font-family: 'Rubik',sans-serif;
}

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

.whitelink a {
	color: white !important;
}

.castImg img {
	max-width: 80px;
	max-height: 80px;
}

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

.resizeImg img {
height:120px;
width: auto;
max-width: 120px;
box-shadow: 0 1px 1px 4px black;
}

.resizeImg2 img {
	max-height: 120px;
	width: auto;
	max-width: 120px;
}

.noresizeimg img {
	height: initial;
	width: initial;
	max-width: initial;
	box-shadow: initial;
}

.charbox { width: 133px; }

@media only screen and (max-width:600px)
{
.charbox
{
width: 50px;
}
}

.hubbox { width: 200px; }

.hubbox img {
	max-height: 300px;
}

@media only screen and (max-width:600px)
{
.hubbox
{
width: 150px;
}
}

.charicon { padding: 5px; border: 2px solid white; width: 120px; height:120px; text-align: center; }

.charicon2 { padding: 5px; border: 2px solid white; width: 120px; height:auto; text-align: center; }

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

.mainpage-shadowbox .mw-headline-headanchor {
  display: none;
}

.profile-on {
    background-color: #39486b;
}

.external {
    background-position: 100% !important;
}

.mw-ui-button {
    background-color: #f8f9fa;
    color: #222222;
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    min-width: 4em;
    max-width: 28.75em;
    margin: 0;
    padding: 0.57142857em 0.9375em;
    border: 1px solid 
    #a2a9b1;
    border-radius: 2px;
    font-family: inherit;
    font-size: 1em;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    zoom: 1;
    vertical-align: middle;
    cursor: pointer;
}

.cbox a {
  color: white !important;
}

.ppprarity img {
	height: auto !important;
	box-shadow: none !important;
}

#headertabs.ui-widget-content {
  background: none !important;
  border: none !important;
}

#headertabs.ui-tabs .ui-tabs-panel {
    padding: initial;
}

#headertabs.ui-tabs .ui-tabs-nav {
    padding: 0;
}

.mw-header-tabs-wrapper .oo-ui-tabSelectWidget {
  border: 1px solid #a2a9b1;
}

#headertabs .oo-ui-panelLayout-framed {
  border: none !important;
}


#mw-panel .portal {
    margin: 0 .6em 0 0em;
    padding: 0;
}


.skin-minerva #footer, .skin-minerva #mw-head-base, .skin-minerva #content {
    margin-left: 0;
}

.skin-minerva .content table {
    margin: 0 !important;
}

.whitelink a {
    color: #fff;
}

.whitecollapse .mw-collapsible-text {
    color: white !important;
}

/* POPUPS*/
.mwe-popups.mwe-popups-is-tall .mwe-popups-discreet .mwe-popups-thumbnail {
    object-position: top;
}

/* Logos */
.page-Phantom_Blood:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/b/b4/Phantom_Blood_Logo.png);
    width: 90%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: left !important;
    display: inline-block;
}

.page-Battle_Tendency:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/6/60/Battle_Tendency_Logo.png);
    width: 100%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: left !important;
    display: inline-block;
}

.page-Stardust_Crusaders:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/b/b6/Stardust_Crusaders_Logo.png);
    width: 120%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-Diamond_is_Unbreakable:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/8/8c/Diamond_is_Unbreakable_Logo.png);
    width: 130%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-Vento_Aureo:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/3/30/Vento_Aureo_Logo.png);
    width: 80%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-Stone_Ocean:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/7/79/Stone_Ocean_Logo.png);
    width: 80%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-Steel_Ball_Run:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/d/d9/Steel_Ball_Run_Logo.png);
    width: 90%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-JoJolion:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/5/59/JoJolion_Logo.png);
    width: 65%;
    height: 75px;
    background-size: 30%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-Thus_Spoke_Kishibe_Rohan:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/8/8b/Thus_Spoke_Kishibe_Rohan_Logo.png);
	width: 100%;
	height: 55px;
	background-size: 45%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-JORGE_JOESTAR_Novel:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/2/29/latest/20220921012211/JORGE_JOESTAR_Logo.png);
	width: 100%;
	height: 55px;
	background-size: 45%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-The_Lives_of_Eccentrics:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/4/43/latest/20230113201118/LivesofEccentricslogo.png);
	width: 90%;
	height: 55px;
	background-size: 45%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

.page-Rey_infinito:not(.action-history):not(.action-edit) .firstHeading i {
    opacity: 1 !important;
    background-image: url(https://static.jojowiki.com/images/8/87/latest/20230113200445/Rey_infinito_Logo.png);
	width: 100%;
	height: 55px;
	background-size: 18%;
    color: rgba(0, 0, 0, 0) !important;
    background-repeat: no-repeat;
    background-position: unset !important;
    display: inline-block;
}

html .thumbcaption {
	padding: 0 !important;
	padding-left: 3px !important;
}

.floatright {
	clear: right !important;
}

.supalt {
	line-height: 0;
	font-size: 70%;
	vertical-align: top;
	display: inline-block;
}

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

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

.floatleft {
	padding-right: 10px;
}

.hoverspin img {
	transition: transform .8s ease-in-out;
}

.hoverspin img:hover {
	transform: rotate(360deg);
}

/* FONTS */
/* bangers-regular - vietnamese_latin-ext_latin */
@font-face {
  font-family: 'Bangers';
  font-style: normal;
  font-weight: 400;
  src: local('Bangers'), 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'), 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('Quicksand'),
       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('Roboto Slab'),
       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;
}

/* roboto-regular - vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v20-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('../fonts/roboto-v20-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v20-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v20-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v20-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v20-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.svg#Roboto') format('svg'); /* Legacy iOS */
   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;
}

#msupload-div {
    background: #8da3ba;
}

#msupload-dropzone {
    border: 1px dashed #668bd5;
    color: #fff;
}

div#amzn-native-ad-0 div.amzn-native-product {
    margin: 0 !important;
}

.tabs-tabbox > .tabs-container {
    padding: 2px 0;
    line-height: 1;
}

.tabs-input-1:checked ~ .tabs-container .tabs-content-1, .tabs-input-2:checked ~ .tabs-container .tabs-content-2, .tabs-input-3:checked ~ .tabs-container .tabs-content-3, .tabs-input-4:checked ~ .tabs-container .tabs-content-4, .tabs-input-5:checked ~ .tabs-container .tabs-content-5, .tabs-input-6:checked ~ .tabs-container .tabs-content-6, .tabs-input-7:checked ~ .tabs-container .tabs-content-7, .tabs-input-8:checked ~ .tabs-container .tabs-content-8, .tabs-input-0:checked ~ .tabs-container .tabs-content-1 {
    width: 100%;
}

.signature img {
	background-image: none !important;
}

.diamond .mw-collapsible-toggle a {
    color: white !important;
}

.epsbox .mw-collapsible span.mw-collapsible-toggle {
    float: left;
    padding-left: 41.5%;
    width: 200px;
    padding-right: 39%;
    font-size: 12px;
}

.mwe-popups.mwe-popups-type-reference .mwe-popups-title {
    display: none;
}

.mwe-popups.mwe-popups-type-reference .mwe-popups-extract {
    font-size: 12px;
}

.mw-content-ltr ul.gallery {
  margin: unset;
}

.diffbox img {
  width: 280px;
  height: 380px;
}

.mcbutton {
    filter: unset;
    font-size: 12px;
    border-radius: 6px;
}

.mcbutton.mw-ui-button:hover {
    background-color: #383838;
    color: white;
}

.mw-header {
    overflow: hidden;
}

.rowbox tr {
	height: 125px;
}

.ext img {
    max-width: 500px;
    max-height: 350px;
}

.portable-infobox .ext img {
  width: -moz-available;
  width: -webkit-fill-available;
  width: stretch;
}

.ext2 img {
    max-width: 180px;
    max-height: 180px;
}

.ext4 img {
    min-width: 274px;
    max-width: 274px;
}

.ext5 img {
    min-width: 200px;
    max-width: 200px;
}

.ext6 img {
    max-width: 120px;
}

.extblur {
    overflow: hidden;
    max-width: min-content;
    max-height: min-content;
}

.ext, .ext4, .ext2 .external {
    background-image: none;
    padding-right: 0px;
}

.extnsfw img {
      transition: 0.3s;
      filter: blur(10px);
}

.extnsfw img:hover {
      filter: blur(0);
 }

.boxAnchorLink {
	float: right;
}

.tabbertab:not(:first-child) {
	display: none;
}

.jcarousel-item:not(:first-child) {
    display:none;
}

.flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.flex-left {
	display: flex;
	flex-wrap: wrap;
}

/* Main Page */
.page-JoJo_Wiki h1.firstHeading {
	display: none;
}

/* Tabber */
ul.tabbernav {
    border-bottom: 0 !important;
    padding: 3px 0 !important;
    text-align:center;
}

ul.tabbernav li a {
    border: 1px solid #838282;
    border-radius: 1px;
    margin:0 !important;
    padding:2px 12px !important;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.75);
    font-size: 13px !important;
    cursor: default !important;
    color: #8765ab !important;
}
ul.tabbernav li:first-child a {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}
ul.tabbernav li:last-of-type a {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

ul.tabbernav li a:active {
    background: #f0f0f0 !important;
}
ul.tabbernav li.tabberactive a {
    background: linear-gradient(#9ca6cc,#7a78ad) !important;
    color:white !important;
}

ul.tabbernav li a:hover {
    background: #cbc5c5;
}

ul.tabbernav li {
    padding-top: 0 !important;
    line-height: 20px !important;
}

ul.tabbernav li.tabberactive a:active {
    background:linear-gradient(#687194,#444269) !important;
    color:white !important;
    border: none !important;
}

ul.tabbernav li.tabberactive a:hover {
    background:linear-gradient(#687194,#444269) !important;
    color:white !important;
    border-bottom: none !important;
}

.portable-infobox .pi-data .pi-data-value:first-child .image img {
  width: 270px;
}

.pi-data-value .wikipedia {
  display:revert;
}

.wikipedia:after {
  content:"";
  background: url(https://static.jojowiki.com/images/5/5a/latest/20200410062156/Wikipedia%27s_W.svg) no-repeat;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  padding-right: 0.55em; /* sizing */
  padding-top: 1.2em;
  margin-left: -0.4em;
  margin-right: -0.2em;
  padding-left: 0.05em;
}

.tbox ul.tabbernav {
	text-align: left;
}

.vidPlayer {
	margin: 0.3em 0.3em 0 0 !important;
}

.vidPlayer .tright {
	margin: 0.5em 0 1.3em 1.4em !important;
}

.mnbox .cquote {
  margin-top: 5px;
}

.twitter-follow-button {
    font-size: 11px !important;
}

.mw-diff-movedpara-left, .mw-diff-movedpara-right, .mw-diff-movedpara-left:visited, .mw-diff-movedpara-right:visited, .mw-diff-movedpara-left:active, .mw-diff-movedpara-right:active {
    color: transparent !important;
}

.filehistory td:last-child {
    word-break: break-word;
}

hr {
	display: flex;
}

.gallerytextwrapper {
  z-index: 100;
}

.small {
	font-size:smaller;
}

.la-dropdown {
    position: absolute;
    font-weight: bold;
    font-size: 80%;
    white-space: nowrap;
    border: 1px solid #838282;
    border-radius: 2px;
    font-family: Rubik;
    margin-bottom: 10px;
    padding: 6px;
    box-shadow: 1px 1px 2px rgb(0 0 0 / 75%);
    cursor: default;
    right: 0;
    top: -90px;
    background: no-repeat url(/extensions/UniversalLanguageSelector/lib/jquery.uls/images/language.svg?80b0b) center #efefef;
    width: 15px;
    height: 15px;
    box-shadow: 1px 1px 2px rgb(0 0 0 / 75%);
}

.mw-content-rtl .la-dropdown {
  right: auto !important;
  left: 40px !important;
}

.skin-minerva .la-dropdown {
	top: -80px;
	right: 0px;
}
	
.la-dropbox {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    z-index: 1;
    border-radius: 7px;
    border: 1px solid darkgray;
    min-width: 120px;
    padding: 7px 0;
    white-space: nowrap;
}

.la-box {
    padding-right: 7px;
    padding-left: 7px;
}

.la-dropdown:hover .la-dropbox {
  display: block;
  padding-left: 7px;
  padding-right: 7px;
  margin-left: -110px;
  font-weight: normal;
  margin-top: 20px;
  z-index: 9999;
}

.la-dropdown:hover {
    background-color: #e1e1e1;
}

span.subpages {
  display: none;
}

#headertabs .ui-state-default {
  clear: right;
}

.mw-helplink {
  display: none !important;
}

.twitter-timeline.twitter-timeline-rendered {
    margin-left: auto;
    margin-right: auto;
}

.pl-5 {
	padding-left: 5px;
}

.ui-widget-content {
  color: revert !important;
}

.head-icons-wrapper {
  display: inline;
  position: absolute;
  right: 0;
  bottom: 20px;
  top: -5px;
  max-width: 230px;
  line-height: 0;
}

.head-icon {
  display: inline-block;
  padding: 0px 1px 0px 1px;
  height: 25px;
}

@media (min-width:730px) {
	.break {
	  flex-basis: 100%;
	  height: 0;
	}
}

.rtl .firstHeading {
  /* @noflip */ background-position: left center !important;
}

.cn-list {
  list-style-type: none !important;
  margin: 0.3em 0 0 0.5em;
}

.tabber .tabbertab {
	padding: 0;
}

/* Tabber Neue */

.tabber__tabs {
  display: block;
  text-align: center;
}

.tabber__header {
  margin-left: auto;
  margin-right: auto;
}

/* For tabs in older browsers to work in infoboxes */
.portable-infobox .pi-data-value:nth-child(1) .tabber__header {
	margin-left: 0;
	width: 270px;
}

.portable-infobox .pi-data-value:nth-child(1) .tabber__tabs {
	box-shadow: none;
}

.tabber__tab[aria-selected="true"] {
 background:linear-gradient(#9ca6cc,#7a78ad) !important;
 color:white !important;
}

.tabber__tab[aria-selected="true"]:hover {
 background:linear-gradient(#687194,#444269) !important;
 color:white !important;
}

.tabber__tab {
  border: 1px solid #838282;
  border-radius: 1px;
  background-color: #efefef;
  padding: 0px 12px !important;
  color: #8765ab !important;
  font-size: small;
}

.tabber__tab:hover {
  background: #cbc5c5;
}

.tabber__panel {
	overflow: hidden;
}

.tabber__indicator {
  background: #595c8d;
  display: none;
}

.tabber__header {
    height: auto !important;
    box-shadow: none !important;
}

.tabber__header:after {
    display: none;
}

.tabber__section {
    scroll-snap-type: unset;
}

#mw-panel .vector-menu-portal:not(#p-navigation) ul {
  list-style-type: "\2605";
  list-style-position: inside;
  color: var(--jjbe4);
}

#mw-panel .vector-menu-portal:not(#p-navigation) li span {
  padding-left: 2px;
}

.visualClear { clear: both; }

#p-cactions, #ca-mobile {
    background-image: linear-gradient(to top,#77c1f6 0,#e8f2f8 2px,#ffffff 100%);
}

.mw-ui-button:not(.mw-ui-icon-element) {
  min-height: unset !important;
}

.PBBTTitle {
  background: linear-gradient(to right,var(--pb),var(--bt)),url(https://static.jojowiki.com/images/customizations/DiamondBG.png) !important;
  background-position: center !important;
}

.PBBTChTitles {
  background: linear-gradient(to right,var(--pb),var(--bt)) !important;
}

.tabs-content .tabber__tabs .tabber__tab {
  height: 25px;
}

.tabs-container {
  border: none !important;
}

.tabs-content {
  margin-top: 5px;
}

.tabs-label {
  border-bottom: 1px solid #AAA !important;
}

li#pt-darkmode span {
  width: 18px;
  min-width: 18px;
  background-size: 18px;
  display: block;
  background-repeat: no-repeat;
  background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg height='21' viewBox='0 0 21 21' width='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m8.85464918.37900488c-1.91149353 1.51069427-3.13816124 3.84973402-3.13816124 6.47527736 0 4.55564936 3.69308349 8.24873286 8.24873286 8.24873286 2.5815709 0 4.8861545-1.1859235 6.3986798-3.0426994-.8206378 4.7389755-4.9523867 8.343122-9.9259291 8.343122-5.56375572 0-10.07407088-4.5103151-10.07407088-10.0740709 0-5.02506013 3.67919933-9.19079725 8.49074856-9.95036192z' fill='%234c4e5d' fill-rule='evenodd'/%3E%3C/svg%3E");
  cursor: pointer;
  opacity: 1;
  height: 18px;
  margin-bottom: -3px;
  margin-top: -5px;
}

.embedvideo p {
  margin: 0 !important;
}

figcaption {
  background-image: url(https://static.jojowiki.com/images/customizations/SmallDarkDiamondBG.png) !important;
  color: #fff !important;
  background-size: contain;
  text-align: center;
  border: 2px solid black;
}

.vidPlayer .thumbcaption {
  background-image: url(https://static.jojowiki.com/images/customizations/SmallDarkDiamondBG.png) !important;
  color: #fff !important;
  background-size: contain;
  border: 2px solid black;
}

.vidPlayer {
  vertical-align: top;
}

.galleryVideo .gallerytextwrapper {
  width: auto !important;
}