
@-webkit-keyframes right {
  from {
    -webkit-transform: translateX(calc((-10vw + -10vh + -10%)/6)) scale(1.05)  ;
    transform: translateX(calc((-10vw + -10vh + -10%)/6)) scale(1.05)  ;
    -ms-transform: translateX(-10%);
  }
  to {
    -webkit-transform: translateX(calc((10vw + 10vh + 10%)/6)) scale(1.0)  ;
    transform: translateX(calc((10vw + 10vh + 10%)/6)) scale(1.0)  ;
    -ms-transform: translateX(10%);
  }
}

@keyframes right {
  from {
    -webkit-transform: translateX(calc((-10vw + -10vh + -10%)/6)) scale(1.05)  ;
    transform: translateX(calc((-10vw + -10vh + -10%)/6)) scale(1.05)  ;
    -ms-transform: translateX(-10%);
  }
  to {
    -webkit-transform: translateX(calc((10vw + 10vh + 10%)/6)) scale(1.0)  ;
    transform: translateX(calc((10vw + 10vh + 10%)/6)) scale(1.0)  ;
    -ms-transform: translateX(10%);
  }
}

@-webkit-keyframes left {
  from {
    -webkit-transform: translateX(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    transform: translateX(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    -ms-transform: translateX(4%);
  }
  to {
    -webkit-transform: translateX(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    transform: translateX(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    -ms-transform: translateX(-4%);
  }
}

@keyframes left {
  from {
    -webkit-transform: translateX(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    transform: translateX(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    -ms-transform: translateX(4%);
  }
  to {
    -webkit-transform: translateX(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    transform: translateX(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    -ms-transform: translateX(-4%);
  }
}

@-webkit-keyframes down {
  from {
    -webkit-transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(-4%);
  }
  to {
    -webkit-transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(4%);
  }
}

@keyframes down {
  from {
    -webkit-transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(-4%);
  }
  to {
    -webkit-transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(4%);
  }
}

@-webkit-keyframes up {
  from {
    -webkit-transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(4%);
  }
  to {
    -webkit-transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(-4%);
  }
}

@keyframes up {
  from {
    -webkit-transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    transform: translateY(calc((4vw + 4vh + 4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(4%);
  }
  to {
    -webkit-transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    transform: translateY(calc((-4vw + -4vh + -4%)/3)) rotate(0.01deg);
    -ms-transform: translateY(-4%);
  }
}

@-webkit-keyframes out {
  from {
    -webkit-transform: scale(1.4) ;
    transform: scale(1.4);
  }
  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes out {
  from {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes in {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  to {
    -webkit-transform: scale(1.40);
    transform: scale(1.40);
  }
}

@keyframes in {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  to {
    -webkit-transform: scale(1.40);
    transform: scale(1.40);
  }
}
.bannerimg{
	background-position:center;
	
}
#slides {
  position: static;
  width: 1px;
  height:1px;
  
  left: -9999px;
  display: none;
  background-position:center;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

#slideshow {
	position:absolute;
  overflow:hidden;
  display:block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  
}
#slideshow div {clear:both;}	

#slideshow .slide, #slideshow span, #slideshow .static-content {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-height:600px; 
  overflow:hidden;
	padding-top:100px;

}


#slideshow .slide span {
  background-size: 100%;
  background-position: center;
  
}

#slideshow .slide span.animate.right, #slideshow .slide span.animate.left {
  left: calc((-4vw + -4vh + -4%)/3);
  right: calc((-4vw + -4vh + -4%)/3);
}

#slideshow .slide span.animate.up, #slideshow .slide span.animate.down {
  top: calc((-4vw + -4vh + -4%)/3);
  bottom: calc((-4vw + -4vh + -4%)/3);
}

#slideshow span.animate {
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}

#slideshow span.animate.right {
  -webkit-animation-name: right;
  animation-name: right;
}

#slideshow span.animate.left {
  -webkit-animation-name: left;
  animation-name: left;
}

#slideshow span.animate.up {
  -webkit-animation-name: up;
  animation-name: up;
}

#slideshow span.animate.down {
  -webkit-animation-name: down;
  animation-name: down;
}

#slideshow span.animate.in {
  -webkit-animation-name: in;
  animation-name: in;
}

#slideshow span.animate.out {
  -webkit-animation-name: out;
  animation-name: out;
}

#slideshow span.animate.paused {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}

.bannerheight{
	height:640px;
	top:80px;
	margin-bottom:120px;}
	
	 .static-content {
        padding: 20px;
      }
	   h1 {
        font-family: 'Roboto', sans-serif;
		font-size:32px;
        margin: 0;
        position: absolute;
        bottom: 20px;
        color: white;
        text-shadow: 0 2px 4px rgba(0,0,0,.8);
      }	
	
@media screen and (max-width:1440px) {

.bannerheight{
	height:600px;
	top:80px;
	margin-bottom:120px;}

#slideshow .slide, #slideshow span, #slideshow .static-content {
  max-height:600px; 
  overflow:hidden;
	padding-top:150px;
}
}

@media screen and (max-width:1279px) {
.bannerheight{
	height:500px;
	top:50px;
	margin-bottom:100px;
}

#slideshow .slide, #slideshow span, #slideshow .static-content {
  max-height:500px; 
  overflow:hidden;
	padding-top:150px;
}
}
@media screen and (max-width:1023px) {
.bannerheight{
	height:400px;
	top:100px;
	margin-bottom:140px;
}
#slideshow .slide, #slideshow span, #slideshow .static-content {
  max-height:400px; 
  overflow:hidden;
	padding-top:150px;
}
h1 {
		font-size:20px;
      }
}

@media screen and (max-width:767px) {
.bannerheight{
	height:300px;
	top:55px;
	margin-bottom:70px;
}
#slideshow .slide, #slideshow span, #slideshow .static-content {
  max-height:300px; 
  overflow:hidden;
	padding-top:100px;
}
}
@media screen and (max-width:639px) {
.bannerheight{
	height:250px;
	top:45px;
	margin-bottom:50px;
}
#slideshow .slide, #slideshow span, #slideshow .static-content {
  max-height:250px; 
  overflow:hidden;
	padding-top:80px;
}
}

@media screen and (max-width:479px) {
.bannerheight{
	height:200px;
	top:45px;
	margin-bottom:50px;
}
#slideshow .slide, #slideshow span, #slideshow .static-content {
  max-height:200px; 
  overflow:hidden;
	padding-top:50px;
}
}