The Gold Network: Soyworld | SNCApedia | SoyPlace


Please do not be surprised when the site randomly loads extremely slow. It is probably being DDoSed.


I'm not dead, just inactive for the moment. Faggot (talk) 20:16, 9 April 2026 (UTC)

Template:Cobwatch/styles.css: Difference between revisions

From SNCApedia, the shit nobody cares about encyclopedia
Jump to navigationJump to search
mNo edit summary
mNo edit summary
 
(4 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* Wrapper to hold the cigar and allow particles to fly outside of it */
/* Wrapper provides positioning for the absolute layers */
.cobwatch-wrapper {
.cobwatch-wrapper {
position: relative;
position: relative;
Line 6: Line 6:
}
}


/* Container shapes the cigar and provides cylindrical shading and leaf texture */
/*  
  Container shapes the cigar.
  overflow:hidden ensures the left cap/band corners are perfectly smooth.
*/
.cobwatch-cigar {
.cobwatch-cigar {
display: flex;
display: flex;
Line 18: Line 21:
color: #ffdf00;
color: #ffdf00;
font-family: "Times New Roman", serif;
font-family: "Times New Roman", serif;
overflow: hidden; /* Keeps the band and cap clipped to the rounded corners */
overflow: hidden;
}
}


Line 31: Line 34:
}
}


/* The Cigar Band (Holds the Image) */
/* The Cigar Band */
.cobwatch-band {
.cobwatch-band {
background: linear-gradient(to bottom, #111 0%, #222 15%, #000 20%, #d4af37 20%, #fff080 50%, #aa8000 80%, #000 80%, #222 85%, #111 100%);
background: linear-gradient(to bottom, #111 0%, #222 15%, #000 20%, #d4af37 20%, #fff080 50%, #aa8000 80%, #000 80%, #222 85%, #111 100%);
Line 74: Line 77:
/*  
/*  
   ==========================================
   ==========================================
   3D CRACKED ASH & BURN ANIMATION
   THE ASH TIP (Visuals only)
   ==========================================
   ==========================================
*/
*/
Line 82: Line 85:
position: relative;
position: relative;
background:  
background:  
/* Deep magma cracks */
radial-gradient(circle at 30% 35%, rgba(255, 50, 0, 0.9) 1.5px, transparent 3px),
radial-gradient(circle at 30% 35%, rgba(255, 50, 0, 0.9) 1.5px, transparent 3px),
radial-gradient(circle at 65% 55%, rgba(255, 80, 0, 0.8) 2px, transparent 5px),
radial-gradient(circle at 65% 55%, rgba(255, 80, 0, 0.8) 2px, transparent 5px),
radial-gradient(circle at 45% 75%, rgba(255, 40, 0, 0.9) 1.5px, transparent 4px),
radial-gradient(circle at 45% 75%, rgba(255, 40, 0, 0.9) 1.5px, transparent 4px),
radial-gradient(circle at 75% 25%, rgba(255, 100, 0, 0.7) 1px, transparent 3px),
radial-gradient(circle at 75% 25%, rgba(255, 100, 0, 0.7) 1px, transparent 3px),
/* Dark charred ash base */
linear-gradient(to right, #111 0%, #2a2a2a 40%, #1a1a1a 80%, #050505 100%);
linear-gradient(to right, #111 0%, #2a2a2a 40%, #1a1a1a 80%, #050505 100%);
box-shadow: inset 5px 0 12px rgba(0,0,0,0.9);
box-shadow: inset 5px 0 12px rgba(0,0,0,0.9);
Line 93: Line 94:
}
}


/* The Burn Layer: Replaced the ugly solid line with an inset glowing shadow */
.cobwatch-burn-layer {
.cobwatch-burn-layer {
position: absolute;
position: absolute;
Line 101: Line 101:
repeating-linear-gradient(25deg, transparent, transparent 35px, rgba(0,0,0,0.15) 37px, transparent 38px),
repeating-linear-gradient(25deg, transparent, transparent 35px, rgba(0,0,0,0.15) 37px, transparent 38px),
linear-gradient(to bottom, #2b160a 0%, #4a2613 25%, #593019 50%, #30170a 80%, #1a0c05 100%);
linear-gradient(to bottom, #2b160a 0%, #4a2613 25%, #593019 50%, #30170a 80%, #1a0c05 100%);
animation: cobwatch-ignite-burn 3s ease-in forwards;
animation-delay: 0.8s;
z-index: 2;
z-index: 2;
}
/*
  ==========================================
  THE INVISIBLE TRIGGER & ANIMATIONS
  ==========================================
*/
/* An invisible button overlaying the right tip */
.cobwatch-trigger {
position: absolute;
top: 0; right: 0;
width: 50px;
height: 100%;
cursor: pointer;
outline: none;
z-index: 20;
}
/* Animate the internal burn layer when the trigger is clicked */
.cobwatch-trigger:focus ~ .cobwatch-cigar .cobwatch-burn-layer,
.cobwatch-trigger:active ~ .cobwatch-cigar .cobwatch-burn-layer {
animation: cobwatch-ignite-burn 2.5s ease-in forwards;
}
}


Line 114: Line 135:
/*  
/*  
   ==========================================
   ==========================================
   PARTICLE SYSTEM (Outside the frame!)
   PARTICLES (Outside the cigar)
   ==========================================
   ==========================================
*/
*/
Line 120: Line 141:
.cobwatch-particle-system {
.cobwatch-particle-system {
position: absolute;
position: absolute;
right: 0;
right: 0; top: 0;
top: 0;
width: 50px;  
width: 50px; /* Covers the lit end exactly */
height: 100%;
height: 100%;
z-index: 10;
z-index: 10;
}
}


/* --- Tiny Spawning Fire Particles (Embers) --- */
/* --- Embers --- */
.cobwatch-spark {
.cobwatch-spark {
position: absolute;
position: absolute;
top: 50%;
top: 50%; right: 0;
right: 10px;
width: 4px; height: 4px;
width: 3px;
background: #fff;
height: 3px;
background: #fff; /* White hot core */
border-radius: 50%;
border-radius: 50%;
box-shadow: 0 0 6px 3px #ff4500, 0 0 2px 1px #ffcc00;
box-shadow: 0 0 8px 4px #ff4500, 0 0 3px 2px #ffcc00;
opacity: 0;
opacity: 0;
}
}


/* Distinct randomized paths & delays for the sparks */
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-1, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-1 { animation: cobwatch-spark-fly-1 1.8s 2 ease-out forwards; animation-delay: 0.1s; }
.cobwatch-spark-1 { animation: cobwatch-spark-fly-1 1.8s infinite ease-out; animation-delay: 1.5s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-2, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-2 { animation: cobwatch-spark-fly-2 2.2s 2 ease-out forwards; animation-delay: 0.3s; }
.cobwatch-spark-2 { animation: cobwatch-spark-fly-2 2.2s infinite ease-out; animation-delay: 2.1s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-3, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-3 { animation: cobwatch-spark-fly-3 1.5s 2 ease-out forwards; animation-delay: 0.6s; }
.cobwatch-spark-3 { animation: cobwatch-spark-fly-3 1.5s infinite ease-out; animation-delay: 2.8s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-4, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-4 { animation: cobwatch-spark-fly-4 2.5s 2 ease-out forwards; animation-delay: 0.9s; }
.cobwatch-spark-4 { animation: cobwatch-spark-fly-4 2.5s infinite ease-out; animation-delay: 3.4s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-5, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-5 { animation: cobwatch-spark-fly-5 2.0s 2 ease-out forwards; animation-delay: 1.2s; }
.cobwatch-spark-5 { animation: cobwatch-spark-fly-5 2.0s infinite ease-out; animation-delay: 4.2s; }


@keyframes cobwatch-spark-fly-1 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(25px, -35px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-1 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(35px, -45px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-2 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(40px, 15px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-2 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(50px, 20px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-3 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(20px, -15px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-3 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(25px, -20px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-4 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(35px, -50px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-4 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(45px, -60px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-5 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(15px, 25px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-5 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(20px, 35px) scale(0); opacity: 0; } }


/* --- Smoke Plumes --- */
/* --- Thick Smoke Plumes --- */
.cobwatch-smoke {
.cobwatch-smoke {
position: absolute;
position: absolute;
top: 40%;
top: 30%; right: -10px;
right: -5px; /* Starts slightly off the ash */
width: 14px; height: 14px;
width: 10px;
background: rgba(220, 220, 230, 0.8);
height: 10px;
background: rgba(200, 200, 210, 0.4);
border-radius: 50%;
border-radius: 50%;
box-shadow: 0 0 15px 12px rgba(200, 200, 210, 0.3);
box-shadow: 0 0 20px 15px rgba(220, 220, 230, 0.7);
opacity: 0;
opacity: 0;
}
}


.cobwatch-smoke-1 { animation: cobwatch-smoke-rise-1 3.5s infinite ease-in; animation-delay: 3.5s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-smoke-1, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-smoke-1 { animation: cobwatch-smoke-rise-1 3.5s 1 ease-in forwards; animation-delay: 0.2s; }
.cobwatch-smoke-2 { animation: cobwatch-smoke-rise-2 4.2s infinite ease-in; animation-delay: 4.8s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-smoke-2, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-smoke-2 { animation: cobwatch-smoke-rise-2 4.2s 1 ease-in forwards; animation-delay: 0.8s; }
.cobwatch-smoke-3 { animation: cobwatch-smoke-rise-3 3.8s infinite ease-in; animation-delay: 5.5s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-smoke-3, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-smoke-3 { animation: cobwatch-smoke-rise-3 3.8s 1 ease-in forwards; animation-delay: 1.5s; }


@keyframes cobwatch-smoke-rise-1 {
@keyframes cobwatch-smoke-rise-1 {
0% { transform: translate(0, 0) scale(1); opacity: 0; }
0% { transform: translate(0, 0) scale(1); opacity: 0; }
20% { opacity: 0.6; }
30% { opacity: 0.9; }
100% { transform: translate(30px, -60px) scale(4); opacity: 0; }
100% { transform: translate(30px, -70px) scale(5); opacity: 0; }
}
}
@keyframes cobwatch-smoke-rise-2 {
@keyframes cobwatch-smoke-rise-2 {
0% { transform: translate(0, 0) scale(1); opacity: 0; }
0% { transform: translate(0, 0) scale(1); opacity: 0; }
20% { opacity: 0.5; }
30% { opacity: 0.8; }
100% { transform: translate(15px, -80px) scale(5); opacity: 0; }
100% { transform: translate(15px, -90px) scale(6); opacity: 0; }
}
}
@keyframes cobwatch-smoke-rise-3 {
@keyframes cobwatch-smoke-rise-3 {
0% { transform: translate(0, 0) scale(1); opacity: 0; }
0% { transform: translate(0, 0) scale(1); opacity: 0; }
20% { opacity: 0.7; }
30% { opacity: 1; }
100% { transform: translate(40px, -50px) scale(3.5); opacity: 0; }
100% { transform: translate(50px, -60px) scale(4.5); opacity: 0; }
}
}


Line 189: Line 204:
@media (max-width: 600px) {
@media (max-width: 600px) {
.cobwatch-cigar { flex-direction: column; border-radius: 20px 20px 10px 10px; }
.cobwatch-cigar { flex-direction: column; border-radius: 20px 20px 10px 10px; }
.cobwatch-cap, .cobwatch-foot, .cobwatch-particle-system { display: none; }
.cobwatch-cap, .cobwatch-foot, .cobwatch-trigger, .cobwatch-particle-system { display: none !important; }
.cobwatch-band {
.cobwatch-band {
border-left: none; border-right: none;
border-left: none; border-right: none;

Latest revision as of 19:33, 21 April 2026

/* Wrapper provides positioning for the absolute layers */
.cobwatch-wrapper {
	position: relative;
	max-width: 650px;
	margin: 1em auto;
}

/* 
  Container shapes the cigar. 
  overflow:hidden ensures the left cap/band corners are perfectly smooth.
*/
.cobwatch-cigar {
	display: flex;
	align-items: stretch;
	background: 
		repeating-linear-gradient(25deg, transparent, transparent 35px, rgba(0,0,0,0.15) 37px, transparent 38px),
		linear-gradient(to bottom, #2b160a 0%, #4a2613 25%, #593019 50%, #30170a 80%, #1a0c05 100%);
	border-radius: 40px 8px 8px 40px;
	border: 1px solid #111;
	box-shadow: 0 8px 15px rgba(0,0,0,0.4), inset 0 3px 6px rgba(255,255,255,0.05);
	color: #ffdf00;
	font-family: "Times New Roman", serif;
	overflow: hidden;
}

/* Neutralize MediaWiki's automatic paragraph and break tags */
.cobwatch-cigar p, .cobwatch-wrapper p { display: contents; margin: 0; }
.cobwatch-cigar br, .cobwatch-wrapper br { display: none; }

/* The rounded mouth-piece (Cap) */
.cobwatch-cap {
	width: 25px;
	background: linear-gradient(to right, rgba(0,0,0,0.7) 0%, transparent 100%);
}

/* The Cigar Band */
.cobwatch-band {
	background: linear-gradient(to bottom, #111 0%, #222 15%, #000 20%, #d4af37 20%, #fff080 50%, #aa8000 80%, #000 80%, #222 85%, #111 100%);
	border-left: 2px solid #6b5400;
	border-right: 2px solid #6b5400;
	padding: 6px 12px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	box-shadow: 5px 0 12px rgba(0,0,0,0.5), -5px 0 12px rgba(0,0,0,0.5);
	z-index: 2;
}

.cobwatch-band a.image {
	border: 2px solid #000;
	border-radius: 3px;
	box-shadow: 0 2px 5px rgba(0,0,0,0.6);
	display: block;
	line-height: 0;
}

/* Main content area */
.cobwatch-body {
	flex: 1;
	padding: 8px 15px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
}

.cobwatch-title {
	font-size: 1.5em;
	font-weight: bold;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.8);
	margin-bottom: 2px;
}
.cobwatch-audio { margin: 2px 0; }
.cobwatch-subtitle { font-size: 1em; font-style: italic; color: #ffca28; }

/* 
  ==========================================
  THE ASH TIP (Visuals only)
  ==========================================
*/

.cobwatch-foot {
	width: 50px; 
	position: relative;
	background: 
		radial-gradient(circle at 30% 35%, rgba(255, 50, 0, 0.9) 1.5px, transparent 3px),
		radial-gradient(circle at 65% 55%, rgba(255, 80, 0, 0.8) 2px, transparent 5px),
		radial-gradient(circle at 45% 75%, rgba(255, 40, 0, 0.9) 1.5px, transparent 4px),
		radial-gradient(circle at 75% 25%, rgba(255, 100, 0, 0.7) 1px, transparent 3px),
		linear-gradient(to right, #111 0%, #2a2a2a 40%, #1a1a1a 80%, #050505 100%);
	box-shadow: inset 5px 0 12px rgba(0,0,0,0.9);
	border-left: 1px solid #000;
}

.cobwatch-burn-layer {
	position: absolute;
	top: 0; left: 0; bottom: 0;
	width: 100%;
	background: 
		repeating-linear-gradient(25deg, transparent, transparent 35px, rgba(0,0,0,0.15) 37px, transparent 38px),
		linear-gradient(to bottom, #2b160a 0%, #4a2613 25%, #593019 50%, #30170a 80%, #1a0c05 100%);
	z-index: 2;
}

/* 
  ==========================================
  THE INVISIBLE TRIGGER & ANIMATIONS
  ==========================================
*/

/* An invisible button overlaying the right tip */
.cobwatch-trigger {
	position: absolute;
	top: 0; right: 0;
	width: 50px;
	height: 100%;
	cursor: pointer;
	outline: none;
	z-index: 20;
}

/* Animate the internal burn layer when the trigger is clicked */
.cobwatch-trigger:focus ~ .cobwatch-cigar .cobwatch-burn-layer,
.cobwatch-trigger:active ~ .cobwatch-cigar .cobwatch-burn-layer {
	animation: cobwatch-ignite-burn 2.5s ease-in forwards;
}

@keyframes cobwatch-ignite-burn {
	0% { width: 100%; box-shadow: none; }
	10% { width: 100%; box-shadow: inset -4px 0 6px rgba(255, 200, 0, 0.8), inset -10px 0 15px rgba(255, 42, 0, 0.9); }
	100% { width: 0%; box-shadow: inset -4px 0 6px rgba(255, 200, 0, 0.8), inset -10px 0 15px rgba(255, 42, 0, 0.9); }
}

/* 
  ==========================================
  PARTICLES (Outside the cigar)
  ==========================================
*/

.cobwatch-particle-system {
	position: absolute;
	right: 0; top: 0;
	width: 50px; 
	height: 100%;
	z-index: 10;
}

/* --- Embers --- */
.cobwatch-spark {
	position: absolute;
	top: 50%; right: 0;
	width: 4px; height: 4px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 0 8px 4px #ff4500, 0 0 3px 2px #ffcc00;
	opacity: 0;
}

.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-1, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-1 { animation: cobwatch-spark-fly-1 1.8s 2 ease-out forwards; animation-delay: 0.1s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-2, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-2 { animation: cobwatch-spark-fly-2 2.2s 2 ease-out forwards; animation-delay: 0.3s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-3, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-3 { animation: cobwatch-spark-fly-3 1.5s 2 ease-out forwards; animation-delay: 0.6s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-4, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-4 { animation: cobwatch-spark-fly-4 2.5s 2 ease-out forwards; animation-delay: 0.9s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-spark-5, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-spark-5 { animation: cobwatch-spark-fly-5 2.0s 2 ease-out forwards; animation-delay: 1.2s; }

@keyframes cobwatch-spark-fly-1 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(35px, -45px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-2 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(50px, 20px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-3 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(25px, -20px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-4 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(45px, -60px) scale(0); opacity: 0; } }
@keyframes cobwatch-spark-fly-5 { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(20px, 35px) scale(0); opacity: 0; } }

/* --- Thick Smoke Plumes --- */
.cobwatch-smoke {
	position: absolute;
	top: 30%; right: -10px;
	width: 14px; height: 14px;
	background: rgba(220, 220, 230, 0.8);
	border-radius: 50%;
	box-shadow: 0 0 20px 15px rgba(220, 220, 230, 0.7);
	opacity: 0;
}

.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-smoke-1, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-smoke-1 { animation: cobwatch-smoke-rise-1 3.5s 1 ease-in forwards; animation-delay: 0.2s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-smoke-2, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-smoke-2 { animation: cobwatch-smoke-rise-2 4.2s 1 ease-in forwards; animation-delay: 0.8s; }
.cobwatch-trigger:focus ~ .cobwatch-particle-system .cobwatch-smoke-3, .cobwatch-trigger:active ~ .cobwatch-particle-system .cobwatch-smoke-3 { animation: cobwatch-smoke-rise-3 3.8s 1 ease-in forwards; animation-delay: 1.5s; }

@keyframes cobwatch-smoke-rise-1 {
	0% { transform: translate(0, 0) scale(1); opacity: 0; }
	30% { opacity: 0.9; }
	100% { transform: translate(30px, -70px) scale(5); opacity: 0; }
}
@keyframes cobwatch-smoke-rise-2 {
	0% { transform: translate(0, 0) scale(1); opacity: 0; }
	30% { opacity: 0.8; }
	100% { transform: translate(15px, -90px) scale(6); opacity: 0; }
}
@keyframes cobwatch-smoke-rise-3 {
	0% { transform: translate(0, 0) scale(1); opacity: 0; }
	30% { opacity: 1; }
	100% { transform: translate(50px, -60px) scale(4.5); opacity: 0; }
}

/* Mobile adjustments */
@media (max-width: 600px) {
	.cobwatch-cigar { flex-direction: column; border-radius: 20px 20px 10px 10px; }
	.cobwatch-cap, .cobwatch-foot, .cobwatch-trigger, .cobwatch-particle-system { display: none !important; }
	.cobwatch-band {
		border-left: none; border-right: none;
		border-top: 2px solid #6b5400; border-bottom: 2px solid #6b5400;
		background: linear-gradient(to right, #111 0%, #000 20%, #d4af37 20%, #fff080 50%, #aa8000 80%, #000 80%, #111 100%);
	}
}