/*-------ANIMATION IMAGE-------*/

.top-page ul li ul.image {
list-style: none;
display: block;
padding: 0;
margin: 0;
}

.top-page  ul li ul.image li {
display: block;
}

.top-page ul li ul.image li img.base {
width: 100%;
}


.top-page ul li ul.image li div {
position: absolute;
top: 0;
left: 0;
width: 100%
overflow:hidden;
z-index: 90;
}


.top-page ul li ul.image li div p {
position: absolute;
top: 20px;
left: 20px;
z-index: 91;
font-size: 22px;
color: #0033CC;
letter-spacing: 2px;
text-shadow: 1px 1px 5px #555;
}

.top-page ul li ul.image li div p span {
display: inline-block; position:relative; left: 0; font-size: 22px; line-height:18px; letter-spacing: 0; padding:0;margin: 0; margin-left: 20px;
margin-top:-30px;
}

.top-page  ul li ul.image li div img {
width: 100%;

}

.fade1 {
animation: fadeIn1 25s ease 0s infinite normal;
}
@keyframes fadeIn1 {
    0%,100% { opacity:1;}
}
.fade2 {
animation: fadeIn2 25s ease 0s infinite normal;
}

@keyframes fadeIn2 {
    0%,20% { opacity:0;}
    35%,51% { opacity:1;} 
    70%,100% { opacity:0;}
}

.fade3 {
animation: fadeIn3 25s ease 0s infinite normal;
}
@keyframes fadeIn3 {
    0%,45% { opacity:0;}
    60%,85% { opacity:1;}
    100% { opacity:0;}
}

/*------Layer Fade-------*/

.follow {
	animation: fadeIn 2s ease 0s 1 normal;
	-webkit-animation: fadeIn 2s ease 0s 1 normal;
}

#abc {
	animation: fadeIn 2s ease 0s 1 normal;
	-webkit-animation: fadeIn 2s ease 0s 1 normal;
}


@keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}