MediaWiki:Gadget-HeroSkins.css

De Clash of Clans Wiki
Ir a la navegación Ir a la búsqueda

Nota: Después de publicar, quizás necesite actualizar la caché de su navegador para ver los cambios.

  • Firefox/Safari: Mantenga presionada la tecla Shift mientras pulsa el botón Actualizar, o presiona Ctrl+F5 o Ctrl+R (⌘+R en Mac)
  • Google Chrome: presione Ctrl+Shift+R (⌘+Shift+R en Mac)
  • Internet Explorer/Edge: mantenga presionada Ctrl mientras pulsa Actualizar, o presione Ctrl+F5
  • Opera: Presiona Ctrl+F5.
/*
---------------------
 Hero Skin Wardrobes
---------------------

-----------------------
 COMPLEMENTARY SCRIPTS
-----------------------
- HeroSkins.js

-----------------------
 AUTHORS & MAINTAINERS
-----------------------
- E12Dragon: current and original version

--------------
 INFORMATION
--------------
- Used for the Skin Menus (Template:Wardrobe-BK etc)
- Post June 2023 Hero Skin Wardrobes
*/

/********************/
/* Mobile overrides */
/********************/
body.skin-fandommobile .HSM-Container .HSM-Icons,
body.skin-fandommobile .HSM-Container .HSM-Toggle,
body.skin-fandommobile .HSM-Container .HSM-GWM,
body.skin-fandommobile .HSM-Container .HSM-Sound,
body.skin-fandommobile .HSM-Container .HSM-Boot,
body.skin-fandommobile .HSM-Container .HSM-Scroll-Left,
body.skin-fandommobile .HSM-Container .HSM-Scroll-Right {
	display:none;
}
/*************/
/* Container */
/*************/
.HSM-Container {
	width:100%;
	max-width:881px;
	height:400px;
	background-color:var(--theme-page-background-color--secondary);
	border-radius:12px;
	position:relative;
	margin:0 auto 5px auto;
	overflow-y:hidden;
	user-select:none;
}
/***********************/
/*Background Displaying*/
/***********************/
/* Backgrounds use opacity:0 rather than display:none so they are all loaded when the page is loaded*/
.HSM-Container:not([data-mode="Preview"]) .HSM-Background-Sky,
.HSM-Container:not([data-mode="Preview"]) .HSM-Background-Clouds,
.HSM-Container:not([data-mode="Preview"]) .HSM-Background-Ground,
.HSM-Container:not([data-mode="Preview"]) .HSM-Background-Sky {
	opacity:0;
}
.HSM-Container:not([data-mode="Downed"]) .HSM-Background-Altar {
	opacity:0;
}
.HSM-Container:not([data-mode="Idle"]):not([data-mode="Pose"]):not([data-mode="KO"]):not([data-mode="Ability"]) .HSM-Background-Field {
	opacity:0;
}
/************/
/*Background*/
/************/
.HSM-Container > .HSM-Background {
	width:inherit;
	height:inherit;
	position:relative;
	border-radius:inherit;
	overflow:hidden;
}
.HSM-Container > .HSM-Background > div {
	width:inherit;
	height:inherit;
	position:absolute;
	top:0;
}
/*Preview sky layer*/
.HSM-Container > .HSM-Background .HSM-Background-Sky {
	background-image:url(https://clashofclans.wiki.gg/es/images/d/d1/HSM-Background-Sky.png);
	background-size:882px;
	background-repeat:no-repeat;
	background-position:center;
}
/*Preview Clouds layer*/
.HSM-Container > .HSM-Background .HSM-Background-Clouds {
	background-image:url(https://clashofclans.wiki.gg/es/images/0/02/HSM-Background-Clouds.png);
	background-size:882px;
	background-repeat:repeat-x;
	animation:clouds 450s infinite linear;
}
@keyframes clouds {
	0% {
		background-position:0 0;
	}
	100% {
		background-position:882px 0;
	}
}
/*Preview Ground layer*/
.HSM-Container > .HSM-Background .HSM-Background-Ground {
	background-image:url(https://clashofclans.wiki.gg/es/images/d/d2/HSM-Background-Ground.png);
	background-size:882px;
	background-repeat:no-repeat;
	background-position:center;
}
/*Field Vignette*/
.HSM-Container:not([data-mode="Preview"]) > .HSM-Background .HSM-Background-Vignette {
	box-shadow:0 0 60px 40px #00000052 inset;
}
/*Field and Altar general*/
.HSM-Container > .HSM-Background .HSM-Background-Field,
.HSM-Container > .HSM-Background .HSM-Background-Altar {
	background-size:882px;
	background-repeat:no-repeat;
	background-position:center;
}
/*HV Field Tile layer*/
.HSM-Container:not([data-hero="BM"]):not([data-hero="BC"]) > .HSM-Background .HSM-Background-Field {
	background-image:url(https://clashofclans.wiki.gg/es/images/5/55/HSM-Tiles-HV.jpg);
}
/*BB Field Tile layer*/
.HSM-Container:not([data-hero="BK"]):not([data-hero="AQ"]):not([data-hero="GW"]):not([data-hero="RC"]) > .HSM-Background .HSM-Background-Field {
	background-image:url(https://clashofclans.wiki.gg/es/images/9/90/HSM-Tiles-BB.jpg);
}
/*BK Downed layer*/
.HSM-Container[data-hero="BK"] > .HSM-Background .HSM-Background-Altar {
	background-image:url(https://clashofclans.wiki.gg/es/images/c/cf/HSM-Tiles-BK.jpg);
}
/*AQ Downed layer*/
.HSM-Container[data-hero="AQ"] > .HSM-Background .HSM-Background-Altar {
	background-image:url(https://clashofclans.wiki.gg/es/images/a/af/HSM-Tiles-AQ.jpg);
}
/*GW Downed layer*/
.HSM-Container[data-hero="GW"] > .HSM-Background .HSM-Background-Altar {
	background-image:url(https://clashofclans.wiki.gg/es/images/f/f1/HSM-Tiles-GW.jpg);
}
/*RC Downed layer*/
.HSM-Container[data-hero="RC"] > .HSM-Background .HSM-Background-Altar {
	background-image:url(https://clashofclans.wiki.gg/es/images/8/82/HSM-Tiles-RC.jpg);
}
/*BM Downed layer*/
.HSM-Container[data-hero="BM"] > .HSM-Background .HSM-Background-Altar {
	background-image:url(https://clashofclans.wiki.gg/es/images/7/7c/HSM-Tiles-BM.jpg);
}
/*BC Downed layer*/
.HSM-Container[data-hero="BC"] > .HSM-Background .HSM-Background-Altar {
	background-image:url(https://clashofclans.wiki.gg/es/images/5/5a/HSM-Tiles-BC.jpg);
}
/*Shadow layer general*/
.HSM-Container:not([data-mode="Downed"]) > .HSM-Background .HSM-Background-Shadow {
	position:relative;
    margin:auto;
	background:#00000080;
	border-radius:50%;
}
/*Hide shadow until JS loaded*/
.HSM-Container:not(.loaded) > .HSM-Background .HSM-Background-Shadow {
	display:none;
}
/*HV Preview Shadow layer*/
.HSM-Container[data-mode="Preview"]:not([data-hero="BM"]):not([data-hero="BC"]) > .HSM-Background .HSM-Background-Shadow {
    width: 85px;
    height: 0;
    top: 285px;
    box-shadow: 0 0 12px 10px #00000080;
}
/*BB Preview Shadow layer*/
.HSM-Container[data-mode="Preview"]:not([data-hero="BK"]):not([data-hero="AQ"]):not([data-hero="GW"]):not([data-hero="RC"]) > .HSM-Background .HSM-Background-Shadow {
    width:180px;
    height:12px;
    top: 285px;
    box-shadow: 0 0 12px 10px #00000080;
}
/*HV Field Shadow layer*/
.HSM-Container:not([data-mode="Downed"]):not([data-mode="Preview"]):not([data-hero="BM"]):not([data-hero="BC"]) > .HSM-Background .HSM-Background-Shadow {
	width:38px;
	height:25px;
	top:200px;
	box-shadow:0 0 7px 6px #00000080;
}
/*BB Field Shadow layer*/
.HSM-Container:not([data-mode="Downed"]):not([data-mode="Preview"]):not([data-hero="BK"]):not([data-hero="AQ"]):not([data-hero="GW"]):not([data-hero="RC"]) > .HSM-Background .HSM-Background-Shadow {
	width:50px;
	height:34px;
	top:195px;
	box-shadow:0 0 7px 6px #00000080;
}

/**************/
/* Skin Icons */
/**************/
.HSM-Container > .HSM-Icons {
	width: min-content;
    max-width: 100%;
    height: 90px;
    position: relative;
    bottom: 90px;
    display: flex;
    overflow-x: scroll;
    overflow-y: hidden;
    flex-direction: row-reverse;
    margin: auto;
}
.HSM-Container > .HSM-Icons::-webkit-scrollbar {
	display: none;
	overflow-y: hidden;
}

/*********************/
/* Skin Icon designs */
/*********************/
/*Shape*/
.HSM-Container > .HSM-Icons .SkinIcon {
	padding:1px;
	border-radius: 10px;
	margin:9px 5px 5px 5px;
	height:72px;
}
.HSM-Container > .HSM-Icons .SkinIcon > div {
	border-radius: 9px;
	padding:5px;
}
.HSM-Container > .HSM-Icons .SkinIcon > div > div {
	overflow:hidden;
	border-radius: 6px;
}
.HSM-Container > .HSM-Icons .SkinIcon img {
	width:58px;
	height:auto;
	pointer-events:none;
}
/*Standard*/
.HSM-Container > .HSM-Icons .SkinIcon:not([data-type="Gold"]):not([data-type="Legendary"]) {
	background: linear-gradient(#EDF0ED 0%, #ffffff 40%, #f1f1f1 100%);
	box-shadow: 0 3px lightgrey;
}
.HSM-Container > .HSM-Icons .SkinIcon:not([data-type="Gold"]):not([data-type="Legendary"]) > div {
	background:linear-gradient(#f4f4ec 40%, #f6f5f1 49%);
}
.HSM-Container > .HSM-Icons .SkinIcon:not([data-type="Gold"]):not([data-type="Legendary"]) > div > div {
	background: #fefff9;
	border-top: 1px solid grey;
	box-shadow:0 0 8px 7px #dcddda inset;
}
.HSM-Container > .HSM-Icons .SkinIcon:not([data-type="Gold"]):not([data-type="Legendary"]).active{
	box-shadow:0 3px lightgrey, 0 0 0 2px #b6d74a, 0 3px 0 2px #b6d74a;
}
/*Gold*/
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Gold"] {
	background: linear-gradient(#DBA74D 0%, #FFFF9A 40%, #DCAB54 100%);
	box-shadow: 0 3px #B38F39;
}
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Gold"] > div {
	background: linear-gradient(#ffc64b 40%, #FEE277 49%);
}
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Gold"] > div > div {
	background: #fdee5b;
	border-top: 1px solid #8E6B29;
	box-shadow:0 0 8px 7px #e2b124 inset;
}
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Gold"].active{
	box-shadow:0 3px #B38F39, 0 0 0 2px #b6d74a, 0 3px 0 2px #b6d74a;
}
/*Legendary*/
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Legendary"] {
	background: linear-gradient(#7A30D4 0%, #E47CF8 40%, #8237DB 100%);
	box-shadow: 0 3px #793abe;
}
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Legendary"] > div {
	background: linear-gradient(#d35ef4 40%, #E692F8 49%);
}
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Legendary"] > div > div {
	background: #dc66ff;
	border-top: 1px solid #552187;
	box-shadow:0 0 8px 7px #9f2ede inset;
}
.HSM-Container > .HSM-Icons .SkinIcon[data-type="Legendary"].active{
	box-shadow:0 3px #793abe, 0 0 0 2px #b6d74a, 0 3px 0 2px #b6d74a;
}
/*Psuedo States*/
.HSM-Container > .HSM-Icons .SkinIcon:hover:not(.active) {
	filter:brightness(1.1);
	cursor:pointer;
}
.HSM-Container > .HSM-Icons .SkinIcon:active:not(.active) {
	transform:scale(0.95);
}
/*Only display if image is uploaded*/
.HSM-Container .SkinIcon:not(:has(img)) {
	display:none;
}
/******************/
/* Other Elements */
/******************/
/*Title*/
.HSM-Container > .HSM-Title {
	position:absolute;
	top:10px;
	left:20px;
	font-family:'Clash';
	font-size:18px;
	color:white;
	text-shadow:1px 1px black, 1px -1px black, -1px 1px black, -1px -1px black, 1px 2px black;
	text-align:center;
	pointer-events:none;
}
/*Subtitle*/
.HSM-Container > .HSM-Subtitle {
	position:absolute;
	top:35px;
	left:20px;
	font-family:'Clash';
	text-shadow:1px 1px black, 1px -1px black, -1px 1px black, -1px -1px black, 1px 2px black;
	font-size:14px;
	text-align:center;
	pointer-events:none;
}
/*Subtitle- Standard*/
.HSM-Container[data-type="Standard"] .HSM-Subtitle {
	color:white;
}
/*Subtitle- Gold*/
.HSM-Container[data-type="Gold"] .HSM-Subtitle {
	color:gold;
}
/*Subtitle- Legendary*/
.HSM-Container[data-type="Legendary"] .HSM-Subtitle {
	color:magenta;
}
/*Subtitle- default*/
.HSM-Container:not([data-type]) .HSM-Subtitle{
	display:none;
}
/*Shortcut arrows*/
.HSM-Container > .HSM-Link-Left,
.HSM-Container > .HSM-Link-Right {
	position:absolute;
	top:175px;
}
.HSM-Container > .HSM-Link-Left img,
.HSM-Container > .HSM-Link-Right img {
	width:20px;
	height:auto;
	border:none; /*Remove the dumb img borders on Fandom mobile*/
}
.HSM-Container > .HSM-Link-Left {
	left:10px;
	transform: scale(-1, 1);
}
.HSM-Container > .HSM-Link-Right {
	right:10px;
}
/*Author credit*/
.HSM-Container > .HSM-Author {
	position:absolute;
	right:7px;
	top:3px;
	font-size:6px;
	color:white;
	opacity:0.5;
}
.HSM-Container > .HSM-Author span {
	color:white;
	font-weight:400;
}
/*Custom spawns*/
.HSM-Container .HSM-Ability-Text:not(.active) {
	display:none;
}
.HSM-Container:not([data-mode="Ability"]) .HSM-Ability-Text {
	display:none;
}
.HSM-Container .HSM-Ability-Text {
	position: absolute;
    width: 100%;
    top: 285px;
    text-align: center;
    font-family: BackBeat;
    font-size: 16px;
    color: white;
    text-shadow: 1px 1px black, 1px -1px black, -1px 1px black, -1px -1px black, 1px 2px black;
}
/*Boot text*/
.HSM-Container.loaded .HSM-Boot {
	display:none;
}
.HSM-Container .HSM-Boot {
	position: absolute;
    top: 180px;
    width: 100%;
    text-align: center;
    font-family: BackBeat;
    color: white;
    text-shadow: 1px 1px black, 1px -1px black, -1px 1px black, -1px -1px black, 1px 2px black;
    font-size: 16px;
}
/*Mobile text*/
body:not(.skin-fandommobile) .HSM-Container .HSM-Mobile {
	display:none;
}
.HSM-Container .HSM-Mobile {
	position: absolute;
    top: 180px;
    width: 100%;
    text-align: center;
    font-family: BackBeat;
    color: white;
    text-shadow: 1px 1px black, 1px -1px black, -1px 1px black, -1px -1px black, 1px 2px black;
    font-size: 16px;
}

/******************************/
/* Toggle, GWM, Sound, Scroll */
/******************************/
/*All button images are in an atlas so they are preloaded*/
.HSM-Container .HSM-Toggle, 
.HSM-Container .HSM-GWM, 
.HSM-Container .HSM-Sound {
	position: absolute;
    height:26px;
	background-image: url(https://clashofclans.wiki.gg/es/images/f/fb/HSM-Atlas.png);
    background-repeat:no-repeat;
    background-size: 180px;
    cursor: pointer;
} 
.HSM-Container[data-mode="Preview"] .HSM-GWM,
.HSM-Container:not([data-gwm]) .HSM-GWM {
	display:none;
}
/*Toggle*/
.HSM-Container .HSM-Toggle {
    bottom: 90px;
    right:35px;
    width: 26px;
}
/*GWM*/
.HSM-Container .HSM-GWM {
    bottom: 90px;
    width: 36px;
    right: 64px;
}
.HSM-Container[data-gwm="Ground"] .HSM-GWM {
	background-position:-79px 0;
}
.HSM-Container[data-gwm="Air"] .HSM-GWM {
	background-position:-115px 0;
}
/*Sound*/
.HSM-Container .HSM-Sound {
    bottom: 90px;
    right: 6px;
    width: 26px;
}
.HSM-Container.muted .HSM-Sound {
	background-position:-53px 0;
}
.HSM-Container:not(.muted) .HSM-Sound {
	background-position:-26.5px 0;
}
/*Scroll*/
.HSM-Container > .HSM-Scroll-Left,
.HSM-Container > .HSM-Scroll-Right {
	width:12px;
	height:22px;
	position:absolute;
	bottom:34px;
	background-image:url(https://clashofclans.wiki.gg/es/images/a/a1/HSM-Link.png);
	background-size:12px;
	background-repeat:no-repeat;
	cursor:pointer;
}
.HSM-Container > .HSM-Scroll-Left:not(:hover),
.HSM-Container > .HSM-Scroll-Right:not(:hover) {
	opacity:0.6;
}
.HSM-Container > .HSM-Scroll-Left {
	left:10px;
	transform: scale(-1, 1);
}
.HSM-Container > .HSM-Scroll-Right {
	right:10px;
}
/*Psuedo states*/
.HSM-Container .HSM-Toggle:hover,
.HSM-Container .HSM-GWM:hover,
.HSM-Container .HSM-Sound:hover,
.HSM-Container .HSM-Scroll-Left:hover,
.HSM-Container .HSM-Scroll-Right:hover {
	filter:brightness(1.1);
}
.HSM-Container .HSM-Toggle:active,
.HSM-Container .HSM-GWM:active,
.HSM-Container .HSM-Sound:active,
.HSM-Container .HSM-Scroll-Right:active {
	transform:scale(0.9);
}
.HSM-Container .HSM-Scroll-Left:active {
	transform:scale(0.9) scale(-1, 1);
}

/********************/
/* Model Visibility */
/********************/
/*Hide inactive models*/
.HSM-Container .HSM-Models > div:not(.active),
.HSM-Container .HSM-Models > div > div:not(.active),
.HSM-Container[data-gwm="Ground"] .HSM-Models > .Air,
.HSM-Container[data-gwm="Air"] .HSM-Models > div:not(.Air):not(.HSM-Models-Preview) {
	display:none;
}

/**********/
/* Models */
/**********/
.HSM-Container .HSM-Models {
	width:100%;
	position:absolute;
	top:0;
}
.HSM-Container .HSM-Models > div > div > img {
	width:inherit;
	height:auto;
}
.HSM-Container .HSM-Models > div > div {
	position:relative;
	margin:auto;
}

/***************/
/* Theme Icons */
/***************/
.HSM-Container .HSM-Themes {
	position:absolute;
	top: 60px;
	left: 15px;
	text-align:center;
}
/*Theme icon text*/
.HSM-Container .HSM-Themes:hover > div.active {
	display: block;
    position: absolute;
    width: 200px;
    padding: 7px 0;
    border: 1px solid black;
    border-radius: 10px;
    box-shadow: 0 2px 0 0 darkslategrey;
    font-family: BackBeat;
    font-size: 11px;
    left:55px;
    top:10px;
}
body.theme-fandomdesktop-light .HSM-Container .HSM-Themes:hover > div.active {
    background: white;
}
body.theme-fandomdesktop-dark .HSM-Container .HSM-Themes:hover > div.active {
    background:#373737;
}
/*Triangle*/
.HSM-Container .HSM-Themes > div.active::before {
    width: 20px;
    height: 20px;
    position: absolute;
    content: '';
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    left:-21px;
    bottom:3px;
}
body.theme-fandomdesktop-light .HSM-Container .HSM-Themes > div.active::before {
    border-right: 12px solid white;
}
body.theme-fandomdesktop-dark .HSM-Container .HSM-Themes > div.active::before {
    border-right: 12px solid #373737;
}
/*Hide if inactive*/
.HSM-Container .HSM-Themes > div {
	display:none;
}

/*********************/
/* Theme Icons Atlas */
/*********************/
.HSM-Container .HSM-Themes {
	background-image:url(https://clashofclans.wiki.gg/es/images/d/d0/ThemeIconsAtlas.png?format=original);
	width:50px;
	height:50px;
}
.HSM-Container[data-theme="Make"] .HSM-Themes {
	background-position:0 0;
	background-size:170px;
}
.HSM-Container[data-theme="Anniversary"] .HSM-Themes  {
	background-position:-50px 0;
	background-size:170px;
}
.HSM-Container[data-theme="Champions"] .HSM-Themes  {
	background-position:-100px 0;
	background-size:170px;
}
.HSM-Container[data-theme="Lunar"] .HSM-Themes  {
	background-position:0 -50px;
	background-size:170px;
}

/**************/
/* Animations */
/**************/
.HSM-Container.transition .HSM-Title,
.HSM-Container.transition .HSM-Subtitle,
.HSM-Container.transition .HSM-Models,
.HSM-Container .HSM-Models > div > div,
.HSM-Container.transition .HSM-Themes,
.HSM-Container.transition .HSM-Background-Shadow,
.HSM-Container.transition .HSM-Ability-Text {
	animation-name:loadpreview;
	animation-duration: .3s;
	animation-iteration-count: 1;
	animation-play-state: running;
	animation-fill-mode: forwards;
}
@keyframes loadpreview {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
.HSM-Container.transition .HSM-Background {
	transition:background-image .3s;
}
/*Lazy loaded Previews*/
.HSM-Container .HSM-Load {
	width: 50px;
    height: 50px;
    position: absolute;
    bottom: calc(50% - 25px);
    left: calc(50% - 25px);
    pointer-events:none;
    user-select:none;
}
.HSM-Container .HSM-Load.active {
	background-image:url(hhttps://clashofclans.wiki.gg/es/images/1/1c/HSM-Load.png);
	background-size:50px 50px;
	background-repeat:no-repeat;
	animation:spin 2s infinite linear;
}
@keyframes spin {
	0% {
		transform:rotate(360deg);
	}
	100% {
		transform:rotate(0);
	}
}
.HSM-Container .SkinIcon[data-type="Legendary"] > div::before {
	content:'';
	background-image:url(https://clashofclans.wiki.gg/es/images/4/42/Glint1.png);
	background-size:70px;
	width:70px;
	height:70px;
	margin:-15px 0 0 -6px;
	position:absolute;
	background-repeat:no-repeat;
		animation-name: legendary-skin-button;
		animation-duration: 4s;
		animation-timing-function: ease-out;
		animation-iteration-count: infinite;
		animation-play-state: running;
}
@keyframes legendary-skin-button {
	0% {
		background-position:0 0;
		opacity:0;
	}
	20% {
		opacity:1;
	}
	25% {
		background-position:0 50px;
		opacity:0;
	}
	100% {
		background-image:none;
		background-position:0 50px;
		opacity:0;
	}
}


/* #region Sidebar sticky ToC */
#p-stoc {
	position: sticky;
	top: 35px;
    background: none !important;
    border: 0 !important;
    width: 100%;
    margin: 10px 0;
}
#p-stoc > .vector-menu-content {
	overflow: hidden;
	word-break: break-word;
	max-height: calc(100vh - var(--sticky-offset) - 2rem - .75em);
	margin-left: -0.2em;
}
#p-stoc .tocnumber {
	word-break: keep-all;
}
#p-stoc .vector-menu-content li {
	font-size: .725rem;
}
#p-stoc-label {
    margin: 0;
    padding: 6px 10px;
    border: 0;
    border-radius: var(--main-inner-box-border-radius) var(--main-inner-box-border-radius) 0px 0px;
    background: #888367;
    font-size: 15px;
    line-height: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--theme-text-color);
}


/* Currently not supported on tablet and below... but it's not very usable in this form anyway */
@media screen and (max-width: 1260px) {
	#p-stoc {
		display: none;
	}
}
/* #endregion */