.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;
    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 0 0 #1a378e;
    border-color: #06c;
    border-width: 1px;
    border-style: solid
}

.contentswap-effect .swap-button button.button-2:hover {
    background: #2D71EE;
    -webkit-box-shadow: 1px 1px rgb(255 255 255 / .3);
    -moz-box-shadow: 1px 1px rgb(255 255 255 / .3);
    box-shadow: 1px 1px rgb(255 255 255 / .3);
    text-shadow: 1px 1px 0 #001AA6;
    border-color: #291f93
}

.contentswap-effect .swap-button button.button-4 {
    background: #b6d644;
    -webkit-border-radius: 22px;
    -moz-border-radius: 22px;
    border-radius: 18px;
    border-color: #b6d644;
    border-bottom-style: solid;
    border-right-style: solid
}

.contentswap-effect .swap-button button.button-4:hover {
    background: #6ca23c;
    border-color: #000;
    border-width: 0;
    border-style: solid
}

.contentswap-effect .swap-button button.button-6 {
    background: #9fdc22;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-shadow: 0 -1px 0 #709A16;
    padding: 10px 20px;
    border-color: #7BA819;
    border-width: 1px;
    border-style: solid
}

.contentswap-effect .swap-button button.button-6:hover {
    background: #93cc1e;
    -webkit-box-shadow: 0 1px 0 0 #A0CA4E inset;
    -moz-box-shadow: 0 1px 0 0 #A0CA4E inset;
    box-shadow: 0 1px 0 0 #A0CA4E inset;
    text-shadow: 0 -1px 0 #628813
}

.contentswap-effect .swap-button button.button-9 {
    border: 2px solid rgb(255 255 255 / .8);
    background: #fff0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

.contentswap-effect .swap-button button.button-9:hover {
    border-bottom: 10px solid rgb(255 255 255 / .8)
}

.contentswap-effect .swap-button button.button-10 {
    color: #666;
    background: #fff
}

.contentswap-effect .swap-button button.button-10:hover {
    color: #fff;
    background: #45484d
}

.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: #fff0
}

.clearfix {
    clear: both
}

.contentswap-effect .swap-inner {
    opacity: 0
}

.caption.contentswap-effect .swap-inner {
    opacity: 1
}

.contentswap-overlay.effect-1 .swap-inner {
    -webkit-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 200px, 0);
    -moz-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 200px, 0);
    -o-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 200px, 0);
    -ms-transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 200px, 0);
    transform: perspective(500px) rotateX(70deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 200px, 0)
}

.contentswap-overlay.effect-2 .swap-inner {
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.contentswap-overlay.effect-3 .swap-inner {
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.contentswap-overlay.effect-4 .swap-inner {
    -webkit-transform: translate(0, 50%);
    -moz-transform: translate(0, 50%);
    -o-transform: translate(0, 50%);
    -ms-transform: translate(0, 50%);
    transform: translate(0, 50%)
}

.contentswap-overlay.effect-5 .swap-inner {
    -webkit-transform: translate(50%, 0);
    -moz-transform: translate(50%, 0);
    -o-transform: translate(50%, 0);
    -ms-transform: translate(50%, 0);
    transform: translate(50%, 0)
}

.contentswap-overlay.effect-6 .swap-inner {
    -webkit-transform: scale(.3);
    -moz-transform: scale(.3);
    -o-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.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)
}

.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
}

.contentswap-overlay.effect-10 .swap-inner {
    -webkit-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0, 50%, 0);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0, 50%, 0);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0, 50%, 0);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0, 50%, 0);
    transform: perspective(500px) rotateX(0deg) rotateY(140deg) rotateZ(0deg) translate3d(0, 50%, 0)
}

.contentswap-overlay.effect-11 .swap-inner {
    -webkit-transform: scale(.1);
    -moz-transform: scale(.1);
    -o-transform: scale(.1);
    -ms-transform: scale(.1);
    transform: scale(.1)
}

.contentswap-overlay.effect-12 .swap-inner {
    -webkit-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0, 0) scale(.6);
    -moz-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0, 0) scale(.6);
    -o-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0, 0) scale(.6);
    -ms-transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0, 0) scale(.6);
    transform: perspective(500px) rotateX(100deg) rotateY(100deg) rotateZ(0deg) translate3d(50%, 0, 0) scale(.6)
}

.contentswap-overlay.effect-13 .swap-inner {
    -webkit-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0);
    -moz-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0);
    -o-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0);
    -ms-transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0);
    transform: rotateX(0deg) rotateY(170deg) rotateZ(0deg) translate3d(0%, -80%, 0)
}

.contentswap-overlay.effect-14 .swap-inner {
    -webkit-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0) scale(1.9);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0) scale(1.9);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0) scale(1.9);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0) scale(1.9);
    transform: perspective(500px) rotateX(0deg) rotateY(100deg) rotateZ(-60deg) translate3d(50%, 50%, 0) scale(1.9)
}

.contentswap-overlay.effect-15 .swap-inner {
    -webkit-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0) scale(1.1);
    -moz-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0) scale(1.1);
    -o-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0) scale(1.1);
    -ms-transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0) scale(1.1);
    transform: perspective(500px) rotateX(20deg) rotateY(20deg) rotateZ(-60deg) translate3d(-50%, 50%, 0) scale(1.1)
}

.contentswap-overlay.effect-16 .swap-inner {
    -webkit-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0) scale(.1);
    -moz-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0) scale(.1);
    -o-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0) scale(.1);
    -ms-transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0) scale(.1);
    transform: perspective(500px) rotateX(-20deg) rotateY(20deg) rotateZ(60deg) translate3d(-20%, 50%, 0) 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%, 0) scale(.7);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0) scale(.7);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0) scale(.7);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0) scale(.7);
    transform: perspective(500px) rotateX(0deg) rotateY(-10deg) rotateZ(0deg) translate3d(50%, 50%, 0) 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, 0, 0) scale(2);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0, 0) scale(2);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0, 0) scale(2);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0, 0) scale(2);
    transform: perspective(500px) rotateX(0deg) rotateY(70deg) rotateZ(0deg) translate3d(-200px, 0, 0) 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
}

.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(0, 0, 0) scale(1) skew(0deg);
    -moz-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 0, 0) scale(1) skew(0deg);
    -o-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 0, 0) scale(1) skew(0deg);
    -ms-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 0, 0) scale(1) skew(0deg);
    transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate3d(0, 0, 0) scale(1) skew(0deg)
}