/*
//////////////////////////////
	AVATAR PREVIEW
*/
/* Le calage vertical de l'apercu est gere par son conteneur, dans
   avatar_v3_builder.css : l'apercu et ses boutons doivent rester solidaires. */


.av{
	width:200px;
	height: 200px; 
	border-radius: 100%; 
	overflow: hidden;
	background-color: #9fc8f4;

}
.av_in {
	position: relative;
	width: 200px;
	height: 200px;
	border-radius: inherit;
	transform-origin: 0 0;
}
.av_ch {
	position:relative; 
	width:100%; 
	height: 100%;
	border-radius:inherit;
	/*filter: drop-shadow(0 0 0 rgba(0,0,0,.8));*/
	z-index: 5;
}
/*
.av .sp{
	position:absolute; 
	transform:translate(-50%);
	left: 50%;
}
*/




.av .sp {
    position: absolute;
    width: 100%;
    display: flex;
    justify-items: center;
    justify-content: center;
}
.monster .e{
	bottom:45%!important;
}
.animal .bdT{
	z-index:7!important;
	top:14%!important;
}
.animal .bdB{
	z-index:2!important;
}
.animal .e{
	z-index:8!important;
}
.animal .w{
	z-index:3!important;
}
.animal .j{
	z-index:5!important;
}
.animal .a{
	z-index:6!important;
}
.animal .m{
	top:61%!important;
}
.blazon .be{ /* ordinaries */
	top:0%!important;
}

.blazon .g{ /* charge */
	bottom:23%!important;
}
.blazon .ht{ /* shield */
	top:0%!important;
}

.mF_jk{
	top:48%!important;
}
.e_jk{
	bottom:43%!important;
}

.av_in .bg{
	top:0px; 
	z-index: 1; 
	border-radius: inherit;
	width:100%;
	height: 100%;	
}
.av .bgc{
	width:100%;
	height: 100%;
	z-index:2;
	position:absolute;
	top:0;
	left:0;
	/*filter:saturate(80%);*/
}
.av .bgi {
    width: 100%;
    height: 100%;
    mix-blend-mode: soft-light;
    opacity: 1;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}
.a_bl{z-index:8!important;}
.animal .a_bl{z-index:4!important;}

.av_in .bd{bottom:0%; z-index: 3;}
.av_in .bdT{top:19.2%; z-index: 3;}
.av_in .sT{top:20%; z-index: 4;}
.av_in .e{bottom:47%; z-index: 5; opacity:.9;}
.av_in .h{top:-10px; z-index: 6;height:100%;}
.av_in .ea{top:54%; z-index: 7;}
.av_in .bdB{bottom:0px; z-index: 7;}
.av_in .sB{top:55%; z-index: 8;}
.av_in .w{bottom:-1px; z-index: 8;border-radius:inherit;}
.av_in .j{bottom:-1px; z-index: 10;border-radius:inherit;}
.av_in .a{top:75%; z-index: 11;}
.av_in .m{top:59%; z-index: 9; opacity:.9;}
.av_in .be{top:44%; z-index: 12;}
.av_in .n{top:46%; z-index: 13;}
.av_in .g{bottom:42%; z-index: 14;}
.av_in .ht{top:-7px;z-index: 15;}

.av_in .bg_overlay{height:200px;mix-blend-mode:color; opacity:.1 ;z-index:20;}

.av_in .mF_mn{top:57%};



/*
//////////////////////////////
	HAIR CLIPPATH
*/


/* clipPah for hair under hat */
/*-----------------------------------*/
.hC0 {}

.hC1 { /* low hat */
    clip-path: circle(46% at 50% 74%);
}
.hC2 { /* high hat */
    clip-path: circle(46% at 50% 66%);
}
.hC3 { /* very low hat */
    clip-path: circle(43% at 50% 74%);
}
.hC4 { /* very very low hat */
	clip-path: circle(43% at 50% 81%);
}
.hC5 { /* for cowboy 1 c77 */
	clip-path: circle(38% at 50% 68%);
}
.hC10 { /* for casquette envers */
    clip-path: polygon(40.66% 18.47%, 62.37% 18.22%, 77.24% 41.49%, 82.24% 48%, 86.74% 54.75%, 89.74% 60.74%, 93.24% 67.48%, 96.48% 76.13%, 100% 100%, 0% 100%, 3.77% 81.91%, 7.47% 73.37%, 9.95% 65.83%, 11.92% 57.99%, 15.26% 51.49%, 18.76% 44.73%, 22.58% 39.23%);
}
.hC11 { /* for full helmets  */
	clip-path: polygon(24.76% 40.12%, 75.24% 41.34%, 73.55% 72.07%, 76.33% 79.27%, 80.68% 88.29%, 83.57% 98.29%, 43.24% 100%, 9.66% 99.02%, 17.15% 87.07%, 23.19% 77.56%, 26.45% 70.37%);
}
.hC12{ /* hair starts under the ears */
	clip-path: polygon(20.39% 49.51%, 20.39% 43.2%, 24.76% 35.92%, 33.25% 28.88%, 49.76% 24.27%, 64.56% 28.88%, 72.33% 35.68%, 76.94% 42.72%, 77.91% 49.27%, 83.98% 57.52%, 89.56% 64.08%, 94.66% 70.63%, 99.76% 81.31%, 100% 100%, 0% 100%, 0% 85.92%, 2.91% 78.64%, 5.58% 71.12%, 9.47% 62.38%, 14.81% 57.04%);
}
.hC13{ /* hair starts under the ears 2 */
	clip-path: polygon(33% 27%, 68.75% 28%, 80.25% 42.25%, 80% 48.5%, 84% 52.5%, 86% 58%, 87.25% 64%, 88.5% 73%, 89.25% 82.25%, 94.5% 100%, 7.5% 100%, 14% 88.75%, 12% 78.75%, 12% 69.25%, 14.25% 61.25%, 17.75% 53.25%, 20.5% 47.25%, 21.25% 37.5%);
}


/* Color filters */
/*-----------------------------------*/
.h_br{
	filter: brightness(1.2);
}
.h_lb{
	filter: brightness(2) contrast(0.9) saturate(0.9);
}
.h_bd {
	filter: hue-rotate(9deg) saturate(71%) brightness(483%) contrast(1.1);
}
.h_bd2 {
	filter: hue-rotate(9deg) saturate(112%) brightness(343%) contrast(0.7);
}
.h_rd {
	filter: hue-rotate(5deg) saturate(165%) brightness(228%) contrast(1.6);
}
.h_bk {
    filter: hue-rotate(-150deg) saturate(50%) brightness(130%) contrast(150%);
}
.h_gy{
	filter: hue-rotate(-170deg) saturate(13%) brightness(230%) contrast(1.9);
}
.h_wh{
	filter: hue-rotate(-160deg) saturate(10%) brightness(470%) contrast(1);
}
.h_gn{
	filter: hue-rotate(80deg) saturate(110%) brightness(220%);
}
.h_bu{
	filter: hue-rotate(189deg) saturate(150%) brightness(169%);
}
.h_vi{
	filter: hue-rotate(270deg) saturate(150%) brightness(162%);
}
.h_rb{
	filter:hue-rotate(320deg) saturate(173%) brightness(141%);
}



/*
//////////////////////////////
	BODY
*/

.bd_pa{
		filter: hue-rotate(340deg) saturate(30%) brightness(115%);

	filter: hue-rotate(0deg) saturate(70%) brightness(115%);
}
.bd_wh{
	
}
.bd_br{
	filter: hue-rotate(-10deg) saturate(101%) brightness(85%);
}
.bd_bk {
    filter: hue-rotate(-30deg) saturate(100%) brightness(60%);
}
.bd_yl{
	filter: hue-rotate(10deg) saturate(113%) brightness(110%);
}
.bd_bu{
	filter: hue-rotate(170deg) saturate(131%) brightness(90%);
}
.bd_gn{
	filter: hue-rotate(-280deg) saturate(141%) brightness(90%);
}
.bd_rd {
    filter: hue-rotate(-31deg) saturate(116%) brightness(72%)contrast(1.9);
}
.body_ork {
    filter: hue-rotate(70deg) saturate(80%) brightness(90%);
};

/*
//////////////////////////////
	OPTIONAL HUES

1 : from red to primary and pink 
2 : 
3 :
4 : Gold > silver
5 : Military
6 : All colors from orange
7 : Brightness versions
8 : coat : From brown to kaki, grey, black and deep colors



*/


.hue_version_cell{
	filter: saturate(0%);
}

.u0{

}
.u11{
	filter: hue-rotate(220deg);
}
.u12{
	filter: hue-rotate(120deg)brightness(1.2) saturate(0.7)
}
.u13{
	filter: hue-rotate(300deg) saturate(40%) brightness(1.6)
}



.u21{
	filter: hue-rotate(-301deg)saturate(0.1);
}
.u22{
	filter: hue-rotate(95deg)saturate(.5);
}
.u23{
	filter: hue-rotate(225deg)saturate(0.8);
}
.u24{
	filter: hue-rotate(225deg)saturate(0.6) brightness(0.7) contrast(1.3);
}


.u31{
	filter: hue-rotate(-0deg)saturate(0.3) brightness(0.7);
}
.u32{
	filter: hue-rotate(250deg)saturate(1) brightness(1.2);
}
.u33{
	filter: hue-rotate(120deg)saturate(1.5);
}
.hue3_4{
	filter: hue-rotate(225deg)saturate(0.6) brightness(0.7) contrast(1.3);
}


/* gold >> silver  */
.u41{
	filter: saturate(0) contrast(1.2);
}

/* Military */
.u51{
	filter: hue-rotate(-181deg)saturate(0.1) brightness(0.7);
}
.u52{
	filter: hue-rotate(55deg) saturate(0.7) brightness(.9);
}
.u53{
	filter: hue-rotate(180deg) saturate(2.2) brightness(0.8);
}
.u54{
	filter: hue-rotate(-181deg)saturate(0.3) brightness(1.7)
}
.u55{
	filter: hue-rotate(-4deg)saturate(0.6) brightness(1.2) contrast(1.5)
}
.u56{
	filter: hue-rotate(180deg) saturate(0.7) brightness(1);
}



/* 
 All colors from orange :
 */
.u61{ /* white */
	filter: saturate(0) brightness(1.45) contrast(1.3)
}
.u62{ /* yellow */
	filter:hue-rotate(25deg) saturate(0.7) brightness(1.4)
}
.u63{ /* orange */
	filter:hue-rotate(5deg) brightness(1.1) saturate(0.9)
}
.u64{ /* deep red */
	filter: hue-rotate(-17deg) saturate(0.9) brightness(0.8) contrast(1.5)
}
.u642{ /* light red */
	filter: hue-rotate(-17deg) saturate(1) brightness(1) contrast(1.1)
}
.u65{ /* pink */
	filter: hue-rotate(-73deg) saturate(0.6) brightness(1)
}
.u66{ /* violet */
	filter: hue-rotate(-116deg) saturate(0.7) brightness(1)
}
.u67{ /* light-blue */
	filter: hue-rotate(-155deg) saturate(0.7)
}
.u68{ /* blue */
	filter: hue-rotate(-165deg) saturate(0.8) brightness(0.8) contrast(1.3)
}
.u69{ /* turquoise */
	filter: hue-rotate(-192deg) saturate(.6) brightness(1.1)
}
.u610{ /* green */
	filter: hue-rotate(-275deg) saturate(0.6)
}
.u611{ /* black */
	filter: hue-rotate(-165deg) saturate(0.2) brightness(0.4);
}
.u612{ /* grey */
	filter: hue-rotate(-165deg) saturate(0.2) brightness(1);
}
.u613{ /* kaki */
	filter: hue-rotate(45deg) saturate(0.5);
}
.u614{ /* Brown */
	filter: hue-rotate(5deg) saturate(0.6) brightness(0.8) contrast(1.4)
}

/*
Brightness versions

*/
.u71{
	filter:hue-rotate(0deg)saturate(0.7) contrast(1) brightness(1.2);
}
.u72{
	
}
.u73{
	filter:hue-rotate(0deg)saturate(1) contrast(1.3) brightness(0.7);
}
.u74{ /* green */
	filter:hue-rotate(60deg)saturate(1) contrast(1) brightness(0.8);
}
.u75{
	filter: hue-rotate(0deg)saturate(1) contrast(1.6) brightness(0.3);
}
.u76{ /* blue */
	filter:hue-rotate(180deg)saturate(1.2) contrast(1) brightness(0.8);
}
.hue7_7{ /* red */
	filter:hue-rotate(330deg)saturate(2) contrast(0.9) brightness(0.9);
}

/*
 From brown to kaki, grey, black and deep colors
 */
.u81{ /* black */
	filter:hue-rotate(-165deg) saturate(0.2) brightness(0.9) contrast(1.6);
}
.hue8_2{ /* deep brown */
	filter:hue-rotate(5deg) saturate(0.6) brightness(0.8) contrast(1.2);
}
.u83{ /* Brown */
	filter:hue-rotate(5deg) saturate(0.7) brightness(0.9) contrast(1.1);
}
.u84{ /* Light brown */
	filter:hue-rotate(19deg) brightness(1.4) saturate(0.6);
}
.u85{ /* deep red */
	filter:hue-rotate(-25deg) saturate(0.8) brightness(1) contrast(1.2);
}
.u86{ /* deep purple */
	filter:hue-rotate(-73deg) saturate(0.6) brightness(1) contrast(1.1);
}
.u87{ /* violet */
	filter:hue-rotate(-123deg) saturate(0.6) brightness(1.2) contrast(1.1);
}
.u88{ /* deep blue */
	filter:hue-rotate(-165deg) saturate(0.8) brightness(1) contrast(1.3);
}
.u89{ /* deep green */
	filter:hue-rotate(-255deg) saturate(0.7) brightness(1.2);
}
.u810{ /* white */
	filter:hue-rotate(-165deg) saturate(0.2) brightness(2.1) contrast(0.9);
 }

 /* from yellow to orange */
 .u91{
 	filter:hue-rotate(-40deg)saturate(1.2);
 }

 /* from orange to strong black and white*/

 .u101{
 	/* white */
 	filter:saturate(0) brightness(3);
 }
 .u102{
 	/* black */
 	filter:saturate(0) brightness(.2);
 }

/* EYES */
/*-----------------------------------*/

.e_bu{

}
.e_gn{
filter: hue-rotate(-120deg) saturate(1) contrast(1) brightness(1);
}
.e_br{
	filter:hue-rotate(194deg) brightness(0.8) contrast(1.5);
}
.e_bk{
	filter: saturate(.1) brightness(0.85) contrast(1.5);
}

.e_gy{
	filter: saturate(.1);
}

.e_rd{
	filter: hue-rotate(157deg);
}

.e_vi{
	filter: hue-rotate(77deg);
}

.e_yl {
    filter: hue-rotate(176deg) brightness(1.1) contrast(0.8);
}

/* NOSE */
/*-----------------------------------*/
.nF0{
	opacity:1;
}
.nF_mk{
	opacity:1;
}
.nF_bk{
	opacity:1;
}

.sF0{
	opacity:.3;
}
.sF_bk{
	opacity:1;
}

/* MOUTH */
/*-----------------------------------*/

.mF6{
	filter:saturate(1) brightness(1);
}
.mF0{
	filter:saturate(0.6) brightness(1.4);
}
.mF1{
	filter: hue-rotate(25deg) brightness(1.5) saturate(0.4);
}
.mF2{
	   filter: saturate(0.4);
}
.mF3{
	filter: hue-rotate(217deg) saturate(0.5);
}
.mF4{
	filter: hue-rotate(116.8deg) saturate(1.2);
}
.mF5{
	filter: hue-rotate(-74deg) saturate(0.8) brightness(1.2);
}


/* MONSTER */
/*-----------------------------------*/

.mon_rd{
	filter: hue-rotate(-0deg) saturate(100%) brightness(100%);
}
.mon_bu{
	filter: hue-rotate(-148deg) saturate(78%) brightness(110%);
}
.mon_yl{
	filter: hue-rotate(47deg) saturate(94%) brightness(169%);
}
.mon_or{
	filter: hue-rotate(27deg) saturate(74%) brightness(145%);
}
.mon_gn{
	filter: hue-rotate(89deg) saturate(100%) brightness(129%);
}
.mon_vi{
	filter: hue-rotate(-110deg) saturate(102%) brightness(102%);
}
.mon_pk{
	filter: hue-rotate(300deg) saturate(40%) brightness(1.5);
}
.mon_wh{
	filter: hue-rotate(207deg) saturate(2%) brightness(219%);
}

/* BLAZON */
/*-----------------------------------*/

.bz_yl{
	filter: hue-rotate(26.6deg) saturate(0.7) brightness(1.4);
}
.bz_or{
	filter: brightness(1.1);
}
.bz_rd{
	filter: hue-rotate(-25deg) saturate(0.7) brightness(0.82) contrast(1.3);
}
.bz_pk{
	filter: hue-rotate(-73deg) saturate(0.4) brightness(1.23);
}
.bz_vi{
	filter: hue-rotate(-106deg) saturate(0.7) brightness(1);
}
.bz_bu{
	filter: hue-rotate(-165deg) saturate(0.58) brightness(0.92) contrast(1.2);
}
.bz_tq{
	filter: hue-rotate(-172deg) saturate(0.60) brightness(1.05);
}
.bz_gn1{
	filter: hue-rotate(-255deg) saturate(0.7);
}
.bz_gn2{
	filter: hue-rotate(-281deg) saturate(0.64) brightness(1.27);
}
.bz_bk{
	filter: hue-rotate(-135deg) saturate(0.6) brightness(0.19);
}
.bz_wh{
	filter: saturate(0) brightness(1.55) contrast(1.3);
}

.r_color_cont .bz_wh{
	filter: hue-rotate(-160deg) saturate(10%) brightness(140%) contrast(1);
}

.item_cell .bz_wh{
	filter : saturate(0) brightness(1.35) contrast(1.3)
}



/* AVATAR SCALING  */
/*-----------------------------------*/
.av.lg{
	width: 200px;
	height: 200px;
}
.av.md{
	width: 100px;
	height: 100px;
}
.av.sm{
	width: 50px;
	height: 50px;
}
.av.xs{
	width: 25px;
	height: 25px;
}

.av.lg .av_in{
	transform: scale(1.0);
}
.av.md .av_in{
	transform: scale(0.5);
}
.av.sm .av_in{
	transform: scale(0.25);
}
.av.xs .av_in{
	transform: scale(0.125);
}
