/* background to top :: black */
.bgToTop-black {
	color:#000;
	transition-property: color;
	-moz-transition-property: color;
	-webkit-transition-property: color;
	transition-duration: 1s;
	-moz-transition-duration: 1s;
	-webkit-transition-duration: 1s;
}
.bgToTop-black:before {
	content: "";
	position:absolute;
	z-index:-1;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background: #000;
	transform: scaleY(0);
	-moz-transform: scaleY(0);
	-webkit-transform: scaleY(0);
	transform-origin: 50% 100%;
	-moz-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%;
	transition-property: transform;
	-moz-transition-property: transform;
	-webkit-transition-property: transform;
	transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-webkit-transition-timing-function: ease-out;
}
.bgToTop-black:hover,.bgToTop-black:focus,.bgToTop-black:active {
	color:#fff;
}
.bgToTop-black:hover:before,.bgToTop-black:focus:before,.bgToTop-black:active:before {
	transform: scaleY(1);
	-moz-transform: scaleY(1);
	-webkit-transform: scaleY(1);
}

/* background to top :: red */
.bgToTop-red {
	color:#f66;
	transition-property: color;
	-moz-transition-property: color;
	-webkit-transition-property: color;
	transition-duration: 1s;
	-moz-transition-duration: 1s;
	-webkit-transition-duration: 1s;
}
.bgToTop-red:before {
	content: "";
	position:absolute;
	z-index:-1;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background: #f66;
	transform: scaleY(0);
	-moz-transform: scaleY(0);
	-webkit-transform: scaleY(0);
	transform-origin: 50% 100%;
	-moz-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%;
	transition-property: transform;
	-moz-transition-property: transform;
	-webkit-transition-property: transform;
	transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-webkit-transition-timing-function: ease-out;
}
.bgToTop-red:hover,.bgToTop-red:focus,.bgToTop-red:active {
	color:#fff;
}
.bgToTop-red:hover:before,.bgToTop-red:focus:before,.bgToTop-red:active:before {
	transform: scaleY(1);
	-moz-transform: scaleY(1);
	-webkit-transform: scaleY(1);
}

/* background to radial out :: black */
.bgToRo-black {
	color:#000;
	transition-property: color;
	-moz-transition-property: color;
	-webkit-transition-property: color;
	transition-duration: 1s;
	-moz-transition-duration: 1s;
	-webkit-transition-duration: 1s;
}
.bgToRo-black:before {
	content: "";
	position:absolute;
	z-index:-1;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background: #000;
	border-radius:100%;
	transform: scale(0);
	-moz-transform: scale(0);
	-webkit-transform: scale(0);
	transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-webkit-transform-origin: 50% 50%;
	transition-property: transform;
	-moz-transition-property: transform;
	-webkit-transition-property: transform;
	transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-webkit-transition-timing-function: ease-out;
}
.bgToRo-black:hover,.bgToRo-black:focus,.bgToRo-black:active {
	color:#fff;
}
.bgToRo-black:hover:before,.bgToRo-black:focus:before,.bgToRo-black:active:before {
	transform: scale(2);
	-moz-transform: scale(2);
	-webkit-transform: scale(2);
}

.slideUp-t {
	display:block;
	-webkit-transform: translate3d(0,-100px,0);
	-ms-transform: translate3d(0,-100px,0);
	transform: translate3d(0,-100px,0);
}
.slideUp-t.on {
	-webkit-transform: translate3d(0,0,0);
	-webkit-transition:-webkit-transform 400ms ease-in-out;
	-ms-transform: translate3d(0,0,0);
	-moz-transition-property:-moz-transform;
	transform: translate3d(0,0,0);
	transition: transform 400ms ease-in-out;
}