Size of text inside a slider is too big in mobile phones. In a laptop is OK.

Hi, First of all congratulations for the template is awesome. I am contacting you because when I look the website in a mobile phone, the text inside the slider is too big for the size of the window, so only I can see some of the text. How can I resize the text of the slider for small windows? Some part of the text use the class class="text-rotater. Thank you in advance.

This is the code:

	<section id="slider" class="slider-parallax" style="background: url('_img/bg_slider.jpg'); background-size: cover;" data-height-lg="670" data-height-md="500" data-height-sm="400" data-height-xs="250" data-height-xxs="200">
		<div class="slider-parallax-inner">

			<div class="container clearfix">
				<div class="vertical-middle center">

					<div class="heading-block nobottomborder center">
						<h1>
							<div class="text-rotater nocolor" data-separator="|" data-rotate="flipInX" data-speed="3500">
								<span class="t-rotate">English Language Programs in USA|Business Programs|Undergraduate Programs|Master and PHD Programs| Certificate Programs & Diplomas|Programs for adults and young students|Graduate Preparation and More</span>
							</div>
						</h1>
						<h4 style="color: #FF6100; ">Study Abroad at prestigious Universities & Institutes</h4>
					</div>

					[Check the Programs](#main)
					
                    <br>
                    <br>
                    <br>
                    [](#main)

				</div>
			</div>
		</div>
        
	</section>

You can check a live version here: http://www.vivecampus.com/