.rotator {
	font-size: 40px;
	line-height: 1.1;
	text-transform: uppercase;

}


.rotator .large {
	font-size: 2em;
}

.rotator .medium {
	font-size: 1em;
}

.rotator .small {
	font-size: 0.5em;
}


.rotator h5.heading {
	font-size: 1.7em;
	font-family: "anuratiqdregular", "Montserrat",Helvetica,Arial,sans-serif;
	text-shadow: 0px 0px 20px rgba(0,0,0,0.92);
}

.rotator div.excerpt {
	font-size: 0.4em;
	
}

.rotator div.excerpt p {
	text-shadow: 0px 0px 20px rgba(0,0,0,0.92);
}



.rotator ul li {
	left:0;
	width: 100%;
	position: absolute;
	opacity:0;
	padding: 0px 20px;
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    visibility: hidden;
}

.rotator ul li.toright {

	-webkit-transform: translate(50%, -50%);
    -ms-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
}



.rotator ul li.active {
	opacity: 1;
	-webkit-transition: opacity 0.3s ease-in-out 0.3s, transform 0.3s ease 0.3s, visibility 0.3s ease 0.3s;
	    -ms-transition: opacity 0.3s ease-in-out 0.3s, transform 0.3s ease 0.3s, visibility 0.3s ease 0.3s;
	        transition: opacity 0.3s ease-in-out 0.3s, transform 0.3s ease 0.3s, visibility 0.3s ease 0.3s;

	-webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);

    visibility: visible;
}


.rotator ul li {
	-webkit-transition: opacity 0.3s ease-in-out 0.0s, transform 0.3s ease 0.0s, visibility 0.3s ease 0.3s;
	    -ms-transition: opacity 0.3s ease-in-out 0.0s, transform 0.3s ease 0.0s, visibility 0.3s ease 0.3s;
	        transition: opacity 0.3s ease-in-out 0.0s, transform 0.3s ease 0.0s, visibility 0.3s ease 0.3s;
}



@media only screen and (min-width: 2000px) {
	.rotator h5.heading {
    	font-size: 2.2em;
    }

    .rotator div.excerpt {
	    font-size: 0.5em;
	}
}




@media only screen and (max-width: 768px) {
	.rotator {
		font-size: 50px;
	}


	.rotator div.excerpt {
		font-size: 0.5em;
	}
}

@media only screen and (width: 768px) {
	.rotator h5.heading {
    	font-size: 1.4em;
    }

    .rotator div.excerpt p {
	    max-width: 80%;
	    margin: 0 auto;
	}
}


@media only screen and (max-width: 700px) {

	.rotator {
		font-size: 25px;
	}


	.rotator div.excerpt {
		font-size: 0.7em;
	}

	.rotator h5.heading {
		font-size: 1.4em;
	}

}
