/*
Theme created for use with Sequence.js (http://www.sequencejs.com/)

Theme: Apple Style
Version: 1.3
Theme Author: Ian Lunn @IanLunn
Author URL: http://www.ianlunn.co.uk/
Theme URL: http://www.sequencejs.com/themes/apple-style/

This is a FREE theme and is available under a MIT License:
http://www.opensource.org/licenses/mit-license.php

Sequence.js and its dependencies are (c) Ian Lunn Design 2012 - 2013 unless otherwise stated.
*/
/* CSS RESET - http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* !CSS RESET */
/* prefix declarations */
/* Keyframes */
@-webkit-keyframes paused {
  /* animate the pause button when Sequence is paused */
  0% {
    background-position: 0 0;
    opacity: 0;
  }

  100% {
    background-position: 0 0;
    opacity: .7;
  }
}

@-moz-keyframes paused {
  /* animate the pause button when Sequence is paused */
  0% {
    background-position: 0 0;
    opacity: 0;
  }

  100% {
    background-position: 0 0;
    opacity: .7;
  }
}

@-ms-keyframes paused {
  /* animate the pause button when Sequence is paused */
  0% {
    background-position: 0 0;
    opacity: 0;
  }

  100% {
    background-position: 0 0;
    opacity: .7;
  }
}

@-o-keyframes paused {
  /* animate the pause button when Sequence is paused */
  0% {
    background-position: 0 0;
    opacity: 0;
  }

  100% {
    background-position: 0 0;
    opacity: .7;
  }
}

@keyframes paused {
  /* animate the pause button when Sequence is paused */
  0% {
    background-position: 0 0;
    opacity: 0;
  }

  100% {
    background-position: 0 0;
    opacity: .7;
  }
}

@-webkit-keyframes status-bar {
  /* cause the status bar to move */
  0% {
    background-position: -119px 0;
  }

  100% {
    background-position: 0 0;
  }
}

@-moz-keyframes status-bar {
  /* cause the status bar to move */
  0% {
    background-position: -119px 0;
  }

  100% {
    background-position: 0 0;
  }
}

@-ms-keyframes status-bar {
  /* cause the status bar to move */
  0% {
    background-position: -119px 0;
  }

  100% {
    background-position: 0 0;
  }
}

@-o-keyframes status-bar {
  /* cause the status bar to move */
  0% {
    background-position: -119px 0;
  }

  100% {
    background-position: 0 0;
  }
}

@keyframes status-bar {
  /* cause the status bar to move */
  0% {
    background-position: -119px 0;
  }

  100% {
    background-position: 0 0;
  }
}

@-webkit-keyframes preload {
  /* preloader icons */
  0% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@-moz-keyframes preload {
  /* preloader icons */
  0% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@-ms-keyframes preload {
  /* preloader icons */
  0% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@-o-keyframes preload {
  /* preloader icons */
  0% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes preload {
  /* preloader icons */
  0% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

/* !Keyframes */
#sequence-theme {
  width: 100%;
  height: 699px;
  overflow: hidden;
  margin: 0 auto
}

/* when in fallback mode (for browsers that don't support transitions) hide anything outside of the Sequence container */
#sequence.sequence-fallback {
  overflow: hidden;
}

#sequence {
  position: relative;
  height: 699px;width: 100%;

  margin: 0 auto;
  background: white;
  /* Preloader */
  /* !Preloader */
  /* Frame Animations */
  /* !Frame Animations */
}
#sequence > .sequence-canvas {
  height: 100%;
  width: 100%;
  margin: 0;
}
#sequence > .sequence-canvas > li {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
#sequence > .sequence-canvas li > * {
  position: absolute;
}
#sequence h2 {
  font-family: "Open Sans";
  font-size: 72px;
  color: #fff;
  text-align: center;
  margin: 0 0 10px 0;
  border-top: 1px solid #fff;
  padding: 14px 0 19px;
  border-bottom: 1px solid #fff;
  line-height: 74px;
  font-weight: 700;
}
#sequence h3 {
  font-family: "Magra", sans-serif;
  font-size: 20px;
}
#sequence .controls {
  background: url("/images/bg-controls.png") no-repeat;
  height: 49px;
  margin: 0 auto;
  position: relative;
  top: 0;
  width: 198px;
  z-index: 9999;
}
#sequence .sequence-prev,
#sequence .sequence-next {
  opacity: 0.7;
}
#sequence .sequence-next,
#sequence .sequence-prev,
#sequence .sequence-pause {
	position: absolute;
	opacity: 0.6;
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-ms-transition-duration: 1s;
	-o-transition-duration: 1s;
	transition-duration: 1s;
	font-weight: bold;
	padding: 10px 15px;
	position: absolute;
	top: 50%;
	z-index: 1000;
	height: 75px;
	margin-top: -47.5px;
	background:black;
}
#sequence .sequence-next {
	background: url("/images/bt-next.png") 50% 4px no-repeat;
	cursor: pointer;
	font-weight: bold;
	padding: 10px 15px;
	position: absolute;
	display: none;
	top: 50%;
	z-index: 1000;
	height: 75px;
	margin-top: -47.5px;
	background:black;
	right:0%;
}
#sequence .sequence-next:hover,
#sequence .sequence-prev:hover,
#sequence .sequence-pause:hover {
  background-position: 50% -26px;
}
#sequence .sequence-prev {
	background: url("/images/bt-prev.png") 50% 4px no-repeat;
	cursor: pointer;
	display: none;
	font-weight: bold;
	padding: 10px 15px;
	positon: absolute;
	top: 50%;
	z-index: 1000;
	height: 75px;
	margin-top: -47.5px;
	background:black;
}
#sequence .sequence-pause {
  background: url("/images/bt-pause.png") 50% 4px no-repeat;
  cursor: pointer;
  height: 33px;
  left: 78px;
  width: 42px;
}
#sequence .sequence-pause.paused {
  background: url("/images/bt-play.png") 50% 4px no-repeat;
  height: 33px;
  left: 78px;
  width: 42px;
}
#sequence .sequence-pause.paused:hover {
  background-position: 50% -25px;
}
#sequence .status {
  background: url("/images/status-bar.png") -119px 0 repeat-y;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  height: 6px;
  margin: 0 auto;
  position: relative;
  top: 4px;
  width: 118px;
}
#sequence .status.paused {
  -webkit-animation: paused 1s linear alternate infinite;
  -moz-animation: paused 1s linear alternate infinite;
  -ms-animation: paused 1s linear alternate infinite;
  -o-animation: paused 1s linear alternate infinite;
  animation: paused 1s linear alternate infinite;
}
#sequence .status.active {
  -webkit-animation: status-bar 4s linear;
  -moz-animation: status-bar 4s linear;
  -ms-animation: status-bar 4s linear;
  -o-animation: status-bar 4s linear;
  animation: status-bar 4s linear;
}
#sequence .pause-icon {
  right: 20px;
  position: absolute;
  bottom: 20px;
}
#sequence .sequence-preloader {
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 999999;
}
#sequence .sequence-preloader img {
  background: #ff9933;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  border-radius: 6px;
  display: inline-block;
  height: 12px;
  opacity: 0;
  position: relative;
  top: -50%;
  width: 12px;
  -webkit-animation: preload 1s infinite;
  -moz-animation: preload 1s infinite;
  -ms-animation: preload 1s infinite;
  -o-animation: preload 1s infinite;
  animation: preload 1s infinite;
}
#sequence .sequence-preloader .preloading {
  height: 12px;
  margin: 0 auto;
  top: 50%;
  position: relative;
  width: 48px;
}
#sequence .sequence-preloader img:nth-child(2) {
  -webkit-animation-delay: 0.15s;
  -moz-animation-delay: 0.15s;
  -ms-animation-delay: 0.15s;
  -o-animation-delay: 0.15s;
  animation-delay: 0.15s;
}
#sequence .sequence-preloader img:nth-child(3) {
  -webkit-animation-delay: 0.3s;
  -moz-animation-delay: 0.3s;
  -ms-animation-delay: 0.3s;
  -o-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
#sequence .sequence-preloader .preloading-complete {
  opacity: 0;
  visibility: hidden;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}

/*BACKGROUND*/
#sequence .slide3 {
  position: absolute;
  left: -800px;
  opacity: 0;
  top: 220px;
  height:100%;
}
::i-block-chrome,#sequence .slide3{}
#sequence .animate-in .slide3 {
  left: 30%;
  top: 10%;
  opacity: 1;
  width: 500px;
  -webkit-transition-delay: 1s;
  -moz-transition-delay: 1s;
  -ms-transition-delay: 1s;
  -o-transition-delay: 1s;
  transition-delay: 1s;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}
::i-block-chrome,#sequence .animate-in .slide3{top:220px;-webkit-transform: translateZ(0);  -webkit-transition-delay: 4s;-webkit-transition-timing-function: ease-out;}
#sequence .animate-out .slide3 {
  left: 60%;
  opacity: 0;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}


/*Slide 1*/
#sequence .slide-item1 .item1 {
  left: 15%;
  position: absolute;
  top: -100%;
  width: 70%;
/*  -webkit-transform: rotate(20deg);
  -moz-transform: rotate(20deg);
  -ms-transform: rotate(20deg);
  -o-transform: rotate(20deg);
  transform: rotate(20deg);*/
}
::i-block-chrome,#sequence .slide-item1 .item1
{top:-200px;}

#sequence .slide-item1.animate-in .item1 {
  top: 156px;

  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}
::i-block-chrome,#sequence .slide-item1.animate-in .item1
{top:700px;  -webkit-transition-duration: 2s;-webkit-transition-timing-function: ease-out;-webkit-transform: translateZ(0);}
#sequence .slide-item1.animate-out .item1 {
  opacity: 0;
  top: -100%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}
::i-block-chrome,#sequence .slide-item1.animate-out .item1
{top:-200px;  -webkit-transition-duration: 2s;-webkit-transition-timing-function: ease-out;-webkit-transform: translateZ(0);}
#sequence .slide-item1 .item3 {
  left: 25%;
  width:50%;
  position: absolute;
  bottom: -400px;
  z-index: 3;
  margin:0;
}
#sequence .slide-item1.animate-in .item3 {
  bottom: 0;
  -webkit-transition-duration: 1.5s;
  -moz-transition-duration: 1.5s;
  -ms-transition-duration: 1.5s;
  -o-transition-duration: 1.5s;
  transition-duration: 1.5s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -ms-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}
#sequence .slide-item1.animate-out .item3 {
  bottom: -400px;
  -webkit-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  transform: rotate(10deg);
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}


/*Slide 2*/
#sequence .slide-item2 .item1 {
  right:-100%;
  position:absolute;
  top:156px;
  width:70%;
  opacity:0;
}
#sequence .slide-item2.animate-in .item1 {
  right:15%;
  opacity:1;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}
#sequence .slide-item2.animate-out .item1 {
  opacity:0;
  right:-100%;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}

#sequence .slide-item2 .item3 {
  right:-100%;
  width:50%;
  position:absolute;
  bottom:0;
  z-index:3;
  margin:0;
  opacity:0;
}
#sequence .slide-item2.animate-in .item3{
  opacity:1;
  right:25%;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -ms-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}
#sequence .slide-item2.animate-out .item3 {
  opacity:0;
  right:-100%;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}


/*Slide 3*/
#sequence .slide-item3 .item1 {
  left: 15%;
  position: absolute;
  top: 156px;
  width: 70%;
  opacity: 0;
}
#sequence .slide-item3.animate-in .item1 {
  opacity: 1;
  -webkit-transition-duration: 4s;
  -moz-transition-duration: 4s;
  -ms-transition-duration: 4s;
  -o-transition-duration: 4s;
  transition-duration: 4s;
}
#sequence .slide-item3.animate-out .item1 {
  opacity: 0;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}

#sequence .slide-item3 .item3 {
  left: 25%;
  width:50%;
  position: absolute;
  z-index: 3;
  bottom:0;
  margin:0;
  opacity:0;
}
#sequence .slide-item3.animate-in .item3 {
  opacity:1;
  -webkit-transition-duration: 3s;
  -moz-transition-duration: 3s;
  -ms-transition-duration: 3s;
  -o-transition-duration: 3s;
  transition-duration: 3s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -ms-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}
#sequence .slide-item3.animate-out .item3 {
  opacity:0;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -ms-transition-duration: 1s;
  -o-transition-duration: 1s;
  transition-duration: 1s;
}

@media (min-width: 1300px) {
	
	#sequence .slide-item1 .item3{left:30%;width:40%;}
	#sequence .slide-item2 .item3{right:30%;width:40%;}
	#sequence .slide-item3 .item3{left:30%;width:40%;}
	
}

@media (min-width: 1000px) {
	
	#sequence .slide-item1 .item1{left:50%;margin-left:-356px;width:712px;overflow:visible;}
	#sequence .slide-item2 .item1{right:-100%;width:712px;overflow:visible;}
	#sequence .slide-item3 .item1{left:50%;margin-left:-356px;width:712px;overflow:visible;}
	
	#sequence .slide-item1.animate-in .item1{top:156px;}
	#sequence .slide-item2.animate-in .item1{top:156px;}
	#sequence .slide-item3.animate-in .item1{top:156px;}
	
	#sequence .slide-item2.animate-in .item1{right:50%;margin-right:-356px;}
	
	#sequence .slide-item1-1 .item1 h2{
	  white-space:nowrap;
	  text-align:center;
	  text-indent:-30px;
	}
	
	#sequence .slide-item1 .item3 {left:50%;margin:0 0 0 -315px;width:630px;}
	#sequence .slide-item2 .item3 {right:-100%;width:630px;}
	#sequence .slide-item3 .item3 {left:50%;margin:0 0 0 -315px;width:630px;}
	
	#sequence .slide-item2.animate-in .item3{right:50%;margin:0 -315px 0 0;}
	
}

@media (max-width: 1000px) {
	
	#sequence h2 {
	  font-size: 45px;
	  line-height: 47px;
	}
	
	#sequence .slide-item1 .item1{left:15%;width:70%;}
	#sequence .slide-item2 .item1{right:-100%;width:70%;}
	#sequence .slide-item3 .item1{left:15%;width:70%;}
	
	#sequence .slide-item2.animate-in .item1{right:15%;}
	
	#sequence .slide-item1 .item3{left:14%;width:72%;}
	#sequence .slide-item2 .item3{right:-100%;width:72%;}
	#sequence .slide-item3 .item3{left:14%;width:72%;}

	#sequence .slide-item2.animate-in .item3{right:14%;}
	
}


@media (max-width: 700px) {
	
	#sequence .slide-item1 .item1{left:10%;width:80%;}
	#sequence .slide-item2 .item1{width:80%;}
	#sequence .slide-item3 .item1{left:10%;width:80%;}
	
	#sequence .slide-item1.animate-in .item1{top:120px;}
	#sequence .slide-item2.animate-in .item1{top:120px;right:10%;}
	#sequence .slide-item3.animate-in .item1{top:120px;}
		
	#sequence .slide-item1 .item3{left:0;width:100%;}
	#sequence .slide-item2 .item3{width:100%;}
	#sequence .slide-item3 .item3{left:0;width:100%;}
	
	#sequence .slide-item2.animate-in .item3{right:0%;}
	
	#sequence .sequence-next {
	  height:50px;	
	}
	#sequence .sequence-prev {
	  height:50px;	
	}

}

@media (max-width: 500px) {
	
	#sequence {
	  height: 600px;
	}
	
	#sequence-theme {
	  height: 600px;
	}

}

@media (max-width: 430px) {

	#sequence {
	  height: 526px;
	}
	
	#sequence-theme {
	  height: 526px;
	}
	
	#sequence .slide-item1.animate-in .item1{top:100px;}
	#sequence .slide-item2.animate-in .item1{top:100px;}
	#sequence .slide-item3.animate-in .item1{top:100px;}
	
	#sequence .slide-item1.animate-in .item3{bottom:0px;}
	#sequence .slide-item2.animate-in .item3{bottom:0px;}
	#sequence .slide-item3.animate-in .item3{bottom:0px;}
	
	#sequence h2 {
	  font-size: 30px;
	  line-height: 32px;
	}
	
	#sequence .sequence-next {
	  height:30px;	
	}
	#sequence .sequence-prev {
	  height:30px;	
	}

}

@media (max-width: 380px) {

	#sequence {
	  height: 386px;
	}
	
	#sequence-theme {
	  height: 386px;
	}
	
	#sequence .slide-item1.animate-in .item3{bottom:0px;}
	#sequence .slide-item2.animate-in .item3{bottom:0px;}
	#sequence .slide-item3.animate-in .item3{bottom:0px;}
	
	#sequence h2 {
	  font-size: 20px;
	  line-height: 23px;
	}
	
	#sequence .sequence-next {
	  height:24px;	
	}
	#sequence .sequence-prev {
	  height:24px;	
	}

}
