body{
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
  font-weight: 300;
}

/* SLIDESHOW */

.slideshow_box {
	width:600px;
	height:400px;
	background:#ECEEEE;
	margin-left:auto;
	margin-right:auto;
	padding:10px;
}
.slideshow_box:hover {
	background:#bbddff;
}

#slideshow {
	width:600px;
	height:400px;
	overflow:hidden;
}

#slideshow .slide {
	width:600px;
	height:400px;
	overflow:hidden;
}

#slideshow .tooltip {
	background:rgba(0,0,0,0.7);
	text-align:center;
	width:300px;
	height:60px;
	position:relative;
	bottom:100px;
	left:-320px;
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
}

#slideshow .tooltip h1 {
	color:#fff;
	font-size:24px;
	font-weight:300;
	line-height:60px;
	padding:0 0 0 20px;
}

#slideshow:hover .tooltip {
	left:0px;
}

#xfade {
  position:relative;
  width:600px;
  height:400px;
  margin:0 auto;
}

#xfade div.slide {
  position:absolute;
  left:0;
  height:100%;
  margin-left:auto;
  margin-right:auto;
}

#xfade div.slide img {
  height:100%;
}

#xfade:hover div.slide {
	-moz-animation-play-state:paused;
	-webkit-animation-play-state:paused;
}

@-webkit-keyframes xfadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-moz-keyframes xfadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-o-keyframes xfadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@keyframes xfadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

#xfade div.slide {
  -webkit-animation-name: xfadeInOut;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 16s;

  -moz-animation-name: xfadeInOut;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count: infinite;
  -moz-animation-duration: 16s;

  -o-animation-name: xfadeInOut;
  -o-animation-timing-function: ease-in-out;
  -o-animation-iteration-count: infinite;
  -o-animation-duration: 16s;

  animation-name: xfadeInOut;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-duration: 16s;
}
#xfade div.slide:nth-of-type(1) {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}
#xfade div.slide:nth-of-type(2) {
  -webkit-animation-delay: 8s;
  -moz-animation-delay: 8s;
  -o-animation-delay: 8s;
  animation-delay: 8s;
}
#xfade div.slide:nth-of-type(3) {
  -webkit-animation-delay: 4s;
  -moz-animation-delay: 4s;
  -o-animation-delay: 4s;
  animation-delay: 4s;
}
#xfade div.slide:nth-of-type(4) {
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -o-animation-delay: 0;
  animation-delay: 0;
}