body {
	overflow-x:hidden!important;
}

/*base class*/
.wbt {
	opacity: 0;
	transform:
		rotate(var(--rotate, 0)) scale(var(--scale, 1)) translateX(var(--transx, 0)) translateY(var(--transy, 0));
}
/*right to left*/
.wbt-l {
	--transx: 100px;
}
/*lower right to upper left*/
.wbt-lu {
	--transx: 75px;
	--transy: 75px;
}
/*upper right to lower left*/
.wbt-ld {
	--transx: 75px;
	--transy: -75px;
}
/*letf to right*/
.wbt-r {
	--transx: -100px;
}
/*lower left to upper right*/
.wbt-ru {
	--transx: -75px;
	--transy: 75px;
}
/*upper left to lower right*/
.wbt-rd {
	--transx: -75px;
	--transy: -75px;
}
/*down to up*/
.wbt-u {
	--transy: 100px;
}
/*up to down*/
.wbt-d {
	--transy: -100px;
}
/* out to in*/
.wbt-i {
	--scale: 1.3;
}
/* in to out */
.wbt-o {
	--scale: .7;
}
.wbt-ro-22 {
	--rotate: 22deg;
}
.wbt-ro-45 {
	--rotate: 45deg;
}
.wbt-ro-90 {
	--rotate: 90deg;
}
.wbt-ro-180 {
	--rotate: 180deg;
}
.wbt-ro-n22 {
	--rotate: -22deg;
}
.wbt-ro-n45 {
	--rotate: -45deg;
}
.wbt-ro-n90 {
	--rotate: -90deg;
}
.wbt-ro-n180 {
	--rotate: -180deg;
}
.wbt.active {
	opacity: 1 !important;
	transform: scale(1, 1) translate(0, 0) rotate(0deg) !important;
}