﻿/*
==========================================================================================================
	█▀▀▀ █   █▀▀█ █▀▀▄ █▀▀█ █      █▀▀█ █  █ ▀█▀ █▀▀ █ █    █▀▀ █   █▀▀█ █▀▀ █▀▀ █▀▀ █▀▀ 
 	█ ▀█ █   █  █ █▀▀▄ █▄▄█ █      █  █ █  █  █  █   █▀▄    █   █   █▄▄█ ▀▀█ ▀▀█ █▀▀ ▀▀█ 
	▀▀▀▀ ▀▀▀ ▀▀▀▀ ▀▀▀  ▀  ▀ ▀▀▀    ▀▀█▄ ▀▀▀▀ ▀▀▀ ▀▀▀ ▀ ▀    ▀▀▀ ▀▀▀ ▀  ▀ ▀▀▀ ▀▀▀ ▀▀▀ ▀▀▀ 
==========================================================================================================
*/


/*  █▀▀ █   █▀█ █▄▄ ▄▀█ █      █ █▀▀ █▀█ █▄ █ █▀ 
    █▄█ █▄▄ █▄█ █▄█ █▀█ █▄▄    █ █▄▄ █▄█ █ ▀█ ▄█  */
	
.x\.icon { display: inline-block; width: 1em; height: 1em; vertical-align: -0.125em; font-style: normal; }
.x\.icon > svg { height:1em; width:1em; }
.x\.icon.x\.icon-fill { height: 100%; width: 100%; position: absolute; left: 0; right: 0; bottom: 0; top: 0; }
.x\.icon.x\.icon-fill > svg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; }

.x\.huehover:hover { filter: hue-rotate(180deg); }

/*  █▄▄ █▀█ █▀█ █▀▄ █▀▀ █▀█ █▀ 
    █▄█ █▄█ █▀▄ █▄▀ ██▄ █▀▄ ▄█  */
.b\.0	{ border-width:0px; }
.b\.1	{ border:1px solid black; }
.b\.2	{ border:2px solid black; }
.b\.t1	{ border-top:1px solid black; }
.b\.t2	{ border-top:2px solid black; }
.b\.b1	{ border-bottom:1px solid black; }
.b\.b2	{ border-bottom:2px solid black; }
.b\.l1	{ border-left:1px solid black; }
.b\.l2	{ border-left:2px solid black; }
.b\.r1	{ border-right:1px solid black; }
.b\.r2	{ border-right:2px solid black; }
.b\.f1 			{ position:relative; }
.b\.f1::before 	{ content:""; position:absolute; bottom:-1px; height:1px; left:0; right:0; background: linear-gradient(to right,transparent,#888,transparent); }
.b\.f1::after 	{ content:""; position:absolute; top:-1px; height:1px; left:0; right:0; background: linear-gradient(to right,transparent,#888,transparent); }
.b\.f2 			{ position:relative; }
.b\.f2::before 	{ content:""; position:absolute; bottom:-2px; height:2px; left:0; right:0; background: linear-gradient(to right,transparent,#888,transparent); }
.b\.f2::after 	{ content:""; position:absolute; top:-2px; height:2px; left:0; right:0; background: linear-gradient(to right,transparent,#888,transparent); }
.b\.tf1 		{ position:relative; }
.b\.tf1::after 	{ content:""; position:absolute; top:-1px; height:1px; left:0; right:0; background: linear-gradient(to right,transparent,#888,transparent); }
.b\.bf1 		{ position:relative; }
.b\.bf1::before { content:""; position:absolute; bottom:-1px; height:1px; left:0; right:0; background: linear-gradient(to right,transparent,#888,transparent); }
.b\.cw { border-color:#fff; }
.b\.cu { border-color:#00f; }
.b\.cb { border-color:#000; }
.b\.cr { border-color:#f00; }
.b\.cg { border-color:#0f0; }
.b\.cm { border-color:#888; }
.b\.cd { border-color:#223; }


/*  █▄▄ █▀█ █▀█ █▀▄ █▀▀ █▀█    █▀█ ▄▀█ █▀▄ █ █ █ █▀ 
    █▄█ █▄█ █▀▄ █▄▀ ██▄ █▀▄    █▀▄ █▀█ █▄▀ █ █▄█ ▄█  */
.br\.0 { border-radius:0; }
.br\.2 { border-radius:2px; }
.br\.4 { border-radius:4px; }
.br\.6 { border-radius:6px; }
.br\.8 { border-radius:8px; }
.br\.10 { border-radius:10px; }
.br\.12 { border-radius:12px; }
.br\.14 { border-radius:14px; }
.br\.16 { border-radius:16px; }
.br\.18 { border-radius:18px; }
.br\.20 { border-radius:20px; }
.br\.10\% { border-radius:10%; }
.br\.20\% { border-radius:20%; }
.br\.40\% { border-radius:40%; }
.br\.50\% { border-radius:50%; }
.br\.100\% { border-radius:100%; }


/*  █▄▄ █ █ ▀█▀ ▀█▀ █▀█ █▄ █    █▀▀ █▀█ ▄▀█ █▀▄ █ █▀▀ █▄ █ ▀█▀ █▀ 
    █▄█ █▄█  █   █  █▄█ █ ▀█    █▄█ █▀▄ █▀█ █▄▀ █ ██▄ █ ▀█  █  ▄█  */
.btn-grad-gray { background: #5a5a62 linear-gradient(to bottom, #6c737a 0%,#53575f 50%,#3b4049 51%,#5a5f68 100%); background-color:#5a5a62; }
.btn-grad-gray:hover { background: #5a5a62 linear-gradient(to bottom, #616161 0%,#4b4b4b 50%,#373737 51%,#515151 100%); background-color:#5a5a62; }
.btn-grad-blue { background: #21364f linear-gradient(to bottom, #21364f 0%,#2e5370 50%,#294965 51%,#3f739b 100%); background-color:#21364f; }
.btn-grad-blue:hover { background: #212e3d linear-gradient(to bottom, #212e3d 0%,#2f4555 50%,#2a3d4e 51%,#416077 100%); background-color:#212e3d; }
.btn-grad-red { background: #3e5160 linear-gradient(to bottom, #442e2c 0%,#603e3f 50%,#573837 51%,#855556 100%); background-color:#442e2c; }
.btn-grad-red:hover { background: #3e5160 linear-gradient(to bottom, #43281d 0%,#5d3329 50%,#542e24 51%,#814639 100%); background-color:#43281d; }
.btn-grad-green { background: #336d43 linear-gradient(to bottom, #336d43 0%,#40884c 50%,#3a8048 51%,#50ae60 100%); background-color:#336d43; }
.btn-grad-green:hover { background: #1a4a28 linear-gradient(to bottom, #1a4a28 0%,#24682f 50%,#205e2d 51%,#329042 100%); background-color:#1a4a28; }
.btn-grad-lightred { background: #fba linear-gradient(to bottom, #fba 0%,#e44 50%,#e20 51%,#c20 100%); background-color:#fba; }
.btn-grad-lightred:hover { background: #f75 linear-gradient(to bottom, #f75 0%,#e11 50%,#c10 51%,#a10 100%); background-color:#f75; }
.btn-grad-silver { background: linear-gradient(to bottom, #c6cdd0 0%,#afbdc1 50%,#93a6ab 51%,#818b8a 100%); background-color: #afbdc1; }
.btn-grad-silver:hover { background: linear-gradient(to bottom, #9ba5a9 0%,#88999e 50%,#72868c 51%,#676f6e 100%); background-color: #88999e; }
.btn-grad-purple { background: #483569 linear-gradient(to bottom, #36264a 0%,#483569 50%,#412f5f 51%,#614991 100%); background-color:#483569; }
.btn-grad-purple:hover { background: #3b2c56 linear-gradient(to bottom, #2d1f3d 0%,#3b2c56 50%,#35264e 51%,#4f3c76 100%); background-color:#3b2c56; }
.btn-grad-white { background: #41412f linear-gradient(to bottom, #41412f 0%,#5c5942 50%,#53513b 51%,#807b5a 100%); background-color:#41412f; }
.btn-grad-white:hover { background: #333325 linear-gradient(to bottom, #333325 0%,#484634 50%,#41402f 51%,#656147 100%); background-color:#333325; }
.btn-grad-aqua { background: #315f58 linear-gradient(to bottom, #315f58 0%,#407a6b 50%,#3b7165 51%,#52a08a 100%); background-color:#315f58; }
.btn-grad-aqua:hover { background: #244641 linear-gradient(to bottom, #244641 0%,#336155 50%,#2e584e 51%,#458774 100%); background-color:#244641; }
.btn-grad-grayred { background: #592617 linear-gradient(to bottom, #43322d 0%,#5e4440 50%,#553d39 51%,#825d58 100%); background-color:#592617; }
.btn-grad-grayred:hover { background: #412f2d linear-gradient(to bottom, #2f231f 0%,#412f2d 50%,#3b2a27 51%,#59403d 100%); background-color:#412f2d; }
.btn-grad-grayblue { background: #3e5160 linear-gradient(to bottom, #2c3744 0%,#3e5160 50%,#374857 51%,#557085 100%); background-color:#3e5160; }
.btn-grad-grayblue:hover { background: #303f4a linear-gradient(to bottom, #222a34 0%,#303f4a 50%,#2b3843 51%,#425666 100%); background-color:#303f4a; }


/*  █▄▄ █ █▀▀    █▄▄ █ █ ▀█▀ ▀█▀ █▀█ █▄ █    █▀█ █▀█ █ █ █ 
    █▄█ █ █▄█    █▄█ █▄█  █   █  █▄█ █ ▀█    █▀▄ █▄█ ▀▄▀▄▀ */

.bbr-row-wrap { display:flex; background: linear-gradient(to bottom,rgba(0,0,0,0.75),rgba(0,0,0,0.5) 10px,rgba(128,128,128,0.5));  margin: -4px -10px 10px -10px;  padding: 5px;  border-bottom: 1px solid black;  box-shadow: 0 2px 5px rgba(0,0,0,0.75); }
.bbr-button { height: 80px; padding-top: 0; background-image: url('https://static.mtgnexus.com/images/blocks/carddb.jpg'); background-position: center center; background-size: cover; width: 94%; margin-left: 3%; font-size: 14px; text-align: center; border: 1px solid black; border-radius: 8px; overflow: hidden; position: relative; }
.bbr-button::after { position: absolute; left: 0; right: 0; top: 0; bottom: 0; content: ""; background: radial-gradient(ellipse,rgba(0,0,0,0.2) 10%, black); }
.bbr-button:hover { filter: sepia(1); }
.bbr-button > svg, .bbr-button > i { position:relative; z-index:+1; }

/*	█▀▀▄ ▀█▀ █▀▀▀    █▀▀▄ █  █ ▀▀█▀▀ ▀▀█▀▀ █▀▀█ █▄  █    ▀█▀ █▀▀ █▀▀█ █▄  █ █▀▀ 
 	█▀▀▄  █  █ ▀█    █▀▀▄ █  █   █     █   █  █ █▀█▄█     █  █   █  █ █▀█▄█ ▀▀█ 
	▀▀▀  ▀▀▀ ▀▀▀▀    ▀▀▀  ▀▀▀▀   ▀     ▀   ▀▀▀▀ ▀  ▀▀    ▀▀▀ ▀▀▀ ▀▀▀▀ ▀  ▀▀ ▀▀▀ 	*/
.bbi-row-wrap { display: flex; background: linear-gradient(to bottom,rgba(0,0,0,0.75),rgba(0,0,0,0.5) 10px,rgba(128,128,128,0.5)); margin: -4px -10px 10px -10px; padding: 5px 5px 0 5px; border-bottom: 1px solid black; box-shadow: 0 2px 5px rgba(0,0,0,0.75); }
.bbi-button { height: 50px; padding-top: 0; background-image: linear-gradient(to bottom, #344 0%,#233 50%,#122 51%,#344 100%); width: 94%; margin-left: 3%; border: 1px solid black; border-radius: 10px; overflow: hidden; position: relative; }



/*  █▀▄ █ █▀ █▀█ █   ▄▀█ █▄█ 
    █▄▀ █ ▄█ █▀▀ █▄▄ █▀█  █   */
.d\.b { display:block; }
.d\.ib { display:inline-block; }
.d\.i { display:inline-block; }


/*  █▀▀ █   █▀▀ ▀▄▀ 
    █▀  █▄▄ ██▄ █ █ */
.f\.c { display:flex; }
.f\.dv { flex-direction: column; }
.f\.100 { flex:1; }
.f\.75 { flex:0.75; }
.f\.50 { flex:0.5; }
.f\.33 { flex:0.33; }
.f\.25 { flex:0.25; }
.f\.0 { flex:0; }


/*  █▀▀ █   █▀█ ▄▀█ ▀█▀ 
    █▀  █▄▄ █▄█ █▀█  █   */
.fl\.r { float:right; }
.fl\.l { float:left; }


/*  █▀▀ █▀█ █▄ █ ▀█▀    █▀▀ █▀█ █   █▀█ █▀█ 
    █▀  █▄█ █ ▀█  █     █▄▄ █▄█ █▄▄ █▄█ █▀▄  */
.fc\.w { color:#fff; }
.fc\.u { color:#00f; }
.fc\.b { color:#000; }
.fc\.r { color:#f00; }
.fc\.g { color:#0f0; }
.fc\.8 { color:#888; }
.fc\.lg { color:#BBB; }


/*  █▀▀ █▀█ █▄ █ ▀█▀    █▀ █ ▀█ █▀▀ 
    █▀  █▄█ █ ▀█  █     ▄█ █ █▄ ██▄  */
.fs\.6 { font-size:6px; }
.fs\.7 { font-size:7px; }
.fs\.8 { font-size:8px; }
.fs\.9 { font-size:9px; }
.fs\.10 { font-size:10px; }
.fs\.l1 { font-size:11px; }
.fs\.12 { font-size:12px; }
.fs\.13 { font-size:13px; }
.fs\.14 { font-size:14px; }
.fs\.15 { font-size:15px; }
.fs\.16 { font-size:16px; }
.fs\.l7 { font-size:17px; }
.fs\.18 { font-size:18px; }
.fs\.19 { font-size:19px; }
.fs\.20 { font-size:20px; }
.fs\.21 { font-size:21px; }
.fs\.22 { font-size:22px; }
.fs\.23 { font-size:23px; }
.fs\.24 { font-size:24px; }
.fs\.25 { font-size:25px; }
.fs\.26 { font-size:26px; }
.fs\.27 { font-size:27px; }
.fs\.28 { font-size:28px; }
.fs\.29 { font-size:29px; }
.fs\.30 { font-size:29px; }
.fs\.04m { font-size: 0.4em; }
.fs\.06m { font-size: 0.6em; }
.fs\.08m { font-size: 0.8em; }
.fs\.10m { font-size: 1.0em; }
.fs\.12m { font-size: 1.2em; }
.fs\.14m { font-size: 1.4em; }
.fs\.16m { font-size: 1.6em; }
.fs\.18m { font-size: 1.8em; }
.fs\.20m { font-size: 2.0em; }


/*  █▀▀ █▀█ ▄▀█ █▀▄ █ █▀▀ █▄ █ ▀█▀ █▀ 
    █▄█ █▀▄ █▀█ █▄▀ █ ██▄ █ ▀█  █  ▄█  */
.grad-black		{ background: #474747 linear-gradient(to bottom, #4e4e4e 0%,#3c3c3c 50%,#2d2d2d 51%,#424242 100%); }
.grad-gray		{ background: #8e867c linear-gradient(to bottom, #878787 0%,#7a7a7a 50%,#6e6e6e 51%,#7e7e7e 100%); }
.grad-blue		{ background: #12435e linear-gradient(to bottom, #12435e 0%,#186986 50%,#135e7b 51%,#2193b9 100%); }
.grad-grayblue	{ background: #3e5160 linear-gradient(to bottom, #2c3744 0%,#3e5160 50%,#374857 51%,#557085 100%); }
.grad-green		{ background: #188625 linear-gradient(to bottom, #125e21 0%,#188625 50%,#137b21 51%,#21b930 100%); }
.grad-graygreen	{ background: #3e6042 linear-gradient(to bottom, #2c4431 0%,#3e6042 50%,#37573b 51%,#55855a 100%); }
.grad-red		{ background: #b03c2a linear-gradient(to bottom, #592617 0%,#7f2d1f 50%,#74291a 51%,#b03c2a 100%); }
.grad-grayred	{ background: #592617 linear-gradient(to bottom, #43322d 0%,#5e4440 50%,#553d39 51%,#825d58 100%); }
.grad-white 		{ background: #41412f linear-gradient(to bottom, #41412f 0%,#5c5942 50%,#53513b 51%,#807b5a 100%); }
.grad-graywhite	{ background: #3c3c34 linear-gradient(to bottom, #3c3c34 0%,#555449 50%,#4d4c41 51%,#767464 100%); }
.grad-softgray  	{ background: #555555 linear-gradient(to bottom, #777 0%,#555 20%,#444 51%,#444 90%, #333 100%);   }
.grad-purple	{ background: #483569 linear-gradient(to bottom, #36264a 0%,#483569 50%,#412f5f 51%,#614991 100%); }
.grad-graypurple{ background: #4d4757 linear-gradient(to bottom, #37333d 0%,#4d4757 50%,#453f4f 51%,#696179 100%); }
.grad-brown		{ background: #62503c linear-gradient(to bottom, #453b2b 0%,#62503c 50%,#594835 51%,#886c52 100%); }
.grad-graybrown	{ background: #564f48 linear-gradient(to bottom, #3d3933 0%,#564f48 50%,#4e4740 51%,#776d63 100%); }
.grad-orange	{ background: #593d17 linear-gradient(to bottom, #593d17 0%,#7f4f1f 50%,#74491a 51%,#b06b2a 100%); }


/*  █▀▀ █▀█ █▀█ █ █ █▀█    █▄▄ █▀█ ▀▄▀ 
    █▄█ █▀▄ █▄█ █▄█ █▀▀    █▄█ █▄█ █ █  */
.x\.group_box {
	margin: 0 auto 5px 0;
	box-shadow: -1px -1px 2px black, 1px 1px 2px black;
	background: background: linear-gradient(to bottom right,rgba(0,0,0,0.1),rgba(255,255,255,0.1),rgba(0,0,0,0.1) );
	border-radius: 12px;
	padding: 10px;
	text-align: center;
	font-size: 16px;
}
.x\.group_box-header {
	margin: -10px -10px 5px -10px;
	padding: 5px 0 0 0;
	color: white;
	border-radius: 10px 10px 0 0;
	font-weight: bold;
}


/*  █ █ █▀▀ ▄▀█ █▀▄ █▀▀ █▀█ █▀ 
    █▀█ ██▄ █▀█ █▄▀ ██▄ █▀▄ ▄█  */
.header_fade { background-image: linear-gradient(to bottom, rgba(192,192,192,0.5) 0%,rgba(48,48,48,0.5) 100%); }
.header_glossy { background-image:linear-gradient(to bottom, rgba(54,54,54,0.5) 0%,rgba(119,119,119,0.5) 50%,rgba(80,80,80,0.5) 51%,rgba(182,182,182,0.5) 100%); }
.header_textured { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_azorius, .header_wu { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #EEB,#77d); }
.header_dimir, .header_ub { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #00F,#000); }
.header_rakdos, .header_br { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #000,#F00); }
.header_gruul, .header_rg { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #F00,#0A0); }
.header_selesnya, .header_gw { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #0A0,#EEB); }
.header_orzhov, .header_wb { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #EEB,#000); }
.header_izzet, .header_ur { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #00F, #F00); }
.header_golgari, .header_bg { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #000,#0A0); }
.header_boros, .header_rw { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #F00,#EEB); }
.header_simic, .header_gu { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #0A0,#00F); }
.header_bant, .header_gwu { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #0A0,#EEB,#00F); }
.header_esper, .header_wub { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #EEB,#77d,#000); }
.header_grixis, .header_ubr { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #00F,#000,#F00); }
.header_jund, .header_brg { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #000,#F00,#0A0); }
.header_naya, .header_rgw { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #F00,#0A0,#EEB); }
.header_abzan, .header_wbg { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #EEB,#000, #0A0); }
.header_jeskai, .header_urw { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #00F, #F00, #EEB); }
.header_sultai, .header_bgu { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #000,#0A0, #00F); }
.header_mardu, .header_rwb { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #F00,#EEB, #000); }
.header_temur, .header_gur { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #0A0,#00F, #F00); }
.header_white { background-color:#EEB !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_blue { background-color:#00F !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_black { background-color:#223 !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_red { background-color:#F00 !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_green { background-color:#0A0 !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_gold { background-color:#cb2 !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_silver { background-color:#9BC !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_brown { background-color:#751 !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_colorless { background-color:#999 !important; background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ); }
.header_wubr { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #EEB, #00F, #000, #F00); }                                             
.header_ubrg { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #00F, #000, #F00, #0A0); }
.header_brgw { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #000, #F00, #0A0, #EEB); }
.header_rgwu { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #F00 ,#0A0, #EEB, #00F); }
.header_gwub { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #0A0, #EEB, #00F, #000); }
.header_wubrg  { background-image: url('/images/scratch.png'), linear-gradient(to bottom, rgba(255,255,255,0.4) ,transparent 20%, transparent 80%, rgba(0,0,0,0.4) ), linear-gradient(to right, #EEB, #00F, #000, #F00, #0A0); }                                             
.page_header_fade  , .header_widefade { font-family: "Russo One"; font-size: 16px; text-align: center; padding: 5px; box-shadow: 0 2px 2px black, 0 -2px 2px black; margin: 5px -10px 5px -10px; background: linear-gradient(to right, #445, #fff 30%, #fff 70%, #445 100%); }
.admin-area-header { font-family: "Russo One"; font-size: 20px; text-align: center; padding: 5px; color: white; box-shadow: 0 2px 2px black, 0 -2px 2px black; margin: 5px -9px 5px -9px; }
.hd { font-family: "Russo One"; font-size: 16px; text-align: center; padding: 5px; }
.hd > h2 { font-size: 30px; margin: 0; padding: 0; }
.hd > h3 { font-size: 20px; margin: 0; padding: 0; text-transform: none;}
.hd-wide-grad { box-shadow: 0 2px 2px black, 0 -2px 2px black; margin: 5px -11px 5px -11px; background: linear-gradient(to right, #445, #fff 30%, #fff 70%, #445 100%); border-width: 0 1px 0 1px; border-color: black; border-style: solid; }
.listing_head { font-size: 19px; position: relative; border-radius: 20px 20px 0 0; text-align: center; font-weight: bold; padding: 6px; color: white; }
.listing_head::before { content: ""; position: absolute; top: 33px; left: 0; height: 100px; width: 1px; background: linear-gradient(to bottom, #a0a0a0 0%,#fff 100%); }
.listing_head::after { content: ""; position: absolute; top: 33px; right: 0; height: 100px; width: 1px; background: linear-gradient(to bottom, #a0a0a0 0%,#fff 100%); }


/*  █ █ █▀▀ █ █▀▀ █ █ ▀█▀ 
    █▀█ ██▄ █ █▄█ █▀█  █   */
.h\.100\% { height:100%; }
.mh\.100\% { max-height:100%; }
.h\.95\% { height:95%; }
.mh\.95\% { max-height:95%; }
.h\.90\% { height:90%; }
.mh\.90\% { max-height:90%; }
.h\.300p { height:300px; }
.mh\.300p { max-height:300px; }
.h\.250p { height:250px; }
.mh\.250p { max-height:250px; }
.h\.200p { height:200px; }
.mh\.200p { max-height:200px; }
.h\.150p { height:150px; }
.mh\.150p { max-height:150px; }
.h\.100p { height:100px; }
.mh\.100p { max-height:100px; }
.h\.75p { height:75px; }
.mh\.75p { max-height:75px; }
.h\.60p { height:60px; }
.h\.55p { height:55px; }
.h\.50p { height:50px; }
.mh\.50p { max-height:50px; }
.h\.40p { height:40px; }
.mh\.40p { max-height:40px; }
.h\.30p { height:30px; }
.mh\.30p { max-height:30px; }
.h\.2m { height: 2em; }
.h\.24p { height:24px; }


/*  █▀▄▀█ ▄▀█ █▀█ █▀▀ █ █▄ █ █▀ 
    █ ▀ █ █▀█ █▀▄ █▄█ █ █ ▀█ ▄█  */
.m\.a { margin:auto; }
.m\.0 { margin:0; }
.m\.2 { margin:2px; }
.m\.5 { margin:5px; }
.m\.10 { margin:10px; }
.m\.15 { margin:15px; }
.m\.20 { margin:20px; }
.m\.25 { margin:25px; }
.m\.b2 { margin-bottom:2px; }
.m\.b3 { margin-bottom:3px; }
.m\.b5 { margin-bottom:5px; }
.m\.b10 { margin-bottom:10px; }
.m\.b15 { margin-bottom:15px; }
.m\.b20 { m argin-bottom:20px; }
.m\.b25 { margin-bottom:25px; }
.m\.t2 { margin-top:2px; }
.m\.t3 { margin-top:3px; }
.m\.t5 { margin-top:5px; }
.m\.t10 { margin-top:10px; }
.m\.t15 { margin-top:15px; }
.m\.t20 { margin-top:20px; }
.m\.t25 { margin-top:25px; }
.m\.l2 { margin-left:2px; }
.m\.l5 { margin-left:5px; }
.m\.l10 { margin-left:10px; }
.m\.l15 { margin-left:15px; }
.m\.l20 { margin-left:20px; }
.m\.l25 { margin-left:25px; }
.m\.r2 { margin-right:2px; }
.m\.r5 { margin-right:5px; }
.m\.r10 { margin-right:10px; }
.m\.r15 { margin-right:15px; }
.m\.r20 { margin-right:20px; }
.m\.r25 { margin-right:25px; }


/*  █▀█ ▄▀█ █▀▄ █▀▄ █ █▄ █ █▀▀ █▀ 
    █▀▀ █▀█ █▄▀ █▄▀ █ █ ▀█ █▄█ ▄█  */
.p\.2 	{ padding:2px; }
.p\.5 	{ padding:5px; }
.p\.10 	{ padding:10px; }
.p\.15 	{ padding:15px; }
.p\.20 	{ padding:20px; }
.p\.25 	{ padding:25px; }
.p\.b2 	{ padding-bottom:2px; }
.p\.b3 	{ padding-bottom:3px; }
.p\.b5 	{ padding-bottom:5px; }
.p\.b10 { padding-bottom:10px; }
.p\.b15 { padding-bottom:15px; }
.p\.b20 { padding-bottom:20px; }
.p\.b25 { padding-bottom:25px; }
.p\.t2 	{ padding-top:2px; }
.p\.t3 	{ padding-top:3px; }
.p\.t5 	{ padding-top:5px; }
.p\.t10 { padding-top:10px; }
.p\.t15 { padding-top:15px; }
.p\.t20 { padding-top:20px; }
.p\.t25 { padding-top:25px; }
.p\.l2 	{ padding-left:2px; }
.p\.l5 	{ padding-left:5px; }
.p\.l10 { padding-left:10px; }
.p\.l15 { padding-left:15px; }
.p\.l20 { padding-left:20px; }
.p\.l25 { padding-left:25px; }
.p\.r2 	{ padding-right:2px; }
.p\.r5 	{ padding-right:5px; }
.p\.r10 { padding-right:10px; }
.p\.r15 { padding-right:15px; }
.p\.r20 { padding-right:20px; }
.p\.r25 { padding-right:25px; }


/*  █▀ █ █ ▄▀█ █▀▄ █▀█ █ █ █ █▀ 
    ▄█ █▀█ █▀█ █▄▀ █▄█ ▀▄▀▄▀ ▄█  */
.ts\.b { text-shadow:1px 1px black; }
.ts\.w { text-shadow:1px 1px white; }
.ts\.b2 { text-shadow:1px 1px 2px black; }
.ts\.w2 { text-shadow:1px 1px 2px white; }
.bs\.b { box-shadow:1px 1px black; }
.bs\.w { box-shadow:1px 1px white; }
.bs\.b2 { box-shadow:2px 2px 2px black; }
.bs\.w2 { box-shadow:2px 2px 2px white; }

	


/*  ▀█▀ █▀▀ ▀▄▀ ▀█▀    ▄▀█ █   █ █▀▀ █▄ █ 
     █  ██▄ █ █  █     █▀█ █▄▄ █ █▄█ █ ▀█  */
.ta\.c { text-align:center; }
.ta\.l { text-align:left; }
.ta\.r { text-align:right; }
.va\.t { vertical-align:top; }
.va\.b { vertical-align:bottom; }
.va\.m { vertical-align:middle; }


/*  ▀█▀ █▀▀ ▀▄▀ ▀█▀    █▄▄ ▄▀█ █▀ █ █▀▀ █▀ 
     █  ██▄ █ █  █     █▄█ █▀█ ▄█ █ █▄▄ ▄█  */
.t\.b { font-weight:bold; }
.t\.n { font-weight:normal; }
.t\.st , .t\.lt { text-decoration: line-through; }
.t\.i { font-style: italic; }
.t\.u { text-decoration:underline; }
.t\.uc { text-transform: uppercase; }
.russo { font-family: Russo One;}
.exo { font-family:Exo; }
.cousine { font-family:Cousine; }
.a\.nc:hover { text-decoration:none; color:initial; }
.t\.nowrap { overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }


/*  ▀█▀ █▀█ █▀▀ █▀▀ █   █▀▀    █▀ █ █ █ █ ▀█▀ █▀▀ █ █ 
     █  █▄█ █▄█ █▄█ █▄▄ ██▄    ▄█ ▀▄▀▄▀ █  █  █▄▄ █▀█  */
.toggleswitch { display:inline-block; vertical-align:top; position: relative; width: 134px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; } 
.toggleswitch-checkbox { display: none; }
.toggleswitch-switch { display: block; width: 16px; margin: 9px 10px 0 0; background: radial-gradient(at top left, #f5f5f5 0%,#c3c3c3 50%,#b1b1b1 51%,#ededed 100%); position: absolute; top: -2px; bottom: 0; right: 105px; border-radius: 20px; transition: all 0.2s ease-in 0s; height: 16px; box-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.toggleswitch-label { display: block; overflow: hidden; cursor: pointer; border-radius: 8px; box-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.toggleswitch-inner { display: block; width: 200%; margin-left: -100%; transition: margin 0.2s ease-in 0s; }
.toggleswitch-inner:before, .toggleswitch-inner:after { display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px; font-size: 13px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold; box-sizing: border-box; }
.toggleswitch-inner:before { content: attr(data-on); padding-left: 10px; background: linear-gradient(to bottom, #c1d1c3 0%,#415b46 50%,#2f4733 51%,#7b937f 100%); color: #FFFFFF; text-shadow:1px 1px 2px rgba(0,0,0,0.5);}
.toggleswitch-inner:after {content: attr(data-off);  padding-right: 10px; background: linear-gradient(to bottom, #d1c1c3 0%,#5b4144 50%,#472f31 51%,#937b7d 100%); color: #FFFFFF; text-align: right; text-shadow:1px 1px 2px rgba(0,0,0,0.5);}
.toggleswitch-checkbox:checked + .toggleswitch-label .toggleswitch-inner { margin-left: 0; }
.toggleswitch-checkbox:checked + .toggleswitch-label .toggleswitch-switch { right: -5px;  }
.toggleswitch_small { display:inline-block; vertical-align:top; position: relative; width: 102px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; } 
.toggleswitch_small .toggleswitch-switch { right: 82px; margin: 10px 2px 0 0; }
.toggleswitch_small .toggleswitch-checkbox:checked + .toggleswitch-label .toggleswitch-switch { right:0; }
.toggleswitch_smaller { display: inline-block; vertical-align: top; position: relative; width: 87px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; margin: 2px; }
.toggleswitch_smaller .toggleswitch-switch { right: 67px; margin: 10px 2px 0 0; }
.toggleswitch_smaller .toggleswitch-checkbox:checked + .toggleswitch-label .toggleswitch-switch { right:0; }
.toggleswitch_smaller .toggleswitch-inner:before, .toggleswitch_smaller .toggleswitch-inner:after  { font-size:12px; }
.toggleswitch_huge { display:inline-block; vertical-align:top; position: relative; width: 250px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; } 
.toggleswitch_huge .toggleswitch-switch { right: 230px; margin: 10px 0 0 0; width:20px; height:20px; }
.toggleswitch_huge .toggleswitch-checkbox:checked + .toggleswitch-label .toggleswitch-switch { right:0; }
.toggleswitch-inner-fontoverride:before , .toggleswitch-inner-fontoverride:after { font-size: inherit; font-family: inherit; line-height: unset; height: unset; }
.toggleswitch-inner:before { text-align: left; }
.toggleswitch-inner[data-grad="common"]:before  { background: #000 linear-gradient(to bottom, #000 0%, #222 50%, #000 100%); }
.toggleswitch-inner[data-grad="uncommon"]:before  { background: #626e77 linear-gradient(to bottom, #b7d1e1 0%,#626e77 100%); }
.toggleswitch-inner[data-grad="rare"]:before  { background: #8d742f linear-gradient(to bottom, #d7bd74 0%,#8d742f 100%); }
.toggleswitch-inner[data-grad="mythic"]:before  { background: #bb2c26 linear-gradient(to bottom, #f7971d 0%,#bb2c26 100%); }
.toggleswitch-inner[data-grad="special"]:before  { background: #622d76 linear-gradient(to bottom, #bf99c3 0%,#622d76 100%); }
.toggleswitch-inner[data-grad="white"]:before   { background: #41412f linear-gradient(to top, #41412f 0%,#807b5a 100%);}
.toggleswitch-inner[data-grad="blue"]:before   { background: #12435e linear-gradient(to top, #12435e 0%,#2193b9 100%);}
.toggleswitch-inner[data-grad="black"]:before   { background: #3f313d linear-gradient(to top, #3f313d 0%,#7a607a 100%);}
.toggleswitch-inner[data-grad="red"]:before   { background: #b03c2a linear-gradient(to top, #592617 0%,#b03c2a 100%);}
.toggleswitch-inner[data-grad="green"]:before   { background: #188625 linear-gradient(to top, #125e21 0%,#21b930 100%);}
.toggleswitch-inner[data-grad="green"]:before   { background: #188625 linear-gradient(to top, #125e21 0%,#21b930 100%);}
.toggleswitch-inner[data-grad="common"]:after , .toggleswitch-inner[data-grad="uncommon"]:after  , .toggleswitch-inner[data-grad="rare"]:after  , .toggleswitch-inner[data-grad="mythic"]:after  ,
.toggleswitch-inner[data-grad="special"]:after  , .toggleswitch-inner[data-grad="white"]:after   , .toggleswitch-inner[data-grad="blue"]:after   , .toggleswitch-inner[data-grad="black"]:after   ,
.toggleswitch-inner[data-grad="red"]:after   , .toggleswitch-inner[data-grad="green"]:after   { background: #8e867c linear-gradient(to bottom, #878787 0%,#7a7a7a 50%,#6e6e6e 51%,#7e7e7e 100%); }
.toggleswitch-checkbox:disabled + .toggleswitch-label > .toggleswitch-inner::before, .toggleswitch-checkbox:disabled + .toggleswitch-label > .toggleswitch-inner::after { background: #777; color: #aaa; }
.toggleswitch-checkbox:disabled + .toggleswitch-label > .toggleswitch-switch { opacity: 0.4; }


/*  █ █ █ █ █▀▄ ▀█▀ █ █ 
    ▀▄▀▄▀ █ █▄▀  █  █▀█  */
.w\.100\% { width:100%; }
.mw\.100\% { max-width:100%; }
.w\.95\% { width:95%; }
.mw\.95\% { max-width:95%; }
.w\.90\% { width:90%; }
.mw\.90\% { max-width:90%; }
.w\.540p { width:540px; }
.w\.500p { width:500px; }
.w\.400p { width:400px; }
.w\.300p { width:300px; }
.mw\.300p { max-width:300px; }
.w\.250p { width:250px; }
.mw\.250p { max-width:250px; }
.w\.200p { width:200px; }
.mw\.200p { max-width:200px; }
.w\.180p { width:180px; }
.w\.160p { width:160px; }
.w\.150p { width:150px; }
.mw\.150p { max-width:150px; }
.w\.140p { width:140px; }
.mw\.140p { max-width:140px; }
.w\.135p { width:135px; }
.mw\.135p { max-width:135px; }
.w\.120p { width:120px; }
.mw\.120p { max-width:120px; }
.w\.100p { width:100px; }
.mw\.100p { max-width:100px; }
.w\.75p { width:75px; }
.mw\.75p { max-width:75px; }
.w\.50p { width:50px; }
.w\.40p { width:40px; }
.w\.25p { width:25px; }
.w\.10p { width:10px; }


/*  █▀█ ▀█▀ █ █ █▀▀ █▀█    █▀█ ▄▀█ █▄ █ █▀▄ █▀█ █▀▄▀█ █▀ 
    █▄█  █  █▀█ ██▄ █▀▄    █▀▄ █▀█ █ ▀█ █▄▀ █▄█ █ ▀ █ ▄█  */

.c\.p { cursor: pointer; }
.c\.z { cursor: zoom-in !important; }



/* slidbox */
.slidebox { text-align: center; background: linear-gradient(to top, rgba(64,64,64,0.2), rgba(64,64,64,0.3) 14px, rgba(64,64,64,0.4) 17px, rgba(80,80,64,0.2) 17px, rgba(80,80,64,0.1)); border: 1px solid rgba(0,0,0,0.6); overflow: hidden; border-radius: 20px 20px 12px 12px; width: 98%; margin: 10px auto 20px auto; position: relative; }
.slidebox .mCS-3d-thick-dark.mCSB_scrollTools, .slidebox .mCSB_draggerContainer { border-radius: 0 !IMPORTANT; }
.slidebox_link { background: linear-gradient(to right,#444,#222); padding: 2px 7px; border-radius: 100px 0 0 0; color: white; text-shadow: 1px 1px black; font-size: 16px; width: 260px; }

.x\.pulse-once { animation-name: xpulse; animation-duration: 0.3s; animation-timing-function: linear; animation-delay: 2s; animation-iteration-count: 1; animation-direction: linear;}
.x\.pulse-twice { animation-name: xpulse; animation-duration: 0.3s; animation-timing-function: linear; animation-delay: 2s; animation-iteration-count: 2; animation-direction: linear;}
.x\.pulse-five { animation-name: xpulse; animation-duration: 0.3s; animation-timing-function: linear; animation-delay: 2s; animation-iteration-count: 5; animation-direction: linear;}
.x\.pulse { animation-name: xpulse; animation-duration: 0.3s; animation-timing-function: linear; animation-delay: 2s; animation-iteration-count: infinite; animation-direction: linear;}

@keyframes xpulse {
	0% { transform: scale(1); }
	50% { transform: scale(1.5); }
	100% { transform: scale(1); }
}

.x\.hov_opac { opacity:0.8; }
.x\.hov_opac:hover { opacity:1; }

.x\.hover_expand { position:relative; }
.x\.hover_expand .x\.hover_expand_child { display: none; position: absolute; top: 100%; left: 0; right:0; z-index: 2; }
.x\.hover_expand:hover .x\.hover_expand_child { display:block; }

























.x\.graphic-slider { height: 1em; -webkit-appearance: none; background: transparent; }
.x\.graphic-slider { --range: calc(var(--max) - var(--min)); --ratio: calc((var(--value) - var(--min)) / var(--range)); --sx: calc(0.5 * 1em + var(--ratio) * (100% - 1em)); }
.x\.graphic-slider:focus { outline: none; }
.x\.graphic-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 2em; height: 2em; border-radius: 1em; background: radial-gradient(at top left, #f5f5f5 0%,#c3c3c3 50%,#b1b1b1 51%,#ededed 100%); border: none; box-shadow: 2px 2px 1px #000000; margin-top: calc(max((1em - 1px - 1px) * 0.5,0px) - 2em * 0.5); }
.x\.graphic-slider::-webkit-slider-runnable-track { height: 1em; border: 1px solid #888; border-radius: 0.5em; background: linear-gradient(to bottom, #000, #777 90%, #000); box-shadow: none; }
.x\.graphic-slider::-webkit-slider-thumb:hover { background: radial-gradient(at top left, #fff 0%,#aaa 45%,#888 51%,#ddd 100%); }
.x\.graphic-slider:hover::-webkit-slider-runnable-track { border-color: #000; }
.x\.graphic-slider::-moz-range-thumb { width: 2em; height: 2em; border-radius: 1em; background: radial-gradient(at top left, #f5f5f5 0%,#c3c3c3 50%,#b1b1b1 51%,#ededed 100%); border: none; box-shadow: 2px 2px 1px #000000; }
.x\.graphic-slider::-moz-range-track { height: max(calc(1em - 1px - 1px),0px); border: 1px solid #888; border-radius: 0.5em; background: linear-gradient(to bottom, #000, #777 90%, #000); box-shadow: none; }
.x\.graphic-slider::-moz-range-thumb:hover { background: radial-gradient(at top left, #fff 0%,#aaa 45%,#888 51%,#ddd 100%); }
.x\.graphic-slider:hover::-moz-range-track { border-color: #000; }
.x\.graphic-slider:active::-moz-range-track { border-color: #000; }
.x\.graphic-slider::-ms-fill-upper { background: transparent; border-color: transparent; }
.x\.graphic-slider::-ms-fill-lower { background: transparent; border-color: transparent; }
.x\.graphic-slider::-ms-thumb { width: 2em; height: 2em; border-radius: 1em; background: radial-gradient(at top left, #f5f5f5 0%,#c3c3c3 50%,#b1b1b1 51%,#ededed 100%); border: none; box-shadow: 2px 2px 1px #000000; margin-top: 0; box-sizing: border-box; }
.x\.graphic-slider::-ms-track { height: 1em; border-radius: 0.5em; background: linear-gradient(to bottom, #000, #777 90%, #000); border: 1px solid #888; box-shadow: none; box-sizing: border-box; }
.x\.graphic-slider::-ms-thumb:hover { background: radial-gradient(at top left, #fff 0%,#aaa 45%,#888 51%,#ddd 100%); }
.x\.graphic-slider:hover::-ms-track { border-color: #000; }
.x\.graphic-slider:active::-ms-track { border-color: #000; }

.x\.graphic-slider[data-thumb="small"]::-webkit-slider-thumb { width: 1em; height: 1em; }
.x\.graphic-slider[data-thumb="small"]::-moz-range-thumb { width: 1em; height: 1em; }
.x\.graphic-slider[data-thumb="small"]::-ms-thumb { width: 1em; height: 1em; }

.x\.graphic-slider[data-thumb="thin"]::-webkit-slider-thumb { width: 0.5em; height: 1em; }
.x\.graphic-slider[data-thumb="thin"]::-moz-range-thumb { width: 0.5em; height: 1em; }
.x\.graphic-slider[data-thumb="thin"]::-ms-thumb { width: 0.5em; height: 1em; }

.x\.graphic-slider[data-rangecolor="mythic"]::-ms-fill-lower { height: max(calc(1em - 1px - 1px),0px); border-radius: 0.5em 0 0 0.5em; margin: -1px 0 -1px -1px; background: linear-gradient(to bottom, #B32, #FB1 10%, #B32); border: 1px solid #888; border-right-width: 0; }
.x\.graphic-slider[data-rangecolor="mythic"]::-moz-range-track { background: linear-gradient(to bottom, #B32, #FB1 10%, #B32) 0/var(--sx) 100% no-repeat, linear-gradient(to bottom, #000, #777 90%, #000); }
.x\.graphic-slider[data-rangecolor="mythic"]::-webkit-slider-runnable-track { background: linear-gradient(to bottom, #B32, #FB1 10%, #B32) 0/var(--sx) 100% no-repeat, linear-gradient(to bottom, #000, #777 90%, #000); }

.x\.graphic-slider[data-rangecolor="rare"]::-ms-fill-lower { height: max(calc(1em - 1px - 1px),0px); border-radius: 0.5em 0 0 0.5em; margin: -1px 0 -1px -1px; background: linear-gradient(to bottom, #974, #DB7 10%, #974); border: 1px solid #888; border-right-width: 0; }
.x\.graphic-slider[data-rangecolor="rare"]::-moz-range-track { background: linear-gradient(to bottom, #974, #DB7 10%, #974) 0/var(--sx) 100% no-repeat, linear-gradient(to bottom, #000, #777 90%, #000); }
.x\.graphic-slider[data-rangecolor="rare"]::-webkit-slider-runnable-track { background: linear-gradient(to bottom, #974, #DB7 10%, #974) 0/var(--sx) 100% no-repeat, linear-gradient(to bottom, #000, #777 90%, #000); }

.x\.graphic-slider[data-rangecolor="uncommon"]::-ms-fill-lower { height: max(calc(1em - 1px - 1px),0px); border-radius: 0.5em 0 0 0.5em; margin: -1px 0 -1px -1px; background: linear-gradient(to bottom, #445, #9CD 10%, #445); border: 1px solid #888; border-right-width: 0; }
.x\.graphic-slider[data-rangecolor="uncommon"]::-moz-range-track { background: linear-gradient(to bottom, #445, #9CD 10%, #445) 0/var(--sx) 100% no-repeat, linear-gradient(to bottom, #000, #777 90%, #000); }
.x\.graphic-slider[data-rangecolor="uncommon"]::-webkit-slider-runnable-track { background: linear-gradient(to bottom, #445, #9CD 10%, #445) 0/var(--sx) 100% no-repeat, linear-gradient(to bottom, #000, #777 90%, #000); }
