@charset "utf-8";
/* CSS Document */

body {
	margin: 0px;
	padding: 0px;
	overflow-x: hidden;	
}

.letterer-ltr {
	text-align: left;
	direction: ltr;	
}

.letterer-rtl {
	text-align: right;
	direction: rtl;	
}

#letterercontainer {
	float: none;
	width: 45%;
	margin: auto;
	margin-top: 30px;	
}

.letterercontainer h1, h2, h3, h4, h5, h6 {
	color: #00C0E4;	
	font-weight: normal;
	font-size: 30px;
}

.letterercontainer p {
	color: #333;	
	font-weight: normal;
	font-size: 18px;
}

.letterercontainer word { 
	display:inline-block;
}

.letterercontainer letter {
	display: inline-block;
	white-space: pre;
	background: none;
	transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
}

.letterercontainer .initial {
	opacity: 0;
	text-shadow: 0px 0px 10px #000;
	color: #FFF;
}

.letterercontainer.scale .initial {
	transform: scale(8);
	-webkit-transform: scale(8);
	-ms-transform: scale(8);
	-moz-transform: scale(8);
	-o-transform: scale(8);
	transform-origin: 150% 50%;
	-webkit-transform-origin: 150% 50%;
	-moz-transform-origin: 150% 50%;
	-ms-transform-origin: 150% 50%;
	-o-transform-origin: 150% 50%;
}

.letterercontainer.reversescale .initial {
	transform:scale(-15); 
	-webkit-transform:scale(-15); 
	-o-transform:scale(-15); 
	-ms-transform:scale(-15); 
	-moz-transform:scale(-15); 
}

.letterercontainer.translate .initial {
	transform: translate(30px,10px);	
	-webkit-transform: translate(30px,10px);	
	-ms-transform: translate(30px,10px);	
	-moz-transform: translate(30px,10px);	
	-o-transform: translate(30px,10px);	
}	

.letterercontainer.rotate .initial {
	transform: rotatex(90deg);	
	-webkit-transform: rotatex(90deg);	
	-moz-transform: rotatex(90deg);	
	-ms-transform: rotatex(90deg);	
	-o-transform: rotatex(90deg);
}

.letterercontainer.reverserotate .initial {
	transform: rotatey(180deg);
	-webkit-transform: rotatey(180deg);
	-ms-transform: rotatey(180deg);
	-moz-transform: rotatey(180deg);
	-o-transform: rotatey(180deg);
}	

.letterercontainer.skew .initial {
	transform:skew(90deg); 
	-webkit-transform:skew(90deg); 
	-moz-transform:skew(90deg); 
	-ms-transform:skew(90deg); 
	-o-transform:skew(90deg); 
}	

.letterercontainer.basic .initial {
	transform: none;
	-webkit-transform: none;
	-ms-transform: none;
	-moz-transform: none;
	-o-transform: none;
}