:root {
	--theme: grayscale(80%);
	--bg-header: url("../img/poebuilds.webp");

	--brd-nav: #000;
	--bg-nav:#313131;
	--txt-1: #b99c74;
	--txt-2: #ffe5b5;
	--txt-3:#f5f5f5;
	--bg-body: #070707;
	--brd-list:#050505;
	--bg-item:#171717;

	--bg-game:#080808;
	--txt-game:#ffe5b5;
	--brd-game:#080808;
	--txt-footer:#ffe5b5;
	
	--tag-version:#ffe5b5;
	--tag-category:#f5f5f5;
	--tag-youtube:#B80000;
	--tag-reddit:#c95000;
	

	--bg-archive:#080808;
	--txt-archive:#b99c74;
	--brd-archive:#080808;	

	--bg-category:rgb(0, 0, 0, 0);
	--txt-category:#f5f5f5;
	--brd-category:rgb(0, 0, 0, 0);

	--brd-class:rgb(0, 0, 0, 0);
	--bg-strdexint:rgb(0, 0, 0, 0);
	--txt-strdexint:#f5f5f5;
	--bg-str:rgb(0, 0, 0, 0);
	--txt-str:#af5a32;
	--bg-dex:rgb(0, 0, 0, 0);
	--txt-dex:#7cb376;
	--bg-int:rgb(0, 0, 0, 0);
	--txt-int:#9ac3c9;
	--bg-strdex:rgb(0, 0, 0, 0);
	--txt-strdex:#96afc8;
	--bg-strint:rgb(0, 0, 0, 0);
	--txt-strint:#cfbd8a;
	--bg-dexint:rgb(0, 0, 0, 0);
	--txt-dexint:#72818d;


	--bg-top:#0e0e0e;
	--bg-bottom:#101010;
	--brd-bottom:#050505;

	--txt-builds:#f5f5f5;
	--bg-builds-1:#101010;
	--bg-builds-2:#171717;
	--bg-error:#080808;
	--txt-error:#B80000;
	--brd-error:#080808;

	--bg-announcement:#080808;
	--txt-announcement:#f5f5f5;
	--brd-announcement:#080808;


	--bg-tag:#080808;
	
	--tag-strdexint:#f5f5f5;
	--tag-str:#af5a32;
	--tag-dex:#7cb376;
	--tag-int:#9ac3c9;
	--tag-strdex:#96afc8;
	--tag-strint:#cfbd8a;
	--tag-dexint:#72818d;
	
	
}


[data-theme="mario"] {
	--theme: grayscale(0%);
	--bg-header: url("../img/poebuilds-mario.webp");
	
}

[data-theme="mario-full"] {
	--theme: grayscale(0%);
	--bg-header: url("../img/poebuilds-mario.webp");
	--txt-footer:#f5f5f5;
	--brd-nav: #0f5ae6;
	--bg-nav:#101010;
	--txt-1: #101010;
	--txt-2: #ffe5b5;
	--txt-3:#f5f5f5;
	--bg-body: #1d65dc;
	--link-1:#f5f5f5;

	--bg-game:#435972;
	--txt-game:#f5f5f5;
	--brd-game:#101010;
	--bg-archive:#435972;
	--txt-archive:#f5f5f5;
	--brd-archive:#101010;	
	--bg-category:#435972;
	--txt-category:#f5f5f5;
	--brd-category:#101010;
	
	--bg-announcement:#273d55;
	--txt-announcement:#f5f5f5;
	--brd-announcement:#101010;

	--brd-class:#101010;
	--bg-strdexint:#f5f5f5;
	--txt-strdexint:#000;
	--bg-str:#af5a32;
	--txt-str:#000;
	--bg-dex:#7cb376;
	--txt-dex:#000;
	--bg-int:#9ac3c9;
	--txt-int:#000;
	--bg-strdex: #96afc8;
	--txt-strdex:#000;
	--bg-strint:#cfbd8a;
	--txt-strint:#000;
	--bg-dexint:#72818d;
	--txt-dexint:#000;
	--brd-item:#6d8da7;
	--bg-item:#556d86;
	--bg-bottom:#4e657e;
	--brd-list:#6d8da7;

	--link-2:#3b4b55;

	--bg-top:#6d8da7;
	--brd-bottom:#101010;
	--bg-builds-2:#556d86;
	--bg-builds-1:#4e657e;
	--txt-builds:#101010;
	
	
	--bg-error:#273d55;
	--txt-error:#B80000;
	--brd-error:#101010;
	--bg-tag:#273d55;
	
}


*{
	margin:0;
	padding:0;
	border:0;
	list-style:none;
}

*:focus{
	outline:none;
}

input{
	font-family:Verdana, system-ui, sans-serif;
}

html{
	font-family:Verdana, system-ui, sans-serif;
	font-size:16px;
	position:relative;
	min-height:100%;
	letter-spacing:0.3px;
}

body{
	background:var(--bg-body);
	margin:0 0 8rem;
    font-size:1rem;
}

header a{
	width:380px;
	height:90px;
	background-image:var(--bg-header);
	margin:1rem auto 0;
	display:block;
}

footer{
	position:absolute;
	bottom:0;
	width:100%;
	margin:1rem 0;
	color:var(--txt-footer);
	text-align:center;
}

.txt-1{
	color:var(--txt-1);
}

.txt-2{
	color:var(--txt-2);
}
.txt-3{
	color:var(--txt-3);
}


.tag-version{
	color:var(--tag-version);	
}
	
.tag-category{
	color:var(--tag-category);	
}

.tag-youtube{
	color:var(--tag-youtube);	
}
.tag-reddit{
	color:var(--tag-reddit);	
}

.lnk-build{

	display: block;
	  min-width: 0;
	  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

margin:10px 0 4px 4px;

}

.lnk-author{
	font-size:11px;
	margin-left:4px;
}
.build{
	height:70px;
	width:425px;
	padding: 10px 0 0 6px;
}

.build-2{
	height:70px;
	width:750px;
	padding: 10px 0 0 12px;
}


a:link,a:visited{
	font-weight:bold;
	text-decoration:none;
}
	
.nav{
	border:1px solid var(--brd-nav);
	display: flex;
	background: var(--bg-nav);
	width:1000px;
	padding:1px;
	margin:16px auto 0;
}

.container{
	border:1px solid var(--brd-nav);
	display: flex;
	background: var(--bg-nav);
	width:1000px;
	padding:1px;
	margin:16px auto 0;
}

.container-2{
	border:1px solid var(--brd-nav);
	display: flex;
	background: var(--bg-nav);
	padding:1px;
	width:100%;
}

.twin{
	display:flex;
	gap:16px;
	width:1004px;
	margin:16px auto 0;
	justify-content: center;
}

.cursor{
	cursor:default;	
}

.pointer{
	cursor:pointer;	
}

.right{
	margin-left: auto;
}

.list{
	width:100%;
	border:1px solid var(--brd-list);
}

.items{
	background:var(--bg-item);
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding:6px 16px;
}

.items-top{
	background:var(--bg-item);
	display: flex;
	align-items: center;
	border-bottom:1px solid var(--bg-top);
	flex-wrap: wrap;
	padding:6px 70px 0;
	min-height:34px;
}

.items-bottom{
	background:var(--bg-bottom);
	min-height:34px;
	display: flex;
	align-items: center;
	border-top:1px solid var(--brd-bottom);
	flex-wrap: wrap;
	padding:6px 16px 0;
}

.builds-top{
	background:var(--bg-item);
	display: flex;
	align-items: center;
	border-bottom:1px solid var(--bg-top);
	flex-wrap: wrap;
	padding:0 16px 0;
	min-height:40px;
	color:var(--txt-builds);
}

.builds-bottom{
	background:var(--bg-builds);
	min-height:80px;
	display: flex;
	align-items: center;
	border-top:1px solid var(--brd-bottom);
	
	flex-wrap: wrap;
	padding:0 16px 0 0;
}



.lnk{
	padding:6px 1rem 5px;
	text-align:center;
	margin-left: -1px;
}	

.lnk:first-child {
    margin-left: 0;
}

.lnk-class{
	border:1px solid var(--brd-class);
	margin:0 3px 6px 3px;
}

.lnk-category{
	padding:7px 1rem 6px;
	text-align:center;
	color:var(--txt-category);
	background:var(--bg-category);
	border:1px solid var(--brd-category);
	
}

.frm-search{
	padding:5px 6px 5px;
	min-width:10rem;
	background:var(--bg-game);
	border:1px solid var(--brd-game);
	color:var(--txt-game);
}

.lnk-game{
	padding:6px 0 5px;
	min-width:10rem;
	background:var(--bg-game);
	border:1px solid var(--brd-game);
	color:var(--txt-game);
}

.lnk-archive{
	padding:6px 1rem 5px;
	background:var(--bg-archive);
	border:1px solid var(--brd-archive);
	color:var(--txt-archive);
}


.link-2{

	background:var(--link-2);
	padding:4px 16px;
	border:1px solid #313131;
	color:rgb(245, 245, 245);
	text-align:center;
}	



.shadow{
	filter: drop-shadow(0 0 2px rgba(0,0,0,0.5));
}


.theme{
	background-image: url("../img/favicon.png");	
	width:16px;
	height:16px;
	display:block;
	margin:0 0 0 16px;
	filter:var(--theme) drop-shadow(0 0 2px rgba(0,0,0,0.5));
}

.center{
	justify-content: center;
	text-align: center;
}

.lnk-scion{background-color:var(--bg-strdexint);color:var(--txt-strdexint)}
.lnk-duelist,.lnk-mercenary,.lnk-gladiator{background-color:var(--bg-strdex);color:var(--txt-strdex)}
.lnk-marauder,.lnk-warrior{background-color:var(--bg-str);color:var(--txt-str)}
.lnk-huntress,.lnk-ranger{background-color:var(--bg-dex);color:var(--txt-dex)}
.lnk-monk,.lnk-shadow,.lnk-assassin{background-color:var(--bg-dexint);color:var(--txt-dexint)}
.lnk-templar,.lnk-druid{background-color:var(--bg-strint);color:var(--txt-strint)}
.lnk-witch,.lnk-sorceress{background-color:var(--bg-int);color:var(--txt-int)}

.tag-scion,.tag-tierlist{color:var(--tag-strdexint)}
.tag-duelist,.tag-mercenary,.tag-gladiator{color:var(--tag-strdex)}
.tag-marauder,.tag-warrior{color:var(--tag-str)}
.tag-huntress,.tag-ranger{color:var(--tag-dex)}
.tag-monk,.tag-shadow,.tag-assassin{color:var(--tag-dexint)}
.tag-templar,.tag-druid{color:var(--tag-strint)}
.tag-witch,.tag-sorceress{color:var(--tag-int)}

.gem{
	width:16px;
	height:16px;
	margin:0 12px 0 0;
	background-size: cover;
	filter: drop-shadow(0 0 2px rgba(0,0,0,0.5));
}
.g1_r{
	background-image: image-set(
		url("../img/poe_gemstr.webp") 1x,
		url("../img/poe_gemstr2x.webp") 2x,
		url("../img/poe_gemstr3x.webp") 3x
	);	
}
.g1_g{
	background-image: image-set(
		url("../img/poe_gemdex.webp") 1x,
		url("../img/poe_gemdex2x.webp") 2x,
		url("../img/poe_gemdex3x.webp") 3x
	);	
}
.g1_b{
	background-image: image-set(
		url("../img/poe_gemint.webp") 1x,
		url("../img/poe_gemint2x.webp") 2x,
		url("../img/poe_gemint3x.webp") 3x
	);
}
.g1_w{
	background-image: image-set(
		url("../img/poe_gem.webp") 1x,
		url("../img/poe_gem2x.webp") 2x,
		url("../img/poe_gem3x.webp") 3x
	);
}
.g2_r{
	background-image: image-set(
		url("../img/poe2_gemstr.webp") 1x,
		url("../img/poe2_gemstr2x.webp") 2x,
		url("../img/poe2_gemstr3x.webp") 3x
	);	
}
.g2_g{
	background-image: image-set(
		url("../img/poe2_gemdex.webp") 1x,
		url("../img/poe2_gemdex2x.webp") 2x,
		url("../img/poe2_gemdex3x.webp") 3x
	);	
}
.g2_b{
	background-image: image-set(
		url("../img/poe2_gemint.webp") 1x,
		url("../img/poe2_gemint2x.webp") 2x,
		url("../img/poe2_gemint3x.webp") 3x
	);
}
.g2_w{
	background-image: image-set(
		url("../img/poe2_gem.webp") 1x,
		url("../img/poe2_gem2x.webp") 2x,
		url("../img/poe2_gem3x.webp") 3x
	);
}


.fade{
	filter:opacity(40%);
}



.tag{
	padding:2px 8px;
	margin-right:8px;
	cursor: default;
	border:1px solid #101010;
	background:var(--bg-tag);
	font-size:11px;
	display:inline-block;
}


.por{
	width:130px;
	height:80px;
	border-right:1px solid #050505;
	background-color: #0c0c0c;
	display:none;
	opacity: 0.7;
	
}

.a1_27{background:url(../img/v108.webp) 0 0;}
.a2_36{background:url(../img/v108.webp) -130px 0;}
.a1_10{background:url(../img/v108.webp) -260px 0;}
.a1_2{background:url(../img/v108.webp) 0 -240px;}
.a1_3{background:url(../img/v108.webp) -130px -240px;}
.a1_1{background:url(../img/v108.webp) -260px -240px;}
.a1_6{background:url(../img/v108.webp) 0 -320px;}
.a1_5{background:url(../img/v108.webp) -130px -320px;}
.a1_4{background:url(../img/v108.webp) -260px -320px;}
.a1_9{background:url(../img/v108.webp) 0 -160px;}
.a1_8{background:url(../img/v108.webp) -130px -160px;}
.a1_7{background:url(../img/v108.webp) -260px -160px;}
.a1_13{background:url(../img/v108.webp) 0 -400px;}
.a1_12{background:url(../img/v108.webp) -130px -400px;}
.a1_11{background:url(../img/v108.webp) -260px -400px;}
.a1_16{background:url(../img/v108.webp) 0 -480px;}
.a1_15{background:url(../img/v108.webp) -130px -480px;}
.a1_14{background:url(../img/v108.webp) -260px -480px;}
.a1_18{background:url(../img/v108.webp) 0 -80px;}
.a1_17{background:url(../img/v108.webp) -130px -80px;}
.a1_19{background:url(../img/v108.webp) -260px -80px;}
.a2_20{background:url(../img/v108.webp) 0 -720px;}
.a2_21{background:url(../img/v108.webp) -130px -720px;}
.a2_31{background:url(../img/v108.webp) -260px -720px;}
.a2_22{background:url(../img/v108.webp) 0 -800px;}
.a2_23{background:url(../img/v108.webp) -130px -800px;}
.a2_32{background:url(../img/v108.webp) -260px -800px;}
.a2_26{background:url(../img/v108.webp) 0 -560px;}
.a2_28{background:url(../img/v108.webp) -130px -560px;}
.a2_24{background:url(../img/v108.webp) 0 -640px;}
.a2_25{background:url(../img/v108.webp) -130px -640px;}
.a2_33{background:url(../img/v108.webp) -260px -640px;}
.a2_30{background:url(../img/v108.webp) 0 -960px;}
.a2_29{background:url(../img/v108.webp) -130px -960px;}
.a2_9{background:url(../img/v108.webp) 0 -880px;}
.a2_7{background:url(../img/v108.webp) -130px -880px;}
.a2_35{background:url(../img/v108.webp) 0 -1040px;}
.a2_34{background:url(../img/v108.webp) -130px -1040px;}





.orb{
	width: 16px;
	height: 16px;
	display:block;
	background-size: cover;
}



.o1_1{
	background-image: image-set(
		url("../img/poe_currencyidentification.webp") 1x,
		url("../img/poe_currencyidentification2x.webp") 2x,
		url("../img/poe_currencyidentification3x.webp") 3x
	);
}
.o1_2{
	background-image: image-set(
		url("../img/poe_currencyrerollmagic.webp") 1x,
		url("../img/poe_currencyrerollmagic2x.webp") 2x,
		url("../img/poe_currencyrerollmagic3x.webp") 3x
	);
}
.o1_3{
	background-image: image-set(
		url("../img/poe_currencyupgrademagictorare.webp") 1x,
		url("../img/poe_currencyupgrademagictorare2x.webp") 2x,
		url("../img/poe_currencyupgrademagictorare3x.webp") 3x
	);
}
.o1_4{
	background-image: image-set(
		url("../img/poe_currencyupgradetorare.webp") 1x,
		url("../img/poe_currencyupgradetorare2x.webp") 2x,
		url("../img/poe_currencyupgradetorare3x.webp") 3x
	);
}
.o1_5{
	background-image: image-set(
		url("../img/poe_currencyrerollrare.webp") 1x,
		url("../img/poe_currencyrerollrare2x.webp") 2x,
		url("../img/poe_currencyrerollrare3x.webp") 3x
	);
}
.o1_6{
	background-image: image-set(
		url("../img/poe_currencyaddmodtorare.webp") 1x,
		url("../img/poe_currencyaddmodtorare2x.webp") 2x,
		url("../img/poe_currencyaddmodtorare3x.webp") 3x
	);
}
.o1_7{
	background-image: image-set(
		url("../img/poe_currencymodvalues.webp") 1x,
		url("../img/poe_currencymodvalues2x.webp") 2x,
		url("../img/poe_currencymodvalues3x.webp") 3x
	);
}
.o1_8{
	background-image: image-set(
		url("../img/poe_currencyduplicate.webp") 1x,
		url("../img/poe_currencyduplicate2x.webp") 2x,
		url("../img/poe_currencyduplicate3x.webp") 3x
	);
}
.o2_1{
	background-image: image-set(
		url("../img/poe2_currencyidentification.webp") 1x,
		url("../img/poe2_currencyidentification2x.webp") 2x,
		url("../img/poe2_currencyidentification3x.webp") 3x
	);
}
.o2_2{
	background-image: image-set(
		url("../img/poe2_currencyrerollmagic.webp") 1x,
		url("../img/poe2_currencyrerollmagic2x.webp") 2x,
		url("../img/poe2_currencyrerollmagic3x.webp") 3x
	);
}
.o2_3{
	background-image: image-set(
		url("../img/poe2_currencyupgrademagictorare.webp") 1x,
		url("../img/poe2_currencyupgrademagictorare2x.webp") 2x,
		url("../img/poe2_currencyupgrademagictorare3x.webp") 3x
	);
}
.o2_4{
	background-image: image-set(
		url("../img/poe2_currencyupgradetorare.webp") 1x,
		url("../img/poe2_currencyupgradetorare2x.webp") 2x,
		url("../img/poe2_currencyupgradetorare3x.webp") 3x
	);
}
.o2_5{
	background-image: image-set(
		url("../img/poe2_currencyrerollrare.webp") 1x,
		url("../img/poe2_currencyrerollrare2x.webp") 2x,
		url("../img/poe2_currencyrerollrare3x.webp") 3x
	);
}
.o2_6{
	background-image: image-set(
		url("../img/poe2_currencyaddmodtorare.webp") 1x,
		url("../img/poe2_currencyaddmodtorare2x.webp") 2x,
		url("../img/poe2_currencyaddmodtorare3x.webp") 3x
	);
}
.o2_7{
	background-image: image-set(
		url("../img/poe2_currencymodvalues.webp") 1x,
		url("../img/poe2_currencymodvalues2x.webp") 2x,
		url("../img/poe2_currencymodvalues3x.webp") 3x
	);
}
.o2_8{
	background-image: image-set(
		url("../img/poe2_currencyduplicate.webp") 1x,
		url("../img/poe2_currencyduplicate2x.webp") 2x,
		url("../img/poe2_currencyduplicate3x.webp") 3x
	);
}

.span-error{
	background:var(--bg-error);
	padding:6px 1rem 5px;
	border:1px solid var(--brd-error);
	color:var(--txt-error);
}

.span-announcement{
	background:var(--bg-announcement);
	padding:6px 1rem 5px;
	border:1px solid var(--brd-announcement);
	color:var(--txt-announcement);
}







.bg-builds-1{
	background:var(--bg-builds-1);
}

.bg-builds-2{
	background:var(--bg-builds-2);
}




































@media (min-width: 768px) {

	body{
		font-size:0.75rem;
	}
	
	.por{
		display:block;
	}
}