  

.seq .seq-preloader {
  background: #D9D9D9;
}

.seq .seq-screen,
.seq .seq-canvas,
.seq .seq-canvas > * { 
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  list-style: none;
}

.seq .seq-canvas > * {
  position: absolute;
}
 

.seq.seq-fallback .seq-canvas {
  max-width: 1280px;
}

 
 

.seq.seq-fallback .seq-next:focus,
.seq.seq-fallback .seq-next:hover,
.seq.seq-fallback .seq-prev:focus,
.seq.seq-fallback .seq-prev:hover{
  top: -4px;
}

.seq .seq-canvas { 
  overflow: hidden;
  position: relative;
  display: block;
  margin: 0 auto;
}

.seq .seq-nav{ 
  display: none;
}

.seq.seq-active .seq-nav { 
  display: block;
}

.seq .seq-nav { 
  position: absolute;
  z-index: 99;
  top: 50%;
  width: 100%; 
  margin: 0 auto;
  padding: 0;
  pointer-events: none;
  border: none;
}

.seq .seq-next,
.seq .seq-prev {
  position: absolute;
  top: 50%;
  margin-top: -33px;
  width: 35px;
  height: 66px;
  border: none;
  cursor: pointer;
  pointer-events: auto;
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); 
  border: 0;
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
}

.seq .seq-next {
  right: 20px;
  background: url(../images/arrow_right.png);
}

.seq .seq-next:focus,
.seq .seq-next:hover {
  -webkit-transform: translate3d(4px, 0, 0);
  -ms-transform: translate3d(4px, 0, 0);
  transform: translate3d(4px, 0, 0);
}

.seq .seq-prev {
  left: 20px;
  background: url(../images/arrow_left.png);
}

.seq .seq-prev:focus,
.seq .seq-prev:hover {
  -webkit-transform: translate3d(-4px, 0, 0);
  -ms-transform: translate3d(-4px, 0, 0);
  transform: translate3d(-4px, 0, 0);
}

.seq .seq-model,
.seq .seq-title {
  position: absolute;
}

.seq .seq-title {
  bottom: 5%;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 40%;
  flex: 0 0 40%;
  max-width: 40%;
  display: table !important;
  height: 100%;
  text-align: right;
  z-index: 1;
}

.seq .seq-model {
  bottom: 15%;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  max-width: 60%;
  display: table !important;
  height: 100%;
  text-align: left;
  margin-left: -40px;
}

.seq .seq-model img {
	display: block;
	opacity: 0;
	-webkit-transform: translate3d(60px, 0, 0);
	-ms-transform: translate3d(60px, 0, 0);
	transform: translate3d(60px, 0, 0);
	-webkit-transition-duration: .3s;
	transition-duration: .3s;
	-webkit-transition-properties: transform, opacity;
	transition-properties: transform, opacity;
	-webkit-transition-timing-function: ease-out !important;
	transition-timing-function: ease-out !important;
	margin: 0 auto;
}

.seq .seq-title br {
  display: none;
}

.seq .seq-title h2 {
  display: block;
  vertical-align: middle;
  text-align: center;
  margin: 0;
  opacity: 0;
  -webkit-transition-duration: .3s;
  transition-duration: .3s;
  -webkit-transition-properties: opacity;
  transition-properties: opacity;
  font-family: 'TwCenMT-Bold';
  letter-spacing: 8px;
}

.seq .seq-title h2 {
    margin-right: -20px;
    margin-top: -100px;
}

 

 

.seq .seq-in .seq-model img {
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.seq .seq-in .seq-title h2 {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

 
.seq .seq-out .seq-model img {
  -webkit-transform: translate3d(-60px, 0, 0);
  -ms-transform: translate3d(-60px, 0, 0);
  transform: translate3d(-60px, 0, 0);
  opacity: 0;
}

.seq .seq-out .seq-title h2 {
  opacity: 0;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
ul.seq-canvas li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.seq .seq-screen {
    padding-top: 180px;
}


@media only screen and (min-width: 640px) {
  .seq { 
    position: relative;
    min-height: 360px; 
    background-color: #fff;
  } 
  .seq .seq-screen {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 1400px;
    margin: 0 auto;
  }

  .seq .seq-canvas > *:before { 
    content: "";
    height: 100%;
    display: inline-block;
    vertical-align: middle;
  }

  .seq .seq-model,
  .seq .seq-title {
    position: relative;
    display: inline-block;
    vertical-align: middle;
  }

  .seq .seq-model {
    top: 0;
    bottom: 0;
  }

  .seq .seq-model img { 
    opacity: 0;
    -webkit-transform: translate3d(60px, 0, 0);
    -ms-transform: translate3d(60px, 0, 0);
    transform: translate3d(60px, 0, 0);
    -webkit-transition-properties: transform, opacity;
    transition-properties: transform, opacity;
  }

  .seq .seq-title {
    bottom: 0;
    margin-right: 12.5%;
  }

  .seq .seq-title h2 {
    display: inline-block;
    opacity: 0;
    text-align: left;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-properties: transform, opacity;
    transition-properties: transform, opacity;
  }

  .seq .seq-title h2 {
    -webkit-transform: translate3d(-120px, 0, 0);
    -ms-transform: translate3d(-120px, 0, 0);
    transform: translate3d(-120px, 0, 0);
  }

 
  .seq .seq-in .seq-model img {
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
 
  .seq .seq-out .seq-model img {
    -webkit-transform: translate3d(-60px, 0, 0);
    -ms-transform: translate3d(-60px, 0, 0);
    transform: translate3d(-60px, 0, 0);
  }
}

 

@media only screen and (min-width: 860px) {
  .seq .seq-model {
  }

  .seq .seq-title {
    margin-right: 10%;
  }

  .seq .seq-title br {
    display: inline-block;
  }
}

@media only screen and (min-width: 1020px) {
  .seq .seq-model {
  }

  .seq .seq-title {
    margin-right: 5%;
  }
}

@media only screen and (min-width: 1120px) {
  .seq .seq-model {
  }

  .seq .seq-title {
    margin-right: 0;
  }
}
 

 