/*
	pageAnimate WebPage Slider v1.1
	By Jesse MacLeod: http://CreativeWebsites.me
	User, 'JesseMacLeod' on CodeCanyon
*/
/* You shouldn't need to change much of the code below. */
html, body {
	margin:0;padding:0;
	overflow:hidden;/*This is set to hidden so that the scrollbars do not show. Make sure that other stylesheets in your project do not have an overflow property set.*/
}
.pageAnimate {/*Holds everything in the pageAnimate slider.*/
	background:transparent;
	display:block;
	height:auto;
	margin:0;
	overflow:hidden;/*We don't want the container to scroll to show the overflowed slides or rows.*/
	padding:0;
	position:absolute;/*Relative positioning won't work.*/
	width:auto;
}
	.pageAnimate .row {/*A horizontal row which holds any number of slides. Take note that all slides inside a row are not stacked on top of one another - they are next to each other.*/
		background:transparent;
		display:block;
		height:100%;/*This is set to the full height of the viewing window (usually the browser window, and is defined in the jQuery file). */
		margin:0;
		overflow:hidden;
		padding:0;
		position:relative;
		width:300%;/*This value should be set to:  100% * [number of slides in the longest row].  This value is overidden by a dynamically calculated value in jQuery.*/
	}
		.pageAnimate .slide {
			background:transparent;
			display:block;
			float:left;/*Slides are floated to the left so that they stack horizontally, and not vertically.*/
			height:100%;/*This means the slide will be as tall as its '.row' parent.*/
			margin:0;
			overflow:auto;/*If you have lots of content in a slide, we want the user to scroll to view the overflow.*/
			padding:0;
			position:relative;
			width:33.3333%;/*This value should be set to:  100% / [number of slides in the largest '.row']. This width is overidden in jQuery.*/
		}
	.pageAnimate_nav {/*This holds the navigation buttons which advance to a specific slide when clicked.*/
		position:fixed;/*We want the navigation to be visible regardless of what slide we're on.*/
		_position:absolute;/*IE6 hack - it doesn't recognize fixed positioning. If you want your stylesheet to validate, just put this line into a separate IE6 stylesheet via conditional comments.*/
		width:auto;
		z-index:1000000000000000000000;/*The nav should be visible on top of the slider.*/
		/*It's best not to edit the styles above - you can edit the styles below.*/
		background:transparent;
		bottom:0;
		color:white;
		display:block;
		height:auto;
		margin:0;
		padding:5px 50px 10px 50px;
		right:10%;
	}
		.pageAnimate_nav .pageAnimate_trigger {/*When clicked, this will advance the user to a particular slide. The styles below are simply personal preference - change to whatever you want. Triggers can be automatically added to the HTML file by the pageAnimate jQuery script.*/
			background:#FFF;
			border:1px #333 solid;
			border-radius:3px;
			color:#333;
			display:inline-block;
			font-family:'PT Sans';
			font-size:18px;
			height:15px;
			margin:5px;
			outline:none;
			position:relative;
			width:15px;
		}
		.pageAnimate_nav.pageAnimate_trigger:hover {
			background-color:#999;
		}
		.pageAnimate_nav .pageAnimate_triggerActive, .pageAnimate_nav .pageAnimate_triggerActive:hover {/*This class is added to the trigger just clicked by jQuery. Of course, if you don't want this to happen, just disable it in the script settings.*/
			background-color:#09C;
		}