.arrow:before {
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	content: '';
	opacity: 1;
	-webkit-transition: all 320ms ease-out;
	-moz-transition: all 320ms ease-out;
	-ms-transition: all 320ms ease-out;
	-o-transition: all 320ms ease-out;
	transition: all 320ms ease-out;
	filter: alpha(opacity=100);
	z-index:15;
}

.arrow.arrow-hide:before {
	opacity: 0;
	filter: alpha(opacity=0)
}

.arrow.arrow-up:before {
	border-left: 0 solid transparent;
	border-right: 0 solid transparent;
	border-bottom: 0 dashed #fff
}

.arrow.arrow-right:before {
	border-top: 0 solid transparent;
	border-bottom: 0 solid transparent;
	border-left: 0 solid #fff
}

.arrow.arrow-down:before {
	border-left: 0 solid transparent;
	border-right: 0 solid transparent;
	border-top: 0 dashed #fff
}

.arrow.arrow-left:before {
	border-top: 0 solid transparent;
	border-bottom: 0 solid transparent;
	border-right: 0 dashed #fff
}

.arrow.arrow-up.arrow-inherit:before {
	border-bottom-color: inherit
}

.arrow.arrow-right.arrow-inherit:before {
	border-left-color: inherit
}

.arrow.arrow-down.arrow-inherit:before {
	border-top-color: inherit
}

.arrow.arrow-left.arrow-inherit:before {
	border-right-color: inherit
}

.arrow.arrow-up.arrow-small:before { top: -5px }

.arrow.arrow-up.arrow-normal:before { top: -10px }

.arrow.arrow-up.arrow-large:before { top: -20px }

.arrow.arrow-left.arrow-small:before { left: -5px }

.arrow.arrow-left.arrow-normal:before { left: -10px }

.arrow.arrow-left.arrow-large:before { left: -20px }

.arrow.arrow-right.arrow-small:before { right: -5px }

.arrow.arrow-right.arrow-normal:before { right: -10px }

.arrow.arrow-right.arrow-large:before { right: -20px }

.arrow.arrow-down.arrow-small:before { bottom: -5px }

.arrow.arrow-down.arrow-normal:before { bottom: -10px }

.arrow.arrow-down.arrow-large:before { bottom: -20px }

.arrow.arrow-small:before { border-width: 5px }

.arrow.arrow-normal:before { border-width: 10px }

.arrow.arrow-large:before { border-width: 20px }