 .img-frame{
 	position: relative;
 	width: 70%;
 	height: 500px;
 	overflow: hidden;
 	margin: 0 auto;
 }
 	.msg{
		font-size: 50px;
		color: #fff;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		}
	.msg-01, .msg-02, .msg-03, .msg-04, .msg-05{
		text-shadow: 2px 2px 3ps #000, -1px -1ps 3ps #000;
	}		
 
  @media screen and (max-width: 767px){
  	.img-frame{
  		width: 100%;
  		height: 600px;
  }}
  
  .img-01, .img-02, .img-03, .img-04, .img-05{
  	position: absolute;
  	top: 0;
  	left: 0;
  	width: 100%;
  	height: 100%;
  	background-size: cover;
  	background-repeat: no-repeat;
  }
  .img-01{
  	background-image: url(../IMGP01.JPG);
  	animation: slide-animation-01 20s infinite;
  	}
  	
  .img-02{
  	background-image: url(../IMGP02.JPG);
  	animation: slide-animation-02 20s infinite;
  	}
  	
   .img-03{
  	background-image: url(../IMGP03.JPG);
  	animation: slide-animation-03 20s infinite;
  	}		
  
    .img-04{
  	background-image: url(../IMGP04.JPG);
  	animation: slide-animation-04 20s infinite;  	
  	}			
 
  .img-05{
  	background-image: url(../IMGP05.JPG);
  	animation: slide-animation-05 20s infinite;  	
  	}		
 
 @keyframes slide-animation-01 {
    0% {opacity: 1; transform: scale(1.0);}
  10% {opacity: 1;}
  20% {opacity: 0; transform: scale(1.15);}
  90% {opacity: 0}
100% {opacity: 1; transform: scale(1.0);}
}
@keyframes slide-animation-02 {
    0% {opacity: 0;}
  10% {opacity: 0; transform: scale(1.1);}
  20% {opacity: 1;}
  30% {opacity: 1;}
  40% {opacity: 0; transform: scale(1.0);}
100% {opacity: 0;}
}
@keyframes slide-animation-03 {
    0% {opacity: 0;}
  30% {opacity: 0;  transform: scale(1.0);}
  40% {opacity: 1;}
  50% {opacity: 1;}
  60% {opacity; 0; transform: scale(1.15);}
100% {opacity: 0;}
}
  
	
  	@keyframes slide-animation-04 {
  	  0% {opacity: 0; transform: scale(1.0);}
  	50% {opacity: 0;transform: scale(1.0);}
  	60% {opacity: 1;}
  	70% {opacity: 1;}
  	80% {opacity: 0; transform: scale(1.15);}
	100% {opacity:0;}
	}
	
		
	@keyframes slide-animation-05 {
  	  0% {opacity: 0; transform: scale(1.0);}
  	  70% {opacity: 0; transform: scale(1.0);}
  	80% {opacity: 1;}
  	90% {opacity: 1;}
	100% {opacity: 0; transform: scale(1.15);}
	
	@keyframes slide-animation-06 {
  	  0% {opacity: 0; transform: scale(1.0);}
  	75% {opacity: 1;}
  	85% {opacity: 1; transform: scale(1.15);}
 	100% {opacity: 0; transform: scale(1.0);}
	}
	@keyframes slide-animation-07 {
  	  0% {opacity: 0; transform: scale(1.0);}
  	90% {opacity: 1;}
	100% {opacity: 1; transform: scale(1.15);}
	}
	
