/* ------------------------- Slide Images ---------------------------- */

.slidebar {
	position: static;
	top: 0px;
	width: 100%; /*  */
	background: none;
	margin: 0px;
	min-height: 400px; /* real browsers */
	height: auto !important; /* real browsers */
	height: 100%; /* IE6 bug */
}
/** SLIDESHOW **/
.slideshow,
.slideshow:after { 
    top: 60px; /*60px height for menubar*/
    position: absolute;
    width: 100%;
    height: 400px;
    left: 0px;
    z-index: 0; 
}
.slideVideo {
	z-index: -1;
	width: 100vw;
	min-height: 400px; /* real browsers */
	height: auto !important; /* real browsers */
	height: 100%; /* IE6 bug */
   object-fit: cover;
}
@media screen and (min-width: 48em) { /* tablet and web */
	.slidebar, .slideshow,.slideshow:after {
		min-height: 700px; /* real browsers */
		height: auto !important; /* real browsers */
		height: 100%; /* IE6 bug */
	}
	.slideVideo {
		height: 700px !important; /* real browsers */
	}
}
.slideshow li span { 
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    opacity: 0;
    z-index: 0;
    animation: imageAnimation 42s linear infinite 0s; 
}
.slideshow li:nth-child(1) span { 
    background-image: url("../images/slide/1.jpg"); 
}
.slideshow li:nth-child(2) span { 
    background-image: url("../images/slide/2.jpg");
    animation-delay: 6s; 
}
.slideshow li:nth-child(3) span { 
    background-image: url("../images/slide/3.jpg"); 
    animation-delay: 12s; 
}
.slideshow li:nth-child(4) span { 
    background-image: url("../images/slide/4.jpg");   
    animation-delay: 18s; 
}
.slideshow li:nth-child(5) span { 
    background-image: url("../images/slide/5.jpg");
    animation-delay: 24s; 
}
.slideshow li:nth-child(6) span { 
    background-image: url("../images/slide/6.jpg");
    animation-delay: 30s; 
}
.slideshow li:nth-child(7) span { 
    background-image: url("../images/slide/7.jpg");
    animation-delay: 36s; 
}
@keyframes imageAnimation { 
    0% { opacity: 0; animation-timing-function: ease-in; }
    8% { opacity: 1; animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@keyframes titleAnimation { 
    0% { opacity: 0 }
    8% { opacity: 1 }
    17% { opacity: 1 }
    19% { opacity: 0 }
    100% { opacity: 0 }
}
.no-cssanimations .cb-slideshow li span {
    opacity: 1;
}
/* ------------------------- End Slide Images ---------------------------- */
/*----------------------- Text Slide ----------------------- */
.textSlide { /*mobile*/
	display: flex;
	flex-wrap: wrap;
	align-items: center; 
	justify-content: center;
  	background-color: #ffffff;
  	color: #163450;
	min-height: 280px; /* real browsers */
  	height: auto !important; /* real browsers */
	font-weight: 500;
    font-size: 140%;
    overflow-x: hidden !important; 
}
@media screen and (min-width: 48em) { /* tablet and web */
	.textSlide {
		min-height: 200px;	
	}
}
.item-1, 
.item-2, 
.item-3 {
	position: absolute;
	left: 0;
    transform: translate(-10%, 0);
  	display: block;
	width: 60%;  
  	animation-duration: 40s;
  	animation-timing-function: ease-in-out;
  	animation-iteration-count: infinite;
}
@media screen and (max-width: 48em) { /* mobile and tablet */
	.item-1, 
	.item-2, 
	.item-3 {
		width: 80%;  /*real browsers */
		transform: translate(-20%, 0);
	}
}
.item-1{
  animation-name: anim-1;
}
.item-2{
  animation-name: anim-2;
}
.item-3{
  animation-name: anim-3;
}
@keyframes anim-1 {
    0%, 8.3% { left: -100%; opacity: 0; }
    8.3%,25% { left: 25%; opacity: 1; }
    33.33%, 100% { left: 30%; opacity: 0; }
}
@keyframes anim-2 {
    0%, 33.33% { left: -100%; opacity: 0; }
    41.63%, 58.29% { left: 25%; opacity: 1; }
    66.66%, 100% { left: 30%; opacity: 0; }
}
@keyframes anim-3 {
    0%, 66.66% { left: -100%; opacity: 0; }
    74.96%, 91.62% { left: 25%; opacity: 1; }
    100% { left: 40%; opacity: 0; }
}
/* ------------------------- End Slide Text ---------------------------- */