/*---- Styles you may want to adjust ----*/
.textreflectionEffectWrapper {
	margin: -27px 0 0 0;/* adjust margin-top to adjust space between original text and reflection */
	height: 48px;/* height of reflection */	
}
.textreflectionClone {
	line-height: 1;/* adjust to fine-tune vertical position of reflected text behind gradient (within div.textreflectionEffectWrapper) */
}
.textreflectionMask {
	/* code for gradient overlaying the reflection; adjust if you want another gradient than 50% white to solid white */
	background: -moz-linear-gradient(top, rgba(240,240,240,0.8) 0%, rgba(240,240,240,1) 50%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(240,240,240,1)), color-stop(100%,rgba(240,240,240,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(240,240,240,0.8) 0%,rgba(240,240,240,1) 50%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(240,240,240,0.8) 0%,rgba(240,240,240,1) 50%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, rgba(240,240,240,0.8) 0%,rgba(240,240,240,1) 50%); /* IE10+ */
	background: linear-gradient(top, rgba(240,240,240,0.8) 0%,rgba(240,240,240,1) 50%); /* W3C */
}
.textreflectionMask.noGradients {
	/* use image for browsers that do not support css-gradients */
	/* adjust if you want another gradient than 70% white to solid white */
	background: transparent url(../images/gradient-white.png) repeat-x 0 0;
}

/*---- You probably won't want to change the values below this comment ----*/
.textreflectionWrapper {
	position: relative;
	overflow: visible;
}
.textreflectionEffectWrapper {
	position: absolute;
	overflow: hidden;
	left: 0;
	padding: 0;
	width: 100%;
	z-index: 0;
}
/* iPhone sometimes has trouble displaying reflections correctly; hide them until we've found a fix */
@media (max-device-width: 320px) {
	.textreflectionEffectWrapper {
		display: none;
	}
}
.textreflection {
	position: relative;
	z-index: 1;
}
.textreflectionClone {
	position: absolute;
	margin: 0;
	top: 0;
	left: 0;
	z-index: 0;
	overflow: hidden;
	height: 100%;
	width: 100%;
	
	/* code for flipping the clone */
	-moz-transform: scaleY(-1); /* Gecko */
	-o-transform: scaleY(-1); /* Opera */
	-webkit-transform: scaleY(-1); /* webkit */
	transform: scaleY(-1); /* standard */
	filter: FlipV; /* IE 6/7/8 */
}
.textreflectionMask {
	position: relative;
	top: 0;
	left: 0;
	height: 100%;
	z-index: 1;
}