User:Dorsal Axe/common.css

/*================================================== VARIABLES

=
=====================================*/


 * root {

/* Global border radius */ --default-border-radius: 20px; --template-outer-radius: 14px; --template-inner-radius: 9px;

/* NIWA link formatting */ --niwa-icon: no-repeat scroll right center transparent; --niwa-padding: padding-right: 18px;

/* N/A color */ --not-applicable: hsl(0 0% 90%);

/* Item colors */ --color-red: hsl(12 87% 79%); --color-orange: hsl(32 92% 80%); --color-yellow: hsl(42 96% 81%); --color-green: hsl(135 47% 71%); --color-aqua: hsl(196 50% 80%); --color-blue: hsl(197 39% 66%); --color-purple: hsl(331 33% 73%); --color-pink: hsl(11 85% 87%); --color-beige: hsl(50 54% 80%); --color-brown: hsl(31 47% 80%); --color-gray: hsl(0 0% 80%); --color-black: hsl(0 0% 70%);

/* Pocket Camp theme colors*/ --theme-civic: hsl(234 50% 80%); --theme-cool: hsl(208 96% 80%); --theme-cute: hsl(345 70% 80%); --theme-elegant: hsl(282 63% 80%); --theme-harmonious: hsl(12 74% 80%); --theme-hip: hsl(30 90% 80%); --theme-historical: hsl(341 45% 80%); --theme-modern: hsl(177 58% 80%); --theme-natural: hsl(44 96% 80%); --theme-rustic: hsl(71 98% 80%); --theme-sporty: hsl(161 93% 80%); --theme-generic: hsl(0 0% 80%); --theme-special: hsl(53 100% 80%);

/* Template Alpha values */ --opacity-full: 100%; --opacity-high: 80%; --opacity-mid: 60%; --opacity-low: 40%; /* Template Lightness values */ --primary-lightness: 70%; --secondary-lightness: 80%; --shadow-lightness: 40%; --text-lightness: 30%;

/* Template Hue & Saturation values */ --art-color: 23 61%; --bug-color: 78 76%; --event-color: 215 100%; --fashion-color: 322 49%; --fashion-subcolor: 320 45%; --film-color: 318 69%; --fish-color: 200 100%; --flora-color: 350 100%; --fossil-color: 43 74%; --furniture-color: 106 50%; --gameplay-color: 163 58%; --gameplay-subcolor: 160 61%; --geography-color: 120 50%; --islander-color: 45 75%; --location-color: 146 42%; --manga-color: 318 34%; --merchandise-color: 193 53%; --minigame-color: 782 75%; --museum-color: 60 31%; --music-color: 0 59%; --nookipedia-color: 99 45%; --publication-color: 248 53%; --pwp-color: 50 95%; --realworld-color: 60 20%; --seacreature-color: 215 100%; --special-color: 81 87%; --species-color: 276 56%; --ssb-color: 34 57%; --ssb-subcolor: 39 77%; --system-color: 0 0%; --series-color: 39 100%; --series-subcolor: 42 73%; --tools-color: 34 93%; --updates-color: 144 39%; --villager-color: 195 52%; --season-color: 96 70%; --spring-color: 333 83%; --summer-color: 191 84%; --autumn-color: 29 87%; --winter-color: 241 59%;

--test-color: 0 100%; /* Theme colors */ /*--springtheme-primary: 95 39% 48% --springtheme-secondary: --summertheme-primary: --summertheme-secondary: --autumntheme-primary: --autumntheme-secondary: --wintertheme-primary: --wintertheme-secondary: --darktheme-primary: --darktheme-secondary: */ /* Special theme colors */ /*--halloweentheme-primary: --halloweentheme-secondary: --pctheme-primary: --pctheme-secondary: --nhtheme-primary: --nhtheme-secondary: */ }

.style-art { background: hsl(var(--art-color) var(--primary-lightness)); } .style-bug { background: hsl(var(--bug-color) var(--primary-lightness)); } .style-event { background: hsl(var(--event-color) var(--primary-lightness)); } .style-fashion { background: hsl(var(--fashion-color) var(--primary-lightness)); } .style-fashionsub { background: hsl(var(--fashion-subcolor) var(--secondary-lightness)); } .style-film { background: hsl(var(--film-color) var(--primary-lightness)); } .style-fish { background: hsl(var(--fish-color) var(--primary-lightness)); } .style-flora { background: hsl(var(--flora-color) var(--primary-lightness)); } .style-fossil { background: hsl(var(--fossil-color) var(--primary-lightness)); } .style-furniture { background: hsl(var(--furniture-color) var(--primary-lightness)); } .style-gameplay { background: hsl(var(--gameplay-color) var(--primary-lightness)); } .style-gameplaysub { background: hsl(var(--gameplay-subcolor) var(--secondary-lightness)); } .style-geography { background: hsl(var(--geography-color) var(--primary-lightness)); } .style-location { background: hsl(var(--location-color) var(--primary-lightness)); } .style-islander { background: hsl(var(--islander-color) var(--primary-lightness)); } .style-manga { background: hsl(var(--manga-color) var(--primary-lightness)); } .style-merchandise { background: hsl(var(--merchandise-color) var(--primary-lightness)); } .style-minigame { background: hsl(var(--minigame-color) var(--primary-lightness)); } .style-museum { background: hsl(var(--museum-color) var(--primary-lightness)); } .style-music { background: hsl(var(--music-color) var(--primary-lightness)); } .style-nookipedia { background: hsl(var(--nookipedia-color) var(--primary-lightness)); } .style-publication { background: hsl(var(--publication-color) var(--primary-lightness)); } .style-pwp { background: hsl(var(--pwp-color-h) var(--primary-lightness)); } .style-realworld { background: hsl(var(--realworld-color) var(--primary-lightness)); } .style-seacreature { background: hsl(var(--seacreature-color) var(--primary-lightness)); } .style-special { background: hsl(var(--special-color) var(--primary-lightness)); } .style-species { background: hsl(var(--species-color) var(--primary-lightness)); } .style-ssb { background: hsl(var(--ssb-color) var(--primary-lightness)); } .style-ssbsub { background: hsl(var(--ssb-subcolor) var(--secondary-lightness)); } .style-system { background: hsl(var(--system-color) var(--primary-lightness)); } .style-series { background: hsl(var(--series-color) var(--primary-lightness)); } .style-seriessub { background: hsl(var(--series-subcolor) var(--secondary-lightness)); } .style-tools { background: hsl(var(--tools-color) var(--primary-lightness)); } .style-updates { background: hsl(var(--updates-color) var(--primary-lightness)); } .style-villager { background: hsl(var(--villager-color) var(--primary-lightness)); } .style-season { background: hsl(var(--season-color) var(--primary-lightness)); } .style-spring { background: hsl(var(--spring-color) var(--primary-lightness)); } .style-summer { background: hsl(var(--summer-color) var(--primary-lightness)); } .style-autumn { background: hsl(var(--autumn-color) var(--primary-lightness)); } .style-winter { background: hsl(var(--winter-color) var(--primary-lightness)); }

.style-test { background: hsl(var(--test-color) var(--primary-lightness)); }

/*================================================== STATIONERY TEST

=
=====================================*/ .stationery { background: url(https://dodo.ac/np/images/5/59/Notebook_paper.png); background-size: 250px 100px; }

/*================================================== STAFF LINKS

=
=====================================*/ /* Patrollers */ .mw-userlink[title="User:Decomposer"], .mw-userlink[title="User:Paviinka"], .mw-userlink[title="User:Ruthless Cutie"], .mw-userlink[title="User:AgentParadox"], .mw-userlink[title="User:BladeofEvilsBane"], .mw-userlink[title="User:HylianAngel"], .mw-userlink[title="User:TurtleCrossing"], .mw-userlink[title="User:PanchamBro"], a.whopatrol, #whopatrollers a { background:url(//dodo.ac/np/images/thumb/1/16/Villager_NH_Character_Icon.png/16px-Villager_NH_Character_Icon.png) center left no-repeat; padding-left: 17px !important; }

/* Administrators */ .mw-userlink[title="User:Mario"], .mw-userlink[title="User:ZCJigglypuff"], .mw-userlink[title="User:Dorsal Axe"], .mw-userlink[title="User:AlexBot2004"], .mw-userlink[title="User:Lampshade59276"], a.whoadmin, #whoadmins a { background:url(//dodo.ac/np/images/thumb/9/91/Isabelle_NH_Character_Icon.png/16px-Isabelle_NH_Character_Icon.png) center left no-repeat; padding-left: 17px !important; }

/* Bureaucrats */ .mw-userlink[title="User:Drago"], .mw-userlink[title="User:Sunmarsh"], .mw-userlink[title="User:Vmario97"], a.whocrat, #whocrats a { background:url(//dodo.ac/np/images/thumb/6/68/Lottie_PC_icon.png/16px-Lottie_PC_icon.png) center left no-repeat; padding-left: 17px !important; }

/* Directors */ .mw-userlink[title="User:Jake"], .mw-userlink[title="User:SuperHamster"], a.whodirector, #whodirectors a { background:url(//dodo.ac/np/images/thumb/6/68/Tom_Nook_NH_Character_Icon.png/16px-Tom_Nook_NH_Character_Icon.png) center left no-repeat; padding-left: 17px !important; }

/* Bots */ .mw-userlink[title="User:Autotroph"], .mw-userlink[title="User:Bot"], .mw-userlink[title="User:HamsterMech"], .mw-userlink[title="User:Puppet"], .mw-userlink[title="User:Weavile"], .mw-userlink[title="User:Ribbot"], a.whobot, #whobots a { background:url(//dodo.ac/np/images/thumb/8/87/Ribbot_NH_Villager_Icon.png/16px-Ribbot_NH_Villager_Icon.png) center left no-repeat; padding-left: 17px !important; }

/* Former Staff */ .mw-userlink[title="User:AnimalCrossingFan12"], .mw-userlink[title="User:DataWizard"], .mw-userlink[title="User:AgentCarmen12"], .mw-userlink[title="User:Anteater99"], .mw-userlink[title="User:SnorlaxMonster"], .mw-userlink[title="User:Crazyguy20076"], .mw-userlink[title="User:RAP"], .mw-userlink[title="User:Zharkaer"], .mw-userlink[title="User:Pakkun"], .mw-userlink[title="User:SpideyCanThrash"], .mw-userlink[title="User:Grekox"], .mw-userlink[title="User:Imjon"], .mw-userlink[title="User:Miku51"], .mw-userlink[title="User:Heidy Isabel"], .mw-userlink[title="User:Trainiax"], .mw-userlink[title="User:Username1770"], .mw-userlink[title="User:Lotter"], .mw-userlink[title="User:Ocre"], .mw-userlink[title="User:Vulpes"], .mw-userlink[title="User:Dabtowner"], .mw-userlink[title="User:mlnintendo97"], .mw-userlink[title="User:Minifig-me"], .mw-userlink[title="User:C-Star55"], .mw-userlink[title="User:GoalieGuy6"], .mw-userlink[title="User:Sailor sofia"], .mw-userlink[title="User:MerrytonRyan"], .mw-userlink[title="User:Dragonfree97"], .mw-userlink[title="User:Leem01"], .mw-userlink[title="User:SuperAlpaca"], .mw-userlink[title="User:Sky"], .mw-userlink[title="User:LoneShadowStar"], a.whoformer, #whoformers a { background:url(//dodo.ac/np/images/thumb/8/8c/Tortimer_aF_Character_Icon.png/16px-Tortimer_aF_Character_Icon.png) center left no-repeat; padding-left: 17px !important; }

/*================================================== MISC

=
=====================================*/ .main-flex-container { display: flex; flex-wrap: wrap; flex-direction: row; justify-content: center; align-items: center; } .main-flex-item { flex: 1; margin: 0 auto; } .main-img { width: 360px; max-height: 275px; } .main-img img { max-width: 100%; width: 360px; max-height: 275px; height: auto; object-fit: contain; } @media (max-width: 1500px) { .main-flex-container { display: block; }	.main-img { max-height: none; }	.main-img img { width: 360px; max-height: none; height: auto; } }