.contentswap-effect {
    display: inline-block;
    position: relative;
    overflow: hidden;
    zoom:1;
    padding-top:1px;
    padding-bottom:1px;
    *display:inline;
    cursor: pointer;
    vertical-align: top;
}
.contentswap-effect .initial-image {
    display: block;
}
.contentswap-effect .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    opacity: 0;
    display:none;
    margin-top:1px;
}
.contentswap-effect.hover .overlay, .contentswap-effect.caption.hover .overlay, .contentswap-effect:hover .overlay, .contentswap-effect.caption:hover .overlay {
    opacity: 1;
}
.contentswap-effect.caption .overlay {
    position: relative;
    width: 100%;
    height: auto;
    opacity: 1;
}
.contentswap-effect.caption:hover .overlay:after {
    content:"";
}
.contentswap-effect.caption.hover .initial-image, .contentswap-effect.caption:hover .initial-image {
    opacity: 1;
    display: block;
}
.contentswap-effect .swap-inner, .contentswap-effect .swap-inner-caption {
    display: none;
    padding-top:1px;
    padding-bottom:1px;
}
.contentswap-effect .swap-title, .contentswap-effect .swap-subtitle, .contentswap-effect .swap-button {
    margin: 20px;
    text-align: center;
}
.contentswap-effect.caption .swap-inner {
    position:relative;
}
.contentswap-effect.contentswap-overlay .overlay:after, .contentswap-effect.caption:hover .swap-inner:after {
    content:"";
}
.contentswap-effect .swap-title {
    margin: 20px 0 20px 0;
    /*font-weight: 300;*/
    text-align: center;
}
.contentswap-effect .swap-button button {
    cursor: pointer;
    background: #605ca8;
    text-transform: uppercase;
    padding: 10px 20px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-decoration: none !important;
}
.contentswap-effect .swap-button button:hover {
    background: #403c78;
}
.contentswap-effect .swap-button button.button-2 {
    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;
    text-shadow: 1px 0px 0px #1a378e;
    border-color: #0066cc;
    border-width: 1px;
    border-style: solid;
    -moz-text-shadow: 1px 0px 0px #1a378e;
    -webkit-text-shadow: 1px 0px 0px #1a378e;
}
.contentswap-effect .swap-button button.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);
    text-shadow: 1px 1px 0px #001AA6;
    border-color: #291f93;
    -moz-text-shadow: 1px 1px 0px #001AA6;
    -webkit-text-shadow: 1px 1px 0px #001AA6;
}
.contentswap-effect .swap-button button.button-4 {
    background: rgb(182, 214, 68);
    -webkit-border-radius: 22px;
    -moz-border-radius: 22px;
    border-radius: 22px;
    border-color: rgb(182, 214, 68);
    border-bottom-style: solid;
    border-right-style: solid;
}
.contentswap-effect .swap-button button.button-4:hover {
    background: rgb(108, 162, 60);
    border-color: #000000;
    border-width: 0px;
    border-style: solid;
}
.contentswap-effect .swap-button button.button-6 {
    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;
    -moz-text-shadow: 0px -1px 0px #709A16;
    -webkit-text-shadow: 0px -1px 0px #709A16;
}
.contentswap-effect .swap-button button.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;
    -moz-text-shadow: 0px -1px 0px #628813;
    -webkit-text-shadow: 0px -1px 0px #628813;
}
.contentswap-effect .swap-button button.button-9 {
    border: 2px solid rgba(255, 255, 255, 0.80);
    background: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.contentswap-effect .swap-button button.button-9:hover {
    border-bottom: 10px solid rgba(255, 255, 255, 0.80);
}
.contentswap-effect .swap-button button.button-10 {
    color: #666666;
    background: rgb(255, 255, 255);
}
.contentswap-effect .swap-button button.button-10:hover {
    color: #ffffff;
    background: rgb(69, 72, 77);
}
.contentswap-effect .swap-icons {
    margin: 0 auto;
}
.contentswap-effect .swap-icons img {
    text-align: center;
}
.contentswap-effect .swap-inner {
    position: absolute;
    top:0;
    left:0;
    background: transparent;
}
.clearfix {
    clear: both;
}
.contentswap-effect .swap-inner {
    opacity: 0;
}
.caption.contentswap-effect .swap-inner {
    opacity:1;
}
/* ----- Effects ----- */
 .contentswap-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);
}
.contentswap-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);
}
.contentswap-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%);
}
.contentswap-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%);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
    -o-transform: rotateX(-70deg);
}
.contentswap-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;
    -o-transform: rotateX(-60deg);
    -ms-transform-origin: 50% 0;
    -o-transform-origin: 50% 0;
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-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);
}
.contentswap-effect.hover .swap-inner, .contentswap-effect:hover .swap-inner {
    opacity: 1;
}
/*Reset*/
 .contentswap-overlay.contentswap-effect.hover .swap-inner, .contentswap-overlay.contentswap-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);
}