p2{margin:0px;flex-grow: 1;}
h1{font-weight:900;margin:10 0px;margin-top:0px;2text-transform:uppercase;font-size:16px;}
h2{font-weight:900;margin:5 0px;text-transform:uppercase;font-size:14px;}
.h2{font-weight:400;margin:10px;font-size:14px;color:#fff;text-transform:uppercase;}

.logo{line-height:40px;font-size:25px;font-weight:900;color:#fff;padding:0 0px;  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #00000044;}

body{background-image: url(/images/bg.jpg);
    background-size: contain;
    background-size: cover;
background-attachment: fixed;    background-position-x: 50%;}

p22{margin:0px;flex-grow: 1;}
	
	a{text-decoration:none;color:#467dc5;color:#57007b;}
	a123:hover{background:#467dc522;}
.skill_learned{opacity:1;border:1px solid #00000033;}
.skill_learned .imgs .skill_img{background:#151a1a;border:2px solid #323e3a;padding:0 20px;float:left;}
.skill_learned .imgs .corner{display:block;}
.skill_learned .imgs .aced{display:none;}
.skill_learned .imgs .locked{display:none;}
.skill_learned .name{font-weight:900;margin-bottom:5px;2text-transform:uppercase;font-size:12px;}
.skill_aced{opacity:1;border:1px solid #00000033;}
.skill_aced .imgs .aced{display:block;}
.skill_aced .imgs .corner{display:none;}
.skill_aced .imgs .locked{display:none;}
.skill_aced .imgs .skill_img{background:#151a1a;border:2px solid #323e3a;padding:0 20px;float:left;}
.skill_aced .name{font-weight:900;margin-bottom:5px;2text-transform:uppercase;font-size:12px;}
.skill_locked{opacity:0.2;border:1px solid #00000000;}
.skill_locked:hover{opacity:1;border:1px solid #00000000;}
.skill_locked .imgs .aced{display:none;}
.skill_locked .imgs .corner{display:none;}
.skill_locked .imgs .locked{display:block;}
.skill_unlearned{opacity:0.5;border:1px solid #00000011;}
.skill_unlearned:hover{opacity:1;border:1px solid #00000011;}
.skill_unlearned .imgs .corner{display:none;}
.skill_unlearned .imgs .aced{display:none;}
.skill_unlearned .imgs .locked{display:none;}
.skill_unlearned .imgs .skill_img{background:#151a1a;border:2px solid #323e3a;padding:0 20px;float:left;opacity:0.3;}
.skill_quest{display:none;z-index:1000;position:absolute;right:5px;top:5px;background:#000;color:#fff;width:20px;height:20px;border-radius:20px;text-align:center;}



.skill_small{opacity:1;2border:1px solid #00000033;margin:0px;float:left;}
.skill_small .imgs .corner{display:none;}
.skill_small .imgs .aced{display:none;}
.skill_small .imgs .locked{display:none;}
.skill_small .imgs .skill_img{background:#151a1a;border:2px solid #323e3a;padding:0 1px;float:left;width:26px;opacity:1;}
.skill_small .name{display:none;font-weight:900;margin-bottom:5px;2text-transform:uppercase;font-size:12px;}
.skill_small .skill_quest{opacity:0;}
.tooltip{display: -webkit-flex;display: flex;justify-content: space-between;flex-flow: row wrap;align-items: center;padding:0 10px;text-align:justify;display:none;position:absolute;max-width:320px;padding:10px;background:#000000dd;color:#fff;border:1px solid #ffffff44;z-index:100;display:none;}

.tip_title{color:#e8cb00;font-weight:bold;width:100%;overflow:auto;display:block;}

.skills_branch{margin:auto;max-width:1200px;padding:0px;overflow:auto;background:#ebf2fb;border:1px solid #dbe1e9;margin:10 0px;color:#000;border-radius:5px;overflow: auto;white-space: nowrap;}
.skills_branch .skill{display:inline-block;border-radius:5px;position:relative;overflow: hidden;padding:10px;margin:10 10px;2border-radius:5px;background:#00000011;cursor:pointer;}
.skills_branch .skill_small{display:inline-block;border-radius:5px;position:relative;overflow: hidden;padding:2px;margin:0 0px;2border-radius:5px;2background:#00000011;cursor:pointer;}
	  
::-webkit-scrollbar {
    width: 15px;
    border-radius: 10px;
    height: 10px;
    border: 1px solid #838383;
}

::-webkit-scrollbar-thumb {
    border-width: 1px 1px 1px 2px;
    border-color: #000;
    background-color: #9f9f9f;
    border-radius: 10px;
    border: 1px solid #838383;
}
::-webkit-scrollbar-track {
    border-width: 0;
    background-color: #d9d9d9;
    border: 1px solid #838383;
    border-radius: 10px;
}

	.build_list_inv{overflow:auto;width:270px;float:left;padding:5px;}
	.build_list_buffs{color:#fff;width:146px;float:left;    white-space: initial;padding:5 0 5 5px;}
	.build_list_title{color:#222;text-align:left;padding-left:5px;font-size:12px;text-transform:uppercase;2background:#ccc;display:block;font-weight:900;}
	.build_list_skills{width: 720px;max-width:750px;padding:5 0px;margin-bottom:5px;2white-space: nowrap; overflow: auto;float: left;2display: flex;2align-items: center;margin-right:10px;}
	
	
	.build_list_rating_right{float:right;overflow:auto;display:flex;}
	.build_list_rating_left{float:left;overflow:auto;}
	.build_list_link{line-height: 25px; font-weight: 900; margin: 0 10px;}
	
		
	.inv{background:#000000cc;border:1px solid #ffffff44;min-width:184px;height:120px;text-align:center;position:relative;margin:5px;cursor:pointer;overflow:visible;display:inline-block;float: left;overflow: hidden;}
	.inv .title{position:absolute;left:10px;top:10px;color:#ccc;font-size:14px;text-align:left;    text-shadow: #000 0px 0 1px, #000 0px 0 3px, #000 0px 0 4px, #000 0px 0 5px;}
	.inv .title .main{font-weight:bold;text-transform:uppercase;}
	.inv img{max-width:calc(100% - 20px);max-height:calc(100% - 40px);margin-top:30px;}
	
	
	.builder_titles{text-align:right;float:left;}
	
	.builder_buff{float:left;margin:5px;overflow:auto;line-height:25px;padding:3px;border-radius: 5px;font-size: 13px;}
	
	
@media (min-width: 1220px){
	.float_right{float:right;}
	
}

@media (max-width: 1220px){
	.build_list_inv{overflow:auto;width:540px;2float:left;padding:3 0px;display:block;}
	.build_list_buffs{color:#fff;width:450px;float:none;    white-space: initial;}
	.build_list_skills{width: auto;max-width:none;padding:5px;2white-space: nowrap; overflow: auto;float: left;2display: flex;2align-items: center;}
	
	.skill_quest{display:block;}
.skill_unlearned:hover{opacity:0.5;border:1px solid #00000011;}
.skill_locked:hover{opacity:0.2;border:1px solid #00000000;}
.inv{max-width: calc(50% - 12px);min-width:170px;float: none;display:inline-block;overflow: hidden;}
	.build_list_rating_right{float:right;2width:100%;margin-top:5px;overflow:auto;}
	.build_list_rating_left{float:none;overflow:auto;}
	.build_list_link{line-height: 25px; font-weight: 900; margin: 0 10px;display:block;2float:left;width:100%;}
	.builder_titles{text-align:left;}
	.builder_buff{float:left;margin:5 0px;overflow:auto;line-height:25px;padding:3 0px;border-radius: 5px;font-size: 13px;}
	
	
	
}



.buff_grit2{border-radius:3px;padding:1 5px;background:#2dad72;font-weight:900;color:#000;float:left;display: inline-block;flex-grow: 0;margin:3 2px;text-transform:uppercase;font-size:10px;border:1px solid #000000aa;}
.buff_edge2{border-radius:3px;padding:1 5px;background:#ad2d2d;font-weight:900;color:#000;float:left;display: inline-block;flex-grow: 0;margin:3 2px;text-transform:uppercase;font-size:10px;border:1px solid #000000aa;}
.buff_rush2{border-radius:3px;padding:1 5px;background:#37aadd;font-weight:900;color:#000;float:left;display: inline-block;flex-grow: 0;margin:3 2px;text-transform:uppercase;font-size:10px;border:1px solid #000000aa;}


.buff_grit{padding:3px;background:#2dad72;font-weight:900;color:#000;float:left;display: inline-block;flex-grow: 0;margin:3px;margin-top:10px;text-transform:uppercase;font-size:10px;}
.buff_edge{padding:3px;background:#ad2d2d;font-weight:900;color:#000;float:left;display: inline-block;flex-grow: 0;margin:3px;margin-top:10px;text-transform:uppercase;font-size:10px;}
.buff_rush{padding:3px;background:#37aadd;font-weight:900;color:#000;float:left;display: inline-block;flex-grow: 0;margin:3px;margin-top:10px;text-transform:uppercase;font-size:10px;}




	.build_type_butt{float:left;background:#ffffff44;color:#fff;width:97px;text-align:center;line-height:20px;margin:10 5px;text-transform:uppercase;font-size:11px;cursor:pointer;border-radius:5px;border:1px solid #000}
	.build_type_butt_active{float:left;background:#226ea5;color:#fff;width:100px;text-align:center;line-height:20px;margin:10 5px;text-transform:uppercase;font-size:11px;cursor:pointer;border-radius:5px;border:1px solid #000}
	

	
	
	.inv_small{background:#5d878738;border:1px solid #ffffff44;min-width:80px;height:65px;padding:3 0px;text-align:center;position:relative;margin:3px;cursor:pointer;overflow:hidden;display:inline-block;float: left;border: 1px solid #00000033;border-radius:5px;}
	.inv_small .title{position:absolute;left:5px;top:5px;color:#000;font-size:10px;text-align:left;    2text-shadow: #000 0px 0 1px, #000 0px 0 3px, #000 0px 0 4px, #000 0px 0 5px;}
	.inv_small .title .main{font-weight:bold;text-transform:uppercase;}
	.inv_small img{max-width:calc(100% - 10px);max-height:calc(100% - 30px);margin-top:30px;}
	
	
	
	
	
	
	
	
	
	
	
	
.menu{font-weight:bold;font-size:15px;padding:0 15px;line-height:40px;display:inline-block;color:#fff;cursor:pointer;cursor:hand;text-transform:uppercase;}

.menu_block{overflow:auto;display:block;float:right;}
.mobile_menu{float:right;display:none;}


@media (min-width: 1029px){.menu a{color:#fff;}
.header{  margin:0 0 5 0px;width:calc(100% - 0px);margin-top: 5px;
    margin-bottom: 2px;}
}



@media (min-width: 851px) and (max-width: 1029px){.menu a{color:#fff;}
body{max-width:100%;margin:auto;}
.header{margin:0px;width:calc(100% - 0px);margin: 10 10px;width: calc(100% - 20px);}

.content{max-width:calc(100% - 20px);2overflow:auto;margin:auto;padding:10px auto 0px auto;margin:10px auto 0px auto;}
}


@media (min-width: 0px) and (max-width: 850px){
	.mobile_menu{display:block;}
.menu_block{position:sticky;top:50px;left:0px;width:100%;background:#fff;z-index:11;overflow:auto;color:#000;display:none;}
.menu{font-weight:bold;font-size:20px;padding:0 20px;line-height:50px;width:calc(100% - 40px);color:#000;cursor:pointer;cursor:hand;background: #fff; overflow: auto;}

}

@media (min-width: 431px) and (max-width: 850px){
body{max-width:850px;}
	.header{position: sticky;top:0px;margin: 10 10px;width: calc(100% - 20px);}
.content{max-width:820px;width:calc(100% - 20px);2overflow:auto;margin:auto;margin:10px auto 10px auto;}

}


.header2{    z-index: 10;height:50px;border-bottom: 1px solid #000;background: linear-gradient(135deg, #000000 250px,#ffffff 13%); border-top: 0px solid #000; border-bottom: 0px solid #fff;
z-index: 10; height: 50px; background: linear-gradient(90deg, #30505e 220px,#ffffff 13%); border-bottom: 2px solid #30505e; margin-top: 10px;
}


@media (min-width: 0px) and (max-width: 430px){
	body{margin:0px;}
	.header{position: sticky;top:0px;left:0px;width:100%; background: linear-gradient(90deg, #30505e 185px,#ffffff 13%); border-bottom: 2px solid #30505e;margin-top:0px;}
	
	.logo{text-transform:uppercase;font-weight:bold;font-size:24px;padding:0 20px;line-height: 40px;float:left;2-webkit-text-fill-color: white; 2-webkit-text-stroke-width: 1px; }

.content{max-width:1100px;margin:0px;}
.content_left{max-width:730px;min-width:280px;background:#fff;padding:0px;line-height:25px;font-size:14px;margin:auto;float:left;margin-bottom:10px;}
.video_block{float:left;width:100%;min-width:320px;2background:#fff;2height:400px;}
.video_block_inner{padding:20px;margin:0 0 10 0px;background:#fff;}
.categories_block{float:left;width:calc(100% - 20px);2margin-top:10px;background:#fff;2height:400px;padding:10px;}
}


.header{       2overflow: auto; z-index: 10;height:50px;border-bottom: 1px solid #000;background: linear-gradient(135deg, #000000 250px,#ffffff 13%); border-top: 0px solid #000; border-bottom: 0px solid #fff;
z-index: 10; height: 40px; background: linear-gradient(90deg, #30505e 220px,#ffffff 13%); background:#fff;border-bottom: 2px solid #30505e; 2margin-top: 10px;


position: sticky; top: 0px; left: 0px; width: 100%; background: linear-gradient(90deg, #30505e 185px,#ffffff 13%); border-bottom: 0px solid #30505e; margin-top: 0px;border-radius:7px;margin-top:3px;
background: #000000ad;margin:auto;margin-top: 5px;
    margin-bottom: 2px;
}



.butt{background: #2196f3; color: #fff; line-height: 25px;  color: #fff; font-weight: bold; padding: 0 10px; float: right; border-radius: 5px; cursor: pointer;margin:10px;}