MediaWiki:Common.css

/* CSS placed here will be applied to all skins */

@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:ModernProfile/Masthead.css|u:dev:MediaWiki:ModernProfile/Wall.css");
@import url('https://fonts.googleapis.com/css?family=Nunito');
@import url('https://fonts.googleapis.com/css?family=Archivo+Black&display=swap');
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:TransparentToolbar.css&only=styles";
@import url("/load.php?mode=articles&articles=u:dev:MediaWiki:MinimalistSliderText/code.css&only=styles");

/* h2 */
h2 {
    border-bottom: 4px solid hsla(175, 55%, 41%, 0.2);
}
 
/* bullet points */
ul {
	list-style-image:url('https://vignette.wikia.nocookie.net/animalrestaurant/images/7/7a/Bullet.png');
}
.wds-list {
	list-style-image: none !important;
	list-style-type: none;
}
/* Flowers */
[href$="/wiki/Rose"] {
    color: #C76E53;
    font-weight: 700;
}
 
[href$="/wiki/Daisy"] {
    color: #E4D4B6;
    font-weight: 700;
}
 
[href$="/wiki/Sunflower"] {
    color: #E9AD50;
    font-weight: 700;
}
 
[href$="/wiki/Bluebell"] {
    color: #9977BE;
    font-weight: 700;
}
    
[href$="/wiki/White_Rose"] {
    color: #E4D4B6;
    font-weight: 700;
}
    
[href$="/wiki/Four_Leaf_Clover"] {
    color: #C2AD58;
    font-weight: 700;
}
    
[href$="/wiki/Sakura"] {
    color: #EC9A7F;
    font-weight: 700;
}
    
[href$="/wiki/Maple_Leaf"] {
    color: #EF8A2C;
    font-weight: 700;
}
    
[href$="/wiki/Snowflake"] {
    color: #B8D0D5;
    font-weight: 700;
}

/* TOC */
 
.toc,
#toc,
.WikiaArticle .toc {
    border:1px solid silver;
    float:center;
    clear:center;
    width:250px;
    min-width:200px;
    text-align:left;
    padding-left: 5px;
}

.WikiaArticle #toctitle {
    color: #2fa298;
    font-weight: bold;
    font-size: 15px;
}

/* User Pages */

.avatar {
    border-radius: 100px;
    border: 1px solid lightgray;
}

.UserProfileMasthead .masthead-info {
    overflow:hidden;
}

/* Infobox */
 
.pi-theme-box {
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    width: 35%;
}

.pi-theme-box .pi-title {
    background-color: #2fa298;
    font-size: 19px;
    text-align: center;
    padding: 0;
    color: #f7f6f4;
}

.pi-theme-box .pi-navigation {
    font-size: 13px;
    font-weight:normal;
    background-color: hsla(40, 16%, 96%, 0.1);
}

.pi-theme-box .pi-header {
    background-color: #2fa298;
    max-height: 5px;
}

.pi-theme-box .pi-data-value {
    overflow-y: auto;
    /*background-color: hsla(40, 16%, 96%, 0.1);*/
    padding-right: 5px;
    text-align:right;
}

.pi-theme-box .pi-border-color {
    border: none;
}

/* S4 */

.pi-theme-s4 {
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    width: 35%;
}

.pi-theme-s4 .pi-title {
    background-color: #86c8d6;
    font-size: 19px;
    text-align: center;
    padding: 0;
    color: #f7f6f4;
}

.pi-theme-s4 .pi-border-color {
    border: none;
}

.pi-theme-s4 .pi-navigation {
   font-size: 13px;
   font-weight:normal;
   background-color: hsla(40, 16%, 96%, 0.1);
}

.pi-theme-s4 .pi-header {
    background-color: #86c8d6;
    max-height: 5px;
}

.pi-theme-s4 .pi-data-value {
    color: #94b2c7;
    padding-right: 5px;
    font-weight: 700;
    border: 0px solid #f7f6f4;
    font-size: 15px;
    text-align:right;
}

/* S1 */

.pi-theme-s1 {
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    width: 35%;
}
    
.pi-theme-s1 .pi-border-color {
    border: none;
}

.pi-theme-s1 .pi-title {
    background-color: #ee9395;
    font-size: 19px;
    text-align: center;
    padding: 0;
    color: #f7f6f4;
}

.pi-theme-s1 .pi-image {
    border: 0px solid #f7f6f4;
    margin: 0px;
}

.pi-theme-s1 .pi-navigation {
   font-size: 13px;
   font-weight:normal;
   background-color: hsla(40, 16%, 96%, 0.1);
}

.pi-theme-s1 .pi-header {
    background-color: #ee9395;
    max-height: 5px;
}

.pi-theme-s1 .pi-data-value {
    overflow-y: auto;
    color: #d58068;
    /*background-color: hsla(40, 16%, 96%, 0.1);*/
    padding-right: 5px;
    font-weight: 700;
    font-size: 15px;
    text-align:right;
}

/* S2 */
.pi-theme-s2 {
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    width: 35%;
}
    
.pi-theme-s2 .pi-border-color {
    border: none;
}

.pi-theme-s2 .pi-title {
    background-color: #d7c04a;
    font-size: 19px;
    text-align: center;
    padding: 0;
    color: #f7f6f4;
}

.pi-theme-s2 .pi-image {
    border: 0px solid #f7f6f4;
    margin: 0px;
}

.pi-theme-s2 .pi-navigation {
    font-size: 13px;
    font-weight:normal;
    background-color: hsla(40, 16%, 96%, 0.1);
}

.pi-theme-s2 .pi-header {
    background-color: #d7c04a;
    max-height: 5px;
}

.pi-theme-s2 .pi-data-value {
    overflow-y: auto;
    color: #98944a;
    padding-right: 5px;
    font-weight: 700;
    font-size: 15px;
    text-align:right;
}

/* S3 */
.pi-theme-s3 {
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    width: 35%;
}
    
.pi-theme-s3 .pi-border-color {
    border: none;
}

.pi-theme-s3 .pi-title {
  background-color: #e9aa55;
  font-size: 19px;
  text-align: center;
  padding: 0;
  color: #f7f6f4;
}

.pi-theme-s3 .pi-image {
    border: 0px solid #f7f6f4;
    margin: 0px;
}

.pi-theme-s3 .pi-navigation {
   font-size: 13px;
   font-weight:normal;
   background-color: hsla(40, 16%, 96%, 0.1);
}

.pi-theme-s3 .pi-header {
    background-color: #e9aa55;
    max-height: 5px;
}

.pi-theme-s3 .pi-data-value {
    overflow-y: auto;
    color: #df8e4a;
    padding-right: 5px;
    font-weight: 700;
    font-size: 15px;
    text-align:right;
}

.pi-theme-food {
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    width: 40%;
    float: center;
}

.pi-theme-food .pi-title {
    background-color: #2fa298;
    font-size: 19px;
    text-align: center;
    padding: 0;
    color: #f7f6f4;
}

.pi-theme-food .pi-image {
    height: 50%;
    marigin-top: 20px;
    marigin-bottom: 20px;
}

.pi-theme-food .pi-navigation {
    font-size: 13px;
    font-weight:normal;
    background-color: hsla(40, 16%, 96%, 0.1);
    border-bottom: 1px solid silver;
}

.pi-theme-food .pi-header {
    background-color: #2fa298;
}

.pi-theme-food .pi-data-value {
    overflow-y: auto;
    background-color: hsla(40, 16%, 96%, 0.1);
    padding-right: 5px;
    text-align:left;
}

.pi-theme-food .pi-border-color {
    border: none;
}

/* Tables */

.facilities {
    width: 100%;
    margin: 0 auto;
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    text-align: center;
    border-spacing: 0.3em;
}

.facilities th {
    background: #b0d3ce;
    text-align: left;
    padding-left: 10px;
}

.facilities td {
    background: #f4e7c5;
    border-radius: 20px;
    padding: 30px 0px 30px 0px;
}

.facilitiesrow td {
    background-color: hsla(40, 16%, 96%, 0.1);
    padding: 0px;
}

/* Other */
/* Old Table */
.base,
.base2 {
    width: 100%;
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    text-align: center;
    margin-bottom: 10px;
}

.base th {
    background: #2fa298;
    text-align: left;
    padding-left: 10px;
}

.base td {
    background-color: hsla(40, 16%, 96%, 0.1);
    min-height: 80px;
}

.base2 th {
    background: #2fa298;
    text-align: center;
}

.base2 td {
	background-color: hsla(40, 16%, 96%, 0.1);
	text-align: center;
}
/* New Table */
.smalltable {
	margin: auto;
	width: 40%;
	background-color: hsla(40, 16%, 96%, 0.1);
	text-align: center;
	border: 1px solid silver;
	border-collapse: collapse;
}
.smalltable th {
	background: #2fa298;
    text-align: center;
    padding: 6px 12px;
    color: #eff3f0;
}

.mediumtable {
	margin: auto;
	width: 60%;
	background-color: hsla(40, 16%, 96%, 0.1);
	text-align: center;
	border: 1px solid silver;	
	border-collapse: collapse;
}
.mediumtable th {
	background: #2fa298;
    text-align: center;
    padding: 6px 12px;
    color: #eff3f0;
}

.fulltable {
	width: 100%;
	background-color: hsla(40, 16%, 96%, 0.1);
	text-align: center;
	border: 1px solid silver;
	border-collapse: collapse;
	margin: 1em 1em 1em 0;
}
.fulltable th {
	background: #2fa298;
    text-align: center;
    padding: 6px 12px;
    color: #eff3f0;
}

.facilitytable {
	width: 100%;
	background-color: hsla(40, 16%, 96%, 0.1);
	text-align: left;
	border: 1px solid silver;
	border-collapse: collapse;
	font-size: 12px;
	margin: 1em 1em 1em 0;
}
.facilitytable th,
.facilitytable td {
	border-bottom: 1px solid #D3D3D3;
	padding: 6px 12px;
}
.facilitytable th {
	color: #eff3f0;
	background: #2fa298;
    text-align: center;
}

.white {
    width: 100%;
    background: #2fa298;
    border: 1px solid silver;
    text-align: left;
    border-spacing: 0.3em;
}

.white td {
	background-color: hsla(40, 16%, 96%, 0.1);
}

/* Tabbers */

ul.tabbernav {
    border: none;
}

.tabberlive .tabbertab {
    border:none;
    padding:0;
}

ul.tabbernav li.tabberactive a,
ul.tabbernav li.tabberactive a:hover {
    background-color: #2fa298;
    color: #f7f6f4;
    padding-right:7px;
    border: 0px;
}

ul.tabbernav li a {
    background-color: #e7edea;
    border-radius: 0;
    padding-right:7px;
    transition: background-color 0.2s;
    font-size: 15px;
    color: #3a3a3a;
    border: 0px;
}
 
ul.tabbernav li a:hover {
    background-color: #f7f6f4;
    color: rgba(58, 58, 58, 0.6);
    border: 0px;
}

.tabbernav li a[title="Main"]::after {
    content: url(https://vignette.wikia.nocookie.net/animalrestaurant/images/f/f2/ArrowDown.png/revision/latest/scale-to-width-down/15);
    padding-left:7px;
    position:relative;
}
 
.tabbernav li a[title="Story"]::after {
    content: url(https://vignette.wikia.nocookie.net/animalrestaurant/images/f/f6/SpeechBubble.png/revision/latest/scale-to-width-down/15);
    padding-left:7px;
    position:relative;
}

.tabbernav li a[title="Mini-Game"]::after {
    content: url(https://vignette.wikia.nocookie.net/animalrestaurant/images/0/0c/Game.png/revision/latest/scale-to-width-down/15);
    padding-left:7px;
    position:relative;
}

.WikiaArticle ul {list-style-image:url('https://vignette.wikia.nocookie.net/animalrestaurant/images/7/7a/Bullet.png');}

:root {
    --toolbar-bgcolor: rgba(156, 191, 186, 0.75);
}

.wds-community-header__sitename {
    font-family: 'Nunito';
}
 
.wds-community-header {
    border-bottom: 1px solid silver;
}

.WikiaPage {
    border:2px solid #cfe0d6;
    border-top: 0px;
}

.wds-community-header:before {
    border: 2px solid #cfe0d6;
    border-bottom: 0;
}

#WikiaPage {
    font-family: 'Nunito';
}

/* Modifies the "edit section" button */

.editsection a {
    color: #daa238;
    font-family: 'Archivo Black';
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:0px;
    font-style: none;
}
 
/* Removing  "Edit" Icon */

.WikiaArticle .editsection img {
    display:none;
}

/* Name Colors */

a[href="/wiki/User:Mieiki"] {
    font-weight: bold;
    color:#a6d2cc;
}

a[href="/wiki/User:Megatron88"] {
    font-weight: bold;
    color:#ffbcc5;
}

a[href="/wiki/User:Tangerinan"] {
    font-weight: bold;
    color:#a6d2cc;
}

/* Minimal Scrollbar */

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(50,50,50,0.5);
}

::-webkit-scrollbar-thumb:hover {
    background-color: rgba(40,40,40,0.75);
}

::-webkit-scrollbar-thumb:active {
    background-color: rgba(30,30,30,1);
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

/* Spec Version (Gecko only at the time of this addition) */
*, body {
   scrollbar-width:thin;
   scrollbar-color:rgba(50,50,50,0.5) transparent;
}

/* Wikia Rail */

.WikiaRail .rail-module {
    margin: 0 0 30px;
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    border-top: 8px solid #2fa298;
    padding: 20px 15px 20px;
}
 
.WikiaRail .module {
    margin: 0 0 30px;
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
    border-top: 8px solid #2fa298;
    padding: 20px 15px 20px;
}

/* Category */

.WikiaArticleCategories, .article-categories, .CategorySelect .articlePage {
    background-color: hsla(40, 16%, 96%, 0.1);
    border: 1px solid silver;
}

/* Wordmark animation */

.wds-community-header__wordmark:hover {
    animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
}

@keyframes shake {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }
 
    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }
 
    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }
 
    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}

.wikiaPhotoGallery-slider-body .description h2 {
    --mst-main: rgba(176,211,206,0.9);
    box-shadow: none;
    border-radius: 2px 2px 0 0;
}

.wikiaPhotoGallery-slider-body .description p {
    --mst-secondary: rgba(176,211,206,0.9);
}

.wikiaPhotoGallery-slider-body .horizontal .description {
    height:initial;
    padding: 0 5px;
}

.article-comments img[alt="A FANDOM user"] {
    content: url("https://vignette.wikia.nocookie.net/animalrestaurant/images/0/0e/EGbO2vqU4AAdJsS.jpg");
}

.bannercolumn {
  float: left;
  width: 25%;
  padding: 5px;
}

/* Clearfix (clear floats) */
.bannerrow::after {
  content: "";
  clear: both;
  display: table;
}

/*Main Page*/
.mainbox {
	margin:5px 5px 5px 0px;
	border:4px solid white; 
	border-radius:10px; 
	width:100%
}

.mainheader {
	text-transform:uppercase; 
	font-size:120%; 
	font-weight:bold; 
	width:100%; 
	text-align:center; 
	color:#7a5040; 
	background-color:#daf3d6;
}

.maingraphic {
	background-color:#daf3d6; 
	border-radius:10px; 
    margin:5px 5px 5px 0px;
	padding:10px 0px 10px 0px; 
	border:4px solid white; 
	width:100%; 
	text-align:center;
}

.foodbg {
	background-image:url(/images/0/0e/FoodBackground.png);
	width: 100%;
}

.fluid img {
    width: 100%;
    max-width: 750px;
    height: auto;
}