.leftRigthAniBtn:hover .fa {                                   
	animation-name: leftRigthAnimation;
	animation-duration:1.4s;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
}          
@keyframes leftRigthAnimation {
	0% {
		opacity: 1; transform: translateX(0px) scale(1);
	}
	25% {
		opacity: 0; transform:translateX(10px) scale(0.9);
	}
	50% {
		opacity: 0; transform:translateX(-10px) scale(0.9);
	}
	75% {
		opacity: 1; transform: translateX(0px) scale(1);
	}
	100% {
		opacity: 1; transform: translateX(0px) scale(1);
	}
}



.portBoxLinkUl li a::after {
	content: "" !important;    
}
.portBoxLinkUl li a::before {
	content: "\f105";
	font-family: 'FontAwesome';
	background-color: transparent;
	color: #000000;
	position: absolute;
	right: 30px;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	border-radius: 50%;
	font-size: 22px;
	top: calc(50% - 15px);
	z-index: 9;
}  
.portBoxLinkUl li a:hover:before 
{   animation-name: leftRigthAnimation;
	animation-duration: 1.4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;    
}      


.roundIconul li a .roundIconText:after {
	content: "" !important;  
}
.roundIconul li a .roundIconText::before {
	content: "\f105";
	font-family: 'FontAwesome';
	background-color: transparent;
	color: #000000;
	position: absolute;
	right: 28px;
	width: 42px;
	height: 42px;
	text-align: center;
	line-height: 42px;
	border-radius: 50%;
	font-size: 30px;
	top: calc(50% - 21px);
	z-index: 9;
} 
.roundIconul li a .roundIconText:hover:before 
{  animation-name: leftRigthAnimation;
	animation-duration: 1.4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;    
}




.rigthLeftAniBtn:hover .fa {                                   
	animation-name: rigthLeftAnimation;
	animation-duration:1.4s;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
}          
@keyframes rigthLeftAnimation {
	0% {
		opacity: 1; transform: translateX(0px) scale(1);
	}
	25% {
		opacity: 0; transform:translateX(-10px) scale(0.9);
	}
	50% {
		opacity: 0; transform:translateX(10px) scale(0.9);
	}
	75% {
		opacity: 1; transform: translateX(0px) scale(1);
	}
	100% {
		opacity: 1; transform: translateX(0px) scale(1);
	}
}



.slick-prev:after {
	content: "";
	font-family: 'FontAwesome';
	font-size: 24px;
	line-height: 42px;
	background: transparent;
	color: #ffffff;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}
.slick-prev:before {
	content: "\f104";
	font-family: 'FontAwesome';
	font-size: 24px;
	line-height: 42px;
	background: transparent;
	color: #ffffff;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
}
.slick-prev:hover:before 
{  animation-name: rigthLeftAnimation;
	animation-duration: 1.4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;    
}

.slick-next:after {
	content: "";
	font-family: 'FontAwesome';
	font-size: 24px;
	line-height: 42px;
	background: transparent;
	color: #ffffff;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}
.slick-next:before {
	content: "\f104";
	font-family: 'FontAwesome';
	font-size: 24px;
	line-height: 42px;
	background: transparent;
	color: #ffffff;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
}
.slick-next:hover:before 
{  animation-name: leftRigthAnimation;
	animation-duration: 1.4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;    
}


.btnEffect {
	display: inline-block;
	overflow: hidden;
	transform: translateZ(0);
	font-family: "Eina02";
	background-color: #e2dddd;
	color: #000000;
	/* font-size: 18px;
	line-height: normal; */
	text-align: center;
	letter-spacing: 0;
	/* border-radius: 35px; */
	transition-duration: 0.3s;
	position: relative;
	min-width: 180px;
	/* padding: 12px 15px; */
	text-decoration: none;
}
.btnEffectText {
	position: relative;
	z-index: 9;
}
.btnEffect:hover {
	color: #ffffff;
}
.btnEffect::after {
	content: "";
	border-radius: 50%;
	bottom: 0;
	left: 50%;
	transform: translateZ(0) translate(-50%, 50%) scale(0);
	transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
	will-change: transform;
	pointer-events: none;
	display: inline-block;
	position: absolute;
	background-color: #324cbd;
	color: #ffffff;
	width: 220px;
	height: 220px;
	text-align: center;
}
.btnEffect:hover:after {
	transform: translateZ(0) translate(-50%, 50%) scale(1);
	z-index: 1;
	background-color: #324cbd;
}


.pptBtnEffect {
	display: inline-block;
	overflow: hidden;
	transform: translateZ(0);
	font-family: "Eina02";
	background-color: #e2dddd;
	color: #000000;
	/* font-size: 18px;
	line-height: normal; */
	text-align: center;
	letter-spacing: 0;
	/* border-radius: 35px; */
	transition-duration: 0.3s;
	position: relative;
	min-width: 180px;
	/* padding: 12px 15px; */
	text-decoration: none;
}
.pptBtnEffect:hover {
	color: #ffffff;
}
.pptBtnEffect::after {
	content: "";
	border-radius: 50%;
	bottom: 0;
	left: 50%;
	transform: translateZ(0) translate(-50%, 50%) scale(0);
	transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
	will-change: transform;
	pointer-events: none;
	display: inline-block;
	position: absolute;
	background-color: #324cbd;
	color: #ffffff;
	width: 220px;
	height: 220px;
	text-align: center;
}
.pptBtnEffect:hover:after {
	transform: translateZ(0) translate(-50%, 50%) scale(1);
	z-index: 1;
	background-color: #324cbd;
}

@keyframes topBottomAnimation {
	0% {
		opacity: 1; transform: translateY(0px) scale(1);
	}
	25% {
		opacity: 0; transform:translateY(10px) scale(0.9);
	}
	50% {
		opacity: 0; transform:translateY(-10px) scale(0.9);
	}
	75% {
		opacity: 1; transform: translateY(0px) scale(1);
	}
	100% {
		opacity: 1; transform: translateY(0px) scale(1);
	}
}


.animateLineAnimation { 
	animation: animateLine 3s linear ; 
} 

@keyframes animateLine { 
	0% {
		width: 0;
	}
	25% {
		width: 25%;
	}
	50% {
		width: 50%;
	}
	75% {
		width: 75%;
	}
	100% {
		width: 100%;
	}
} 

.animateBorderAnimation
{	animation: animateBorder 3s linear ; 
}
@keyframes animateBorder { 
	0% {
		width: 0;
	}
	25% {
		width: 25%;
	}
	50% {
		width: 50%;
	}
	75% {
		width: 75%;
	}
	100% {
		width: 100%;
	}
}

.upComEvenListCol:hover .animateImgAnimation
{	animation: animateImg 1s linear ; 
}
@keyframes animateImg { 
	0% {
		width: 0;
	}
	25% {
		width: 25%;
	}
	50% {
		width: 50%;
	}
	75% {
		width: 75%;
	}
	100% {
		width: 100%;
	}
}
.upComEvenListCol:hover .upComEvenImgCon
{	animation: hightFull 2s linear ; 
}
@keyframes hightFull { 
	0% {
		height: 0;
	}
	25% {
		height: 25%;
	}
	50% {
		height: 50%;
	}
	75% {
		height: 75%;
	}
	100% {
		height: 100%;
	}
}