/* ---------------------------------------------------------------------------- */
/* Slide Styles --------------------------------------------------------------- */
/* ---------------------------------------------------------------------------- */
#slides { height:700px; min-width: 100%; overflow: hidden; margin: 0px; }
#slides h2 { font-family: 'oswaldbook', helvetica, arial, sans-serif; font-size:60px;  }
#slides li { width: 100% !important; display: block !important; box-shadow: inset 0 0 1px #666; }
	#slides li div {
		position: relative;
		height:700px;
		width: 80%;
		margin: 0 auto;
		text-align: left;
		padding: 0 24px;
	}
	.el {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
	}		
	
	
	
	#slides h2 {
		padding-top: 3.2em;
		margin-bottom:0px;
	}
	#slides h3 {
		font-size:32px;
		text-shadow: 0 1px 2px rgba(0,0,0,.25);
		font-weight: normal;
	}

	#slide_build {
		background: #4ec6cd url('../slideimg/slide1.jpg') no-repeat 100% 0;
		background-size: cover;
		-webkit-transition:background-position 1.0s ease-in-out;
		-moz-transition:background-position 1.0s ease-in-out;
		-o-transition:background-position 1.0s ease-in-out;
		-ms-transition:background-position 1.0s ease-in-out;	
		transition:background-position 1.0s ease-in-out;
	}
		#slide_build h2,
		#slide_build h3 {
			margin-left: 4em;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		
		#slide_build .calltoaction {
			margin-left: 20em;
			opacity: 0.1;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.ipad {
			width:650px; /* width: 500px; */
			height: 680px;
			background: url(ipad.png) no-repeat;
			top: -50px;
			right: 300px;
			opacity: 0;
			z-index: 1;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.xero {
			width:206px; /* width: 500px; */
			height: 206px;
			background: url(xero_logo.png) no-repeat;
			top: 400px;
			right: -60px;
			opacity: 0;
			z-index: 1;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.design {
			width: 186px;
			height: 153px;
			background: url(design.png) no-repeat;
			top: 365px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.develop {
			width: 145px;
			height: 155px;
			background: url(develop.png) no-repeat;
			top: 363px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.deploy {
			width: 205px;
			height: 360px;
			background: url(deploy.png) no-repeat;
			top: 220px;
			z-index: 100;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		/*
.deploy {
			width: 147px;
			height: 187px;
			background: url(deploy.png) no-repeat;
			top: 332px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
*/
		#slide_build.active h2,
		#slide_build.active h3,
		.no-csstransitions #slide_build h2,
		.no-csstransitions #slide_build h3 {
			margin-left: 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_build.active .calltoaction {
			margin-left: 0;
			opacity: 1;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		
		#slide_build.active,
		.no-csstransitions #slide_build {
			background-position: 80% 0;
			-webkit-transition:background-position 1.2s ease-in-out;
		-moz-transition:background-position 1.2s ease-in-out;
		-o-transition:background-position 1.2s ease-in-out;
		-ms-transition:background-position 1.2s ease-in-out;	
		transition:background-position 1.2s ease-in-out;
		}
		.active .ipad,
		.no-csstransitions .ipad {
			top: -50px;
			right: -50px;
			opacity: 0.9;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .xero,
		.no-csstransitions .xero {
			top: 310px;
			right: -60px;
			opacity: 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .design,
		.no-csstransitions .design {
			right: 979px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .develop,
		.no-csstransitions .develop {
			right: 827px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .deploy,
		.no-csstransitions .deploy {
			right: 400px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
	#slide_branding {
		background: #4ec6cd url('../slideimg/slide2.jpg') no-repeat -10% 0;
		background-size: cover;
		-webkit-transition:background-position 1.0s ease-in-out;
		-moz-transition:background-position 1.0s ease-in-out;
		-o-transition:background-position 1.0s ease-in-out;
		-ms-transition:background-position 1.0s ease-in-out;	
		transition:background-position 1.0s ease-in-out;
	}
		#slide_branding h2,
		#slide_branding h3 {
			margin-left: 4em;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_branding div {
			
			
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.circles {
			
			height: 151px;
		}
		.top {
			background: url(circles-top.png) no-repeat;
			top: 190px;
			z-index:9;
			right: 50px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.bottom {
			background: url(circles-bottom.png) no-repeat;
			top: 365px;
			right: 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_branding.active { background-position: 100% 0; background-size: cover; }
		#slide_branding.active h2,
		#slide_branding.active h3,
		.no-csstransitions #slide_branding h2,
		.no-csstransitions #slide_branding h3 {
			margin-left: 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_branding.active div,
		.no-csstransitions #slide_branding div{
			background-position: 100% 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .top,
		.no-csstransitions .top {
			background: url(circles-top.png) no-repeat;
			right: 264px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .bottom,
		.no-csstransitions .bottom {
			background: url(circles-bottom.png) no-repeat;
			right: 264px;
			-webkit-transition:all 1.1s ease-in-out;
			-moz-transition:all 1.1s ease-in-out;
			-o-transition:all 1.1s ease-in-out;
			-ms-transition:all 1.1s ease-in-out;	
			transition:all 1.1s ease-in-out;
		}
	
	#slide_web {
		background: #4ec6cd url('../slideimg/slide3.jpg') no-repeat 70% 0;
		background-size: cover;
		-webkit-transition:background-position 1.0s ease-in-out;
		-moz-transition:background-position 1.0s ease-in-out;
		-o-transition:background-position 1.0s ease-in-out;
		-ms-transition:background-position 1.0s ease-in-out;	
		transition:background-position 1.0s ease-in-out;
	}
		#slide_web h2,
		#slide_web h3 {
			margin-left: 4em;
			
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_web div {
			
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_web.active h2,
		#slide_web.active h3,
		.no-csstransitions #slide_web h2,
		.no-csstransitions #slide_web h3 {
			margin-left: 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_web.active,
		.no-csstransitions #slide_web {
			background-position: 100% 0;
			-webkit-transition:background-position 1.0s ease-in-out;
			-moz-transition:background-position 1.0s ease-in-out;
			-o-transition:background-position 1.0s ease-in-out;
			-ms-transition:background-position 1.0s ease-in-out;	
			transition:background-position 1.0s ease-in-out;
		}
		#slide_web.active div,
		.no-csstransitions #slide_web div {
			background-position: 100% 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		
		/* New Slide */
		
		#slide_4 {
		background: #4ec6cd url('../slideimg/slide4.jpg') no-repeat -10% 0;
		background-size: cover;
		-webkit-transition:background-position 1.0s ease-in-out;
		-moz-transition:background-position 1.0s ease-in-out;
		-o-transition:background-position 1.0s ease-in-out;
		-ms-transition:background-position 1.0s ease-in-out;	
		transition:background-position 1.0s ease-in-out;
	}
		#slide_4 h2,
		#slide_4 h3 {
			margin-left: 4em;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_4 div {
			
			
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.circles {
			height: 151px;
		}
		.top {
			background: url(circles-top.png) no-repeat;
			top: 190px;
			z-index:9;
			right: 50px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.bottom {
			background: url(circles-bottom.png) no-repeat;
			top: 365px;
			right: 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_4.active { background-position: 100% 0; background-size: cover; }
		#slide_4.active h2,
		#slide_4.active h3,
		.no-csstransitions #slide_4 h2,
		.no-csstransitions #slide_4 h3 {
			margin-left: 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		#slide_4.active div,
		.no-csstransitions #slide_4 div{
			background-position: 100% 0;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .top,
		.no-csstransitions .top {
			background: url(circles-top.png) no-repeat;
			right: 264px;
			-webkit-transition:all 1.0s ease-in-out;
			-moz-transition:all 1.0s ease-in-out;
			-o-transition:all 1.0s ease-in-out;
			-ms-transition:all 1.0s ease-in-out;	
			transition:all 1.0s ease-in-out;
		}
		.active .bottom,
		.no-csstransitions .bottom {
			background: url(circles-bottom.png) no-repeat;
			right: 264px;
			-webkit-transition:all 1.1s ease-in-out;
			-moz-transition:all 1.1s ease-in-out;
			-o-transition:all 1.1s ease-in-out;
			-ms-transition:all 1.1s ease-in-out;	
			transition:all 1.1s ease-in-out;
		}
	
		
.calltoaction {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#444;
	font-family:arial;
	font-size:14px !important;
	font-weight:bold !important;
	padding:3px 34px;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
}.calltoaction:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
}.calltoaction:active {
	position:relative;
	top:1px;
	margin-top:-20px !important;
}


.cyanbtn {
	-moz-box-shadow:inset 0px 1px 0px 0px #cae3fc;
	-webkit-box-shadow:inset 0px 1px 0px 0px #cae3fc;
	box-shadow:inset 0px 1px 0px 0px #cae3fc;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1fb8e2), color-stop(1, #1dadd4) );
	background:-moz-linear-gradient( center top, #1fb8e2 5%, #1dadd4 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1fb8e2', endColorstr='#1dadd4');
	background-color:#1fb8e2;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #469df5;
	display:inline-block;
	font-size:15px !important;
	font-weight: bold !important;
	color:#ffffff;
	font-family:arial;
	
	padding:3px 34px;
	text-decoration:none;
	text-shadow:1px 1px 0px #287ace;
}.cyanbtn:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1dadd4), color-stop(1, #1fb8e2) );
	background:-moz-linear-gradient( center top, #1dadd4 5%, #1fb8e2 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1dadd4', endColorstr='#1fb8e2');
	background-color:#1dadd4;
}.cyanbtn:active {
	position:relative;
	top:1px;
}


.orngbtn {
	-moz-box-shadow:inset 0px 1px 0px 0px #f7c5c0;
	-webkit-box-shadow:inset 0px 1px 0px 0px #f7c5c0;
	box-shadow:inset 0px 1px 0px 0px #f7c5c0;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fc8d83), color-stop(1, #e4685d) );
	background:-moz-linear-gradient( center top, #fc8d83 5%, #e4685d 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fc8d83', endColorstr='#e4685d');
	background-color:#fc8d83;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #d83526;
	display:inline-block;
	font-size:15px !important;
	font-weight: bold !important;
	color:#ffffff;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:3px 34px;
	text-decoration:none;
	text-shadow:1px 1px 0px #b23e35;
}.orngbtn:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #e4685d), color-stop(1, #fc8d83) );
	background:-moz-linear-gradient( center top, #e4685d 5%, #fc8d83 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4685d', endColorstr='#fc8d83');
	background-color:#e4685d;
}.orngbtn:active {
	position:relative;
	top:1px;
}


.graybtn {
	-moz-box-shadow:inset 0px 1px 0px 0px #b3b3b3;
	-webkit-box-shadow:inset 0px 1px 0px 0px #b3b3b3;
	box-shadow:inset 0px 1px 0px 0px #b3b3b3;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #575757), color-stop(1, #424142) );
	background:-moz-linear-gradient( center top, #575757 5%, #424142 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#424142');
	background-color:#575757;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #212121;
	display:inline-block;
	color:#f7f4f7;
	font-family:arial;
		font-size:15px !important;
	font-weight: bold !important;
	padding:3px 34px;
	text-decoration:none;
	text-shadow:1px 1px 0px #4d4d4d;
}.graybtn:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #424142), color-stop(1, #575757) );
	background:-moz-linear-gradient( center top, #424142 5%, #575757 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#424142', endColorstr='#575757');
	background-color:#424142;
}.graybtn:active {
	position:relative;
	top:1px;
}