.imgsize {max-height:460px;}

.css-slideshow{
position:relative;
max-height:440px;
}
.css-slideshow figure{
position:absolute;
border:0;
}
.css-slideshow img{
margin:10px 0px 0px 20px;
}
.css-slideshow figcaption{
margin-left:20px;
position:absolute;
padding:10px 10px 10px 34px;
color:white;
width:658px;
transition:0.7s ease-out;
opacity:0.9;
font-size:21px;
z-index:-1;
bottom:-24%; /* hides the hover bar */
-webkit-text-fill-color:transparent;
}

.css-slideshow:hover figure figcaption
{
bottom:-44%;
z-index:1;
background:#000000;
-moz-transform: translateY(-200px);
-webkit-transform: translateY(-200px);
-webkit-text-fill-color:#ffffff;
}

.css-slideshow-attr{
max-width:495px;
text-align:right;
font-size:.7em;
font-style:italic;
margin:0 auto;
}
.css-slideshow-attr a{
color:#666;
}
.css-slideshow figure{
opacity:0;
}
figure:nth-child(1) {
animation:xfade 24s 18s infinite;
-webkit-animation:xfade 24s 18s infinite;
}
figure:nth-child(2) {
animation:xfade 24s 12s infinite;
-webkit-animation:xfade 24s 12s infinite;
}
figure:nth-child(3) {
animation:xfade 24s 6s infinite;
-webkit-animation:xfade 24s 6s infinite;
}
figure:nth-child(4) {
animation:xfade 24s 0s infinite;
-webkit-animation:xfade 24s 0s infinite;
}

@keyframes xfade{
0%{
opacity:1;
}
25% {
opacity:1;
}
27%{
opacity:0;
}
98% {
opacity:0;
}
100% {
opacity:1;
}
}

@-webkit-keyframes xfade {
0%{
opacity:1;
}
25% {
opacity:1;
}
27%{
opacity:0;
}
98% {
opacity:0;
}
100% {
opacity:1;
}
}