.hoverfx-effect{
	display: inline-block;
	position: relative;
	overflow: hidden;
	zoom: 1;
	padding-top: 1px;
	padding-bottom: 1px;

    *display:inline;
	cursor: pointer;
}


.hoverfx-effect .initial-image{
    display: block;
}

.hoverfx-effect .overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    opacity: 0;
    display:none;
    margin-top:1px;
}

.hoverfx-effect.hover .overlay,
.hoverfx-effect.caption.hover .overlay,
.hoverfx-effect:hover .overlay,
.hoverfx-effect.caption:hover .overlay{
    opacity: 1;
}

.hoverfx-effect.caption .overlay{
    position: relative;
    width: 100%;
    height: auto;
    opacity: 1;
}


.hoverfx-effect.caption:hover .overlay:after{
    content:"";
}

.hoverfx-effect.caption.hover .initial-image,
.hoverfx-effect.caption:hover .initial-image{
    opacity: 1;
    display: block;

}


.hoverfx-effect .swap-inner, .hoverfx-effect .swap-inner-caption{
    display: none;
    padding-top:1px;                                                   
    padding-bottom:1px;                                                   
}


.hoverfx-effect .swap-title,
.hoverfx-effect .swap-subtitle,
.hoverfx-effect .swap-button{
	text-align: center;
}



.hoverfx-effect.caption .swap-inner{
    position:relative;

}

.hoverfx-effect.hoverfx-overlay .overlay:after, .hoverfx-effect.caption:hover .swap-inner:after {
    content:"";
}

.hoverfx-effect .swap-title{
	/*font-weight: 300;*/
	text-align: center;
}

.hoverfx-effect .swap-button a{
	cursor: pointer;
	;
	text-decoration: none !important;
}

.hoverfx-effect .swap-button a:hover{

}

.hoverfx-effect .swap-button a.button-2{
	display: inline-block;
	background: #327BEF;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-transition: border-color .218s 0;
	-moz-transition: border-color .218s 0;
	-o-transition: border-color .218s 0;
	transition: border-color .218s 0;
	/* [disabled]text-shadow: 1px 0px 0px #1a378e; */
	/* [disabled]border-color: #0066cc; */
	border-width: 1px;
	border-style: solid;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	color: #ffffff;
	font-weight: bold;

}
.hoverfx-effect .swap-button a.button-2:hover{
	background: #2D71EE;
	-webkit-box-shadow: 1px 1px rgba(255, 255, 255, 0.3);
	-moz-box-shadow: 1px 1px rgba(255, 255, 255, 0.3);
	box-shadow: 1px 1px rgba(255, 255, 255, 0.3);
	/* [disabled]text-shadow: 1px 1px 0px #001AA6; */
	/* [disabled]border-color: #291f93; */
}


.hoverfx-effect .swap-button a.button-4{
	display: inline-block;
	/* [disabled]background: rgb(182,214,68); */
	-webkit-border-radius: 22px;
	-moz-border-radius: 22px;
	border-radius: 18px;
	font-size: 14px;
	color: #ffffff;
	font-weight: bold;
	border-color: #ccc;
	border-bottom-style: solid;
	border-right-style: solid;
}


.hoverfx-effect .swap-button a.button-4:hover{
    background: rgb(108,162,60); 
    border-color: #000000;
    border-width: 0px;
    border-style: solid;
}

.hoverfx-effect .swap-button a.button-6{
	display: inline-block;
    background: rgb(159,220,34); 
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-shadow: 0px -1px 0px #709A16;
    padding: 10px 20px;
    border-color: #7BA819;
    border-width: 1px;
    border-style: solid;
    font-size: 14px;
    color: #ffffff;
    font-weight: bold;
}
.hoverfx-effect .swap-button a.button-6:hover{
    background: rgb(147, 204, 30); 
    -webkit-box-shadow: 0px 1px 0px 0px #A0CA4E inset;
    -moz-box-shadow: 0px 1px 0px 0px #A0CA4E inset;
    box-shadow: 0px 1px 0px 0px #A0CA4E inset;
    text-shadow: 0px -1px 0px #628813;
}

.hoverfx-effect .swap-button a.button-9{
	display: inline-block;
    border: 2px solid rgba(255, 255, 255, 0.80);
    background: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.hoverfx-effect .swap-button button.button-9:hover{
    border-bottom: 10px solid rgba(255, 255, 255, 0.80);
}

.hoverfx-effect .swap-button a.button-10{
	display: inline-block;
    color: #666666;
    background: rgb(255,255,255);
}

.hoverfx-effect .swap-button a.button-10:hover{
    color: #ffffff;
    background: rgb(69,72,77);
}


.hoverfx-effect .swap-icons {
    margin: 0 auto;
}
.hoverfx-effect .swap-icons img{
    text-align: center;
}



.hoverfx-effect .swap-subtitle{
    font-size: 14px;
}


.hoverfx-effect .swap-inner{
	position: absolute;
	top: 0;
	left: 0;
}

.clearfix{
    clear: both;
}


.hoverfx-effect .swap-inner{
    opacity: 0;
}

.caption.hoverfx-effect .swap-inner{
    opacity:1;
}

/* ----- Effects ----- */
.hoverfx-overlay.effect-1 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 200px, 0px);
    -moz-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 200px, 0px);
    -o-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 200px, 0px);
    -ms-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 200px, 0px);
    transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 200px, 0px);

}

.hoverfx-overlay.effect-2 .swap-inner{
    -webkit-transform: translate(-50%, 0px);
    -moz-transform: translate(-50%, 0px);
    -o-transform: translate(-50%, 0px);
    -ms-transform: translate(-50%, 0px);
    transform: translate(-50%, 0px);
}

.hoverfx-overlay.effect-3 .swap-inner{
    -webkit-transform: translate(0px, -50%);
    -moz-transform: translate(0px, -50%);
    -o-transform: translate(0px, -50%);
    -ms-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
}

.hoverfx-overlay.effect-4 .swap-inner{
    -webkit-transform: translate(0px, 50%);
    -moz-transform: translate(0px, 50%);
    -o-transform: translate(0px, 50%);
    -ms-transform: translate(0px, 50%);
    transform: translate(0px, 50%);
}

.hoverfx-overlay.effect-5 .swap-inner{
    -webkit-transform: translate(50%, 0px);
    -moz-transform: translate(50%, 0px);
    -o-transform: translate(50%, 0px);
    -ms-transform: translate(50%, 0px);
    transform: translate(50%, 0px);
}

.hoverfx-overlay.effect-6 .swap-inner{
    -webkit-transform: scale(0.3);
    -moz-transform: scale(0.3);
    -o-transform: scale(0.3);
    -ms-transform: scale(0.3);
    transform: scale(0.3);
}

.hoverfx-overlay.effect-7 .swap-inner{

    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -o-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
}

.hoverfx-overlay.effect-8 .swap-inner{
    -webkit-perspective: 1300px;
    -moz-perspective: 1300px;
    perspective: 1300px;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: rotateX(-70deg);
    -moz-transform: rotateX(-70deg);
    -ms-transform: rotateX(-70deg);
    transform: rotateX(-70deg);
}


.hoverfx-overlay.effect-9 .swap-inner{
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: rotateX(-60deg);
    -moz-transform: rotateX(-60deg);
    -ms-transform: rotateX(-60deg);
    transform: rotateX(-60deg);
    -webkit-transform-origin: 50% 0;
    -moz-transform-origin: 50% 0;
    transform-origin: 50% 0;
}

.hoverfx-overlay.effect-10 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0px, 50%, 0px);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0px, 50%, 0px);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0px, 50%, 0px);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0px, 50%, 0px);
    transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0px, 50%, 0px);

}

.hoverfx-overlay.effect-11 .swap-inner{

    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -o-transform: scale(0.1);
    -ms-transform: scale(0.1);
    transform: scale(0.1);

}

.hoverfx-overlay.effect-12 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0px, 0px) scale(.6);
    -moz-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0px, 0px) scale(.6);
    -o-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0px, 0px) scale(.6);
    -ms-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0px, 0px) scale(.6);
    transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0px, 0px) scale(.6);

}


.hoverfx-overlay.effect-13 .swap-inner{
    -webkit-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0px);
    -moz-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0px);
    -o-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0px);
    -ms-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0px);
    transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0px);
}

.hoverfx-overlay.effect-14 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0px) scale(1.9);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0px) scale(1.9);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0px) scale(1.9);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0px) scale(1.9);
    transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0px) scale(1.9);
}

.hoverfx-overlay.effect-15 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0px) scale(1.1);
    -moz-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0px) scale(1.1);
    -o-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0px) scale(1.1);
    -ms-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0px) scale(1.1);
    transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0px) scale(1.1);
}

.hoverfx-overlay.effect-16 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0px) scale(.1);
    -moz-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0px) scale(.1);
    -o-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0px) scale(.1);
    -ms-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0px) scale(.1);
    transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0px) scale(.1);
}

.hoverfx-overlay.effect-17 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(-60deg) rotateY(20deg) rotateZ(10deg) translate3d(20%, 50%, 70px) scale(.7);
    -moz-transform: perspective(500px) rotateX(-60deg) rotateY(20deg) rotateZ(10deg) translate3d(20%, 50%, 70px) scale(.7);
    -o-transform: perspective(500px) rotateX(-60deg) rotateY(20deg) rotateZ(10deg) translate3d(20%, 50%, 70px) scale(.7);
    -ms-transform: perspective(500px) rotateX(-60deg) rotateY(20deg) rotateZ(10deg) translate3d(20%, 50%, 70px) scale(.7);
    transform: perspective(500px) rotateX(-60deg) rotateY(20deg) rotateZ(10deg) translate3d(20%, 50%, 70px) scale(.7);
}

.hoverfx-overlay.effect-18 .swap-inner{
    -webkit-transform: rotateX(50deg) rotateY(20deg) rotateZ(170deg) ;
    -moz-transform: rotateX(50deg) rotateY(20deg) rotateZ(170deg) ;
    -o-transform: rotateX(50deg) rotateY(20deg) rotateZ(170deg) ;
    -ms-transform: rotateX(50deg) rotateY(20deg) rotateZ(170deg) ;
    transform: rotateX(50deg) rotateY(20deg) rotateZ(170deg) ;
}

.hoverfx-overlay.effect-19 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0px) scale(.7);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0px) scale(.7);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0px) scale(.7);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0px) scale(.7);
    transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0px) scale(.7);
}

.hoverfx-overlay.effect-20 .swap-inner{
    -webkit-transform: perspective(500px) scale(1.6) skew(80deg, 0deg);
    -moz-transform: perspective(500px) scale(1.6) skew(80deg, 0deg);
    -o-transform: perspective(500px) scale(1.6) skew(80deg, 0deg);
    -ms-transform: perspective(500px) scale(1.6) skew(80deg, 0deg);
    transform: perspective(500px) scale(1.6) skew(80deg, 0deg);

}

.hoverfx-overlay.effect-21 .swap-inner{
    -webkit-transform: perspective(500px)  skew(0deg, 80deg);
    -moz-transform: perspective(500px)  skew(0deg, 80deg);
    -o-transform: perspective(500px) skew(0deg, 80deg);
    -ms-transform: perspective(500px)  skew(0deg, 80deg);
    transform: perspective(500px) skew(0deg, 80deg);

}


.hoverfx-overlay.effect-22 .swap-inner{
    -webkit-transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0px, 0px) scale(2);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0px, 0px) scale(2);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0px, 0px) scale(2);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0px, 0px) scale(2);
    transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0px, 0px) scale(2);
}

.hoverfx-overlay.effect-23 .swap-inner{
    -webkit-transform: perspective(300px) rotateX(150deg) rotateY(0deg) rotateZ(0deg) scale(2);
    -moz-transform: perspective(300px) rotateX(150deg) rotateY(0deg) rotateZ(0deg) scale(2);
    -o-transform: perspective(300px) rotateX(150deg) rotateY(0deg) rotateZ(0deg) scale(2);
    -ms-transform: perspective(300px) rotateX(150deg) rotateY(0deg) rotateZ(0deg) scale(2);
    transform: perspective(300px) rotateX(150deg) rotateY(0deg) rotateZ(0deg) scale(2);
}

.hoverfx-effect.hover .swap-inner, .hoverfx-effect:hover .swap-inner {
    opacity: 1;
}

/*Reset*/
.hoverfx-overlay.hoverfx-effect.hover .swap-inner,
.hoverfx-overlay.hoverfx-effect:hover .swap-inner{
    -webkit-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 0px, 0px) scale(1) skew(0deg);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 0px, 0px) scale(1) skew(0deg);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 0px, 0px) scale(1) skew(0deg);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 0px, 0px) scale(1) skew(0deg);
    transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0px, 0px, 0px) scale(1) skew(0deg);
}
